From bdd4be5751a99bded0c9a3b31993616418b80485 Mon Sep 17 00:00:00 2001 From: Oleg Isonen Date: Fri, 15 Nov 2024 16:57:58 +0000 Subject: [PATCH 1/7] test From fef72cabc48d72c43579f1ddcddaafc12c7187e8 Mon Sep 17 00:00:00 2001 From: Oleg Isonen Date: Fri, 15 Nov 2024 18:22:44 +0000 Subject: [PATCH 2/7] new env From 260aff7197d4ee5b9f72c64ab11e5ee45289f6a5 Mon Sep 17 00:00:00 2001 From: istarkov Date: Fri, 15 Nov 2024 19:02:03 +0000 Subject: [PATCH 3/7] Fix mode=edit --- apps/builder/app/shared/pages/use-switch-page.ts | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/apps/builder/app/shared/pages/use-switch-page.ts b/apps/builder/app/shared/pages/use-switch-page.ts index c9f3b46160d1..87cda128c7d8 100644 --- a/apps/builder/app/shared/pages/use-switch-page.ts +++ b/apps/builder/app/shared/pages/use-switch-page.ts @@ -12,7 +12,6 @@ import { } from "~/shared/nano-states"; import { builderPath } from "~/shared/router-utils"; import { $selectedPage, selectPage } from "../awareness"; -import invariant from "tiny-invariant"; const setPageStateFromUrl = () => { const searchParams = new URLSearchParams(window.location.search); @@ -22,13 +21,12 @@ const setPageStateFromUrl = () => { } const pageId = searchParams.get("pageId") ?? pages.homePage.id; - const mode = searchParams.get("mode"); + let mode = searchParams.get("mode"); // Check in case of BuilderMode rename - invariant( - mode === null || isBuilderMode(mode), - `Invalid search param mode: ${mode}` - ); + if (!isBuilderMode(mode)) { + mode = null; + } setBuilderMode(mode); From 7563d0ec33296bd35442f6958497fb3a97aff1be Mon Sep 17 00:00:00 2001 From: Bogdan Chadkin Date: Sat, 16 Nov 2024 11:10:41 +0700 Subject: [PATCH 4/7] fix: stop failing when retrieve mdn url for css variables Fixes https://github.com/webstudio-is/webstudio/issues/4431 --- .../builder/app/builder/features/style-panel/shared/configs.ts | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/apps/builder/app/builder/features/style-panel/shared/configs.ts b/apps/builder/app/builder/features/style-panel/shared/configs.ts index 32eea4ba36c5..c0f8acd143f4 100644 --- a/apps/builder/app/builder/features/style-panel/shared/configs.ts +++ b/apps/builder/app/builder/features/style-panel/shared/configs.ts @@ -54,7 +54,8 @@ export const styleConfigByName = (propertyName: StyleProperty): StyleConfig => { const keywords = keywordValues[property] || []; const label = humanizeString(property); - const propertyData = properties[property]; + // property data does not exist for css custom properties + const propertyData = properties[property] ?? {}; const result = { label, From a1ceb3e6c66464d21521e5e3c604660e3613c679 Mon Sep 17 00:00:00 2001 From: istarkov Date: Mon, 18 Nov 2024 09:08:55 +0000 Subject: [PATCH 5/7] Tooltips Fix --- .../project-settings/section-marketplace.tsx | 24 +++++----- .../app/builder/shared/binding-popover.tsx | 2 + .../design-system/src/components/tooltip.tsx | 47 +++++++++++++------ 3 files changed, 46 insertions(+), 27 deletions(-) diff --git a/apps/builder/app/builder/features/project-settings/section-marketplace.tsx b/apps/builder/app/builder/features/project-settings/section-marketplace.tsx index bf36835c6438..46a8f48bf9cd 100644 --- a/apps/builder/app/builder/features/project-settings/section-marketplace.tsx +++ b/apps/builder/app/builder/features/project-settings/section-marketplace.tsx @@ -213,8 +213,8 @@ export const SectionMarketplace = () => { - - + + { loader={imageLoader} /> - - - - The optimal dimensions in marketplace are 600x315 px or larger - with a 1.91:1 aspect ratio. - - - - + + + The optimal dimensions in marketplace are 600x315 px or larger + with a 1.91:1 aspect ratio. + + + + + - + diff --git a/apps/builder/app/builder/shared/binding-popover.tsx b/apps/builder/app/builder/shared/binding-popover.tsx index c40b8d723f10..048b7443cb1c 100644 --- a/apps/builder/app/builder/shared/binding-popover.tsx +++ b/apps/builder/app/builder/shared/binding-popover.tsx @@ -271,6 +271,8 @@ const BindingButton = forwardRef< left: 0, boxSizing: "border-box", padding: 2, + // Because of the InputErrorsTooltip, we need to set zIndex to 1 (as InputErrorsTooltip needs an additional position relative wrapper) + zIndex: 1, transform: "translate(-50%, -50%) scale(1)", transition: "transform 60ms, opacity 0ms 60ms", // https://easings.net/#easeInOutSine diff --git a/packages/design-system/src/components/tooltip.tsx b/packages/design-system/src/components/tooltip.tsx index 4d6652d542ea..8a1e539adb74 100644 --- a/packages/design-system/src/components/tooltip.tsx +++ b/packages/design-system/src/components/tooltip.tsx @@ -245,25 +245,42 @@ export const InputErrorsTooltip = ({ // Wrap the error tooltip with its own provider to avoid logic intersection with ordinary tooltips. // This is especially important for hover delays. // Here we ensure that hovering over the tooltip trigger after any input will not show the tooltip immediately. + // -- + // Additionally, we can't wrap the underlying Input with Tooltip because we are not rendering Tooltips in case of no errors. + // This causes a full re-render of the Input and loss of focus. + // Because of that, we are wrapping the Tooltip with the relative Box component and providing an invisible trigger for the Tooltip. return ( - + + + + {children} - + ); }; From 26715b585a24cf6867da6cbfd47ebc1d97f746d3 Mon Sep 17 00:00:00 2001 From: istarkov Date: Fri, 22 Nov 2024 01:42:17 +0000 Subject: [PATCH 6/7] Fix download --- apps/builder/app/builder/features/topbar/publish.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/apps/builder/app/builder/features/topbar/publish.tsx b/apps/builder/app/builder/features/topbar/publish.tsx index 4cef25ca1230..1e1b8994bf44 100644 --- a/apps/builder/app/builder/features/topbar/publish.tsx +++ b/apps/builder/app/builder/features/topbar/publish.tsx @@ -361,7 +361,7 @@ const getStaticPublishStatusAndText = ({ publishStatus, }: { updatedAt: string; - publishStatus: string; + publishStatus: "PENDING" | "FAILED" | "PUBLISHED"; }) => { let status = publishStatus; @@ -411,8 +411,7 @@ const PublishStatic = ({ const [isPending, setIsPendingOptimistic] = useOptimistic(false); - const isPublishInProgress = - project.latestStaticBuild?.publishStatus === "PENDING" || isPending; + const isPublishInProgress = status === "PENDING" || isPending; return ( From 30b0214fe142c5a332ca63c8cf1dc37e9e405d79 Mon Sep 17 00:00:00 2001 From: Bogdan Chadkin Date: Thu, 28 Nov 2024 03:46:19 +0700 Subject: [PATCH 7/7] fix: stop rendering inherited styles in css preview (#4478) Huge amount of css variables adds something like 8k of dom elements to highlighted css preview. Here as fast fix killed inherited styles so at least only root will lag and everything else will not get performance hit. --- apps/builder/app/builder/features/navigator/css-preview.tsx | 4 ---- 1 file changed, 4 deletions(-) diff --git a/apps/builder/app/builder/features/navigator/css-preview.tsx b/apps/builder/app/builder/features/navigator/css-preview.tsx index 18ab928af5b4..45ff485268fd 100644 --- a/apps/builder/app/builder/features/navigator/css-preview.tsx +++ b/apps/builder/app/builder/features/navigator/css-preview.tsx @@ -32,7 +32,6 @@ const getCssText = ( instanceId: string ) => { const sourceStyles: StyleMap = new Map(); - const inheritedStyles: StyleMap = new Map(); const cascadedStyles: StyleMap = new Map(); const presetStyles: StyleMap = new Map(); @@ -55,8 +54,6 @@ const getCssText = ( if (group) { if (styleDecl.source.instanceId === instanceId) { group.set(property, styleDecl.cascadedValue); - } else { - inheritedStyles.set(property, styleDecl.cascadedValue); } } } @@ -73,7 +70,6 @@ const getCssText = ( add("Style Sources", sourceStyles); add("Cascaded", cascadedStyles); - add("Inherited", inheritedStyles); add("Preset", presetStyles); return result.join("\n");