@povio/ui 5.0.0-rc.11 → 5.0.0-rc.12

package/dist/{CanvasComponentsFrame-C0Sf9RcC.js → CanvasComponentsFrame-CZXY0Dxi.js}

@@ -1,4 +1,4 @@
-import { ComponentArtboard } from "./ComponentGallery-DDSqnm9f.js";
+import { ComponentArtboard } from "./ComponentGallery-D4U5hXZL.js";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 //#region src/app-canvas/CanvasComponentsFrame.tsx

package/dist/{ComponentGallery-DDSqnm9f.js → ComponentGallery-D4U5hXZL.js}

@@ -1,5 +1,5 @@
 import { t as createLucideIcon } from "./createLucideIcon-LcezOE4z.js";
-import { i as inspectTokens } from "./UIConfigurator-C_2kgJtm.js";
+import { o as inspectTokens } from "./UIConfigurator-CBU0G6rb.js";
 import { n as ArrowLeft } from "./DropdownMenu-5jmtgLXd.js";
 import { i as ArrowRight } from "./DropdownMenuDesktop-Cl9gZVq0.js";
 import { n as Italic, r as Bold, t as Underline } from "./underline-66hmELxa.js";

package/dist/{UIConfigurator-C_2kgJtm.js → UIConfigurator-CBU0G6rb.js}

