@riverbankcms/sdk 0.82.0 → 0.84.0

package/README.md

@@ -183,6 +183,10 @@ For detailed testing and verification steps, see [`docs/resilience-verification.
 
 SDK sites that need bespoke appointment booking UI can use the headless booking runtime from `@riverbankcms/sdk/bookings`. See [`docs/headless-booking.md`](./docs/headless-booking.md) for the real `blockOverrides` pattern with an `'appointment-booking'` override, `HeadlessBookingProvider`, `getAppointmentBookingOverrideInput`, and `useHeadlessBookingFlow`.
 
+### Headless Event Registration
+
+SDK sites that need bespoke event registration UI can use the headless event registration runtime from `@riverbankcms/sdk/bookings`. See [`docs/headless-event-registration.md`](./docs/headless-event-registration.md) for the real `blockOverrides` pattern with an `'event-registration'` override, `HeadlessEventRegistrationProvider`, `getEventRegistrationOverrideInput`, and `useHeadlessEventRegistrationFlow`.
+
 ### Server-Side API
 
 ```tsx
@@ -1507,6 +1511,8 @@ export function MyComponent() {
 
 Style Builder blocks to match your brand using the Theme Bridge. This provides CSS variables and optional component styles without requiring the full CMS theme system.
 
+For event registration specifically, see [`docs/event-registration-theming.md`](./docs/event-registration-theming.md). Generated SDK sites using `Layout` get a full `ThemeScope` by default; standalone `Page` or `Block` rendering should use `ThemeBridgeProvider` or manual `generateThemeBridgeCss` with a `data-theme-scope="sdk"` wrapper.
+
 ### Quick Start
 
 Import the SDK base stylesheet, then wrap your app with `ThemeBridgeProvider` and define your color tokens:
@@ -2898,6 +2904,16 @@ entries: [
       bio: '<p>Our founder...</p>',
       role: 'CEO',
     },
+    // Optional Page Content blocks for template-declared system.entry-slot areas.
+    blocks: {
+      main: [
+        {
+          identifier: 'intro',
+          kind: 'block.body-text',
+          content: { body: 'A richer editable introduction.' },
+        },
+      ],
+    },
     metaTitle: 'John Smith | Team',
     metaDescription: 'Meet John Smith, our CEO',
   },

package/dist/{PreviewEditorSidebar-LHGK6RIO.mjs → PreviewEditorSidebar-HML67UDA.mjs}

@@ -1,11 +1,12 @@
 "use client";
-import { resolvePreviewDashboardSetupHandoff, buildPreviewDashboardSetupUrl, resolvePreviewSidebarChromeModel, resolvePreviewEditorGuidanceModel, previewWidgetOverrides, canInspectSiteStyle, mapContentSchemaToFormFields, PreviewFormProvider, usePreviewBlockCustomizeSelectionOptional, BlockEditor, canApplySiteStyle, useBlockCustomizeControls, MAX_QUICK_MANIFEST_FIELDS } from './chunk-G35HOQEN.mjs';
-import { useEntryController, useEditorUiStoreInstance, useUISelector, resolvePreviewSidebarTab, unsafeAsEditorBlockId, Tabs, TabsList, TabsTrigger, Button, X, TabsContent, useEditorUiStore, deriveRouteMetadataPresentation, resolvePageRouteSlug, createManifestValidation, createStoreBackend, ManifestForm, previewAssistantEnabled, Collapsible, CollapsibleTrigger, ChevronRight, CollapsibleContent, ContentFieldsForm, usePreviewDesignCoordinator, useSiteChromeCustomizeOptional, resolveStyleConfiguratorInitialSnapshot, createStyleConfiguratorState, isPreviewingChange, createOptimisticActionRunner, syncStyleConfiguratorState, getCuratedSiteStyle, planSiteStylePreviewChange, openRow, previewSiteStyle, applyResolvedSelections, previewButtonPersonality, previewHeaderLayout, previewHeaderStyle, planSiteChromeLookSelection, previewFooterLook, previewPaletteVariant, previewTypographyPreset, setTypographyBodyFontOverride, setTypographyHeadingFontOverride, clearTypographyFontOverrides, paletteOverridesSchema, setPaletteOverrides, toggleRow, cancelPreview, dismissWarnings, dismissNotices, deriveStyleConfiguratorCapabilities, buildApplySiteStyleSelectionBody, markApplyFailed, selectionSnapshotFromApplySiteStyleSelectionResponse, styleConfiguratorHistoryEntryForPersistedSelection, markApplySaved, unwrapResponse, markApplySaving, findButtonPersonality, findPaletteVariant, findTypographyPreset, buildSiteChromeLookModels, getHeaderLayout, getHeaderStyle, findFooterLook, cycleSiteChromeLookId, footerLookCatalog, resolveContentTitle, foldSubroute, SUBROUTE_KINDS, Smartphone, Tablet, Monitor, Maximize2, cn, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuItem, curatedSiteStyles, ChevronLeft, cycleableSiteChromeOptions, requireEntriesForCuratedChoices, buttonPersonalities, typographyPresets, paletteVariants, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, FormRenderer, evaluateTypographyFontSlot, Callout, CalloutDescription, Separator, Surface, ColorPicker, Input } from './chunk-XQR6THQJ.mjs';
-import { usePreviewAuth, getDashboardUrl } from './chunk-FIREV57T.mjs';
+import { resolvePreviewDashboardSetupHandoff, buildPreviewDashboardSetupUrl, resolvePreviewSidebarChromeModel, resolvePreviewEditorGuidanceModel, previewWidgetOverrides, canInspectSiteStyle, mapContentSchemaToFormFields, PreviewFormProvider, usePreviewBlockCustomizeSelectionOptional, BlockEditor, canApplySiteStyle, useBlockCustomizeControls, MAX_QUICK_MANIFEST_FIELDS } from './chunk-5E33VO6J.mjs';
+import { useEntryController, useEditorUiStoreInstance, useUISelector, resolvePreviewSidebarTab, unsafeAsEditorBlockId, Tabs, TabsList, TabsTrigger, Button, X, TabsContent, useEditorUiStore, deriveRouteMetadataPresentation, resolvePageRouteSlug, createManifestValidation, createStoreBackend, ManifestForm, previewAssistantEnabled, Collapsible, CollapsibleTrigger, ChevronRight, CollapsibleContent, ContentFieldsForm, usePreviewDesignCoordinator, useSiteChromeCustomizeOptional, resolveStyleConfiguratorInitialSnapshot, createStyleConfiguratorState, isPreviewingChange, createOptimisticActionRunner, syncStyleConfiguratorState, getCuratedSiteStyle, planSiteStylePreviewChange, openRow, previewSiteStyle, applyResolvedSelections, previewButtonPersonality, previewHeaderLayout, previewHeaderStyle, planSiteChromeLookSelection, previewFooterLook, buildSiteChromeLookModels, planSiteChromeFooterLayoutSelection, previewPaletteVariant, previewTypographyPreset, setTypographyBodyFontOverride, setTypographyHeadingFontOverride, clearTypographyFontOverrides, paletteOverridesSchema, setPaletteOverrides, toggleRow, cancelPreview, dismissWarnings, dismissNotices, deriveStyleConfiguratorCapabilities, buildApplySiteStyleSelectionBody, markApplyFailed, selectionSnapshotFromApplySiteStyleSelectionResponse, styleConfiguratorHistoryEntryForPersistedSelection, markApplySaved, unwrapResponse, markApplySaving, findButtonPersonality, findPaletteVariant, findTypographyPreset, getHeaderLayout, getHeaderStyle, getFooterLayout, findFooterLook, cycleSiteChromeLookId, resolveContentTitle, foldSubroute, SUBROUTE_KINDS, Smartphone, Tablet, Monitor, Maximize2, cn, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuItem, listEntryPageContentSlots, ContentSpinner, Callout, CalloutDescription, curatedSiteStyles, ChevronLeft, cycleableSiteChromeOptions, requireEntriesForCuratedChoices, buttonPersonalities, typographyPresets, paletteVariants, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, FormRenderer, evaluateTypographyFontSlot, Separator, Surface, ColorPicker, Input } from './chunk-MSHZO4SL.mjs';
+import { usePreviewAuth, getDashboardUrl } from './chunk-LBBPD2IW.mjs';
 import './chunk-R7POPVJR.mjs';
-import { useMemo, useRef, useCallback, useEffect, useState, useTransition, useSyncExternalStore, useId } from 'react';
+import { useMemo, useRef, useCallback, useEffect, useState, useTransition, useLayoutEffect, useSyncExternalStore, useId } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useRouter } from 'next/navigation';
+import { useQueryClient, useQuery } from '@tanstack/react-query';
 
 function PreviewZoomControls({ zoom, onZoomChange, disabled }) {
   return /* @__PURE__ */ jsxs(
@@ -154,6 +155,239 @@ function resolveSubrouteNotice(ctx, args) {
     "course-run": (run) => buildNoticeFromMeta(SUBROUTE_KINDS["course-run"], run, args.siteId)
   });
 }
