@synopackageland/ui 0.12.5 → 0.13.1

package/dist/json.js

@@ -1,13 +1,13 @@
 import { z as t } from "zod";
-import { z as jt } from "zod";
-import { defineCatalog as V } from "@json-render/core";
-import { createStateStore as xt, defineCatalog as Ot } from "@json-render/core";
-import { defineRegistry as z, useBoundProp as b, Renderer as F, JSONUIProvider as M } from "@json-render/vue";
-import { ActionProvider as Pt, JSONUIProvider as _t, Renderer as kt, StateProvider as Ct, ValidationProvider as Rt, VisibilityProvider as It, defineRegistry as Kt, useActions as Lt, useBoundProp as Ut, useStateStore as Dt } from "@json-render/vue";
-import { schema as W } from "@json-render/vue/schema";
-import { schema as qt } from "@json-render/vue/schema";
-import { h as d, defineComponent as B, openBlock as H, createBlock as G, withCtx as X, createVNode as Y } from "vue";
-import { LoadingArea as Q, InputGroup as Z, ListItem as ee, CellStatus as te, CellText as oe, DataTable as R, Dialog as ne, Badge as ie, Progress as se, EmptyState as ae, Callout as re, Card as le, Surface as ce, SettingsRow as de, SettingsSection as pe, FormItem as ue, Form as me, RadioGroup as he, Switch as fe, Checkbox as ge, Select as be, Input as ye, Button as we, SectionTabs as ve, AppSidebar as Se, AppToolbar as je, PageHeader as $e, PageContent as xe, ResponsiveView as Oe, AppLayout as Ae, AppRoot as Pe, getRegisteredIcon as _e } from "./index.js";
+import { z as vt } from "zod";
+import { defineCatalog as F } from "@json-render/core";
+import { createStateStore as $t, defineCatalog as jt } from "@json-render/core";
+import { defineRegistry as M, useBoundProp as b, JSONUIProvider as W, Renderer as B } from "@json-render/vue";
+import { ActionProvider as Ot, JSONUIProvider as At, Renderer as Pt, StateProvider as kt, ValidationProvider as Ct, VisibilityProvider as It, defineRegistry as Rt, useActions as Kt, useBoundProp as Lt, useStateStore as Dt } from "@json-render/vue";
+import { schema as H } from "@json-render/vue/schema";
+import { schema as Nt } from "@json-render/vue/schema";
+import { h as d, defineComponent as G, openBlock as X, createBlock as Y, unref as j, withCtx as Q, createVNode as Z } from "vue";
+import { LoadingArea as ee, InputGroup as te, ListItem as oe, CellStatus as ne, CellText as ie, DataTable as K, Dialog as ae, Badge as se, Progress as re, EmptyState as le, Callout as ce, Card as de, Surface as pe, SettingsRow as ue, SettingsSection as me, FormItem as he, Form as fe, RadioGroup as ge, Switch as be, Checkbox as ye, Select as we, Input as ve, Button as Se, SectionTabs as $e, AppSidebar as je, AppToolbar as xe, PageHeader as Oe, PageContent as Ae, ResponsiveView as Pe, AppLayout as ke, AppRoot as Ce, getRegisteredIcon as Ie } from "./index.js";
 const J = t.lazy(() => t.object({
   key: t.string(),
   label: t.string(),
@@ -16,20 +16,20 @@ const J = t.lazy(() => t.object({
   disabled: t.boolean().optional(),
   selectable: t.boolean().optional(),
   children: t.array(J).optional()
-})), P = t.object({
+})), k = t.object({
   label: t.string(),
   value: t.string(),
   disabled: t.boolean().optional()
-}), ke = P.extend({
+}), Re = k.extend({
   description: t.string().optional()
-}), I = t.object({
+}), L = t.object({
   key: t.string(),
   label: t.string(),
   width: t.string().optional(),
   /** Sets the alignment: DSM keeps every column left; number and date digits get one width. */
   type: t.enum(["text", "number", "date", "actions"]).optional(),
   align: t.enum(["left", "center", "right"]).optional()
-}), q = {
+}), V = {
   AppRoot: {
     props: t.object({
       modalScope: t.enum(["document", "app"]).optional()
@@ -42,10 +42,11 @@ const J = t.lazy(() => t.object({
       sidebarWidth: t.string().optional(),
       minHeight: t.string().optional(),
       responsive: t.boolean().optional(),
-      wideLayout: t.enum(["window", "web"]).optional()
+      wideLayout: t.enum(["window", "web"]).optional(),
+      navigation: t.enum(["sidebar", "top"]).optional()
     }),
     slots: ["default", "sidebar", "toolbar", "footer"],
-    description: 'DSM application interior with optional sidebar, toolbar, main content and footer regions. Set wideLayout "web" only for a standalone Portal page; DSM windows keep the default "window" at every width.'
+    description: `DSM application interior with optional sidebar, toolbar, main content and footer regions. Set wideLayout "web" only for a standalone Portal page; DSM windows keep the default "window" at every width. navigation "top" shows the sidebar slot's SidebarNav as one bar above the page (phones keep the drawer).`
   },
   ResponsiveView: {
     props: t.object({ mode: t.enum(["auto", "mobile", "window", "web"]).optional() }),
@@ -90,7 +91,7 @@ const J = t.lazy(() => t.object({
   Tabs: {
     props: t.object({
       value: t.string(),
-      items: t.array(P),
+      items: t.array(k),
       ariaLabel: t.string().optional()
     }),
     events: ["change"],
@@ -143,7 +144,7 @@ const J = t.lazy(() => t.object({
   Select: {
     props: t.object({
       value: t.string().optional(),
-      options: t.array(P),
+      options: t.array(k),
       placeholder: t.string().optional(),
       disabled: t.boolean().optional(),
       search: t.boolean().optional()
@@ -173,7 +174,7 @@ const J = t.lazy(() => t.object({
   RadioGroup: {
     props: t.object({
       value: t.string().optional(),
-      options: t.array(ke),
+      options: t.array(Re),
       orientation: t.enum(["vertical", "horizontal"]).optional(),
       disabled: t.boolean().optional()
     }),
@@ -295,7 +296,7 @@ const J = t.lazy(() => t.object({
   },
   DataTable: {
     props: t.object({
-      columns: t.array(I),
+      columns: t.array(L),
       rows: t.array(t.record(t.string(), t.unknown())),
       rowKey: t.string().optional(),
       emptyText: t.string().optional(),
@@ -306,7 +307,7 @@ const J = t.lazy(() => t.object({
   },
   ResourceList: {
     props: t.object({
-      columns: t.array(I),
+      columns: t.array(L),
       rows: t.array(t.record(t.string(), t.unknown())),
       rowKey: t.string().optional(),
       emptyText: t.string().optional(),
@@ -355,10 +356,10 @@ const J = t.lazy(() => t.object({
     props: t.object({ text: t.string().optional() }),
     description: "Centered loading state for a page or bounded region."
   }
-}, O = V(W, {
-  components: q,
+}, A = F(H, {
+  components: V,
   actions: {}
-}), Ce = [
+}), Ke = [
   "Prefer AppRoot > AppShell > Page as the normal DSM application hierarchy.",
   "Prefer SettingsSection and SettingsField for settings; prefer ResourceList/DataTable for ordinary scalar resource collections.",
   "Keep state in the spec and use $bindState/$bindItem for editable controls; do not invent JavaScript in props.",
@@ -367,69 +368,70 @@ const J = t.lazy(() => t.object({
   "AppShell adapts to its actual DSM window width: phone (<=600px), desktop window (601–1199px), and wide web/Portal (>=1200px). Never assume browser viewport width.",
   "For a phone-unfriendly custom view, use ResponsiveView slots: mobile alternative and default full view. Keep essential actions accessible on mobile.",
   "Use low-level Stack/Text only when a semantic component does not already express the layout."
-], Re = '## Self-check workflow\n\nInstall `@synopackageland/ui` first. Without a local install, use\n`npx -y -p @synopackageland/ui syno-pkg-land-ui <command>` (pin the package version for reproducibility).\n\n1. List components with `npx --no syno-pkg-land-ui catalog`; read props with `npx --no syno-pkg-land-ui describe <Component>`.\n2. Write the spec as JSON: {"root", "elements", "state"}. Seed every state path you bind or read.\n3. Run `npx --no syno-pkg-land-ui validate ui.json --json` (add --actions, --functions, --state, --messages for host-provided names).\n   Fix every error at its JSON Pointer `path` using its `hint`, then validate again until it passes.\n4. Run `npx --no syno-pkg-land-ui render ui.json --out shots` to screenshot phone, DSM window and wide widths and to\n   report layout overflow; fix reported elements and repeat.\n5. Hand over the spec only when validate and render both exit 0.';
-function mt() {
-  return `${O.prompt({ customRules: Ce })}
+], Le = '## Self-check workflow\n\nInstall `@synopackageland/ui` first. Without a local install, use\n`npx -y -p @synopackageland/ui syno-pkg-land-ui <command>` (pin the package version for reproducibility).\n\n1. List components with `npx --no syno-pkg-land-ui catalog`; read props with `npx --no syno-pkg-land-ui describe <Component>`.\n2. Write the spec as JSON: {"root", "elements", "state"}. Seed every state path you bind or read.\n3. Run `npx --no syno-pkg-land-ui validate ui.json --json` (add --actions, --functions, --state, --messages for host-provided names).\n   Fix every error at its JSON Pointer `path` using its `hint`, then validate again until it passes.\n4. Run `npx --no syno-pkg-land-ui render ui.json --out shots` to screenshot phone, DSM window and wide widths and to\n   report layout overflow; fix reported elements and repeat.\n5. Hand over the spec only when validate and render both exit 0.';
+function pt() {
+  return `${A.prompt({ customRules: Ke })}
 
-${Re}
+${Le}
 `;
 }
-const Ie = {
+const De = {
   none: "0",
   xs: "var(--ui-space-1)",
   sm: "var(--ui-space-2)",
   md: "var(--ui-space-3)",
   lg: "var(--ui-space-4)"
-}, Ke = { start: "flex-start", center: "center", end: "flex-end", stretch: "stretch" }, Le = { start: "flex-start", center: "center", end: "flex-end", between: "space-between" };
-function Ue(e) {
+}, Ue = { start: "flex-start", center: "center", end: "flex-end", stretch: "stretch" }, Ne = { start: "flex-start", center: "center", end: "flex-end", between: "space-between" };
+function Te(e) {
   return { default: () => e };
 }
-function _(e) {
-  return e ? _e(e) : void 0;
+function C(e) {
+  return e ? Ie(e) : void 0;
 }
-function N(e) {
+function _(e) {
   return {
     ...e,
-    icon: _(e.icon),
-    children: e.children?.map(N)
+    icon: C(e.icon),
+    children: e.children?.map(_)
   };
 }
-function De(e) {
-  return e.map((o) => ({ ...o, items: o.items.map(N) }));
+function Ee(e) {
+  return e.map((o) => ({ ...o, items: o.items.map(_) }));
 }
 const Je = {
-  AppRoot: ({ props: e, slots: o }) => d(Pe, { modalScope: e.modalScope }, o),
-  AppShell: ({ props: e, slots: o }) => d(Ae, {
+  AppRoot: ({ props: e, slots: o }) => d(Ce, { modalScope: e.modalScope }, o),
+  AppShell: ({ props: e, slots: o }) => d(ke, {
     sidebarWidth: e.sidebarWidth,
     minHeight: e.minHeight,
     responsive: e.responsive,
-    wideLayout: e.wideLayout
+    wideLayout: e.wideLayout,
+    navigation: e.navigation
   }, o),
-  ResponsiveView: ({ props: e, slots: o }) => d(Oe, { mode: e.mode }, o),
-  Page: ({ props: e, slots: o }) => d(xe, { width: e.width ?? "fill", surface: e.surface }, o),
-  PageHeader: ({ props: e, slots: o }) => d($e, e, o),
-  Toolbar: ({ props: e, slots: o }) => d(je, e, o),
+  ResponsiveView: ({ props: e, slots: o }) => d(Pe, { mode: e.mode }, o),
+  Page: ({ props: e, slots: o }) => d(Ae, { width: e.width ?? "fill", surface: e.surface }, o),
+  PageHeader: ({ props: e, slots: o }) => d(Oe, e, o),
+  Toolbar: ({ props: e, slots: o }) => d(xe, e, o),
   SidebarNav: ({ props: e, bindings: o, emit: n }) => {
-    const [s, i] = b(e.value, o?.value);
-    return d(Se, {
-      modelValue: s,
-      groups: De(e.groups),
+    const [a, i] = b(e.value, o?.value);
+    return d(je, {
+      modelValue: a,
+      groups: Ee(e.groups),
       searchable: e.searchable,
       collapsible: e.collapsible,
       searchPlaceholder: e.searchPlaceholder,
-      "onUpdate:modelValue": (a) => {
-        i(a), n("change");
+      "onUpdate:modelValue": (s) => {
+        i(s), n("change");
       }
     });
   },
   Tabs: ({ props: e, bindings: o, emit: n }) => {
-    const [s, i] = b(e.value, o?.value);
-    return d(ve, {
-      modelValue: s ?? "",
+    const [a, i] = b(e.value, o?.value);
+    return d($e, {
+      modelValue: a ?? "",
       items: e.items,
       ariaLabel: e.ariaLabel,
-      "onUpdate:modelValue": (a) => {
-        i(a), n("change");
+      "onUpdate:modelValue": (s) => {
+        i(s), n("change");
       }
     });
   },
@@ -438,9 +440,9 @@ const Je = {
     style: {
       display: "flex",
       flexDirection: e.direction ?? "column",
-      gap: Ie[e.gap ?? "md"],
-      alignItems: Ke[e.align ?? "stretch"],
-      justifyContent: Le[e.justify ?? "start"],
+      gap: De[e.gap ?? "md"],
+      alignItems: Ue[e.align ?? "stretch"],
+      justifyContent: Ne[e.justify ?? "start"],
       flexWrap: e.wrap ? "wrap" : "nowrap"
     }
   }, o),
@@ -449,8 +451,8 @@ const Je = {
     return d(o === "heading" ? "h2" : o === "mono" ? "code" : "span", { class: o === "muted" ? "text-[13px] text-[var(--ui-text-muted)]" : o === "caption" ? "text-[12px] text-[var(--ui-text-muted)]" : o === "heading" ? "text-[16px] font-semibold text-[var(--ui-text)]" : o === "mono" ? "font-mono text-[12px] text-[var(--ui-text)]" : "text-[13px] text-[var(--ui-text)]", "data-syno-pkg-land-ui": "" }, e.text);
   },
   Button: ({ props: e, emit: o }) => {
-    const n = _(e.icon);
-    return d(we, {
+    const n = C(e.icon);
+    return d(Se, {
       variant: e.variant,
       size: e.size,
       disabled: e.disabled,
@@ -461,9 +463,9 @@ const Je = {
     });
   },
   Input: ({ props: e, bindings: o, emit: n }) => {
-    const [s, i] = b(e.value, o?.value);
-    return d(ye, {
-      modelValue: s,
+    const [a, i] = b(e.value, o?.value);
+    return d(ve, {
+      modelValue: a,
       type: e.type,
       placeholder: e.placeholder,
       disabled: e.disabled,
@@ -471,65 +473,65 @@ const Je = {
       invalid: e.invalid,
       size: e.size,
       ariaLabel: e.ariaLabel,
-      "onUpdate:modelValue": (a) => {
-        i(e.type === "number" && a !== "" ? Number(a) : a), n("change");
+      "onUpdate:modelValue": (s) => {
+        i(e.type === "number" && s !== "" ? Number(s) : s), n("change");
       }
     });
   },
   Select: ({ props: e, bindings: o, emit: n }) => {
-    const [s, i] = b(e.value, o?.value);
-    return d(be, {
-      modelValue: s,
+    const [a, i] = b(e.value, o?.value);
+    return d(we, {
+      modelValue: a,
       options: e.options,
       placeholder: e.placeholder,
       disabled: e.disabled,
       search: e.search,
-      "onUpdate:modelValue": (a) => {
-        i(a), n("change");
+      "onUpdate:modelValue": (s) => {
+        i(s), n("change");
       }
     });
   },
   Checkbox: ({ props: e, bindings: o, emit: n }) => {
-    const [s, i] = b(e.checked, o?.checked);
-    return d(ge, {
-      modelValue: s ?? !1,
+    const [a, i] = b(e.checked, o?.checked);
+    return d(ye, {
+      modelValue: a ?? !1,
       label: e.label,
       description: e.description,
       disabled: e.disabled,
-      "onUpdate:modelValue": (a) => {
-        i(a), n("change");
+      "onUpdate:modelValue": (s) => {
+        i(s), n("change");
       }
     });
   },
   Switch: ({ props: e, bindings: o, emit: n }) => {
-    const [s, i] = b(e.checked, o?.checked);
-    return d(fe, {
-      modelValue: s ?? !1,
+    const [a, i] = b(e.checked, o?.checked);
+    return d(be, {
+      modelValue: a ?? !1,
       label: e.label,
       disabled: e.disabled,
-      "onUpdate:modelValue": (a) => {
-        i(a), n("change");
+      "onUpdate:modelValue": (s) => {
+        i(s), n("change");
       }
     });
   },
   RadioGroup: ({ props: e, bindings: o, emit: n }) => {
-    const [s, i] = b(e.value, o?.value);
-    return d(he, {
-      modelValue: s,
+    const [a, i] = b(e.value, o?.value);
+    return d(ge, {
+      modelValue: a,
       options: e.options,
       orientation: e.orientation,
       disabled: e.disabled,
-      "onUpdate:modelValue": (a) => {
-        i(a), n("change");
+      "onUpdate:modelValue": (s) => {
+        i(s), n("change");
       }
     });
   },
-  Form: ({ props: e, slots: o, emit: n }) => d(me, {
+  Form: ({ props: e, slots: o, emit: n }) => d(fe, {
     direction: e.direction,
     fieldWidth: e.fieldWidth,
     onSubmit: () => n("submit")
   }, o),
-  Field: ({ props: e, slots: o }) => d(ue, {
+  Field: ({ props: e, slots: o }) => d(he, {
     label: e.label,
     description: e.description,
     help: e.help,
@@ -537,55 +539,55 @@ const Je = {
     fieldWidth: e.fieldWidth,
     direction: e.direction
   }, o),
-  SettingsSection: ({ props: e, bindings: o, slots: n, emit: s }) => {
-    const [i, a] = b(e.open, o?.open);
-    return d(pe, {
+  SettingsSection: ({ props: e, bindings: o, slots: n, emit: a }) => {
+    const [i, s] = b(e.open, o?.open);
+    return d(me, {
       title: e.title,
       collapsible: e.collapsible,
       open: i,
       "onUpdate:open": (r) => {
-        a(r), s("openChange");
+        s(r), a("openChange");
       }
     }, n);
   },
-  SettingsField: ({ props: e, slots: o }) => d(de, {
+  SettingsField: ({ props: e, slots: o }) => d(ue, {
     label: e.label,
     description: e.description,
     required: e.required,
     fieldWidth: e.fieldWidth,
     align: e.align
   }, o),
-  Surface: ({ props: e, slots: o }) => d(ce, e, o),
-  Card: ({ props: e, bindings: o, slots: n, emit: s }) => {
-    const [i, a] = b(e.expanded, o?.expanded);
-    return d(le, {
+  Surface: ({ props: e, slots: o }) => d(pe, e, o),
+  Card: ({ props: e, bindings: o, slots: n, emit: a }) => {
+    const [i, s] = b(e.expanded, o?.expanded);
+    return d(de, {
       title: e.title,
       layoutType: e.layoutType,
       expandable: e.expandable,
       expanded: i,
       footerAlign: e.footerAlign,
       "onUpdate:expanded": (r) => {
-        a(r), s("expandedChange");
+        s(r), a("expandedChange");
       }
     }, n);
   },
-  Callout: ({ props: e, slots: o, emit: n }) => d(re, {
+  Callout: ({ props: e, slots: o, emit: n }) => d(ce, {
     tone: e.tone,
     title: e.title,
     closable: e.closable,
     code: e.code,
     onClose: () => n("close")
   }, o),
-  EmptyState: ({ props: e, slots: o }) => d(ae, {
+  EmptyState: ({ props: e, slots: o }) => d(le, {
     title: e.title,
     description: e.description,
-    icon: _(e.icon)
+    icon: C(e.icon)
   }, o),
-  Progress: ({ props: e }) => d(se, e),
-  Badge: ({ props: e }) => d(ie, { tone: e.tone }, Ue(e.text)),
-  Dialog: ({ props: e, bindings: o, slots: n, emit: s }) => {
-    const [i, a] = b(e.open, o?.open);
-    return d(ne, {
+  Progress: ({ props: e }) => d(re, e),
+  Badge: ({ props: e }) => d(se, { tone: e.tone }, Te(e.text)),
+  Dialog: ({ props: e, bindings: o, slots: n, emit: a }) => {
+    const [i, s] = b(e.open, o?.open);
+    return d(ae, {
       open: i ?? !1,
       title: e.title,
       description: e.description,
@@ -593,115 +595,97 @@ const Je = {
       width: e.width,
       showClose: e.showClose,
       "onUpdate:open": (r) => {
-        a(r), s("openChange");
+        s(r), a("openChange");
       }
     }, n);
   },
-  DataTable: ({ props: e }) => d(R, e),
+  DataTable: ({ props: e }) => d(K, e),
   ResourceList: ({ props: e, slots: o }) => d("section", { class: "min-w-0", "data-syno-pkg-land-ui": "", "data-ui-resource-list": "" }, [
     o.toolbar ? d("div", { class: "mb-3 flex flex-wrap items-center gap-2" }, o.toolbar()) : null,
-    d(R, e)
+    d(K, e)
   ]),
-  CellText: ({ props: e, emit: o }) => d(oe, { ...e, onOpen: () => o("open") }),
-  CellStatus: ({ props: e }) => d(te, e),
-  ListItem: ({ props: e, slots: o }) => d(ee, e, o),
-  InputGroup: ({ slots: e }) => d(Z, null, e),
-  Loading: ({ props: e }) => d(Q, { text: e.text })
-}, { registry: qe } = z(O, {
+  CellText: ({ props: e, emit: o }) => d(ie, { ...e, onOpen: () => o("open") }),
+  CellStatus: ({ props: e }) => d(ne, e),
+  ListItem: ({ props: e, slots: o }) => d(oe, e, o),
+  InputGroup: ({ slots: e }) => d(te, null, e),
+  Loading: ({ props: e }) => d(ee, { text: e.text })
+}, { registry: D } = M(A, {
   components: Je
-}), Ne = /* @__PURE__ */ B({
+}), ut = /* @__PURE__ */ G({
   __name: "SynoJsonRenderer",
   props: {
-    spec: { type: [Object, null], required: !0 },
-    store: { type: Object, required: !1 },
-    state: { type: Object, required: !1 },
-    handlers: { type: Object, required: !1 },
-    navigate: { type: Function, required: !1 },
-    functions: { type: Object, required: !1 },
-    directives: { type: Array, required: !1 },
-    validationFunctions: { type: Object, required: !1 },
-    onStateChange: { type: Function, required: !1 },
-    loading: { type: Boolean, required: !1 },
-    fallback: { type: null, required: !1 }
+    spec: {},
+    store: {},
+    state: {},
+    handlers: {},
+    navigate: { type: Function },
+    functions: {},
+    directives: {},
+    validationFunctions: {},
+    onStateChange: { type: Function },
+    loading: { type: Boolean },
+    fallback: {}
   },
-  setup(e, { expose: o }) {
-    o();
-    const n = { get JSONUIProvider() {
-      return M;
-    }, get Renderer() {
-      return F;
-    }, get synoJsonRegistry() {
-      return qe;
-    } };
-    return Object.defineProperty(n, "__isScriptSetup", { enumerable: !1, value: !0 }), n;
+  setup(e) {
+    return (o, n) => (X(), Y(j(W), {
+      registry: j(D),
+      store: e.store,
+      "initial-state": e.state ?? e.spec?.state ?? {},
+      handlers: e.handlers,
+      navigate: e.navigate,
+      functions: e.functions,
+      directives: e.directives,
+      "validation-functions": e.validationFunctions,
+      "on-state-change": e.onStateChange
+    }, {
+      default: Q(() => [
+        Z(j(B), {
+          spec: e.spec,
+          registry: j(D),
+          loading: e.loading,
+          fallback: e.fallback
+        }, null, 8, ["spec", "registry", "loading", "fallback"])
+      ]),
+      _: 1
+    }, 8, ["registry", "store", "initial-state", "handlers", "navigate", "functions", "directives", "validation-functions", "on-state-change"]));
   }
-}), Te = (e, o) => {
-  const n = e.__vccOpts || e;
-  for (const [s, i] of o)
-    n[s] = i;
-  return n;
-};
-function Ee(e, o, n, s, i, a) {
-  return H(), G(s.JSONUIProvider, {
-    registry: s.synoJsonRegistry,
-    store: n.store,
-    "initial-state": n.state ?? n.spec?.state ?? {},
-    handlers: n.handlers,
-    navigate: n.navigate,
-    functions: n.functions,
-    directives: n.directives,
-    "validation-functions": n.validationFunctions,
-    "on-state-change": n.onStateChange
-  }, {
-    default: X(() => [
-      Y(s.Renderer, {
-        spec: n.spec,
-        registry: s.synoJsonRegistry,
-        loading: n.loading,
-        fallback: n.fallback
-      }, null, 8, ["spec", "registry", "loading", "fallback"])
-    ]),
-    _: 1
-    /* STABLE */
-  }, 8, ["registry", "store", "initial-state", "handlers", "navigate", "functions", "directives", "validation-functions", "on-state-change"]);
-}
-const ht = /* @__PURE__ */ Te(Ne, [["render", Ee], ["__file", "/private/tmp/ui-pub-0125/src/json/SynoJsonRenderer.vue"]]), Ve = ["label", "title", "description", "text", "placeholder", "emptyText", "help", "ariaLabel", "valueLabel", "searchPlaceholder"];
-function T(e, o = "") {
-  return Array.isArray(e) ? e : Object.entries(e).flatMap(([n, s]) => m(s) ? T(s, `${o}${n}.`) : [`${o}${n}`]);
+}), Ve = ["label", "title", "description", "text", "placeholder", "emptyText", "help", "ariaLabel", "valueLabel", "searchPlaceholder"];
+function z(e, o = "") {
+  return Array.isArray(e) ? e : Object.entries(e).flatMap(([n, a]) => m(a) ? z(a, `${o}${n}.`) : [`${o}${n}`]);
 }
 const m = (e) => typeof e == "object" && e !== null && !Array.isArray(e), u = (...e) => e.map((o) => "/" + String(o).replaceAll("~", "~0").replaceAll("/", "~1")).join("");
-function ze(e, o) {
-  const n = Array.from({ length: o.length + 1 }, (s, i) => i);
-  for (let s = 1; s <= e.length; s++) {
+function _e(e, o) {
+  const n = Array.from({ length: o.length + 1 }, (a, i) => i);
+  for (let a = 1; a <= e.length; a++) {
     let i = n[0];
-    n[0] = s;
-    for (let a = 1; a <= o.length; a++) {
-      const r = n[a];
-      n[a] = Math.min(n[a] + 1, n[a - 1] + 1, i + (e[s - 1].toLowerCase() === o[a - 1].toLowerCase() ? 0 : 1)), i = r;
+    n[0] = a;
+    for (let s = 1; s <= o.length; s++) {
+      const r = n[s];
+      n[s] = Math.min(n[s] + 1, n[s - 1] + 1, i + (e[a - 1].toLowerCase() === o[s - 1].toLowerCase() ? 0 : 1)), i = r;
     }
   }
   return n[o.length];
 }
 function y(e, o) {
-  let n, s = 1 / 0;
+  let n, a = 1 / 0;
   for (const i of o) {
-    const a = ze(e, i);
-    a < s && ([n, s] = [i, a]);
+    const s = _e(e, i);
+    s < a && ([n, a] = [i, s]);
   }
-  return n !== void 0 && s <= Math.max(2, Math.floor(e.length / 3)) ? n : void 0;
+  return n !== void 0 && a <= Math.max(2, Math.floor(e.length / 3)) ? n : void 0;
 }
-const Fe = ["$state", "$item", "$index", "$bindState", "$bindItem", "$cond", "$computed", "$template"], Me = (e) => m(e) && Fe.some((o) => Object.hasOwn(e, o)), k = (e) => Me(e) || (Array.isArray(e) ? e.some(k) : m(e) && Object.values(e).some(k));
-function A(e) {
+const ze = ["$state", "$item", "$index", "$bindState", "$bindItem", "$cond", "$computed", "$template"], qe = (e) => m(e) && ze.some((o) => Object.hasOwn(e, o)), I = (e) => qe(e) || (Array.isArray(e) ? e.some(I) : m(e) && Object.values(e).some(I));
+function P(e) {
   const o = e.props?.shape;
   return m(o) ? o : void 0;
 }
-const C = (e) => e.safeParse(void 0).success;
-function We(e) {
+const R = (e) => e.safeParse(void 0).success;
+function Fe(e) {
   if (e.code === "invalid_value") return `Use one of: ${e.values.map((o) => JSON.stringify(o)).join(", ")}.`;
   if (e.code === "invalid_type") return `Expected ${e.expected}.`;
 }
 const v = (e, o) => `${e}: ${o.join(", ")}`;
-class Be {
+class Me {
   errors = [];
   warnings = [];
   error(o) {
@@ -711,23 +695,23 @@ class Be {
     this.warnings.push({ severity: "warning", ...o });
   }
 }
-function ft(e, o = {}) {
-  const n = o.catalog ?? O, s = n.data.components, i = new Be();
+function mt(e, o = {}) {
+  const n = o.catalog ?? A, a = n.data.components, i = new Me();
   if (!m(e))
-    return i.error({ code: "invalid_spec", path: "", message: "A spec must be a JSON object.", hint: 'Return {"root": "<key>", "elements": {...}, "state": {...}}.' }), L(i);
-  const a = m(e.elements) ? e.elements : void 0;
-  a || i.error({ code: "invalid_elements", path: "/elements", message: '"elements" must be an object keyed by element id.', hint: 'Use a flat map: {"elements": {"root": {"type": "AppRoot", "props": {}, "children": []}}}.' });
-  const r = Object.keys(a ?? {});
-  typeof e.root != "string" || e.root === "" ? i.error({ code: "missing_root", path: "/root", message: '"root" must name the top element.', hint: r.length ? v('Set "root" to one of', r) : 'Add "root" and the element it names.' }) : a && !Object.hasOwn(a, e.root) && i.error({ code: "root_not_found", path: "/root", message: `Root "${e.root}" is not in "elements".`, hint: v("Existing element keys", r) });
-  for (const [p, f] of Object.entries(a ?? {})) {
+    return i.error({ code: "invalid_spec", path: "", message: "A spec must be a JSON object.", hint: 'Return {"root": "<key>", "elements": {...}, "state": {...}}.' }), N(i);
+  const s = m(e.elements) ? e.elements : void 0;
+  s || i.error({ code: "invalid_elements", path: "/elements", message: '"elements" must be an object keyed by element id.', hint: 'Use a flat map: {"elements": {"root": {"type": "AppRoot", "props": {}, "children": []}}}.' });
+  const r = Object.keys(s ?? {});
+  typeof e.root != "string" || e.root === "" ? i.error({ code: "missing_root", path: "/root", message: '"root" must name the top element.', hint: r.length ? v('Set "root" to one of', r) : 'Add "root" and the element it names.' }) : s && !Object.hasOwn(s, e.root) && i.error({ code: "root_not_found", path: "/root", message: `Root "${e.root}" is not in "elements".`, hint: v("Existing element keys", r) });
+  for (const [p, f] of Object.entries(s ?? {})) {
     const w = (...g) => u("elements", p, ...g);
     if (!m(f)) {
       i.error({ code: "invalid_element", path: w(), elementKey: p, message: 'An element must be an object with "type", "props" and "children".' });
       continue;
     }
     const h = f.type;
-    if (typeof h != "string" || !Object.hasOwn(s, h)) {
-      const g = typeof h == "string" ? y(h, Object.keys(s)) : void 0;
+    if (typeof h != "string" || !Object.hasOwn(a, h)) {
+      const g = typeof h == "string" ? y(h, Object.keys(a)) : void 0;
       i.error({
         code: "unknown_component",
         path: w("type"),
@@ -737,11 +721,11 @@ function ft(e, o = {}) {
       });
       continue;
     }
-    He(i, p, h, s[h], f.props), Ge(i, p, h, s[h], f, a);
+    We(i, p, h, a[h], f.props), Be(i, p, h, a[h], f, s);
   }
-  const c = o.messages && T(o.messages), l = {
+  const c = o.messages && z(o.messages), l = {
     issues: i,
-    components: s,
+    components: a,
     actions: [
       ...(n.schema?.builtInActions ?? []).map((p) => p.name),
       ...Object.keys(n.data.actions ?? {}),
@@ -752,15 +736,15 @@ function ft(e, o = {}) {
     functions: o.functions || c ? [...o.functions ?? [], ...c ? ["t"] : []] : void 0,
     messageKeys: c
   };
-  return a && typeof e.root == "string" && Object.hasOwn(a, e.root) && Xe(l, e.root, a), L(i);
+  return s && typeof e.root == "string" && Object.hasOwn(s, e.root) && He(l, e.root, s), N(i);
 }
-function He(e, o, n, s, i) {
-  const a = (...l) => u("elements", o, "props", ...l);
+function We(e, o, n, a, i) {
+  const s = (...l) => u("elements", o, "props", ...l);
   if (!m(i)) {
-    e.error({ code: "invalid_props", path: a(), elementKey: o, message: '"props" must be an object.', hint: 'Use "props": {} when the component needs none.' });
+    e.error({ code: "invalid_props", path: s(), elementKey: o, message: '"props" must be an object.', hint: 'Use "props": {} when the component needs none.' });
     return;
   }
-  const r = A(s);
+  const r = P(a);
   if (!r) return;
   const c = Object.keys(r);
   for (const [l, p] of Object.entries(i)) {
@@ -769,41 +753,41 @@ function He(e, o, n, s, i) {
       const h = y(l, c);
       e.error({
         code: "unknown_prop",
-        path: a(l),
+        path: s(l),
         elementKey: o,
         message: `${n} has no prop "${l}".`,
         hint: h ? `Did you mean "${h}"? Run "syno-pkg-land-ui describe ${n}".` : v(`${n} props`, c)
       });
       continue;
     }
-    if (k(p)) continue;
+    if (I(p)) continue;
     const w = f.safeParse(p);
     if (!w.success)
       for (const h of w.error.issues)
         e.error({
           code: "invalid_prop",
-          path: a(l, ...h.path.map((g) => String(g))),
+          path: s(l, ...h.path.map((g) => String(g))),
           elementKey: o,
           message: `${n}.${l}: ${h.message}`,
-          hint: We(h)
+          hint: Fe(h)
         });
   }
   for (const l of c)
-    !Object.hasOwn(i, l) && !C(r[l]) && e.error({ code: "missing_prop", path: a(l), elementKey: o, message: `${n} requires prop "${l}".`, hint: `Run "syno-pkg-land-ui describe ${n}" for its type.` });
+    !Object.hasOwn(i, l) && !R(r[l]) && e.error({ code: "missing_prop", path: s(l), elementKey: o, message: `${n} requires prop "${l}".`, hint: `Run "syno-pkg-land-ui describe ${n}" for its type.` });
 }
-function E(e, o) {
+function q(e, o) {
   const n = [];
-  if (Array.isArray(o.children) && o.children.forEach((s, i) => {
-    typeof s == "string" && n.push({ child: s, path: u("elements", e, "children", i) });
+  if (Array.isArray(o.children) && o.children.forEach((a, i) => {
+    typeof a == "string" && n.push({ child: a, path: u("elements", e, "children", i) });
   }), m(o.slots))
-    for (const [s, i] of Object.entries(o.slots))
-      Array.isArray(i) && i.forEach((a, r) => {
-        typeof a == "string" && n.push({ child: a, path: u("elements", e, "slots", s, r) });
+    for (const [a, i] of Object.entries(o.slots))
+      Array.isArray(i) && i.forEach((s, r) => {
+        typeof s == "string" && n.push({ child: s, path: u("elements", e, "slots", a, r) });
       });
   return n;
 }
-function Ge(e, o, n, s, i, a) {
-  const r = s.slots ?? [], { children: c } = i;
+function Be(e, o, n, a, i, s) {
+  const r = a.slots ?? [], { children: c } = i;
   if (c !== void 0 && !(Array.isArray(c) && c.every((l) => typeof l == "string")) ? e.error({ code: "invalid_children", path: u("elements", o, "children"), elementKey: o, message: '"children" must be an array of element keys.' }) : c?.length && !r.includes("default") && e.error({
     code: "children_not_allowed",
     path: u("elements", o, "children"),
@@ -827,9 +811,9 @@ function Ge(e, o, n, s, i, a) {
             hint: f ? `Did you mean "${f}"?` : r.length ? v(`${n} slots`, r) : `${n} has no slots.`
           });
         }
-  for (const l of E(o, i))
-    if (!Object.hasOwn(a, l.child)) {
-      const p = y(l.child, Object.keys(a));
+  for (const l of q(o, i))
+    if (!Object.hasOwn(s, l.child)) {
+      const p = y(l.child, Object.keys(s));
       e.error({
         code: "missing_child",
         path: l.path,
@@ -839,87 +823,87 @@ function Ge(e, o, n, s, i, a) {
       });
     }
 }
-function Xe(e, o, n) {
-  const { issues: s } = e, i = /* @__PURE__ */ new Set(), a = (r, c, l, p) => {
+function He(e, o, n) {
+  const { issues: a } = e, i = /* @__PURE__ */ new Set(), s = (r, c, l, p) => {
     const f = n[r];
     if (!m(f)) return;
     i.add(r);
     const w = m(f.repeat);
-    et(e, r, f, p || w);
+    Qe(e, r, f, p || w);
     const h = f.type === "AppRoot";
-    h && l && s.error({ code: "nested_app_root", path: u("elements", r), elementKey: r, message: "AppRoot cannot be nested inside another AppRoot.", hint: "Use a single AppRoot at the top of the spec." });
-    for (const g of E(r, f))
+    h && l && a.error({ code: "nested_app_root", path: u("elements", r), elementKey: r, message: "AppRoot cannot be nested inside another AppRoot.", hint: "Use a single AppRoot at the top of the spec." });
+    for (const g of q(r, f))
       if (Object.hasOwn(n, g.child)) {
         if (c.includes(g.child)) {
-          s.error({ code: "cycle", path: g.path, elementKey: r, message: `"${g.child}" is its own ancestor.`, hint: "Element references must form a tree." });
+          a.error({ code: "cycle", path: g.path, elementKey: r, message: `"${g.child}" is its own ancestor.`, hint: "Element references must form a tree." });
           continue;
         }
-        a(g.child, [...c, g.child], l || h, p || w);
+        s(g.child, [...c, g.child], l || h, p || w);
       }
   };
-  a(o, [o], !1, !1);
+  s(o, [o], !1, !1);
   for (const r of Object.keys(n))
-    i.has(r) || s.warn({ code: "orphaned_element", path: u("elements", r), elementKey: r, message: `"${r}" is not reachable from the root.`, hint: "Reference it from a parent or delete it." });
+    i.has(r) || a.warn({ code: "orphaned_element", path: u("elements", r), elementKey: r, message: `"${r}" is not reachable from the root.`, hint: "Reference it from a parent or delete it." });
 }
-function Ye(e, o) {
+function Ge(e, o) {
   let n = e;
-  for (const s of o.split("/").slice(1)) {
-    const i = s.replaceAll("~1", "/").replaceAll("~0", "~");
+  for (const a of o.split("/").slice(1)) {
+    const i = a.replaceAll("~1", "/").replaceAll("~0", "~");
     if (Array.isArray(n) && /^\d+$/.test(i)) n = n[Number(i)];
     else if (m(n) && Object.hasOwn(n, i)) n = n[i];
     else return { found: !1 };
   }
   return { found: !0, value: n };
 }
-function S(e, o, n, s, { mustExist: i }) {
+function S(e, o, n, a, { mustExist: i }) {
   if (typeof n != "string" || !n.startsWith("/")) {
     e.issues.error({
       code: "invalid_state_path",
-      path: s,
+      path: a,
       elementKey: o,
       message: `State paths are JSON Pointers; got ${JSON.stringify(n)}.`,
       hint: typeof n == "string" ? `Use "/${n.replace(/^\.?\/?/, "").replaceAll(".", "/")}".` : 'Use a string such as "/settings/enabled".'
     });
     return;
   }
-  i && !Ye(e.state, n).found && e.issues.warn({
+  i && !Ge(e.state, n).found && e.issues.warn({
     code: "state_path_missing",
-    path: s,
+    path: a,
     elementKey: o,
     message: `State "${n}" has no initial value.`,
     hint: `Seed it in the spec's "state", or pass the host state with --state, so the first render has a value.`
   });
 }
-function j(e, o, n, s, i) {
+function $(e, o, n, a, i) {
   if (Array.isArray(n)) {
-    n.forEach((a, r) => j(e, o, a, s + u(r), i));
+    n.forEach((s, r) => $(e, o, s, a + u(r), i));
     return;
   }
   if (m(n)) {
-    for (const a of ["$state", "$bindState"])
-      Object.hasOwn(n, a) && S(e, o, n[a], s + u(a), { mustExist: !0 });
-    for (const a of ["$item", "$bindItem", "$index"])
-      Object.hasOwn(n, a) && !i && e.issues.error({
+    for (const s of ["$state", "$bindState"])
+      Object.hasOwn(n, s) && S(e, o, n[s], a + u(s), { mustExist: !0 });
+    for (const s of ["$item", "$bindItem", "$index"])
+      Object.hasOwn(n, s) && !i && e.issues.error({
         code: "item_outside_repeat",
-        path: s + u(a),
+        path: a + u(s),
         elementKey: o,
-        message: `${a} only works inside an element with "repeat" or its descendants.`,
+        message: `${s} only works inside an element with "repeat" or its descendants.`,
         hint: 'Add "repeat": {"statePath": "/list"} to an ancestor, or read the value with $state.'
       });
     if (typeof n.$template == "string")
-      for (const a of n.$template.matchAll(/\$\{([^}]*)\}/g))
-        S(e, o, a[1], s + u("$template"), { mustExist: !0 });
-    typeof n.$computed == "string" && Qe(e, o, n, s);
-    for (const [a, r] of Object.entries(n))
-      ["$state", "$bindState", "$item", "$bindItem", "$index", "$template"].includes(a) || j(e, o, r, s + u(a), i);
+      for (const s of n.$template.matchAll(/\$\{([^}]*)\}/g))
+        S(e, o, s[1], a + u("$template"), { mustExist: !0 });
+    typeof n.$computed == "string" && Xe(e, o, n, a);
+    for (const [s, r] of Object.entries(n))
+      ["$state", "$bindState", "$item", "$bindItem", "$index", "$template"].includes(s) || $(e, o, r, a + u(s), i);
   }
 }
-function Qe(e, o, n, s) {
+function Xe(e, o, n, a) {
   const i = n.$computed;
   if (!e.functions)
     e.issues.warn({
       code: "unverified_function",
-      path: s + u("$computed"),
+      path: a + u("$computed"),
       elementKey: o,
       message: `$computed "${i}" must be registered by the host.`,
       hint: `Pass the host function names with --functions ${i} to verify it.`
@@ -928,29 +912,29 @@ function Qe(e, o, n, s) {
     const r = y(i, e.functions);
     e.issues.error({
       code: "unknown_function",
-      path: s + u("$computed"),
+      path: a + u("$computed"),
       elementKey: o,
       message: `$computed "${i}" is not a host function.`,
       hint: `${r ? `Did you mean "${r}"? ` : ""}${v("Host functions", e.functions)}`
     });
   }
   if (i !== "t" || !e.messageKeys) return;
-  const a = m(n.args) ? n.args.key : void 0;
-  if (typeof a != "string" || !e.messageKeys.includes(a)) {
-    const r = typeof a == "string" ? y(a, e.messageKeys) : void 0;
+  const s = m(n.args) ? n.args.key : void 0;
+  if (typeof s != "string" || !e.messageKeys.includes(s)) {
+    const r = typeof s == "string" ? y(s, e.messageKeys) : void 0;
     e.issues.error({
       code: "missing_i18n_key",
-      path: s + u("args", "key"),
+      path: a + u("args", "key"),
       elementKey: o,
-      message: `Message key ${JSON.stringify(a)} is not in the message catalog.`,
+      message: `Message key ${JSON.stringify(s)} is not in the message catalog.`,
       hint: r ? `Did you mean "${r}"? Otherwise add the key to every locale.` : "Add the key to every locale, or use an existing key."
     });
   }
 }
-const Ze = ["statePath", "clearStatePath"];
-function et(e, o, n, s) {
+const Ye = ["statePath", "clearStatePath"];
+function Qe(e, o, n, a) {
   const i = (...c) => u("elements", o, ...c);
-  if (j(e, o, n.props, i("props"), s), e.messageKeys && m(n.props))
+  if ($(e, o, n.props, i("props"), a), e.messageKeys && m(n.props))
     for (const c of Ve) {
       const l = n.props[c];
       typeof l == "string" && l.trim() && e.issues.warn({
@@ -961,8 +945,8 @@ function et(e, o, n, s) {
         hint: 'Use {"$computed": "t", "args": {"key": "<message key>"}}.'
       });
     }
-  n.visible !== void 0 && j(e, o, n.visible, i("visible"), s), m(n.repeat) && S(e, o, n.repeat.statePath, i("repeat", "statePath"), { mustExist: !0 });
-  const a = typeof n.type == "string" ? n.type : "", r = e.components[a]?.events ?? [];
+  n.visible !== void 0 && $(e, o, n.visible, i("visible"), a), m(n.repeat) && S(e, o, n.repeat.statePath, i("repeat", "statePath"), { mustExist: !0 });
+  const s = typeof n.type == "string" ? n.type : "", r = e.components[s]?.events ?? [];
   if (m(n.on))
     for (const [c, l] of Object.entries(n.on)) {
       if (!r.includes(c)) {
@@ -971,19 +955,19 @@ function et(e, o, n, s) {
           code: "unknown_event",
           path: i("on", c),
           elementKey: o,
-          message: `${a} does not emit "${c}".`,
-          hint: p ? `Did you mean "${p}"?` : r.length ? v(`${a} events`, r) : `${a} emits no events.`
+          message: `${s} does not emit "${c}".`,
+          hint: p ? `Did you mean "${p}"?` : r.length ? v(`${s} events`, r) : `${s} emits no events.`
         });
       }
-      K(e, o, l, i("on", c), s);
+      U(e, o, l, i("on", c), a);
     }
   if (m(n.watch))
     for (const [c, l] of Object.entries(n.watch))
-      S(e, o, c, i("watch", c), { mustExist: !1 }), K(e, o, l, i("watch", c), s);
+      S(e, o, c, i("watch", c), { mustExist: !1 }), U(e, o, l, i("watch", c), a);
 }
-function K(e, o, n, s, i) {
+function U(e, o, n, a, i) {
   (Array.isArray(n) ? n : [n]).forEach((r, c) => {
-    const l = Array.isArray(n) ? s + u(c) : s;
+    const l = Array.isArray(n) ? a + u(c) : a;
     if (!m(r) || typeof r.action != "string") {
       e.issues.error({ code: "invalid_action_binding", path: l, elementKey: o, message: 'An action binding is {"action": "<name>", "params": {...}}.' });
       return;
@@ -999,21 +983,21 @@ function K(e, o, n, s, i) {
       });
     }
     if (m(r.params)) {
-      for (const p of Ze)
+      for (const p of Ye)
         Object.hasOwn(r.params, p) && S(e, o, r.params[p], l + u("params", p), { mustExist: !1 });
-      j(e, o, r.params, l + u("params"), i);
+      $(e, o, r.params, l + u("params"), i);
     }
   });
 }
-function L(e) {
+function N(e) {
   return { valid: e.errors.length === 0, errors: e.errors, warnings: e.warnings };
 }
-const $ = q;
-function tt(e) {
+const x = V;
+function Ze(e) {
   const o = t.toJSONSchema(e);
   return delete o.$schema, o;
 }
-function ot(e) {
+function et(e) {
   if (Array.isArray(e.enum)) return e.enum[0];
   switch (e.type) {
     case "string":
@@ -1029,23 +1013,23 @@ function ot(e) {
       return {};
   }
 }
-function gt() {
-  return Object.entries($).map(([e, o]) => ({
+function ht() {
+  return Object.entries(x).map(([e, o]) => ({
     name: e,
     description: o.description,
-    required: Object.entries(A(o) ?? {}).filter(([, n]) => !C(n)).map(([n]) => n),
+    required: Object.entries(P(o) ?? {}).filter(([, n]) => !R(n)).map(([n]) => n),
     slots: o.slots ?? [],
     events: o.events ?? []
   }));
 }
-function bt(e) {
-  return y(e, Object.keys($));
+function ft(e) {
+  return y(e, Object.keys(x));
 }
-function yt(e) {
-  if (!Object.hasOwn($, e)) return;
-  const o = $[e], n = Object.fromEntries(Object.entries(A(o) ?? {}).map(([s, i]) => [
-    s,
-    { required: !C(i), schema: tt(i) }
+function gt(e) {
+  if (!Object.hasOwn(x, e)) return;
+  const o = x[e], n = Object.fromEntries(Object.entries(P(o) ?? {}).map(([a, i]) => [
+    a,
+    { required: !R(i), schema: Ze(i) }
   ]));
   return {
     name: e,
@@ -1055,16 +1039,16 @@ function yt(e) {
     events: o.events ?? [],
     example: {
       type: e,
-      props: Object.fromEntries(Object.entries(n).filter(([, s]) => s.required).map(([s, { schema: i }]) => [s, ot(i)])),
+      props: Object.fromEntries(Object.entries(n).filter(([, a]) => a.required).map(([a, { schema: i }]) => [a, et(i)])),
       children: []
     }
   };
 }
-const x = { type: "string", pattern: "^/" }, nt = {
+const O = { type: "string", pattern: "^/" }, tt = {
   description: "A json-render expression resolved at render time.",
   anyOf: [
-    { type: "object", required: ["$state"], properties: { $state: x } },
-    { type: "object", required: ["$bindState"], properties: { $bindState: x } },
+    { type: "object", required: ["$state"], properties: { $state: O } },
+    { type: "object", required: ["$bindState"], properties: { $bindState: O } },
     { type: "object", required: ["$item"], properties: { $item: { type: "string" } } },
     { type: "object", required: ["$bindItem"], properties: { $bindItem: { type: "string" } } },
     { type: "object", required: ["$index"], properties: { $index: { const: !0 } } },
@@ -1072,7 +1056,7 @@ const x = { type: "string", pattern: "^/" }, nt = {
     { type: "object", required: ["$computed"], properties: { $computed: { type: "string" }, args: { type: "object" } } },
     { type: "object", required: ["$cond", "$then", "$else"], properties: { $cond: {}, $then: {}, $else: {} } }
   ]
-}, it = {
+}, ot = {
   type: "object",
   required: ["action"],
   properties: {
@@ -1084,35 +1068,35 @@ const x = { type: "string", pattern: "^/" }, nt = {
     preventDefault: { type: "boolean" }
   },
   additionalProperties: !1
-}, U = { anyOf: [{ $ref: "#/$defs/actionBinding" }, { type: "array", items: { $ref: "#/$defs/actionBinding" } }] }, D = { type: "array", items: { type: "string" } };
-function st(e, o, n) {
-  const s = (r) => Array.isArray(r) ? r.map(s) : !r || typeof r != "object" ? r : Object.fromEntries(Object.entries(r).map(([c, l]) => [
+}, T = { anyOf: [{ $ref: "#/$defs/actionBinding" }, { type: "array", items: { $ref: "#/$defs/actionBinding" } }] }, E = { type: "array", items: { type: "string" } };
+function nt(e, o, n) {
+  const a = (r) => Array.isArray(r) ? r.map(a) : !r || typeof r != "object" ? r : Object.fromEntries(Object.entries(r).map(([c, l]) => [
     c,
-    c === "$ref" && typeof l == "string" ? l.replace("#/$defs/", `#/$defs/${o}`) : s(l)
-  ])), { $defs: i, ...a } = e;
-  delete a.$schema;
-  for (const [r, c] of Object.entries(i ?? {})) n[o + r] = s(c);
-  return s(a);
+    c === "$ref" && typeof l == "string" ? l.replace("#/$defs/", `#/$defs/${o}`) : a(l)
+  ])), { $defs: i, ...s } = e;
+  delete s.$schema;
+  for (const [r, c] of Object.entries(i ?? {})) n[o + r] = a(c);
+  return a(s);
 }
-function at(e, o, n) {
-  const s = A(o), i = o.slots ?? [];
-  let a = { type: "object" };
-  if (s) {
-    const r = st(t.toJSONSchema(t.object(s)), `${e}__`, n), c = r.properties;
-    a = {
+function it(e, o, n) {
+  const a = P(o), i = o.slots ?? [];
+  let s = { type: "object" };
+  if (a) {
+    const r = nt(t.toJSONSchema(t.object(a)), `${e}__`, n), c = r.properties;
+    s = {
       ...r,
       properties: Object.fromEntries(Object.entries(c).map(([l, p]) => [
         l,
         { anyOf: [p, { $ref: "#/$defs/expression" }] }
       ]))
-    }, r.required?.length || delete a.required;
+    }, r.required?.length || delete s.required;
   }
   return {
     if: { properties: { type: { const: e } } },
     then: {
       ...o.description ? { description: o.description } : {},
       properties: {
-        props: a,
+        props: s,
         ...i.includes("default") ? {} : { children: { maxItems: 0 } },
         slots: { propertyNames: { enum: i.filter((r) => r !== "default") } },
         on: { propertyNames: { enum: o.events ?? [] } }
@@ -1120,23 +1104,23 @@ function at(e, o, n) {
     }
   };
 }
-function wt(e = O) {
-  const o = e.data.components, n = { expression: nt, actionBinding: it }, s = Object.entries(o).map(([i, a]) => at(i, a, n));
+function bt(e = A) {
+  const o = e.data.components, n = { expression: tt, actionBinding: ot }, a = Object.entries(o).map(([i, s]) => it(i, s, n));
   return n.element = {
     type: "object",
     required: ["type", "props"],
     properties: {
       type: { enum: Object.keys(o) },
       props: { type: "object" },
-      children: D,
-      slots: { type: "object", additionalProperties: D },
+      children: E,
+      slots: { type: "object", additionalProperties: E },
       visible: {},
-      on: { type: "object", additionalProperties: U },
-      watch: { type: "object", propertyNames: x, additionalProperties: U },
-      repeat: { type: "object", required: ["statePath"], properties: { statePath: x, key: { type: "string" } }, additionalProperties: !1 }
+      on: { type: "object", additionalProperties: T },
+      watch: { type: "object", propertyNames: O, additionalProperties: T },
+      repeat: { type: "object", required: ["statePath"], properties: { statePath: O, key: { type: "string" } }, additionalProperties: !1 }
     },
     additionalProperties: !1,
-    allOf: s
+    allOf: a
   }, {
     $schema: "https://json-schema.org/draft/2020-12/schema",
     title: "Synology Package Land JSON UI spec",
@@ -1152,30 +1136,30 @@ function wt(e = O) {
   };
 }
 export {
-  Pt as ActionProvider,
-  _t as JSONUIProvider,
-  kt as Renderer,
-  Ct as StateProvider,
-  ht as SynoJsonRenderer,
-  Rt as ValidationProvider,
+  Ot as ActionProvider,
+  At as JSONUIProvider,
+  Pt as Renderer,
+  kt as StateProvider,
+  ut as SynoJsonRenderer,
+  Ct as ValidationProvider,
   It as VisibilityProvider,
-  bt as closestSynoJsonComponent,
-  xt as createStateStore,
-  Ot as defineCatalog,
-  Kt as defineRegistry,
-  yt as describeSynoJsonComponent,
-  qt as jsonRenderVueSchema,
-  gt as listSynoJsonComponents,
-  mt as synoJsonAiPrompt,
-  Ce as synoJsonAiRules,
-  O as synoJsonCatalog,
-  q as synoJsonComponentDefinitions,
-  qe as synoJsonRegistry,
+  ft as closestSynoJsonComponent,
+  $t as createStateStore,
+  jt as defineCatalog,
+  Rt as defineRegistry,
+  gt as describeSynoJsonComponent,
+  Nt as jsonRenderVueSchema,
+  ht as listSynoJsonComponents,
+  pt as synoJsonAiPrompt,
+  Ke as synoJsonAiRules,
+  A as synoJsonCatalog,
+  V as synoJsonComponentDefinitions,
+  D as synoJsonRegistry,
   Je as synoJsonRenderers,
-  wt as synoJsonSchema,
-  Lt as useActions,
-  Ut as useBoundProp,
+  bt as synoJsonSchema,
+  Kt as useActions,
+  Lt as useBoundProp,
   Dt as useStateStore,
-  ft as validateSynoJsonSpec,
-  jt as z
+  mt as validateSynoJsonSpec,
+  vt as z
 };