@vertebr/react 0.6.0 → 0.8.0

package/dist/components/admin/AdminContent.d.ts

@@ -5,6 +5,7 @@ export type AdminContentProps = {
     client: VertebrClient;
     catalog: CatalogResponse | null;
     selection: Selection;
+    onSelectionChange?: (next: Selection) => void;
     authRequired: boolean;
     loading: boolean;
     isPageSelection: boolean;
@@ -41,5 +42,5 @@ export type AdminContentProps = {
         onRefreshFonts?: () => Promise<void>;
     };
 };
-export declare function AdminContent({ client, catalog, selection, authRequired, loading, isPageSelection, metricsData, metricsLoading, metricsRange, onMetricsRangeChange, onRefreshMetrics, galleryData, galleryLoading, onRefreshGallery, fontLibraryData, fontLibraryLoading, onRefreshFonts, emailsData, emailsLoading, onRefreshEmails, resourceData, onRefreshResource, configData, onConfigSaved, galleryPicker, fontLibraryPicker, }: AdminContentProps): import("react").JSX.Element;
+export declare function AdminContent({ client, catalog, selection, onSelectionChange, authRequired, loading, isPageSelection, metricsData, metricsLoading, metricsRange, onMetricsRangeChange, onRefreshMetrics, galleryData, galleryLoading, onRefreshGallery, fontLibraryData, fontLibraryLoading, onRefreshFonts, emailsData, emailsLoading, onRefreshEmails, resourceData, onRefreshResource, configData, onConfigSaved, galleryPicker, fontLibraryPicker, }: AdminContentProps): import("react").JSX.Element;
 //# sourceMappingURL=AdminContent.d.ts.map

package/dist/components/admin/AdminContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AdminContent.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AdminContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,eAAe,EACf,cAAc,EACd,mBAAmB,EACnB,mBAAmB,EACnB,eAAe,EACf,eAAe,EACf,oBAAoB,EACpB,aAAa,EACd,MAAM,iBAAiB,CAAC;AAOzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAE9D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,EAAE,aAAa,CAAC;IACtB,OAAO,EAAE,eAAe,GAAG,IAAI,CAAC;IAChC,SAAS,EAAE,SAAS,CAAC;IACrB,YAAY,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,EAAE,OAAO,CAAC;IACzB,WAAW,EAAE,eAAe,GAAG,IAAI,CAAC;IACpC,cAAc,EAAE,OAAO,CAAC;IACxB,YAAY,EAAE,cAAc,CAAC;IAC7B,oBAAoB,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IACrD,gBAAgB,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACtC,WAAW,EAAE,eAAe,GAAG,IAAI,CAAC;IACpC,cAAc,EAAE,OAAO,CAAC;IACxB,gBAAgB,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACtC,eAAe,EAAE,mBAAmB,GAAG,IAAI,CAAC;IAC5C,kBAAkB,EAAE,OAAO,CAAC;IAC5B,cAAc,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACpC,UAAU,EAAE,mBAAmB,GAAG,IAAI,CAAC;IACvC,aAAa,EAAE,OAAO,CAAC;IACvB,eAAe,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACrC,YAAY,EAAE,oBAAoB,GAAG,IAAI,CAAC;IAC1C,iBAAiB,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACvC,UAAU,EAAE,cAAc,GAAG,IAAI,CAAC;IAClC,aAAa,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IAC9C,aAAa,EAAE;QACb,aAAa,CAAC,EAAE;YACd,MAAM,EAAE,MAAM,EAAE,CAAC;YACjB,QAAQ,EAAE,MAAM,CAAC;SAClB,CAAC;QACF,aAAa,CAAC,EAAE,MAAM,OAAO,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC,CAAC;QACxD,eAAe,CAAC,EAAE,CAChB,KAAK,EAAE,IAAI,EAAE,KACV,OAAO,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC,CAAC;KACxC,CAAC;IACF,iBAAiB,EAAE;QACjB,KAAK,CAAC,EAAE,mBAAmB,CAAC,OAAO,CAAC,CAAC;QACrC,YAAY,CAAC,EAAE,OAAO,CAAC;QACvB,WAAW,CAAC,EAAE,MAAM,OAAO,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC,CAAC;QAC1D,cAAc,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;KACtC,CAAC;CACH,CAAC;AA6EF,wBAAgB,YAAY,CAAC,EAC3B,MAAM,EACN,OAAO,EACP,SAAS,EACT,YAAY,EACZ,OAAO,EACP,eAAe,EACf,WAAW,EACX,cAAc,EACd,YAAY,EACZ,oBAAoB,EACpB,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,gBAAgB,EAChB,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,UAAU,EACV,aAAa,EACb,eAAe,EACf,YAAY,EACZ,iBAAiB,EACjB,UAAU,EACV,aAAa,EACb,aAAa,EACb,iBAAiB,GAClB,EAAE,iBAAiB,+BAuQnB"}
+{"version":3,"file":"AdminContent.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AdminContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,eAAe,EACf,cAAc,EACd,mBAAmB,EACnB,mBAAmB,EACnB,eAAe,EACf,eAAe,EACf,oBAAoB,EACpB,aAAa,EACd,MAAM,iBAAiB,CAAC;AAOzB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAE9D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,MAAM,EAAE,aAAa,CAAC;IACtB,OAAO,EAAE,eAAe,GAAG,IAAI,CAAC;IAChC,SAAS,EAAE,SAAS,CAAC;IACrB,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC;IAC9C,YAAY,EAAE,OAAO,CAAC;IACtB,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,EAAE,OAAO,CAAC;IACzB,WAAW,EAAE,eAAe,GAAG,IAAI,CAAC;IACpC,cAAc,EAAE,OAAO,CAAC;IACxB,YAAY,EAAE,cAAc,CAAC;IAC7B,oBAAoB,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IACrD,gBAAgB,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACtC,WAAW,EAAE,eAAe,GAAG,IAAI,CAAC;IACpC,cAAc,EAAE,OAAO,CAAC;IACxB,gBAAgB,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACtC,eAAe,EAAE,mBAAmB,GAAG,IAAI,CAAC;IAC5C,kBAAkB,EAAE,OAAO,CAAC;IAC5B,cAAc,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACpC,UAAU,EAAE,mBAAmB,GAAG,IAAI,CAAC;IACvC,aAAa,EAAE,OAAO,CAAC;IACvB,eAAe,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACrC,YAAY,EAAE,oBAAoB,GAAG,IAAI,CAAC;IAC1C,iBAAiB,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;IACvC,UAAU,EAAE,cAAc,GAAG,IAAI,CAAC;IAClC,aAAa,EAAE,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,CAAC;IAC9C,aAAa,EAAE;QACb,aAAa,CAAC,EAAE;YACd,MAAM,EAAE,MAAM,EAAE,CAAC;YACjB,QAAQ,EAAE,MAAM,CAAC;SAClB,CAAC;QACF,aAAa,CAAC,EAAE,MAAM,OAAO,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC,CAAC;QACxD,eAAe,CAAC,EAAE,CAChB,KAAK,EAAE,IAAI,EAAE,KACV,OAAO,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC,CAAC;KACxC,CAAC;IACF,iBAAiB,EAAE;QACjB,KAAK,CAAC,EAAE,mBAAmB,CAAC,OAAO,CAAC,CAAC;QACrC,YAAY,CAAC,EAAE,OAAO,CAAC;QACvB,WAAW,CAAC,EAAE,MAAM,OAAO,CAAC,mBAAmB,CAAC,OAAO,CAAC,CAAC,CAAC;QAC1D,cAAc,CAAC,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAC;KACtC,CAAC;CACH,CAAC;AA6EF,wBAAgB,YAAY,CAAC,EAC3B,MAAM,EACN,OAAO,EACP,SAAS,EACT,iBAAiB,EACjB,YAAY,EACZ,OAAO,EACP,eAAe,EACf,WAAW,EACX,cAAc,EACd,YAAY,EACZ,oBAAoB,EACpB,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,gBAAgB,EAChB,eAAe,EACf,kBAAkB,EAClB,cAAc,EACd,UAAU,EACV,aAAa,EACb,eAAe,EACf,YAAY,EACZ,iBAAiB,EACjB,UAAU,EACV,aAAa,EACb,aAAa,EACb,iBAAiB,GAClB,EAAE,iBAAiB,+BAmRnB"}

