@riverbankcms/sdk 0.102.0 → 0.104.0

package/dist/{PreviewEditorSidebar-BKkhhkJk.mjs → PreviewEditorSidebar-ywqcYjTB.mjs}

@@ -1,8 +1,8 @@
 "use client";
-import { $d as ChevronLeft, $l as DropdownMenuContent, A as markApplySaving, Ai as findTypographyPreset, B as setPaletteOverrides, Bl as Collapsible, Bt as ManifestForm, C as createStyleConfiguratorState, Cl as Input, D as isPreviewingChange, Di as getCuratedSiteStyle, Dl as TabsTrigger, Du as unsafeAsEditorBlockId, E as dismissWarnings, Ed as Monitor, El as TabsList, F as previewHeaderStyle, Fi as getHeaderLayout, Gt as createStoreBackend, H as syncStyleConfiguratorState, Hl as CollapsibleTrigger, Ht as createManifestValidation, I as previewPaletteVariant, Ii as getHeaderStyle, Ji as paletteVariants, L as previewSiteStyle, M as previewButtonPersonality, Mi as requireEntriesForCuratedChoices, Mt as deriveRouteMetadataPresentation, N as previewFooterLook, Nc as buttonPersonalities, Ni as findFooterLook, Nt as resolvePageRouteSlug, O as markApplyFailed, Od as Maximize2, P as previewHeaderLayout, Pc as findButtonPersonality, Pi as getFooterLayout, Pt as resolveContentTitle, Q as resolvePreviewSidebarTab, Qd as ChevronRight, Ql as DropdownMenu, R as previewTypographyPreset, S as cancelPreview, Sl as PopoverTrigger, Su as cn, T as dismissNotices, Ti as curatedSiteStyles, Tl as TabsContent, U as toggleRow, Ut as FormRenderer, V as styleConfiguratorHistoryEntryForPersistedSelection, Vl as CollapsibleContent, W as typographySelectionSnapshotFromFlat, Yi as paletteOverridesSchema, Z as createOptimisticActionRunner, Zl as Surface, _ as usePreviewDesignCoordinator, _d as Smartphone, _l as SelectValue, _t as useEditorUiStore, b as applyResolvedSelections, bl as Popover, c as selectionSnapshotFromApplySiteStyleSelectionResponse, cd as X$1, d as buildSiteChromeLookModels, dt as useUISelector, en as listEntryPageContentSlots, eu as DropdownMenuItem, f as cycleSiteChromeLookId, gl as SelectTrigger, h as planSiteChromeLookSelection, hl as SelectItem, j as openRow, ji as typographyPresets, k as markApplySaved, kd as LoaderCircle, ki as evaluateTypographyFontSlot, l as planSiteStylePreviewChange, m as planSiteChromeFooterLayoutSelection, md as Tablet, ml as SelectContent, mt as useEntryController, n as useSiteChromeCustomizeOptional, nu as DropdownMenuSeparator, p as cycleableSiteChromeOptions, pl as Select, qi as findPaletteVariant, qu as assertNever$1, ru as DropdownMenuTrigger, s as buildApplySiteStyleSelectionBody, tu as DropdownMenuLabel, u as resolveStyleConfiguratorInitialSnapshot, ut as ContentFieldsForm, vt as useEditorUiStoreInstance, w as deriveStyleConfiguratorCapabilities, wl as Tabs, x as applyTypographyDraftPatch, xl as PopoverContent, yu as Button, z as resetTypographyToSaved } from "./SiteChromeCustomizeContext-Bh9-DtMQ.mjs";
-import { d as unwrapResponse, f as getDashboardUrl, r as usePreviewAuth } from "./previewAuthStore-ByPPZqmp.mjs";
-import { S as isAdapterReferenceKind, T as CalloutDescription, _ 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 Callout, x as BlockEditor, y as PreviewFormProvider } from "./SdkPreviewModeRuntime-CA2k7Z_T.mjs";
-import { t as Separator } from "./separator-CRoP34pT.mjs";
+import { $i as getFooterLayout, A as openRow, Ai as getCuratedSiteStyle, Al as Input, B as setPaletteColors, Bc as buttonPersonalities, Bt as ManifestForm, C as createStyleConfiguratorState, Cl as SelectTrigger, D as markApplyFailed, Dl as Popover, E as isPreviewingChange, Eu as Button, F as previewHeaderLayout, Fd as Maximize2, Gt as createStoreBackend, H as syncStyleConfiguratorState, Ht as createManifestValidation, I as previewHeaderStyle, Id as LoaderCircle, Ji as evaluateTypographyFontSlot, Jl as CollapsibleContent, L as previewSiteStyle, M as previewButtonPersonality, Ml as TabsContent, Mt as deriveRouteMetadataPresentation, N as previewCuratedPalette, Nd as Monitor, Nl as TabsList, Nt as resolvePageRouteSlug, O as markApplySaved, Oi as curatedSiteStyles, Ol as PopoverContent, P as previewFooterLook, Pl as TabsTrigger, Pt as resolveContentTitle, Pu as unsafeAsEditorBlockId, Q as resolvePreviewSidebarTab, Qi as findFooterLook, R as previewTypographyPreset, S as cancelPreview, Sl as SelectItem, T as dismissWarnings, U as toggleRow, Ut as FormRenderer, V as styleConfiguratorHistoryEntryForPersistedSelection, Vc as findButtonPersonality, W as typographySelectionSnapshotFromFlat, Xi as typographyPresets, Yi as findTypographyPreset, Yl as CollapsibleTrigger, Z as createOptimisticActionRunner, Zi as requireEntriesForCuratedChoices, _ as usePreviewDesignCoordinator, _a as paletteColorsSchema, _t as useEditorUiStore, au as DropdownMenu, b as applyResolvedSelections, bl as Select, c as selectionSnapshotFromApplySiteStyleSelectionResponse, cf as ChevronLeft, cu as DropdownMenuLabel, d as buildSiteChromeLookModels, dt as useUISelector, ea as getHeaderLayout, ed as assertNever$1, en as listEntryPageContentSlots, f as cycleSiteChromeLookId, ga as paletteColorsEqual, h as planSiteChromeLookSelection, ha as paletteColorEntries, hd as X$1, iu as Surface, j as paletteMutationCapability, jl as Tabs, k as markApplySaving, kl as PopoverTrigger, ku as cn, l as planSiteStylePreviewChange, lu as DropdownMenuSeparator, m as planSiteChromeFooterLayoutSelection, ma as findCuratedPalette, mt as useEntryController, n as useSiteChromeCustomizeOptional, ou as DropdownMenuContent, p as cycleableSiteChromeOptions, pa as curatedPalettes, ql as Collapsible, s as buildApplySiteStyleSelectionBody, sf as ChevronRight, su as DropdownMenuItem, ta as getHeaderStyle, u as resolveStyleConfiguratorInitialSnapshot, ut as ContentFieldsForm, uu as DropdownMenuTrigger, vt as useEditorUiStoreInstance, w as deriveStyleConfiguratorCapabilities, wd as Smartphone, wl as SelectValue, x as applyTypographyDraftPatch, xd as Tablet, xl as SelectContent, z as resetTypographyToSaved } from "./SiteChromeCustomizeContext-BV9GU-3C.mjs";
+import { d as unwrapResponse, f as getDashboardUrl, r as usePreviewAuth } from "./previewAuthStore-CfquDtTh.mjs";
+import { S as isAdapterReferenceKind, T as CalloutDescription, _ 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 Callout, x as BlockEditor, y as PreviewFormProvider } from "./SdkPreviewModeRuntime-DmHCcIMO.mjs";
+import { t as Separator } from "./separator--6yjc914.mjs";
 import React, { forwardRef, useCallback, 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";
@@ -1112,7 +1112,7 @@ function updateBlocksWithSavedContent(blocks, blockId, content) {
 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 }) {
+function EntrySlotBlockEditorPanel({ siteId, dashboardBaseUrl, typeKey, entryId, theme = null, apiClient, bearerToken, supabaseUrl, sdkConfig = null, mediaAssets, widgets }) {
 	const router = useRouter();
 	const queryClient = useQueryClient();
 	const uiStore = useEditorUiStoreInstance();
@@ -1218,6 +1218,7 @@ function EntrySlotBlockEditorPanel({ siteId, typeKey, entryId, theme = null, api
 		children: /* @__PURE__ */ jsx(BlockEditor, {
 			ref: handleBlockEditorRef,
 			siteId,
+			dashboardBaseUrl,
 			owner: {
 				kind: "entry-slot",
 				type: typeKey,
@@ -1276,7 +1277,7 @@ function EntrySlotBlockEditorPanel({ siteId, typeKey, entryId, theme = null, api
 }
 //#endregion
 //#region ../preview-next/src/client/preview/EntryEditorPanel.tsx
-function EntryEditorPanel({ siteId, entryData, contentTypeSchema, referenceContentTypeKeys, draftContent, currentTemplate, theme, apiClient, bearerToken, supabaseUrl, entrySubrouteContext, metadataPanel, linkedEntrySection, mediaAssets, widgets, sdkConfig, viewportMode, viewportWidth, zoom, onViewportModeChange, onViewportWidthChange, onZoomChange }) {
+function EntryEditorPanel({ siteId, dashboardBaseUrl, entryData, contentTypeSchema, referenceContentTypeKeys, draftContent, currentTemplate, theme, apiClient, bearerToken, supabaseUrl, entrySubrouteContext, metadataPanel, linkedEntrySection, mediaAssets, widgets, sdkConfig, viewportMode, viewportWidth, zoom, onViewportModeChange, onViewportWidthChange, onZoomChange }) {
 	const [contentOpen, setContentOpen] = useState(true);
 	const [pageContentOpen, setPageContentOpen] = useState(false);
 	const [templateOpen, setTemplateOpen] = useState(false);
@@ -1378,6 +1379,7 @@ function EntryEditorPanel({ siteId, entryData, contentTypeSchema, referenceConte
 								"data-testid": "entry-page-content-editor",
 								children: /* @__PURE__ */ jsx(EntrySlotBlockEditorPanel, {
 									siteId,
+									dashboardBaseUrl,
 									typeKey: entryData.type,
 									entryId: entryData.id,
 									theme,
@@ -1562,12 +1564,13 @@ function formatBlockKindLabel(blockKind) {
 }
 //#endregion
 //#region ../preview-next/src/client/preview/PageBlockEditorPanel.tsx
-function PageBlockEditorPanel({ siteId, pageId, theme, apiClient, bearerToken, supabaseUrl, blockItems, uiStoreForBlockEditor, blockEditorRef, onBlocksChange, metadataPanel, linkedEntrySection, designPanel, 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, designOpenRequestId = null, 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 designSectionRef = useRef(null);
 	const customizeSectionRef = useRef(null);
 	const selectionKind = customizeSelection?.selection.kind;
 	const selectionRequestId = customizeSelection?.selection.kind === "selected" ? customizeSelection.selection.requestId : 0;
@@ -1594,6 +1597,14 @@ function PageBlockEditorPanel({ siteId, pageId, theme, apiClient, bearerToken, s
 			});
 		}
 	}, [selectionKind, selectionRequestId]);
+	useEffect(() => {
+		if (designOpenRequestId === null) return;
+		setDesignOpen(true);
+		designSectionRef.current?.scrollIntoView({
+			block: "start",
+			behavior: "smooth"
+		});
+	}, [designOpenRequestId]);
 	return /* @__PURE__ */ jsxs("div", {
 		className: "flex h-full min-h-0 flex-col overflow-hidden",
 		children: [/* @__PURE__ */ jsx("div", {
@@ -1627,6 +1638,7 @@ function PageBlockEditorPanel({ siteId, pageId, theme, apiClient, bearerToken, s
 						open: designOpen,
 						onOpenChange: setDesignOpen,
 						children: /* @__PURE__ */ jsxs("div", {
+							ref: designSectionRef,
 							className: "border-b",
 							children: [/* @__PURE__ */ jsx(CollapsibleTrigger, {
 								asChild: true,
@@ -1688,6 +1700,7 @@ function PageBlockEditorPanel({ siteId, pageId, theme, apiClient, bearerToken, s
 								children: /* @__PURE__ */ jsx(BlockEditor, {
 									ref: blockEditorRef,
 									siteId,
+									dashboardBaseUrl,
 									owner: {
 										kind: "page",
 										pageId
@@ -1867,7 +1880,7 @@ const DEFAULT_SURFACE_ROLES = [
 *   - LiveThemeEditor's palette tab (via a thin context wrapper)
 *   - Style configurator's brand-colours row
 */
-function PaletteTokenEditor({ palette, onChange, hasInvalidValues = false, brandRoles = DEFAULT_BRAND_ROLES, feedbackRoles = DEFAULT_FEEDBACK_ROLES, surfaceRoles = DEFAULT_SURFACE_ROLES, showContrastChecks = true, className }) {
+function PaletteTokenEditor({ palette, onChange, hasInvalidValues = false, brandRoles = DEFAULT_BRAND_ROLES, feedbackRoles = DEFAULT_FEEDBACK_ROLES, surfaceRoles = DEFAULT_SURFACE_ROLES, showContrastChecks = true, disabled = false, className }) {
 	const paletteValues = useMemo(() => {
 		const map = /* @__PURE__ */ new Map();
 		for (const entry of palette) if (entry?.name) map.set(entry.name, normalizeHex(entry.hex));
@@ -1899,19 +1912,22 @@ function PaletteTokenEditor({ palette, onChange, hasInvalidValues = false, brand
 				title: "Brand & accents",
 				roles: brandRoles,
 				getColor,
-				onChange: handleRoleChange
+				onChange: handleRoleChange,
+				disabled
 			}),
 			/* @__PURE__ */ jsx(ColorRoleGroup, {
 				title: "Feedback",
 				roles: feedbackRoles,
 				getColor,
-				onChange: handleRoleChange
+				onChange: handleRoleChange,
+				disabled
 			}),
 			/* @__PURE__ */ jsx(ColorRoleGroup, {
 				title: "Surfaces & text",
 				roles: surfaceRoles,
 				getColor,
-				onChange: handleRoleChange
+				onChange: handleRoleChange,
+				disabled
 			}),
 			showContrastChecks ? /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(Separator, {}), /* @__PURE__ */ jsxs("div", {
 				className: "grid gap-4 md:grid-cols-2",
@@ -1941,7 +1957,7 @@ function isPlausibleHexInput(value) {
 	const trimmed = value.trim();
 	return /^#?[0-9a-fA-F]{3}$/.test(trimmed) || /^#?[0-9a-fA-F]{6}$/.test(trimmed);
 }
-function ColorRoleGroup({ title, roles, getColor, onChange }) {
+function ColorRoleGroup({ title, roles, getColor, onChange, disabled }) {
 	if (roles.length === 0) return null;
 	return /* @__PURE__ */ jsxs("div", {
 		className: "space-y-3",
@@ -1956,12 +1972,13 @@ function ColorRoleGroup({ title, roles, getColor, onChange }) {
 			children: roles.map((role) => /* @__PURE__ */ jsx(ColorRoleField, {
 				role,
 				value: getColor(role.key),
-				onChange
+				onChange,
+				disabled
 			}, role.key))
 		})]
 	});
 }
-function ColorRoleField({ role, value, onChange }) {
+function ColorRoleField({ role, value, onChange, disabled }) {
 	const inputId = useId();
 	const colorPickerLabel = `${role.label} colour picker`;
 	return /* @__PURE__ */ jsxs("div", {
@@ -1974,18 +1991,20 @@ function ColorRoleField({ role, value, onChange }) {
 			}),
 			/* @__PURE__ */ jsx(ColorPicker, {
 				value,
-				onChange: ((next) => {
+				onChange: (next) => {
 					if (typeof next === "string") onChange(role.key, next);
-				}),
+				},
 				className: "w-full",
-				"aria-label": colorPickerLabel
+				"aria-label": colorPickerLabel,
+				disabled
 			}),
 			/* @__PURE__ */ jsx(Input, {
 				id: inputId,
 				value,
 				onChange: (event) => onChange(role.key, event.target.value),
 				className: "font-mono text-xs uppercase",
-				placeholder: "#000000"
+				placeholder: "#000000",
+				disabled
 			})
 		]
 	});
@@ -2107,7 +2126,7 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 	const router = useRouter();
 	const previewDesign = usePreviewDesignCoordinator();
 	const siteChromeCustomize = useSiteChromeCustomizeOptional();
-	const setSiteStyleStagedPreviewActive = siteChromeCustomize?.siteStyleHistory.setStagedPreviewActive;
+	const setSiteStyleStagedPreviewActive = siteChromeCustomize?.siteStyleHistory?.setStagedPreviewActive;
 	const { applyFailed, applyStarted, applySucceeded, clearPreview, previewTheme } = previewDesign;
 	const [isRefreshPending, startRefreshTransition] = useTransition();
 	const baseSnapshot = useMemo(() => resolveStyleConfiguratorInitialSnapshot({
@@ -2194,7 +2213,7 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 		setState((current) => {
 			if (!current) return current;
 			appliedExpandedRowRequestIdRef.current = expandedRowRequest.id;
-			return openRow(current, expandedRowRequest.row === "header" ? "header-layout" : expandedRowRequest.row);
+			return openRow(current, expandedRowForPreviewDesignRow(expandedRowRequest.row));
 		});
 	}, [expandedRowRequest, hasLoadedState]);
 	const handlePreviewSiteStyle = useCallback((siteStyleId) => {
@@ -2263,7 +2282,13 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 		});
 	}, [footerSelectionContext, headerSelectionContext]);
 	const handlePreviewPalette = useCallback((id) => {
-		setState((current) => current ? previewPaletteVariant(current, id) : current);
+		const curated = findCuratedPalette(id);
+		if (!curated) return;
+		setState((current) => current ? previewCuratedPalette(current, {
+			paletteId: curated.id,
+			colors: curated.colors,
+			mode: curated.mode
+		}) : current);
 	}, []);
 	const handlePreviewTypographyPreset = useCallback((id) => {
 		setState((current) => current ? previewTypographyPreset(current, id) : current);
@@ -2310,17 +2335,22 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 	const handleTokenOverride = useCallback((role, hex) => {
 		setState((current) => {
 			if (!current) return current;
-			const next = {
-				...current.previewed.paletteOverrides ?? {},
+			const palette = current.previewed.palette;
+			if (palette.kind === "invalid") return current;
+			if (!(role in palette.colors)) return current;
+			const nextColors = paletteColorsSchema.safeParse({
+				...palette.colors,
 				[role]: hex
-			};
-			const parsed = paletteOverridesSchema.safeParse(next);
-			if (!parsed.success) return current;
-			return setPaletteOverrides(current, parsed.data);
+			});
+			return nextColors.success ? setPaletteColors(current, nextColors.data) : current;
 		});
 	}, []);
 	const handleResetOverrides = useCallback(() => {
-		setState((current) => current ? setPaletteOverrides(current, null) : current);
+		setState((current) => {
+			if (!current || current.previewed.palette.kind !== "migrated-curated") return current;
+			const curated = findCuratedPalette(current.previewed.palette.paletteId);
+			return curated ? setPaletteColors(current, curated.colors) : current;
+		});
 	}, []);
 	const handleToggleRow = useCallback((row) => {
 		setState((current) => current ? toggleRow(current, row) : current);
@@ -2331,9 +2361,6 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 	const handleDismissWarnings = useCallback(() => {
 		setState((current) => current ? dismissWarnings(current) : current);
 	}, []);
-	const handleDismissNotices = useCallback(() => {
-		setState((current) => current ? dismissNotices(current) : current);
-	}, []);
 	const handleApply = useCallback(async () => {
 		const live = stateRef.current;
 		if (!live || !isPreviewingChange(live)) return;
@@ -2348,39 +2375,39 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 			headerSelectionContext,
 			footerSelectionContext
 		});
-		const body = buildApplySiteStyleSelectionBody({
-			base: live.base,
-			previewed: {
-				...previewed,
-				buttonPersonalityId: compiled.resolvedSelections.buttonPersonalityId,
-				paletteVariantId: compiled.resolvedSelections.paletteVariantId,
-				headerLayoutId: compiled.resolvedSelections.headerLayoutId,
-				headerStyleId: compiled.resolvedSelections.headerStyleId,
-				headerLookId: compiled.resolvedSelections.headerLookId,
-				typographySelection: compiled.resolvedSelections.typographySelection.kind === "custom" ? {
-					kind: "custom",
-					typography: compiled.themeOverlay.typography
-				} : typographySelectionSnapshotFromFlat(compiled.resolvedSelections)
-			},
-			selectionId
-		});
 		await runnerRef.current.run({
 			optimistic: () => {
 				applyStarted("style-configurator");
 				setState((current) => current ? markApplySaving(current) : current);
 			},
 			network: async () => {
+				const body = buildApplySiteStyleSelectionBody({
+					base: live.base,
+					previewed: {
+						...previewed,
+						buttonPersonalityId: compiled.resolvedSelections.buttonPersonalityId,
+						headerLayoutId: compiled.resolvedSelections.headerLayoutId,
+						headerStyleId: compiled.resolvedSelections.headerStyleId,
+						headerLookId: compiled.resolvedSelections.headerLookId,
+						typographySelection: compiled.resolvedSelections.typographySelection.kind === "custom" ? {
+							kind: "custom",
+							typography: compiled.themeOverlay.typography
+						} : typographySelectionSnapshotFromFlat(compiled.resolvedSelections)
+					},
+					selectionId
+				});
+				if (!body.ok) throw new Error(paletteApplyPlanErrorMessage(body.error));
 				return unwrapResponse(await apiClient({
 					endpoint: "applySiteStyleSelection",
 					params: { siteId },
-					body
+					body: body.body
 				}));
 			},
 			onSuccess: (saved) => {
 				const persisted = selectionSnapshotFromApplySiteStyleSelectionResponse(saved, previewed);
 				const historyEntry = styleConfiguratorHistoryEntryForPersistedSelection(live, persisted);
 				setState((current) => current ? markApplySaved(current, persisted) : current);
-				if (historyEntry) siteChromeCustomize?.siteStyleHistory.recordAppliedSelection(historyEntry);
+				if (historyEntry) siteChromeCustomize?.siteStyleHistory?.recordAppliedSelection(historyEntry);
 				applySucceeded("style-configurator");
 				startRefreshTransition(() => {
 					router.refresh();
@@ -2418,13 +2445,17 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 	const stagedCapabilities = deriveStyleConfiguratorCapabilities(state);
 	const previewingChange = isPreviewingChange(state);
 	const saving = stagedCapabilities.isApplyingStaged || isRefreshPending;
+	const aggregateMutationControlsDisabled = saving || !stagedCapabilities.canPreviewStaged;
 	const currentSiteStyle = getCuratedSiteStyle(state.previewed.siteStyleId);
 	if (!currentSiteStyle) return /* @__PURE__ */ jsx("p", {
 		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 currentPaletteVariant = findPaletteVariant(state.previewed.paletteVariantId);
+	const currentPalette = state.previewed.palette;
+	const paletteMutation = paletteMutationCapability(state);
+	const paletteControlsDisabled = saving || paletteMutation.kind !== "editable";
+	const currentCuratedPalette = currentPalette.kind === "migrated-curated" ? findCuratedPalette(currentPalette.paletteId) : null;
 	const currentTypographyPreset = state.previewed.typographySelection.kind === "preset" && state.previewed.typographySelection.presetId ? findTypographyPreset(state.previewed.typographySelection.presetId) : null;
 	const currentTypography = planSiteStylePreviewChange({
 		siteStyle: currentSiteStyle,
@@ -2443,6 +2474,7 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 	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" };
 	return /* @__PURE__ */ jsxs("div", {
 		className: "space-y-3",
 		children: [
@@ -2450,16 +2482,12 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 				warnings: state.warnings,
 				onDismiss: handleDismissWarnings
 			}) : null,
-			state.notices.length > 0 ? /* @__PURE__ */ jsx(NoticeBanner, {
-				notices: state.notices,
-				onDismiss: handleDismissNotices
-			}) : null,
 			/* @__PURE__ */ jsx(SiteStyleRow, {
 				expanded: state.expandedRow === "style",
 				onToggle: () => handleToggleRow("style"),
 				current: currentSiteStyle,
 				onPreview: handlePreviewSiteStyle,
-				disabled: saving
+				disabled: aggregateMutationControlsDisabled
 			}),
 			/* @__PURE__ */ jsx(SiteChromeLookRow, {
 				label: "Header layout",
@@ -2477,7 +2505,7 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 					if (next !== void 0) handlePreviewHeaderLayout(next);
 				},
 				onPreview: handlePreviewHeaderLayout,
-				disabled: saving
+				disabled: aggregateMutationControlsDisabled
 			}),
 			/* @__PURE__ */ jsx(SiteChromeLookRow, {
 				label: "Header look",
@@ -2495,7 +2523,13 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 					if (next !== void 0) handlePreviewHeaderStyle(next);
 				},
 				onPreview: handlePreviewHeaderStyle,
-				disabled: saving
+				disabled: aggregateMutationControlsDisabled,
+				extraControls: isHeaderMenuSurfaceState(headerSurfaceState) ? /* @__PURE__ */ jsx(HeaderMenuControls, {
+					state: headerSurfaceState,
+					disabled: saving,
+					onMenuFontChange: siteChromeCustomize?.setHeaderMenuFont,
+					onMenuFontSizeChange: siteChromeCustomize?.setHeaderMenuFontSize
+				}) : null
 			}),
 			/* @__PURE__ */ jsx(SiteChromeLookRow, {
 				label: "Footer layout",
@@ -2513,7 +2547,7 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 					if (next !== void 0) handlePreviewFooterLayout(next);
 				},
 				onPreview: handlePreviewFooterLayout,
-				disabled: saving
+				disabled: aggregateMutationControlsDisabled
 			}),
 			/* @__PURE__ */ jsx(SiteChromeLookRow, {
 				label: "Footer look",
@@ -2531,7 +2565,7 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 					if (next !== void 0) handlePreviewFooterLook(next);
 				},
 				onPreview: handlePreviewFooterLook,
-				disabled: saving
+				disabled: aggregateMutationControlsDisabled
 			}),
 			/* @__PURE__ */ jsx(PersonalityRow, {
 				expanded: state.expandedRow === "buttons",
@@ -2540,7 +2574,7 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 				currentId: state.previewed.buttonPersonalityId,
 				currentLabel: currentPersonality?.name ?? state.previewed.buttonPersonalityId,
 				onPreview: handlePreviewPersonality,
-				disabled: saving
+				disabled: aggregateMutationControlsDisabled
 			}),
 			/* @__PURE__ */ jsx(TypographyRow, {
 				expanded: state.expandedRow === "typography",
@@ -2555,26 +2589,28 @@ function StyleConfigurator({ siteId, apiClient, theme, selectionId, selectionVer
 				onBodyChange: handleBodyTypographyChange,
 				onScaleChange: handleTypographyScaleChange,
 				onReset: handleResetTypography,
-				disabled: saving
+				disabled: aggregateMutationControlsDisabled
 			}),
 			/* @__PURE__ */ jsx(PaletteRow, {
 				expanded: state.expandedRow === "palette",
 				onToggle: () => handleToggleRow("palette"),
 				siteStyle: currentSiteStyle,
-				currentId: state.previewed.paletteVariantId,
-				currentLabel: currentPaletteVariant?.name ?? state.previewed.paletteVariantId,
-				currentSwatch: currentPaletteVariant?.colors.find((c) => c.name === "primary")?.hex ?? null,
+				currentId: currentCuratedPalette?.id ?? null,
+				currentLabel: currentCuratedPalette?.name ?? (currentPalette.kind === "migrated-site" ? "Site palette" : "Custom palette"),
+				currentSwatch: currentCuratedPalette?.colors.primary ?? null,
 				onPreview: handlePreviewPalette,
-				disabled: saving
+				mutationCapability: paletteMutation,
+				disabled: paletteControlsDisabled
 			}),
-			currentPaletteVariant ? /* @__PURE__ */ jsx(ColoursRow, {
+			currentPalette.kind !== "invalid" ? /* @__PURE__ */ jsx(ColoursRow, {
 				expanded: state.expandedRow === "colours",
 				onToggle: () => handleToggleRow("colours"),
-				variant: currentPaletteVariant,
-				overrides: state.previewed.paletteOverrides,
+				palette: currentPalette.colors,
+				isCustom: !currentCuratedPalette || currentPalette.mode !== currentCuratedPalette.mode || !paletteColorsEqual(currentPalette.colors, currentCuratedPalette.colors),
 				onTokenChange: handleTokenOverride,
 				onReset: handleResetOverrides,
-				disabled: saving
+				disabled: paletteControlsDisabled,
+				mutationCapability: paletteMutation
 			}) : null,
 			previewingChange ? /* @__PURE__ */ jsxs("div", {
 				className: "flex items-center gap-2 pt-2",
@@ -3293,7 +3329,7 @@ function SiteChromeLookRow({ label, ariaLabel, defaultDescription, catalog, opti
 }, ...(catalog ?? []).map((look) => ({
 	...look,
 	available: true
-}))], diagnostics, scopeDescription, expanded, onToggle, currentId, currentLabel, onCycle, onPreview, disabled }) {
+}))], diagnostics, scopeDescription, expanded, onToggle, currentId, currentLabel, onCycle, onPreview, disabled, extraControls }) {
 	return /* @__PURE__ */ jsxs(StyleRowFrame, {
 		label,
 		currentLabel,
@@ -3328,6 +3364,10 @@ function SiteChromeLookRow({ label, ariaLabel, defaultDescription, catalog, opti
 				className: "mb-3 list-none space-y-1 p-0 text-xs text-amber-700",
 				children: diagnostics.map((diagnostic) => /* @__PURE__ */ jsx("li", { children: diagnostic }, diagnostic))
 			}) : null,
+			extraControls ? /* @__PURE__ */ jsx("div", {
+				className: "mb-3",
+				children: extraControls
+			}) : null,
 			/* @__PURE__ */ jsx("ul", {
 				role: "radiogroup",
 				"aria-label": ariaLabel,
@@ -3343,51 +3383,87 @@ function SiteChromeLookRow({ label, ariaLabel, defaultDescription, catalog, opti
 		]
 	});
 }
-function PaletteRow({ expanded, onToggle, siteStyle, currentId, currentLabel, currentSwatch, onPreview, disabled }) {
+function isHeaderMenuSurfaceState(state) {
+	return state.kind === "available" && state.surface === "header" && Array.isArray(state.menuFontOptions) && Array.isArray(state.menuFontSizeOptions);
+}
+function HeaderMenuControls({ state, disabled, onMenuFontChange, onMenuFontSizeChange }) {
+	const controlDisabled = disabled || !state.applyAllowed;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "grid grid-cols-2 gap-2 rounded-md border bg-muted/20 p-2",
+		children: [/* @__PURE__ */ jsxs("label", {
+			className: "block text-xs font-medium text-muted-foreground",
+			children: [/* @__PURE__ */ jsx("span", { children: "Menu font" }), /* @__PURE__ */ jsx("select", {
+				className: "mt-1 h-8 w-full rounded-md border bg-background px-2 text-sm text-foreground disabled:cursor-not-allowed disabled:opacity-50",
+				value: state.menuFont,
+				onChange: (event) => onMenuFontChange?.(event.currentTarget.value),
+				disabled: controlDisabled,
+				children: state.menuFontOptions.map((option) => /* @__PURE__ */ jsx("option", {
+					value: option.value,
+					children: option.label
+				}, option.value))
+			})]
+		}), /* @__PURE__ */ jsxs("label", {
+			className: "block text-xs font-medium text-muted-foreground",
+			children: [/* @__PURE__ */ jsx("span", { children: "Menu font size" }), /* @__PURE__ */ jsx("select", {
+				className: "mt-1 h-8 w-full rounded-md border bg-background px-2 text-sm text-foreground disabled:cursor-not-allowed disabled:opacity-50",
+				value: state.menuFontSize,
+				onChange: (event) => onMenuFontSizeChange?.(event.currentTarget.value),
+				disabled: controlDisabled,
+				children: state.menuFontSizeOptions.map((option) => /* @__PURE__ */ jsx("option", {
+					value: option.value,
+					children: option.label
+				}, option.value))
+			})]
+		})]
+	});
+}
+function PaletteRow({ expanded, onToggle, siteStyle, currentId, currentLabel, currentSwatch, onPreview, mutationCapability, disabled }) {
 	const options = useMemo(() => {
-		const recommended = requireEntriesForCuratedChoices(paletteVariants, siteStyle.paletteVariantChoices);
+		const recommended = requireEntriesForCuratedChoices(curatedPalettes, siteStyle.paletteRecommendations);
 		if (recommended.some((variant) => variant.id === currentId)) return recommended;
-		const current = findPaletteVariant(currentId);
+		const current = currentId ? findCuratedPalette(currentId) : null;
 		return current ? [current, ...recommended] : recommended;
-	}, [currentId, siteStyle.paletteVariantChoices]);
+	}, [currentId, siteStyle.paletteRecommendations]);
 	return /* @__PURE__ */ jsxs(StyleRowFrame, {
 		label: "Palette",
 		currentLabel,
 		swatch: currentSwatch,
 		expanded,
 		onToggle,
-		children: [/* @__PURE__ */ jsx("p", {
-			className: "mb-3 text-xs text-muted-foreground",
-			children: "These palette bases are recommended for the current Site Style. Choose a base here, then edit exact colours in Palette colours."
-		}), /* @__PURE__ */ jsx("ul", {
-			role: "radiogroup",
-			"aria-label": "Palette",
-			className: "list-none space-y-1 p-0",
-			children: options.map((variant) => {
-				const primaryHex = variant.colors.find((c) => c.name === "primary")?.hex;
-				return /* @__PURE__ */ jsx(PickerOption, {
-					selected: variant.id === currentId,
-					label: variant.name,
-					description: variant.description,
-					swatch: primaryHex,
-					onSelect: () => onPreview(variant.id),
-					disabled
-				}, variant.id);
+		children: [
+			/* @__PURE__ */ jsx("p", {
+				className: "mb-3 text-xs text-muted-foreground",
+				children: "These palette bases are recommended for the current Site Style. Choose a base here, then edit exact colours in Palette colours."
+			}),
+			mutationCapability.kind === "blocked" && mutationCapability.reason === "invalid-palette" ? /* @__PURE__ */ jsx("div", {
+				role: "status",
+				className: "mb-3 flex items-center justify-between gap-3 rounded-md border border-muted px-3 py-2 text-xs text-muted-foreground",
+				children: /* @__PURE__ */ jsx("span", { children: mutationCapability.message })
+			}) : null,
+			/* @__PURE__ */ jsx("ul", {
+				role: "radiogroup",
+				"aria-label": "Palette",
+				className: "list-none space-y-1 p-0",
+				children: options.map((variant) => {
+					const primaryHex = variant.colors.primary;
+					return /* @__PURE__ */ jsx(PickerOption, {
+						selected: variant.id === currentId,
+						label: variant.name,
+						description: variant.description,
+						swatch: primaryHex,
+						onSelect: () => onPreview(variant.id),
+						disabled
+					}, variant.id);
+				})
 			})
-		})]
+		]
 	});
 }
-function ColoursRow({ expanded, onToggle, variant, overrides, onTokenChange, onReset, disabled }) {
-	const mergedPalette = useMemo(() => {
-		return variant.colors.map((color) => ({
-			name: color.name,
-			hex: overrides?.[color.name] ?? color.hex
-		}));
-	}, [variant, overrides]);
-	const overrideCount = overrides ? Object.keys(overrides).length : 0;
+function ColoursRow({ expanded, onToggle, palette, isCustom, onTokenChange, onReset, mutationCapability, disabled }) {
+	const mergedPalette = useMemo(() => paletteColorEntries(palette), [palette]);
 	return /* @__PURE__ */ jsx(StyleRowFrame, {
 		label: "Palette colours",
-		currentLabel: overrideCount > 0 ? `${overrideCount} colour${overrideCount === 1 ? "" : "s"} customised` : "Using selected palette",
+		currentLabel: isCustom ? "Custom palette colours" : "Using selected palette",
 		expanded,
 		onToggle,
 		children: /* @__PURE__ */ jsxs("div", {
@@ -3397,15 +3473,25 @@ function ColoursRow({ expanded, onToggle, variant, overrides, onTokenChange, onR
 					className: "text-xs text-muted-foreground",
 					children: "Customise the palette tokens used across the site, including backgrounds, surfaces, text and borders."
 				}),
-				/* @__PURE__ */ jsx(PaletteTokenEditor, {
-					palette: mergedPalette,
-					onChange: onTokenChange,
-					brandRoles: PALETTE_BRAND_ROLES,
-					feedbackRoles: PALETTE_FEEDBACK_ROLES,
-					surfaceRoles: PALETTE_SURFACE_ROLES,
-					showContrastChecks: false
+				mutationCapability.kind === "blocked" ? /* @__PURE__ */ jsx("div", {
+					role: "status",
+					className: "flex items-center justify-between gap-3 rounded-md border border-muted px-3 py-2 text-xs text-muted-foreground",
+					children: /* @__PURE__ */ jsx("span", { children: mutationCapability.message })
+				}) : null,
+				/* @__PURE__ */ jsx("fieldset", {
+					disabled,
+					className: "min-w-0 border-0 p-0",
+					children: /* @__PURE__ */ jsx(PaletteTokenEditor, {
+						palette: mergedPalette,
+						onChange: onTokenChange,
+						brandRoles: PALETTE_BRAND_ROLES,
+						feedbackRoles: PALETTE_FEEDBACK_ROLES,
+						surfaceRoles: PALETTE_SURFACE_ROLES,
+						showContrastChecks: false,
+						disabled
+					})
 				}),
-				overrideCount > 0 ? /* @__PURE__ */ jsx("div", {
+				isCustom ? /* @__PURE__ */ jsx("div", {
 					className: "flex justify-end",
 					children: /* @__PURE__ */ jsx(Button, {
 						type: "button",
@@ -3447,6 +3533,13 @@ function PickerOption({ selected, label, description, swatch, onSelect, disabled
 		})
 	});
 }
+function paletteApplyPlanErrorMessage(error) {
+	switch (error) {
+		case "invalid-palette-state": return "Palette details are unavailable. Refresh and try again.";
+		case "curated-palette-missing": return "This curated palette is no longer available. Refresh and try again.";
+		default: return assertNever$1(error);
+	}
+}
 function classifyStyleApplyError(error) {
 	if (isRecord(error)) {
 		const status = error.status;
@@ -3461,6 +3554,16 @@ function classifyStyleApplyError(error) {
 		message: error instanceof Error ? error.message : "Unable to apply your selection."
 	};
 }
+function expandedRowForPreviewDesignRow(row) {
+	switch (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");
+	}
+}
 function isRecord(value) {
 	return typeof value === "object" && value !== null;
 }
@@ -3479,27 +3582,6 @@ function WarningNotice({ warnings, onDismiss }) {
 		})]
 	});
 }
-function NoticeBanner({ notices, onDismiss }) {
-	return /* @__PURE__ */ jsxs("div", {
-		role: "status",
-		className: "rounded-md border border-muted-foreground/20 bg-muted/40 px-3 py-2 text-xs",
-		children: [/* @__PURE__ */ jsx("ul", {
-			className: "space-y-1",
-			children: notices.map((notice, index) => /* @__PURE__ */ jsx("li", { children: describeNotice(notice) }, `${notice.kind}-${index}`))
-		}), /* @__PURE__ */ jsx("button", {
-			type: "button",
-			onClick: onDismiss,
-			className: "mt-2 underline",
-			children: "Dismiss"
-		})]
-	});
-}
-function describeNotice(notice) {
-	switch (notice.kind) {
-		case "palette-overrides-hidden": return "Custom colours are saved for the previous palette.";
-		case "palette-overrides-restored": return "Custom colours restored for this palette.";
-	}
-}
 function describeWarning(warning) {
 	switch (warning.kind) {
 		case "rejected-personality": return `Button style changed to ${warning.fellBackTo} because ${warning.requested} is not offered for this site style.`;
@@ -3510,7 +3592,7 @@ function describeWarning(warning) {
 }
 //#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, themeSelectionPaletteVariantId = null, themeSelectionPaletteOverrides = null, themeSelectionHeaderLayoutId = null, themeSelectionHeaderStyleId = null, themeSelectionTypographyPresetId = null, themeSelectionTypographyBodyFontOverride = null, themeSelectionTypographyHeadingFontOverride = null, themeSelectionHeaderLookId = null, themeSelectionFooterLookId = null, themeSelectionHeaderContext, themeSelectionFooterContext, designRowRequest = null, apiClient, bearerToken, supabaseUrl, entrySubrouteContext, assistantPanel, sdkConfig, mediaAssets, bookingOfferingPresets, siteStyleAccess = { kind: "hidden" }, activeTab, onTabChange, onClose, 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, themeSelectionButtonPersonalityId = null, runtimePaletteState = null, themeSelectionPaletteVariantId = null, themeSelectionPaletteOverrides = null, themeSelectionHeaderLayoutId = null, themeSelectionHeaderStyleId = null, themeSelectionTypographyPresetId = null, themeSelectionTypographyBodyFontOverride = null, themeSelectionTypographyHeadingFontOverride = null, themeSelectionHeaderLookId = null, themeSelectionFooterLookId = null, themeSelectionHeaderContext, themeSelectionFooterContext, designRowRequest = null, apiClient, bearerToken, supabaseUrl, entrySubrouteContext, assistantPanel, sdkConfig, mediaAssets, bookingOfferingPresets, siteStyleAccess = { kind: "hidden" }, activeTab, onTabChange, onClose, viewportMode, viewportWidth, zoom, onViewportModeChange, onViewportWidthChange, onZoomChange }) {
 	const controller = useEntryController();
 	const controllerBlocks = controller.blocks;
 	const uiStore = useEditorUiStoreInstance();
@@ -3601,6 +3683,7 @@ function PreviewEditorSidebar({ surfaceId, siteId, dashboardBaseUrl = null, page
 	});
 	const editorPanel = entryData ? /* @__PURE__ */ jsx(EntryEditorPanel, {
 		siteId,
+		dashboardBaseUrl,
 		entryData,
 		contentTypeSchema,
 		referenceContentTypeKeys,
@@ -3625,6 +3708,7 @@ function PreviewEditorSidebar({ surfaceId, siteId, dashboardBaseUrl = null, page
 	}) : pageId ? /* @__PURE__ */ jsx(PageBlockEditorPanel, {
 		siteId,
 		pageId,
+		dashboardBaseUrl,
 		theme,
 		apiClient,
 		bearerToken,
@@ -3634,6 +3718,7 @@ function PreviewEditorSidebar({ surfaceId, siteId, dashboardBaseUrl = null, page
 		blockEditorRef,
 		onBlocksChange: handleBlocksChange,
 		metadataPanel: metadataSectionContent,
+		designOpenRequestId: designRowRequest?.id ?? null,
 		designPanel: canInspectSiteStyle(siteStyleAccess) ? /* @__PURE__ */ jsx(StyleConfigurator, {
 			siteId,
 			apiClient,
@@ -3646,6 +3731,7 @@ function PreviewEditorSidebar({ surfaceId, siteId, dashboardBaseUrl = null, page
 				selectionVersion: themeSelectionVersion,
 				selectionUpdatedAt: themeSelectionUpdatedAt,
 				buttonPersonalityId: themeSelectionButtonPersonalityId,
+				runtimePaletteState,
 				paletteVariantId: themeSelectionPaletteVariantId,
 				paletteOverrides: themeSelectionPaletteOverrides,
 				headerLayoutId: themeSelectionHeaderLayoutId,