@riverbankcms/sdk 0.109.0 → 0.111.0

package/dist/{PreviewEditorSidebar-DWqwfy3_.mjs → PreviewEditorSidebar-CTR6LUhN.mjs}

@@ -1,9 +1,9 @@
 "use client";
-import { $d as SlidersHorizontal, $l as Popover, A as deriveStyleConfiguratorCapabilities, Aa as paletteColorsEqual, Au as Surface, B as previewButtonPersonality, Ct as useEntryController, D as committedPaletteForSnapshot, Da as findCuratedPalette, Dt as useEditorUiStoreInstance, E as cancelPreview, Ea as curatedPalettes, Et as useEditorUiStore, F as markApplySaving, Ff as ChevronRight, Fu as DropdownMenuSeparator, G as previewSitePalette, Gl as Select, H as previewFooterLook, Ht as resolvePageRouteSlug, I as openRow, If as ChevronLeft, Iu as DropdownMenuTrigger, J as resetTypographyToSaved, Jl as SelectTrigger, K as previewSiteStyle, Kl as SelectContent, L as paletteMutationCapability, M as isPreviewingChange, Mu as DropdownMenuContent, N as markApplyFailed, Nu as DropdownMenuItem, O as createPalette, Oa as buildPaletteLibraryReadModel, Od as assertNever$1, P as markApplySaved, Pu as DropdownMenuLabel, Q as toggleRow, Qd as Smartphone, Ql as SearchInput, Qt as FormRenderer, Qu as Button, R as palettePreviewProjection, Rf as Check, T as applyTypographyDraftPatch, U as previewHeaderLayout, Ud as X$1, Ut as resolveContentTitle, V as previewCuratedPalette, Vi as getCuratedSiteStyle, Vt as deriveRouteMetadataPresentation, W as previewHeaderStyle, X as styleConfiguratorHistoryEntryForPersistedSelection, Y as setPaletteColors, Yd as Tablet, Yl as SelectValue, Yt as ManifestForm, Z as syncStyleConfiguratorState, Zt as createManifestValidation, _ as planSiteChromeFooterLayoutSelection, aa as requireEntriesForCuratedChoices, at as createOptimisticActionRunner, au as TabsList, bt as useUISelector, bu as CollapsibleContent, c as selectionSnapshotFromApplySiteStyleSelectionResponse, ca as getHeaderLayout, cf as Monitor, d as PREVIEW_DESIGN_REFRESH_ERROR_MESSAGE, df as LoaderCircle, dn as listEntryPageContentSlots, en as createStoreBackend, eu as PopoverContent, f as PREVIEW_DESIGN_SAVE_ERROR_MESSAGE, g as cycleableSiteChromeOptions, h as cycleSiteChromeLookId, if as Plus, iu as TabsContent, j as dismissWarnings, ja as paletteColorsSchema, ju as DropdownMenu, k as createStyleConfiguratorState, ka as paletteColorEntries, l as resolveStyleConfiguratorInitialSnapshot, la as getHeaderStyle, m as buildSiteChromeLookModels, n as useSiteChromeCustomizeOptional, nl as buttonPersonalities, nu as Input, oa as findFooterLook, ot as resolvePreviewSidebarTab, ou as TabsTrigger, p as reportPreviewDesignError, q as reconcilePaletteLibraryActive, ql as SelectItem, rl as findButtonPersonality, ru as Tabs, s as buildApplySiteStyleSelectionBody, sa as getFooterLayout, sd as unsafeAsEditorBlockId, st as FooterComposerPanel, td as cn, tu as PopoverTrigger, u as PREVIEW_DESIGN_LOAD_ERROR_MESSAGE, uf as Maximize2, v as planSiteChromeLookSelection, w as applyResolvedSelections, x as usePreviewDesignCoordinator, xu as CollapsibleTrigger, y as planSiteStylePreviewChange, yt as ContentFieldsForm, yu as Collapsible, z as prepareStalePaletteRetry, zi as curatedSiteStyles } from "./SiteChromeCustomizeContext-DUpalEdL.mjs";
-import { d as unwrapResponse, f as getDashboardUrl, r as usePreviewAuth } from "./previewAuthStore-CTO7CRPk.mjs";
-import { C as buildFontPreviewUrl, D as Callout, O as CalloutDescription, S as isAdapterReferenceKind, T as getSiteFontsStorageUrl, _ as usePreviewBlockCustomizeSelectionOptional, b as previewWidgetOverrides, d as buildPreviewDashboardSetupUrl, f as resolvePreviewDashboardSetupHandoff, g as canInspectSiteStyle, h as canApplySiteStyle, m as resolvePreviewSidebarChromeModel, p as resolvePreviewEditorGuidanceModel, v as useBlockCustomizeControls, w as generateFontFaceCss, x as BlockEditor, y as PreviewFormProvider } from "./SdkPreviewModeRuntime-D8Gt9Gbe.mjs";
-import { t as Separator } from "./separator-CI5wZNXT.mjs";
-import React, { forwardRef, useCallback, useEffect, useId, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore, useTransition } from "react";
+import { $t as createStoreBackend, A as dismissWarnings, Ad as assertNever$1, B as previewCuratedPalette, Bf as Check, Bi as getCuratedSiteStyle, Bt as deriveRouteMetadataPresentation, C as applyResolvedSelections, Ca as curatedPalettes, Cu as CollapsibleTrigger, D as createPalette, Da as paletteColorsEqual, E as committedPaletteForSnapshot, Ea as paletteColorEntries, Et as useEditorUiStoreInstance, F as openRow, Fu as DropdownMenuItem, G as previewSiteStyle, Gd as X$1, H as previewHeaderLayout, Ht as resolveContentTitle, I as paletteMutationCapability, Iu as DropdownMenuLabel, J as setPaletteColors, Jl as SelectContent, Jt as ManifestForm, K as reconcilePaletteLibraryActive, L as palettePreviewProjection, Lf as ChevronRight, Lu as DropdownMenuSeparator, M as markApplyFailed, Mu as Surface, N as markApplySaved, Nu as DropdownMenu, O as createStyleConfiguratorState, Oa as paletteColorsSchema, P as markApplySaving, Pu as DropdownMenuContent, R as prepareStalePaletteRetry, Rf as ChevronLeft, Ri as curatedSiteStyles, Ru as DropdownMenuTrigger, St as useEntryController, Su as CollapsibleContent, T as cancelPreview, Ta as buildPaletteLibraryReadModel, Tt as useEditorUiStore, U as previewHeaderStyle, V as previewFooterLook, Vt as resolvePageRouteSlug, W as previewSitePalette, X as syncStyleConfiguratorState, Xl as SelectTrigger, Xt as createManifestValidation, Y as styleConfiguratorHistoryEntryForPersistedSelection, Yl as SelectItem, Z as toggleRow, Zd as Tablet, Zl as SelectValue, Zt as FormRenderer, _ as planSiteChromeLookSelection, aa as getHeaderLayout, al as updateButtonStyleSelectionChoice, at as resolvePreviewSidebarTab, au as Tabs, b as usePreviewDesignCoordinator, c as selectionSnapshotFromApplySiteStyleSelectionResponse, cu as TabsTrigger, d as PREVIEW_DESIGN_REFRESH_ERROR_MESSAGE, ed as Button, ef as Smartphone, eu as SearchInput, f as PREVIEW_DESIGN_SAVE_ERROR_MESSAGE, ff as Maximize2, g as cycleableSiteChromeOptions, h as cycleSiteChromeLookId, ia as findFooterLook, il as resolveButtonStyleSelection, it as createOptimisticActionRunner, iu as Input, j as isPreviewingChange, k as deriveStyleConfiguratorCapabilities, l as resolveStyleConfiguratorInitialSnapshot, ld as unsafeAsEditorBlockId, m as buildSiteChromeLookModels, n as useSiteChromeCustomizeOptional, nl as buttonStyleSelectionParameterValue, nu as PopoverContent, oa as getHeaderStyle, of as Plus, ol as buttonStyleSelectionKey, ot as FooterComposerPanel, ou as TabsContent, p as reportPreviewDesignError, pf as LoaderCircle, q as resetTypographyToSaved, ql as Select, rd as cn, rl as findButtonStyleRecipe, ru as PopoverTrigger, s as buildApplySiteStyleSelectionBody, su as TabsList, tf as SlidersHorizontal, tu as Popover, u as PREVIEW_DESIGN_LOAD_ERROR_MESSAGE, uf as Monitor, un as listEntryPageContentSlots, v as planSiteStylePreviewChange, vl as themeButtonClassName, vt as ContentFieldsForm, w as applyTypographyDraftPatch, wa as findCuratedPalette, xu as Collapsible, yt as useUISelector, z as previewButtonStyle } from "./SiteChromeCustomizeContext-DOSDLCiJ.mjs";
+import { d as unwrapResponse, f as getDashboardUrl, r as usePreviewAuth } from "./previewAuthStore-BkT1D06A.mjs";
+import { C as generateFontFaceCss, D as Callout, O as CalloutDescription, S as buildFontPreviewUrl, T as ThemeScope, _ as useBlockCustomizeControls, b as BlockEditor, d as resolvePreviewDashboardSetupHandoff, f as resolvePreviewEditorGuidanceModel, g as usePreviewBlockCustomizeSelectionOptional, h as canInspectSiteStyle, m as canApplySiteStyle, p as resolvePreviewSidebarChromeModel, u as buildPreviewDashboardSetupUrl, v as PreviewFormProvider, w as getSiteFontsStorageUrl, x as isAdapterReferenceKind, y as previewWidgetOverrides } from "./SdkPreviewModeRuntime-DeOTAFvR.mjs";
+import { t as Separator } from "./separator-Bln8izQ9.mjs";
+import React, { createContext, forwardRef, useCallback, useContext, useEffect, useId, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore, useTransition } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { useRouter } from "next/navigation.js";
@@ -1563,13 +1563,27 @@ function formatBlockKindLabel(blockKind) {
 	return blockKind.replace(/^block\./, "").replace(/^custom\./, "").replace(/[-_]+/g, " ");
 }
 //#endregion
