themelia-react-ui 2.0.3 → 2.0.5

package/dist/features/theme-tweaker.js

@@ -1,27 +1,26 @@
 "use client";
-import { g as e, h as t } from "../ui-provider-C_U0Xma4.js";
-import { COMPONENT_SCALES as n, SEMANTIC_TONES as r } from "../component-vocabulary.js";
-import { t as i } from "../theme-scope-BJ6eE2xt.js";
+import { b as e, n as t, y as n } from "../ui-provider-C-74NVLc.js";
+import { COMPONENT_SCALES as r, SEMANTIC_TONES as i } from "../component-vocabulary.js";
 import { interpolateString as a, useStrings as o } from "../lib/strings.js";
-import { t as s } from "../utils-BRhFDwuU.js";
-import { n as c } from "../buttons-DPZekJFu.js";
-import { c as l, s as u } from "../typography-UTnveOEy.js";
+import { t as s } from "../utils-B6kKb8jB.js";
+import { n as c } from "../buttons-BedGfygC.js";
+import { c as l, s as u } from "../typography-BQnine1k.js";
 import { t as d } from "../focus-recipes-B653VaLq.js";
-import { r as f, t as p } from "../structure-BmisBK-3.js";
-import { _ as m, g as ee, h, p as te, t as ne, v as g } from "../smart-card-DiC5aac3.js";
-import { i as re, r as ie } from "../overlays-tMkF-VAN.js";
-import { m as ae } from "../primitives-BFK08r9M.js";
-import { t as oe } from "../accordion-Cjb6sx0G.js";
-import { t as _ } from "../badge-HpFqoqSY.js";
+import { r as f, t as p } from "../structure-DuxKl954.js";
+import { _ as m, g as ee, h, p as te, t as ne, v as g } from "../smart-card-CW0hjetE.js";
+import { i as re, r as ie } from "../overlays-BSgCtM2v.js";
+import { m as ae } from "../primitives-ByWgGUgt.js";
+import { t as oe } from "../accordion-B9MHG0cT.js";
+import { t as _ } from "../badge-xIiV_E7f.js";
 import { t as se } from "../theme-mode-css-BB-_RYab.js";
-import { t as v } from "../input-DQdEd0YD.js";
-import { t as y } from "../form-field-CwH9y77i.js";
-import { d as ce } from "../text-inputs-f9Ia-aCi.js";
-import { a as b, l as x } from "../choice-inputs-CNHvARCJ.js";
-import { i as le, n as S } from "../value-inputs-TaX4OjNk.js";
-import { d as ue } from "../forms-numeric-B_jraJaQ.js";
-import { t as de } from "../item-K5_ghvze.js";
-import { i as fe, r as pe, t as me } from "../tabs-CDocW5D1.js";
+import { t as v } from "../input-CvyDQlY7.js";
+import { t as y } from "../form-field-BriWAXyg.js";
+import { d as ce } from "../text-inputs-B1culiSK.js";
+import { a as b, l as x } from "../choice-inputs-zUgBZfE4.js";
+import { i as le, n as S } from "../value-inputs-skdVB2zh.js";
+import { d as ue } from "../forms-numeric-DIhghX1Q.js";
+import { t as de } from "../item-DjCcM18E.js";
+import { i as fe, r as pe, t as me } from "../tabs-e7ko9S2o.js";
 import { forwardRef as C, useEffect as he, useId as w, useImperativeHandle as ge, useMemo as T, useRef as _e, useState as E } from "react";
 import { jsx as D, jsxs as O } from "react/jsx-runtime";
 import { CheckCircle2 as ve, Copy as ye, Download as be, Info as xe, LayoutGrid as Se, Moon as Ce, Palette as k, RotateCcw as we, Search as Te, Settings2 as Ee, Shapes as De, ShieldCheck as A, Sun as Oe, Type as ke } from "lucide-react";