@@ -609,7 +609,7 @@ const emptyConfiguration = () => ({
 });
 const ConfigurationContext = createContext(null);
 function UIConfigurationProvider(t0) {
-	const $ = c(48);
+	const $ = c(50);
 	const { defaults, initialValue, onApply, children } = t0;
 	const inheritedOverrides = UIOverrides.useConfig();
 	const [applied, setApplied] = useState(initialValue ?? emptyConfiguration);
@@ -629,89 +629,104 @@ function UIConfigurationProvider(t0) {
 		$[0] = t1;
 	} else t1 = $[0];
 	const hostComponents = t1;
-	const active = previewConfiguration ?? (isOpen ? draft : applied);
 	let t2;
-	if ($[1] !== applied) {
-		t2 = () => {
-			setFloating(false);
-			setDraft(structuredClone(applied));
+	if ($[1] === Symbol.for("react.memo_cache_sentinel")) {
+		t2 = (value, t3) => {
+			if (t3 === void 0 ? false : t3) setOpen(false);
+			setApplied(structuredClone(value));
+			setDraft(structuredClone(value));
+			setPreviewConfiguration(null);
 			setRevision(_temp3$4);
-			setOpen(true);
 		};
-		$[1] = applied;
-		$[2] = t2;
-	} else t2 = $[2];
-	const open = t2;
+		$[1] = t2;
+	} else t2 = $[1];
+	const replaceConfiguration = t2;
+	const active = previewConfiguration ?? (isOpen ? draft : applied);
 	let t3;
-	if ($[3] !== isOpen || $[4] !== open) {
+	if ($[2] !== applied) {
 		t3 = () => {
-			if (isOpen) setRevision(_temp4$4);
+			setFloating(false);
+			setDraft(structuredClone(applied));
+			setRevision(_temp4$4);
+			setOpen(true);
+		};
+		$[2] = applied;
+		$[3] = t3;
+	} else t3 = $[3];
+	const open = t3;
+	let t4;
+	if ($[4] !== isOpen || $[5] !== open) {
+		t4 = () => {
+			if (isOpen) setRevision(_temp5$2);
 			else open();
 			setFloating(true);
 		};
-		$[3] = isOpen;
-		$[4] = open;
-		$[5] = t3;
-	} else t3 = $[5];
-	const openFloating = t3;
-	let t4;
-	if ($[6] !== isOpen || $[7] !== openFloating) {
-		t4 = (name) => {
-			setTokenRequest((current) => ({
+		$[4] = isOpen;
+		$[5] = open;
+		$[6] = t4;
+	} else t4 = $[6];
+	const openFloating = t4;
+	let t5;
+	if ($[7] !== isOpen || $[8] !== openFloating) {
+		t5 = (name) => {
+			setTokenRequest((current_0) => ({
 				name,
-				id: (current?.id ?? 0) + 1
+				id: (current_0?.id ?? 0) + 1
 			}));
 			if (!isOpen) openFloating();
 		};
-		$[6] = isOpen;
-		$[7] = openFloating;
-		$[8] = t4;
-	} else t4 = $[8];
-	const revealToken = t4;
-	let t5;
-	if ($[9] === Symbol.for("react.memo_cache_sentinel")) {
-		t5 = () => setTokenRequest(null);
+		$[7] = isOpen;
+		$[8] = openFloating;
 		$[9] = t5;
 	} else t5 = $[9];
-	const clearTokenRequest = t5;
+	const revealToken = t5;
 	let t6;
-	if ($[10] !== applied) {
-		t6 = () => {
+	if ($[10] === Symbol.for("react.memo_cache_sentinel")) {
+		t6 = () => setTokenRequest(null);
+		$[10] = t6;
+	} else t6 = $[10];
+	const clearTokenRequest = t6;
+	let t7;
+	if ($[11] !== applied) {
+		t7 = () => {
 			setDraft(structuredClone(applied));
 			setOpen(false);
 		};
-		$[10] = applied;
-		$[11] = t6;
-	} else t6 = $[11];
-	const cancel = t6;
-	let t7;
-	if ($[12] !== draft || $[13] !== onApply) {
-		t7 = () => {
+		$[11] = applied;
+		$[12] = t7;
+	} else t7 = $[12];
+	const cancel = t7;
+	let t8;
+	if ($[13] !== draft || $[14] !== onApply) {
+		t8 = () => {
 			onApply?.(structuredClone(draft));
 			setApplied(structuredClone(draft));
 			setOpen(false);
 		};
-		$[12] = draft;
-		$[13] = onApply;
-		$[14] = t7;
-	} else t7 = $[14];
-	const apply = t7;
-	let t8;
-	if ($[15] !== active.overrides || $[16] !== inheritedOverrides) {
-		t8 = applyCvaEdits(inheritedOverrides, active.overrides);
-		$[15] = active.overrides;
-		$[16] = inheritedOverrides;
-		$[17] = t8;
-	} else t8 = $[17];
-	const overrides = t8;
-	const t9 = componentHosts > 0;
-	let t10;
-	if ($[18] !== active || $[19] !== apply || $[20] !== cancel || $[21] !== defaults || $[22] !== draft || $[23] !== floating || $[24] !== inheritedOverrides || $[25] !== isOpen || $[26] !== open || $[27] !== openFloating || $[28] !== revealToken || $[29] !== revision || $[30] !== t9 || $[31] !== tokenRequest) {
-		t10 = {
+		$[13] = draft;
+		$[14] = onApply;
+		$[15] = t8;
+	} else t8 = $[15];
+	const apply = t8;
+	let t9;
+	if ($[16] !== active.overrides || $[17] !== inheritedOverrides) {
+		t9 = applyCvaEdits(inheritedOverrides, active.overrides);
+		$[16] = active.overrides;
+		$[17] = inheritedOverrides;
+		$[18] = t9;
+	} else t9 = $[18];
+	const overrides = t9;
+	const t10 = isOpen ? draft : applied;
+	const t11 = componentHosts > 0;
+	let t12;
+	if ($[19] !== active || $[20] !== apply || $[21] !== cancel || $[22] !== defaults || $[23] !== draft || $[24] !== floating || $[25] !== inheritedOverrides || $[26] !== isOpen || $[27] !== open || $[28] !== openFloating || $[29] !== revealToken || $[30] !== revision || $[31] !== t10 || $[32] !== t11 || $[33] !== tokenRequest) {
+		t12 = {
 			defaults,
 			inheritedOverrides,
 			draft,
 			active,
+			currentConfiguration: t10,
+			replaceConfiguration,
 			setPreviewConfiguration,
 			setDraft,
 			isOpen,
@@ -724,80 +739,84 @@ function UIConfigurationProvider(t0) {
 			revealToken,
 			tokenRequest,
 			clearTokenRequest,
-			componentsHosted: t9,
+			componentsHosted: t11,
 			hostComponents
 		};
-		$[18] = active;
-		$[19] = apply;
-		$[20] = cancel;
-		$[21] = defaults;
-		$[22] = draft;
-		$[23] = floating;
-		$[24] = inheritedOverrides;
-		$[25] = isOpen;
-		$[26] = open;
-		$[27] = openFloating;
-		$[28] = revealToken;
-		$[29] = revision;
-		$[30] = t9;
-		$[31] = tokenRequest;
-		$[32] = t10;
-	} else t10 = $[32];
-	const contextValue = t10;
-	let t11;
-	if ($[33] !== active.theme || $[34] !== defaults) {
-		t11 = runtimeCss(defaults, active.theme);
-		$[33] = active.theme;
-		$[34] = defaults;
-		$[35] = t11;
-	} else t11 = $[35];
-	let t12;
-	if ($[36] !== t11) {
-		t12 = /* @__PURE__ */ jsx("style", {
+		$[19] = active;
+		$[20] = apply;
+		$[21] = cancel;
+		$[22] = defaults;
+		$[23] = draft;
+		$[24] = floating;
+		$[25] = inheritedOverrides;
+		$[26] = isOpen;
+		$[27] = open;
+		$[28] = openFloating;
+		$[29] = revealToken;
+		$[30] = revision;
+		$[31] = t10;
+		$[32] = t11;
+		$[33] = tokenRequest;
+		$[34] = t12;
+	} else t12 = $[34];
+	const contextValue = t12;
+	let t13;
+	if ($[35] !== active.theme || $[36] !== defaults) {
+		t13 = runtimeCss(defaults, active.theme);
+		$[35] = active.theme;
+		$[36] = defaults;
+		$[37] = t13;
+	} else t13 = $[37];
+	let t14;
+	if ($[38] !== t13) {
+		t14 = /* @__PURE__ */ jsx("style", {
 			"data-povio-ui-configuration": true,
-			children: t11
+			children: t13
 		});
-		$[36] = t11;
-		$[37] = t12;
-	} else t12 = $[37];
-	let t13;
-	if ($[38] !== active.config || $[39] !== children) {
-		t13 = /* @__PURE__ */ jsx(UIConfig.Provider, {
+		$[38] = t13;
+		$[39] = t14;
+	} else t14 = $[39];
+	let t15;
+	if ($[40] !== active.config || $[41] !== children) {
+		t15 = /* @__PURE__ */ jsx(UIConfig.Provider, {
 			config: active.config,
 			children
 		});
-		$[38] = active.config;
-		$[39] = children;
-		$[40] = t13;
-	} else t13 = $[40];
-	let t14;
-	if ($[41] !== overrides || $[42] !== t13) {
-		t14 = /* @__PURE__ */ jsx(UIOverrides.Provider, {
+		$[40] = active.config;
+		$[41] = children;
+		$[42] = t15;
+	} else t15 = $[42];
+	let t16;
+	if ($[43] !== overrides || $[44] !== t15) {
+		t16 = /* @__PURE__ */ jsx(UIOverrides.Provider, {
 			config: overrides,
-			children: t13
+			children: t15
 		});
-		$[41] = overrides;
-		$[42] = t13;
-		$[43] = t14;
-	} else t14 = $[43];
-	let t15;
-	if ($[44] !== contextValue || $[45] !== t12 || $[46] !== t14) {
-		t15 = /* @__PURE__ */ jsxs(ConfigurationContext.Provider, {
+		$[43] = overrides;
+		$[44] = t15;
+		$[45] = t16;
+	} else t16 = $[45];
+	let t17;
+	if ($[46] !== contextValue || $[47] !== t14 || $[48] !== t16) {
+		t17 = /* @__PURE__ */ jsxs(ConfigurationContext.Provider, {
 			value: contextValue,
-			children: [t12, t14]
+			children: [t14, t16]
 		});
-		$[44] = contextValue;
-		$[45] = t12;
-		$[46] = t14;
-		$[47] = t15;
-	} else t15 = $[47];
-	return t15;
+		$[46] = contextValue;
+		$[47] = t14;
+		$[48] = t16;
+		$[49] = t17;
+	} else t17 = $[49];
+	return t17;
+}
+function _temp5$2(value_1) {
+	return value_1 + 1;
 }
 function _temp4$4(value_0) {
 	return value_0 + 1;
 }
-function _temp3$4(value) {
-	return value + 1;
+function _temp3$4(current) {
+	return current + 1;
 }
 function _temp2$5(count_0) {
 	return count_0 - 1;
@@ -5424,7 +5443,7 @@ function _temp(t0) {
 }
 //#endregion
 //#region src/configurator/ComponentPreview.tsx
-const ComponentGallery = lazy(() => import("./ComponentGallery-DDSqnm9f.js"));
+const ComponentGallery = lazy(() => import("./ComponentGallery-D4U5hXZL.js"));
 /** Every component, styled by a configuration; the configurator's preview and the App Canvas Components view. */
 function ComponentPreview(t0) {
 	const $ = c(14);
@@ -5769,20 +5788,34 @@ function TokenField({ name, value, original, changed, onChange, onReset, onValid
 	});
 }
 function PopoutOverlay(t0) {
-	const $ = c(3);
-	const { children, className } = t0;
+	const $ = c(6);
+	const { children, className, onOpenChange } = t0;
 	const t1 = className ?? "studio-overlay";
 	let t2;
-	if ($[0] !== children || $[1] !== t1) {
-		t2 = /* @__PURE__ */ jsx("div", {
+	if ($[0] !== onOpenChange) {
+		t2 = (event) => {
+			if (event.key === "Escape" && !event.defaultPrevented) {
+				event.preventDefault();
+				event.stopPropagation();
+				onOpenChange?.(false);
+			}
+		};
+		$[0] = onOpenChange;
+		$[1] = t2;
+	} else t2 = $[1];
+	let t3;
+	if ($[2] !== children || $[3] !== t1 || $[4] !== t2) {
+		t3 = /* @__PURE__ */ jsx("div", {
 			className: t1,
+			onKeyDown: t2,
 			children
 		});
-		$[0] = children;
-		$[1] = t1;
-		$[2] = t2;
-	} else t2 = $[2];
-	return t2;
+		$[2] = children;
+		$[3] = t1;
+		$[4] = t2;
+		$[5] = t3;
+	} else t3 = $[5];
+	return t3;
 }
 function ConfigurationModalContent({ memory, windowBounds, poppedOut, floating, onPopout, onDock, onMinimize, popupBlocked }) {
 	const Overlay = poppedOut || floating ? PopoutOverlay : $8b8d26808cb8cb53$export$8948f78d83984c69;
@@ -5799,7 +5832,7 @@ function ConfigurationModalContent({ memory, windowBounds, poppedOut, floating,
 		return () => observer.disconnect();
 	}, [studioWindow.ref]);
 	const inherited = UIConfig.useConfig();
-	const { defaults, draft, setDraft, isOpen, cancel, apply, revision, tokenRequest, clearTokenRequest, componentsHosted } = useUIConfiguration();
+	const { defaults, draft, setDraft, isOpen, apply, revision, tokenRequest, clearTokenRequest, componentsHosted } = useUIConfiguration();
 	const remembered = memory.current;
 	const [mode, setMode] = useState(remembered.mode ?? "light");
 	const [sizeUnit, setSizeUnit] = useState(remembered.sizeUnit ?? "px");
@@ -5991,7 +6024,7 @@ function ConfigurationModalContent({ memory, windowBounds, poppedOut, floating,
 		}));
 		setInvalidFields({});
 		setResetRevision((value_5) => value_5 + 1);
-		setMessage(`${preset.label} preset applied. Apply settings to keep it.`);
+		setMessage(`${preset.label} preset applied. Changes stay in this session.`);
 	};
 	const setComponent = (key_0, field, value_6) => {
 		setDraft((current_9) => ({
@@ -6200,7 +6233,7 @@ function ConfigurationModalContent({ memory, windowBounds, poppedOut, floating,
 	})] }, key_12);
 	const showTabs = sectionTabList.length > 1 && isTokenSection(section);
 	const overrideCount = `${changedCount} ${changedCount === 1 ? "override" : "overrides"}`;
-	const footerStatus = Object.keys(invalidFields).length ? "Fix invalid values or reset before applying or exporting." : nothingToReset && !changedCount ? "No active changes to reset." : (popupBlocked ? "Allow pop-ups for this site, then try again." : message) || overrideCount;
+	const footerStatus = Object.keys(invalidFields).length ? "Fix invalid values or reset before exporting." : nothingToReset && !changedCount ? "No active changes to reset." : (popupBlocked ? "Allow pop-ups for this site, then try again." : message) || overrideCount;
 	const toggleAllButton = isTokenSection(section) && !flatTab && collapsibleKeys.length > 1 && /* @__PURE__ */ jsxs("button", {
 		type: "button",
 		className: "studio-toggle-all",
@@ -6224,7 +6257,7 @@ function ConfigurationModalContent({ memory, windowBounds, poppedOut, floating,
 		className: `studio-overlay${floating && !poppedOut ? " studio-overlay-floating" : ""}`,
 		isOpen,
 		onOpenChange: (next_2) => {
-			if (!next_2) cancel();
+			if (!next_2) apply();
 		},
 		isDismissable: false,
 		children: /* @__PURE__ */ jsx(Surface, {
@@ -6440,7 +6473,7 @@ function ConfigurationModalContent({ memory, windowBounds, poppedOut, floating,
 									className: "studio-presets",
 									children: [/* @__PURE__ */ jsx("p", {
 										className: "studio-presets-intro",
-										children: "A preset replaces your theme edits with its own. Component defaults and overrides stay as they are; Apply or Save theme keeps it, Cancel discards it."
+										children: "A preset replaces your theme edits with its own. Component defaults and overrides stay as they are; Changes stay in this session. Save theme writes CSS settings to the repository."
 									}), [appThemePreset, ...themePresets].map((preset_0) => {
 										const active = isPresetActive(preset_0, defaults, draft.theme);
 										const colors = presetEdits(preset_0, defaults).light;
@@ -6724,17 +6757,10 @@ function ConfigurationModalContent({ memory, windowBounds, poppedOut, floating,
 								children: footerStatus
 							}),
 							/* @__PURE__ */ jsx("button", {
-								onClick: () => cancel(),
-								children: "Cancel"
-							}),
-							/* @__PURE__ */ jsxs("button", {
 								className: "studio-primary",
-								"aria-label": "Apply settings",
-								disabled: !!Object.keys(invalidFields).length,
-								onClick: () => {
-									apply();
-								},
-								children: [/* @__PURE__ */ jsx(Check, { size: 14 }), " Apply"]
+								"aria-label": "Close UI configuration",
+								onClick: apply,
+								children: "Close"
 							})
 						]
 					}),
@@ -6835,7 +6861,7 @@ function UIConfigurationModal() {
 		width: hostedFloatingWidth
 	};
 	const popout = useStudioPopout(isOpen && !minimized);
-	if ((!isOpen || minimized) && hasLauncher) return createPortal(/* @__PURE__ */ jsx(ConfigurationLauncher, {
+	if ((!isOpen || minimized) && hasLauncher && !componentsHosted) return createPortal(/* @__PURE__ */ jsx(ConfigurationLauncher, {
 		position: launcherPosition,
 		onOpen: () => {
 			setMinimized(false);
@@ -6846,7 +6872,7 @@ function UIConfigurationModal() {
 			if (restorePopout.current) popout.open();
 		}
 	}), document.body);
-	if (!isOpen) return null;
+	if (!isOpen || minimized) return null;
 	const content = /* @__PURE__ */ jsx(ConfigurationModalContent, {
 		memory,
 		windowBounds: floating ? floatingBounds : windowBounds,
@@ -6877,4 +6903,4 @@ function UIConfigurationModal() {
 	}), popout.popup.document.body) : floating ? createPortal(content, document.body) : content;
 }
 //#endregion
-export { getBoxHighlights as a, UIConfigurationProvider as c, Pin as d, Moon as f, inspectTokens as i, useUIConfiguration as l, ColorModeSwitch as n, HighlightOverlay as o, inspectElement as r, InspectorDetails as s, UIConfigurationModal as t, Sun as u };
+export { inspectElement as a, HighlightOverlay as c, emptyConfiguration as d, useUIConfiguration as f, Moon as g, Pin as h, saveThemeCss as i, InspectorDetails as l, Plus as m, ColorModeSwitch as n, inspectTokens as o, Sun as p, getThemeWriter as r, getBoxHighlights as s, UIConfigurationModal as t, UIConfigurationProvider as u };

package/dist/config/app-canvas-tanstack.d.ts

@@ -1,4 +1,4 @@
-import { n as AppCanvasPage, r as AppCanvasPageProps, t as APP_CANVAS_PATH } from "../AppCanvasPage-BTmt8poT.js";
+import { n as AppCanvasPage, r as AppCanvasPageProps, t as APP_CANVAS_PATH } from "../AppCanvasPage-BZ2mrKY4.js";
 import { AnyRoute } from "@tanstack/react-router";
 //#region src/app-canvas/tanstack.d.ts
 interface AppCanvasRouteOptions {

package/dist/config/app-canvas-tanstack.js

@@ -1,4 +1,4 @@
-import { n as AppCanvasPage, r as AppCanvasFrameBridge, t as APP_CANVAS_PATH } from "../AppCanvasPage-BsQrZ8q7.js";
+import { n as AppCanvasPage, r as AppCanvasFrameBridge, t as APP_CANVAS_PATH } from "../AppCanvasPage-DCjiFfQW.js";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 import { createRoute, notFound, useRouter, useRouterState } from "@tanstack/react-router";

package/dist/config/app-canvas.d.ts

@@ -1,5 +1,5 @@
-import { a as AppCanvasProps, c as CanvasPage, d as CanvasRouter, f as discoverCanvasPages, i as AppCanvas, l as CanvasPosition, n as AppCanvasPage, o as CanvasBreakpoint, p as layoutCanvasPages, r as AppCanvasPageProps, s as defaultCanvasBreakpoints, t as APP_CANVAS_PATH, u as CanvasRouteExample } from "../AppCanvasPage-BTmt8poT.js";
-import "../configuration.context-qdjDwQJj.js";
+import { a as AppCanvasProps, c as CanvasPage, d as CanvasRouter, f as discoverCanvasPages, i as AppCanvas, l as CanvasPosition, n as AppCanvasPage, o as CanvasBreakpoint, p as layoutCanvasPages, r as AppCanvasPageProps, s as defaultCanvasBreakpoints, t as APP_CANVAS_PATH, u as CanvasRouteExample } from "../AppCanvasPage-BZ2mrKY4.js";
+import "../configuration.context-iuZu-ie0.js";
 //#region src/app-canvas/AppCanvasFrameBridge.d.ts
 /** Mount once inside the application's existing UIConfigurationProvider. No separate app copy or theme fork. */
 declare function AppCanvasFrameBridge({ href }: {

package/dist/config/app-canvas.js

@@ -1,2 +1,2 @@
-import { a as defaultCanvasBreakpoints, c as layoutCanvasPages, i as AppCanvas, n as AppCanvasPage, o as isAppCanvasFrame, r as AppCanvasFrameBridge, s as discoverCanvasPages, t as APP_CANVAS_PATH } from "../AppCanvasPage-BsQrZ8q7.js";
+import { a as defaultCanvasBreakpoints, c as layoutCanvasPages, i as AppCanvas, n as AppCanvasPage, o as isAppCanvasFrame, r as AppCanvasFrameBridge, s as discoverCanvasPages, t as APP_CANVAS_PATH } from "../AppCanvasPage-DCjiFfQW.js";
 export { APP_CANVAS_PATH, AppCanvas, AppCanvasFrameBridge, AppCanvasPage, defaultCanvasBreakpoints, discoverCanvasPages, isAppCanvasFrame, layoutCanvasPages };

package/dist/config/ui-configurator-vite.d.ts

@@ -3,6 +3,8 @@ import { Plugin } from "vite";
 interface UIConfiguratorPluginOptions {
   /** CSS file relative to this app's Vite root. Must exist inside that root. */
   themeFile?: string;
+  /** Repository canvas JSON, relative to the Vite root. false disables storage. */
+  canvasFile?: string | false;
 }
 /** Adds the configurator's Save theme action to this app's development server. */
 declare function uiConfigurator(options?: UIConfiguratorPluginOptions): Plugin;