+//#region ../preview-next/src/client/preview/PreviewDesignOpenRequestContext.tsx
+const PreviewDesignOpenRequestContext = createContext(null);
+function PreviewDesignOpenRequestProvider({ request, children }) {
+	return /* @__PURE__ */ jsx(PreviewDesignOpenRequestContext.Provider, {
+		value: request,
+		children
+	});
+}
+function usePreviewDesignOpenRequest() {
+	return useContext(PreviewDesignOpenRequestContext);
+}
+//#endregion
 //#region ../preview-next/src/client/preview/PageBlockEditorPanel.tsx
-function PageBlockEditorPanel({ siteId, pageId, dashboardBaseUrl, theme, apiClient, bearerToken, supabaseUrl, blockItems, uiStoreForBlockEditor, blockEditorRef, onBlocksChange, metadataPanel, linkedEntrySection, designPanel, designOpenRequestId = null, designTakeoverActive = false, sdkConfig, mediaAssets, bookingOfferingPresets, viewportMode, viewportWidth, zoom, onViewportModeChange, onViewportWidthChange, onZoomChange }) {
+function PageBlockEditorPanel({ siteId, pageId, dashboardBaseUrl, theme, apiClient, bearerToken, supabaseUrl, blockItems, uiStoreForBlockEditor, blockEditorRef, onBlocksChange, metadataPanel, linkedEntrySection, designPanel, designTakeoverActive = false, sdkConfig, mediaAssets, bookingOfferingPresets, viewportMode, viewportWidth, zoom, onViewportModeChange, onViewportWidthChange, onZoomChange }) {
 	const customizeSelection = usePreviewBlockCustomizeSelectionOptional();
 	const [designOpen, setDesignOpen] = useState(false);
 	const [customizeOpen, setCustomizeOpen] = useState(false);
 	const [contentOpen, setContentOpen] = useState(true);
 	const [detailsOpen, setDetailsOpen] = useState(false);
+	const pendingDesignOpenRequest = useUISelector(uiStoreForBlockEditor, (state) => state.previewDesignOpenRequest);
+	const [designOpenRequest, setDesignOpenRequest] = useState(null);
 	const designSectionRef = useRef(null);
 	const customizeSectionRef = useRef(null);
 	const selectionKind = customizeSelection?.selection.kind;
@@ -1598,13 +1612,15 @@ function PageBlockEditorPanel({ siteId, pageId, dashboardBaseUrl, theme, apiClie
 		}
 	}, [selectionKind, selectionRequestId]);
 	useEffect(() => {
-		if (designOpenRequestId === null) return;
+		if (!pendingDesignOpenRequest) return;
+		setDesignOpenRequest(pendingDesignOpenRequest);
 		setDesignOpen(true);
 		designSectionRef.current?.scrollIntoView({
 			block: "start",
 			behavior: "smooth"
 		});
-	}, [designOpenRequestId]);
+		uiStoreForBlockEditor.getState().consumePreviewDesignOpenRequest(pendingDesignOpenRequest.requestId);
+	}, [pendingDesignOpenRequest, uiStoreForBlockEditor]);
 	return /* @__PURE__ */ jsxs("div", {
 		className: "flex h-full min-h-0 flex-col overflow-hidden",
 		children: [/* @__PURE__ */ jsx("div", {
@@ -1661,7 +1677,10 @@ function PageBlockEditorPanel({ siteId, pageId, dashboardBaseUrl, theme, apiClie
 								className: designTakeoverActive ? "min-h-0 flex-1 data-[state=open]:h-full data-[state=open]:overflow-hidden" : void 0,
 								children: /* @__PURE__ */ jsx("div", {
 									className: designTakeoverActive ? "h-full min-h-0" : "px-4 pb-4",
-									children: designPanel
+									children: /* @__PURE__ */ jsx(PreviewDesignOpenRequestProvider, {
+										request: designOpenRequest,
+										children: designPanel
+									})
 								})
 							})]
 						})
@@ -1794,8 +1813,8 @@ function PreviewEditorGuidanceCard({ guidance, completeSetupDisabled, onComplete
 * Hex colour helpers shared by every palette-editing surface (Macadamia
 * onboarding swatches, the LiveThemeEditor, the Style configurator advanced
 * row). Consolidates three prior duplicates: `normalizeColorPickerValue` in
-* Macadamia, `normalizeHex` + `contrastRatio` in `theme-editor/utils.ts`, and
-* the inline regex in `updateColorRole`.
+* Macadamia, `normalizeHex` + `contrastRatio` formerly in
+* `theme-editor/utils.ts`, and the inline regex in `updateColorRole`.
 *
 * Pure functions; no DOM, no React.
 */
@@ -1805,7 +1824,7 @@ function PreviewEditorGuidanceCard({ guidance, completeSetupDisabled, onComplete
 * without a leading `#`; returns `fallback` for any other shape (empty
 * string, garbage, characters outside `[0-9a-f]`, wrong length, etc.). Pass
 * a `fallback` to make the fallback explicit at the call site — defaulting
-* to `'#000000'` keeps the legacy `theme-editor/utils.ts` semantics.
+* to `'#000000'` preserves the former theme-editor helper semantics.
 */
 function normalizeHex(input, fallback = "#000000") {
 	if (!input) return fallback;
@@ -2078,6 +2097,102 @@ function ContrastSwatch({ hex, label }) {
 	});
 }
 //#endregion
+//#region ../preview-next/src/client/preview/ButtonStylePicker.tsx
+function ButtonStylePicker({ selections, current, previewTheme, onPreview, disabled }) {
+	const recipe = findButtonStyleRecipe(current.styleId);
+	return /* @__PURE__ */ jsxs("div", {
+		className: "space-y-3",
+		children: [/* @__PURE__ */ jsx("div", {
+			role: "radiogroup",
+			"aria-label": "Button style",
+			className: "grid grid-cols-1 gap-2",
+			children: selections.map((selection) => {
+				const optionRecipe = findButtonStyleRecipe(selection.styleId);
+				const selected = selection.styleId === current.styleId;
+				return /* @__PURE__ */ jsxs("label", {
+					className: cn("relative block cursor-pointer rounded-md border p-2 transition has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-ring has-[:focus-visible]:ring-offset-2", selected ? "border-foreground bg-accent/40 shadow-sm" : "border-border bg-background hover:border-foreground/40 hover:bg-accent/20", disabled && "cursor-not-allowed opacity-60"),
+					children: [
+						/* @__PURE__ */ jsx("input", {
+							type: "radio",
+							name: "button-style",
+							value: selection.styleId,
+							checked: selected,
+							onChange: () => onPreview(selection),
+							disabled,
+							className: "absolute inset-0 z-10 h-full w-full cursor-pointer opacity-0 disabled:cursor-not-allowed"
+						}),
+						/* @__PURE__ */ jsx("span", {
+							className: "sr-only",
+							children: optionRecipe.accessibilityLabel
+						}),
+						/* @__PURE__ */ jsx(ButtonStylePreviewPair, {
+							selection: selected ? current : selection,
+							previewTheme
+						})
+					]
+				}, buttonStyleSelectionKey(selection));
+			})
+		}), recipe.controls.map((control) => {
+			const currentValue = buttonStyleSelectionParameterValue(current, control.parameter);
+			return /* @__PURE__ */ jsxs("fieldset", {
+				className: "space-y-2 rounded-md border border-border p-3",
+				disabled,
+				children: [/* @__PURE__ */ jsx("legend", {
+					className: "px-1 text-xs font-medium",
+					children: control.label
+				}), /* @__PURE__ */ jsx("div", {
+					className: "grid grid-cols-2 gap-2",
+					children: control.options.map((option) => /* @__PURE__ */ jsxs("label", {
+						className: cn("relative cursor-pointer rounded-md border px-2 py-1.5 text-center text-xs has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-ring has-[:focus-visible]:ring-offset-2", currentValue === option.value ? "border-foreground bg-accent/40" : "border-border hover:border-foreground/40"),
+						children: [/* @__PURE__ */ jsx("input", {
+							type: "radio",
+							name: `button-style-${current.styleId}-${control.parameter}`,
+							value: option.value,
+							checked: currentValue === option.value,
+							onChange: () => {
+								const updated = updateButtonStyleSelectionChoice(current, control.parameter, option.value);
+								if (updated.kind === "updated") onPreview(updated.selection);
+							},
+							className: "absolute inset-0 z-10 h-full w-full cursor-pointer opacity-0 disabled:cursor-not-allowed"
+						}), option.label]
+					}, option.value))
+				})]
+			}, control.parameter);
+		})]
+	});
+}
+function ButtonStylePreviewPair({ selection, previewTheme, compact = false }) {
+	const resolved = resolveButtonStyleSelection(selection);
+	if (resolved.kind === "error") return null;
+	return /* @__PURE__ */ jsx(ThemeScope, {
+		theme: {
+			...previewTheme,
+			buttons: resolved.buttonSystem
+		},
+		themeId: `button-style-preview-${encodeURIComponent(buttonStyleSelectionKey(selection))}`,
+		className: cn("relative overflow-hidden bg-transparent", compact ? "h-7" : "h-11"),
+		children: /* @__PURE__ */ jsxs("span", {
+			className: cn("absolute left-0 top-1/2 flex w-[142%] -translate-y-1/2 origin-left items-center gap-2", compact ? "scale-[0.56]" : "scale-[0.7]"),
+			"aria-hidden": "true",
+			children: [/* @__PURE__ */ jsx("span", {
+				className: themeButtonClassName({
+					variant: "primary",
+					size: "sm",
+					extraClassName: "inline-flex shrink-0 items-center justify-center whitespace-nowrap"
+				}),
+				children: "Get started"
+			}), /* @__PURE__ */ jsx("span", {
+				className: themeButtonClassName({
+					variant: "secondary",
+					size: "sm",
+					extraClassName: "inline-flex shrink-0 items-center justify-center whitespace-nowrap"
+				}),
+				children: "Learn more"
+			})]
+		})
+	});
+}
+//#endregion
 //#region ../preview-next/src/client/preview/typographyFontCatalog.ts
 const typographyFontCategories = [
 	{
@@ -3092,7 +3207,8 @@ const PALETTE_SURFACE_ROLES = [
 		label: "Border"
 	}
 ];
-function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVersion = null, selectionUpdatedAt, initialSelections, headerSelectionContext, footerSelectionContext, expandedRowRequest = null, onFocusedSurfaceChange, siteStyleAccess }) {
+function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVersion = null, selectionUpdatedAt, initialSelections, headerSelectionContext, onFocusedSurfaceChange, siteStyleAccess }) {
+	const designOpenRequest = usePreviewDesignOpenRequest();
 	const router = useRouter();
 	const previewDesign = usePreviewDesignCoordinator();
 	const siteChromeCustomize = useSiteChromeCustomizeOptional();
@@ -3106,10 +3222,8 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 			selectionVersion: initialSelections.selectionVersion ?? selectionVersion ?? 0,
 			selectionUpdatedAt: initialSelections.selectionUpdatedAt ?? selectionUpdatedAt ?? null
 		},
-		headerSelectionContext,
-		footerSelectionContext
+		headerSelectionContext
 	}), [
-		footerSelectionContext,
 		headerSelectionContext,
 		theme,
 		initialSelections,
@@ -3170,8 +3284,7 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 			siteStyle,
 			selection: state.previewed,
 			baseTheme: theme,
-			headerSelectionContext,
-			footerSelectionContext
+			headerSelectionContext
 		}).themeOverlay, "site-style");
 	}, [
 		state,
@@ -3179,7 +3292,6 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 		clearPreview,
 		previewTheme,
 		headerSelectionContext,
-		footerSelectionContext,
 		theme
 	]);
 	useEffect(() => {
@@ -3190,14 +3302,14 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 		};
 	}, []);
 	useEffect(() => {
-		if (!expandedRowRequest) return;
-		if (appliedExpandedRowRequestIdRef.current === expandedRowRequest.id) return;
+		if (!designOpenRequest) return;
+		if (appliedExpandedRowRequestIdRef.current === designOpenRequest.requestId) return;
 		setState((current) => {
 			if (!current) return current;
-			appliedExpandedRowRequestIdRef.current = expandedRowRequest.id;
-			return openRow(current, expandedRowForPreviewDesignRow(expandedRowRequest.row));
+			appliedExpandedRowRequestIdRef.current = designOpenRequest.requestId;
+			return openRow(current, expandedRowForPreviewDesignRow(designOpenRequest.row));
 		});
-	}, [expandedRowRequest, hasLoadedState]);
+	}, [designOpenRequest, hasLoadedState]);
 	const handlePreviewSiteStyle = useCallback((siteStyleId) => {
 		setState((current) => {
 			if (!current) return current;
@@ -3208,8 +3320,7 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 				siteStyle,
 				selection: next.previewed,
 				baseTheme: theme,
-				headerSelectionContext,
-				footerSelectionContext
+				headerSelectionContext
 			});
 			return applyResolvedSelections(next, {
 				resolved: {
@@ -3219,13 +3330,9 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 				warnings: result.warnings
 			});
 		});
-	}, [
-		footerSelectionContext,
-		headerSelectionContext,
-		theme
-	]);
-	const handlePreviewPersonality = useCallback((id) => {
-		setState((current) => current ? previewButtonPersonality(current, id) : current);
+	}, [headerSelectionContext, theme]);
+	const handlePreviewButtonStyle = useCallback((id) => {
+		setState((current) => current ? previewButtonStyle(current, id) : current);
 	}, []);
 	const handlePreviewHeaderLayout = useCallback((id) => {
 		if (!id) return;
@@ -3243,25 +3350,6 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 		if (plan.kind !== "footer") return;
 		setState((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 handlePreviewPaletteItem = useCallback((item) => {
 		setState((current) => {
 			if (!current) return current;
@@ -3289,15 +3377,10 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 				siteStyle,
 				selection: current.previewed,
 				baseTheme: theme,
-				headerSelectionContext,
-				footerSelectionContext
+				headerSelectionContext
 			}).themeOverlay.typography, patch);
 		});
-	}, [
-		footerSelectionContext,
-		headerSelectionContext,
-		theme
-	]);
+	}, [headerSelectionContext, theme]);
 	const handleHeadingTypographyChange = useCallback((patch) => {
 		patchTypography({
 			kind: "heading",
@@ -3416,7 +3499,6 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 		});
 	}, [
 		apiClient,
-		footerSelectionContext,
 		headerSelectionContext,
 		applyFailed,
 		applyStarted,
@@ -3442,29 +3524,26 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 		className: "text-sm text-muted-foreground",
 		children: "This site uses a Site Style that cannot be configured here."
 	});