+var EMPTY_BLOCKS = [];
+var EMPTY_SLOTS = [];
+var EMPTY_SELECTION = { kind: "none" };
+function entryPageContentSlotsKey(siteId, typeKey, entryId) {
+  return ["preview-entry-page-content-slots", siteId, typeKey, entryId];
+}
+function getAllowedBlockKinds(slot) {
+  return slot.allowedBlocks.blockKinds;
+}
+function resolveSlotSelection(current, slots) {
+  const firstSlotKey = slots[0]?.slotKey;
+  if (!firstSlotKey) return EMPTY_SELECTION;
+  if (current.kind === "selected" && slots.some((slot) => slot.slotKey === current.slotKey)) {
+    return current;
+  }
+  return { kind: "selected", slotKey: firstSlotKey };
+}
+function findSelectedSlot(selection, slots) {
+  if (selection.kind === "none") return null;
+  return slots.find((slot) => slot.slotKey === selection.slotKey) ?? null;
+}
+function selectionsEqual(left, right) {
+  if (left.kind !== right.kind) return false;
+  switch (left.kind) {
+    case "none":
+      return true;
+    case "selected":
+      return right.kind === "selected" && left.slotKey === right.slotKey;
+  }
+}
+function findSlotKeyForBlock(slots, blockId) {
+  if (!blockId) return null;
+  return slots.find((slot) => slot.blocks.some((block) => block.id === blockId))?.slotKey ?? null;
+}
+function updateBlocksWithSavedContent(blocks, blockId, content) {
+  let changed = false;
+  const nextBlocks = blocks.map((block) => {
+    if (block.id !== blockId) return block;
+    changed = true;
+    return {
+      ...block,
+      content,
+      draftContent: content
+    };
+  });
+  return changed ? nextBlocks : blocks;
+}
+function getErrorMessage(error) {
+  return error instanceof Error ? error.message : "Unable to load Page Content.";
+}
+function EntrySlotBlockEditorPanel({
+  siteId,
+  typeKey,
+  entryId,
+  theme = null,
+  apiClient,
+  bearerToken,
+  supabaseUrl,
+  sdkConfig = null,
+  mediaAssets,
+  widgets
+}) {
+  const router = useRouter();
+  const queryClient = useQueryClient();
+  const uiStore = useEditorUiStoreInstance();
+  const blockEditorRef = useRef(null);
+  const focusRequest = useEditorUiStore((state) => state.focusRequest);
+  const blockAutosaveStatus = useEditorUiStore(
+    (state) => state.autosave.blocks.status
+  );
+  const [slotSelection, setSlotSelection] = useState(EMPTY_SELECTION);
+  const queryKey = useMemo(
+    () => entryPageContentSlotsKey(siteId, typeKey, entryId),
+    [entryId, siteId, typeKey]
+  );
+  const slotsQuery = useQuery({
+    queryKey,
+    queryFn: () => listEntryPageContentSlots(apiClient, {
+      siteId,
+      type: typeKey,
+      entryId
+    }),
+    staleTime: 3e4
+  });
+  const handleBlockSave = useCallback(
+    (blockId, content) => {
+      const structure = uiStore.getState().structure;
+      const currentBlocks = structure.getList();
+      const nextBlocks = updateBlocksWithSavedContent(currentBlocks, blockId, content);
+      if (nextBlocks !== currentBlocks) {
+        structure.replaceList(nextBlocks);
+      }
+      queryClient.setQueryData(
+        queryKey,
+        (current) => {
+          if (!current) return current;
+          return {
+            ...current,
+            slots: current.slots.map((slot) => ({
+              ...slot,
+              blocks: updateBlocksWithSavedContent(slot.blocks, blockId, content)
+            }))
+          };
+        }
+      );
+      void queryClient.invalidateQueries({ queryKey });
+      router.refresh();
+    },
+    [queryClient, queryKey, router, uiStore]
+  );
+  const slots = slotsQuery.data?.slots ?? EMPTY_SLOTS;
+  const warnings = slotsQuery.data?.warnings ?? [];
+  const selection = useMemo(
+    () => resolveSlotSelection(slotSelection, slots),
+    [slotSelection, slots]
+  );
+  const selectedSlot = useMemo(
+    () => findSelectedSlot(selection, slots),
+    [selection, slots]
+  );
+  const selectedBlocks = selectedSlot?.blocks ?? EMPTY_BLOCKS;
+  const focusRequestedBlockField = useCallback(
+    (editor) => {
+      if (!editor) return false;
+      if (!focusRequest?.blockId) return false;
+      if (!selectedBlocks.some((block) => block.id === focusRequest.blockId)) return false;
+      editor.focusField({
+        blockId: focusRequest.blockId,
+        fieldPath: focusRequest.fieldPath ?? void 0,
+        itemIndex: focusRequest.itemIndex ?? void 0
+      });
+      uiStore.getState().clearFocus();
+      return true;
+    },
+    [focusRequest, selectedBlocks, uiStore]
+  );
+  const handleBlockEditorRef = useCallback(
+    (editor) => {
+      blockEditorRef.current = editor;
+      focusRequestedBlockField(editor);
+    },
+    [focusRequestedBlockField]
+  );
+  useEffect(() => {
+    setSlotSelection(
+      (current) => selectionsEqual(current, selection) ? current : selection
+    );
+  }, [selection]);
+  useEffect(() => {
+    const focusedSlotKey = findSlotKeyForBlock(slots, focusRequest?.blockId);
+    if (!focusedSlotKey) return;
+    setSlotSelection({ kind: "selected", slotKey: focusedSlotKey });
+  }, [focusRequest?.blockId, slots]);
+  useLayoutEffect(() => {
+    focusRequestedBlockField(blockEditorRef.current);
+  }, [focusRequestedBlockField]);
+  if (slotsQuery.isLoading) {
+    return /* @__PURE__ */ jsx(ContentSpinner, { className: "py-8" });
+  }
+  if (slotsQuery.isError) {
+    return /* @__PURE__ */ jsx(Callout, { tone: "danger", role: "alert", className: "px-4 py-3", children: /* @__PURE__ */ jsx(CalloutDescription, { className: "mt-0", children: getErrorMessage(slotsQuery.error) }) });
+  }
+  if (!selectedSlot) {
+    return null;
+  }
+  const slotEditor = /* @__PURE__ */ jsx(
+    PreviewFormProvider,
+    {
+      siteId,
+      theme,
+      previewClient: apiClient,
+      bearerToken,
+      supabaseUrl,
+      mediaAssets,
+      sdkConfig,
+      children: /* @__PURE__ */ jsx(
+        BlockEditor,
+        {
+          ref: handleBlockEditorRef,
+          siteId,
+          owner: {
+            kind: "entry-slot",
+            type: typeKey,
+            entryId,
+            slotKey: selectedSlot.slotKey
+          },
+          blocks: [...selectedBlocks],
+          apiClient,
+          uiStore,
+          theme,
+          widgetOverrides: widgets,
+          allowedBlockKinds: getAllowedBlockKinds(selectedSlot),
+          emptyUnavailableMessage: "No blocks are available for this slot.",
+          sdkConfig,
+          initialCollapsed: false,
+          enableCreation: false,
+          enableDeletion: false,
+          enableReordering: false,
+          reorderControlMode: "drag-handle-only",
+          onBlockSave: handleBlockSave
+        },
+        selectedSlot.slotKey
+      )
+    }
+  );
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+    warnings.map((warning) => /* @__PURE__ */ jsx(
+      Callout,
+      {
+        tone: "warning",
+        role: "status",
+        className: "px-4 py-3",
+        children: /* @__PURE__ */ jsx(CalloutDescription, { className: "mt-0", children: warning.message })
+      },
+      `${warning.kind}:${warning.slotKey}`
+    )),
+    slots.length > 1 ? /* @__PURE__ */ jsxs(
+      Tabs,
+      {
+        value: selectedSlot.slotKey,
+        onValueChange: (nextSlotKey) => {
+          if (blockAutosaveStatus === "saving") return;
+          uiStore.getState().autosave.saveNow(["blocks"]);
+          setSlotSelection({ kind: "selected", slotKey: nextSlotKey });
+        },
+        children: [
+          /* @__PURE__ */ jsx(TabsList, { className: "h-auto flex-wrap justify-start gap-1 bg-transparent p-0", children: slots.map((slot) => /* @__PURE__ */ jsx(TabsTrigger, { value: slot.slotKey, children: slot.label }, slot.slotKey)) }),
+          slots.map((slot) => /* @__PURE__ */ jsx(TabsContent, { value: slot.slotKey, className: "mt-4", children: slot.slotKey === selectedSlot.slotKey ? slotEditor : null }, slot.slotKey))
+        ]
+      }
+    ) : slotEditor
+  ] });
+}
 function EntryEditorPanel({
   siteId,
   entryData,
@@ -170,6 +404,7 @@ function EntryEditorPanel({
   linkedEntrySection,
   mediaAssets,
   widgets,
+  sdkConfig,
   viewportMode,
   viewportWidth,
   zoom,
@@ -178,8 +413,15 @@ function EntryEditorPanel({
   onZoomChange
 }) {
   const [contentOpen, setContentOpen] = useState(true);
+  const [pageContentOpen, setPageContentOpen] = useState(false);
   const [templateOpen, setTemplateOpen] = useState(false);
   const [detailsOpen, setDetailsOpen] = useState(false);
+  const focusRequest = useEditorUiStore((state) => state.focusRequest);
+  useEffect(() => {
+    if (focusRequest?.blockId) {
+      setPageContentOpen(true);
+    }
+  }, [focusRequest?.blockId]);
   const contentFormFields = useMemo(
     // content-model keeps a source-local structural field type so it can typecheck natively
     // without importing @riverbankcms/blocks source. Preview is the integration boundary where
@@ -254,6 +496,27 @@ function EntryEditorPanel({
           }
         ) }) })
       ] }) }) : /* @__PURE__ */ jsx("div", { className: "border-b px-4 py-3", children: /* @__PURE__ */ jsx("div", { className: "rounded-md border border-dashed px-4 py-6 text-sm text-muted-foreground", children: "Content schema not available for this entry type." }) }),
