@glasshome/widget-sdk 0.2.5 → 0.3.3

package/dist/index.js

@@ -1,18 +1,34 @@
-import { createSignal as j, createContext as wt, useContext as ht, createEffect as F, untrack as ut, createMemo as z, splitProps as $t, Show as K } from "solid-js";
-import { GridSizeSchema as tr, PublishBodySchema as er, PublishConfirmSchema as nr, PublishRequestSchema as rr, WidgetManifestSchema as ir, formatSchemaError as ar, parseGridSize as or, serializeGridSize as sr } from "./schemas.js";
-import { memo as D, effect as C, setStyleProperty as p, className as w, template as x, insert as f, style as tt, createComponent as W, use as kt, delegateEvents as pt } from "solid-js/web";
-import { clsx as St } from "clsx";
-import { twMerge as Ct } from "tailwind-merge";
-import { createElementSize as Mt } from "@solid-primitives/resize-observer";
-import { createForm as zt, zodForm as Dt, reset as _t, setValue as At, getValue as Nt } from "@modular-forms/solid";
-function xn(t) {
-  const [e] = j(t);
+import { createSignal as L, createContext as pt, useContext as vt, createEffect as Y, untrack as dt, createMemo as A, splitProps as St, on as gt, Show as J } from "solid-js";
+import { z as X } from "zod";
+import { GridSizeSchema as lr, PublishBodySchema as cr, PublishConfirmSchema as ur, PublishRequestSchema as dr, WidgetManifestSchema as gr, formatSchemaError as mr, parseGridSize as fr, serializeGridSize as hr } from "./schemas.js";
+import { memo as _, effect as M, setStyleProperty as C, className as k, template as v, insert as h, style as et, createComponent as V, use as Ct, delegateEvents as Mt } from "solid-js/web";
+import { clsx as zt } from "clsx";
+import { twMerge as Dt } from "tailwind-merge";
+import { createElementSize as _t } from "@solid-primitives/resize-observer";
+import { createForm as At, zodForm as Nt, reset as Tt, setValue as Ot, getValue as Et } from "@modular-forms/solid";
+function pn(t) {
+  const [e] = L(t);
   return e;
 }
-function vn(t) {
-  return t;
+function bt(t) {
+  return X.toJSONSchema(t, {
+    override: (e) => {
+      const n = X.globalRegistry.get(e.zodSchema);
+      return n && typeof n == "object" && Object.keys(n).length > 0 ? { ...e.jsonSchema, ...n } : e.jsonSchema;
+    }
+  });
+}
+function Vt(t) {
+  try {
+    return t.parse({});
+  } catch {
+    return {};
+  }
+}
+function Sn(t) {
+  return t.configSchema && (t.manifest.schema || (t.manifest.schema = bt(t.configSchema)), t.manifest.defaultConfig || (t.manifest.defaultConfig = Vt(t.configSchema))), t;
 }
-const L = {
+const F = {
   /** Background layer (gradients, images, glows) */
   BACKGROUND: 0,
   /** Main content layer (icon, title, text) */
@@ -22,19 +38,19 @@ const L = {
   /** Action layer (buttons, edit controls) */
   ACTIONS: 30
 };
-function bn(t) {
+function Cn(t) {
 }
-const ot = wt();
+const st = pt();
 function G() {
-  const t = ht(ot);
+  const t = vt(st);
   if (!t)
     throw new Error("useWidgetContext must be used within a Widget component");
   return t;
 }
-function y(...t) {
-  return Ct(St(t));
+function $(...t) {
+  return Dt(zt(t));
 }
-const Tt = {
+const Wt = {
   id: "classic-glass",
   name: "Classic Glass",
   description: "Default glassmorphism design with blur background and gradient",
@@ -62,7 +78,7 @@ const Tt = {
     hoverScale: 1.02,
     activeScale: 0.98
   }
-}, Et = {
+}, It = {
   id: "minimal",
   name: "Minimal",
   description: "Clean, minimal design with no background effects",
@@ -91,7 +107,7 @@ const Tt = {
     active: !1,
     focus: !0
   }
-}, Ot = {
+}, Rt = {
   id: "compact-horizontal",
   name: "Compact Horizontal",
   description: "Horizontal layout for compact widgets",
@@ -119,21 +135,21 @@ const Tt = {
     hoverScale: 1.02,
     activeScale: 0.98
   }
-}, st = {
-  "classic-glass": Tt,
-  minimal: Et,
-  "compact-horizontal": Ot
+}, lt = {
+  "classic-glass": Wt,
+  minimal: It,
+  "compact-horizontal": Rt
 };
-function Vt(t) {
-  return st[t];
+function Gt(t) {
+  return lt[t];
 }
-function yn(t) {
-  return t in st;
+function Mn(t) {
+  return t in lt;
 }
-function wn() {
-  return Object.keys(st);
+function zn() {
+  return Object.keys(lt);
 }
-function xt(t, e) {
+function yt(t, e) {
   if (typeof t != "object" || t === null)
     return e;
   const n = { ...t };
@@ -145,7 +161,7 @@ function xt(t, e) {
         continue;
       }
       if (typeof r == "object" && r !== null && !Array.isArray(r)) {
-        typeof a == "object" && a !== null ? n[i] = xt(a, r) : n[i] = r;
+        typeof a == "object" && a !== null ? n[i] = yt(a, r) : n[i] = r;
         continue;
       }
       n[i] = r;
@@ -153,7 +169,7 @@ function xt(t, e) {
   }
   return n;
 }
-function Wt(t, e) {
+function Ht(t, e) {
   if (!(!t && !e))
     return t ? e ? {
       container: { ...t.container, ...e.container },
@@ -161,18 +177,18 @@ function Wt(t, e) {
       cssVars: { ...t.cssVars, ...e.cssVars }
     } : t : e;
 }
-function It(t, e) {
+function Bt(t, e) {
   return e ?? t;
 }
-function Rt(t, e) {
+function Lt(t, e) {
   if (!(!t && !e))
     return t ? e ? {
       visible: { ...t.visible, ...e.visible },
-      styles: xt(t.styles ?? {}, e.styles ?? {}),
+      styles: yt(t.styles ?? {}, e.styles ?? {}),
       classNames: { ...t.classNames, ...e.classNames }
     } : t : e;
 }
-function Gt(t, e) {
+function jt(t, e) {
   if (!(!t && !e))
     return t ? e ? {
       background: e.background ?? t.background,
@@ -180,7 +196,7 @@ function Gt(t, e) {
       decorations: e.decorations ?? t.decorations
     } : t : e;
 }
-function Bt(t, e) {
+function Pt(t, e) {
   if (!(!t && !e))
     return t ? e ? {
       hover: e.hover ?? t.hover,
@@ -190,39 +206,39 @@ function Bt(t, e) {
       activeScale: e.activeScale ?? t.activeScale
     } : t : e;
 }
-function lt(t, e) {
+function ct(t, e) {
   return {
     id: e.id ?? t.id,
     name: e.name ?? t.name,
     description: e.description ?? t.description,
-    styles: Wt(t.styles, e.styles),
-    layout: It(t.layout, e.layout),
-    elements: Rt(t.elements, e.elements),
-    plugins: Gt(t.plugins, e.plugins),
-    interactions: Bt(t.interactions, e.interactions),
+    styles: Ht(t.styles, e.styles),
+    layout: Bt(t.layout, e.layout),
+    elements: Lt(t.elements, e.elements),
+    plugins: jt(t.plugins, e.plugins),
+    interactions: Pt(t.interactions, e.interactions),
     extends: e.extends ?? t.extends
   };
 }
-function $n(t, e) {
+function Dn(t, e) {
   return {
     ...e,
     extends: t
   };
 }
-function kn(...t) {
+function _n(...t) {
   if (t.length === 0)
     throw new Error("composeVariants requires at least one variant");
-  return t.length === 1 ? t[0] : t.reduce((e, n) => lt(e, n));
+  return t.length === 1 ? t[0] : t.reduce((e, n) => ct(e, n));
 }
-function pn(t, e) {
-  return lt(t, { layout: e });
+function An(t, e) {
+  return ct(t, { layout: e });
 }
-function Sn(t, e) {
-  return lt(t, {
+function Nn(t, e) {
+  return ct(t, {
     styles: { cssVars: e }
   });
 }
-function Cn(t = "column", e = "start", n = "start", i) {
+function Tn(t = "column", e = "start", n = "start", i) {
   return {
     type: "flex",
     direction: t,
@@ -231,23 +247,23 @@ function Cn(t = "column", e = "start", n = "start", i) {
     ...i
   };
 }
-var Ht = /* @__PURE__ */ x("<div>"), Lt = /* @__PURE__ */ x('<div class="pointer-events-none absolute inset-0 opacity-40 blur-2xl">');
-function Pt(t) {
+var Ft = /* @__PURE__ */ v("<div>"), Ut = /* @__PURE__ */ v('<div class="pointer-events-none absolute inset-0 opacity-40 blur-2xl">');
+function Yt(t) {
   const e = G(), n = () => e.orientation() === "vertical" ? `inset(${100 - t.value}% 0 0 0)` : `inset(0 ${100 - t.value}% 0 0)`, i = () => t.color ?? "rgb(59, 130, 246)";
-  return [D(() => D(() => !!((t.glow ?? !1) && t.value > 0))() && (() => {
-    var r = Lt();
-    return C((a) => {
-      var o = i(), l = L.BACKGROUND;
-      return o !== a.e && p(r, "background", a.e = o), l !== a.t && p(r, "z-index", a.t = l), a;
+  return [_(() => _(() => !!((t.glow ?? !1) && t.value > 0))() && (() => {
+    var r = Ut();
+    return M((a) => {
+      var o = i(), s = F.BACKGROUND;
+      return o !== a.e && C(r, "background", a.e = o), s !== a.t && C(r, "z-index", a.t = s), a;
     }, {
       e: void 0,
       t: void 0
     }), r;
   })()), (() => {
-    var r = Ht();
-    return C((a) => {
-      var o = y("pointer-events-none absolute inset-0", t.isDragging ? "duration-0" : "transition-all duration-300 ease-out", t.class), l = i(), c = n(), g = t.opacity ?? 0.3, d = L.BACKGROUND;
-      return o !== a.e && w(r, a.e = o), l !== a.t && p(r, "background", a.t = l), c !== a.a && p(r, "clip-path", a.a = c), g !== a.o && p(r, "opacity", a.o = g), d !== a.i && p(r, "z-index", a.i = d), a;
+    var r = Ft();
+    return M((a) => {
+      var o = $("pointer-events-none absolute inset-0", t.isDragging ? "duration-0" : "transition-all duration-300 ease-out", t.class), s = i(), l = n(), m = t.opacity ?? 0.3, d = F.BACKGROUND;
+      return o !== a.e && k(r, a.e = o), s !== a.t && C(r, "background", a.t = s), l !== a.a && C(r, "clip-path", a.a = l), m !== a.o && C(r, "opacity", a.o = m), d !== a.i && C(r, "z-index", a.i = d), a;
     }, {
       e: void 0,
       t: void 0,
@@ -257,20 +273,20 @@ function Pt(t) {
     }), r;
   })()];
 }
-const q = {
+const Z = {
   S1: { xs: 4, sm: 4, md: 6, lg: 6, xl: 8 },
   S2: { xs: 6, sm: 8, md: 10, lg: 12, xl: 14 },
   S3: { xs: 8, sm: 10, md: 12, lg: 14, xl: 16 },
   S4: { xs: 12, sm: 14, md: 16, lg: 18, xl: 20 }
-}, N = {
+}, W = {
   /** Extra small spacing (4-8px) */
-  S1: (t) => `${q.S1[t]}px`,
+  S1: (t) => `${Z.S1[t]}px`,
   /** Small spacing (6-14px) - default for most layouts */
-  S2: (t) => `${q.S2[t]}px`,
+  S2: (t) => `${Z.S2[t]}px`,
   /** Medium spacing (8-16px) */
-  S3: (t) => `${q.S3[t]}px`,
+  S3: (t) => `${Z.S3[t]}px`,
   /** Large spacing (12-20px) */
-  S4: (t) => `${q.S4[t]}px`,
+  S4: (t) => `${Z.S4[t]}px`,
   /** Icon container size in pixels */
   icon: (t) => ({
     xs: 32,
@@ -321,7 +337,7 @@ const q = {
     // More padding for larger widgets
     xl: "20px"
   })[t]
-}, jt = {
+}, Xt = {
   4: "gap-1",
   6: "gap-1.5",
   8: "gap-2",
@@ -332,25 +348,25 @@ const q = {
   18: "gap-[18px]",
   20: "gap-5"
 };
-function Ut(t, e) {
-  const n = q[t][e];
-  return jt[n] || `gap-[${n}px]`;
+function Kt(t, e) {
+  const n = Z[t][e];
+  return Xt[n] || `gap-[${n}px]`;
 }
-var Ft = /* @__PURE__ */ x("<div>");
-function Yt(t) {
+var qt = /* @__PURE__ */ v("<div>");
+function Jt(t) {
   const e = G();
   return (() => {
-    var n = Ft();
-    return f(n, () => t.children), C((i) => {
-      var r = y(
+    var n = qt();
+    return h(n, () => t.children), M((i) => {
+      var r = $(
         "relative flex h-full w-full overflow-hidden",
         // Ensure controls (ml-auto divs) are above other content
         "[&_div.ml-auto]:relative [&_div.ml-auto]:z-30",
         e.contentLayout() === "horizontal" ? "flex-row items-center" : "flex-col justify-between",
-        Ut("S3", e.size()),
+        Kt("S3", e.size()),
         t.class
-      ), a = N.container(e.size()), o = L.CONTENT;
-      return r !== i.e && w(n, i.e = r), a !== i.t && p(n, "padding", i.t = a), o !== i.a && p(n, "z-index", i.a = o), i;
+      ), a = W.container(e.size()), o = F.CONTENT;
+      return r !== i.e && k(n, i.e = r), a !== i.t && C(n, "padding", i.t = a), o !== i.a && C(n, "z-index", i.a = o), i;
     }, {
       e: void 0,
       t: void 0,
@@ -358,7 +374,7 @@ function Yt(t) {
     }), n;
   })();
 }
-const H = {
+const j = {
   /** Container base text sizing */
   container: (t) => ({
     xs: "text-xs",
@@ -472,57 +488,57 @@ const H = {
     // 16px
   })[t]
 };
-var Xt = /* @__PURE__ */ x("<div><div>"), Kt = /* @__PURE__ */ x("<div>"), qt = /* @__PURE__ */ x("<h3>"), Zt = /* @__PURE__ */ x("<p>"), Qt = /* @__PURE__ */ x("<div class=mt-2>");
-function Jt(t) {
+var Zt = /* @__PURE__ */ v("<div><div>"), Qt = /* @__PURE__ */ v("<div>"), te = /* @__PURE__ */ v("<h3>"), ee = /* @__PURE__ */ v("<p>"), ne = /* @__PURE__ */ v("<div class=mt-2>");
+function re(t) {
   const e = G(), n = () => e.contentLayout() === "horizontal";
   return (() => {
-    var i = Xt(), r = i.firstChild;
-    return f(i, (() => {
-      var a = D(() => !!t.icon);
+    var i = Zt(), r = i.firstChild;
+    return h(i, (() => {
+      var a = _(() => !!t.icon);
       return () => a() && (() => {
-        var o = Kt();
-        return f(o, () => t.icon), C((l) => {
-          var c = y("flex items-center justify-center text-foreground/30", n() ? "shrink-0" : ""), g = `${N.icon(e.size())}px`, d = `${N.icon(e.size())}px`;
-          return c !== l.e && w(o, l.e = c), g !== l.t && p(o, "width", l.t = g), d !== l.a && p(o, "height", l.a = d), l;
+        var o = Qt();
+        return h(o, () => t.icon), M((s) => {
+          var l = $("flex items-center justify-center text-foreground/30", n() ? "shrink-0" : ""), m = `${W.icon(e.size())}px`, d = `${W.icon(e.size())}px`;
+          return l !== s.e && k(o, s.e = l), m !== s.t && C(o, "width", s.t = m), d !== s.a && C(o, "height", s.a = d), s;
         }, {
           e: void 0,
           t: void 0,
           a: void 0
         }), o;
       })();
-    })(), r), f(r, (() => {
-      var a = D(() => !!(t.title ?? "No data"));
+    })(), r), h(r, (() => {
+      var a = _(() => !!(t.title ?? "No data"));
       return () => a() && (() => {
-        var o = qt();
-        return f(o, () => t.title ?? "No data"), C((l) => {
-          var c = y("font-semibold text-foreground/60", H.subtitle(e.size())), g = n() ? "100%" : "80%";
-          return c !== l.e && w(o, l.e = c), g !== l.t && p(o, "max-width", l.t = g), l;
+        var o = te();
+        return h(o, () => t.title ?? "No data"), M((s) => {
+          var l = $("font-semibold text-foreground/60", j.subtitle(e.size())), m = n() ? "100%" : "80%";
+          return l !== s.e && k(o, s.e = l), m !== s.t && C(o, "max-width", s.t = m), s;
         }, {
           e: void 0,
           t: void 0
         }), o;
       })();
-    })(), null), f(r, (() => {
-      var a = D(() => !!t.message);
+    })(), null), h(r, (() => {
+      var a = _(() => !!t.message);
       return () => a() && (() => {
-        var o = Zt();
-        return f(o, () => t.message), C((l) => {
-          var c = y("text-foreground/50", H.emptyState(e.size())), g = n() ? "100%" : "85%";
-          return c !== l.e && w(o, l.e = c), g !== l.t && p(o, "max-width", l.t = g), l;
+        var o = ee();
+        return h(o, () => t.message), M((s) => {
+          var l = $("text-foreground/50", j.emptyState(e.size())), m = n() ? "100%" : "85%";
+          return l !== s.e && k(o, s.e = l), m !== s.t && C(o, "max-width", s.t = m), s;
         }, {
           e: void 0,
           t: void 0
         }), o;
       })();
-    })(), null), f(r, (() => {
-      var a = D(() => !!t.action);
+    })(), null), h(r, (() => {
+      var a = _(() => !!t.action);
       return () => a() && (() => {
-        var o = Qt();
-        return f(o, () => t.action), o;
+        var o = ne();
+        return h(o, () => t.action), o;
       })();
-    })(), null), C((a) => {
-      var o = y("flex h-full w-full", n() ? "flex-row items-center justify-start" : "flex-col items-center justify-center text-center", t.class), l = N.S2(e.size()), c = N.container(e.size()), g = y("flex flex-col", n() ? "items-start text-left" : "items-center text-center"), d = N.S1(e.size());
-      return o !== a.e && w(i, a.e = o), l !== a.t && p(i, "gap", a.t = l), c !== a.a && p(i, "padding", a.a = c), g !== a.o && w(r, a.o = g), d !== a.i && p(r, "gap", a.i = d), a;
+    })(), null), M((a) => {
+      var o = $("flex h-full w-full", n() ? "flex-row items-center justify-start" : "flex-col items-center justify-center text-center", t.class), s = W.S2(e.size()), l = W.container(e.size()), m = $("flex flex-col", n() ? "items-start text-left" : "items-center text-center"), d = W.S1(e.size());
+      return o !== a.e && k(i, a.e = o), s !== a.t && C(i, "gap", a.t = s), l !== a.a && C(i, "padding", a.a = l), m !== a.o && k(r, a.o = m), d !== a.i && C(r, "gap", a.i = d), a;
     }, {
       e: void 0,
       t: void 0,
@@ -532,107 +548,107 @@ function Jt(t) {
     }), i;
   })();
 }
-function te(t) {
+function ie(t) {
   const e = t.match(/hsl\(\s*([\d.]+)\s*,\s*([\d.]+)%?\s*,\s*([\d.]+)%?\s*\)/);
   return e ? { h: Number(e[1]), s: Number(e[2]), l: Number(e[3]) } : null;
 }
-function ee(t) {
+function ae(t) {
   const e = t.match(/rgb\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*\)/);
-  return e ? vt(Number(e[1]), Number(e[2]), Number(e[3])) : null;
+  return e ? wt(Number(e[1]), Number(e[2]), Number(e[3])) : null;
 }
-function ne(t) {
+function oe(t) {
   const e = t.match(/^#([0-9a-f]{3,8})$/i);
   if (!e) return null;
   let n = e[1];
   n.length === 3 && (n = n[0] + n[0] + n[1] + n[1] + n[2] + n[2]);
   const i = Number.parseInt(n.slice(0, 2), 16), r = Number.parseInt(n.slice(2, 4), 16), a = Number.parseInt(n.slice(4, 6), 16);
-  return vt(i, r, a);
+  return wt(i, r, a);
 }
-function vt(t, e, n) {
+function wt(t, e, n) {
   t /= 255, e /= 255, n /= 255;
   const i = Math.max(t, e, n), r = Math.min(t, e, n), a = (i + r) / 2;
   if (i === r) return { h: 0, s: 0, l: a * 100 };
-  const o = i - r, l = a > 0.5 ? o / (2 - i - r) : o / (i + r);
-  let c = 0;
-  return i === t ? c = ((e - n) / o + (e < n ? 6 : 0)) / 6 : i === e ? c = ((n - t) / o + 2) / 6 : c = ((t - e) / o + 4) / 6, { h: c * 360, s: l * 100, l: a * 100 };
+  const o = i - r, s = a > 0.5 ? o / (2 - i - r) : o / (i + r);
+  let l = 0;
+  return i === t ? l = ((e - n) / o + (e < n ? 6 : 0)) / 6 : i === e ? l = ((n - t) / o + 2) / 6 : l = ((t - e) / o + 4) / 6, { h: l * 360, s: s * 100, l: a * 100 };
 }
-function re(t) {
-  return te(t) ?? ee(t) ?? ne(t);
+function se(t) {
+  return ie(t) ?? ae(t) ?? oe(t);
 }
-function dt(t, e, n, i) {
+function mt(t, e, n, i) {
   const r = Math.round(t), a = Math.round(Math.min(100, Math.max(0, e))), o = Math.round(Math.min(100, Math.max(0, n)));
   return i !== void 0 && i < 1 ? `hsla(${r}, ${a}%, ${o}%, ${i})` : `hsl(${r}, ${a}%, ${o}%)`;
 }
-function ie(t) {
-  const e = re(t);
+function le(t) {
+  const e = se(t);
   if (!e) return null;
   const { h: n, s: i, l: r } = e;
   let a, o = Math.min(i + 10, 100);
   r < 25 ? (a = r + 12, o = Math.min(i + 15, 100)) : r < 40 ? a = Math.max(r - 8, 15) : a = Math.max(18, r * 0.3), i < 15 && (o = 10, a = Math.max(a, 20));
-  const l = dt(n, o, a, 0.85), c = dt(n, Math.min(i, 90), Math.min(r, 55), 0.5);
-  return { background: l, glow: c };
-}
-var ae = /* @__PURE__ */ x('<div><div class="flex items-center justify-center text-foreground">'), gt = /* @__PURE__ */ x("<div>");
-function oe(t) {
-  const e = G(), n = () => t.dynamicColor ? ie(t.dynamicColor) : null, i = () => !!n(), r = () => {
-    const c = n();
-    if (c)
+  const s = mt(n, o, a, 0.85), l = mt(n, Math.min(i, 90), Math.min(r, 55), 0.5);
+  return { background: s, glow: l };
+}
+var ce = /* @__PURE__ */ v('<div><div class="flex items-center justify-center text-foreground">'), ft = /* @__PURE__ */ v("<div>");
+function ue(t) {
+  const e = G(), n = () => t.dynamicColor ? le(t.dynamicColor) : null, i = () => !!n(), r = () => {
+    const l = n();
+    if (l)
       return {
-        "background-color": c.background
+        "background-color": l.background
       };
   }, a = () => {
-    const c = n();
-    if (c)
+    const l = n();
+    if (l)
       return {
-        "box-shadow": `0 0 25px ${c.glow}`
+        "box-shadow": `0 0 25px ${l.glow}`
       };
   }, o = () => {
-    const c = {
-      width: `${N.icon(e.size())}px`,
-      height: `${N.icon(e.size())}px`,
+    const l = {
+      width: `${W.icon(e.size())}px`,
+      height: `${W.icon(e.size())}px`,
       "border-radius": "var(--radius-sm, 12px)"
-    }, g = r(), d = a();
-    return g && Object.assign(c, g), d && Object.assign(c, d), c;
-  }, l = (c, g, d) => {
-    const h = {
-      width: `${N.icon(e.size()) * 1.02}px`,
-      height: `${N.icon(e.size()) * 1.02}px`,
+    }, m = r(), d = a();
+    return m && Object.assign(l, m), d && Object.assign(l, d), l;
+  }, s = (l, m, d) => {
+    const x = {
+      width: `${W.icon(e.size()) * 1.02}px`,
+      height: `${W.icon(e.size()) * 1.02}px`,
       "border-radius": "var(--radius-sm, 12px)",
-      bottom: `${-N.icon(e.size()) * c}px`,
-      right: `${-N.icon(e.size()) * (c * 0.71)}px`,
-      "z-index": g,
+      bottom: `${-W.icon(e.size()) * l}px`,
+      right: `${-W.icon(e.size()) * (l * 0.71)}px`,
+      "z-index": m,
       opacity: d
-    }, k = r();
-    return k && Object.assign(h, k), h;
+    }, p = r();
+    return p && Object.assign(x, p), x;
   };
   return (() => {
-    var c = ae(), g = c.firstChild;
-    return f(c, (() => {
-      var d = D(() => (t.entityCount ?? 1) >= 2);
+    var l = ce(), m = l.firstChild;
+    return h(l, (() => {
+      var d = _(() => (t.entityCount ?? 1) >= 2);
       return () => d() && (() => {
-        var h = gt();
-        return C((k) => {
-          var u = y("absolute", !i() && (t.color ?? "bg-foreground/10")), s = l(0.14, -2, 0.45);
-          return u !== k.e && w(h, k.e = u), k.t = tt(h, s, k.t), k;
+        var x = ft();
+        return M((p) => {
+          var c = $("absolute", !i() && (t.color ?? "bg-foreground/10")), u = s(0.14, -2, 0.45);
+          return c !== p.e && k(x, p.e = c), p.t = et(x, u, p.t), p;
         }, {
           e: void 0,
           t: void 0
-        }), h;
+        }), x;
       })();
-    })(), g), f(c, (() => {
-      var d = D(() => (t.entityCount ?? 1) >= 3);
+    })(), m), h(l, (() => {
+      var d = _(() => (t.entityCount ?? 1) >= 3);
       return () => d() && (() => {
-        var h = gt();
-        return C((k) => {
-          var u = y("absolute", !i() && (t.color ?? "bg-foreground/10")), s = l(0.28, -3, 0.2);
-          return u !== k.e && w(h, k.e = u), k.t = tt(h, s, k.t), k;
+        var x = ft();
+        return M((p) => {
+          var c = $("absolute", !i() && (t.color ?? "bg-foreground/10")), u = s(0.28, -3, 0.2);
+          return c !== p.e && k(x, p.e = c), p.t = et(x, u, p.t), p;
         }, {
           e: void 0,
           t: void 0
-        }), h;
+        }), x;
       })();
-    })(), g), f(g, () => t.icon), C((d) => {
-      var h = y(
+    })(), m), h(m, () => t.icon), M((d) => {
+      var x = $(
         "relative flex shrink-0 items-center justify-center transition-all",
         "pointer-events-none",
         t.dimmed && "opacity-50",
@@ -641,45 +657,45 @@ function oe(t) {
         !i() && (t.color ?? "bg-foreground/10"),
         !i() && t.glow,
         t.class
-      ), k = o(), u = `${N.iconSize(e.size())}px`;
-      return h !== d.e && w(c, d.e = h), d.t = tt(c, k, d.t), u !== d.a && p(g, "font-size", d.a = u), d;
+      ), p = o(), c = `${W.iconSize(e.size())}px`;
+      return x !== d.e && k(l, d.e = x), d.t = et(l, p, d.t), c !== d.a && C(m, "font-size", d.a = c), d;
     }, {
       e: void 0,
       t: void 0,
       a: void 0
-    }), c;
+    }), l;
   })();
 }
-var se = /* @__PURE__ */ x("<div>"), le = /* @__PURE__ */ x("<div><div><span></span></div><div>"), ce = /* @__PURE__ */ x("<span class=shrink-0>"), ue = /* @__PURE__ */ x('<span class="ml-1 text-foreground/70">');
-function de(t) {
+var de = /* @__PURE__ */ v("<div>"), ge = /* @__PURE__ */ v("<div><div><span></span></div><div>"), me = /* @__PURE__ */ v("<span class=shrink-0>"), fe = /* @__PURE__ */ v('<span class="ml-1 text-foreground/70">');
+function he(t) {
   const e = G(), n = () => {
     const i = t.direction ?? "auto";
     return i === "auto" ? e.orientation() === "horizontal" ? "horizontal" : "vertical" : i;
   };
   return (() => {
-    var i = se();
-    return f(i, () => t.children), C(() => w(i, y("flex", n() === "horizontal" ? "flex-row gap-4" : "flex-col gap-2", t.class))), i;
+    var i = de();
+    return h(i, () => t.children), M(() => k(i, $("flex", n() === "horizontal" ? "flex-row gap-4" : "flex-col gap-2", t.class))), i;
   })();
 }
-function ge(t) {
+function xe(t) {
   const e = G();
   return (() => {
-    var n = le(), i = n.firstChild, r = i.firstChild, a = i.nextSibling;
-    return f(i, (() => {
-      var o = D(() => !!t.icon);
+    var n = ge(), i = n.firstChild, r = i.firstChild, a = i.nextSibling;
+    return h(i, (() => {
+      var o = _(() => !!t.icon);
       return () => o() && (() => {
-        var l = ce();
-        return f(l, () => t.icon), l;
+        var s = me();
+        return h(s, () => t.icon), s;
       })();
-    })(), r), f(r, () => t.label), f(a, () => t.value, null), f(a, (() => {
-      var o = D(() => !!t.unit);
+    })(), r), h(r, () => t.label), h(a, () => t.value, null), h(a, (() => {
+      var o = _(() => !!t.unit);
       return () => o() && (() => {
-        var l = ue();
-        return f(l, () => t.unit), l;
+        var s = fe();
+        return h(s, () => t.unit), s;
       })();
-    })(), null), C((o) => {
-      var l = y("flex flex-col", t.dimmed && "opacity-50", t.class), c = N.S1(e.size()), g = y("flex items-center gap-1 text-foreground/60", H.metricLabel(e.size())), d = y("font-semibold text-foreground", H.metricValue(e.size()));
-      return l !== o.e && w(n, o.e = l), c !== o.t && p(n, "gap", o.t = c), g !== o.a && w(i, o.a = g), d !== o.o && w(a, o.o = d), o;
+    })(), null), M((o) => {
+      var s = $("flex flex-col", t.dimmed && "opacity-50", t.class), l = W.S1(e.size()), m = $("flex items-center gap-1 text-foreground/60", j.metricLabel(e.size())), d = $("font-semibold text-foreground", j.metricValue(e.size()));
+      return s !== o.e && k(n, o.e = s), l !== o.t && C(n, "gap", o.t = l), m !== o.a && k(i, o.a = m), d !== o.o && k(a, o.o = d), o;
     }, {
       e: void 0,
       t: void 0,
@@ -688,47 +704,47 @@ function ge(t) {
     }), n;
   })();
 }
-const bt = de;
-bt.Item = ge;
-var me = /* @__PURE__ */ x("<p>");
-function fe(t) {
+const $t = he;
+$t.Item = xe;
+var ve = /* @__PURE__ */ v("<p>");
+function be(t) {
   const e = G();
   return (() => {
-    var n = me();
-    return f(n, (() => {
-      var i = D(() => !!t.isUnavailable);
+    var n = ve();
+    return h(n, (() => {
+      var i = _(() => !!t.isUnavailable);
       return () => i() ? "Unavailable" : t.children;
-    })()), C((i) => {
-      var r = y("relative font-bold text-foreground", t.dimmed && "opacity-40", H.status(e.size()), t.class), a = L.ACTIONS;
-      return r !== i.e && w(n, i.e = r), a !== i.t && p(n, "z-index", i.t = a), i;
+    })()), M((i) => {
+      var r = $("relative font-bold text-foreground", t.dimmed && "opacity-40", j.status(e.size()), t.class), a = F.ACTIONS;
+      return r !== i.e && k(n, i.e = r), a !== i.t && C(n, "z-index", i.t = a), i;
     }, {
       e: void 0,
       t: void 0
     }), n;
   })();
 }
-var he = /* @__PURE__ */ x("<p>");
-function xe(t) {
+var ye = /* @__PURE__ */ v("<p>");
+function we(t) {
   const e = G();
   return (() => {
-    var n = he();
-    return f(n, () => t.children), C(() => w(n, y("truncate font-medium text-foreground/80", t.dimmed && "text-foreground/50", H.subtitle(e.size()), t.class))), n;
+    var n = ye();
+    return h(n, () => t.children), M(() => k(n, $("truncate font-medium text-foreground/80", t.dimmed && "text-foreground/50", j.subtitle(e.size()), t.class))), n;
   })();
 }
-var ve = /* @__PURE__ */ x("<div><h3>"), be = /* @__PURE__ */ x("<span>");
-function ye(t) {
+var $e = /* @__PURE__ */ v("<div><h3>"), ke = /* @__PURE__ */ v("<span>");
+function pe(t) {
   const e = G();
   return (() => {
-    var n = ve(), i = n.firstChild;
-    return f(i, () => t.children), f(n, (() => {
-      var r = D(() => t.badge !== void 0 && t.badge > 0);
+    var n = $e(), i = n.firstChild;
+    return h(i, () => t.children), h(n, (() => {
+      var r = _(() => t.badge !== void 0 && t.badge > 0);
       return () => r() && (() => {
-        var a = be();
-        return f(a, () => t.badge), C(() => w(a, y("shrink-0 rounded-full bg-foreground/20 px-2 py-0.5 font-medium text-foreground", H.badge(e.size())))), a;
+        var a = ke();
+        return h(a, () => t.badge), M(() => k(a, $("shrink-0 rounded-full bg-foreground/20 px-2 py-0.5 font-medium text-foreground", j.badge(e.size())))), a;
       })();
-    })(), null), C((r) => {
-      var a = y("relative flex items-center", t.class), o = N.S1(e.size()), l = L.ACTIONS, c = y("truncate text-foreground/60", H.title(e.size()));
-      return a !== r.e && w(n, r.e = a), o !== r.t && p(n, "gap", r.t = o), l !== r.a && p(n, "z-index", r.a = l), c !== r.o && w(i, r.o = c), r;
+    })(), null), M((r) => {
+      var a = $("relative flex items-center", t.class), o = W.S1(e.size()), s = F.ACTIONS, l = $("truncate text-foreground/60", j.title(e.size()));
+      return a !== r.e && k(n, r.e = a), o !== r.t && C(n, "gap", r.t = o), s !== r.a && C(n, "z-index", r.a = s), l !== r.o && k(i, r.o = l), r;
     }, {
       e: void 0,
       t: void 0,
@@ -737,14 +753,14 @@ function ye(t) {
     }), n;
   })();
 }
-function Mn(t) {
+function On(t) {
   return {
     icon: t.icon,
     title: t.title,
     message: t.message || `Configure this widget to add ${t.entityType || "an entity"}`
   };
 }
-function we(t, e = !1) {
+function Se(t, e = !1) {
   if (t.length === 0)
     return {
       isGroup: !1,
@@ -760,26 +776,26 @@ function we(t, e = !1) {
     };
   const n = t.length > 1;
   if (!n) {
-    const _ = t[0], S = _.state === "on", O = _.attributes?.brightness || 0, I = Math.round(O / 255 * 100);
+    const z = t[0], S = z.state === "on", E = z.attributes?.brightness || 0, I = Math.round(E / 255 * 100);
     return {
       isGroup: !1,
-      state: _.state,
+      state: z.state,
       isOn: S,
-      isUnavailable: _.state === "unavailable",
-      brightness: O,
+      isUnavailable: z.state === "unavailable",
+      brightness: E,
       brightnessPercent: I,
-      color: mt(_),
+      color: ht(z),
       onCount: S ? 1 : 0,
       totalCount: 1,
       description: S ? "On" : "Off"
     };
   }
-  let i = 0, r = 0, a = 0, o = 0, l = 0, c = 0;
-  const g = [];
-  for (const _ of t)
-    switch (_.state) {
+  let i = 0, r = 0, a = 0, o = 0, s = 0, l = 0;
+  const m = [];
+  for (const z of t)
+    switch (z.state) {
       case "on":
-        i++, _.attributes?.brightness !== void 0 && (l += _.attributes.brightness, c++), _.attributes?.rgb_color && g.push(_.attributes.rgb_color);
+        i++, z.attributes?.brightness !== void 0 && (s += z.attributes.brightness, l++), z.attributes?.rgb_color && m.push(z.attributes.rgb_color);
         break;
       case "off":
         r++;
@@ -791,31 +807,31 @@ function we(t, e = !1) {
         o++;
         break;
     }
-  const d = t.length, h = o === d, k = a + o === d, u = i > 0, s = i === d, b = r === d;
-  let v, T;
-  e ? h ? (v = "unavailable", T = !1) : a > 0 || o > 0 ? (v = "unknown", T = !1) : r > 0 ? (v = "off", T = !1) : (v = "on", T = !0) : h ? (v = "unavailable", T = !1) : k ? (v = "unknown", T = !1) : u ? (v = "on", T = !0) : (v = "off", T = !1);
-  const U = c > 0 ? Math.round(l / c) : 0, $ = Math.round(U / 255 * 100);
-  let A;
-  if (g.length > 0) {
-    const _ = Math.round(g.reduce((V, R) => V + R[0], 0) / g.length), S = Math.round(g.reduce((V, R) => V + R[1], 0) / g.length), O = Math.round(g.reduce((V, R) => V + R[2], 0) / g.length), I = U / 255;
-    A = `rgb(${Math.round(_ * I)}, ${Math.round(S * I)}, ${Math.round(O * I)})`;
+  const d = t.length, x = o === d, p = a + o === d, c = i > 0, u = i === d, b = r === d;
+  let y, O;
+  e ? x ? (y = "unavailable", O = !1) : a > 0 || o > 0 ? (y = "unknown", O = !1) : r > 0 ? (y = "off", O = !1) : (y = "on", O = !0) : x ? (y = "unavailable", O = !1) : p ? (y = "unknown", O = !1) : c ? (y = "on", O = !0) : (y = "off", O = !1);
+  const P = l > 0 ? Math.round(s / l) : 0, w = Math.round(P / 255 * 100);
+  let N;
+  if (m.length > 0) {
+    const z = Math.round(m.reduce((g, R) => g + R[0], 0) / m.length), S = Math.round(m.reduce((g, R) => g + R[1], 0) / m.length), E = Math.round(m.reduce((g, R) => g + R[2], 0) / m.length), I = P / 255;
+    N = `rgb(${Math.round(z * I)}, ${Math.round(S * I)}, ${Math.round(E * I)})`;
   } else
-    A = mt(t[0]);
-  let E;
-  return s ? E = "All on" : b ? E = "All off" : i > 0 ? E = `${i} of ${d} on` : E = "Off", {
+    N = ht(t[0]);
+  let T;
+  return u ? T = "All on" : b ? T = "All off" : i > 0 ? T = `${i} of ${d} on` : T = "Off", {
     isGroup: n,
-    state: v,
-    isOn: T,
-    isUnavailable: v === "unavailable",
-    brightness: U,
-    brightnessPercent: $,
-    color: A,
+    state: y,
+    isOn: O,
+    isUnavailable: y === "unavailable",
+    brightness: P,
+    brightnessPercent: w,
+    color: N,
     onCount: i,
     totalCount: d,
-    description: E
+    description: T
   };
 }
-function $e(t, e = "mean", n = !0) {
+function Ce(t, e = "mean", n = !0) {
   if (t.length === 0)
     return {
       isGroup: !1,
@@ -826,98 +842,98 @@ function $e(t, e = "mean", n = !0) {
     };
   const i = t.length > 1;
   if (!i) {
-    const u = t[0], s = Number.parseFloat(u.state);
-    let b = u.state;
-    return Number.isNaN(s) || (b = Number.isInteger(s) ? s.toString() : s.toFixed(1)), {
+    const c = t[0], u = Number.parseFloat(c.state);
+    let b = c.state;
+    return Number.isNaN(u) || (b = Number.isInteger(u) ? u.toString() : u.toFixed(1)), {
       isGroup: !1,
       state: b,
-      numericValue: Number.isNaN(s) ? null : s,
-      isUnavailable: u.state === "unavailable",
-      unit: u.unitOfMeasurement ?? void 0,
+      numericValue: Number.isNaN(u) ? null : u,
+      isUnavailable: c.state === "unavailable",
+      unit: c.unitOfMeasurement ?? void 0,
       description: b
     };
   }
   const r = [], a = [];
-  let o = 0, l;
-  for (const u of t) {
-    if (!l && u.unitOfMeasurement && (l = u.unitOfMeasurement), u.state === "unavailable") {
+  let o = 0, s;
+  for (const c of t) {
+    if (!s && c.unitOfMeasurement && (s = c.unitOfMeasurement), c.state === "unavailable") {
       o++, a.push({
-        entityId: u.id,
+        entityId: c.id,
         value: "unavailable",
-        friendly_name: u.friendlyName
+        friendly_name: c.friendlyName
       });
       continue;
     }
-    const s = Number.parseFloat(u.state);
-    isNaN(s) ? n || a.push({
-      entityId: u.id,
-      value: u.state,
-      friendly_name: u.friendlyName
-    }) : (r.push(s), a.push({
-      entityId: u.id,
-      value: s,
-      friendly_name: u.friendlyName
+    const u = Number.parseFloat(c.state);
+    isNaN(u) ? n || a.push({
+      entityId: c.id,
+      value: c.state,
+      friendly_name: c.friendlyName
+    }) : (r.push(u), a.push({
+      entityId: c.id,
+      value: u,
+      friendly_name: c.friendlyName
     }));
   }
-  const c = o === t.length, g = r.length === 0;
-  if (c || g)
+  const l = o === t.length, m = r.length === 0;
+  if (l || m)
     return {
       isGroup: i,
-      state: c ? "unavailable" : "unknown",
+      state: l ? "unavailable" : "unknown",
       numericValue: null,
-      isUnavailable: c,
-      unit: l,
-      description: c ? "Unavailable" : "No numeric values",
+      isUnavailable: l,
+      unit: s,
+      description: l ? "Unavailable" : "No numeric values",
       memberValues: a
     };
-  let d, h;
+  let d, x;
   switch (e) {
     case "min":
-      d = Math.min(...r), h = "Minimum";
+      d = Math.min(...r), x = "Minimum";
       break;
     case "max":
-      d = Math.max(...r), h = "Maximum";
+      d = Math.max(...r), x = "Maximum";
       break;
     case "mean":
-      d = r.reduce((u, s) => u + s, 0) / r.length, h = "Average";
+      d = r.reduce((c, u) => c + u, 0) / r.length, x = "Average";
       break;
     case "median": {
-      const u = [...r].sort((b, v) => b - v), s = Math.floor(u.length / 2);
-      d = u.length % 2 === 0 ? (u[s - 1] + u[s]) / 2 : u[s], h = "Median";
+      const c = [...r].sort((b, y) => b - y), u = Math.floor(c.length / 2);
+      d = c.length % 2 === 0 ? (c[u - 1] + c[u]) / 2 : c[u], x = "Median";
       break;
     }
     case "sum":
-      d = r.reduce((u, s) => u + s, 0), h = "Sum";
+      d = r.reduce((c, u) => c + u, 0), x = "Sum";
       break;
     case "last":
-      d = r[r.length - 1], h = "Latest";
+      d = r[r.length - 1], x = "Latest";
       break;
     case "range":
-      d = Math.max(...r) - Math.min(...r), h = "Range";
+      d = Math.max(...r) - Math.min(...r), x = "Range";
       break;
     case "product":
-      d = r.reduce((u, s) => u * s, 1), h = "Product";
+      d = r.reduce((c, u) => c * u, 1), x = "Product";
       break;
     case "std_dev": {
-      const u = r.reduce((b, v) => b + v, 0) / r.length, s = r.reduce((b, v) => b + (v - u) ** 2, 0) / r.length;
-      d = Math.sqrt(s), h = "Std Dev";
+      const c = r.reduce((b, y) => b + y, 0) / r.length, u = r.reduce((b, y) => b + (y - c) ** 2, 0) / r.length;
+      d = Math.sqrt(u), x = "Std Dev";
       break;
     }
     default:
-      d = r.reduce((u, s) => u + s, 0) / r.length, h = "Average";
+      d = r.reduce((c, u) => c + u, 0) / r.length, x = "Average";
   }
-  const k = Number.isInteger(d) ? d.toString() : d.toFixed(1);
+  const p = Number.isInteger(d) ? d.toString() : d.toFixed(1);
   return {
     isGroup: i,
-    state: k,
+    state: p,
     numericValue: d,
     isUnavailable: !1,
-    unit: l,
-    description: `${h} of ${r.length}`,
+    unit: s,
+    description: `${x} of ${r.length}`,
     memberValues: a
   };
 }
-function mt(t) {
+function ht(t) {
   if (t.state !== "on") return "rgb(100, 100, 100)";
   const n = (t.attributes?.brightness ?? 255) / 255;
   if (t.attributes?.rgb_color) {
@@ -926,15 +942,15 @@ function mt(t) {
   }
   if (t.attributes?.color_temp) {
     const r = 1e6 / t.attributes.color_temp / 100;
-    let a, o, l;
-    return r <= 66 ? (a = 255, o = r <= 19 ? 0 : 99.4708025861 * Math.log(r - 10) - 161.1195681661, l = r <= 19 ? 0 : r <= 66 ? 138.5177312231 * Math.log(r - 10) - 305.0447927307 : 255) : (a = 329.698727446 * (r - 60) ** -0.1332047592, o = 288.1221695283 * (r - 60) ** -0.0755148492, l = 255), a = Math.max(0, Math.min(255, a)) * n, o = Math.max(0, Math.min(255, o)) * n, l = Math.max(0, Math.min(255, l)) * n, `rgb(${Math.round(a)}, ${Math.round(o)}, ${Math.round(l)})`;
+    let a, o, s;
+    return r <= 66 ? (a = 255, o = r <= 19 ? 0 : 99.4708025861 * Math.log(r - 10) - 161.1195681661, s = r <= 19 ? 0 : r <= 66 ? 138.5177312231 * Math.log(r - 10) - 305.0447927307 : 255) : (a = 329.698727446 * (r - 60) ** -0.1332047592, o = 288.1221695283 * (r - 60) ** -0.0755148492, s = 255), a = Math.max(0, Math.min(255, a)) * n, o = Math.max(0, Math.min(255, o)) * n, s = Math.max(0, Math.min(255, s)) * n, `rgb(${Math.round(a)}, ${Math.round(o)}, ${Math.round(s)})`;
   }
   return `rgb(${Math.round(255 * n)}, ${Math.round(220 * n)}, ${Math.round(180 * n)})`;
 }
-function ke(t) {
+function Me(t) {
   return t ? t.state !== "unavailable" && t.state !== "unknown" : !1;
 }
-function pe(t) {
+function ze(t) {
   if (!t) return !1;
   if (["on", "open", "locked", "home", "playing", "active"].includes(t.state))
     return !0;
@@ -944,28 +960,28 @@ function pe(t) {
   }
   return !1;
 }
-function zn(t, e = "unknown") {
+function En(t, e = "unknown") {
   return t?.state ?? e;
 }
-function Dn(t, e, n) {
+function Vn(t, e, n) {
   return t?.attributes ? t.attributes[e] ?? n : n;
 }
-function _n(t, e) {
+function Wn(t, e) {
   return t.filter((n) => n.state === e).length;
 }
-function An(t) {
-  return t.filter(ke).length;
+function In(t) {
+  return t.filter(Me).length;
 }
-function Nn(t) {
-  return t.filter(pe).length;
+function Rn(t) {
+  return t.filter(ze).length;
 }
-function Tn(t, e) {
+function Gn(t, e) {
   return t.length > 0 && t.every((n) => n.state === e);
 }
-function En(t, e) {
+function Hn(t, e) {
   return t.some((n) => n.state === e);
 }
-function Se(t, e, n) {
+function De(t, e, n) {
   const { decimals: i, scale: r = !0 } = n || {};
   if (typeof t == "string")
     return e ? `${t}${e}` : t;
@@ -973,120 +989,120 @@ function Se(t, e, n) {
     return e ? `--${e}` : "--";
   let a = t, o = e || "";
   r && e && (e === "W" || e === "kW" || e === "MW") && (t >= 1e6 ? (a = t / 1e6, o = "MW") : t >= 1e3 ? (a = t / 1e3, o = "kW") : o = "W"), r && e && (e === "B" || e === "KB" || e === "MB" || e === "GB") && (t >= 1073741824 ? (a = t / 1073741824, o = "GB") : t >= 1048576 ? (a = t / 1048576, o = "MB") : t >= 1024 ? (a = t / 1024, o = "KB") : o = "B");
-  let l;
-  return i !== void 0 ? l = a.toFixed(i) : a !== t ? l = a.toFixed(1) : Number.isInteger(t) ? l = t.toString() : l = Number.parseFloat(t.toFixed(2)).toString(), o ? `${l}${o}` : l;
+  let s;
+  return i !== void 0 ? s = a.toFixed(i) : a !== t ? s = a.toFixed(1) : Number.isInteger(t) ? s = t.toString() : s = Number.parseFloat(t.toFixed(2)).toString(), o ? `${s}${o}` : s;
 }
-function Ce(t, e) {
+function _e(t, e) {
   return t == null || isNaN(t) ? null : e === "°C" ? t < 10 ? "Cold" : t < 18 ? "Cool" : t < 24 ? "Comfortable" : t < 28 ? "Warm" : "Hot" : e === "°F" ? t < 50 ? "Cold" : t < 64 ? "Cool" : t < 75 ? "Comfortable" : t < 82 ? "Warm" : "Hot" : e === "%" ? t < 20 ? "Very Low" : t < 40 ? "Low" : t < 60 ? "Medium" : t < 80 ? "High" : "Very High" : e === "ppm" ? t < 400 ? "Excellent" : t < 600 ? "Good" : t < 1e3 ? "Acceptable" : t < 1500 ? "Mediocre" : "Poor" : e === "lx" ? t < 50 ? "Dark" : t < 200 ? "Dim" : t < 500 ? "Moderate" : t < 1e3 ? "Bright" : "Very Bright" : e === "AQI" ? t <= 50 ? "Good" : t <= 100 ? "Moderate" : t <= 150 ? "Unhealthy for Sensitive" : t <= 200 ? "Unhealthy" : t <= 300 ? "Very Unhealthy" : "Hazardous" : e === "dB" ? t < 30 ? "Very Quiet" : t < 50 ? "Quiet" : t < 70 ? "Moderate" : t < 85 ? "Loud" : "Very Loud" : null;
 }
-var Me = /* @__PURE__ */ x("<div><div>"), ze = /* @__PURE__ */ x("<div>");
-function De(t) {
+var Ae = /* @__PURE__ */ v("<div><div>"), Ne = /* @__PURE__ */ v("<div>");
+function Te(t) {
   const e = G();
   return (() => {
-    var n = Me(), i = n.firstChild;
-    return f(i, () => Se(t.value, t.unit)), f(n, (() => {
-      var r = D(() => !!(t.interpret && typeof t.value == "number"));
+    var n = Ae(), i = n.firstChild;
+    return h(i, () => De(t.value, t.unit)), h(n, (() => {
+      var r = _(() => !!(t.interpret && typeof t.value == "number"));
       return () => r() && (() => {
-        var a = ze();
-        return f(a, () => Ce(t.value, t.unit)), C((o) => {
-          var l = y("text-foreground/60", H.subtitle(e.size())), c = N.S1(e.size());
-          return l !== o.e && w(a, o.e = l), c !== o.t && p(a, "margin-top", o.t = c), o;
+        var a = Ne();
+        return h(a, () => _e(t.value, t.unit)), M((o) => {
+          var s = $("text-foreground/60", j.subtitle(e.size())), l = W.S1(e.size());
+          return s !== o.e && k(a, o.e = s), l !== o.t && C(a, "margin-top", o.t = l), o;
         }, {
           e: void 0,
           t: void 0
         }), a;
       })();
-    })(), null), C((r) => {
-      var a = y("flex flex-col", t.class), o = y("font-bold text-foreground", H.value(e.size()));
-      return a !== r.e && w(n, r.e = a), o !== r.t && w(i, r.t = o), r;
+    })(), null), M((r) => {
+      var a = $("flex flex-col", t.class), o = $("font-bold text-foreground", j.value(e.size()));
+      return a !== r.e && k(n, r.e = a), o !== r.t && k(i, r.t = o), r;
     }, {
       e: void 0,
       t: void 0
     }), n;
   })();
 }
-var _e = /* @__PURE__ */ x('<div><div><div class="relative h-full w-full">'), Ae = /* @__PURE__ */ x('<div class="pointer-events-none absolute inset-0"><div>'), Ne = /* @__PURE__ */ x('<div class="pointer-events-none absolute inset-0 animate-pulse bg-blue-500/20">'), Te = /* @__PURE__ */ x('<div class="flex h-full w-full flex-col items-center justify-center gap-2 text-center">'), Ee = /* @__PURE__ */ x('<div class="flex items-center justify-center text-white/30">'), Oe = /* @__PURE__ */ x('<h3 class="font-semibold text-sm text-white/60">'), Ve = /* @__PURE__ */ x('<p class="text-white/50 text-xs">');
-function We(t, e) {
+var Oe = /* @__PURE__ */ v('<div><div><div class="relative h-full w-full">'), Ee = /* @__PURE__ */ v('<div class="pointer-events-none absolute inset-0"><div>'), Ve = /* @__PURE__ */ v('<div class="pointer-events-none absolute inset-0 animate-pulse bg-blue-500/20">'), We = /* @__PURE__ */ v('<div class="flex h-full w-full flex-col items-center justify-center gap-2 text-center">'), Ie = /* @__PURE__ */ v('<div class="flex items-center justify-center text-white/30">'), Re = /* @__PURE__ */ v('<h3 class="font-semibold text-sm text-white/60">'), Ge = /* @__PURE__ */ v('<p class="text-white/50 text-xs">');
+function He(t, e) {
   const n = t * e;
   return n <= 2 ? "xs" : n <= 4 ? "sm" : n <= 8 ? "md" : n <= 18 ? "lg" : "xl";
 }
-function Ie(t, e) {
+function Be(t, e) {
   return t > e ? "horizontal" : e > t ? "vertical" : "square";
 }
-function Re(t, e) {
+function Le(t, e) {
   return e >= 150 ? "vertical" : t > e ? "horizontal" : e > t ? "vertical" : "square";
 }
-function Ge(t) {
+function je(t) {
   let e;
-  const n = Mt(() => e), i = 2, [r, a] = j(0), [o, l] = j(0);
-  F(() => {
-    const $ = Math.round(n.width ?? 0), A = Math.round(n.height ?? 0), E = ut(r), _ = ut(o);
-    (Math.abs($ - E) > i || Math.abs(A - _) > i) && (a($), l(A));
+  const n = _t(() => e), i = 2, [r, a] = L(0), [o, s] = L(0);
+  Y(() => {
+    const w = Math.round(n.width ?? 0), N = Math.round(n.height ?? 0), T = dt(r), z = dt(o);
+    (Math.abs(w - T) > i || Math.abs(N - z) > i) && (a(w), s(N));
   });
-  const c = z(() => {
+  const l = A(() => {
     if (t.variant)
-      return typeof t.variant == "string" ? Vt(t.variant) : t.variant;
-  }), g = z(() => ({
+      return typeof t.variant == "string" ? Gt(t.variant) : t.variant;
+  }), m = A(() => ({
     width: r(),
     height: o(),
     gridWidth: Math.max(1, Math.round(r() / 150)),
     gridHeight: Math.max(1, Math.round(o() / 75))
   }), void 0, {
-    equals: ($, A) => $.width === A.width && $.height === A.height && $.gridWidth === A.gridWidth && $.gridHeight === A.gridHeight
-  }), d = z(() => {
-    const $ = g();
-    return We($.gridWidth, $.gridHeight);
-  }), h = z(() => {
-    const $ = g();
-    return Ie($.width, $.height);
-  }), k = z(() => {
-    const $ = g();
-    return Re($.width, $.height);
-  }), u = ht(ot), s = u;
-  s?._isStub?.() && s._bridge && (F(() => {
-    s._bridge.setSize(d());
-  }), F(() => {
-    s._bridge.setOrientation(h());
-  }), F(() => {
-    s._bridge.setContentLayout(k());
-  }), F(() => {
-    s._bridge.setDimensions(g());
-  }), F(() => {
-    s._bridge.setIsStub(!1);
+    equals: (w, N) => w.width === N.width && w.height === N.height && w.gridWidth === N.gridWidth && w.gridHeight === N.gridHeight
+  }), d = A(() => {
+    const w = m();
+    return He(w.gridWidth, w.gridHeight);
+  }), x = A(() => {
+    const w = m();
+    return Be(w.width, w.height);
+  }), p = A(() => {
+    const w = m();
+    return Le(w.width, w.height);
+  }), c = vt(st), u = c;
+  u?._isStub?.() && u._bridge && (Y(() => {
+    u._bridge.setSize(d());
+  }), Y(() => {
+    u._bridge.setOrientation(x());
+  }), Y(() => {
+    u._bridge.setContentLayout(p());
+  }), Y(() => {
+    u._bridge.setDimensions(m());
+  }), Y(() => {
+    u._bridge.setIsStub(!1);
   }));
   const b = {
     size: d,
-    orientation: h,
-    contentLayout: k,
-    dimensions: g,
+    orientation: x,
+    contentLayout: p,
+    dimensions: m,
     isEditMode: () => t.isEditMode ?? !1,
-    updateConfig: u?.updateConfig ?? (() => {
+    updateConfig: c?.updateConfig ?? (() => {
     })
-  }, v = "bg-gradient-to-br from-gray-500/20 to-gray-600/20", T = z(() => t.emptyState && !t.gradient ? v : t.gradient), U = z(() => ({
+  }, y = "bg-gradient-to-br from-gray-500/20 to-gray-600/20", O = A(() => t.emptyState && !t.gradient ? y : t.gradient), P = A(() => ({
     "container-type": "size",
     "container-name": "widget",
-    ...c()?.styles?.container,
-    ...c()?.styles?.cssVars || {}
+    ...l()?.styles?.container,
+    ...l()?.styles?.cssVars || {}
   }));
-  return W(ot.Provider, {
+  return V(st.Provider, {
     value: b,
     get children() {
-      var $ = _e(), A = $.firstChild, E = A.firstChild, _ = e;
-      return typeof _ == "function" ? kt(_, $) : e = $, f(A, (() => {
-        var S = D(() => !!t.backgroundGlow);
+      var w = Oe(), N = w.firstChild, T = N.firstChild, z = e;
+      return typeof z == "function" ? Ct(z, w) : e = w, h(N, (() => {
+        var S = _(() => !!t.backgroundGlow);
         return () => S() && (() => {
-          var O = Ae(), I = O.firstChild;
-          return C((V) => {
-            var R = L.BACKGROUND, Q = y("absolute inset-0 opacity-20 blur-2xl", t.backgroundGlow);
-            return R !== V.e && p(O, "z-index", V.e = R), Q !== V.t && w(I, V.t = Q), V;
+          var E = Ee(), I = E.firstChild;
+          return M((g) => {
+            var R = F.BACKGROUND, H = $("absolute inset-0 opacity-20 blur-2xl", t.backgroundGlow);
+            return R !== g.e && C(E, "z-index", g.e = R), H !== g.t && k(I, g.t = H), g;
           }, {
             e: void 0,
             t: void 0
-          }), O;
+          }), E;
         })();
-      })(), E), f(E, (() => {
-        var S = D(() => !!t.emptyState);
-        return () => S() ? W(Be, {
+      })(), T), h(T, (() => {
+        var S = _(() => !!t.emptyState);
+        return () => S() ? V(Pe, {
           get icon() {
             return t.emptyState.icon;
           },
@@ -1097,70 +1113,70 @@ function Ge(t) {
             return t.emptyState.message;
           }
         }) : t.children;
-      })()), f(A, (() => {
-        var S = D(() => !!t.loading);
+      })()), h(N, (() => {
+        var S = _(() => !!t.loading);
         return () => S() && (() => {
-          var O = Ne();
-          return C((I) => p(O, "z-index", L.OVERLAY)), O;
+          var E = Ve();
+          return M((I) => C(E, "z-index", F.OVERLAY)), E;
         })();
-      })(), null), C((S) => {
-        var O = y(
+      })(), null), M((S) => {
+        var E = $(
           "relative h-full w-full select-none rounded-xl border border-border/50",
           // Variant styles (lowest priority)
-          c()?.styles?.class,
+          l()?.styles?.class,
           // Custom class (highest priority)
           t.class
-        ), I = U(), V = y(
+        ), I = P(), g = $(
           "relative h-full w-full overflow-hidden rounded-xl",
           // Gradient prop (overrides variant, auto-applied for empty state)
-          T()
-        ), R = L.CONTENT;
-        return O !== S.e && w($, S.e = O), S.t = tt($, I, S.t), V !== S.a && w(A, S.a = V), R !== S.o && p(E, "z-index", S.o = R), S;
+          O()
+        ), R = F.CONTENT;
+        return E !== S.e && k(w, S.e = E), S.t = et(w, I, S.t), g !== S.a && k(N, S.a = g), R !== S.o && C(T, "z-index", S.o = R), S;
       }, {
         e: void 0,
         t: void 0,
         a: void 0,
         o: void 0
-      }), $;
+      }), w;
     }
   });
 }
-function Be(t) {
+function Pe(t) {
   return (() => {
-    var e = Te();
-    return f(e, (() => {
-      var n = D(() => !!t.icon);
+    var e = We();
+    return h(e, (() => {
+      var n = _(() => !!t.icon);
       return () => n() && (() => {
-        var i = Ee();
-        return f(i, () => t.icon), i;
+        var i = Ie();
+        return h(i, () => t.icon), i;
       })();
-    })(), null), f(e, (() => {
-      var n = D(() => !!t.title);
+    })(), null), h(e, (() => {
+      var n = _(() => !!t.title);
       return () => n() && (() => {
-        var i = Oe();
-        return f(i, () => t.title), i;
+        var i = Re();
+        return h(i, () => t.title), i;
       })();
-    })(), null), f(e, (() => {
-      var n = D(() => !!t.message);
+    })(), null), h(e, (() => {
+      var n = _(() => !!t.message);
       return () => n() && (() => {
-        var i = Ve();
-        return f(i, () => t.message), i;
+        var i = Ge();
+        return h(i, () => t.message), i;
       })();
     })(), null), e;
   })();
 }
-const P = Ge;
-P.Content = Yt;
-P.Icon = oe;
-P.Title = ye;
-P.Subtitle = xe;
-P.Status = fe;
-P.Value = De;
-P.Metrics = bt;
-P.EmptyState = Jt;
-P.SliderFill = Pt;
-var He = /* @__PURE__ */ x("<div><div>");
-const Le = {
+const U = je;
+U.Content = Jt;
+U.Icon = ue;
+U.Title = pe;
+U.Subtitle = we;
+U.Status = be;
+U.Value = Te;
+U.Metrics = $t;
+U.EmptyState = re;
+U.SliderFill = Yt;
+var Fe = /* @__PURE__ */ v("<div><div>");
+const Ue = {
   blue: "bg-blue-500/30",
   green: "bg-green-500/30",
   red: "bg-red-500/30",
@@ -1168,13 +1184,13 @@ const Le = {
   purple: "bg-purple-500/30",
   gray: "bg-gray-500/30"
 };
-function On(t) {
-  const e = () => Le[t.color] ?? t.color;
+function Bn(t) {
+  const e = () => Ue[t.color] ?? t.color;
   return (() => {
-    var n = He(), i = n.firstChild;
-    return C((r) => {
-      var a = y("pointer-events-none absolute inset-0", t.class), o = L.BACKGROUND, l = y("absolute inset-0 opacity-40 blur-3xl", e());
-      return a !== r.e && w(n, r.e = a), o !== r.t && p(n, "z-index", r.t = o), l !== r.a && w(i, r.a = l), r;
+    var n = Fe(), i = n.firstChild;
+    return M((r) => {
+      var a = $("pointer-events-none absolute inset-0", t.class), o = F.BACKGROUND, s = $("absolute inset-0 opacity-40 blur-3xl", e());
+      return a !== r.e && k(n, r.e = a), o !== r.t && C(n, "z-index", r.t = o), s !== r.a && k(i, r.a = s), r;
     }, {
       e: void 0,
       t: void 0,
@@ -1182,41 +1198,55 @@ function On(t) {
     }), n;
   })();
 }
-var Pe = /* @__PURE__ */ x("<div>");
-function Vn(t) {
+var Ye = /* @__PURE__ */ v("<div>");
+function Ln(t) {
   const e = G(), n = () => {
     const i = t.spacing ?? "S2";
-    return N[i](e.size());
+    return W[i](e.size());
   };
   return (() => {
-    var i = Pe();
-    return f(i, () => t.children), C((r) => {
-      var a = y("flex flex-col", t.class), o = n();
-      return a !== r.e && w(i, r.e = a), o !== r.t && p(i, "gap", r.t = o), r;
+    var i = Ye();
+    return h(i, () => t.children), M((r) => {
+      var a = $("flex flex-col", t.class), o = n();
+      return a !== r.e && k(i, r.e = a), o !== r.t && C(i, "gap", r.t = o), r;
     }, {
       e: void 0,
       t: void 0
     }), i;
   })();
 }
-var je = /* @__PURE__ */ x('<span class="inline-flex size-3.5 shrink-0 items-center">'), Ue = /* @__PURE__ */ x("<button type=button>"), Fe = /* @__PURE__ */ x('<svg xmlns=http://www.w3.org/2000/svg class=size-3.5 fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=2><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z">'), Ye = /* @__PURE__ */ x('<div class="rounded-lg bg-muted/30 p-2 text-center md:p-6"><p class="text-muted-foreground text-sm">No edit options available'), Xe = /* @__PURE__ */ x('<svg xmlns=http://www.w3.org/2000/svg class=size-3.5 fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=2><line x1=4 y1=21 x2=4 y2=14></line><line x1=4 y1=10 x2=4 y2=3></line><line x1=12 y1=21 x2=12 y2=12></line><line x1=12 y1=8 x2=12 y2=3></line><line x1=20 y1=21 x2=20 y2=16></line><line x1=20 y1=12 x2=20 y2=3></line><line x1=1 y1=14 x2=7 y2=14></line><line x1=9 y1=8 x2=15 y2=8></line><line x1=17 y1=16 x2=23 y2=16>'), Ke = /* @__PURE__ */ x('<div class="rounded-lg bg-muted/30 p-2 text-center md:p-6"><p class="text-muted-foreground text-sm">No additional controls'), qe = /* @__PURE__ */ x('<svg xmlns=http://www.w3.org/2000/svg class=size-3.5 fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=2><path d="m8 2 1.88 1.88"></path><path d="M14.12 3.88 16 2"></path><path d="M9 7.13v-1a3.003 3.003 0 1 1 6 0v1"></path><path d="M12 20c-3.3 0-6-2.7-6-6v-3a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4v3c0 3.3-2.7 6-6 6"></path><path d="M12 20v-9"></path><path d="M6.53 9C4.6 8.8 3 7.1 3 5"></path><path d="M6 13H2"></path><path d="M3 21c0-2.1 1.7-3.9 3.8-4"></path><path d="M20.97 5c0 2.1-1.6 3.8-3.5 4"></path><path d="M22 13h-4"></path><path d="M17.2 17c2.1.1 3.8 1.9 3.8 4">'), Ze = /* @__PURE__ */ x('<div class="rounded-lg bg-muted/30 p-2 text-center md:p-6"><p class="text-muted-foreground text-sm">No debug information available'), Qe = /* @__PURE__ */ x('<div class="min-w-0 shrink-0">'), Je = /* @__PURE__ */ x('<div class="flex items-center gap-2"><div class="flex h-8 items-center rounded-lg border border-border/50 bg-muted/30 p-0.5">'), tn = /* @__PURE__ */ x('<div class="min-h-0 flex-1 overflow-y-auto p-2 md:p-6">'), en = /* @__PURE__ */ x('<div class="flex shrink-0 justify-end pt-3">');
-function nn(t) {
+var Xe = /* @__PURE__ */ v('<span class="inline-flex size-3.5 shrink-0 items-center">'), Ke = /* @__PURE__ */ v("<button type=button>"), qe = /* @__PURE__ */ v('<svg xmlns=http://www.w3.org/2000/svg class=size-3.5 fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=2><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z">'), Je = /* @__PURE__ */ v('<div class="rounded-lg bg-muted/30 p-2 text-center md:p-6"><p class="text-muted-foreground text-sm">No edit options available'), Ze = /* @__PURE__ */ v('<svg xmlns=http://www.w3.org/2000/svg class=size-3.5 fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=2><line x1=4 y1=21 x2=4 y2=14></line><line x1=4 y1=10 x2=4 y2=3></line><line x1=12 y1=21 x2=12 y2=12></line><line x1=12 y1=8 x2=12 y2=3></line><line x1=20 y1=21 x2=20 y2=16></line><line x1=20 y1=12 x2=20 y2=3></line><line x1=1 y1=14 x2=7 y2=14></line><line x1=9 y1=8 x2=15 y2=8></line><line x1=17 y1=16 x2=23 y2=16>'), Qe = /* @__PURE__ */ v('<div class="rounded-lg bg-muted/30 p-2 text-center md:p-6"><p class="text-muted-foreground text-sm">No additional controls'), tn = /* @__PURE__ */ v('<svg xmlns=http://www.w3.org/2000/svg class=size-3.5 fill=none viewBox="0 0 24 24"stroke=currentColor stroke-width=2><path d="m8 2 1.88 1.88"></path><path d="M14.12 3.88 16 2"></path><path d="M9 7.13v-1a3.003 3.003 0 1 1 6 0v1"></path><path d="M12 20c-3.3 0-6-2.7-6-6v-3a4 4 0 0 1 4-4h4a4 4 0 0 1 4 4v3c0 3.3-2.7 6-6 6"></path><path d="M12 20v-9"></path><path d="M6.53 9C4.6 8.8 3 7.1 3 5"></path><path d="M6 13H2"></path><path d="M3 21c0-2.1 1.7-3.9 3.8-4"></path><path d="M20.97 5c0 2.1-1.6 3.8-3.5 4"></path><path d="M22 13h-4"></path><path d="M17.2 17c2.1.1 3.8 1.9 3.8 4">'), en = /* @__PURE__ */ v('<div class="rounded-lg bg-muted/30 p-2 text-center md:p-6"><p class="text-muted-foreground text-sm">No debug information available'), nn = /* @__PURE__ */ v('<div class="min-w-0 shrink-0">'), rn = /* @__PURE__ */ v('<div class="flex items-center gap-2"><div class="flex h-8 items-center rounded-lg border border-border/50 bg-muted/30 p-0.5">'), an = /* @__PURE__ */ v('<div class="min-h-0 flex-1 overflow-y-auto [scrollbar-gutter:stable]">'), on = /* @__PURE__ */ v('<div class="flex shrink-0 items-center justify-end gap-2 border-border/50 border-t pt-3">');
+function sn(t) {
   return (() => {
-    var e = Ue();
-    return e.$$click = () => t.onClick(), f(e, W(K, {
+    var e = Ke();
+    return e.$$click = () => t.onClick(), h(e, V(J, {
       get when() {
         return t.isActive;
       },
       get children() {
-        var n = je();
-        return f(n, () => t.icon), n;
+        var n = Xe();
+        return h(n, () => t.icon), n;
       }
-    }), null), f(e, () => t.label, null), C(() => w(e, y("flex cursor-pointer items-center justify-center rounded-md px-3 py-1.5 text-xs transition-all duration-300 ease-in-out", t.isActive ? "gap-1.5 bg-foreground/10 font-semibold text-foreground shadow-sm" : "gap-0 text-muted-foreground hover:bg-foreground/5 hover:text-foreground"))), e;
+    }), null), h(e, () => t.label, null), M(() => k(e, $("flex cursor-pointer items-center justify-center rounded-md px-3 py-1.5 text-xs transition-all duration-300 ease-in-out", t.isActive ? "gap-1.5 bg-foreground/10 font-semibold text-foreground shadow-sm" : "gap-0 text-muted-foreground hover:bg-foreground/5 hover:text-foreground"))), e;
   })();
 }
-function Wn(t) {
-  const [e] = $t(t, ["open", "onOpenChange", "title", "onSave", "hasUnsavedChanges", "onDelete", "editContent", "controlsContent", "debugContent", "debugData", "tabs", "class", "maxWidth", "defaultTab", "headerActions", "ResponsiveDialog", "ResponsiveDialogContent", "ResponsiveDialogHeader", "ResponsiveDialogTitle", "ResponsiveDialogDescription", "Button"]), [n, i] = j(e.defaultTab ?? "controls"), r = () => {
-    const s = e.maxWidth ?? "3xl";
+function jn(t) {
+  const [e] = St(t, ["open", "onOpenChange", "title", "onSave", "hasUnsavedChanges", "onDelete", "editContent", "controlsContent", "debugContent", "debugData", "tabs", "class", "maxWidth", "defaultTab", "headerActions", "configSchema", "config", "onConfigSave", "ResponsiveDialog", "ResponsiveDialogContent", "ResponsiveDialogHeader", "ResponsiveDialogTitle", "ResponsiveDialogDescription", "Button", "SchemaForm"]), n = () => !!e.configSchema && !!e.config && !!e.onConfigSave && !!e.SchemaForm, [i, r] = L({}), [a, o] = L(null);
+  Y(gt(() => e.config, (g) => {
+    g && r({
+      ...g
+    });
+  })), Y(gt(() => e.configSchema, (g) => {
+    g && o(bt(g));
+  }));
+  const s = () => n() && JSON.stringify(i()) !== JSON.stringify(e.config), l = (g) => {
+    !g && e.config && r({
+      ...e.config
+    }), e.onOpenChange(g);
+  }, m = () => {
+    e.onConfigSave?.(i());
+  }, [d, x] = L(e.defaultTab ?? "controls"), p = () => {
+    const g = e.maxWidth ?? "3xl";
     return {
       sm: "max-w-sm",
       md: "max-w-md",
@@ -1225,125 +1255,141 @@ function Wn(t) {
       "2xl": "max-w-2xl",
       "3xl": "max-w-3xl",
       "4xl": "max-w-4xl"
-    }[s];
-  }, a = () => {
+    }[g];
+  }, c = () => {
     if (e.tabs) return e.tabs;
-    const s = [];
-    return s.push({
+    const g = [];
+    return g.push({
       id: "edit",
       label: "Edit",
-      icon: Fe(),
-      content: e.editContent ?? Ye()
-    }), s.push({
+      icon: qe(),
+      content: e.editContent ?? (n() && a() ? V(z, {
+        get schema() {
+          return a();
+        },
+        get data() {
+          return i();
+        },
+        onChange: r
+      }) : Je())
+    }), g.push({
       id: "controls",
       label: "Controls",
-      icon: Xe(),
-      content: e.controlsContent ?? Ke()
-    }), s.push({
+      icon: Ze(),
+      content: e.controlsContent ?? Qe()
+    }), g.push({
       id: "debug",
       label: "Debug",
-      icon: qe(),
-      content: e.debugContent ?? Ze()
-    }), s;
-  }, o = async () => {
+      icon: tn(),
+      content: e.debugContent ?? en()
+    }), g;
+  }, u = async () => {
     if (e.debugData !== void 0)
       try {
-        const s = typeof e.debugData == "string" ? e.debugData : JSON.stringify(e.debugData, null, 2);
-        await navigator.clipboard.writeText(s);
+        const g = typeof e.debugData == "string" ? e.debugData : JSON.stringify(e.debugData, null, 2);
+        await navigator.clipboard.writeText(g);
       } catch {
       }
-  }, l = () => {
-    const s = a();
-    return s.find((v) => v.id === n())?.content ?? s[0]?.content;
-  }, c = e.ResponsiveDialog, g = e.ResponsiveDialogContent, d = e.ResponsiveDialogHeader, h = e.ResponsiveDialogTitle, k = e.ResponsiveDialogDescription, u = e.Button;
-  return W(c, {
+  }, b = () => {
+    const g = c();
+    return g.find((H) => H.id === d())?.content ?? g[0]?.content;
+  }, y = e.ResponsiveDialog, O = e.ResponsiveDialogContent, P = e.ResponsiveDialogHeader, w = e.ResponsiveDialogTitle, N = e.ResponsiveDialogDescription, T = e.Button, z = e.SchemaForm, S = (g) => n() ? l(g) : e.onOpenChange(g), E = () => n() ? s() : e.hasUnsavedChanges, I = () => n() ? m : e.onSave;
+  return V(y, {
     get open() {
       return e.open;
     },
-    get onOpenChange() {
-      return e.onOpenChange;
-    },
+    onOpenChange: (g) => S(g),
     get children() {
-      return W(g, {
+      return V(O, {
         get class() {
-          return y(r(), e.class);
+          return $(p(), e.class);
         },
         get children() {
-          return [W(d, {
+          return [V(P, {
             class: "flex flex-row items-center justify-between gap-3",
             get children() {
               return [(() => {
-                var s = Qe();
-                return f(s, W(h, {
+                var g = nn();
+                return h(g, V(w, {
                   class: "truncate leading-tight",
                   get children() {
                     return e.title;
                   }
-                }), null), f(s, W(k, {
+                }), null), h(g, V(N, {
                   class: "sr-only",
                   children: "Widget configuration dialog"
-                }), null), s;
+                }), null), g;
               })(), (() => {
-                var s = Je(), b = s.firstChild;
-                return f(b, () => a().map((v) => W(nn, {
+                var g = rn(), R = g.firstChild;
+                return h(R, () => c().map((H) => V(sn, {
                   get icon() {
-                    return v.icon;
+                    return H.icon;
                   },
                   get label() {
-                    return v.label;
+                    return H.label;
                   },
                   get isActive() {
-                    return n() === v.id;
+                    return d() === H.id;
                   },
-                  onClick: () => i(v.id)
-                }))), f(s, W(K, {
+                  onClick: () => x(H.id)
+                }))), h(g, V(J, {
                   get when() {
                     return e.headerActions;
                   },
                   get children() {
                     return e.headerActions;
                   }
-                }), null), f(s, W(K, {
-                  get when() {
-                    return D(() => !!(n() === "edit" && e.onSave))() && e.hasUnsavedChanges;
-                  },
-                  get children() {
-                    return W(u, {
-                      size: "sm",
-                      onClick: () => e.onSave?.(),
-                      children: "Save"
-                    });
-                  }
-                }), null), f(s, W(K, {
-                  get when() {
-                    return D(() => n() === "edit")() && e.onDelete;
-                  },
-                  get children() {
-                    return W(u, {
-                      size: "sm",
-                      variant: "destructive",
-                      onClick: () => e.onDelete?.(),
-                      children: "Delete"
-                    });
-                  }
-                }), null), s;
+                }), null), g;
               })()];
             }
           }), (() => {
-            var s = tn();
-            return f(s, l), s;
-          })(), W(K, {
+            var g = an();
+            return h(g, b), g;
+          })(), V(J, {
             get when() {
-              return D(() => n() === "debug")() && e.debugData !== void 0;
+              return _(() => d() === "edit")() && (I() || e.onDelete) || d() === "debug" && e.debugData !== void 0;
             },
             get children() {
-              var s = en();
-              return f(s, W(u, {
-                size: "sm",
-                variant: "outline",
-                onClick: o,
-                children: "Copy"
-              })), s;
+              var g = on();
+              return h(g, V(J, {
+                get when() {
+                  return _(() => d() === "edit")() && e.onDelete;
+                },
+                get children() {
+                  return V(T, {
+                    size: "sm",
+                    variant: "destructive",
+                    onClick: () => e.onDelete?.(),
+                    children: "Delete"
+                  });
+                }
+              }), null), h(g, V(J, {
+                get when() {
+                  return _(() => d() === "edit")() && I();
+                },
+                get children() {
+                  return V(T, {
+                    size: "sm",
+                    get disabled() {
+                      return !E();
+                    },
+                    onClick: () => I()?.(),
+                    children: "Save"
+                  });
+                }
+              }), null), h(g, V(J, {
+                get when() {
+                  return _(() => d() === "debug")() && e.debugData !== void 0;
+                },
+                get children() {
+                  return V(T, {
+                    size: "sm",
+                    variant: "outline",
+                    onClick: u,
+                    children: "Copy"
+                  });
+                }
+              }), null), g;
             }
           })];
         }
@@ -1351,80 +1397,80 @@ function Wn(t) {
     }
   });
 }
-pt(["click"]);
-const Z = 32, m = Z / 2, B = "white", et = "rgba(0,0,0,0.4)", ct = 2, nt = 3;
-function rn(t) {
+Mt(["click"]);
+const Q = 32, f = Q / 2, B = "white", nt = "rgba(0,0,0,0.4)", ut = 2, rt = 3;
+function ln(t) {
   return `url("data:image/svg+xml,${encodeURIComponent(t)}")`;
 }
-function rt(t) {
-  return `<svg xmlns="http://www.w3.org/2000/svg" width="${Z}" height="${Z}" viewBox="0 0 ${Z} ${Z}">${t}</svg>`;
+function it(t) {
+  return `<svg xmlns="http://www.w3.org/2000/svg" width="${Q}" height="${Q}" viewBox="0 0 ${Q} ${Q}">${t}</svg>`;
 }
-const an = rt(`
+const cn = it(`
   <g transform="translate(6, 2)">
     <!-- shadow -->
-    <g stroke="${et}" stroke-width="${nt}" fill="none" stroke-linecap="round" stroke-linejoin="round">
+    <g stroke="${nt}" stroke-width="${rt}" fill="none" stroke-linecap="round" stroke-linejoin="round">
       <path d="M10 8V3a2 2 0 0 1 4 0v10l4.5-4.5a2 2 0 0 1 2.83 2.83L14 18.5c-2 2-4 3.5-8 3.5-3 0-5-2-5-5v-6a2 2 0 0 1 4 0v2"/>
     </g>
     <!-- main -->
-    <g stroke="${B}" stroke-width="${ct}" fill="none" stroke-linecap="round" stroke-linejoin="round">
+    <g stroke="${B}" stroke-width="${ut}" fill="none" stroke-linecap="round" stroke-linejoin="round">
       <path d="M10 8V3a2 2 0 0 1 4 0v10l4.5-4.5a2 2 0 0 1 2.83 2.83L14 18.5c-2 2-4 3.5-8 3.5-3 0-5-2-5-5v-6a2 2 0 0 1 4 0v2"/>
     </g>
   </g>
-`), on = rt(`
+`), un = it(`
   <g>
-    <circle cx="${m}" cy="${m}" r="8" stroke="${et}" stroke-width="${nt}" fill="none"/>
-    <circle cx="${m}" cy="${m}" r="8" stroke="${B}" stroke-width="1.5" fill="none"/>
-    <circle cx="${m}" cy="${m}" r="1.5" fill="${B}"/>
+    <circle cx="${f}" cy="${f}" r="8" stroke="${nt}" stroke-width="${rt}" fill="none"/>
+    <circle cx="${f}" cy="${f}" r="8" stroke="${B}" stroke-width="1.5" fill="none"/>
+    <circle cx="${f}" cy="${f}" r="1.5" fill="${B}"/>
   </g>
-`), sn = rt(`
+`), dn = it(`
   <g>
     <!-- shadow -->
-    <g stroke="${et}" stroke-width="${nt}" fill="none" stroke-linecap="round" stroke-linejoin="round">
-      <line x1="6" y1="${m}" x2="26" y2="${m}"/>
-      <polyline points="10,${m - 4} 6,${m} 10,${m + 4}"/>
-      <polyline points="22,${m - 4} 26,${m} 22,${m + 4}"/>
+    <g stroke="${nt}" stroke-width="${rt}" fill="none" stroke-linecap="round" stroke-linejoin="round">
+      <line x1="6" y1="${f}" x2="26" y2="${f}"/>
+      <polyline points="10,${f - 4} 6,${f} 10,${f + 4}"/>
+      <polyline points="22,${f - 4} 26,${f} 22,${f + 4}"/>
     </g>
     <!-- main -->
-    <g stroke="${B}" stroke-width="${ct}" fill="none" stroke-linecap="round" stroke-linejoin="round">
-      <line x1="6" y1="${m}" x2="26" y2="${m}"/>
-      <polyline points="10,${m - 4} 6,${m} 10,${m + 4}"/>
-      <polyline points="22,${m - 4} 26,${m} 22,${m + 4}"/>
+    <g stroke="${B}" stroke-width="${ut}" fill="none" stroke-linecap="round" stroke-linejoin="round">
+      <line x1="6" y1="${f}" x2="26" y2="${f}"/>
+      <polyline points="10,${f - 4} 6,${f} 10,${f + 4}"/>
+      <polyline points="22,${f - 4} 26,${f} 22,${f + 4}"/>
     </g>
     <!-- center grip dots -->
-    <circle cx="${m}" cy="${m}" r="1.5" fill="${B}"/>
-    <circle cx="${m - 5}" cy="${m}" r="1" fill="${B}" opacity="0.6"/>
-    <circle cx="${m + 5}" cy="${m}" r="1" fill="${B}" opacity="0.6"/>
+    <circle cx="${f}" cy="${f}" r="1.5" fill="${B}"/>
+    <circle cx="${f - 5}" cy="${f}" r="1" fill="${B}" opacity="0.6"/>
+    <circle cx="${f + 5}" cy="${f}" r="1" fill="${B}" opacity="0.6"/>
   </g>
-`), ln = rt(`
+`), gn = it(`
   <g>
     <!-- shadow -->
-    <g stroke="${et}" stroke-width="${nt}" fill="none" stroke-linecap="round" stroke-linejoin="round">
-      <line x1="${m}" y1="6" x2="${m}" y2="26"/>
-      <polyline points="${m - 4},10 ${m},6 ${m + 4},10"/>
-      <polyline points="${m - 4},22 ${m},26 ${m + 4},22"/>
+    <g stroke="${nt}" stroke-width="${rt}" fill="none" stroke-linecap="round" stroke-linejoin="round">
+      <line x1="${f}" y1="6" x2="${f}" y2="26"/>
+      <polyline points="${f - 4},10 ${f},6 ${f + 4},10"/>
+      <polyline points="${f - 4},22 ${f},26 ${f + 4},22"/>
     </g>
     <!-- main -->
-    <g stroke="${B}" stroke-width="${ct}" fill="none" stroke-linecap="round" stroke-linejoin="round">
-      <line x1="${m}" y1="6" x2="${m}" y2="26"/>
-      <polyline points="${m - 4},10 ${m},6 ${m + 4},10"/>
-      <polyline points="${m - 4},22 ${m},26 ${m + 4},22"/>
+    <g stroke="${B}" stroke-width="${ut}" fill="none" stroke-linecap="round" stroke-linejoin="round">
+      <line x1="${f}" y1="6" x2="${f}" y2="26"/>
+      <polyline points="${f - 4},10 ${f},6 ${f + 4},10"/>
+      <polyline points="${f - 4},22 ${f},26 ${f + 4},22"/>
     </g>
     <!-- center grip dots -->
-    <circle cx="${m}" cy="${m}" r="1.5" fill="${B}"/>
-    <circle cx="${m}" cy="${m - 5}" r="1" fill="${B}" opacity="0.6"/>
-    <circle cx="${m}" cy="${m + 5}" r="1" fill="${B}" opacity="0.6"/>
+    <circle cx="${f}" cy="${f}" r="1.5" fill="${B}"/>
+    <circle cx="${f}" cy="${f - 5}" r="1" fill="${B}" opacity="0.6"/>
+    <circle cx="${f}" cy="${f + 5}" r="1" fill="${B}" opacity="0.6"/>
   </g>
 `);
-function J(t, e, n) {
-  return { css: `${rn(t)} ${e} ${n}, auto`, hotspotX: e, hotspotY: n };
-}
-const Y = {
-  tap: J(an, 12, 4),
-  hold: J(on, 16, 16),
-  slideHorizontal: J(sn, m, m),
-  slideVertical: J(ln, m, m)
+function tt(t, e, n) {
+  return { css: `${ln(t)} ${e} ${n}, auto`, hotspotX: e, hotspotY: n };
+}
+const K = {
+  tap: tt(cn, 12, 4),
+  hold: tt(un, 16, 16),
+  slideHorizontal: tt(dn, f, f),
+  slideVertical: tt(gn, f, f)
 };
-function In(t, e) {
+function Pn(t, e) {
   const n = {
     isDown: !1,
     startX: 0,
@@ -1440,79 +1486,79 @@ function In(t, e) {
     element: null
   }, i = 10, r = 5, a = () => {
     n.holdTimer && (clearTimeout(n.holdTimer), n.holdTimer = null), n.slideActivationTimer && (clearTimeout(n.slideActivationTimer), n.slideActivationTimer = null);
-  }, o = (u) => {
+  }, o = (c) => {
     const b = t().slide;
     if (b?.orientation === "horizontal") return "horizontal";
     if (b?.orientation === "vertical") return "vertical";
-    if (u) {
-      const T = u.getBoundingClientRect();
-      return T.height > T.width ? "vertical" : "horizontal";
+    if (c) {
+      const O = c.getBoundingClientRect();
+      return O.height > O.width ? "vertical" : "horizontal";
     }
     return (e?.() ?? "horizontal") === "horizontal" ? "horizontal" : "vertical";
-  }, l = (u) => {
-    const s = t();
-    if (!(!s.tap && !s.hold && !s.slide)) {
-      if (u.preventDefault(), n.isDown = !0, n.element = u.currentTarget, n.startX = u.clientX, n.startY = u.clientY, n.currentX = u.clientX, n.currentY = u.clientY, n.startTime = Date.now(), n.hasMoved = !1, n.slideActive = !1, n.lockedAxis = null, u.currentTarget.setPointerCapture(u.pointerId), s.hold) {
-        const b = s.hold.delay ?? 300;
+  }, s = (c) => {
+    const u = t();
+    if (!(!u.tap && !u.hold && !u.slide)) {
+      if (c.preventDefault(), n.isDown = !0, n.element = c.currentTarget, n.startX = c.clientX, n.startY = c.clientY, n.currentX = c.clientX, n.currentY = c.clientY, n.startTime = Date.now(), n.hasMoved = !1, n.slideActive = !1, n.lockedAxis = null, c.currentTarget.setPointerCapture(c.pointerId), u.hold) {
+        const b = u.hold.delay ?? 300;
         n.holdTimer = setTimeout(() => {
-          n.isDown && !n.hasMoved && (s.hold.action(), n.isDown = !1);
+          n.isDown && !n.hasMoved && (u.hold.action(), n.isDown = !1);
         }, b);
       }
-      if (s.slide) {
-        const b = s.slide.activationDelay ?? 0;
+      if (u.slide) {
+        const b = u.slide.activationDelay ?? 0;
         b > 0 ? n.slideActivationTimer = setTimeout(() => {
           n.slideActive = !0;
         }, b) : n.slideActive = !0;
       }
     }
-  }, c = (u) => {
+  }, l = (c) => {
     if (!n.isDown) return;
-    const s = t();
-    n.currentX = u.clientX, n.currentY = u.clientY;
-    const b = n.currentX - n.startX, v = n.currentY - n.startY, T = Math.abs(b), U = Math.abs(v), $ = Math.sqrt(b * b + v * v), A = u.currentTarget, E = o(A);
-    if (!n.lockedAxis && $ > r && (T > U ? n.lockedAxis = "horizontal" : n.lockedAxis = "vertical", s.slide && n.lockedAxis !== E)) {
-      A.releasePointerCapture(u.pointerId), n.isDown = !1, n.slideActive = !1, a();
+    const u = t();
+    n.currentX = c.clientX, n.currentY = c.clientY;
+    const b = n.currentX - n.startX, y = n.currentY - n.startY, O = Math.abs(b), P = Math.abs(y), w = Math.sqrt(b * b + y * y), N = c.currentTarget, T = o(N);
+    if (!n.lockedAxis && w > r && (O > P ? n.lockedAxis = "horizontal" : n.lockedAxis = "vertical", u.slide && n.lockedAxis !== T)) {
+      N.releasePointerCapture(c.pointerId), n.isDown = !1, n.slideActive = !1, a();
       return;
     }
-    if ($ > i && (n.hasMoved = !0, a()), s.slide && n.slideActive && n.hasMoved && n.lockedAxis === E) {
-      const _ = s.slide.min ?? 0, S = s.slide.max ?? 100, O = S - _, I = E === "vertical" ? -v : b, V = E === "vertical" ? u.currentTarget.clientHeight : u.currentTarget.clientWidth, Q = I / V * O, yt = Math.max(_, Math.min(S, s.slide.value + Q));
-      s.slide.onChange(Math.round(yt)), n.startX = n.currentX, n.startY = n.currentY, u.preventDefault();
+    if (w > i && (n.hasMoved = !0, a()), u.slide && n.slideActive && n.hasMoved && n.lockedAxis === T) {
+      const z = u.slide.min ?? 0, S = u.slide.max ?? 100, E = S - z, I = T === "vertical" ? -y : b, g = T === "vertical" ? c.currentTarget.clientHeight : c.currentTarget.clientWidth, H = I / g * E, kt = Math.max(z, Math.min(S, u.slide.value + H));
+      u.slide.onChange(Math.round(kt)), n.startX = n.currentX, n.startY = n.currentY, c.preventDefault();
     }
-  }, g = (u) => {
+  }, m = (c) => {
     if (!n.isDown) return;
-    const s = t(), b = s.hold?.delay ?? 300;
-    if (a(), s.tap && !n.hasMoved) {
-      const v = Date.now() - n.startTime;
-      n.isDown && v < b && s.tap();
+    const u = t(), b = u.hold?.delay ?? 300;
+    if (a(), u.tap && !n.hasMoved) {
+      const y = Date.now() - n.startTime;
+      n.isDown && y < b && u.tap();
     }
-    n.isDown = !1, n.hasMoved = !1, n.slideActive = !1, n.lockedAxis = null, u.currentTarget.releasePointerCapture(u.pointerId);
-  }, d = (u) => {
-    a(), n.isDown = !1, n.hasMoved = !1, n.slideActive = !1, n.lockedAxis = null, u.currentTarget.releasePointerCapture(u.pointerId);
-  }, h = (u) => {
-    const s = t();
-    if (s.slide) {
-      const b = s.slide.orientation;
-      if (b === "horizontal") return Y.slideHorizontal.css;
-      if (b === "vertical") return Y.slideVertical.css;
-      const v = u.getBoundingClientRect();
-      return v.height > v.width ? Y.slideVertical.css : Y.slideHorizontal.css;
+    n.isDown = !1, n.hasMoved = !1, n.slideActive = !1, n.lockedAxis = null, c.currentTarget.releasePointerCapture(c.pointerId);
+  }, d = (c) => {
+    a(), n.isDown = !1, n.hasMoved = !1, n.slideActive = !1, n.lockedAxis = null, c.currentTarget.releasePointerCapture(c.pointerId);
+  }, x = (c) => {
+    const u = t();
+    if (u.slide) {
+      const b = u.slide.orientation;
+      if (b === "horizontal") return K.slideHorizontal.css;
+      if (b === "vertical") return K.slideVertical.css;
+      const y = c.getBoundingClientRect();
+      return y.height > y.width ? K.slideVertical.css : K.slideHorizontal.css;
     }
-    return s.tap ? Y.tap.css : s.hold ? Y.hold.css : "";
+    return u.tap ? K.tap.css : u.hold ? K.hold.css : "";
   };
   return {
-    onPointerDown: l,
-    onPointerMove: c,
-    onPointerUp: g,
+    onPointerDown: s,
+    onPointerMove: l,
+    onPointerUp: m,
     onPointerCancel: d,
-    onPointerEnter: (u) => {
-      const s = u.currentTarget;
-      n.element = s, s.style.cursor = h(s);
+    onPointerEnter: (c) => {
+      const u = c.currentTarget;
+      n.element = u, u.style.cursor = x(u);
     },
     dispose: a
   };
 }
-function Rn(t) {
-  return z(() => {
+function Fn(t) {
+  return A(() => {
     const e = t.entities();
     if (e.length === 0) return;
     const n = {
@@ -1533,14 +1579,14 @@ function Rn(t) {
     return t.additionalData && Object.assign(n, t.additionalData), n;
   });
 }
-function Gn(t = {}) {
-  const [e, n] = j(!1), [i, r] = j(!1);
+function Un(t = {}) {
+  const [e, n] = L(!1), [i, r] = L(!1);
   return {
-    save: async (l) => {
+    save: async (s) => {
       if (t.onSave) {
         n(!0);
         try {
-          await t.onSave(l), t.onSaveSuccess?.();
+          await t.onSave(s), t.onSaveSuccess?.();
         } finally {
           n(!1);
         }
@@ -1560,8 +1606,8 @@ function Gn(t = {}) {
     isDeleting: i
   };
 }
-function Bn(t = "edit") {
-  const [e, n] = j(!1), [i, r] = j(t);
+function Yn(t = "edit") {
+  const [e, n] = L(!1), [i, r] = L(t);
   return {
     showDialog: e,
     setShowDialog: n,
@@ -1571,11 +1617,11 @@ function Bn(t = "edit") {
     setActiveTab: r
   };
 }
-function Hn(t) {
-  const e = z(() => t.entity() !== null), n = z(() => {
+function Xn(t) {
+  const e = A(() => t.entity() !== null), n = A(() => {
     const r = t.entity();
     return r ? t.calculateData(r) : null;
-  }), i = z(() => e() ? void 0 : t.emptyStateConfig);
+  }), i = A(() => e() ? void 0 : t.emptyStateConfig);
   return {
     entity: t.entity,
     data: n,
@@ -1583,19 +1629,19 @@ function Hn(t) {
     hasEntity: e
   };
 }
-function Ln(t) {
-  const e = t.minEntities ?? 1, n = z(() => t.entities().length), i = z(() => n() >= e), r = z(() => !i() || !t.calculateGroupData ? null : t.calculateGroupData(t.entities())), a = z(() => {
+function Kn(t) {
+  const e = t.minEntities ?? 1, n = A(() => t.entities().length), i = A(() => n() >= e), r = A(() => !i() || !t.calculateGroupData ? null : t.calculateGroupData(t.entities())), a = A(() => {
     if (!i()) return;
-    const l = t.aggregationMode?.();
-    if (!l || l === "none") return;
-    const c = t.entities();
-    if (l === "light" || l === "binary-sensor" || l === "switch")
-      return we(c, t.allEntitiesMode);
-    if (l === "sensor") {
-      const g = t.sensorGroupType?.() ?? "mean";
-      return $e(c, g, !0);
+    const s = t.aggregationMode?.();
+    if (!s || s === "none") return;
+    const l = t.entities();
+    if (s === "light" || s === "binary-sensor" || s === "switch")
+      return Se(l, t.allEntitiesMode);
+    if (s === "sensor") {
+      const m = t.sensorGroupType?.() ?? "mean";
+      return Ce(l, m, !0);
     }
-  }), o = z(() => i() ? void 0 : t.emptyStateConfig);
+  }), o = A(() => i() ? void 0 : t.emptyStateConfig);
   return {
     entities: t.entities,
     groupData: r,
@@ -1605,11 +1651,11 @@ function Ln(t) {
     count: n
   };
 }
-function Pn(t) {
-  const [e] = zt({
-    validate: Dt(t.schema),
+function qn(t) {
+  const [e] = At({
+    validate: Nt(t.schema),
     initialValues: t.initialValues
-  }), n = z(() => e.dirty), i = z(() => e.submitting);
+  }), n = A(() => e.dirty), i = A(() => e.submitting);
   return {
     form: e,
     isDirty: n,
@@ -1617,41 +1663,41 @@ function Pn(t) {
     handleSubmit: (a) => {
       t.onSubmit?.(a);
     },
-    getValue: Nt,
-    setValue: At,
-    reset: _t
+    getValue: Et,
+    setValue: Ot,
+    reset: Tt
   };
 }
-const it = ["xs", "sm", "md", "lg", "xl"];
-function jn() {
-  const t = G(), e = z(() => it.indexOf(t.size())), n = z(() => {
-    const c = t.size();
-    return c === "xs" || c === "sm";
-  }), i = z(() => {
-    const c = t.size();
-    return c === "lg" || c === "xl";
-  }), r = z(() => e() >= 2);
+const at = ["xs", "sm", "md", "lg", "xl"];
+function Jn() {
+  const t = G(), e = A(() => at.indexOf(t.size())), n = A(() => {
+    const l = t.size();
+    return l === "xs" || l === "sm";
+  }), i = A(() => {
+    const l = t.size();
+    return l === "lg" || l === "xl";
+  }), r = A(() => e() >= 2);
   return {
     isCompact: n,
     isLarge: i,
     showDetail: r,
-    showOn: (c) => c.includes(t.size()),
-    hideOn: (c) => !c.includes(t.size()),
-    matches: (c) => {
-      const g = c.trim();
-      if (g.endsWith("+")) {
-        const d = g.slice(0, -1), h = it.indexOf(d);
-        return h >= 0 && e() >= h;
+    showOn: (l) => l.includes(t.size()),
+    hideOn: (l) => !l.includes(t.size()),
+    matches: (l) => {
+      const m = l.trim();
+      if (m.endsWith("+")) {
+        const d = m.slice(0, -1), x = at.indexOf(d);
+        return x >= 0 && e() >= x;
       }
-      if (g.endsWith("-")) {
-        const d = g.slice(0, -1), h = it.indexOf(d);
-        return h >= 0 && e() <= h;
+      if (m.endsWith("-")) {
+        const d = m.slice(0, -1), x = at.indexOf(d);
+        return x >= 0 && e() <= x;
       }
-      return t.size() === g;
+      return t.size() === m;
     }
   };
 }
-const M = {
+const D = {
   ocean: "bg-gradient-to-br from-cyan-600/20 to-blue-700/20",
   sunset: "bg-gradient-to-br from-orange-500/20 to-purple-700/20",
   forest: "bg-gradient-to-br from-emerald-600/20 to-teal-700/20",
@@ -1669,7 +1715,7 @@ const M = {
   sage: "bg-gradient-to-br from-lime-600/20 to-green-600/20",
   copper: "bg-gradient-to-br from-amber-600/20 to-amber-800/20",
   dusk: "bg-gradient-to-br from-blue-500/20 to-purple-600/20"
-}, Un = {
+}, Zn = {
   ocean: "Ocean Breeze",
   sunset: "Sunset Glow",
   forest: "Forest Dawn",
@@ -1687,30 +1733,30 @@ const M = {
   sage: "Sage",
   copper: "Copper",
   dusk: "Dusk"
-}, Fn = Object.keys(M);
-function ft(t) {
-  const e = Object.keys(M);
+}, Qn = Object.keys(D);
+function xt(t) {
+  const e = Object.keys(D);
   let n = 0;
   for (const r of t)
     n = (n << 5) - n + r.charCodeAt(0), n = n & n;
   const i = Math.abs(n) % e.length;
   return e[i];
 }
-function Yn(t, e) {
+function tr(t, e) {
   if (!t) {
-    const i = ft(e);
-    return M[i];
+    const i = xt(e);
+    return D[i];
   }
-  if (typeof t == "string" && t in M)
-    return M[t];
+  if (typeof t == "string" && t in D)
+    return D[t];
   if (typeof t == "string")
     return t;
-  const n = ft(e);
-  return M[n];
+  const n = xt(e);
+  return D[n];
 }
-const X = {
+const q = {
   ocean: {
-    gradient: M.ocean,
+    gradient: D.ocean,
     bg: "bg-cyan-600/20",
     icon: "bg-cyan-500 dark:bg-cyan-400",
     glow: "shadow-cyan-500/50 dark:shadow-cyan-400/50",
@@ -1720,7 +1766,7 @@ const X = {
     }
   },
   sunset: {
-    gradient: M.sunset,
+    gradient: D.sunset,
     bg: "bg-orange-500/20",
     icon: "bg-orange-500 dark:bg-orange-400",
     glow: "shadow-orange-500/50 dark:shadow-orange-400/50",
@@ -1730,7 +1776,7 @@ const X = {
     }
   },
   forest: {
-    gradient: M.forest,
+    gradient: D.forest,
     bg: "bg-emerald-600/20",
     icon: "bg-emerald-500 dark:bg-emerald-400",
     glow: "shadow-emerald-500/50 dark:shadow-emerald-400/50",
@@ -1740,7 +1786,7 @@ const X = {
     }
   },
   lavender: {
-    gradient: M.lavender,
+    gradient: D.lavender,
     bg: "bg-purple-500/20",
     icon: "bg-purple-500 dark:bg-purple-400",
     glow: "shadow-purple-500/50 dark:shadow-purple-400/50",
@@ -1750,7 +1796,7 @@ const X = {
     }
   },
   golden: {
-    gradient: M.golden,
+    gradient: D.golden,
     bg: "bg-yellow-500/20",
     icon: "bg-yellow-500 dark:bg-yellow-400",
     glow: "shadow-yellow-500/50 dark:shadow-yellow-400/50",
@@ -1760,7 +1806,7 @@ const X = {
     }
   },
   midnight: {
-    gradient: M.midnight,
+    gradient: D.midnight,
     bg: "bg-blue-700/20",
     icon: "bg-blue-700 dark:bg-blue-600",
     glow: "shadow-blue-700/50 dark:shadow-blue-600/50",
@@ -1770,7 +1816,7 @@ const X = {
     }
   },
   rose: {
-    gradient: M.rose,
+    gradient: D.rose,
     bg: "bg-pink-400/20",
     icon: "bg-pink-500 dark:bg-pink-400",
     glow: "shadow-pink-500/50 dark:shadow-pink-400/50",
@@ -1780,7 +1826,7 @@ const X = {
     }
   },
   mint: {
-    gradient: M.mint,
+    gradient: D.mint,
     bg: "bg-green-400/20",
     icon: "bg-green-500 dark:bg-green-400",
     glow: "shadow-green-500/50 dark:shadow-green-400/50",
@@ -1790,7 +1836,7 @@ const X = {
     }
   },
   slate: {
-    gradient: M.slate,
+    gradient: D.slate,
     bg: "bg-slate-600/20",
     icon: "bg-slate-600 dark:bg-slate-500",
     glow: "shadow-slate-600/50 dark:shadow-slate-500/50",
@@ -1800,7 +1846,7 @@ const X = {
     }
   },
   coral: {
-    gradient: M.coral,
+    gradient: D.coral,
     bg: "bg-pink-300/20",
     icon: "bg-pink-400 dark:bg-pink-300",
     glow: "shadow-pink-400/50 dark:shadow-pink-300/50",
@@ -1810,7 +1856,7 @@ const X = {
     }
   },
   aurora: {
-    gradient: M.aurora,
+    gradient: D.aurora,
     bg: "bg-blue-500/20",
     icon: "bg-blue-500 dark:bg-blue-400",
     glow: "shadow-blue-500/50 dark:shadow-blue-400/50",
@@ -1820,7 +1866,7 @@ const X = {
     }
   },
   ember: {
-    gradient: M.ember,
+    gradient: D.ember,
     bg: "bg-red-500/20",
     icon: "bg-red-500 dark:bg-red-400",
     glow: "shadow-red-500/50 dark:shadow-red-400/50",
@@ -1830,7 +1876,7 @@ const X = {
     }
   },
   steel: {
-    gradient: M.steel,
+    gradient: D.steel,
     bg: "bg-gray-500/20",
     icon: "bg-gray-500 dark:bg-gray-400",
     glow: void 0,
@@ -1840,7 +1886,7 @@ const X = {
     }
   },
   twilight: {
-    gradient: M.twilight,
+    gradient: D.twilight,
     bg: "bg-violet-600/20",
     icon: "bg-violet-500 dark:bg-violet-400",
     glow: "shadow-violet-500/50 dark:shadow-violet-400/50",
@@ -1850,7 +1896,7 @@ const X = {
     }
   },
   sage: {
-    gradient: M.sage,
+    gradient: D.sage,
     bg: "bg-lime-600/20",
     icon: "bg-lime-500 dark:bg-lime-400",
     glow: "shadow-lime-500/50 dark:shadow-lime-400/50",
@@ -1860,7 +1906,7 @@ const X = {
     }
   },
   copper: {
-    gradient: M.copper,
+    gradient: D.copper,
     bg: "bg-amber-600/20",
     icon: "bg-amber-600 dark:bg-amber-500",
     glow: "shadow-amber-600/50 dark:shadow-amber-500/50",
@@ -1870,7 +1916,7 @@ const X = {
     }
   },
   dusk: {
-    gradient: M.dusk,
+    gradient: D.dusk,
     bg: "bg-blue-500/20",
     icon: "bg-blue-500 dark:bg-blue-400",
     glow: "shadow-blue-500/50 dark:shadow-blue-400/50",
@@ -1879,102 +1925,116 @@ const X = {
       muted: "text-blue-400/60 dark:text-blue-300/60"
     }
   }
-}, Xn = {
-  unavailable: X.steel,
-  active: X.ocean,
-  inactive: X.steel,
-  success: X.forest,
-  warning: X.ember,
-  error: X.rose
+}, er = {
+  unavailable: q.steel,
+  active: q.ocean,
+  inactive: q.steel,
+  success: q.forest,
+  warning: q.ember,
+  error: q.rose
+}, nr = {
+  /** Optional display name override (renders as text input) */
+  title: () => X.string().optional().meta({ title: "Title", description: "Optional display name override" }),
+  /** Multi-select entity picker for a HA domain */
+  entityIds: (t) => X.array(X.string()).default([]).meta({ domain: t, title: "Entities" }),
+  /** Single-select entity picker for a HA domain */
+  singleEntity: (t) => X.array(X.string()).default([]).meta({ domain: t, title: "Entity", singleSelect: !0 }),
+  /** Area picker dropdown */
+  areaId: () => X.string().optional().meta({ formType: "area-picker", title: "Area" })
 };
-let at = null;
-function cn() {
-  return at || (at = getComputedStyle(document.documentElement)), at;
+let ot = null;
+function mn() {
+  return ot || (ot = getComputedStyle(document.documentElement)), ot;
 }
-function Kn(t) {
+function rr(t) {
   const e = t.startsWith("--") ? t : `--${t}`;
-  return cn().getPropertyValue(e).trim();
+  return mn().getPropertyValue(e).trim();
 }
-function qn() {
+function ir() {
   return document.documentElement.classList.contains("dark");
 }
-const Zn = "0.2.0";
+const fn = "0.3.3", hn = {
+  version: fn
+}, ar = hn.version;
 export {
-  Un as GRADIENT_NAMES,
-  M as GRADIENT_PRESETS,
-  Fn as GRADIENT_PRESET_KEYS,
-  On as Glow,
-  tr as GridSizeSchema,
-  er as PublishBodySchema,
-  nr as PublishConfirmSchema,
-  rr as PublishRequestSchema,
-  Zn as SDK_VERSION,
-  L as WIDGET_Z,
-  P as Widget,
-  Yt as WidgetContent,
-  ot as WidgetCtx,
-  Wn as WidgetDialog,
-  Jt as WidgetEmptyState,
-  oe as WidgetIcon,
-  ir as WidgetManifestSchema,
-  bt as WidgetMetrics,
-  Pt as WidgetSliderFill,
-  Vn as WidgetStack,
-  fe as WidgetStatus,
-  xe as WidgetSubtitle,
-  ye as WidgetTitle,
-  De as WidgetValue,
-  Tn as allEntitiesInState,
-  En as anyEntityInState,
-  Sn as applyCssVars,
-  pn as applyLayout,
-  st as builtInVariants,
-  we as calculateLightGroup,
-  $e as calculateSensorGroup,
-  Tt as classicGlass,
-  y as cn,
-  Ot as compactHorizontal,
-  kn as composeVariants,
-  Nn as countActiveEntities,
-  An as countAvailableEntities,
-  _n as countEntitiesByState,
-  Mn as createEmptyStateConfig,
-  xn as createEntity,
-  Cn as createFlexLayout,
-  vn as defineWidget,
-  ie as deriveAdaptiveIconColors,
-  $n as extendVariant,
-  ar as formatSchemaError,
-  Se as formatValue,
-  Vt as getBuiltInVariant,
-  wn as getBuiltInVariantIds,
-  Dn as getEntityAttribute,
-  zn as getEntityState,
-  Yn as getGradient,
-  ft as getGradientFromString,
-  Ut as getSpacingClass,
-  Kn as getThemeToken,
-  X as gradientColorPresets,
-  Ce as interpretValue,
-  yn as isBuiltInVariant,
-  qn as isDark,
-  pe as isEntityActive,
-  ke as isEntityAvailable,
-  lt as mergeVariants,
-  Et as minimal,
-  or as parseGridSize,
-  sr as serializeGridSize,
-  N as spacing,
-  Xn as stateColors,
-  H as typography,
-  Rn as useDebugData,
-  Gn as useWidgetConfig,
+  Zn as GRADIENT_NAMES,
+  D as GRADIENT_PRESETS,
+  Qn as GRADIENT_PRESET_KEYS,
+  Bn as Glow,
+  lr as GridSizeSchema,
+  cr as PublishBodySchema,
+  ur as PublishConfirmSchema,
+  dr as PublishRequestSchema,
+  ar as SDK_VERSION,
+  F as WIDGET_Z,
+  U as Widget,
+  Jt as WidgetContent,
+  st as WidgetCtx,
+  jn as WidgetDialog,
+  re as WidgetEmptyState,
+  ue as WidgetIcon,
+  gr as WidgetManifestSchema,
+  $t as WidgetMetrics,
+  Yt as WidgetSliderFill,
+  Ln as WidgetStack,
+  be as WidgetStatus,
+  we as WidgetSubtitle,
+  pe as WidgetTitle,
+  Te as WidgetValue,
+  Gn as allEntitiesInState,
+  Hn as anyEntityInState,
+  Nn as applyCssVars,
+  An as applyLayout,
+  lt as builtInVariants,
+  Se as calculateLightGroup,
+  Ce as calculateSensorGroup,
+  Wt as classicGlass,
+  $ as cn,
+  Rt as compactHorizontal,
+  _n as composeVariants,
+  Rn as countActiveEntities,
+  In as countAvailableEntities,
+  Wn as countEntitiesByState,
+  On as createEmptyStateConfig,
+  pn as createEntity,
+  Tn as createFlexLayout,
+  Sn as defineWidget,
+  le as deriveAdaptiveIconColors,
+  Dn as extendVariant,
+  Vt as extractDefaults,
+  mr as formatSchemaError,
+  De as formatValue,
+  Gt as getBuiltInVariant,
+  zn as getBuiltInVariantIds,
+  Vn as getEntityAttribute,
+  En as getEntityState,
+  tr as getGradient,
+  xt as getGradientFromString,
+  Kt as getSpacingClass,
+  rr as getThemeToken,
+  q as gradientColorPresets,
+  _e as interpretValue,
+  Mn as isBuiltInVariant,
+  ir as isDark,
+  ze as isEntityActive,
+  Me as isEntityAvailable,
+  ct as mergeVariants,
+  It as minimal,
+  fr as parseGridSize,
+  hr as serializeGridSize,
+  W as spacing,
+  er as stateColors,
+  bt as toFormSchema,
+  j as typography,
+  Fn as useDebugData,
+  Un as useWidgetConfig,
   G as useWidgetContext,
-  Bn as useWidgetDialog,
-  Hn as useWidgetEntity,
-  Ln as useWidgetEntityGroup,
-  Pn as useWidgetForm,
-  In as useWidgetGestures,
-  jn as useWidgetResponsive,
-  bn as warnIfStub
+  Yn as useWidgetDialog,
+  Xn as useWidgetEntity,
+  Kn as useWidgetEntityGroup,
+  qn as useWidgetForm,
+  Pn as useWidgetGestures,
+  Jn as useWidgetResponsive,
+  Cn as warnIfStub,
+  nr as widgetFields
 };