@@ -142,15 +141,15 @@ function Re({ fileName: e, text: t, mimeType: n = "text/plain;charset=utf-8" })
 }
 //#endregion
 //#region src/components/features/theme-tweaker/theme-scope.tsx
-var V = C(function({ theme: e, mode: t = e.mode, className: n, style: r, children: a, ...o }, c) {
-	return /* @__PURE__ */ D(i, {
+var V = C(function({ theme: e, mode: n = e.mode, className: r, style: i, children: a, ...o }, c) {
+	return /* @__PURE__ */ D(t, {
 		...o,
 		ref: c,
-		"data-theme-mode": t,
-		className: s("theme-scope--component", t, n),
+		"data-theme-mode": n,
+		className: s("theme-scope--component", n, r),
 		style: {
-			...B(e, t),
-			...r
+			...B(e, n),
+			...i
 		},
 		children: a
 	});
@@ -190,20 +189,20 @@ function Be({ apply: e, manageModeClass: t, selfRef: n, target: r, theme: i }) {
 }
 //#endregion
 //#region src/components/features/theme-tweaker/admin-ui-theme-provider.tsx
-var Ve = C(function({ config: e, theme: n, mode: r = n.mode, target: i = "document", manageModeClass: a = !0, className: o, children: c, ...l }, u) {
+var Ve = C(function({ config: e, theme: t, mode: r = t.mode, target: i = "document", manageModeClass: a = !0, className: o, children: c, ...l }, u) {
 	let d = _e(null);
 	ge(u, () => d.current);
 	let f = T(() => M({
-		...n,
+		...t,
 		mode: r
-	}), [r, n]);
+	}), [r, t]);
 	return Be({
 		apply: i === "document",
 		manageModeClass: a,
 		selfRef: d,
 		target: i,
 		theme: f
-	}), /* @__PURE__ */ D(t, {
+	}), /* @__PURE__ */ D(n, {
 		config: e,
 		children: /* @__PURE__ */ D(V, {
 			...l,
@@ -295,7 +294,7 @@ var H = /* @__PURE__ */ "--background.--foreground.--card.--card-foreground.--po
 	"--foreground": "Primary text and icon color on the application canvas.",
 	"--primary": "Brand and primary-action color.",
 	"--primary-foreground": "Text and icons on solid primary fills.",
-	"--muted": "Subdued backgrounds for passive regions and skeletons.",
+	"--muted": "Subdued backgrounds for passive regions and tracks.",
 	"--muted-foreground": "Secondary text, metadata, and passive icons.",
 	"--border": "Default divider, outline, and surface-border color.",
 	"--ring": "Focus-visible ring and outline color.",
@@ -703,8 +702,8 @@ function Z(e, t) {
 		label: t.options[e] ?? e.replaceAll("_", " ").replace(/\b\w/g, (e) => e.toUpperCase())
 	}));
 }
-function Ye({ config: e, onChange: t, strings: i = X }) {
-	let a = R(e), o = Z(n, i), s = [
+function Ye({ config: e, onChange: t, strings: n = X }) {
+	let a = R(e), o = Z(r, n), s = [
 		"sunday",
 		"monday",
 		"tuesday",
@@ -714,7 +713,7 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 		"saturday"
 	].map((e, t) => ({
 		value: String(t),
-		label: i.options[e]
+		label: n.options[e]
 	})), c = (e, n, r) => {
 		t({
 			...a,
@@ -733,11 +732,11 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 				children: [/* @__PURE__ */ D(l, {
 					type: "inherit",
 					weight: "semibold",
-					children: i.title
+					children: n.title
 				}), /* @__PURE__ */ D(l, {
 					size: "xs",
 					type: "secondary",
-					children: i.description
+					children: n.description
 				})]
 			}),
 			/* @__PURE__ */ O(te, {
@@ -746,24 +745,24 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 				className: "theme-tweaker--provider-boundary",
 				children: [
 					/* @__PURE__ */ D(xe, { "aria-hidden": "true" }),
-					/* @__PURE__ */ D(g, { children: i.boundaryTitle }),
-					/* @__PURE__ */ D(h, { children: i.boundaryDescription }),
+					/* @__PURE__ */ D(g, { children: n.boundaryTitle }),
+					/* @__PURE__ */ D(h, { children: n.boundaryDescription }),
 					/* @__PURE__ */ O(ee, { children: [
 						/* @__PURE__ */ D(m, {
-							label: i.summary.locale,
-							value: a.formatting?.locale ?? i.options.default
+							label: n.summary.locale,
+							value: a.formatting?.locale ?? n.options.default
 						}),
 						/* @__PURE__ */ D(m, {
-							label: i.summary.currency,
-							value: a.money?.defaultCurrency ?? i.options.default
+							label: n.summary.currency,
+							value: a.money?.defaultCurrency ?? n.options.default
 						}),
 						/* @__PURE__ */ D(m, {
-							label: i.summary.controls,
-							value: i.options[a.density?.defaultScale ?? "md"] ?? a.density?.defaultScale ?? i.options.md
+							label: n.summary.controls,
+							value: n.options[a.density?.defaultScale ?? "md"] ?? a.density?.defaultScale ?? n.options.md
 						}),
 						/* @__PURE__ */ D(m, {
-							label: i.summary.cards,
-							value: i.options[a.card?.defaultSurface ?? "card"] ?? a.card?.defaultSurface ?? i.options.default
+							label: n.summary.cards,
+							value: n.options[a.card?.defaultSurface ?? "card"] ?? a.card?.defaultSurface ?? n.options.default
 						})
 					] })
 				]
@@ -777,35 +776,35 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 				items: [
 					{
 						value: "regional",
-						title: i.sections.regional.title,
-						description: i.sections.regional.description,
+						title: n.sections.regional.title,
+						description: n.sections.regional.description,
 						content: /* @__PURE__ */ O("div", {
 							className: "grid min-w-0 grid-cols-1 gap-space-md @2xl/theme-tweaker-controls:grid-cols-2",
 							children: [
 								/* @__PURE__ */ D(y, {
-									label: i.labels.locale,
+									label: n.labels.locale,
 									children: /* @__PURE__ */ D(v, {
 										value: a.formatting?.locale ?? "",
 										onChange: (e) => c("formatting", "locale", e.target.value)
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.defaultCurrency,
+									label: n.labels.defaultCurrency,
 									children: /* @__PURE__ */ D(v, {
 										value: a.money?.defaultCurrency ?? "",
 										onChange: (e) => c("money", "defaultCurrency", e.target.value.toUpperCase())
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.displayCurrency,
+									label: n.labels.displayCurrency,
 									children: /* @__PURE__ */ D(v, {
 										value: a.money?.displayCurrency ?? "",
-										placeholder: i.displayCurrencyPlaceholder,
+										placeholder: n.displayCurrencyPlaceholder,
 										onChange: (e) => c("money", "displayCurrency", e.target.value.toUpperCase() || void 0)
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.moneyFormat,
+									label: n.labels.moneyFormat,
 									children: /* @__PURE__ */ D(x, {
 										value: a.money?.formatMode,
 										options: Z([
@@ -813,12 +812,12 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 											"with_code",
 											"with_symbol",
 											"locale_aware"
-										], i),
+										], n),
 										onValueChange: (e) => c("money", "formatMode", e)
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.firstDay,
+									label: n.labels.firstDay,
 									children: /* @__PURE__ */ D(x, {
 										value: String(a.dates?.weekStartsOn ?? 1),
 										options: s,
@@ -826,7 +825,7 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.dateFormat,
+									label: n.labels.dateFormat,
 									children: /* @__PURE__ */ D(v, {
 										value: a.dates?.format ?? "",
 										onChange: (e) => c("dates", "format", e.target.value)
@@ -837,13 +836,13 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 					},
 					{
 						value: "content",
-						title: i.sections.content.title,
-						description: i.sections.content.description,
+						title: n.sections.content.title,
+						description: n.sections.content.description,
 						content: /* @__PURE__ */ O("div", {
 							className: "grid min-w-0 grid-cols-1 gap-space-md @2xl/theme-tweaker-controls:grid-cols-2",
 							children: [
 								/* @__PURE__ */ D(y, {
-									label: i.labels.textSize,
+									label: n.labels.textSize,
 									children: /* @__PURE__ */ D(x, {
 										value: a.typography?.defaultTextSize,
 										options: Z([
@@ -854,41 +853,41 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 											"base",
 											"lg",
 											"xl"
-										], i),
+										], n),
 										onValueChange: (e) => c("typography", "defaultTextSize", e)
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.commentComposer,
+									label: n.labels.commentComposer,
 									children: /* @__PURE__ */ D(x, {
 										value: a.comments?.composerPosition,
-										options: Z(["top", "bottom"], i),
+										options: Z(["top", "bottom"], n),
 										onValueChange: (e) => c("comments", "composerPosition", e)
 									})
 								}),
 								/* @__PURE__ */ D(b, {
-									label: i.labels.dualPricing,
-									description: i.dualPricingDescription,
+									label: n.labels.dualPricing,
+									description: n.dualPricingDescription,
 									value: a.money?.dualPricingEnabled ?? !1,
 									onValueChange: (e) => c("money", "dualPricingEnabled", e)
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.dualPricingMode,
+									label: n.labels.dualPricingMode,
 									children: /* @__PURE__ */ D(x, {
 										value: a.money?.displayMode,
 										options: Z([
 											"default_only",
 											"dual",
 											"dynamic"
-										], i),
+										], n),
 										onValueChange: (e) => c("money", "displayMode", e)
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.dualPricingLayout,
+									label: n.labels.dualPricingLayout,
 									children: /* @__PURE__ */ D(x, {
 										value: a.money?.dualPricingDisplay,
-										options: Z(["inline", "lines"], i),
+										options: Z(["inline", "lines"], n),
 										onValueChange: (e) => c("money", "dualPricingDisplay", e)
 									})
 								})
@@ -897,13 +896,13 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 					},
 					{
 						value: "components",
-						title: i.sections.components.title,
-						description: i.sections.components.description,
+						title: n.sections.components.title,
+						description: n.sections.components.description,
 						content: /* @__PURE__ */ O("div", {
 							className: "grid min-w-0 grid-cols-1 gap-space-md @2xl/theme-tweaker-controls:grid-cols-2",
 							children: [
 								/* @__PURE__ */ D(y, {
-									label: i.labels.componentScale,
+									label: n.labels.componentScale,
 									children: /* @__PURE__ */ D(x, {
 										value: a.density?.defaultScale,
 										options: o,
@@ -911,76 +910,76 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.itemVariant,
+									label: n.labels.itemVariant,
 									children: /* @__PURE__ */ D(x, {
 										value: a.item?.defaultVariant,
 										options: Z([
 											"default",
 											"outline",
 											"muted"
-										], i),
+										], n),
 										onValueChange: (e) => c("item", "defaultVariant", e)
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.buttonTone,
+									label: n.labels.buttonTone,
 									children: /* @__PURE__ */ D(x, {
 										value: a.button?.defaultTone,
-										options: Z(r, i),
+										options: Z(i, n),
 										onValueChange: (e) => c("button", "defaultTone", e)
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.buttonStyle,
+									label: n.labels.buttonStyle,
 									children: /* @__PURE__ */ D(x, {
 										value: a.button?.defaultButtonStyle,
 										options: Z([
 											"solid",
 											"outline",
 											"ghost"
-										], i),
+										], n),
 										onValueChange: (e) => c("button", "defaultButtonStyle", e)
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.badgeTone,
+									label: n.labels.badgeTone,
 									children: /* @__PURE__ */ D(x, {
 										value: a.badge?.defaultTone,
-										options: Z(r, i),
+										options: Z(i, n),
 										onValueChange: (e) => c("badge", "defaultTone", e)
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.cardSurface,
+									label: n.labels.cardSurface,
 									children: /* @__PURE__ */ D(x, {
 										value: a.card?.defaultSurface,
 										options: Z([
 											"card",
 											"flat",
 											"framed"
-										], i),
+										], n),
 										onValueChange: (e) => c("card", "defaultSurface", e)
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.spinner,
+									label: n.labels.spinner,
 									children: /* @__PURE__ */ D(x, {
 										value: a.spinner?.defaultVariant,
 										options: Z([
 											"default",
 											"shimmer",
 											"progress"
-										], i),
+										], n),
 										onValueChange: (e) => c("spinner", "defaultVariant", e)
 									})
 								}),
 								/* @__PURE__ */ D(b, {
-									label: i.labels.cardDivider,
-									value: a.card?.defaultHeaderDivider ?? !0,
+									label: n.labels.cardDivider,
+									value: a.card?.defaultHeaderDivider ?? !1,
 									onValueChange: (e) => c("card", "defaultHeaderDivider", e)
 								}),
 								/* @__PURE__ */ D(b, {
-									label: i.labels.cardFooterDivider ?? X.labels.cardFooterDivider,
+									label: n.labels.cardFooterDivider ?? X.labels.cardFooterDivider,
 									value: a.card?.defaultFooterDivider ?? !0,
 									onValueChange: (e) => c("card", "defaultFooterDivider", e)
 								})
@@ -989,13 +988,13 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 					},
 					{
 						value: "toasts",
-						title: i.sections.toasts.title,
-						description: i.sections.toasts.description,
+						title: n.sections.toasts.title,
+						description: n.sections.toasts.description,
 						content: /* @__PURE__ */ O("div", {
 							className: "grid min-w-0 grid-cols-1 gap-space-md @2xl/theme-tweaker-controls:grid-cols-2",
 							children: [
 								/* @__PURE__ */ D(y, {
-									label: i.labels.toastPosition,
+									label: n.labels.toastPosition,
 									children: /* @__PURE__ */ D(x, {
 										value: a.toast?.position,
 										options: Z([
@@ -1005,24 +1004,24 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 											"bottom-right",
 											"bottom-left",
 											"bottom-center"
-										], i),
+										], n),
 										onValueChange: (e) => c("toast", "position", e)
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.toastTheme,
+									label: n.labels.toastTheme,
 									children: /* @__PURE__ */ D(x, {
 										value: a.toast?.theme,
 										options: Z([
 											"light",
 											"dark",
 											"system"
-										], i),
+										], n),
 										onValueChange: (e) => c("toast", "theme", e)
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.toastDuration,
+									label: n.labels.toastDuration,
 									children: /* @__PURE__ */ D(v, {
 										type: "number",
 										min: 1e3,
@@ -1032,7 +1031,7 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 									})
 								}),
 								/* @__PURE__ */ D(y, {
-									label: i.labels.visibleToasts,
+									label: n.labels.visibleToasts,
 									children: /* @__PURE__ */ D(v, {
 										type: "number",
 										min: 1,
@@ -1042,12 +1041,12 @@ function Ye({ config: e, onChange: t, strings: i = X }) {
 									})
 								}),
 								/* @__PURE__ */ D(b, {
-									label: i.labels.closeButton,
+									label: n.labels.closeButton,
 									value: a.toast?.closeButton ?? !0,
 									onValueChange: (e) => c("toast", "closeButton", e)
 								}),
 								/* @__PURE__ */ D(b, {
-									label: i.labels.richColors,
+									label: n.labels.richColors,
 									value: a.toast?.richColors ?? !1,
 									onValueChange: (e) => c("toast", "richColors", e)
 								})