+      entryData.type ? /* @__PURE__ */ jsx(Collapsible, { open: pageContentOpen, onOpenChange: setPageContentOpen, children: /* @__PURE__ */ jsxs("div", { className: "border-b", children: [
+        /* @__PURE__ */ jsx(CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("div", { className: "flex cursor-pointer items-center gap-2 px-4 py-3 hover:bg-accent/40", children: [
+          /* @__PURE__ */ jsx(ChevronRight, { className: `h-4 w-4 transition ${pageContentOpen ? "rotate-90" : ""}` }),
+          /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: "Page Content" })
+        ] }) }),
+        /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx("div", { className: "px-4 pb-4", "data-testid": "entry-page-content-editor", children: /* @__PURE__ */ jsx(
+          EntrySlotBlockEditorPanel,
+          {
+            siteId,
+            typeKey: entryData.type,
+            entryId: entryData.id,
+            theme,
+            apiClient,
+            bearerToken,
+            supabaseUrl,
+            sdkConfig: sdkConfig ?? null,
+            mediaAssets,
+            widgets
+          }
+        ) }) })
+      ] }) }) : null,
       currentTemplate && entryData.type ? /* @__PURE__ */ jsx(Collapsible, { open: templateOpen, onOpenChange: setTemplateOpen, children: /* @__PURE__ */ jsxs("div", { className: "border-b", children: [
         /* @__PURE__ */ jsx(CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("div", { className: "flex cursor-pointer items-center gap-2 px-4 py-3 hover:bg-accent/40", children: [
           /* @__PURE__ */ jsx(ChevronRight, { className: `h-4 w-4 transition ${templateOpen ? "rotate-90" : ""}` }),
@@ -439,6 +702,7 @@ function PageBlockEditorPanel({
   const [customizeOpen, setCustomizeOpen] = useState(false);
   const [contentOpen, setContentOpen] = useState(true);
   const [detailsOpen, setDetailsOpen] = useState(false);
+  const customizeSectionRef = useRef(null);
   const selectionKind = customizeSelection?.selection.kind;
   const selectionRequestId = customizeSelection?.selection.kind === "selected" ? customizeSelection.selection.requestId : 0;
   const handleCustomizeBlock = useCallback(
@@ -455,6 +719,10 @@ function PageBlockEditorPanel({
   useEffect(() => {
     if (selectionKind === "selected") {
       setCustomizeOpen(true);
+      customizeSectionRef.current?.scrollIntoView({
+        block: "start",
+        behavior: "smooth"
+      });
     }
   }, [selectionKind, selectionRequestId]);
   return /* @__PURE__ */ jsxs("div", { className: "flex h-full min-h-0 flex-col overflow-hidden", children: [
@@ -496,7 +764,7 @@ function PageBlockEditorPanel({
             ] }) }),
             /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx("div", { className: "px-4 pb-4", children: designPanel }) })
           ] }) }) : null,
-          /* @__PURE__ */ jsx(Collapsible, { open: customizeOpen, onOpenChange: setCustomizeOpen, children: /* @__PURE__ */ jsxs("div", { className: "border-b", children: [
+          /* @__PURE__ */ jsx(Collapsible, { open: customizeOpen, onOpenChange: setCustomizeOpen, children: /* @__PURE__ */ jsxs("div", { ref: customizeSectionRef, className: "border-b", children: [
             /* @__PURE__ */ jsx(CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("div", { className: "flex cursor-pointer items-center gap-2 px-4 py-3 hover:bg-accent/40", children: [
               /* @__PURE__ */ jsx(ChevronRight, { className: `h-4 w-4 transition ${customizeOpen ? "rotate-90" : ""}` }),
               /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: "Customize" })
@@ -521,7 +789,7 @@ function PageBlockEditorPanel({
               {
                 ref: blockEditorRef,
                 siteId,
-                pageId,
+                owner: { kind: "page", pageId },
                 blocks: blockItems,
                 uiStore: uiStoreForBlockEditor,
                 apiClient,
@@ -963,6 +1231,28 @@ function StyleConfigurator({
       (current) => current ? previewFooterLook(current, plan.next.footerLookId) : current
     );
   }, []);
+  const handlePreviewFooterLayout = useCallback(
+    (id) => {
+      if (!id) return;
+      setState((current) => {
+        if (!current) return current;
+        const siteStyle = getCuratedSiteStyle(current.previewed.siteStyleId);
+        if (!siteStyle) return current;
+        const models = buildSiteChromeLookModels({
+          state: current,
+          siteStyle,
+          headerSelectionContext,
+          footerSelectionContext
+        });
+        const nextLookId = planSiteChromeFooterLayoutSelection({
+          layoutId: id,
+          currentLookId: current.previewed.footerLookId ?? models.footer.renderedLookId
+        });
+        return nextLookId ? previewFooterLook(current, nextLookId) : current;
+      });
+    },
+    [footerSelectionContext, headerSelectionContext]
+  );
   const handlePreviewPalette = useCallback((id) => {
     setState(
       (current) => current ? previewPaletteVariant(current, id) : current
@@ -1142,6 +1432,9 @@ function StyleConfigurator({
   });
   const currentHeaderLayout = getHeaderLayout(state.previewed.headerLayoutId);
   const currentHeaderStyle = getHeaderStyle(state.previewed.headerStyleId);
+  const currentFooterLayout = getFooterLayout(
+    chromeLookModels.footerLayout.renderedLayoutId
+  );
   const currentFooterLook = state.previewed.footerLookId ? findFooterLook(state.previewed.footerLookId) : findFooterLook(chromeLookModels.footer.renderedLookId);
   return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
     state.warnings.length > 0 ? /* @__PURE__ */ jsx(
@@ -1221,10 +1514,34 @@ function StyleConfigurator({
     /* @__PURE__ */ jsx(
       SiteChromeLookRow,
       {
-        label: "Footer",
-        ariaLabel: "Footer",
-        defaultDescription: "Use the footer chosen for this site style.",
-        catalog: footerLookCatalog,
+        label: "Footer layout",
+        ariaLabel: "Footer layout",
+        defaultDescription: "Choose the footer structure.",
+        expanded: state.expandedRow === "footer-layout",
+        onToggle: () => handleToggleRow("footer-layout"),
+        currentId: chromeLookModels.footerLayout.renderedLayoutId,
+        currentLabel: currentFooterLayout?.label ?? chromeLookModels.footerLayout.renderedLayoutId,
+        scopeDescription: "Changes the footer structure on every page.",
+        options: chromeLookModels.footerLayout.options,
+        diagnostics: [],
+        onCycle: (direction) => {
+          const next = cycleSiteChromeLookId(
+            chromeLookModels.footerLayout.options,
+            chromeLookModels.footerLayout.renderedLayoutId,
+            direction
+          );
+          if (next !== void 0) handlePreviewFooterLayout(next);
+        },
+        onPreview: handlePreviewFooterLayout,
+        disabled: saving
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      SiteChromeLookRow,
+      {
+        label: "Footer look",
+        ariaLabel: "Footer look",
+        defaultDescription: "Use the footer look chosen for this site style.",
         expanded: state.expandedRow === "footer",
         onToggle: () => handleToggleRow("footer"),
         currentId: state.previewed.footerLookId,
@@ -2304,6 +2621,7 @@ function PreviewEditorSidebar({
     [controllerBlocks.actions, uiStore]
   );
   useEffect(() => {
+    if (entryData) return;
     const req = focusRequest;
     if (!req?.blockId) return;
     blockEditorRef.current?.focusField({
@@ -2312,7 +2630,7 @@ function PreviewEditorSidebar({
       itemIndex: req.itemIndex ?? void 0
     });
     uiStore.getState().clearFocus();
-  }, [focusRequest, uiStore]);
+  }, [entryData, focusRequest, uiStore]);
   const metadataSectionContent = useMemo(() => {
     if (!pageId && !entryData) return null;
     return /* @__PURE__ */ jsx(
@@ -2360,6 +2678,7 @@ function PreviewEditorSidebar({
       linkedEntrySection,
       mediaAssets,
       widgets: contentFormWidgets,
+      sdkConfig: sdkConfig ?? null,
       viewportMode,
       viewportWidth,
       zoom,

package/dist/{PreviewEditorUI-AXZG2SDC.mjs → PreviewEditorUI-I4BQUU6K.mjs}

@@ -1,7 +1,7 @@
 "use client";
-import { resolvePreviewChromeSurface, usePreviewPageDesignEditorState, PREVIEW_CHROME_PORTAL_CLASS_NAME, PREVIEW_CHROME_THEME_CLASS_NAME, applyPreviewChromeSurfaceToElement, setPreviewSidebarTab } from './chunk-HKB6XVIP.mjs';
-import { useEntryEditorController, useEditorUiStore, useMultiAutosave, usePreviewDesignHistoryOrder, useSiteChromeCustomizeOptional, selectPreviewDesignHistoryDomain, EditorChrome, previewDesignHistoryDomainForCommand, classifyHistoryShortcut, previewAssistantEnabled, unwrapResponse, cn, Dialog, Button, Palette, DialogContent, DialogHeader, DialogTitle, DialogDescription, TriangleAlert, Pencil, Sparkles, useEditorUiStoreInstance } from './chunk-XQR6THQJ.mjs';
-import { usePreviewAuth, getDashboardBaseUrl } from './chunk-FIREV57T.mjs';
+import { resolvePreviewChromeSurface, usePreviewPageDesignEditorState, PREVIEW_CHROME_PORTAL_CLASS_NAME, PREVIEW_CHROME_THEME_CLASS_NAME, applyPreviewChromeSurfaceToElement, setPreviewSidebarTab } from './chunk-6X2OVO3S.mjs';
+import { useEntryEditorController, useEditorUiStore, useMultiAutosave, usePreviewDesignHistoryOrder, useSiteChromeCustomizeOptional, selectPreviewDesignHistoryDomain, EditorChrome, previewDesignHistoryDomainForCommand, classifyHistoryShortcut, previewAssistantEnabled, unwrapResponse, cn, Dialog, Button, Palette, DialogContent, DialogHeader, DialogTitle, DialogDescription, TriangleAlert, Pencil, Sparkles, useEditorUiStoreInstance } from './chunk-MSHZO4SL.mjs';
+import { usePreviewAuth, getDashboardBaseUrl } from './chunk-LBBPD2IW.mjs';
 import './chunk-R7POPVJR.mjs';
 import { useState, useMemo, useCallback, useEffect, useTransition } from 'react';
 import { createPortal } from 'react-dom';

package/dist/SdkPreviewModeRuntime-MCKMVDTK.mjs

@@ -0,0 +1,8 @@
+"use client";
+export { SdkPreviewModeRuntime } from './chunk-HFMGVJCE.mjs';
+import './chunk-3LXFQS7T.mjs';
+import './chunk-5E33VO6J.mjs';
+import './chunk-6X2OVO3S.mjs';
+import './chunk-MSHZO4SL.mjs';
+import './chunk-LBBPD2IW.mjs';
+import './chunk-R7POPVJR.mjs';