@riverbankcms/sdk 0.81.0 → 0.84.0

package/dist/{chunk-3PTVPAT4.mjs → chunk-HFMGVJCE.mjs}

@@ -1,9 +1,9 @@
 "use client";
-import { useOptionalPreviewLayout, PreviewQueryProvider } from './chunk-4T5JIPWY.mjs';
-import { PreviewBlockCustomizeSelectionProvider, resolveSiteStyleAccess, resolvePreviewDashboardSetupHandoff, buildPreviewDashboardSetupUrl, resolvePreviewSetupBannerModel, usePreviewBlockCustomizeSelectionOptional, useBlockCustomizeControls, MAX_CUSTOMIZE_POPOVER_ROWS, MAX_QUICK_MANIFEST_FIELDS, sanitizeDashboardPath } from './chunk-3QWQ2MUQ.mjs';
-import { resolvePreviewChromeSurface, getPreviewSidebarTab, onPreviewSidebarOpenRequest, getPreviewChromeSurfaceDataProps, PREVIEW_CHROME_THEME_CLASS_NAME, setPreviewSidebarTab, PreviewPageDesignEditorStateProvider, usePreviewPageDesignEditorState } from './chunk-3VT7LZY2.mjs';
-import { clientComponentRegistry, deriveLaunchReadiness, DEFAULT_LAUNCH_READINESS_INPUT, useEditorUiStore, PreviewThemeOverlayProvider, PreviewDesignCoordinatorProvider, SiteChromeCustomizeProvider, ResizableSplitPane, BlockApiProvider, EditorProvider, PreviewDesignHistoryOrderProvider, MediaEditorProvider, useEditorUiStoreInstance, useEditor, createRoutingHelpers, createSnapshotFromPageRecord, EntryControllerProvider, useEntryEditorController, surfaceResolutionContextFromTheme, unsafeAsEditorBlockId, EditableBlockProvider, asDesignBlockId, PageRenderer, usePreviewThemeOverlay, planSiteDocument, ThemeScope, FixedBottomSurface, Button, sectionTransitionVariantForBoundaryOptionId, sectionTransitionFamilyForBoundaryOptionId, sectionTransitionFamilies, X, defaultSectionTransitionVariantForFamily, RotateCcw, parseBackgroundOverrideFromContent, rankBackgroundImagePoolItems, imagePoolForOverride, resolveBackgroundCapability, enabledBackgroundModes, FormRenderer, stableSerialize, prefetchBlockData, isSupportedLoaderEndpoint, PreviewRichTextEditor, RichText, PreviewTextEditor, Text, buildThemeRuntime, renderBlock, siteHeaderManifest, siteFooterManifest, SiteDocumentLayout, SITE_CHROME_CLASS_NAMES, Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter, buildEditorModelRuntimeFieldsByBlockId, applyCompiledRuntimeFieldsToContent, assertNever2, getBlockDefinition, systemCustomizeFacetDefinitionsForBlock, systemCustomizeFacetAppliesToLayoutVariant, systemCustomizeFacetCurrentValue, systemCustomizeFacetLabelForValue, backgroundColorTokens, ChevronLeft, ChevronRight, createMicrobatcher, unwrapResponse, normalizePublicApiLoaderParams, visibleHeaderClearancePx, LINKED_CONTENT_ENTRY_META_KEY, unsafeAsLinkedContentEntryId, useMediaEditorOptional, Image, defaultBackgroundOverrideForMode, decodePublicProductCategorySelectorQuery, EDITABLE_SURFACE_FORWARDING_PROP, useSiteChromeCustomizeOptional, assertNever, SITE_CHROME_VISIBLE_HEADER_SELECTOR, GRADIENT_PRESETS, resolveImageUrlWithContext, gradientToCss, Upload, MediaEditor, SECTION_BACKGROUND_MIN_SOURCE_WIDTH, SECTION_BACKGROUND_MIN_SOURCE_HEIGHT, parseMediaAssetId, planBackgroundOverride, planBackgroundTransition, systemCustomizeFacetNextValue } from './chunk-WUHKQBB6.mjs';
-import { API_ENDPOINTS, createBearerAPIClient, isPreviewRuntimeSessionEditable, DEFAULT_SURFACE_ID, initPreviewAuth, usePreviewAuth, usePreviewAuthFetch, markPreviewAuthExpired, usePreviewToken } from './chunk-E3NZYEKF.mjs';
+import { useOptionalPreviewLayout, PreviewQueryProvider } from './chunk-3LXFQS7T.mjs';
+import { PreviewBlockCustomizeSelectionProvider, resolveSiteStyleAccess, resolvePreviewDashboardSetupHandoff, buildPreviewDashboardSetupUrl, resolvePreviewSetupBannerModel, usePreviewBlockCustomizeSelectionOptional, useBlockCustomizeControls, MAX_CUSTOMIZE_POPOVER_ROWS, MAX_QUICK_MANIFEST_FIELDS, OfferingsPreviewWidgetProvider, previewWidgetOverrides, sanitizeDashboardPath } from './chunk-5E33VO6J.mjs';
+import { resolvePreviewChromeSurface, getPreviewSidebarTab, onPreviewSidebarOpenRequest, getPreviewChromeSurfaceDataProps, PREVIEW_CHROME_THEME_CLASS_NAME, setPreviewSidebarTab, PreviewPageDesignEditorStateProvider, usePreviewPageDesignEditorState } from './chunk-6X2OVO3S.mjs';
+import { clientComponentRegistry, deriveLaunchReadiness, DEFAULT_LAUNCH_READINESS_INPUT, useEditorUiStore, PreviewThemeOverlayProvider, PreviewDesignCoordinatorProvider, SiteChromeCustomizeProvider, ResizableSplitPane, BlockApiProvider, EditorProvider, PreviewDesignHistoryOrderProvider, MediaEditorProvider, useEditorUiStoreInstance, useEditor, createRoutingHelpers, createSnapshotFromPageRecord, EntryControllerProvider, useEntryEditorController, surfaceResolutionContextFromTheme, designRuntimeRulesForTheme, unsafeAsEditorBlockId, EditableBlockProvider, asDesignBlockId, PageRenderer, usePreviewThemeOverlay, planSiteDocument, ThemeScope, FixedBottomSurface, Button, unsafeAsLinkedContentEntryId, sectionTransitionVariantForBoundaryOptionId, sectionTransitionFamilyForBoundaryOptionId, sectionTransitionFamilies, X, defaultSectionTransitionVariantForFamily, RotateCcw, parseBackgroundOverrideFromContent, rankBackgroundImagePoolItems, imagePoolForOverride, resolveBackgroundCapability, enabledBackgroundModes, canCycleBackgroundOverrideValue, FormRenderer, stableSerialize, prefetchBlockData, isSupportedLoaderEndpoint, PreviewRichTextEditor, RichText, PreviewTextEditor, Text, buildThemeRuntime, renderBlock, siteHeaderManifest, siteFooterManifest, SiteDocumentLayout, SITE_CHROME_CLASS_NAMES, Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter, buildEditorModelRuntimeFieldsByBlockId, applyCompiledRuntimeFieldsToContent, assertNever2, getBlockDefinition, systemCustomizeFacetDefinitionsForBlock, systemCustomizeFacetAppliesToLayoutVariant, systemCustomizeFacetCurrentValue, systemCustomizeFacetLabelForValue, backgroundColorTokens, ChevronLeft, ChevronRight, createMicrobatcher, unwrapResponse, normalizePublicApiLoaderParams, visibleHeaderClearancePx, LINKED_CONTENT_ENTRY_META_KEY, useMediaEditorOptional, Image, defaultBackgroundOverrideForMode, decodePublicProductCategorySelectorQuery, EDITABLE_SURFACE_FORWARDING_PROP, useSiteChromeCustomizeOptional, assertNever, SITE_CHROME_VISIBLE_HEADER_SELECTOR, getLinkedContentEntryMeta, GRADIENT_PRESETS, resolveImageUrlWithContext, gradientToCss, Upload, MediaEditor, SECTION_BACKGROUND_MIN_SOURCE_WIDTH, SECTION_BACKGROUND_MIN_SOURCE_HEIGHT, parseMediaAssetId, formatSiteChromeBackgroundTokenLabel, planBackgroundOverride, planBackgroundTransition, systemCustomizeFacetNextValue } from './chunk-MSHZO4SL.mjs';
+import { API_ENDPOINTS, createBearerAPIClient, isPreviewRuntimeSessionEditable, DEFAULT_SURFACE_ID, initPreviewAuth, usePreviewAuth, usePreviewAuthFetch, markPreviewAuthExpired, usePreviewToken } from './chunk-LBBPD2IW.mjs';
 import React10, { createContext, useMemo, useState, useEffect, useRef, useCallback, useId, useReducer, Children, isValidElement, Fragment as Fragment$1, cloneElement, useContext } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { createPortal } from 'react-dom';
