@glasshome/widget-sdk 0.1.0

package/dist/index.js

@@ -0,0 +1,1955 @@
+import { createSignal as U, createContext as yt, useContext as mt, createEffect as wt, untrack as lt, createMemo as z, splitProps as $t, Show as X } from "solid-js";
+import { memo as D, effect as C, setStyleProperty as p, className as k, template as h, insert as f, style as Q, createComponent as O, 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] = U(t);
+  return e;
+}
+function vn(t) {
+  return t;
+}
+const j = {
+  /** Background layer (gradients, images, glows) */
+  BACKGROUND: 0,
+  /** Main content layer (icon, title, text) */
+  CONTENT: 10,
+  /** Overlay layer (loading states, volume indicators) */
+  OVERLAY: 20,
+  /** Action layer (buttons, edit controls) */
+  ACTIONS: 30
+}, it = yt();
+function R() {
+  const t = mt(it);
+  if (!t)
+    throw new Error("useWidgetContext must be used within a Widget component");
+  return t;
+}
+function w(...t) {
+  return Ct(St(t));
+}
+const Tt = {
+  id: "classic-glass",
+  name: "Classic Glass",
+  description: "Default glassmorphism design with blur background and gradient",
+  styles: {
+    cssVars: {
+      "--widget-bg": "rgba(255, 255, 255, 0.1)",
+      "--widget-border": "rgba(255, 255, 255, 0.2)",
+      "--widget-blur": "12px",
+      "--widget-shadow": "0 8px 32px rgba(0, 0, 0, 0.2)",
+      "--widget-padding": "1.5rem"
+    },
+    class: "backdrop-blur-xl"
+  },
+  layout: {
+    type: "flex",
+    direction: "column",
+    align: "start",
+    justify: "start",
+    gap: "0.75rem"
+  },
+  interactions: {
+    hover: !0,
+    active: !0,
+    focus: !0,
+    hoverScale: 1.02,
+    activeScale: 0.98
+  }
+}, Et = {
+  id: "minimal",
+  name: "Minimal",
+  description: "Clean, minimal design with no background effects",
+  styles: {
+    cssVars: {
+      "--widget-bg": "transparent",
+      "--widget-border": "rgba(255, 255, 255, 0.1)",
+      "--widget-padding": "1rem"
+    }
+  },
+  layout: {
+    type: "flex",
+    direction: "column",
+    align: "start",
+    justify: "start",
+    gap: "0.5rem"
+  },
+  elements: {
+    visible: {
+      background: !1,
+      decorations: !1
+    }
+  },
+  interactions: {
+    hover: !1,
+    active: !1,
+    focus: !0
+  }
+}, Ot = {
+  id: "compact-horizontal",
+  name: "Compact Horizontal",
+  description: "Horizontal layout for compact widgets",
+  styles: {
+    cssVars: {
+      "--widget-bg": "rgba(255, 255, 255, 0.08)",
+      "--widget-border": "rgba(255, 255, 255, 0.15)",
+      "--widget-blur": "10px",
+      "--widget-padding": "1rem",
+      "--widget-icon-size": "2.5rem"
+    },
+    class: "backdrop-blur-lg"
+  },
+  layout: {
+    type: "flex",
+    direction: "row",
+    align: "center",
+    justify: "start",
+    gap: "1rem"
+  },
+  interactions: {
+    hover: !0,
+    active: !0,
+    focus: !0,
+    hoverScale: 1.02,
+    activeScale: 0.98
+  }
+}, at = {
+  "classic-glass": Tt,
+  minimal: Et,
+  "compact-horizontal": Ot
+};
+function Vt(t) {
+  return at[t];
+}
+function bn(t) {
+  return t in at;
+}
+function yn() {
+  return Object.keys(at);
+}
+function ft(t, e) {
+  if (typeof t != "object" || t === null)
+    return e;
+  const n = { ...t };
+  for (const i in e) {
+    const r = e[i], a = t[i];
+    if (r !== void 0) {
+      if (Array.isArray(r)) {
+        n[i] = r;
+        continue;
+      }
+      if (typeof r == "object" && r !== null && !Array.isArray(r)) {
+        typeof a == "object" && a !== null ? n[i] = ft(a, r) : n[i] = r;
+        continue;
+      }
+      n[i] = r;
+    }
+  }
+  return n;
+}
+function Wt(t, e) {
+  if (!(!t && !e))
+    return t ? e ? {
+      container: { ...t.container, ...e.container },
+      class: e.class ?? t.class,
+      cssVars: { ...t.cssVars, ...e.cssVars }
+    } : t : e;
+}
+function It(t, e) {
+  return e ?? t;
+}
+function Rt(t, e) {
+  if (!(!t && !e))
+    return t ? e ? {
+      visible: { ...t.visible, ...e.visible },
+      styles: ft(t.styles ?? {}, e.styles ?? {}),
+      classNames: { ...t.classNames, ...e.classNames }
+    } : t : e;
+}
+function Gt(t, e) {
+  if (!(!t && !e))
+    return t ? e ? {
+      background: e.background ?? t.background,
+      overlay: e.overlay ?? t.overlay,
+      decorations: e.decorations ?? t.decorations
+    } : t : e;
+}
+function Ht(t, e) {
+  if (!(!t && !e))
+    return t ? e ? {
+      hover: e.hover ?? t.hover,
+      active: e.active ?? t.active,
+      focus: e.focus ?? t.focus,
+      hoverScale: e.hoverScale ?? t.hoverScale,
+      activeScale: e.activeScale ?? t.activeScale
+    } : t : e;
+}
+function st(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: Ht(t.interactions, e.interactions),
+    extends: e.extends ?? t.extends
+  };
+}
+function wn(t, e) {
+  return {
+    ...e,
+    extends: 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) => st(e, n));
+}
+function kn(t, e) {
+  return st(t, { layout: e });
+}
+function pn(t, e) {
+  return st(t, {
+    styles: { cssVars: e }
+  });
+}
+function Sn(t = "column", e = "start", n = "start", i) {
+  return {
+    type: "flex",
+    direction: t,
+    align: e,
+    justify: n,
+    ...i
+  };
+}
+var Bt = /* @__PURE__ */ h("<div>"), Lt = /* @__PURE__ */ h('<div class="pointer-events-none absolute inset-0 opacity-40 blur-2xl">');
+function jt(t) {
+  const e = R(), 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 s = i(), o = j.BACKGROUND;
+      return s !== a.e && p(r, "background", a.e = s), o !== a.t && p(r, "z-index", a.t = o), a;
+    }, {
+      e: void 0,
+      t: void 0
+    }), r;
+  })()), (() => {
+    var r = Bt();
+    return C((a) => {
+      var s = w("pointer-events-none absolute inset-0", t.isDragging ? "duration-0" : "transition-all duration-300 ease-out", t.class), o = i(), c = n(), g = t.opacity ?? 0.3, d = j.BACKGROUND;
+      return s !== a.e && k(r, a.e = s), o !== a.t && p(r, "background", a.t = o), 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;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0,
+      o: void 0,
+      i: void 0
+    }), r;
+  })()];
+}
+const K = {
+  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 = {
+  /** Extra small spacing (4-8px) */
+  S1: (t) => `${K.S1[t]}px`,
+  /** Small spacing (6-14px) - default for most layouts */
+  S2: (t) => `${K.S2[t]}px`,
+  /** Medium spacing (8-16px) */
+  S3: (t) => `${K.S3[t]}px`,
+  /** Large spacing (12-20px) */
+  S4: (t) => `${K.S4[t]}px`,
+  /** Icon container size in pixels */
+  icon: (t) => ({
+    xs: 32,
+    // 1x1, 1x2 widgets
+    sm: 40,
+    // 2x1, 2x2 widgets (current WidgetIcon default)
+    md: 48,
+    // 2x3, 2x4 widgets
+    lg: 52,
+    // 2x6, 3x6, 4x2 widgets
+    xl: 56
+    // 4x4 widgets
+  })[t],
+  /** Icon stroke size for lucide icons */
+  iconSize: (t) => ({
+    xs: 18,
+    // Smaller stroke for tiny widgets
+    sm: 20,
+    // Current WidgetIcon default (size-5 = 20px)
+    md: 24,
+    // Medium widgets
+    lg: 26,
+    // Large widgets
+    xl: 28
+    // Extra large widgets
+  })[t],
+  /** Spacing between icon and title */
+  iconToTitle: (t) => ({
+    xs: "8px",
+    // Tight spacing for small widgets
+    sm: "10px",
+    // Slightly more room
+    md: "12px",
+    // Current pattern from LockWidget (@[300px]:mt-3 = 12px)
+    lg: "14px",
+    // More breathing room
+    xl: "16px"
+    // Maximum spacing (@[400px]:mt-4 = 16px)
+  })[t],
+  /** Container padding */
+  container: (t) => ({
+    xs: "8px",
+    // Minimal padding for tiny widgets
+    sm: "16px",
+    // Current BaseWidget default (p-4 = 16px)
+    md: "16px",
+    lg: "20px",
+    // More padding for larger widgets
+    xl: "20px"
+  })[t]
+}, Pt = {
+  4: "gap-1",
+  6: "gap-1.5",
+  8: "gap-2",
+  10: "gap-2.5",
+  12: "gap-3",
+  14: "gap-3.5",
+  16: "gap-4",
+  18: "gap-[18px]",
+  20: "gap-5"
+};
+function Ut(t, e) {
+  const n = K[t][e];
+  return Pt[n] || `gap-[${n}px]`;
+}
+var Ft = /* @__PURE__ */ h("<div>");
+function Yt(t) {
+  const e = R();
+  return (() => {
+    var n = Ft();
+    return f(n, () => t.children), C((i) => {
+      var r = w(
+        "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()),
+        t.class
+      ), a = N.container(e.size()), s = j.CONTENT;
+      return r !== i.e && k(n, i.e = r), a !== i.t && p(n, "padding", i.t = a), s !== i.a && p(n, "z-index", i.a = s), i;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0
+    }), n;
+  })();
+}
+const B = {
+  /** Container base text sizing */
+  container: (t) => ({
+    xs: "text-xs",
+    // Smallest widgets
+    sm: "text-sm",
+    // Small widgets
+    md: "text-base",
+    // Medium widgets
+    lg: "text-base",
+    // Large widgets
+    xl: "text-lg"
+    // Extra large widgets
+  })[t],
+  /** Title text sizing (main heading) */
+  title: (t) => ({
+    xs: "text-xs",
+    // 12px - Very compact
+    sm: "text-xs",
+    // 12px - Stay small
+    md: "text-sm",
+    // 14px - More readable (@[300px] equivalent)
+    lg: "text-sm",
+    // 14px - Maintain size
+    xl: "text-sm"
+    // 14px - Don't go too large for secondary text
+  })[t],
+  /** Subtitle/secondary text sizing */
+  subtitle: (t) => ({
+    xs: "text-xs",
+    // 12px - Very compact
+    sm: "text-sm",
+    // 12px - Stay small
+    md: "text-base",
+    // 14px - More readable (@[300px] equivalent)
+    lg: "text-base",
+    // 14px - Maintain size
+    xl: "text-base"
+    // 14px - Don't go too large for secondary text
+  })[t],
+  /** Value display text sizing (large numbers) */
+  value: (t) => ({
+    xs: "text-lg",
+    // 18px - Still readable on small widgets
+    sm: "text-xl",
+    // 20px - Slightly larger
+    md: "text-2xl",
+    // 24px - Prominent
+    lg: "text-3xl",
+    // 30px - Very prominent
+    xl: "text-4xl"
+    // 36px - Maximum impact
+  })[t],
+  /** Badge text sizing (entity count badges) */
+  badge: (t) => ({
+    xs: "text-xs",
+    // 12px - Compact badge
+    sm: "text-xs",
+    // 12px - Keep small
+    md: "text-xs",
+    // 12px - Badges should stay small
+    lg: "text-sm",
+    // 14px - Slightly larger for readability
+    xl: "text-sm"
+    // 14px - Maximum badge size
+  })[t],
+  /** Metric label text sizing */
+  metricLabel: (t) => ({
+    xs: "text-xs",
+    // 12px - Compact labels
+    sm: "text-xs",
+    // 12px
+    md: "text-xs",
+    // 12px - Labels stay small
+    lg: "text-sm",
+    // 14px - More readable on large widgets
+    xl: "text-sm"
+    // 14px
+  })[t],
+  /** Metric value text sizing */
+  metricValue: (t) => ({
+    xs: "text-sm",
+    // 14px - Readable metric values
+    sm: "text-sm",
+    // 14px
+    md: "text-sm",
+    // 14px - Keep metrics compact
+    lg: "text-base",
+    // 16px - Slightly larger
+    xl: "text-base"
+    // 16px
+  })[t],
+  /** Status text (same as subtitle but semantic) */
+  status: (t) => ({
+    xs: "text-md",
+    sm: "text-xl",
+    md: "text-2xl",
+    lg: "text-3xl",
+    xl: "text-3xl"
+  })[t],
+  /** Empty state message text */
+  emptyState: (t) => ({
+    xs: "text-xs",
+    // 12px
+    sm: "text-sm",
+    // 14px
+    md: "text-sm",
+    // 14px
+    lg: "text-base",
+    // 16px
+    xl: "text-base"
+    // 16px
+  })[t]
+};
+var Xt = /* @__PURE__ */ h("<div><div>"), Kt = /* @__PURE__ */ h("<div>"), qt = /* @__PURE__ */ h("<h3>"), Zt = /* @__PURE__ */ h("<p>"), Qt = /* @__PURE__ */ h("<div class=mt-2>");
+function Jt(t) {
+  const e = R(), n = () => e.contentLayout() === "horizontal";
+  return (() => {
+    var i = Xt(), r = i.firstChild;
+    return f(i, (() => {
+      var a = D(() => !!t.icon);
+      return () => a() && (() => {
+        var s = Kt();
+        return f(s, () => t.icon), C((o) => {
+          var c = w("flex items-center justify-center text-white/30", n() ? "shrink-0" : ""), g = `${N.icon(e.size())}px`, d = `${N.icon(e.size())}px`;
+          return c !== o.e && k(s, o.e = c), g !== o.t && p(s, "width", o.t = g), d !== o.a && p(s, "height", o.a = d), o;
+        }, {
+          e: void 0,
+          t: void 0,
+          a: void 0
+        }), s;
+      })();
+    })(), r), f(r, (() => {
+      var a = D(() => !!(t.title ?? "No data"));
+      return () => a() && (() => {
+        var s = qt();
+        return f(s, () => t.title ?? "No data"), C((o) => {
+          var c = w("font-semibold text-white/60", B.subtitle(e.size())), g = n() ? "100%" : "80%";
+          return c !== o.e && k(s, o.e = c), g !== o.t && p(s, "max-width", o.t = g), o;
+        }, {
+          e: void 0,
+          t: void 0
+        }), s;
+      })();
+    })(), null), f(r, (() => {
+      var a = D(() => !!t.message);
+      return () => a() && (() => {
+        var s = Zt();
+        return f(s, () => t.message), C((o) => {
+          var c = w("text-white/50", B.emptyState(e.size())), g = n() ? "100%" : "85%";
+          return c !== o.e && k(s, o.e = c), g !== o.t && p(s, "max-width", o.t = g), o;
+        }, {
+          e: void 0,
+          t: void 0
+        }), s;
+      })();
+    })(), null), f(r, (() => {
+      var a = D(() => !!t.action);
+      return () => a() && (() => {
+        var s = Qt();
+        return f(s, () => t.action), s;
+      })();
+    })(), null), C((a) => {
+      var s = w("flex h-full w-full", n() ? "flex-row items-center justify-start" : "flex-col items-center justify-center text-center", t.class), o = N.S2(e.size()), c = N.container(e.size()), g = w("flex flex-col", n() ? "items-start text-left" : "items-center text-center"), d = N.S1(e.size());
+      return s !== a.e && k(i, a.e = s), o !== a.t && p(i, "gap", a.t = o), c !== a.a && p(i, "padding", a.a = c), g !== a.o && k(r, a.o = g), d !== a.i && p(r, "gap", a.i = d), a;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0,
+      o: void 0,
+      i: void 0
+    }), i;
+  })();
+}
+function te(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) {
+  const e = t.match(/rgb\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*\)/);
+  return e ? ht(Number(e[1]), Number(e[2]), Number(e[3])) : null;
+}
+function ne(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 ht(i, r, a);
+}
+function ht(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 s = i - r, o = a > 0.5 ? s / (2 - i - r) : s / (i + r);
+  let c = 0;
+  return i === t ? c = ((e - n) / s + (e < n ? 6 : 0)) / 6 : i === e ? c = ((n - t) / s + 2) / 6 : c = ((t - e) / s + 4) / 6, { h: c * 360, s: o * 100, l: a * 100 };
+}
+function re(t) {
+  return te(t) ?? ee(t) ?? ne(t);
+}
+function ct(t, e, n, i) {
+  const r = Math.round(t), a = Math.round(Math.min(100, Math.max(0, e))), s = Math.round(Math.min(100, Math.max(0, n)));
+  return i !== void 0 && i < 1 ? `hsla(${r}, ${a}%, ${s}%, ${i})` : `hsl(${r}, ${a}%, ${s}%)`;
+}
+function ie(t) {
+  const e = re(t);
+  if (!e) return null;
+  const { h: n, s: i, l: r } = e;
+  let a, s = Math.min(i + 10, 100);
+  r < 25 ? (a = r + 12, s = Math.min(i + 15, 100)) : r < 40 ? a = Math.max(r - 8, 15) : a = Math.max(18, r * 0.3), i < 15 && (s = 10, a = Math.max(a, 20));
+  const o = ct(n, s, a, 0.85), c = ct(n, Math.min(i, 90), Math.min(r, 55), 0.5);
+  return { background: o, glow: c };
+}
+var ae = /* @__PURE__ */ h('<div><div class="flex items-center justify-center text-white">'), ut = /* @__PURE__ */ h("<div>");
+function se(t) {
+  const e = R(), n = () => t.dynamicColor ? ie(t.dynamicColor) : null, i = () => !!n(), r = () => {
+    const c = n();
+    if (c)
+      return {
+        "background-color": c.background
+      };
+  }, a = () => {
+    const c = n();
+    if (c)
+      return {
+        "box-shadow": `0 0 25px ${c.glow}`
+      };
+  }, s = () => {
+    const c = {
+      width: `${N.icon(e.size())}px`,
+      height: `${N.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;
+  }, o = (c, g, d) => {
+    const x = {
+      width: `${N.icon(e.size()) * 1.02}px`,
+      height: `${N.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,
+      opacity: d
+    }, S = r();
+    return S && Object.assign(x, S), x;
+  };
+  return (() => {
+    var c = ae(), g = c.firstChild;
+    return f(c, (() => {
+      var d = D(() => (t.entityCount ?? 1) >= 2);
+      return () => d() && (() => {
+        var x = ut();
+        return C((S) => {
+          var u = w("absolute", !i() && (t.color ?? "bg-white/10")), l = o(0.14, -2, 0.45);
+          return u !== S.e && k(x, S.e = u), S.t = Q(x, l, S.t), S;
+        }, {
+          e: void 0,
+          t: void 0
+        }), x;
+      })();
+    })(), g), f(c, (() => {
+      var d = D(() => (t.entityCount ?? 1) >= 3);
+      return () => d() && (() => {
+        var x = ut();
+        return C((S) => {
+          var u = w("absolute", !i() && (t.color ?? "bg-white/10")), l = o(0.28, -3, 0.2);
+          return u !== S.e && k(x, S.e = u), S.t = Q(x, l, S.t), S;
+        }, {
+          e: void 0,
+          t: void 0
+        }), x;
+      })();
+    })(), g), f(g, () => t.icon), C((d) => {
+      var x = w(
+        "relative flex shrink-0 items-center justify-center transition-all",
+        "pointer-events-none",
+        t.dimmed && "opacity-50",
+        // Only apply Tailwind classes when not using dynamic colors
+        !i() && t.glow && "shadow-[0_0_25px]",
+        !i() && (t.color ?? "bg-white/10"),
+        !i() && t.glow,
+        t.class
+      ), S = s(), u = `${N.iconSize(e.size())}px`;
+      return x !== d.e && k(c, d.e = x), d.t = Q(c, S, d.t), u !== d.a && p(g, "font-size", d.a = u), d;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0
+    }), c;
+  })();
+}
+var oe = /* @__PURE__ */ h("<div>"), le = /* @__PURE__ */ h("<div><div><span></span></div><div>"), ce = /* @__PURE__ */ h("<span class=shrink-0>"), ue = /* @__PURE__ */ h('<span class="ml-1 text-white/70">');
+function de(t) {
+  const e = R(), n = () => {
+    const i = t.direction ?? "auto";
+    return i === "auto" ? e.orientation() === "horizontal" ? "horizontal" : "vertical" : i;
+  };
+  return (() => {
+    var i = oe();
+    return f(i, () => t.children), C(() => k(i, w("flex", n() === "horizontal" ? "flex-row gap-4" : "flex-col gap-2", t.class))), i;
+  })();
+}
+function ge(t) {
+  const e = R();
+  return (() => {
+    var n = le(), i = n.firstChild, r = i.firstChild, a = i.nextSibling;
+    return f(i, (() => {
+      var s = D(() => !!t.icon);
+      return () => s() && (() => {
+        var o = ce();
+        return f(o, () => t.icon), o;
+      })();
+    })(), r), f(r, () => t.label), f(a, () => t.value, null), f(a, (() => {
+      var s = D(() => !!t.unit);
+      return () => s() && (() => {
+        var o = ue();
+        return f(o, () => t.unit), o;
+      })();
+    })(), null), C((s) => {
+      var o = w("flex flex-col", t.dimmed && "opacity-50", t.class), c = N.S1(e.size()), g = w("flex items-center gap-1 text-white/60", B.metricLabel(e.size())), d = w("font-semibold text-white", B.metricValue(e.size()));
+      return o !== s.e && k(n, s.e = o), c !== s.t && p(n, "gap", s.t = c), g !== s.a && k(i, s.a = g), d !== s.o && k(a, s.o = d), s;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0,
+      o: void 0
+    }), n;
+  })();
+}
+const xt = de;
+xt.Item = ge;
+var me = /* @__PURE__ */ h("<p>");
+function fe(t) {
+  const e = R();
+  return (() => {
+    var n = me();
+    return f(n, (() => {
+      var i = D(() => !!t.isUnavailable);
+      return () => i() ? "Unavailable" : t.children;
+    })()), C((i) => {
+      var r = w("relative font-bold text-white", t.dimmed && "opacity-40", B.status(e.size()), t.class), a = j.ACTIONS;
+      return r !== i.e && k(n, i.e = r), a !== i.t && p(n, "z-index", i.t = a), i;
+    }, {
+      e: void 0,
+      t: void 0
+    }), n;
+  })();
+}
+var he = /* @__PURE__ */ h("<p>");
+function xe(t) {
+  const e = R();
+  return (() => {
+    var n = he();
+    return f(n, () => t.children), C(() => k(n, w("truncate font-medium text-white/80", t.dimmed && "text-white/50", B.subtitle(e.size()), t.class))), n;
+  })();
+}
+var ve = /* @__PURE__ */ h("<div><h3>"), be = /* @__PURE__ */ h("<span>");
+function ye(t) {
+  const e = R();
+  return (() => {
+    var n = ve(), i = n.firstChild;
+    return f(i, () => t.children), f(n, (() => {
+      var r = D(() => t.badge !== void 0 && t.badge > 0);
+      return () => r() && (() => {
+        var a = be();
+        return f(a, () => t.badge), C(() => k(a, w("shrink-0 rounded-full bg-white/20 px-2 py-0.5 font-medium text-white", B.badge(e.size())))), a;
+      })();
+    })(), null), C((r) => {
+      var a = w("relative flex items-center", t.class), s = N.S1(e.size()), o = j.ACTIONS, c = w("truncate text-white/60", B.title(e.size()));
+      return a !== r.e && k(n, r.e = a), s !== r.t && p(n, "gap", r.t = s), o !== r.a && p(n, "z-index", r.a = o), c !== r.o && k(i, r.o = c), r;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0,
+      o: void 0
+    }), n;
+  })();
+}
+function Cn(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) {
+  if (t.length === 0)
+    return {
+      isGroup: !1,
+      state: "unknown",
+      isOn: !1,
+      isUnavailable: !0,
+      brightness: 0,
+      brightnessPercent: 0,
+      color: "rgb(100, 100, 100)",
+      onCount: 0,
+      totalCount: 0,
+      description: "No entities"
+    };
+  const n = t.length > 1;
+  if (!n) {
+    const y = t[0], _ = y.state === "on", G = y.attributes?.brightness || 0, E = Math.round(G / 255 * 100);
+    return {
+      isGroup: !1,
+      state: y.state,
+      isOn: _,
+      isUnavailable: y.state === "unavailable",
+      brightness: G,
+      brightnessPercent: E,
+      color: dt(y),
+      onCount: _ ? 1 : 0,
+      totalCount: 1,
+      description: _ ? "On" : "Off"
+    };
+  }
+  let i = 0, r = 0, a = 0, s = 0, o = 0, c = 0;
+  const g = [];
+  for (const y of t)
+    switch (y.state) {
+      case "on":
+        i++, y.attributes?.brightness !== void 0 && (o += y.attributes.brightness, c++), y.attributes?.rgb_color && g.push(y.attributes.rgb_color);
+        break;
+      case "off":
+        r++;
+        break;
+      case "unknown":
+        a++;
+        break;
+      case "unavailable":
+        s++;
+        break;
+    }
+  const d = t.length, x = s === d, S = a + s === d, u = i > 0, l = i === d, b = r === d;
+  let v, T;
+  e ? x ? (v = "unavailable", T = !1) : a > 0 || s > 0 ? (v = "unknown", T = !1) : r > 0 ? (v = "off", T = !1) : (v = "on", T = !0) : x ? (v = "unavailable", T = !1) : S ? (v = "unknown", T = !1) : u ? (v = "on", T = !0) : (v = "off", T = !1);
+  const $ = c > 0 ? Math.round(o / c) : 0, A = Math.round($ / 255 * 100);
+  let I;
+  if (g.length > 0) {
+    const y = Math.round(g.reduce((W, L) => W + L[0], 0) / g.length), _ = Math.round(g.reduce((W, L) => W + L[1], 0) / g.length), G = Math.round(g.reduce((W, L) => W + L[2], 0) / g.length), E = $ / 255;
+    I = `rgb(${Math.round(y * E)}, ${Math.round(_ * E)}, ${Math.round(G * E)})`;
+  } else
+    I = dt(t[0]);
+  let V;
+  return l ? V = "All on" : b ? V = "All off" : i > 0 ? V = `${i} of ${d} on` : V = "Off", {
+    isGroup: n,
+    state: v,
+    isOn: T,
+    isUnavailable: v === "unavailable",
+    brightness: $,
+    brightnessPercent: A,
+    color: I,
+    onCount: i,
+    totalCount: d,
+    description: V
+  };
+}
+function $e(t, e = "mean", n = !0) {
+  if (t.length === 0)
+    return {
+      isGroup: !1,
+      state: "unknown",
+      numericValue: null,
+      isUnavailable: !0,
+      description: "No entities"
+    };
+  const i = t.length > 1;
+  if (!i) {
+    const u = t[0], l = Number.parseFloat(u.state);
+    let b = u.state;
+    return Number.isNaN(l) || (b = Number.isInteger(l) ? l.toString() : l.toFixed(1)), {
+      isGroup: !1,
+      state: b,
+      numericValue: Number.isNaN(l) ? null : l,
+      isUnavailable: u.state === "unavailable",
+      unit: u.unitOfMeasurement ?? void 0,
+      description: b
+    };
+  }
+  const r = [], a = [];
+  let s = 0, o;
+  for (const u of t) {
+    if (!o && u.unitOfMeasurement && (o = u.unitOfMeasurement), u.state === "unavailable") {
+      s++, a.push({
+        entityId: u.id,
+        value: "unavailable",
+        friendly_name: u.friendlyName
+      });
+      continue;
+    }
+    const l = Number.parseFloat(u.state);
+    isNaN(l) ? n || a.push({
+      entityId: u.id,
+      value: u.state,
+      friendly_name: u.friendlyName
+    }) : (r.push(l), a.push({
+      entityId: u.id,
+      value: l,
+      friendly_name: u.friendlyName
+    }));
+  }
+  const c = s === t.length, g = r.length === 0;
+  if (c || g)
+    return {
+      isGroup: i,
+      state: c ? "unavailable" : "unknown",
+      numericValue: null,
+      isUnavailable: c,
+      unit: o,
+      description: c ? "Unavailable" : "No numeric values",
+      memberValues: a
+    };
+  let d, x;
+  switch (e) {
+    case "min":
+      d = Math.min(...r), x = "Minimum";
+      break;
+    case "max":
+      d = Math.max(...r), x = "Maximum";
+      break;
+    case "mean":
+      d = r.reduce((u, l) => u + l, 0) / r.length, x = "Average";
+      break;
+    case "median": {
+      const u = [...r].sort((b, v) => b - v), l = Math.floor(u.length / 2);
+      d = u.length % 2 === 0 ? (u[l - 1] + u[l]) / 2 : u[l], x = "Median";
+      break;
+    }
+    case "sum":
+      d = r.reduce((u, l) => u + l, 0), x = "Sum";
+      break;
+    case "last":
+      d = r[r.length - 1], x = "Latest";
+      break;
+    case "range":
+      d = Math.max(...r) - Math.min(...r), x = "Range";
+      break;
+    case "product":
+      d = r.reduce((u, l) => u * l, 1), x = "Product";
+      break;
+    case "std_dev": {
+      const u = r.reduce((b, v) => b + v, 0) / r.length, l = r.reduce((b, v) => b + (v - u) ** 2, 0) / r.length;
+      d = Math.sqrt(l), x = "Std Dev";
+      break;
+    }
+    default:
+      d = r.reduce((u, l) => u + l, 0) / r.length, x = "Average";
+  }
+  const S = Number.isInteger(d) ? d.toString() : d.toFixed(1);
+  return {
+    isGroup: i,
+    state: S,
+    numericValue: d,
+    isUnavailable: !1,
+    unit: o,
+    description: `${x} of ${r.length}`,
+    memberValues: a
+  };
+}
+function dt(t) {
+  if (t.state !== "on") return "rgb(100, 100, 100)";
+  const n = (t.attributes?.brightness ?? 255) / 255;
+  if (t.attributes?.rgb_color) {
+    const [i, r, a] = t.attributes.rgb_color;
+    return `rgb(${Math.round(i * n)}, ${Math.round(r * n)}, ${Math.round(a * n)})`;
+  }
+  if (t.attributes?.color_temp) {
+    const r = 1e6 / t.attributes.color_temp / 100;
+    let a, s, o;
+    return r <= 66 ? (a = 255, s = r <= 19 ? 0 : 99.4708025861 * Math.log(r - 10) - 161.1195681661, o = r <= 19 ? 0 : r <= 66 ? 138.5177312231 * Math.log(r - 10) - 305.0447927307 : 255) : (a = 329.698727446 * (r - 60) ** -0.1332047592, s = 288.1221695283 * (r - 60) ** -0.0755148492, o = 255), a = Math.max(0, Math.min(255, a)) * n, s = Math.max(0, Math.min(255, s)) * n, o = Math.max(0, Math.min(255, o)) * n, `rgb(${Math.round(a)}, ${Math.round(s)}, ${Math.round(o)})`;
+  }
+  return `rgb(${Math.round(255 * n)}, ${Math.round(220 * n)}, ${Math.round(180 * n)})`;
+}
+function ke(t) {
+  return t ? t.state !== "unavailable" && t.state !== "unknown" : !1;
+}
+function pe(t) {
+  if (!t) return !1;
+  if (["on", "open", "locked", "home", "playing", "active"].includes(t.state))
+    return !0;
+  if (t.domain === "sensor") {
+    const e = Number.parseFloat(t.state);
+    return !isNaN(e) && e > 0;
+  }
+  return !1;
+}
+function Mn(t, e = "unknown") {
+  return t?.state ?? e;
+}
+function zn(t, e, n) {
+  return t?.attributes ? t.attributes[e] ?? n : n;
+}
+function Dn(t, e) {
+  return t.filter((n) => n.state === e).length;
+}
+function _n(t) {
+  return t.filter(ke).length;
+}
+function An(t) {
+  return t.filter(pe).length;
+}
+function Nn(t, e) {
+  return t.length > 0 && t.every((n) => n.state === e);
+}
+function Tn(t, e) {
+  return t.some((n) => n.state === e);
+}
+function Se(t, e, n) {
+  const { decimals: i, scale: r = !0 } = n || {};
+  if (typeof t == "string")
+    return e ? `${t}${e}` : t;
+  if (t == null || Number.isNaN(t))
+    return e ? `--${e}` : "--";
+  let a = t, s = e || "";
+  r && e && (e === "W" || e === "kW" || e === "MW") && (t >= 1e6 ? (a = t / 1e6, s = "MW") : t >= 1e3 ? (a = t / 1e3, s = "kW") : s = "W"), r && e && (e === "B" || e === "KB" || e === "MB" || e === "GB") && (t >= 1073741824 ? (a = t / 1073741824, s = "GB") : t >= 1048576 ? (a = t / 1048576, s = "MB") : t >= 1024 ? (a = t / 1024, s = "KB") : s = "B");
+  let o;
+  return i !== void 0 ? o = a.toFixed(i) : a !== t ? o = a.toFixed(1) : Number.isInteger(t) ? o = t.toString() : o = Number.parseFloat(t.toFixed(2)).toString(), s ? `${o}${s}` : o;
+}
+function Ce(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__ */ h("<div><div>"), ze = /* @__PURE__ */ h("<div>");
+function De(t) {
+  const e = R();
+  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"));
+      return () => r() && (() => {
+        var a = ze();
+        return f(a, () => Ce(t.value, t.unit)), C((s) => {
+          var o = w("text-white/60", B.subtitle(e.size())), c = N.S1(e.size());
+          return o !== s.e && k(a, s.e = o), c !== s.t && p(a, "margin-top", s.t = c), s;
+        }, {
+          e: void 0,
+          t: void 0
+        }), a;
+      })();
+    })(), null), C((r) => {
+      var a = w("flex flex-col", t.class), s = w("font-bold text-white", B.value(e.size()));
+      return a !== r.e && k(n, r.e = a), s !== r.t && k(i, r.t = s), r;
+    }, {
+      e: void 0,
+      t: void 0
+    }), n;
+  })();
+}
+var _e = /* @__PURE__ */ h('<div><div><div class="relative h-full w-full">'), Ae = /* @__PURE__ */ h('<div class="pointer-events-none absolute inset-0"><div>'), Ne = /* @__PURE__ */ h('<div class="pointer-events-none absolute inset-0 animate-pulse bg-blue-500/20">'), Te = /* @__PURE__ */ h('<div class="flex h-full w-full flex-col items-center justify-center gap-2 text-center">'), Ee = /* @__PURE__ */ h('<div class="flex items-center justify-center text-white/30">'), Oe = /* @__PURE__ */ h('<h3 class="font-semibold text-sm text-white/60">'), Ve = /* @__PURE__ */ h('<p class="text-white/50 text-xs">');
+function We(t, e) {
+  const n = t * e;
+  return n <= 2 ? "xs" : n <= 4 ? "sm" : n <= 8 ? "md" : n <= 18 ? "lg" : "xl";
+}
+function Ie(t, e) {
+  return t > e ? "horizontal" : e > t ? "vertical" : "square";
+}
+function Re(t, e) {
+  return e >= 150 ? "vertical" : t > e ? "horizontal" : e > t ? "vertical" : "square";
+}
+function Ge(t) {
+  let e;
+  const n = Mt(() => e), i = 2, [r, a] = U(0), [s, o] = U(0);
+  wt(() => {
+    const $ = Math.round(n.width ?? 0), A = Math.round(n.height ?? 0), I = lt(r), V = lt(s);
+    (Math.abs($ - I) > i || Math.abs(A - V) > i) && (a($), o(A));
+  });
+  const c = z(() => {
+    if (t.variant)
+      return typeof t.variant == "string" ? Vt(t.variant) : t.variant;
+  }), g = z(() => ({
+    width: r(),
+    height: s(),
+    gridWidth: Math.max(1, Math.round(r() / 150)),
+    gridHeight: Math.max(1, Math.round(s() / 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);
+  }), x = z(() => {
+    const $ = g();
+    return Ie($.width, $.height);
+  }), S = z(() => {
+    const $ = g();
+    return Re($.width, $.height);
+  }), u = mt(it), l = {
+    size: d,
+    orientation: x,
+    contentLayout: S,
+    dimensions: g,
+    isEditMode: () => t.isEditMode ?? !1,
+    updateConfig: u?.updateConfig ?? (() => {
+    })
+  }, b = "bg-gradient-to-br from-gray-500/20 to-gray-600/20", v = z(() => t.emptyState && !t.gradient ? b : t.gradient), T = z(() => ({
+    "container-type": "size",
+    "container-name": "widget",
+    ...c()?.styles?.container,
+    ...c()?.styles?.cssVars || {}
+  }));
+  return O(it.Provider, {
+    value: l,
+    get children() {
+      var $ = _e(), A = $.firstChild, I = A.firstChild, V = e;
+      return typeof V == "function" ? kt(V, $) : e = $, f(A, (() => {
+        var y = D(() => !!t.backgroundGlow);
+        return () => y() && (() => {
+          var _ = Ae(), G = _.firstChild;
+          return C((E) => {
+            var W = j.BACKGROUND, L = w("absolute inset-0 opacity-20 blur-2xl", t.backgroundGlow);
+            return W !== E.e && p(_, "z-index", E.e = W), L !== E.t && k(G, E.t = L), E;
+          }, {
+            e: void 0,
+            t: void 0
+          }), _;
+        })();
+      })(), I), f(I, (() => {
+        var y = D(() => !!t.emptyState);
+        return () => y() ? O(He, {
+          get icon() {
+            return t.emptyState.icon;
+          },
+          get title() {
+            return t.emptyState.title;
+          },
+          get message() {
+            return t.emptyState.message;
+          }
+        }) : t.children;
+      })()), f(A, (() => {
+        var y = D(() => !!t.loading);
+        return () => y() && (() => {
+          var _ = Ne();
+          return C((G) => p(_, "z-index", j.OVERLAY)), _;
+        })();
+      })(), null), C((y) => {
+        var _ = w(
+          "relative h-full w-full select-none rounded-xl border border-border/50",
+          // Variant styles (lowest priority)
+          c()?.styles?.class,
+          // Custom class (highest priority)
+          t.class
+        ), G = T(), E = w(
+          "relative h-full w-full overflow-hidden rounded-xl",
+          // Gradient prop (overrides variant, auto-applied for empty state)
+          v()
+        ), W = j.CONTENT;
+        return _ !== y.e && k($, y.e = _), y.t = Q($, G, y.t), E !== y.a && k(A, y.a = E), W !== y.o && p(I, "z-index", y.o = W), y;
+      }, {
+        e: void 0,
+        t: void 0,
+        a: void 0,
+        o: void 0
+      }), $;
+    }
+  });
+}
+function He(t) {
+  return (() => {
+    var e = Te();
+    return f(e, (() => {
+      var n = D(() => !!t.icon);
+      return () => n() && (() => {
+        var i = Ee();
+        return f(i, () => t.icon), i;
+      })();
+    })(), null), f(e, (() => {
+      var n = D(() => !!t.title);
+      return () => n() && (() => {
+        var i = Oe();
+        return f(i, () => t.title), i;
+      })();
+    })(), null), f(e, (() => {
+      var n = D(() => !!t.message);
+      return () => n() && (() => {
+        var i = Ve();
+        return f(i, () => t.message), i;
+      })();
+    })(), null), e;
+  })();
+}
+const P = Ge;
+P.Content = Yt;
+P.Icon = se;
+P.Title = ye;
+P.Subtitle = xe;
+P.Status = fe;
+P.Value = De;
+P.Metrics = xt;
+P.EmptyState = Jt;
+P.SliderFill = jt;
+var Be = /* @__PURE__ */ h("<div><div>");
+const Le = {
+  blue: "bg-blue-500/30",
+  green: "bg-green-500/30",
+  red: "bg-red-500/30",
+  yellow: "bg-yellow-500/30",
+  purple: "bg-purple-500/30",
+  gray: "bg-gray-500/30"
+};
+function En(t) {
+  const e = () => Le[t.color] ?? t.color;
+  return (() => {
+    var n = Be(), i = n.firstChild;
+    return C((r) => {
+      var a = w("pointer-events-none absolute inset-0", t.class), s = j.BACKGROUND, o = w("absolute inset-0 opacity-40 blur-3xl", e());
+      return a !== r.e && k(n, r.e = a), s !== r.t && p(n, "z-index", r.t = s), o !== r.a && k(i, r.a = o), r;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0
+    }), n;
+  })();
+}
+var je = /* @__PURE__ */ h("<div>");
+function On(t) {
+  const e = R(), n = () => {
+    const i = t.spacing ?? "S2";
+    return N[i](e.size());
+  };
+  return (() => {
+    var i = je();
+    return f(i, () => t.children), C((r) => {
+      var a = w("flex flex-col", t.class), s = n();
+      return a !== r.e && k(i, r.e = a), s !== r.t && p(i, "gap", r.t = s), r;
+    }, {
+      e: void 0,
+      t: void 0
+    }), i;
+  })();
+}
+var Pe = /* @__PURE__ */ h('<span class="inline-flex size-3.5 shrink-0 items-center">'), Ue = /* @__PURE__ */ h("<button type=button>"), Fe = /* @__PURE__ */ h('<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__ */ h('<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__ */ h('<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__ */ h('<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__ */ h('<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__ */ h('<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__ */ h('<div class="min-w-0 shrink-0">'), Je = /* @__PURE__ */ h('<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__ */ h('<div class="min-h-0 flex-1 overflow-y-auto p-2 md:p-6">'), en = /* @__PURE__ */ h('<div class="flex shrink-0 justify-end pt-3">');
+function nn(t) {
+  return (() => {
+    var e = Ue();
+    return e.$$click = () => t.onClick(), f(e, O(X, {
+      get when() {
+        return t.isActive;
+      },
+      get children() {
+        var n = Pe();
+        return f(n, () => t.icon), n;
+      }
+    }), null), f(e, () => t.label, null), C(() => k(e, w("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 Vn(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] = U(e.defaultTab ?? "controls"), r = () => {
+    const l = e.maxWidth ?? "3xl";
+    return {
+      sm: "max-w-sm",
+      md: "max-w-md",
+      lg: "max-w-lg",
+      xl: "max-w-xl",
+      "2xl": "max-w-2xl",
+      "3xl": "max-w-3xl",
+      "4xl": "max-w-4xl"
+    }[l];
+  }, a = () => {
+    if (e.tabs) return e.tabs;
+    const l = [];
+    return l.push({
+      id: "edit",
+      label: "Edit",
+      icon: Fe(),
+      content: e.editContent ?? Ye()
+    }), l.push({
+      id: "controls",
+      label: "Controls",
+      icon: Xe(),
+      content: e.controlsContent ?? Ke()
+    }), l.push({
+      id: "debug",
+      label: "Debug",
+      icon: qe(),
+      content: e.debugContent ?? Ze()
+    }), l;
+  }, s = async () => {
+    if (e.debugData !== void 0)
+      try {
+        const l = typeof e.debugData == "string" ? e.debugData : JSON.stringify(e.debugData, null, 2);
+        await navigator.clipboard.writeText(l);
+      } catch {
+      }
+  }, o = () => {
+    const l = a();
+    return l.find((v) => v.id === n())?.content ?? l[0]?.content;
+  }, c = e.ResponsiveDialog, g = e.ResponsiveDialogContent, d = e.ResponsiveDialogHeader, x = e.ResponsiveDialogTitle, S = e.ResponsiveDialogDescription, u = e.Button;
+  return O(c, {
+    get open() {
+      return e.open;
+    },
+    get onOpenChange() {
+      return e.onOpenChange;
+    },
+    get children() {
+      return O(g, {
+        get class() {
+          return w(r(), e.class);
+        },
+        get children() {
+          return [O(d, {
+            class: "flex flex-row items-center justify-between gap-3",
+            get children() {
+              return [(() => {
+                var l = Qe();
+                return f(l, O(x, {
+                  class: "truncate leading-tight",
+                  get children() {
+                    return e.title;
+                  }
+                }), null), f(l, O(S, {
+                  class: "sr-only",
+                  children: "Widget configuration dialog"
+                }), null), l;
+              })(), (() => {
+                var l = Je(), b = l.firstChild;
+                return f(b, () => a().map((v) => O(nn, {
+                  get icon() {
+                    return v.icon;
+                  },
+                  get label() {
+                    return v.label;
+                  },
+                  get isActive() {
+                    return n() === v.id;
+                  },
+                  onClick: () => i(v.id)
+                }))), f(l, O(X, {
+                  get when() {
+                    return e.headerActions;
+                  },
+                  get children() {
+                    return e.headerActions;
+                  }
+                }), null), f(l, O(X, {
+                  get when() {
+                    return D(() => !!(n() === "edit" && e.onSave))() && e.hasUnsavedChanges;
+                  },
+                  get children() {
+                    return O(u, {
+                      size: "sm",
+                      onClick: () => e.onSave?.(),
+                      children: "Save"
+                    });
+                  }
+                }), null), f(l, O(X, {
+                  get when() {
+                    return D(() => n() === "edit")() && e.onDelete;
+                  },
+                  get children() {
+                    return O(u, {
+                      size: "sm",
+                      variant: "destructive",
+                      onClick: () => e.onDelete?.(),
+                      children: "Delete"
+                    });
+                  }
+                }), null), l;
+              })()];
+            }
+          }), (() => {
+            var l = tn();
+            return f(l, o), l;
+          })(), O(X, {
+            get when() {
+              return D(() => n() === "debug")() && e.debugData !== void 0;
+            },
+            get children() {
+              var l = en();
+              return f(l, O(u, {
+                size: "sm",
+                variant: "outline",
+                onClick: s,
+                children: "Copy"
+              })), l;
+            }
+          })];
+        }
+      });
+    }
+  });
+}
+pt(["click"]);
+const q = 32, m = q / 2, H = "white", J = "rgba(0,0,0,0.4)", ot = 2, tt = 3;
+function rn(t) {
+  return `url("data:image/svg+xml,${encodeURIComponent(t)}")`;
+}
+function et(t) {
+  return `<svg xmlns="http://www.w3.org/2000/svg" width="${q}" height="${q}" viewBox="0 0 ${q} ${q}">${t}</svg>`;
+}
+const an = et(`
+  <g transform="translate(6, 2)">
+    <!-- shadow -->
+    <g stroke="${J}" stroke-width="${tt}" 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="${H}" stroke-width="${ot}" 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>
+`), sn = et(`
+  <g>
+    <circle cx="${m}" cy="${m}" r="8" stroke="${J}" stroke-width="${tt}" fill="none"/>
+    <circle cx="${m}" cy="${m}" r="8" stroke="${H}" stroke-width="1.5" fill="none"/>
+    <circle cx="${m}" cy="${m}" r="1.5" fill="${H}"/>
+  </g>
+`), on = et(`
+  <g>
+    <!-- shadow -->
+    <g stroke="${J}" stroke-width="${tt}" 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>
+    <!-- main -->
+    <g stroke="${H}" stroke-width="${ot}" 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>
+    <!-- center grip dots -->
+    <circle cx="${m}" cy="${m}" r="1.5" fill="${H}"/>
+    <circle cx="${m - 5}" cy="${m}" r="1" fill="${H}" opacity="0.6"/>
+    <circle cx="${m + 5}" cy="${m}" r="1" fill="${H}" opacity="0.6"/>
+  </g>
+`), ln = et(`
+  <g>
+    <!-- shadow -->
+    <g stroke="${J}" stroke-width="${tt}" 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>
+    <!-- main -->
+    <g stroke="${H}" stroke-width="${ot}" 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>
+    <!-- center grip dots -->
+    <circle cx="${m}" cy="${m}" r="1.5" fill="${H}"/>
+    <circle cx="${m}" cy="${m - 5}" r="1" fill="${H}" opacity="0.6"/>
+    <circle cx="${m}" cy="${m + 5}" r="1" fill="${H}" opacity="0.6"/>
+  </g>
+`);
+function Z(t, e, n) {
+  return { css: `${rn(t)} ${e} ${n}, auto`, hotspotX: e, hotspotY: n };
+}
+const F = {
+  tap: Z(an, 12, 4),
+  hold: Z(sn, 16, 16),
+  slideHorizontal: Z(on, m, m),
+  slideVertical: Z(ln, m, m)
+};
+function Wn(t, e) {
+  const n = {
+    isDown: !1,
+    startX: 0,
+    startY: 0,
+    currentX: 0,
+    currentY: 0,
+    startTime: 0,
+    hasMoved: !1,
+    holdTimer: null,
+    slideActive: !1,
+    slideActivationTimer: null,
+    lockedAxis: null,
+    element: null
+  }, i = 10, r = 5, a = () => {
+    n.holdTimer && (clearTimeout(n.holdTimer), n.holdTimer = null), n.slideActivationTimer && (clearTimeout(n.slideActivationTimer), n.slideActivationTimer = null);
+  }, s = (u) => {
+    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";
+    }
+    return (e?.() ?? "horizontal") === "horizontal" ? "horizontal" : "vertical";
+  }, o = (u) => {
+    const l = t();
+    if (!(!l.tap && !l.hold && !l.slide)) {
+      if (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), l.hold) {
+        const b = l.hold.delay ?? 300;
+        n.holdTimer = setTimeout(() => {
+          n.isDown && !n.hasMoved && (l.hold.action(), n.isDown = !1);
+        }, b);
+      }
+      if (l.slide) {
+        const b = l.slide.activationDelay ?? 0;
+        b > 0 ? n.slideActivationTimer = setTimeout(() => {
+          n.slideActive = !0;
+        }, b) : n.slideActive = !0;
+      }
+    }
+  }, c = (u) => {
+    if (!n.isDown) return;
+    const l = t();
+    n.currentX = u.clientX, n.currentY = u.clientY;
+    const b = n.currentX - n.startX, v = n.currentY - n.startY, T = Math.abs(b), $ = Math.abs(v), A = Math.sqrt(b * b + v * v), I = u.currentTarget, V = s(I);
+    if (!n.lockedAxis && A > r && (T > $ ? n.lockedAxis = "horizontal" : n.lockedAxis = "vertical", l.slide && n.lockedAxis !== V)) {
+      I.releasePointerCapture(u.pointerId), n.isDown = !1, n.slideActive = !1, a();
+      return;
+    }
+    if (A > i && (n.hasMoved = !0, a()), l.slide && n.slideActive && n.hasMoved && n.lockedAxis === V) {
+      const y = l.slide.min ?? 0, _ = l.slide.max ?? 100, G = _ - y, E = V === "vertical" ? -v : b, W = V === "vertical" ? u.currentTarget.clientHeight : u.currentTarget.clientWidth, vt = E / W * G, bt = Math.max(y, Math.min(_, l.slide.value + vt));
+      l.slide.onChange(Math.round(bt)), n.startX = n.currentX, n.startY = n.currentY, u.preventDefault();
+    }
+  }, g = (u) => {
+    if (!n.isDown) return;
+    const l = t(), b = l.hold?.delay ?? 300;
+    if (a(), l.tap && !n.hasMoved) {
+      const v = Date.now() - n.startTime;
+      n.isDown && v < b && l.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);
+  }, x = (u) => {
+    const l = t();
+    if (l.slide) {
+      const b = l.slide.orientation;
+      if (b === "horizontal") return F.slideHorizontal.css;
+      if (b === "vertical") return F.slideVertical.css;
+      const v = u.getBoundingClientRect();
+      return v.height > v.width ? F.slideVertical.css : F.slideHorizontal.css;
+    }
+    return l.tap ? F.tap.css : l.hold ? F.hold.css : "";
+  };
+  return {
+    onPointerDown: o,
+    onPointerMove: c,
+    onPointerUp: g,
+    onPointerCancel: d,
+    onPointerEnter: (u) => {
+      const l = u.currentTarget;
+      n.element = l, l.style.cursor = x(l);
+    },
+    dispose: a
+  };
+}
+function In(t) {
+  return z(() => {
+    const e = t.entities();
+    if (e.length === 0) return;
+    const n = {
+      widgetConfig: t.widgetConfig,
+      entities: e.map((i) => {
+        const r = {
+          entity_id: i.id,
+          state: i.state,
+          domain: i.domain,
+          friendly_name: i.friendlyName
+        };
+        return t.customEntityFields ? {
+          ...r,
+          ...t.customEntityFields(i)
+        } : r;
+      })
+    };
+    return t.additionalData && Object.assign(n, t.additionalData), n;
+  });
+}
+function Rn(t = {}) {
+  const [e, n] = U(!1), [i, r] = U(!1);
+  return {
+    save: async (o) => {
+      if (t.onSave) {
+        n(!0);
+        try {
+          await t.onSave(o), t.onSaveSuccess?.();
+        } finally {
+          n(!1);
+        }
+      }
+    },
+    remove: async () => {
+      if (t.onDelete) {
+        r(!0);
+        try {
+          await t.onDelete(), t.onDeleteSuccess?.();
+        } finally {
+          r(!1);
+        }
+      }
+    },
+    isSaving: e,
+    isDeleting: i
+  };
+}
+function Gn(t = "edit") {
+  const [e, n] = U(!1), [i, r] = U(t);
+  return {
+    showDialog: e,
+    setShowDialog: n,
+    openDialog: () => n(!0),
+    closeDialog: () => n(!1),
+    activeTab: i,
+    setActiveTab: r
+  };
+}
+function Hn(t) {
+  const e = z(() => t.entity() !== null), n = z(() => {
+    const r = t.entity();
+    return r ? t.calculateData(r) : null;
+  }), i = z(() => e() ? void 0 : t.emptyStateConfig);
+  return {
+    entity: t.entity,
+    data: n,
+    emptyState: i,
+    hasEntity: e
+  };
+}
+function Bn(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(() => {
+    if (!i()) return;
+    const o = t.aggregationMode?.();
+    if (!o || o === "none") return;
+    const c = t.entities();
+    if (o === "light" || o === "binary-sensor" || o === "switch")
+      return we(c, t.allEntitiesMode);
+    if (o === "sensor") {
+      const g = t.sensorGroupType?.() ?? "mean";
+      return $e(c, g, !0);
+    }
+  }), s = z(() => i() ? void 0 : t.emptyStateConfig);
+  return {
+    entities: t.entities,
+    groupData: r,
+    aggregatedData: a,
+    emptyState: s,
+    hasEntities: i,
+    count: n
+  };
+}
+function Ln(t) {
+  const [e] = zt({
+    validate: Dt(t.schema),
+    initialValues: t.initialValues
+  }), n = z(() => e.dirty), i = z(() => e.submitting);
+  return {
+    form: e,
+    isDirty: n,
+    isSubmitting: i,
+    handleSubmit: (a) => {
+      t.onSubmit?.(a);
+    },
+    getValue: Nt,
+    setValue: At,
+    reset: _t
+  };
+}
+const nt = ["xs", "sm", "md", "lg", "xl"];
+function jn() {
+  const t = R(), e = z(() => nt.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);
+  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), x = nt.indexOf(d);
+        return x >= 0 && e() >= x;
+      }
+      if (g.endsWith("-")) {
+        const d = g.slice(0, -1), x = nt.indexOf(d);
+        return x >= 0 && e() <= x;
+      }
+      return t.size() === g;
+    }
+  };
+}
+const M = {
+  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",
+  lavender: "bg-gradient-to-br from-purple-500/20 to-pink-500/20",
+  golden: "bg-gradient-to-br from-yellow-500/20 to-orange-600/20",
+  midnight: "bg-gradient-to-br from-blue-700/20 to-indigo-900/20",
+  rose: "bg-gradient-to-br from-pink-400/20 to-red-500/20",
+  mint: "bg-gradient-to-br from-green-400/20 to-cyan-500/20",
+  slate: "bg-gradient-to-br from-slate-600/20 to-slate-800/20",
+  coral: "bg-gradient-to-br from-pink-300/20 to-rose-400/20",
+  aurora: "bg-gradient-to-br from-blue-500/20 to-cyan-400/20",
+  ember: "bg-gradient-to-br from-red-500/20 to-yellow-500/20",
+  steel: "bg-gradient-to-br from-gray-500/20 to-gray-700/20",
+  twilight: "bg-gradient-to-br from-violet-600/20 to-indigo-700/20",
+  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"
+}, Pn = {
+  ocean: "Ocean Breeze",
+  sunset: "Sunset Glow",
+  forest: "Forest Dawn",
+  lavender: "Lavender Dreams",
+  golden: "Golden Hour",
+  midnight: "Deep Ocean",
+  rose: "Rose Garden",
+  mint: "Mint Fresh",
+  slate: "Midnight",
+  coral: "Cherry Blossom",
+  aurora: "Electric Blue",
+  ember: "Autumn Leaves",
+  steel: "Steel",
+  twilight: "Twilight",
+  sage: "Sage",
+  copper: "Copper",
+  dusk: "Dusk"
+}, Un = Object.keys(M);
+function gt(t) {
+  const e = Object.keys(M);
+  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 Fn(t, e) {
+  if (!t) {
+    const i = gt(e);
+    return M[i];
+  }
+  if (typeof t == "string" && t in M)
+    return M[t];
+  if (typeof t == "string")
+    return t;
+  const n = gt(e);
+  return M[n];
+}
+const Y = {
+  ocean: {
+    gradient: M.ocean,
+    bg: "bg-cyan-600/20",
+    icon: "bg-cyan-500 dark:bg-cyan-400",
+    glow: "shadow-cyan-500/50 dark:shadow-cyan-400/50",
+    text: {
+      primary: "text-cyan-400 dark:text-cyan-300",
+      muted: "text-cyan-400/60 dark:text-cyan-300/60"
+    }
+  },
+  sunset: {
+    gradient: M.sunset,
+    bg: "bg-orange-500/20",
+    icon: "bg-orange-500 dark:bg-orange-400",
+    glow: "shadow-orange-500/50 dark:shadow-orange-400/50",
+    text: {
+      primary: "text-orange-400 dark:text-orange-300",
+      muted: "text-orange-400/60 dark:text-orange-300/60"
+    }
+  },
+  forest: {
+    gradient: M.forest,
+    bg: "bg-emerald-600/20",
+    icon: "bg-emerald-500 dark:bg-emerald-400",
+    glow: "shadow-emerald-500/50 dark:shadow-emerald-400/50",
+    text: {
+      primary: "text-emerald-400 dark:text-emerald-300",
+      muted: "text-emerald-400/60 dark:text-emerald-300/60"
+    }
+  },
+  lavender: {
+    gradient: M.lavender,
+    bg: "bg-purple-500/20",
+    icon: "bg-purple-500 dark:bg-purple-400",
+    glow: "shadow-purple-500/50 dark:shadow-purple-400/50",
+    text: {
+      primary: "text-purple-400 dark:text-purple-300",
+      muted: "text-purple-400/60 dark:text-purple-300/60"
+    }
+  },
+  golden: {
+    gradient: M.golden,
+    bg: "bg-yellow-500/20",
+    icon: "bg-yellow-500 dark:bg-yellow-400",
+    glow: "shadow-yellow-500/50 dark:shadow-yellow-400/50",
+    text: {
+      primary: "text-yellow-400 dark:text-yellow-300",
+      muted: "text-yellow-400/60 dark:text-yellow-300/60"
+    }
+  },
+  midnight: {
+    gradient: M.midnight,
+    bg: "bg-blue-700/20",
+    icon: "bg-blue-700 dark:bg-blue-600",
+    glow: "shadow-blue-700/50 dark:shadow-blue-600/50",
+    text: {
+      primary: "text-blue-400 dark:text-blue-300",
+      muted: "text-blue-400/60 dark:text-blue-300/60"
+    }
+  },
+  rose: {
+    gradient: M.rose,
+    bg: "bg-pink-400/20",
+    icon: "bg-pink-500 dark:bg-pink-400",
+    glow: "shadow-pink-500/50 dark:shadow-pink-400/50",
+    text: {
+      primary: "text-pink-400 dark:text-pink-300",
+      muted: "text-pink-400/60 dark:text-pink-300/60"
+    }
+  },
+  mint: {
+    gradient: M.mint,
+    bg: "bg-green-400/20",
+    icon: "bg-green-500 dark:bg-green-400",
+    glow: "shadow-green-500/50 dark:shadow-green-400/50",
+    text: {
+      primary: "text-green-400 dark:text-green-300",
+      muted: "text-green-400/60 dark:text-green-300/60"
+    }
+  },
+  slate: {
+    gradient: M.slate,
+    bg: "bg-slate-600/20",
+    icon: "bg-slate-600 dark:bg-slate-500",
+    glow: "shadow-slate-600/50 dark:shadow-slate-500/50",
+    text: {
+      primary: "text-slate-400 dark:text-slate-300",
+      muted: "text-slate-400/60 dark:text-slate-300/60"
+    }
+  },
+  coral: {
+    gradient: M.coral,
+    bg: "bg-pink-300/20",
+    icon: "bg-pink-400 dark:bg-pink-300",
+    glow: "shadow-pink-400/50 dark:shadow-pink-300/50",
+    text: {
+      primary: "text-pink-400 dark:text-pink-300",
+      muted: "text-pink-400/60 dark:text-pink-300/60"
+    }
+  },
+  aurora: {
+    gradient: M.aurora,
+    bg: "bg-blue-500/20",
+    icon: "bg-blue-500 dark:bg-blue-400",
+    glow: "shadow-blue-500/50 dark:shadow-blue-400/50",
+    text: {
+      primary: "text-blue-400 dark:text-blue-300",
+      muted: "text-blue-400/60 dark:text-blue-300/60"
+    }
+  },
+  ember: {
+    gradient: M.ember,
+    bg: "bg-red-500/20",
+    icon: "bg-red-500 dark:bg-red-400",
+    glow: "shadow-red-500/50 dark:shadow-red-400/50",
+    text: {
+      primary: "text-red-400 dark:text-red-300",
+      muted: "text-red-400/60 dark:text-red-300/60"
+    }
+  },
+  steel: {
+    gradient: M.steel,
+    bg: "bg-gray-500/20",
+    icon: "bg-gray-500 dark:bg-gray-400",
+    glow: void 0,
+    text: {
+      primary: "text-gray-400 dark:text-gray-300",
+      muted: "text-gray-400/60 dark:text-gray-300/60"
+    }
+  },
+  twilight: {
+    gradient: M.twilight,
+    bg: "bg-violet-600/20",
+    icon: "bg-violet-500 dark:bg-violet-400",
+    glow: "shadow-violet-500/50 dark:shadow-violet-400/50",
+    text: {
+      primary: "text-violet-400 dark:text-violet-300",
+      muted: "text-violet-400/60 dark:text-violet-300/60"
+    }
+  },
+  sage: {
+    gradient: M.sage,
+    bg: "bg-lime-600/20",
+    icon: "bg-lime-500 dark:bg-lime-400",
+    glow: "shadow-lime-500/50 dark:shadow-lime-400/50",
+    text: {
+      primary: "text-lime-400 dark:text-lime-300",
+      muted: "text-lime-400/60 dark:text-lime-300/60"
+    }
+  },
+  copper: {
+    gradient: M.copper,
+    bg: "bg-amber-600/20",
+    icon: "bg-amber-600 dark:bg-amber-500",
+    glow: "shadow-amber-600/50 dark:shadow-amber-500/50",
+    text: {
+      primary: "text-amber-400 dark:text-amber-300",
+      muted: "text-amber-400/60 dark:text-amber-300/60"
+    }
+  },
+  dusk: {
+    gradient: M.dusk,
+    bg: "bg-blue-500/20",
+    icon: "bg-blue-500 dark:bg-blue-400",
+    glow: "shadow-blue-500/50 dark:shadow-blue-400/50",
+    text: {
+      primary: "text-blue-400 dark:text-blue-300",
+      muted: "text-blue-400/60 dark:text-blue-300/60"
+    }
+  }
+}, Yn = {
+  unavailable: Y.steel,
+  active: Y.ocean,
+  inactive: Y.steel,
+  success: Y.forest,
+  warning: Y.ember,
+  error: Y.rose
+};
+let rt = null;
+function cn() {
+  return rt || (rt = getComputedStyle(document.documentElement)), rt;
+}
+function Xn(t) {
+  const e = t.startsWith("--") ? t : `--${t}`;
+  return cn().getPropertyValue(e).trim();
+}
+function Kn() {
+  return document.documentElement.classList.contains("dark");
+}
+const qn = "0.2.0";
+export {
+  Pn as GRADIENT_NAMES,
+  M as GRADIENT_PRESETS,
+  Un as GRADIENT_PRESET_KEYS,
+  En as Glow,
+  qn as SDK_VERSION,
+  j as WIDGET_Z,
+  P as Widget,
+  Yt as WidgetContent,
+  it as WidgetCtx,
+  Vn as WidgetDialog,
+  Jt as WidgetEmptyState,
+  se as WidgetIcon,
+  xt as WidgetMetrics,
+  jt as WidgetSliderFill,
+  On as WidgetStack,
+  fe as WidgetStatus,
+  xe as WidgetSubtitle,
+  ye as WidgetTitle,
+  De as WidgetValue,
+  Nn as allEntitiesInState,
+  Tn as anyEntityInState,
+  pn as applyCssVars,
+  kn as applyLayout,
+  at as builtInVariants,
+  we as calculateLightGroup,
+  $e as calculateSensorGroup,
+  Tt as classicGlass,
+  w as cn,
+  Ot as compactHorizontal,
+  $n as composeVariants,
+  An as countActiveEntities,
+  _n as countAvailableEntities,
+  Dn as countEntitiesByState,
+  Cn as createEmptyStateConfig,
+  xn as createEntity,
+  Sn as createFlexLayout,
+  vn as defineWidget,
+  ie as deriveAdaptiveIconColors,
+  wn as extendVariant,
+  Se as formatValue,
+  Vt as getBuiltInVariant,
+  yn as getBuiltInVariantIds,
+  zn as getEntityAttribute,
+  Mn as getEntityState,
+  Fn as getGradient,
+  gt as getGradientFromString,
+  Ut as getSpacingClass,
+  Xn as getThemeToken,
+  Y as gradientColorPresets,
+  Ce as interpretValue,
+  bn as isBuiltInVariant,
+  Kn as isDark,
+  pe as isEntityActive,
+  ke as isEntityAvailable,
+  st as mergeVariants,
+  Et as minimal,
+  N as spacing,
+  Yn as stateColors,
+  B as typography,
+  In as useDebugData,
+  Rn as useWidgetConfig,
+  R as useWidgetContext,
+  Gn as useWidgetDialog,
+  Hn as useWidgetEntity,
+  Bn as useWidgetEntityGroup,
+  Ln as useWidgetForm,
+  Wn as useWidgetGestures,
+  jn as useWidgetResponsive
+};