-	const currentPersonality = findButtonPersonality(state.previewed.buttonPersonalityId);
 	const currentPalette = palettePreviewProjection(state.previewed.palette);
 	const paletteMutation = paletteMutationCapability(state);
 	const paletteControlsDisabled = saving || !stagedCapabilities.canPreviewStaged || paletteMutation.kind !== "editable";
 	const currentCuratedValueKey = currentPalette.kind === "curated" ? currentPalette.valueKey : currentPalette.kind === "curated-fork" ? currentPalette.sourceValueKey : null;
 	const currentCuratedPalette = currentCuratedValueKey ? findCuratedPalette(currentCuratedValueKey) : null;
 	const paletteIsCustom = currentPalette.kind !== "invalid" && (!currentCuratedPalette || currentPalette.mode !== currentCuratedPalette.mode || !paletteColorsEqual(currentPalette.colors, currentCuratedPalette.colors));
-	const currentTypography = planSiteStylePreviewChange({
+	const currentPreviewPlan = planSiteStylePreviewChange({
 		siteStyle: currentSiteStyle,
 		selection: state.previewed,
 		baseTheme: theme,
-		headerSelectionContext,
-		footerSelectionContext
-	}).themeOverlay.typography;
+		headerSelectionContext
+	});
+	const currentTypography = currentPreviewPlan.themeOverlay.typography;
 	const chromeLookModels = buildSiteChromeLookModels({
 		state,
 		siteStyle: currentSiteStyle,
-		headerSelectionContext,
-		footerSelectionContext
+		headerSelectionContext
 	});
 	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);
 	const headerSurfaceState = siteChromeCustomize?.getSurfaceState("header") ?? { kind: "unavailable" };
 	if (state.expandedRow === "typography" && typographySurface.kind !== "overview") return /* @__PURE__ */ jsxs("div", {
@@ -3557,32 +3636,14 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 				}) : null
 			}),
 			/* @__PURE__ */ jsx(SiteChromeLookRow, {
-				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: aggregateMutationControlsDisabled
-			}),
-			/* @__PURE__ */ jsx(SiteChromeLookRow, {
-				label: "Footer look",
-				ariaLabel: "Footer look",
-				defaultDescription: "Use the footer look chosen for this site style.",
+				label: "Footer links",
+				ariaLabel: "Footer link treatment",
+				defaultDescription: "Use the footer link treatment chosen for this site style.",
 				expanded: state.expandedRow === "footer",
 				onToggle: () => handleToggleRow("footer"),
 				currentId: state.previewed.footerLookId,
-				currentLabel: state.previewed.footerLookId ? currentFooterLook?.label ?? "Unknown footer Look" : `${currentFooterLook?.label ?? "Site style"} (default)`,
-				scopeDescription: "Changes the footer on every page.",
+				currentLabel: state.previewed.footerLookId ? currentFooterLook?.label ?? "Unknown footer link treatment" : `${currentFooterLook?.label ?? "Site style"} (default)`,
+				scopeDescription: "Changes footer navigation links on every page.",
 				options: chromeLookModels.footer.options,
 				diagnostics: chromeLookModels.footer.diagnostics,
 				onCycle: (direction) => {
@@ -3592,13 +3653,13 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 				onPreview: handlePreviewFooterLook,
 				disabled: aggregateMutationControlsDisabled
 			}),
-			/* @__PURE__ */ jsx(PersonalityRow, {
+			/* @__PURE__ */ jsx(ButtonStyleRow, {
 				expanded: state.expandedRow === "buttons",
 				onToggle: () => handleToggleRow("buttons"),
 				siteStyle: currentSiteStyle,
-				currentId: state.previewed.buttonPersonalityId,
-				currentLabel: currentPersonality?.name ?? state.previewed.buttonPersonalityId,
-				onPreview: handlePreviewPersonality,
+				current: state.previewed.buttonStyleSelection,
+				previewTheme: currentPreviewPlan.themeOverlay,
+				onPreview: handlePreviewButtonStyle,
 				disabled: aggregateMutationControlsDisabled
 			}),
 			/* @__PURE__ */ jsx(TypographyRow, {
@@ -3687,7 +3748,7 @@ function StyleConfiguratorSaveControls({ previewingChange, applyAllowed, saving,
 		}) : null
 	] });
 }
-function StyleRowFrame({ label, currentLabel, swatch, expanded, onToggle, children }) {
+function StyleRowFrame({ label, currentLabel, currentSummary, swatch, expanded, onToggle, children }) {
 	return /* @__PURE__ */ jsx(Collapsible, {
 		open: expanded,
 		onOpenChange: onToggle,
@@ -3706,7 +3767,10 @@ function StyleRowFrame({ label, currentLabel, swatch, expanded, onToggle, childr
 							children: [/* @__PURE__ */ jsx("div", {
 								className: "text-xs uppercase tracking-wide text-muted-foreground",
 								children: label
-							}), /* @__PURE__ */ jsx("div", {
+							}), currentSummary ? /* @__PURE__ */ jsx("div", {
+								"aria-label": currentLabel,
+								children: currentSummary
+							}) : /* @__PURE__ */ jsx("div", {
 								className: "truncate text-sm font-medium",
 								children: currentLabel
 							})]
@@ -3745,23 +3809,23 @@ function SiteStyleRow({ expanded, onToggle, current, onPreview, disabled }) {
 		})
 	});
 }
-function PersonalityRow({ expanded, onToggle, siteStyle, currentId, currentLabel, onPreview, disabled }) {
+function ButtonStyleRow({ expanded, onToggle, siteStyle, current, previewTheme, onPreview, disabled }) {
 	return /* @__PURE__ */ jsx(StyleRowFrame, {
 		label: "Button style",
-		currentLabel,
+		currentLabel: findButtonStyleRecipe(current.styleId).accessibilityLabel,
+		currentSummary: /* @__PURE__ */ jsx(ButtonStylePreviewPair, {
+			selection: current,
+			previewTheme,
+			compact: true
+		}),
 		expanded,
 		onToggle,
-		children: /* @__PURE__ */ jsx("ul", {
-			role: "radiogroup",
-			"aria-label": "Button style",
-			className: "list-none space-y-1 p-0",
-			children: useMemo(() => requireEntriesForCuratedChoices(buttonPersonalities, siteStyle.buttonPersonalityChoices), [siteStyle.buttonPersonalityChoices]).map((personality) => /* @__PURE__ */ jsx(PickerOption, {
-				selected: personality.id === currentId,
-				label: personality.name,
-				description: personality.description,
-				onSelect: () => onPreview(personality.id),
-				disabled
-			}, personality.id))
+		children: /* @__PURE__ */ jsx(ButtonStylePicker, {
+			selections: siteStyle.buttonStyleChoices,
+			current,
+			previewTheme,
+			onPreview,
+			disabled
 		})
 	});
 }
@@ -4197,7 +4261,6 @@ function expandedRowForPreviewDesignRow(row) {
 		case "header": return "header-layout";
 		case "header-layout":
 		case "header-style":
-		case "footer-layout":
 		case "footer": return row;
 		default: return assertNever$1(row, "Unhandled preview design row");
 	}
@@ -4221,11 +4284,11 @@ function WarningNotice({ warnings, onDismiss }) {
 	});
 }
 function describeWarning(warning) {
-	return `Button style changed to ${warning.fellBackTo} because ${warning.requested} is not offered for this site style.`;
+	return `Button style changed to ${warning.fellBackTo.styleId} because ${warning.requested} is not offered for this site style.`;
 }
 //#endregion
 //#region ../preview-next/src/client/preview/PreviewEditorSidebar.tsx
-function PreviewEditorSidebar({ surfaceId, siteId, dashboardBaseUrl = null, pageId, entryData, contentTypeSchema, referenceContentTypeKeys = [], draftContent, currentTemplate, theme, themeId = null, themeSelectionId = null, themeSelectionVersion = null, themeSelectionUpdatedAt = null, themeSelectionButtonPersonalityId = null, runtimePaletteState, themeSelectionHeaderLayoutId = null, themeSelectionHeaderStyleId = null, themeSelectionHeaderLookId = null, themeSelectionFooterLookId = null, themeSelectionHeaderContext, themeSelectionFooterContext, designRowRequest = null, apiClient, bearerToken, supabaseUrl, entrySubrouteContext, assistantPanel, sdkConfig, mediaAssets, bookingOfferingPresets, siteStyleAccess = { kind: "hidden" }, activeTab, onTabChange, onClose, onFooterSaved, viewportMode, viewportWidth, zoom, onViewportModeChange, onViewportWidthChange, onZoomChange }) {
+function PreviewEditorSidebar({ surfaceId, siteId, dashboardBaseUrl = null, pageId, entryData, contentTypeSchema, referenceContentTypeKeys = [], draftContent, currentTemplate, theme, themeId = null, themeSelectionId = null, themeSelectionVersion = null, themeSelectionUpdatedAt = null, themeSelectionButtonStyleSelection = null, runtimePaletteState, themeSelectionHeaderLayoutId = null, themeSelectionHeaderStyleId = null, themeSelectionHeaderLookId = null, themeSelectionFooterLookId = null, themeSelectionHeaderContext, apiClient, bearerToken, supabaseUrl, entrySubrouteContext, assistantPanel, sdkConfig, mediaAssets, bookingOfferingPresets, siteStyleAccess = { kind: "hidden" }, activeTab, onTabChange, onClose, onFooterSaved, viewportMode, viewportWidth, zoom, onViewportModeChange, onViewportWidthChange, onZoomChange }) {
 	const controller = useEntryController();
 	const controllerBlocks = controller.blocks;
 	const uiStore = useEditorUiStoreInstance();
@@ -4352,7 +4415,6 @@ function PreviewEditorSidebar({ surfaceId, siteId, dashboardBaseUrl = null, page
 		blockEditorRef,
 		onBlocksChange: handleBlocksChange,
 		metadataPanel: metadataSectionContent,
-		designOpenRequestId: designRowRequest?.id ?? null,
 		designTakeoverActive,
 		designPanel: canInspectSiteStyle(siteStyleAccess) ? /* @__PURE__ */ jsx(StyleConfigurator, {
 			siteId,
@@ -4365,7 +4427,7 @@ function PreviewEditorSidebar({ surfaceId, siteId, dashboardBaseUrl = null, page
 			initialSelections: {
 				selectionVersion: themeSelectionVersion,
 				selectionUpdatedAt: themeSelectionUpdatedAt,
-				buttonPersonalityId: themeSelectionButtonPersonalityId,
+				buttonStyleSelection: themeSelectionButtonStyleSelection,
 				runtimePaletteState,
 				headerLayoutId: themeSelectionHeaderLayoutId,
 				headerStyleId: themeSelectionHeaderStyleId,
@@ -4373,8 +4435,6 @@ function PreviewEditorSidebar({ surfaceId, siteId, dashboardBaseUrl = null, page
 				footerLookId: themeSelectionFooterLookId
 			},
 			headerSelectionContext: themeSelectionHeaderContext,
-			footerSelectionContext: themeSelectionFooterContext,
-			expandedRowRequest: designRowRequest,
 			onFocusedSurfaceChange: setDesignTakeoverActive,
 			siteStyleAccess
 		}) : null,
@@ -4407,6 +4467,7 @@ function PreviewEditorSidebar({ surfaceId, siteId, dashboardBaseUrl = null, page
 			manageLinksHref: `${dashboardBaseUrl?.replace(/\/$/u, "") ?? ""}/dashboard/sites/${siteId}/navigation`,
 			manageSettingsHref: `${dashboardBaseUrl?.replace(/\/$/u, "") ?? ""}/dashboard/sites/${siteId}/settings`,
 			legalRegion: theme?.footer?.bottomBar?.enabled === true ? "separate" : "integrated",
+			loadingFallback: /* @__PURE__ */ jsx(ContentSpinner, { className: "py-8" }),
 			initialTarget: previewInspection.kind === "footer-module" ? {
 				kind: "module",
 				moduleId: previewInspection.moduleId

package/dist/{PreviewEditorUI-B7OL4sfR.mjs → PreviewEditorUI-DZg15Zip.mjs}

@@ -1,7 +1,7 @@
 "use client";
-import { $u as cva, Bl as TooltipContent, Cf as Eye, Dt as useEditorUiStoreInstance, Et as useEditorUiStore, Gd as Undo2, Hl as TooltipTrigger, Iu as DropdownMenuTrigger, Kd as TriangleAlert, Lf as ChevronDown, Lt as useMultiAutosave, Mu as DropdownMenuContent, Nu as DropdownMenuItem, Qu as Button, Tf as EllipsisVertical, Tt as classifyHistoryShortcut, Zd as Sparkles, _u as DialogHeader, a as previewDesignHistoryDomainForCommand, af as Pencil, df as LoaderCircle, fu as Dialog, hu as DialogDescription, i as usePreviewDesignHistoryOrder, ju as DropdownMenu, mu as DialogContent, n as useSiteChromeCustomizeOptional, o as selectPreviewDesignHistoryDomain, of as PenLine, rf as Redo2, sf as Palette, td as cn, vt as useEditor, vu as DialogTitle, wt as useEntryEditorController, zl as Tooltip } from "./SiteChromeCustomizeContext-DUpalEdL.mjs";
-import { d as unwrapResponse, r as usePreviewAuth } from "./previewAuthStore-CTO7CRPk.mjs";
-import { E as FixedBottomSurface, a as usePreviewPageDesignEditorState, c as applyPreviewChromeSurfaceToElement, l as resolvePreviewChromeSurface, o as PREVIEW_CHROME_PORTAL_CLASS_NAME, s as PREVIEW_CHROME_THEME_CLASS_NAME, u as setPreviewSidebarTab } from "./SdkPreviewModeRuntime-D8Gt9Gbe.mjs";
+import { $d as Sparkles, Ct as useEntryEditorController, Df as EllipsisVertical, Et as useEditorUiStoreInstance, Fu as DropdownMenuItem, Hl as TooltipContent, It as useMultiAutosave, Jd as TriangleAlert, Nu as DropdownMenu, Pu as DropdownMenuContent, Ru as DropdownMenuTrigger, Tf as Eye, Tt as useEditorUiStore, Vl as Tooltip, Wl as TooltipTrigger, _t as useEditor, _u as DialogDescription, a as previewDesignHistoryDomainForCommand, af as Redo2, bu as DialogTitle, cf as PenLine, ed as Button, gu as DialogContent, i as usePreviewDesignHistoryOrder, lf as Palette, mu as Dialog, n as useSiteChromeCustomizeOptional, o as selectPreviewDesignHistoryDomain, pf as LoaderCircle, qd as Undo2, rd as cn, sf as Pencil, td as cva, wt as classifyHistoryShortcut, yu as DialogHeader, zf as ChevronDown } from "./SiteChromeCustomizeContext-DOSDLCiJ.mjs";
+import { d as unwrapResponse, r as usePreviewAuth } from "./previewAuthStore-BkT1D06A.mjs";
+import { E as FixedBottomSurface, a as usePreviewPageDesignEditorState, c as applyPreviewChromeSurfaceToElement, l as resolvePreviewChromeSurface, o as PREVIEW_CHROME_PORTAL_CLASS_NAME, s as PREVIEW_CHROME_THEME_CLASS_NAME } from "./SdkPreviewModeRuntime-DeOTAFvR.mjs";
 import * as React$1 from "react";
 import { useCallback, useEffect, useMemo, useState, useTransition } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
@@ -395,7 +395,6 @@ function usePreviewSidebarControls() {
 			uiStore.getState().setDrawerOpen(false);
 			return;
 		}
-		setPreviewSidebarTab(tab);
 		uiStore.getState().setPreviewSidebarTab(tab);
 		uiStore.getState().setDrawerOpen(true);
 	}, [

package/dist/{PreviewQueryProvider-D0y2l8JN.mjs → PreviewQueryProvider-kkmjklLG.mjs}

@@ -1,5 +1,5 @@
 "use client";
-import { n as markPreviewAuthExpired, s as ApiRequestError } from "./previewAuthStore-CTO7CRPk.mjs";
+import { n as markPreviewAuthExpired, s as ApiRequestError } from "./previewAuthStore-BkT1D06A.mjs";
 import { createContext, useContext, useRef } from "react";
 import { jsx } from "react/jsx-runtime";
 import { MutationCache, QueryCache, QueryClient, QueryClientProvider } from "@tanstack/react-query";