@@ -203,13 +203,14 @@ function cloneRecord(value) {
 }
 
 // ../preview-next/src/client/blocks/previewProjection/runtimeContentDecoration.ts
-function runtimeContentDecorationProjectionFromEditorModel(editorModel, surfaceResolutionContext) {
+function runtimeContentDecorationProjectionFromEditorModel(editorModel, surfaceResolutionContext, designRules) {
   return {
     kind: "runtime-content-decoration",
     source: "page-design",
     fieldsByBlockId: buildEditorModelRuntimeFieldsByBlockId({
       editorModel,
-      surfaceResolutionContext
+      surfaceResolutionContext,
+      designRules
     })
   };
 }
@@ -289,15 +290,22 @@ function overlayValue(value, overlays) {
   if (meta) {
     const overlay = overlays.get(unsafeAsLinkedContentEntryId(meta.entryId));
     if (overlay) {
-      const title = resolveOverlayTitle(overlay.content, meta);
+      const displayProjections = resolveOverlayDisplayProjections(overlay.content, meta);
+      const titleProjection = resolveOverlayTitleProjection({
+        currentValue: value,
+        content: overlay.content,
+        meta,
+        displayProjections
+      });
       return {
         ...value,
-        title,
+        ...displayProjections,
+        ...titleProjection ? { title: titleProjection } : {},
         content: overlay.content,
         optimisticHash: overlay.optimisticHash,
         [LINKED_CONTENT_ENTRY_META_KEY]: {
           ...meta,
-          title,
+          ...titleProjection ? { title: titleProjection } : {},
           optimisticHash: overlay.optimisticHash
         }
       };
@@ -312,6 +320,27 @@ function overlayValue(value, overlays) {
   }
   return changed ? next : value;
 }
+function resolveOverlayDisplayProjections(content, meta) {
+  const projections = {};
+  for (const source of meta.fieldSources) {
+    if (source.kind !== "content-field") continue;
+    if (source.displayPath.startsWith("content.")) continue;
+    if (source.displayPath.includes(".")) continue;
+    if (!(source.fieldPath in content)) continue;
+    projections[source.displayPath] = content[source.fieldPath];
+  }
+  return projections;
+}
+function resolveOverlayTitleProjection(input) {
+  const projectedTitle = input.displayProjections.title;
+  if (typeof projectedTitle === "string") return projectedTitle;
+  const titleSource = input.meta.fieldSources.find((source) => source.displayPath === "title");
+  if (titleSource?.kind === "read-only") {
+    const currentTitle = input.currentValue.title;
+    return typeof currentTitle === "string" ? currentTitle : input.meta.title;
+  }
+  return resolveOverlayTitle(input.content, input.meta);
+}
 function resolveOverlayTitle(content, meta) {
   const titleField = meta.contentType.titleField;
   if (titleField) {
@@ -323,8 +352,7 @@ function resolveOverlayTitle(content, meta) {
   return meta.title;
 }
 function parseLinkedEntryMeta(value) {
-  if (!isRecord3(value)) return null;
-  return value.kind === "linked-content-entry" && typeof value.entryId === "string" ? value : null;
+  return getLinkedContentEntryMeta({ [LINKED_CONTENT_ENTRY_META_KEY]: value });
 }
 function isRecord3(value) {
   return typeof value === "object" && value !== null && !Array.isArray(value);
@@ -463,16 +491,39 @@ function draftSnapshotMap(snapshots) {
 
 // ../preview-next/src/client/preview/linkedEntryEditEvents.ts
 var LINKED_ENTRY_EDIT_EVENT = "riverbank:preview:linked-entry-edit";
+var LINKED_ENTRY_FIELD_FOCUS_EVENT = "riverbank:preview:linked-entry-field-focus";
+var BLOCK_FIELD_FOCUS_EVENT = "riverbank:preview:block-field-focus";
 function dispatchLinkedEntryEditEvent(target) {
   window.dispatchEvent(new CustomEvent(LINKED_ENTRY_EDIT_EVENT, {
     detail: target
   }));
 }
+function dispatchLinkedEntryFieldFocusEvent(binding) {
+  window.dispatchEvent(new CustomEvent(LINKED_ENTRY_FIELD_FOCUS_EVENT, {
+    detail: binding
+  }));
+}
+function dispatchBlockFieldFocusEvent(target) {
+  window.dispatchEvent(new CustomEvent(BLOCK_FIELD_FOCUS_EVENT, {
+    detail: target
+  }));
+}
 function isLinkedEntryEditEvent(event) {
   if (!(event instanceof CustomEvent)) return false;
   const detail = event.detail;
   return Boolean(detail) && typeof detail === "object" && detail.kind === "linked-content-entry";
 }
+function isLinkedEntryFieldFocusEvent(event) {
+  if (!(event instanceof CustomEvent)) return false;
+  const detail = event.detail;
+  const write = detail?.write;
+  return Boolean(detail) && typeof detail === "object" && detail.kind === "linked-entry-field" && Boolean(detail.target) && Boolean(write) && typeof write === "object" && typeof write.fieldPath === "string";
+}
+function isBlockFieldFocusEvent(event) {
+  if (!(event instanceof CustomEvent)) return false;
+  const detail = event.detail;
+  return Boolean(detail) && typeof detail === "object" && detail.kind === "block-field" && typeof detail.blockId === "string" && typeof detail.fieldPath === "string";
+}
 function requireClientRegistryComponent(key) {
   const component = clientComponentRegistry[key];
   if (!component) {
@@ -481,19 +532,48 @@ function requireClientRegistryComponent(key) {
   return component;
 }
 var ButtonComponent = requireClientRegistryComponent("button");
-var TextWithEditor = ({ value, children, path, ...rest }) => {
+function dispatchBlockFieldFocusEventFromPath(path) {
+  const match = path.match(/^blocks\.([^.]+)\.(.+)$/);
+  if (!match?.[1] || !match[2]) return;
+  dispatchBlockFieldFocusEvent({
+    kind: "block-field",
+    blockId: match[1],
+    fieldPath: match[2]
+  });
+}
+var TextWithEditor = ({ value, children, path, linkedEntryField, ...rest }) => {
   const raw = value ?? children;
   const content = typeof raw === "string" || typeof raw === "number" ? raw : "";
   const { isEditingMode } = useEditor();
   if (isEditingMode) {
-    return path ? /* @__PURE__ */ jsx(PreviewTextEditor, { ...rest, path, children: content }) : /* @__PURE__ */ jsx(Text, { ...rest, children: content });
+    return path || linkedEntryField ? /* @__PURE__ */ jsx(
+      PreviewTextEditor,
+      {
+        ...rest,
+        path,
+        linkedEntryField,
+        onLinkedEntryFieldFocus: dispatchLinkedEntryFieldFocusEvent,
+        onBlockFieldFocus: dispatchBlockFieldFocusEventFromPath,
+        children: content
+      }
+    ) : /* @__PURE__ */ jsx(Text, { ...rest, children: content });
   }
   return /* @__PURE__ */ jsx(Text, { ...rest, path, children: content });
 };
-var RichTextWithEditor = ({ value, path, ...rest }) => {
+var RichTextWithEditor = ({ value, path, linkedEntryField, ...rest }) => {
   const { isEditingMode } = useEditor();
-  if (isEditingMode && path) {
-    return /* @__PURE__ */ jsx(PreviewRichTextEditor, { ...rest, path, doc: value });
+  if (isEditingMode && (path || linkedEntryField)) {
+    return /* @__PURE__ */ jsx(
+      PreviewRichTextEditor,
+      {
+        ...rest,
+        path,
+        linkedEntryField,
+        onLinkedEntryFieldFocus: dispatchLinkedEntryFieldFocusEvent,
+        onBlockFieldFocus: dispatchBlockFieldFocusEventFromPath,
+        doc: value
+      }
+    );
   }
   return /* @__PURE__ */ jsx(RichText, { ...rest, path, doc: value });
 };
@@ -575,9 +655,10 @@ function blockReceivesHeaderClearance(blocks, blockIndex) {
 function planBlockToolbarPlacement(input) {
   if (input.headerClearance.kind === "overlay" && blockReceivesHeaderClearance(input.blocks, input.blockIndex)) {
     return {
-      kind: "anchor-top-right",
-      topPx: input.headerClearance.px + PREVIEW_CHROME_EDGE_OFFSET_PX,
-      rightPx: PREVIEW_CHROME_EDGE_OFFSET_PX
+      kind: "anchor-top-right-clamped",
+      topPx: PREVIEW_CHROME_EDGE_OFFSET_PX,
+      rightPx: PREVIEW_CHROME_EDGE_OFFSET_PX,
+      minTopPx: input.headerClearance.px + PREVIEW_CHROME_EDGE_OFFSET_PX
     };
   }
   return {
@@ -610,13 +691,14 @@ function resolvePreviewChromeFloatingPosition(input) {
   const anchorBox = input.anchorBox;
   if (!isUsableAnchorBox(anchorBox)) {
     return {
-      topPx: input.placement.topPx,
+      topPx: resolvePreviewChromeMinimumTopPx(input.placement),
       rightPx: input.placement.rightPx
     };
   }
   return {
     topPx: Math.max(
       PREVIEW_CHROME_EDGE_OFFSET_PX,
+      resolvePreviewChromeMinimumTopPx(input.placement),
       anchorBox.top - (input.containerTopEdgePx ?? 0) + input.placement.topPx
     ),
     rightPx: Math.max(
@@ -625,6 +707,9 @@ function resolvePreviewChromeFloatingPosition(input) {
     )
   };
 }
+function resolvePreviewChromeMinimumTopPx(placement) {
+  return placement.kind === "anchor-top-right-clamped" ? placement.minTopPx : placement.topPx;
+}
 function isUsableAnchorBox(box) {
   return Boolean(
     box && Number.isFinite(box.top) && Number.isFinite(box.right) && Number.isFinite(box.bottom) && Number.isFinite(box.height) && box.height > 0
@@ -1021,13 +1106,14 @@ function CustomizePopoverShell({
   onClose,
   onKeyDown,
   spacing = "normal",
+  side = "below",
   children
 }) {
   return /* @__PURE__ */ jsxs(
     "div",
     {
       id: panelId,
-      className: "builder-dashboard-chrome-theme fixed inset-x-3 bottom-[calc(var(--builder-editor-chrome-offset,0px)+1rem)] z-[70] rounded-lg border bg-background p-3 text-foreground shadow-xl sm:absolute sm:inset-x-auto sm:bottom-auto sm:right-0 sm:top-9 sm:w-72",
+      className: `builder-dashboard-chrome-theme fixed inset-x-3 bottom-[calc(var(--builder-editor-chrome-offset,0px)+1rem)] z-[70] max-h-[calc(100vh-var(--builder-editor-chrome-offset,0px)-2rem)] overflow-y-auto rounded-lg border bg-background p-3 text-foreground shadow-xl sm:absolute sm:inset-x-auto sm:right-0 sm:w-72 ${desktopPopoverSideClassName(side)}`,
       role: "dialog",
       "aria-modal": "true",
       "aria-label": dialogLabel,
@@ -1061,6 +1147,9 @@ function CustomizePopoverShell({
     }
   );
 }
+function desktopPopoverSideClassName(side) {
+  return side === "above" ? "sm:bottom-9 sm:top-auto" : "sm:bottom-auto sm:top-9";
+}
 function CustomizeCycleRow({
   label,
   valueLabel,
@@ -1290,6 +1379,7 @@ function BlockToolbar({
   blockId,
   blockKind,
   content,
+  bookingOfferingPresets,
   theme = null,
   placement = DEFAULT_PREVIEW_CHROME_FLOATING_PLACEMENT
 }) {
@@ -1551,7 +1641,7 @@ function BlockToolbar({
       placement,
       fallbackClassName: "pointer-events-auto absolute z-50 flex gap-1 opacity-0 transition group-focus-within:opacity-100 group-hover:opacity-100",
       fallbackStyle: {
-        top: placement.topPx,
+        top: placement.kind === "anchor-top-right-clamped" ? placement.minTopPx : placement.topPx,
         right: placement.rightPx
       },
       forceVisible: popover.open,
@@ -1607,16 +1697,17 @@ function BlockToolbar({
                   onToggleBackgroundChooser: () => setBackgroundChooserOpen((open) => !open)
                 })
               ),
-              quickManifestFields.length > 0 && quickManifestBackend ? /* @__PURE__ */ jsx("div", { className: "border-t pt-3", children: /* @__PURE__ */ jsx(
+              quickManifestFields.length > 0 && quickManifestBackend ? /* @__PURE__ */ jsx("div", { className: "border-t pt-3", children: /* @__PURE__ */ jsx(OfferingsPreviewWidgetProvider, { bookingOfferingPresets, children: /* @__PURE__ */ jsx(
                 FormRenderer,
                 {
                   fields: quickManifestFields,
                   backend: quickManifestBackend,
+                  widgetOverrides: previewWidgetOverrides,
                   showSettingsTrigger: false,
                   blockKind,
                   className: "space-y-3"
                 }
-              ) }) : null,
+              ) }) }) : null,
               historyFailure ? /* @__PURE__ */ jsx("p", { className: "text-xs text-red-700", children: historyFailure }) : null,
               hasOverflowCustomizeControls ? /* @__PURE__ */ jsx("div", { className: "border-t pt-2", children: /* @__PURE__ */ jsx(
                 "button",
@@ -2076,18 +2167,6 @@ function backgroundOverrideValueLabel(override, imagePool) {
       return imagePool.find((item) => item.mediaId === override.mediaId)?.label ?? "Image";
   }
 }
-function canCycleBackgroundOverrideValue(override, capability) {
-  switch (override.kind) {
-    case "default":
-      return false;
-    case "color":
-      return (capability.colorTokens?.length ?? 0) > 1;
-    case "gradient":
-      return (capability.gradientIds?.length ?? 0) > 1;
-    case "image":
-      return rankBackgroundImagePoolItems(capability.imagePool ?? []).length > 1;
-  }
-}
 function BackgroundPreviewSwatch({
   override,
   imagePool
@@ -2329,7 +2408,7 @@ function BoundaryControl({
       "button",
       {
         type: "button",
-        className: "pointer-events-auto relative z-10 flex h-12 min-w-32 items-center justify-center rounded-full opacity-0 transition hover:opacity-100 focus:opacity-100 focus:outline-none focus:ring-2 focus:ring-sky-300 group-hover/boundary:opacity-100 group-focus-within/boundary:opacity-100",
+        className: "pointer-events-auto absolute inset-0 z-10 flex items-center justify-center opacity-0 transition hover:opacity-100 focus:opacity-100 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-sky-300 group-hover/boundary:opacity-100 group-focus-within/boundary:opacity-100",
         "aria-controls": open ? panelId : void 0,
         "aria-expanded": open,
         "aria-haspopup": "dialog",
@@ -2515,7 +2594,8 @@ function pageDesignRuntimeProjectionFromSource(source) {
   if (source.kind === "preserve-server-runtime") return null;
   return runtimeContentDecorationProjectionFromEditorModel(
     source.editorModel,
-    source.surfaceResolutionContext
+    source.surfaceResolutionContext,
+    source.designRules
   );
 }
 function resolveRuntimePreviewSource(input) {
@@ -2523,7 +2603,8 @@ function resolveRuntimePreviewSource(input) {
     return {
       kind: "apply-editor-model",
       editorModel: input.pageDesignState.editorModel,
-      surfaceResolutionContext: input.surfaceResolutionContext
+      surfaceResolutionContext: input.surfaceResolutionContext,
+      designRules: input.designRules
     };
   }
   return { kind: "preserve-server-runtime" };
@@ -2584,9 +2665,10 @@ function EditablePageRenderer(props) {
   const runtimePreviewSource = useMemo(
     () => resolveRuntimePreviewSource({
       pageDesignState,
-      surfaceResolutionContext
+      surfaceResolutionContext,
+      designRules: designRuntimeRulesForTheme(pageRendererProps.theme)
     }),
-    [pageDesignState, surfaceResolutionContext]
+    [pageDesignState, pageRendererProps.theme, surfaceResolutionContext]
   );
   const runtimeProjection = useMemo(
     () => pageDesignRuntimeProjectionFromSource(runtimePreviewSource),
@@ -2670,6 +2752,7 @@ function EditablePageRenderer(props) {
               blockId,
               blockKind: block.kind,
               content,
+              bookingOfferingPresets: pageRendererProps.dataContext?.bookingOfferingPresets ?? [],
               theme: pageRendererProps.theme,
               placement: planBlockToolbarPlacement({
                 blocks: chromeBlocks,
@@ -3059,8 +3142,8 @@ function PreviewAuthInit({
   token
 }) {
   const lastInitRef = useRef(null);
-  const sessionKey = session ? session.kind === "userSession" ? `${session.kind}:${session.canEdit}:${session.canManage}:${session.expiresAt}` : `${session.kind}:${session.expiresAt}` : "none";
-  const currentKey = `${siteId}:${pageId}:${sessionKey}:${token ? "has-token" : "no-token"}`;
+  const sessionKey = session ? session.kind === "userSession" ? `${session.kind}:${session.canEdit}:${session.canManage}:${session.expiresAt ?? "no-expiry"}` : `${session.kind}:${session.expiresAt ?? "no-expiry"}` : "none";
+  const currentKey = `${siteId}:${pageId ?? "no-page"}:${sessionKey}:${token ? "has-token" : "no-token"}`;
   if (lastInitRef.current !== currentKey) {
     initPreviewAuth({
       session,
@@ -3982,6 +4065,7 @@ function PreviewAuthBanner({
 // ../blocks/src/client/site-chrome.tsx
 function renderSiteChromeBlock(model, surface, theme, options = {}) {
   const spec = model[surface];
+  if (!spec) return null;
   const themeConfig = options.themeConfigOverrideMode === "ignore" ? theme : applyThemeConfigOverride(theme, spec.themeConfigOverride);
   const themeRuntime = buildThemeRuntime(themeConfig);
   const manifest = surface === "header" ? siteHeaderManifest : siteFooterManifest;
@@ -4012,25 +4096,34 @@ function SiteChromeCustomizeButton({
 }) {
   const customize = useSiteChromeCustomizeOptional();
   const popover = useCustomizePopoverController();
+  const popoverSide = useSiteChromeCustomizePopoverSide({
+    open: popover.open,
+    surface,
+    buttonRef: popover.buttonRef,
+    dialogRef: popover.dialogRef
+  });
   const surfaceState = customize?.getSurfaceState(surface) ?? {
     kind: "unavailable"
   };
   const hasCustomizeControls = surfaceState.kind === "available";
+  const background = surfaceState.kind === "available" ? surfaceState.background : null;
   const cycleableOptionCount = useMemo(() => {
     if (surfaceState.kind !== "available") return 0;
     return surfaceState.options.filter((option) => option.available).length;
   }, [surfaceState]);
   const cycleableLayoutOptionCount = useMemo(() => {
-    if (surfaceState.kind !== "available" || surfaceState.surface !== "header") {
+    if (surfaceState.kind !== "available") {
       return 0;
     }
     return surfaceState.layoutOptions.filter((option) => option.available).length;
   }, [surfaceState]);
   const controlPlan = useMemo(() => {
-    if (surfaceState.kind !== "available") return { cycleRows: [] };
+    if (surfaceState.kind !== "available" || !background) {
+      return { cycleRows: [] };
+    }
     return {
       cycleRows: [
-        ...surfaceState.surface === "header" ? [
+        ...surfaceState.surface === "header" || surfaceState.surface === "footer" ? [
           {
             label: "Layout",
             valueLabel: surfaceState.currentLayoutLabel,
@@ -4055,10 +4148,25 @@ function SiteChromeCustomizeButton({
           }),
           onPrevious: () => customize?.cycleSurfaceLook(surface, "prev"),
           onNext: () => customize?.cycleSurfaceLook(surface, "next")
-        }
+        },
+        ...background.available ? [
+          {
+            label: "Background",
+            valueLabel: background.currentLabel,
+            previousLabel: `Previous ${surface} background`,
+            nextLabel: `Next ${surface} background`,
+            availability: cycleAvailabilityFromFlags({
+              canCycle: background.quickTokens.length > 0,
+              applyAllowed: surfaceState.applyAllowed
+            }),
+            onPrevious: () => customize?.cycleSurfaceBackground(surface, "prev"),
+            onNext: () => customize?.cycleSurfaceBackground(surface, "next")
+          }
+        ] : []
       ]
     };
   }, [
+    background,
     customize,
     cycleableLayoutOptionCount,
     cycleableOptionCount,
@@ -4096,8 +4204,18 @@ function SiteChromeCustomizeButton({
             closeButtonRef: popover.registerInitialFocus,
             onClose: popover.close,
             onKeyDown: popover.handleDialogKeyDown,
+            side: popoverSide,
             children: [
               controlPlan.cycleRows.map((row) => /* @__PURE__ */ jsx(CustomizeCycleRow, { ...row }, row.label)),
+              background?.available ? /* @__PURE__ */ jsx(
+                SiteChromeBackgroundPalette,
+                {
+                  surface: surfaceState.surface,
+                  background,
+                  applyAllowed: surfaceState.applyAllowed,
+                  onChoose: (override) => customize?.chooseSurfaceBackground(surfaceState.surface, override)
+                }
+              ) : null,
               surfaceState.surface === "header" ? /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-2 border-t pt-3", children: [
                 /* @__PURE__ */ jsxs("label", { className: "block text-xs font-medium text-muted-foreground", children: [
                   /* @__PURE__ */ jsx("span", { children: "Display" }),
@@ -4154,6 +4272,170 @@ function SiteChromeCustomizeButton({
     }
   );
 }
+var POPOVER_VIEWPORT_GUTTER_PX = 16;
+var POPOVER_UNMEASURED_MIN_SPACE_PX = 180;
+function useSiteChromeCustomizePopoverSide({
+  open,
+  surface,
+  buttonRef,
+  dialogRef
+}) {
+  const preferredSide = surface === "footer" ? "above" : "below";
+  const [side, setSide] = useState(preferredSide);
+  useEffect(() => {
+    if (!open) {
+      setSide(preferredSide);
+      return;
+    }
+    if (typeof window === "undefined") return;
+    let frame = null;
+    const update = () => {
+      const button = buttonRef.current;
+      if (!button) {
+        setSide(preferredSide);
+        return;
+      }
+      const buttonRect = button.getBoundingClientRect();
+      const panelHeight = dialogRef.current?.offsetHeight ?? 0;
+      setSide(
+        chooseSiteChromeCustomizePopoverSide({
+          preferredSide,
+          panelHeight,
+          availableAbove: buttonRect.top - POPOVER_VIEWPORT_GUTTER_PX,
+          availableBelow: window.innerHeight - buttonRect.bottom - POPOVER_VIEWPORT_GUTTER_PX
+        })
+      );
+    };
+    const scheduleUpdate = () => {
+      if (frame !== null) return;
+      frame = window.requestAnimationFrame(() => {
+        frame = null;
+        update();
+      });
+    };
+    scheduleUpdate();
+    window.addEventListener("resize", scheduleUpdate);
+    window.addEventListener("scroll", scheduleUpdate, true);
+    return () => {
+      if (frame !== null) {
+        window.cancelAnimationFrame(frame);
+      }
+      window.removeEventListener("resize", scheduleUpdate);
+      window.removeEventListener("scroll", scheduleUpdate, true);
+    };
+  }, [buttonRef, dialogRef, open, preferredSide]);
+  return side;
+}
+function chooseSiteChromeCustomizePopoverSide(input) {
+  const availableAbove = Math.max(0, input.availableAbove);
+  const availableBelow = Math.max(0, input.availableBelow);
+  const measuredPanelHeight = Number.isFinite(input.panelHeight) && input.panelHeight > 0 ? input.panelHeight : null;
+  if (measuredPanelHeight === null) {
+    if (input.preferredSide === "above" && availableAbove < POPOVER_UNMEASURED_MIN_SPACE_PX && availableBelow > availableAbove) {
+      return "below";
+    }
+    if (input.preferredSide === "below" && availableBelow < POPOVER_UNMEASURED_MIN_SPACE_PX && availableAbove > availableBelow) {
+      return "above";
+    }
+    return input.preferredSide;
+  }
+  if (input.preferredSide === "above" && measuredPanelHeight <= availableAbove) {
+    return "above";
+  }
+  if (input.preferredSide === "below" && measuredPanelHeight <= availableBelow) {
+    return "below";
+  }
+  if (measuredPanelHeight <= availableAbove && availableAbove >= availableBelow) {
+    return "above";
+  }
+  if (measuredPanelHeight <= availableBelow) {
+    return "below";
+  }
+  return availableAbove > availableBelow ? "above" : "below";
+}
+function SiteChromeBackgroundPalette({
+  surface,
+  background,
+  applyAllowed,
+  onChoose
+}) {
+  const choose = (override) => (event) => {
+    event.preventDefault();
+    event.stopPropagation();
+    onChoose(override);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "border-t pt-3", children: [
+    /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center justify-between gap-2", children: [
+      /* @__PURE__ */ jsx("div", { className: "text-xs font-medium text-muted-foreground", children: "Background colors" }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: `rounded-md border px-2 py-1 text-xs hover:bg-muted disabled:cursor-not-allowed disabled:opacity-50 ${background.current.kind === "default" ? "border-foreground" : "bg-background"}`,
+          disabled: !applyAllowed,
+          onClick: choose({ kind: "default" }),
+          children: "Default"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "grid grid-cols-3 gap-1", children: background.quickTokens.map((token) => /* @__PURE__ */ jsx(
+      BackgroundSwatchButton,
+      {
+        token,
+        surface,
+        selected: background.current.kind === "color" && background.current.token === token,
+        disabled: !applyAllowed,
+        onClick: choose({ kind: "color", token })
+      },
+      token
+    )) }),
+    background.advancedTokens.length ? /* @__PURE__ */ jsxs("details", { className: "mt-2", children: [
+      /* @__PURE__ */ jsx("summary", { className: "cursor-pointer text-xs text-muted-foreground", children: "More colors" }),
+      /* @__PURE__ */ jsx("div", { className: "mt-1 grid grid-cols-3 gap-1", children: background.advancedTokens.map((token) => /* @__PURE__ */ jsx(
+        BackgroundSwatchButton,
+        {
+          token,
+          surface,
+          selected: background.current.kind === "color" && background.current.token === token,
+          disabled: !applyAllowed,
+          onClick: choose({ kind: "color", token })
+        },
+        token
+      )) })
+    ] }) : null
+  ] });
+}
+function BackgroundSwatchButton({
+  token,
+  surface,
+  selected,
+  disabled,
+  onClick
+}) {
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      className: `flex min-w-0 items-center gap-2 rounded-md border px-2 py-1 text-left text-xs hover:bg-muted disabled:cursor-not-allowed disabled:opacity-50 ${selected ? "border-foreground" : "bg-background"}`,
+      disabled,
+      "aria-label": `Set ${surface} background to ${token}`,
+      onClick,
+      children: [
+        /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: "h-3 w-3 shrink-0 rounded-full border",
+            style: { backgroundColor: tokenSwatchCss2(token) }
+          }
+        ),
+        /* @__PURE__ */ jsx("span", { className: "truncate", children: formatSiteChromeBackgroundTokenLabel(token) })
+      ]
+    }
+  );
+}
+function tokenSwatchCss2(token) {
+  return `rgb(var(--tb-${token}))`;
+}
 function SiteChromeEditableSurface({
   surface,
   children,
@@ -4288,14 +4570,15 @@ function PreviewThemedSiteDocument({
   siteChromeRenderModel
 }) {
   const { effectiveTheme } = usePreviewThemeOverlay();
+  const headerNode = siteChromeRenderModel?.header ? /* @__PURE__ */ jsx(SiteChromeEditableSurface, { surface: "header", children: renderSiteChromeBlock(siteChromeRenderModel, "header", effectiveTheme, {
+    themeConfigOverrideMode: "ignore"
+  }) }) : staticHeaderNode;
   const siteDocumentPlan = planSiteDocument({
     headerPositioning: effectiveTheme.header?.positioning ?? "static",
     headerVariant: effectiveTheme.header?.variant ?? null,
-    hasVisibleBanner: Boolean(bannerNode)
+    hasVisibleBanner: Boolean(bannerNode),
+    hasVisibleHeader: Boolean(headerNode)
   });
-  const headerNode = siteChromeRenderModel ? /* @__PURE__ */ jsx(SiteChromeEditableSurface, { surface: "header", children: renderSiteChromeBlock(siteChromeRenderModel, "header", effectiveTheme, {
-    themeConfigOverrideMode: "ignore"
-  }) }) : staticHeaderNode;
   const canRenderFooterReactively = Boolean(siteChromeRenderModel) && siteChromeRenderModel?.footer.canRenderReactively !== false;
   const footerNode = canRenderFooterReactively && siteChromeRenderModel ? /* @__PURE__ */ jsx(SiteChromeEditableSurface, { surface: "footer", preserveSingleComponentRoot: true, children: renderSiteChromeBlock(siteChromeRenderModel, "footer", effectiveTheme, {
     themeConfigOverrideMode: "ignore"
@@ -4398,20 +4681,52 @@ function LinkedEntryEditEventBridge() {
       if (!isLinkedEntryEditEvent(event)) return;
       uiStore.getState().linkedEntries.open(event.detail);
     };
+    const handleLinkedEntryFieldFocus = (event) => {
+      if (!isLinkedEntryFieldFocusEvent(event)) return;
+      const state = uiStore.getState();
+      if (state.linkedEntries.getSelectedEntryId() !== event.detail.write.entryId) {
+        state.linkedEntries.open(event.detail.target);
+      }
+      state.setActivePreviewField({
+        kind: "linked-entry",
+        entryId: unsafeAsLinkedContentEntryId(event.detail.write.entryId),
+        fieldPath: event.detail.write.fieldPath
+      });
+    };
+    const handleBlockFieldFocus = (event) => {
+      if (!isBlockFieldFocusEvent(event)) return;
+      const state = uiStore.getState();
+      const blockId = unsafeAsEditorBlockId(event.detail.blockId);
+      state.setPreviewSidebarTab("editor");
+      state.setDrawerOpen(true);
+      state.setActivePreviewField({
+        kind: "block",
+        blockId,
+        fieldPath: event.detail.fieldPath
+      });
+      state.requestFocus({
+        blockId,
+        fieldPath: event.detail.fieldPath
+      });
+    };
     window.addEventListener(LINKED_ENTRY_EDIT_EVENT, handleLinkedEntryEdit);
+    window.addEventListener(LINKED_ENTRY_FIELD_FOCUS_EVENT, handleLinkedEntryFieldFocus);
+    window.addEventListener(BLOCK_FIELD_FOCUS_EVENT, handleBlockFieldFocus);
     return () => {
       window.removeEventListener(LINKED_ENTRY_EDIT_EVENT, handleLinkedEntryEdit);
+      window.removeEventListener(LINKED_ENTRY_FIELD_FOCUS_EVENT, handleLinkedEntryFieldFocus);
+      window.removeEventListener(BLOCK_FIELD_FOCUS_EVENT, handleBlockFieldFocus);
     };
   }, [uiStore]);
   return null;
 }
 var previewContainerResponsiveEnabled = process.env.NEXT_PUBLIC_ENABLE_PREVIEW_CONTAINER_RESPONSIVE !== "false";
 var PreviewEditorSidebar = React10.lazy(async () => {
-  const mod = await import('./PreviewEditorSidebar-RDCMEXIJ.mjs');
+  const mod = await import('./PreviewEditorSidebar-HML67UDA.mjs');
   return { default: mod.PreviewEditorSidebar };
 });
 var PreviewEditorUI = React10.lazy(async () => {
-  const mod = await import('./PreviewEditorUI-NYGQ6K7B.mjs');
+  const mod = await import('./PreviewEditorUI-I4BQUU6K.mjs');
   return { default: mod.PreviewEditorUI };
 });
 var previewPaneContainmentStyle = {
@@ -4456,6 +4771,7 @@ function PreviewShellLayout({
   assistantPanel,
   sdkConfig,
   mediaAssets,
+  bookingOfferingPresets,
   useThemeScope = true,
   siteStyleAccess = { kind: "hidden" }
 }) {
@@ -4695,6 +5011,7 @@ function PreviewShellLayout({
           entrySubrouteContext: entrySubrouteContext ?? null,
           assistantPanel,
           mediaAssets,
+          bookingOfferingPresets,
           siteStyleAccess,
           viewportMode,
           viewportWidth,
@@ -4819,6 +5136,7 @@ function PreviewShell({
   assistantPanel,
   sdkConfig,
   mediaAssets,
+  bookingOfferingPresets,
   supabaseUrl,
   useThemeScope = true,
   designEditorEligibility,
@@ -4907,6 +5225,7 @@ function PreviewShell({
                         assistantPanel,
                         sdkConfig: sdkConfig ?? null,
                         mediaAssets,
+                        bookingOfferingPresets,
                         useThemeScope,
                         siteStyleAccess,
                         children
@@ -4931,6 +5250,19 @@ function defaultDesignEditorEligibility(input) {
   }
   return { kind: "unsupported" };
 }
+function isSdkCustomBlockArray(value) {
+  return Array.isArray(value);
+}
+function getSdkConfigForBlockPicker(value) {
+  if (!value || typeof value !== "object") {
+    return null;
+  }
+  if (!("customBlocks" in value)) {
+    return {};
+  }
+  const customBlocks = value.customBlocks;
+  return isSdkCustomBlockArray(customBlocks) ? { customBlocks } : {};
+}
 function SdkPreviewModeRuntime(props) {
   const {
     apiBaseUrl,
@@ -4948,8 +5280,8 @@ function SdkPreviewModeRuntime(props) {
   const theme = content.theme;
   const page = content.page;
   const routeMap = content.routeMap ?? void 0;
-  const sdkConfig = content.sdkConfig ?? null;
-  const customBlocks = content.customBlocks ?? null;
+  const sdkConfig = getSdkConfigForBlockPicker(content.sdkConfig);
+  const customBlocks = isSdkCustomBlockArray(content.customBlocks) ? content.customBlocks : null;
   const typedBlockOverrides = blockOverrides ?? null;
   const sdkConfigForEditor = useMemo(() => {
     const blocks = customBlocks ?? sdkConfig?.customBlocks ?? void 0;