package/dist/components/admin/AdminContent.js

@@ -19,7 +19,7 @@ function ConfigEditor({ client, configData, isPageSelection, previewPath, onConf
         }, ...galleryPicker, ...fontLibraryPicker }));
     return (_jsxs("div", { className: "vertebr-config-editor", children: [showPreview ? (_jsxs("div", { className: "vertebr-panel-head", children: [_jsx("h2", { children: isPageSelection ? "Page content" : configData.label }), _jsxs("span", { className: "vertebr-count", children: [Object.keys(configData.schema).length, " fields"] })] })) : isPageSelection ? (_jsxs("div", { className: "vertebr-panel-head", children: [_jsx("h2", { children: "Page content" }), _jsxs("span", { className: "vertebr-count", children: [Object.keys(configData.schema).length, " fields"] })] })) : null, showPreview && previewPath ? (_jsxs("div", { className: "vertebr-page-editor", children: [_jsx("div", { className: "vertebr-page-editor-form", children: form }), _jsx(PagePreviewPane, { previewPath: previewPath, controlId: configData.id, draft: draft ?? configData.value })] })) : (form)] }));
 }
-export function AdminContent({ client, catalog, selection, authRequired, loading, isPageSelection, metricsData, metricsLoading, metricsRange, onMetricsRangeChange, onRefreshMetrics, galleryData, galleryLoading, onRefreshGallery, fontLibraryData, fontLibraryLoading, onRefreshFonts, emailsData, emailsLoading, onRefreshEmails, resourceData, onRefreshResource, configData, onConfigSaved, galleryPicker, fontLibraryPicker, }) {
+export function AdminContent({ client, catalog, selection, onSelectionChange, authRequired, loading, isPageSelection, metricsData, metricsLoading, metricsRange, onMetricsRangeChange, onRefreshMetrics, galleryData, galleryLoading, onRefreshGallery, fontLibraryData, fontLibraryLoading, onRefreshFonts, emailsData, emailsLoading, onRefreshEmails, resourceData, onRefreshResource, configData, onConfigSaved, galleryPicker, fontLibraryPicker, }) {
     if (!catalog) {
         return (_jsx("div", { className: "vertebr-content", children: _jsx("section", { className: "vertebr-panel", children: _jsx("div", { className: "vertebr-empty", children: authRequired
                         ? "Authenticated access required for this environment."
@@ -97,7 +97,15 @@ export function AdminContent({ client, catalog, selection, authRequired, loading
                         ? async (id) => {
                             await client.deleteEmailLibraryTemplate(id);
                         }
-                        : undefined })) : null, selection?.kind === "resource" && resourceData ? (_jsx(ResourcePanel, { schema: resourceData.schema, items: resourceData.items, label: resourceData.label, permissions: resourceData.permissions, actions: resourceData.actions, collectionActions: resourceData.collectionActions, uploads: resourceData.uploads, storageKey: resourceData.id, onUpdate: resourceData.permissions.update
+                        : undefined })) : null, selection?.kind === "resource" && resourceData ? (_jsx(ResourcePanel, { schema: resourceData.schema, items: resourceData.items, label: resourceData.label, initialEditRowId: selection.rowId && selection.id === resourceData.id
+                        ? selection.rowId
+                        : undefined, onEditRowIdChange: (rowId) => {
+                        onSelectionChange?.({
+                            kind: "resource",
+                            id: resourceData.id,
+                            rowId: rowId ?? undefined,
+                        });
+                    }, permissions: resourceData.permissions, actions: resourceData.actions, collectionActions: resourceData.collectionActions, uploads: resourceData.uploads, storageKey: resourceData.id, onUpdate: resourceData.permissions.update
                         ? async (rowId, value) => {
                             await client.updateResource(resourceData.id, rowId, value);
                             await onRefreshResource();

package/dist/components/admin/AdminHeader.d.ts

@@ -1,4 +1,5 @@
 import type { AdminEnvironment } from "@vertebr/client";
+import type { Breadcrumb } from "./breadcrumbs";
 import type { Selection } from "./types";
 export type AdminHeaderProps = {
     activeLabel: string;
@@ -7,9 +8,9 @@ export type AdminHeaderProps = {
     authRequired: boolean;
     selection: Selection;
     isPageSelection: boolean;
-    /** True when the active page/layout has a host previewPath. */
     hasPagePreview?: boolean;
     error: string | null;
+    breadcrumbs: Breadcrumb[];
 };
-export declare function AdminHeader({ activeLabel, activeEnv, catalogLoaded, authRequired, selection, isPageSelection, hasPagePreview, error, }: AdminHeaderProps): import("react").JSX.Element;
+export declare function AdminHeader({ activeLabel, activeEnv, catalogLoaded, authRequired, selection, isPageSelection, hasPagePreview, error, breadcrumbs, }: AdminHeaderProps): import("react").JSX.Element;
 //# sourceMappingURL=AdminHeader.d.ts.map

package/dist/components/admin/AdminHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AdminHeader.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AdminHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACxD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,MAAM,gBAAgB,GAAG;IAC7B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,aAAa,EAAE,OAAO,CAAC;IACvB,YAAY,EAAE,OAAO,CAAC;IACtB,SAAS,EAAE,SAAS,CAAC;IACrB,eAAe,EAAE,OAAO,CAAC;IACzB,+DAA+D;IAC/D,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB,CAAC;AA+CF,wBAAgB,WAAW,CAAC,EAC1B,WAAW,EACX,SAAS,EACT,aAAa,EACb,YAAY,EACZ,SAAS,EACT,eAAe,EACf,cAAc,EACd,KAAK,GACN,EAAE,gBAAgB,+BAgClB"}
+{"version":3,"file":"AdminHeader.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AdminHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACxD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,MAAM,gBAAgB,GAAG;IAC7B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,aAAa,EAAE,OAAO,CAAC;IACvB,YAAY,EAAE,OAAO,CAAC;IACtB,SAAS,EAAE,SAAS,CAAC;IACrB,eAAe,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,WAAW,EAAE,UAAU,EAAE,CAAC;CAC3B,CAAC;AAiDF,wBAAgB,WAAW,CAAC,EAC1B,WAAW,EACX,SAAS,EACT,aAAa,EACb,YAAY,EACZ,SAAS,EACT,eAAe,EACf,cAAc,EACd,KAAK,EACL,WAAW,GACZ,EAAE,gBAAgB,+BA6ClB"}

package/dist/components/admin/AdminHeader.js

@@ -16,7 +16,9 @@ function subtitle({ catalogLoaded, authRequired, selection, isPageSelection, has
         return "Send or schedule branded email to a list or specific people.";
     }
     if (selection?.kind === "resource") {
-        return "Manage records scoped to the selected environment.";
+        return selection.rowId
+            ? "Edit this record — changes apply to the selected environment."
+            : "Manage records scoped to the selected environment.";
     }
     if (selection?.kind === "config") {
         if (hasPagePreview) {
@@ -30,8 +32,8 @@ function subtitle({ catalogLoaded, authRequired, selection, isPageSelection, has
     }
     return "Select a panel.";
 }
-export function AdminHeader({ activeLabel, activeEnv, catalogLoaded, authRequired, selection, isPageSelection, hasPagePreview, error, }) {
-    return (_jsxs("header", { className: "vertebr-header", children: [_jsxs("div", { children: [_jsxs("div", { className: "vertebr-heading-row", children: [_jsx("h1", { children: activeLabel }), activeEnv ? (_jsx("span", { className: "vertebr-env-badge", "data-tone": activeEnv.tone ?? "neutral", children: activeEnv.label })) : null] }), _jsx("p", { children: subtitle({
+export function AdminHeader({ activeLabel, activeEnv, catalogLoaded, authRequired, selection, isPageSelection, hasPagePreview, error, breadcrumbs, }) {
+    return (_jsxs("header", { className: "vertebr-header", children: [_jsxs("div", { children: [breadcrumbs.length > 1 ? (_jsx("ol", { className: "vertebr-breadcrumbs", children: breadcrumbs.map((crumb, index) => (_jsx("li", { children: index === breadcrumbs.length - 1 ? (_jsx("strong", { children: crumb.label })) : (crumb.label) }, `${crumb.label}-${index}`))) })) : null, _jsxs("div", { className: "vertebr-heading-row", children: [_jsx("h1", { children: activeLabel }), activeEnv ? (_jsx("span", { className: "vertebr-env-badge", "data-tone": activeEnv.tone ?? "neutral", children: activeEnv.label })) : null] }), _jsx("p", { children: subtitle({
                             catalogLoaded,
                             authRequired,
                             selection,

package/dist/components/admin/AdminSaveBar.d.ts

@@ -0,0 +1,2 @@
+export declare function AdminSaveBar(): import("react").JSX.Element | null;
+//# sourceMappingURL=AdminSaveBar.d.ts.map

package/dist/components/admin/AdminSaveBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdminSaveBar.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AdminSaveBar.tsx"],"names":[],"mappings":"AAEA,wBAAgB,YAAY,uCAmC3B"}

package/dist/components/admin/AdminSaveBar.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useSaveBar } from "../../hooks/useSaveBar";
+export function AdminSaveBar() {
+    const { state } = useSaveBar();
+    if (!state.visible)
+        return null;
+    return (_jsxs("div", { className: "vertebr-savebar", "data-tone": state.tone, children: [_jsx("div", { className: "vertebr-savebar-message", children: state.saving
+                    ? "Saving…"
+                    : state.message ?? (state.isDirty ? "Unsaved changes" : "Saved") }), _jsxs("div", { className: "vertebr-savebar-actions", children: [state.onDiscard && state.isDirty ? (_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet", disabled: state.saving, onClick: state.onDiscard, children: "Discard" })) : null, state.onSave ? (_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-primary", disabled: state.saving || !state.isDirty, onClick: () => void state.onSave?.(), children: "Save" })) : null] })] }));
+}

package/dist/components/admin/AdminSidebar.d.ts

@@ -1,25 +1,7 @@
-import type { AdminEnvironment } from "@vertebr/client";
-import type { VbTheme } from "../../hooks/useVertebrTheme";
 import type { SidebarNavGroup } from "./types";
 export type AdminSidebarProps = {
-    brand: string;
-    title: string;
-    envList: AdminEnvironment[];
-    environment: string;
-    onEnvironmentChange: (nextEnv: string) => void;
     navGroups: SidebarNavGroup[];
-    getAccessToken?: () => string | null | undefined | Promise<string | null | undefined>;
-    authUserLabel?: string;
-    onSignOut?: () => void | Promise<void>;
-    authRequired: boolean;
-    activeEnv?: AdminEnvironment;
-    token: string;
-    tokenDraft: string;
-    onTokenDraftChange: (value: string) => void;
-    onSaveToken: () => void;
-    onClearToken: () => void;
-    theme: VbTheme;
-    onThemeChange: (theme: VbTheme) => void;
+    collapsed: boolean;
 };
-export declare function AdminSidebar({ brand, title, envList, environment, onEnvironmentChange, navGroups, getAccessToken, authUserLabel, onSignOut, authRequired, activeEnv, token, tokenDraft, onTokenDraftChange, onSaveToken, onClearToken, theme, onThemeChange, }: AdminSidebarProps): import("react").JSX.Element;
+export declare function AdminSidebar({ navGroups, collapsed }: AdminSidebarProps): import("react").JSX.Element;
 //# sourceMappingURL=AdminSidebar.d.ts.map

package/dist/components/admin/AdminSidebar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AdminSidebar.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AdminSidebar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAGxD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AAC3D,OAAO,KAAK,EAAgB,eAAe,EAAE,MAAM,SAAS,CAAC;AAE7D,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,WAAW,EAAE,MAAM,CAAC;IACpB,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,SAAS,EAAE,eAAe,EAAE,CAAC;IAC7B,cAAc,CAAC,EAAE,MACb,MAAM,GACN,IAAI,GACJ,SAAS,GACT,OAAO,CAAC,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACvC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvC,YAAY,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,kBAAkB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,KAAK,EAAE,OAAO,CAAC;IACf,aAAa,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CACzC,CAAC;AA2EF,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,KAAK,EACL,OAAO,EACP,WAAW,EACX,mBAAmB,EACnB,SAAS,EACT,cAAc,EACd,aAAa,EACb,SAAS,EACT,YAAY,EACZ,SAAS,EACT,KAAK,EACL,UAAU,EACV,kBAAkB,EAClB,WAAW,EACX,YAAY,EACZ,KAAK,EACL,aAAa,GACd,EAAE,iBAAiB,+BA8FnB"}
+{"version":3,"file":"AdminSidebar.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AdminSidebar.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAgB,eAAe,EAAE,MAAM,SAAS,CAAC;AAG7D,MAAM,MAAM,iBAAiB,GAAG;IAC9B,SAAS,EAAE,eAAe,EAAE,CAAC;IAC7B,SAAS,EAAE,OAAO,CAAC;CACpB,CAAC;AAwFF,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,iBAAiB,+BAuBvE"}

package/dist/components/admin/AdminSidebar.js

@@ -1,31 +1,27 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
-import { EnvSelect } from "../env/EnvSelect";
-import { ThemeToggle } from "../theme/ThemeToggle";
-function SidebarNavItem({ item }) {
+import { iconForNavKey } from "../ui/icons";
+function SidebarNavItem({ item, collapsed, }) {
     const hasChildren = Boolean(item.children?.length);
     const childActive = item.children?.some((child) => child.active) ?? false;
     const sectionActive = item.active || childActive;
     const [open, setOpen] = useState(sectionActive);
+    const Icon = item.icon ?? iconForNavKey(item.key);
     useEffect(() => {
         if (sectionActive)
             setOpen(true);
     }, [sectionActive]);
     if (!hasChildren) {
-        return (_jsx("button", { type: "button", "data-active": item.active, onClick: item.onSelect, children: item.label }));
+        return (_jsxs("button", { type: "button", "data-active": item.active, title: collapsed ? item.label : undefined, onClick: item.onSelect, children: [_jsx(Icon, { className: "vertebr-nav-icon" }), _jsx("span", { className: "vertebr-nav-label-text", children: item.label })] }));
     }
-    return (_jsxs("div", { className: "vertebr-nav-item", "data-has-children": "true", "data-open": open || undefined, children: [_jsxs("div", { className: "vertebr-nav-parent", children: [_jsx("button", { type: "button", className: "vertebr-nav-parent-label", "data-active": sectionActive && !childActive, "data-section": sectionActive || undefined, onClick: () => {
+    return (_jsxs("div", { className: "vertebr-nav-item", "data-has-children": "true", "data-open": open || undefined, children: [_jsxs("div", { className: "vertebr-nav-parent", children: [_jsxs("button", { type: "button", className: "vertebr-nav-parent-label", "data-active": sectionActive && !childActive, "data-section": sectionActive || undefined, title: collapsed ? item.label : undefined, onClick: () => {
                             setOpen(true);
                             item.onSelect();
-                        }, children: item.label }), _jsx("button", { type: "button", className: "vertebr-nav-parent-toggle", "aria-label": open ? `Collapse ${item.label}` : `Expand ${item.label}`, "aria-expanded": open, onClick: () => setOpen((prev) => !prev), children: _jsx("span", { "aria-hidden": "true", children: open ? "▾" : "▸" }) })] }), open ? (_jsx("div", { className: "vertebr-nav-sub", role: "group", children: item.children.map((child) => (_jsx("button", { type: "button", className: "vertebr-nav-subitem", "data-active": child.active, onClick: () => {
+                        }, children: [_jsx(Icon, { className: "vertebr-nav-icon" }), _jsx("span", { className: "vertebr-nav-label-text", children: item.label })] }), !collapsed ? (_jsx("button", { type: "button", className: "vertebr-nav-parent-toggle", "aria-label": open ? `Collapse ${item.label}` : `Expand ${item.label}`, "aria-expanded": open, onClick: () => setOpen((prev) => !prev), children: _jsx("span", { "aria-hidden": "true", children: open ? "▾" : "▸" }) })) : null] }), open && !collapsed ? (_jsx("div", { className: "vertebr-nav-sub", role: "group", children: item.children.map((child) => (_jsx("button", { type: "button", className: "vertebr-nav-subitem", "data-active": child.active, onClick: () => {
                         setOpen(true);
                         child.onSelect();
                     }, children: child.label }, child.key))) })) : null] }));
 }
-export function AdminSidebar({ brand, title, envList, environment, onEnvironmentChange, navGroups, getAccessToken, authUserLabel, onSignOut, authRequired, activeEnv, token, tokenDraft, onTokenDraftChange, onSaveToken, onClearToken, theme, onThemeChange, }) {
-    return (_jsxs("aside", { className: "vertebr-sidebar", children: [_jsxs("div", { className: "vertebr-sidebar-top", children: [_jsxs("div", { className: "vertebr-brand", children: [_jsx("strong", { children: brand }), _jsx("span", { children: title })] }), envList.length > 0 ? (_jsxs("div", { className: "vertebr-env", children: [_jsx("div", { className: "vertebr-nav-label", children: "Environment" }), _jsx(EnvSelect, { environments: envList, value: environment, onChange: onEnvironmentChange })] })) : null, _jsx("nav", { className: "vertebr-nav", children: navGroups.map((group) => (_jsxs("div", { className: "vertebr-nav-group", children: [_jsx("div", { className: "vertebr-nav-label", children: group.label }), group.items.map((item) => (_jsx(SidebarNavItem, { item: item }, item.key)))] }, group.label))) })] }), _jsxs("div", { className: "vertebr-sidebar-bottom", children: [getAccessToken && authUserLabel ? (_jsxs("div", { className: "vertebr-auth", children: [_jsx("div", { className: "vertebr-nav-label", children: "Signed in" }), _jsx("p", { className: "vertebr-auth-hint", children: authUserLabel }), onSignOut ? (_jsx("button", { type: "button", className: "vertebr-btn", onClick: () => void onSignOut(), children: "Sign out" })) : null] })) : null, !getAccessToken && (authRequired || token) ? (_jsxs("div", { className: "vertebr-auth", children: [_jsx("div", { className: "vertebr-nav-label", children: "Access" }), _jsx("p", { className: "vertebr-auth-hint", children: authRequired
-                                    ? `This environment requires auth${activeEnv?.auth?.claimKey
-                                        ? ` (${activeEnv.auth.claimKey})`
-                                        : ""}.`
-                                    : "Optional access token for protected environments." }), _jsx("input", { className: "vertebr-auth-input", type: "password", placeholder: "Bearer token", value: tokenDraft, onChange: (event) => onTokenDraftChange(event.target.value), autoComplete: "off" }), _jsxs("div", { className: "vertebr-auth-actions", children: [_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-primary", onClick: onSaveToken, children: "Use token" }), token ? (_jsx("button", { type: "button", className: "vertebr-btn", onClick: onClearToken, children: "Clear" })) : null] })] })) : null, _jsx(ThemeToggle, { theme: theme, onChange: onThemeChange })] })] }));
+export function AdminSidebar({ navGroups, collapsed }) {
+    return (_jsx("aside", { className: "vertebr-sidebar", "data-collapsed": collapsed || undefined, children: _jsx("div", { className: "vertebr-sidebar-top", children: _jsx("nav", { className: "vertebr-nav", children: navGroups.map((group) => (_jsxs("div", { className: "vertebr-nav-group", children: [!collapsed ? (_jsx("div", { className: "vertebr-nav-label", children: group.label })) : null, group.items.map((item) => (_jsx(SidebarNavItem, { item: item, collapsed: collapsed }, item.key)))] }, group.label))) }) }) }));
 }

package/dist/components/admin/AdminToastStack.d.ts

@@ -0,0 +1,2 @@
+export declare function AdminToastStack(): import("react").JSX.Element | null;
+//# sourceMappingURL=AdminToastStack.d.ts.map

package/dist/components/admin/AdminToastStack.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdminToastStack.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AdminToastStack.tsx"],"names":[],"mappings":"AAEA,wBAAgB,eAAe,uCA0B9B"}

package/dist/components/admin/AdminToastStack.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useToast } from "../../hooks/useToast";
+export function AdminToastStack() {
+    const { toasts, dismiss } = useToast();
+    if (!toasts.length)
+        return null;
+    return (_jsx("div", { className: "vertebr-toast-stack", "aria-live": "polite", children: toasts.map((toast) => (_jsxs("div", { className: "vertebr-toast", "data-tone": toast.tone, role: "status", children: [_jsx("span", { children: toast.message }), _jsx("button", { type: "button", className: "vertebr-toast-dismiss", "aria-label": "Dismiss", onClick: () => dismiss(toast.id), children: "\u00D7" })] }, toast.id))) }));
+}

package/dist/components/admin/AdminTopBar.d.ts

@@ -0,0 +1,24 @@
+import type { AdminEnvironment } from "@vertebr/client";
+import type { VbTheme } from "../../hooks/useVertebrTheme";
+export type AdminTopBarProps = {
+    brand: string;
+    envList: AdminEnvironment[];
+    environment: string;
+    onEnvironmentChange: (nextEnv: string) => void;
+    activeEnv?: AdminEnvironment;
+    authUserLabel?: string;
+    onSignOut?: () => void | Promise<void>;
+    getAccessToken?: () => string | null | undefined | Promise<string | null | undefined>;
+    authRequired: boolean;
+    token: string;
+    tokenDraft: string;
+    onTokenDraftChange: (value: string) => void;
+    onSaveToken: () => void;
+    onClearToken: () => void;
+    theme: VbTheme;
+    onThemeChange: (theme: VbTheme) => void;
+    sidebarCollapsed: boolean;
+    onToggleSidebar: () => void;
+};
+export declare function AdminTopBar({ brand, envList, environment, onEnvironmentChange, activeEnv, authUserLabel, onSignOut, getAccessToken, authRequired, token, tokenDraft, onTokenDraftChange, onSaveToken, onClearToken, theme, onThemeChange, sidebarCollapsed, onToggleSidebar, }: AdminTopBarProps): import("react").JSX.Element;
+//# sourceMappingURL=AdminTopBar.d.ts.map

package/dist/components/admin/AdminTopBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdminTopBar.d.ts","sourceRoot":"","sources":["../../../src/components/admin/AdminTopBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAGxD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AAG3D,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,WAAW,EAAE,MAAM,CAAC;IACpB,mBAAmB,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACvC,cAAc,CAAC,EAAE,MACb,MAAM,GACN,IAAI,GACJ,SAAS,GACT,OAAO,CAAC,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACvC,YAAY,EAAE,OAAO,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,kBAAkB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB,KAAK,EAAE,OAAO,CAAC;IACf,aAAa,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,gBAAgB,EAAE,OAAO,CAAC;IAC1B,eAAe,EAAE,MAAM,IAAI,CAAC;CAC7B,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,OAAO,EACP,WAAW,EACX,mBAAmB,EACnB,SAAS,EACT,aAAa,EACb,SAAS,EACT,cAAc,EACd,YAAY,EACZ,KAAK,EACL,UAAU,EACV,kBAAkB,EAClB,WAAW,EACX,YAAY,EACZ,KAAK,EACL,aAAa,EACb,gBAAgB,EAChB,eAAe,GAChB,EAAE,gBAAgB,+BAsFlB"}

package/dist/components/admin/AdminTopBar.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { EnvSelect } from "../env/EnvSelect";
+import { ThemeToggle } from "../theme/ThemeToggle";
+import { IconSearch } from "../ui/icons";
+export function AdminTopBar({ brand, envList, environment, onEnvironmentChange, activeEnv, authUserLabel, onSignOut, getAccessToken, authRequired, token, tokenDraft, onTokenDraftChange, onSaveToken, onClearToken, theme, onThemeChange, sidebarCollapsed, onToggleSidebar, }) {
+    return (_jsxs("header", { className: "vertebr-topbar", children: [_jsxs("div", { className: "vertebr-topbar-start", children: [_jsx("button", { type: "button", className: "vertebr-topbar-toggle", "aria-label": sidebarCollapsed ? "Expand sidebar" : "Collapse sidebar", onClick: onToggleSidebar, children: "\u2630" }), _jsx("strong", { className: "vertebr-topbar-brand", children: brand }), envList.length > 0 ? (_jsxs("div", { className: "vertebr-topbar-env", children: [_jsx(EnvSelect, { environments: envList, value: environment, onChange: onEnvironmentChange }), activeEnv ? (_jsx("span", { className: "vertebr-env-badge", "data-tone": activeEnv.tone ?? "neutral", children: activeEnv.label })) : null] })) : null] }), _jsxs("div", { className: "vertebr-topbar-search", "aria-hidden": "true", children: [_jsx(IconSearch, {}), _jsx("span", { children: "Search admin" }), _jsx("kbd", { children: "\u2318K" })] }), _jsxs("div", { className: "vertebr-topbar-end", children: [!getAccessToken && (authRequired || token) ? (_jsxs("div", { className: "vertebr-topbar-token", children: [_jsx("input", { className: "vertebr-auth-input", type: "password", placeholder: "Access token", value: tokenDraft, onChange: (event) => onTokenDraftChange(event.target.value), autoComplete: "off" }), _jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet", onClick: onSaveToken, children: "Use" }), token ? (_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet", onClick: onClearToken, children: "Clear" })) : null] })) : null, getAccessToken && authUserLabel ? (_jsx("span", { className: "vertebr-topbar-user", children: authUserLabel })) : null, onSignOut ? (_jsx("button", { type: "button", className: "vertebr-btn vertebr-btn-quiet", onClick: () => void onSignOut(), children: "Sign out" })) : null, _jsx(ThemeToggle, { theme: theme, onChange: onThemeChange })] })] }));
+}

package/dist/components/admin/VertebrAdmin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VertebrAdmin.d.ts","sourceRoot":"","sources":["../../../src/components/admin/VertebrAdmin.tsx"],"names":[],"mappings":"AA8BA,OAAO,KAAK,EAGV,iBAAiB,EAClB,MAAM,SAAS,CAAC;AAEjB,YAAY,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD,wBAAgB,YAAY,CAAC,EAC3B,OAAsB,EACtB,QAAQ,EAAE,YAAY,EACtB,KAAuB,EACvB,aAA6B,EAC7B,eAAiC,EACjC,eAAiC,EACjC,sBAAgD,EAChD,cAAc,EACd,aAAa,EACb,SAAS,GACV,EAAE,iBAAiB,+BA+iBnB"}
+{"version":3,"file":"VertebrAdmin.d.ts","sourceRoot":"","sources":["../../../src/components/admin/VertebrAdmin.tsx"],"names":[],"mappings":"AAqCA,OAAO,KAAK,EAGV,iBAAiB,EAClB,MAAM,SAAS,CAAC;AAEjB,YAAY,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD,wBAAgB,YAAY,CAAC,EAC3B,OAAsB,EACtB,QAAQ,EAAE,YAAY,EACtB,KAAuB,EACvB,aAA6B,EAC7B,eAAiC,EACjC,eAAiC,EACjC,sBAAgD,EAChD,cAAc,EACd,aAAa,EACb,SAAS,GACV,EAAE,iBAAiB,+BAskBnB"}

package/dist/components/admin/VertebrAdmin.js

@@ -5,10 +5,17 @@ import { useVertebrTheme } from "../../hooks/useVertebrTheme";
 import { parseMetricsRangeId, } from "../../lib/metricsRanges";
 import { AdminContent } from "./AdminContent";
 import { AdminHeader } from "./AdminHeader";
+import { AdminSaveBar } from "./AdminSaveBar";
 import { AdminSidebar } from "./AdminSidebar";
+import { AdminToastStack } from "./AdminToastStack";
+import { AdminTopBar } from "./AdminTopBar";
+import { breadcrumbsForSelection } from "./breadcrumbs";
 import { adminBaseFromApiBase, coerceSelection, defaultSelection, hrefForSelection, selectionFromPath, selectionsEqual, } from "./routes";
 import { sidebarGroups } from "./sidebar";
 import { clearStored, readStored, writeStored } from "./storage";
+import { SaveBarProvider } from "../../hooks/useSaveBar";
+import { ToastProvider } from "../../hooks/useToast";
+import { iconForNavKey } from "../ui/icons";
 export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, title = "Control plane", envStorageKey = "vertebr:env", tokenStorageKey = "vertebr:token", themeStorageKey = "vertebr:theme", metricsRangeStorageKey = "vertebr:metrics-range", getAccessToken, authUserLabel, onSignOut, }) {
     const basePath = basePathProp ?? adminBaseFromApiBase(apiBase);
     const { theme, setTheme } = useVertebrTheme(themeStorageKey);
@@ -43,6 +50,7 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
     const [emailsLoading, setEmailsLoading] = useState(false);
     const [error, setError] = useState(null);
     const [loading, setLoading] = useState(true);
+    const [sidebarCollapsed, setSidebarCollapsed] = useState(false);
     /** Skip pushState when selection was applied from the URL (catalog/popstate). */
     const skipNextUrlPush = useRef(true);
     const syncUrl = useCallback((next, catalogSnapshot, replace = false) => {
@@ -371,6 +379,7 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
                 key: "overview",
                 group: catalog.metrics.group ?? "Analytics",
                 label: catalog.metrics.label,
+                icon: iconForNavKey("overview"),
                 active: selection?.kind === "overview",
                 onSelect: () => setSelection({ kind: "overview" }),
             });
@@ -380,6 +389,7 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
                 key: `resource:${resource.id}`,
                 group: resource.group ?? "Resources",
                 label: resource.label,
+                icon: iconForNavKey(`resource:${resource.id}`),
                 active: selection?.kind === "resource" && selection.id === resource.id,
                 onSelect: () => setSelection({ kind: "resource", id: resource.id }),
             });
@@ -389,6 +399,7 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
                 key: "gallery",
                 group: catalog.gallery.group ?? "Resources",
                 label: catalog.gallery.label,
+                icon: iconForNavKey("gallery"),
                 active: selection?.kind === "gallery",
                 onSelect: () => setSelection({ kind: "gallery" }),
             });
@@ -398,6 +409,7 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
                 key: "fonts",
                 group: catalog.fontLibrary.group ?? "Resources",
                 label: catalog.fontLibrary.label,
+                icon: iconForNavKey("fonts"),
                 active: selection?.kind === "fontLibrary",
                 onSelect: () => setSelection({ kind: "fontLibrary" }),
             });
@@ -408,6 +420,7 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
                 key: "emails",
                 group: catalog.emails.group ?? "Growth",
                 label: catalog.emails.label,
+                icon: iconForNavKey("emails"),
                 active: selection?.kind === "emails",
                 onSelect: () => setSelection({ kind: "emails", tab: "compose" }),
                 children: [
@@ -438,6 +451,7 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
                 key: `config:${config.id}`,
                 group: config.group ?? fallback,
                 label: config.label,
+                icon: iconForNavKey(`config:${config.id}`),
                 active: selection?.kind === "config" && selection.id === config.id,
                 onSelect: () => setSelection({ kind: "config", id: config.id }),
             });
@@ -463,5 +477,5 @@ export function VertebrAdmin({ apiBase = "/admin/api", basePath: basePathProp, t
                         : selection?.kind === "config"
                             ? catalog?.configs.find((c) => c.id === selection.id)?.label
                             : null;
-    return (_jsxs("div", { className: "vertebr-root", "data-env": environment, children: [_jsx(AdminSidebar, { brand: bootstrap?.brand ?? catalog?.brand ?? "Vertebr", title: title, envList: envList, environment: environment, onEnvironmentChange: switchEnvironment, navGroups: navGroups, getAccessToken: getAccessToken, authUserLabel: authUserLabel, onSignOut: onSignOut, authRequired: authRequired, activeEnv: activeEnv, token: token, tokenDraft: tokenDraft, onTokenDraftChange: setTokenDraft, onSaveToken: saveToken, onClearToken: clearToken, theme: theme, onThemeChange: setTheme }), _jsxs("main", { className: "vertebr-main", children: [_jsx(AdminHeader, { activeLabel: activeLabel ?? (catalog ? "Dashboard" : "Sign in"), activeEnv: activeEnv, catalogLoaded: Boolean(catalog), authRequired: authRequired, selection: selection, isPageSelection: isPageSelection, hasPagePreview: hasPagePreview, error: error }), _jsx(AdminContent, { client: client, catalog: catalog, selection: selection, authRequired: authRequired, loading: loading, isPageSelection: isPageSelection, metricsData: metricsData, metricsLoading: metricsLoading, metricsRange: metricsRange, onMetricsRangeChange: changeMetricsRange, onRefreshMetrics: refreshMetrics, galleryData: galleryData, galleryLoading: galleryLoading, onRefreshGallery: refreshGallery, fontLibraryData: fontLibraryData, fontLibraryLoading: fontLibraryLoading, onRefreshFonts: refreshFonts, emailsData: emailsData, emailsLoading: emailsLoading, onRefreshEmails: refreshEmails, resourceData: resourceData, onRefreshResource: refreshResource, configData: configData, onConfigSaved: setConfigData, galleryPicker: galleryPicker, fontLibraryPicker: fontLibraryPicker })] })] }));
+    return (_jsx(SaveBarProvider, { children: _jsx(ToastProvider, { children: _jsxs("div", { className: "vertebr-root", "data-env": environment, "data-sidebar-collapsed": sidebarCollapsed || undefined, children: [_jsx(AdminTopBar, { brand: bootstrap?.brand ?? catalog?.brand ?? "Vertebr", envList: envList, environment: environment, onEnvironmentChange: switchEnvironment, activeEnv: activeEnv, authUserLabel: authUserLabel, onSignOut: onSignOut, getAccessToken: getAccessToken, authRequired: authRequired, token: token, tokenDraft: tokenDraft, onTokenDraftChange: setTokenDraft, onSaveToken: saveToken, onClearToken: clearToken, theme: theme, onThemeChange: setTheme, sidebarCollapsed: sidebarCollapsed, onToggleSidebar: () => setSidebarCollapsed((prev) => !prev) }), _jsx(AdminSidebar, { navGroups: navGroups, collapsed: sidebarCollapsed }), _jsxs("main", { className: "vertebr-main", children: [_jsx(AdminHeader, { activeLabel: activeLabel ?? (catalog ? "Dashboard" : "Sign in"), activeEnv: activeEnv, catalogLoaded: Boolean(catalog), authRequired: authRequired, selection: selection, isPageSelection: isPageSelection, hasPagePreview: hasPagePreview, error: error, breadcrumbs: breadcrumbsForSelection(selection, catalog) }), _jsx(AdminContent, { client: client, catalog: catalog, selection: selection, onSelectionChange: setSelection, authRequired: authRequired, loading: loading, isPageSelection: isPageSelection, metricsData: metricsData, metricsLoading: metricsLoading, metricsRange: metricsRange, onMetricsRangeChange: changeMetricsRange, onRefreshMetrics: refreshMetrics, galleryData: galleryData, galleryLoading: galleryLoading, onRefreshGallery: refreshGallery, fontLibraryData: fontLibraryData, fontLibraryLoading: fontLibraryLoading, onRefreshFonts: refreshFonts, emailsData: emailsData, emailsLoading: emailsLoading, onRefreshEmails: refreshEmails, resourceData: resourceData, onRefreshResource: refreshResource, configData: configData, onConfigSaved: setConfigData, galleryPicker: galleryPicker, fontLibraryPicker: fontLibraryPicker }), _jsx(AdminSaveBar, {})] }), _jsx(AdminToastStack, {})] }) }) }));
 }

package/dist/components/admin/breadcrumbs.d.ts

@@ -0,0 +1,8 @@
+import type { CatalogResponse } from "@vertebr/client";
+import type { Selection } from "./types";
+export type Breadcrumb = {
+    label: string;
+    href?: string;
+};
+export declare function breadcrumbsForSelection(selection: Selection, catalog: CatalogResponse | null): Breadcrumb[];
+//# sourceMappingURL=breadcrumbs.d.ts.map

package/dist/components/admin/breadcrumbs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breadcrumbs.d.ts","sourceRoot":"","sources":["../../../src/components/admin/breadcrumbs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAEzC,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,wBAAgB,uBAAuB,CACrC,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,eAAe,GAAG,IAAI,GAC9B,UAAU,EAAE,CA6Cd"}

package/dist/components/admin/breadcrumbs.js

@@ -0,0 +1,44 @@
+export function breadcrumbsForSelection(selection, catalog) {
+    const crumbs = [{ label: "Home", href: "/overview" }];
+    if (!selection || !catalog)
+        return crumbs;
+    switch (selection.kind) {
+        case "overview":
+            return [...crumbs, { label: catalog.metrics?.label ?? "Overview" }];
+        case "gallery":
+            return [...crumbs, { label: catalog.gallery?.label ?? "Gallery" }];
+        case "fontLibrary":
+            return [...crumbs, { label: catalog.fontLibrary?.label ?? "Fonts" }];
+        case "emails":
+            return [
+                ...crumbs,
+                { label: catalog.emails?.label ?? "Email" },
+                {
+                    label: selection.tab === "templates"
+                        ? "Templates"
+                        : selection.tab === "activity"
+                            ? "Activity"
+                            : "Compose",
+                },
+            ];
+        case "resource": {
+            const resource = catalog.resources.find((item) => item.id === selection.id);
+            const items = [
+                ...crumbs,
+                { label: resource?.group ?? "Products", href: undefined },
+                { label: resource?.label ?? selection.id },
+            ];
+            if (selection.rowId) {
+                items.push({ label: selection.rowId });
+            }
+            return items;
+        }
+        case "config": {
+            const config = catalog.configs.find((item) => item.id === selection.id);
+            const group = config?.group ?? (config?.section === "page" ? "Pages" : "Settings");
+            return [...crumbs, { label: group }, { label: config?.label ?? selection.id }];
+        }
+        default:
+            return crumbs;
+    }
+}

package/dist/components/admin/routes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"routes.d.ts","sourceRoot":"","sources":["../../../src/components/admin/routes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,KAAK,EAAa,SAAS,EAAE,MAAM,SAAS,CAAC;AAIpD;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAO5D;AAOD,iEAAiE;AACjE,wBAAgB,gBAAgB,CAC9B,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,eAAe,GACvB,MAAM,CAuBR;AAED,wBAAgB,gBAAgB,CAC9B,QAAQ,EAAE,MAAM,EAChB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,eAAe,GACvB,MAAM,CAIR;AASD;;;GAGG;AACH,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,MAAM,EAChB,OAAO,EAAE,eAAe,GAAG,IAAI,GAC9B,SAAS,GAAG,IAAI,CAoClB;AAED,8DAA8D;AAC9D,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,eAAe,GAAG,SAAS,CAUpE;AAED,+DAA+D;AAC/D,wBAAgB,eAAe,CAC7B,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,eAAe,GACvB,SAAS,CAyBX;AAED,wBAAgB,eAAe,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,SAAS,GAAG,OAAO,CAanE"}
+{"version":3,"file":"routes.d.ts","sourceRoot":"","sources":["../../../src/components/admin/routes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,KAAK,EAAa,SAAS,EAAE,MAAM,SAAS,CAAC;AAIpD;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAO5D;AAOD,iEAAiE;AACjE,wBAAgB,gBAAgB,CAC9B,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,eAAe,GACvB,MAAM,CA0BR;AAED,wBAAgB,gBAAgB,CAC9B,QAAQ,EAAE,MAAM,EAChB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,eAAe,GACvB,MAAM,CAIR;AASD;;;GAGG;AACH,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,MAAM,EAChB,OAAO,EAAE,eAAe,GAAG,IAAI,GAC9B,SAAS,GAAG,IAAI,CAuClB;AAED,8DAA8D;AAC9D,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,eAAe,GAAG,SAAS,CAUpE;AAED,+DAA+D;AAC/D,wBAAgB,eAAe,CAC7B,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,eAAe,GACvB,SAAS,CAyBX;AAED,wBAAgB,eAAe,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,EAAE,SAAS,GAAG,OAAO,CAenE"}

package/dist/components/admin/routes.js

@@ -32,6 +32,9 @@ export function pathForSelection(selection, catalog) {
             return `/emails/${tab}`;
         }
         case "resource":
+            if (selection.rowId) {
+                return `/resources/${encodeURIComponent(selection.id)}/${encodeURIComponent(selection.rowId)}`;
+            }
             return `/resources/${encodeURIComponent(selection.id)}`;
         case "config": {
             const config = catalog.configs.find((item) => item.id === selection.id);
@@ -86,6 +89,9 @@ export function selectionFromPath(pathname, basePath, catalog) {
         if (catalog && !catalog.resources.some((item) => item.id === id)) {
             return null;
         }
+        if (tail[1]) {
+            return { kind: "resource", id, rowId: decodeURIComponent(tail[1]) };
+        }
         return { kind: "resource", id };
     }
     if ((head === "pages" || head === "config") && tail[0]) {
@@ -162,8 +168,9 @@ export function selectionsEqual(a, b) {
     if (a.kind === "emails" && b.kind === "emails") {
         return (a.tab ?? "compose") === (b.tab ?? "compose");
     }
-    if (a.kind === "resource" && b.kind === "resource")
-        return a.id === b.id;
+    if (a.kind === "resource" && b.kind === "resource") {
+        return a.id === b.id && (a.rowId ?? "") === (b.rowId ?? "");
+    }
     if (a.kind === "config" && b.kind === "config")
         return a.id === b.id;
     return false;

package/dist/components/admin/types.d.ts

@@ -22,12 +22,17 @@ export type VertebrAdminProps = {
     /** Host-provided sign-out action. */
     onSignOut?: () => void | Promise<void>;
 };
+import type { ReactElement } from "react";
 export type EmailsTab = "compose" | "templates" | "activity";
+export type NavIcon = (props: {
+    className?: string;
+}) => ReactElement;
 export type Selection = {
     kind: "overview";
 } | {
     kind: "resource";
     id: string;
+    rowId?: string;
 } | {
     kind: "gallery";
 } | {
@@ -52,6 +57,7 @@ export type SidebarEntry = {
         active: boolean;
         onSelect: () => void;
     }>;
+    icon?: NavIcon;
 };
 export type SidebarNavGroup = {
     label: string;

package/dist/components/admin/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/admin/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,kDAAkD;IAClD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gEAAgE;IAChE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,4CAA4C;IAC5C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,uDAAuD;IACvD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sDAAsD;IACtD,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,oEAAoE;IACpE,cAAc,CAAC,EAAE,MACb,MAAM,GACN,IAAI,GACJ,SAAS,GACT,OAAO,CAAC,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACvC,iDAAiD;IACjD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACxC,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;AAE7D,MAAM,MAAM,SAAS,GACjB;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,GACpB;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,GAChC;IAAE,IAAI,EAAE,SAAS,CAAA;CAAE,GACnB;IAAE,IAAI,EAAE,aAAa,CAAA;CAAE,GACvB;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,GAAG,CAAC,EAAE,SAAS,CAAA;CAAE,GACnC;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,GAC9B,IAAI,CAAC;AAET,MAAM,MAAM,YAAY,GAAG;IACzB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,KAAK,CAAC;QACf,GAAG,EAAE,MAAM,CAAC;QACZ,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,OAAO,CAAC;QAChB,QAAQ,EAAE,MAAM,IAAI,CAAC;KACtB,CAAC,CAAC;CACJ,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/admin/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,iBAAiB,GAAG;IAC9B,kDAAkD;IAClD,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,gEAAgE;IAChE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,4CAA4C;IAC5C,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,uDAAuD;IACvD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,sDAAsD;IACtD,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,oEAAoE;IACpE,cAAc,CAAC,EAAE,MACb,MAAM,GACN,IAAI,GACJ,SAAS,GACT,OAAO,CAAC,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IACvC,iDAAiD;IACjD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACxC,CAAC;AAEF,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;AAE7D,MAAM,MAAM,OAAO,GAAG,CAAC,KAAK,EAAE;IAAE,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,KAAK,YAAY,CAAC;AAEtE,MAAM,MAAM,SAAS,GACjB;IAAE,IAAI,EAAE,UAAU,CAAA;CAAE,GACpB;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAChD;IAAE,IAAI,EAAE,SAAS,CAAA;CAAE,GACnB;IAAE,IAAI,EAAE,aAAa,CAAA;CAAE,GACvB;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,GAAG,CAAC,EAAE,SAAS,CAAA;CAAE,GACnC;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE,GAC9B,IAAI,CAAC;AAET,MAAM,MAAM,YAAY,GAAG;IACzB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,kEAAkE;IAClE,QAAQ,CAAC,EAAE,KAAK,CAAC;QACf,GAAG,EAAE,MAAM,CAAC;QACZ,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,OAAO,CAAC;QAChB,QAAQ,EAAE,MAAM,IAAI,CAAC;KACtB,CAAC,CAAC;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB,CAAC"}

package/dist/components/config/form/ConfigForm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConfigForm.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/ConfigForm.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,YAAY,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAElE,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,KAAK,EACL,MAAM,EACN,WAAW,EACX,OAAkB,EAClB,OAAO,EACP,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,KAAK,EACL,YAAY,EACZ,WAAW,EACX,cAAc,EACd,QAAQ,EACR,WAAW,GACZ,EAAE,eAAe,+BAkGjB"}
+{"version":3,"file":"ConfigForm.d.ts","sourceRoot":"","sources":["../../../../src/components/config/form/ConfigForm.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C,YAAY,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAElE,wBAAgB,UAAU,CAAC,EACzB,MAAM,EACN,KAAK,EACL,MAAM,EACN,WAAW,EACX,OAAkB,EAClB,OAAO,EACP,QAAQ,EACR,aAAa,EACb,aAAa,EACb,eAAe,EACf,KAAK,EACL,YAAY,EACZ,WAAW,EACX,cAAc,EACd,QAAQ,EACR,WAAW,GACZ,EAAE,eAAe,+BAqIjB"}

package/dist/components/config/form/ConfigForm.js

@@ -2,10 +2,14 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useMemo, useState } from "react";
 import { useForm, useWatch } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
+import { useSaveBar } from "../../../hooks/useSaveBar";
+import { useToast } from "../../../hooks/useToast";
 import { buildZodSchema, groupFields, withSpecVisibility, withSpecVisibilityValues, } from "./helpers";
 import { RecordConfigForm } from "./RecordConfigForm";
 import { SettingsConfigForm } from "./SettingsConfigForm";
 export function ConfigForm({ schema, value, onSave, submitLabel, variant = "config", uploads, onUpload, galleryUpload, onListGallery, onUploadGallery, fonts, fontsLoading, onListFonts, onRefreshFonts, onChange, hideActions, }) {
+    const { register, clear } = useSaveBar();
+    const { push: pushToast } = useToast();
     const editorSchema = useMemo(() => (variant === "record" ? withSpecVisibility(schema) : schema), [schema, variant]);
     const editorValue = useMemo(() => variant === "record"
         ? withSpecVisibilityValues(editorSchema, value)
@@ -25,20 +29,58 @@ export function ConfigForm({ schema, value, onSave, submitLabel, variant = "conf
     useEffect(() => {
         form.reset(editorValue);
     }, [editorValue, form]);
+    const onDiscard = () => {
+        form.reset(editorValue);
+        setStatus(null);
+        setTone(undefined);
+    };
     const onSubmit = form.handleSubmit(async (data) => {
         setStatus("Saving…");
         setTone(undefined);
+        register({ saving: true, isDirty: true, visible: true });
         try {
             await onSave(data);
             setStatus("Saved");
             setTone("ok");
+            form.reset(data);
+            pushToast("Changes saved", "ok");
         }
         catch (error) {
-            setStatus(error instanceof Error ? error.message : "Save failed");
+            const message = error instanceof Error ? error.message : "Save failed";
+            setStatus(message);
             setTone("danger");
+            pushToast(message, "danger");
+        }
+        finally {
+            register({ saving: false });
         }
     });
     const isDirty = form.formState.isDirty;
+    useEffect(() => {
+        if (hideActions) {
+            clear();
+            return;
+        }
+        register({
+            visible: isDirty,
+            isDirty,
+            saving: status === "Saving…",
+            message: status ?? undefined,
+            tone,
+            onSave: () => void onSubmit(),
+            onDiscard,
+        });
+        return () => clear();
+    }, [
+        hideActions,
+        isDirty,
+        status,
+        tone,
+        onSubmit,
+        onDiscard,
+        register,
+        clear,
+    ]);
     useEffect(() => {
         const onKeyDown = (event) => {
             if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === "s") {
@@ -49,11 +91,6 @@ export function ConfigForm({ schema, value, onSave, submitLabel, variant = "conf
         window.addEventListener("keydown", onKeyDown);
         return () => window.removeEventListener("keydown", onKeyDown);
     }, [onSubmit]);
-    const onDiscard = () => {
-        form.reset(editorValue);
-        setStatus(null);
-        setTone(undefined);
-    };
     const shared = {
         schema: editorSchema,
         groups,
@@ -74,7 +111,7 @@ export function ConfigForm({ schema, value, onSave, submitLabel, variant = "conf
         tone,
         onDiscard,
         submitLabel,
-        hideActions,
+        hideActions: true,
     };
     if (variant === "record") {
         return _jsx(RecordConfigForm, { ...shared });