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"); 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/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, 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 ( 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/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); 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} - + ); };