@glasshome/widget-sdk 1.1.0 → 1.2.0

package/dist/framework/fields.d.ts

@@ -8,9 +8,13 @@ export declare const widgetFields: {
     /** Optional display name override (renders as text input) */
     title: () => z.ZodOptional<z.ZodString>;
     /** Multi-select entity picker for a HA domain */
-    entityIds: (domain: string) => z.ZodDefault<z.ZodArray<z.ZodString>>;
+    entityIds: (domain: string, options?: {
+        deviceClass?: string;
+    }) => z.ZodDefault<z.ZodArray<z.ZodString>>;
     /** Single-select entity picker for a HA domain */
-    singleEntity: (domain: string) => z.ZodDefault<z.ZodArray<z.ZodString>>;
+    singleEntity: (domain: string, options?: {
+        deviceClass?: string;
+    }) => z.ZodDefault<z.ZodArray<z.ZodString>>;
     /** Area picker dropdown */
     areaId: () => z.ZodOptional<z.ZodString>;
 };

package/dist/index.js

@@ -1,12 +1,12 @@
 import { z as A } from "zod";
 import { widgetManifestSchema as xn, formatSchemaError as yn } from "@glasshome/widget-contract";
-import { effect as W, className as I, style as le, template as x, insert as p, createComponent as k, memo as T, setStyleProperty as ee, addEventListener as K, use as Se, delegateEvents as Ce } from "solid-js/web";
+import { effect as W, className as I, style as le, template as x, insert as p, createComponent as k, memo as T, setStyleProperty as ee, addEventListener as K, use as Ce, delegateEvents as Se } from "solid-js/web";
 import { createElementSize as Me } from "@solid-primitives/resize-observer";
 import { createContext as De, useContext as B, Show as E, createSignal as V, onMount as Te, createMemo as j, splitProps as _e, createEffect as se, on as ge, onCleanup as ce } from "solid-js";
 import { clsx as Oe } from "clsx";
 import { twMerge as ze } from "tailwind-merge";
 import { useService as Ee, useToggle as Ne, useTurnOff as Ae, useTurnOn as Ve } from "@glasshome/sync-layer/solid";
-import { byDomain as kn, useArea as Sn, useCamera as Cn, useConnection as Mn, useCurrency as Dn, useEntities as Tn, useEntity as _n, useEntityHistory as On, useEntityStatistics as zn, useForecast as En, useHassConfig as Nn, useLocale as An, useStore as Vn, useTemperatureUnit as Wn, useUnitSystem as Rn } from "@glasshome/sync-layer/solid";
+import { byDomain as kn, useArea as Cn, useCamera as Sn, useConnection as Mn, useCurrency as Dn, useEntities as Tn, useEntity as _n, useEntityHistory as On, useEntityStatistics as zn, useForecast as En, useHassConfig as Nn, useLocale as An, useStore as Vn, useTemperatureUnit as Wn, useUnitSystem as Rn } from "@glasshome/sync-layer/solid";
 import { getForecasts as Pn, getStream as In, getWebRtcClientConfig as Ln, sendWebRtcCandidate as Un, startWebRtcSession as jn, state as Bn, trackEntityHistory as Fn, untrackEntityHistory as Gn } from "@glasshome/sync-layer";
 function me(e) {
   return A.toJSONSchema(e, {
@@ -472,14 +472,14 @@ function rt(e, t = !1) {
     };
   const i = e.length > 1;
   if (!i) {
-    const s = e[0], f = s.state === "on", b = s.attributes?.brightness || 0, S = Math.round(b / 255 * 100);
+    const s = e[0], f = s.state === "on", b = s.attributes?.brightness || 0, C = Math.round(b / 255 * 100);
     return {
       isGroup: !1,
       state: s.state,
       isOn: f,
       isUnavailable: s.state === "unavailable",
       brightness: b,
-      brightnessPercent: S,
+      brightnessPercent: C,
       color: fe(s),
       onCount: f ? 1 : 0,
       totalCount: 1,
@@ -503,18 +503,18 @@ function rt(e, t = !1) {
         u++;
         break;
     }
-  const h = e.length, v = u === h, y = o + u === h, g = r > 0, a = r === h, C = n === h;
+  const h = e.length, v = u === h, y = o + u === h, g = r > 0, a = r === h, S = n === h;
   let w, M;
   t ? v ? (w = "unavailable", M = !1) : o > 0 || u > 0 ? (w = "unknown", M = !1) : n > 0 ? (w = "off", M = !1) : (w = "on", M = !0) : v ? (w = "unavailable", M = !1) : y ? (w = "unknown", M = !1) : g ? (w = "on", M = !0) : (w = "off", M = !1);
   const O = $ > 0 ? Math.round(d / $) : 0, L = Math.round(O / 255 * 100);
   let F;
   if (m.length > 0) {
-    const s = Math.round(m.reduce((z, D) => z + D[0], 0) / m.length), f = Math.round(m.reduce((z, D) => z + D[1], 0) / m.length), b = Math.round(m.reduce((z, D) => z + D[2], 0) / m.length), S = O / 255;
-    F = `rgb(${Math.round(s * S)}, ${Math.round(f * S)}, ${Math.round(b * S)})`;
+    const s = Math.round(m.reduce((z, D) => z + D[0], 0) / m.length), f = Math.round(m.reduce((z, D) => z + D[1], 0) / m.length), b = Math.round(m.reduce((z, D) => z + D[2], 0) / m.length), C = O / 255;
+    F = `rgb(${Math.round(s * C)}, ${Math.round(f * C)}, ${Math.round(b * C)})`;
   } else
     F = fe(e[0]);
   let H;
-  return a ? H = "All on" : C ? H = "All off" : r > 0 ? H = `${r} of ${h} on` : H = "Off", {
+  return a ? H = "All on" : S ? H = "All off" : r > 0 ? H = `${r} of ${h} on` : H = "Off", {
     isGroup: i,
     state: w,
     isOn: M,
@@ -539,14 +539,14 @@ function ot(e, t = "mean", i = !0) {
   const r = e.length > 1;
   if (!r) {
     const g = e[0], a = Number.parseFloat(g.state);
-    let C = g.state;
-    return Number.isNaN(a) || (C = Number.isInteger(a) ? a.toString() : a.toFixed(1)), {
+    let S = g.state;
+    return Number.isNaN(a) || (S = Number.isInteger(a) ? a.toString() : a.toFixed(1)), {
       isGroup: !1,
-      state: C,
+      state: S,
       numericValue: Number.isNaN(a) ? null : a,
       isUnavailable: g.state === "unavailable",
       unit: g.unitOfMeasurement ?? void 0,
-      description: C
+      description: S
     };
   }
   const n = [], o = [];
@@ -594,7 +594,7 @@ function ot(e, t = "mean", i = !0) {
       h = n.reduce((g, a) => g + a, 0) / n.length, v = "Average";
       break;
     case "median": {
-      const g = [...n].sort((C, w) => C - w), a = Math.floor(g.length / 2);
+      const g = [...n].sort((S, w) => S - w), a = Math.floor(g.length / 2);
       h = g.length % 2 === 0 ? (g[a - 1] + g[a]) / 2 : g[a], v = "Median";
       break;
     }
@@ -611,7 +611,7 @@ function ot(e, t = "mean", i = !0) {
       h = n.reduce((g, a) => g * a, 1), v = "Product";
       break;
     case "std_dev": {
-      const g = n.reduce((C, w) => C + w, 0) / n.length, a = n.reduce((C, w) => C + (w - g) ** 2, 0) / n.length;
+      const g = n.reduce((S, w) => S + w, 0) / n.length, a = n.reduce((S, w) => S + (w - g) ** 2, 0) / n.length;
       h = Math.sqrt(a), v = "Std Dev";
       break;
     }
@@ -740,10 +740,10 @@ function pt(e) {
   return k(P.Provider, {
     value: o,
     get children() {
-      var a = gt(), C = a.firstChild;
-      return K(a, "pointercancel", g), K(a, "pointerup", y), K(a, "pointermove", v), K(a, "pointerdown", h), K(a, "pointerenter", m), Se((w) => {
+      var a = gt(), S = a.firstChild;
+      return K(a, "pointercancel", g), K(a, "pointerup", y), K(a, "pointermove", v), K(a, "pointerdown", h), K(a, "pointerenter", m), Ce((w) => {
         r(w), e.gestures?.bindElement(w);
-      }, a), p(C, (() => {
+      }, a), p(S, (() => {
         var w = T(() => !!e.emptyState);
         return () => w() ? k(bt, {
           get icon() {
@@ -764,7 +764,7 @@ function pt(e) {
         })();
       })(), null), W((w) => {
         var M = R("glasshome-widget", "relative h-full w-full select-none overflow-hidden rounded-xl border border-border/50", u()?.styles?.class, e.class), O = d(), L = J.CONTENT;
-        return M !== w.e && I(a, w.e = M), w.t = le(a, O, w.t), L !== w.a && ee(C, "z-index", w.a = L), w;
+        return M !== w.e && I(a, w.e = M), w.t = le(a, O, w.t), L !== w.a && ee(S, "z-index", w.a = L), w;
       }, {
         e: void 0,
         t: void 0,
@@ -804,7 +804,7 @@ q.Title = it;
 q.Status = et;
 q.Value = ut;
 q.SliderFill = Ge;
-var xt = /* @__PURE__ */ x('<span class="inline-flex size-3.5 shrink-0 items-center">'), yt = /* @__PURE__ */ x("<button type=button>"), $t = /* @__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">'), kt = /* @__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'), St = /* @__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>'), Ct = /* @__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'), Mt = /* @__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">'), Dt = /* @__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'), Tt = /* @__PURE__ */ x('<div class="min-w-0 shrink-0">'), _t = /* @__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">'), Ot = /* @__PURE__ */ x('<div class="min-h-0 flex-1 overflow-y-auto [scrollbar-gutter:stable]">'), zt = /* @__PURE__ */ x('<div class="flex shrink-0 items-center justify-end gap-2 border-border/50 border-t pt-3">');
+var xt = /* @__PURE__ */ x('<span class="inline-flex size-3.5 shrink-0 items-center">'), yt = /* @__PURE__ */ x("<button type=button>"), $t = /* @__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">'), kt = /* @__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'), Ct = /* @__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>'), St = /* @__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'), Mt = /* @__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">'), Dt = /* @__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'), Tt = /* @__PURE__ */ x('<div class="min-w-0 shrink-0">'), _t = /* @__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">'), Ot = /* @__PURE__ */ x('<div class="min-h-0 flex-1 overflow-y-auto [scrollbar-gutter:stable]">'), zt = /* @__PURE__ */ x('<div class="flex shrink-0 items-center justify-end gap-2 border-border/50 border-t pt-3">');
 function Et(e) {
   return (() => {
     var t = yt();
@@ -847,7 +847,7 @@ function an(e) {
       "3xl": "max-w-3xl",
       "4xl": "max-w-4xl"
     }[c];
-  }, C = () => {
+  }, S = () => {
     if (t.tabs) return t.tabs;
     const c = [];
     return c.push({
@@ -866,8 +866,8 @@ function an(e) {
     }), c.push({
       id: "controls",
       label: "Controls",
-      icon: St(),
-      content: t.controlsContent ?? Ct()
+      icon: Ct(),
+      content: t.controlsContent ?? St()
     }), c.push({
       id: "debug",
       label: "Debug",
@@ -882,14 +882,14 @@ function an(e) {
       } catch {
       }
   }, M = () => {
-    const c = C();
+    const c = S();
     return c.find((N) => N.id === y())?.content ?? c[0]?.content;
-  }, O = t.ResponsiveDialog, L = t.ResponsiveDialogContent, F = t.ResponsiveDialogHeader, H = t.ResponsiveDialogTitle, s = t.ResponsiveDialogDescription, f = t.Button, b = t.SchemaForm, S = (c) => i() ? $(c) : t.onOpenChange(c), z = () => i() ? d() : t.hasUnsavedChanges, D = () => i() ? m : t.onSave;
+  }, O = t.ResponsiveDialog, L = t.ResponsiveDialogContent, F = t.ResponsiveDialogHeader, H = t.ResponsiveDialogTitle, s = t.ResponsiveDialogDescription, f = t.Button, b = t.SchemaForm, C = (c) => i() ? $(c) : t.onOpenChange(c), z = () => i() ? d() : t.hasUnsavedChanges, D = () => i() ? m : t.onSave;
   return k(O, {
     get open() {
       return t.open;
     },
-    onOpenChange: (c) => S(c),
+    onOpenChange: (c) => C(c),
     get children() {
       return k(L, {
         get class() {
@@ -912,7 +912,7 @@ function an(e) {
                 }), null), c;
               })(), (() => {
                 var c = _t(), Y = c.firstChild;
-                return p(Y, () => C().map((N) => k(Et, {
+                return p(Y, () => S().map((N) => k(Et, {
                   get icon() {
                     return N.icon;
                   },
@@ -988,7 +988,7 @@ function an(e) {
     }
   });
 }
-Ce(["click"]);
+Se(["click"]);
 function sn(e) {
   if (typeof IntersectionObserver > "u")
     return () => !1;
@@ -1186,8 +1186,8 @@ function un(e, t) {
     s !== u && (d && d.disconnect(), d = new ResizeObserver((f) => {
       const b = f[0];
       if (b) {
-        const S = b.borderBoxSize?.[0];
-        S ? o = { width: S.inlineSize, height: S.blockSize } : o = { width: b.contentRect.width, height: b.contentRect.height }, m(o.height > o.width);
+        const C = b.borderBoxSize?.[0];
+        C ? o = { width: C.inlineSize, height: C.blockSize } : o = { width: b.contentRect.width, height: b.contentRect.height }, m(o.height > o.width);
       }
     }), u = s, d.observe(s), o = { width: s.clientWidth, height: s.clientHeight }, m(o.height > o.width));
   }
@@ -1213,22 +1213,22 @@ function un(e, t) {
         } catch {
         }
     }
-  }, C = (s) => {
+  }, S = (s) => {
     if (!n.isDown) return;
-    const f = e(), b = s.clientX - n.startX, S = s.clientY - n.startY;
-    if (Math.sqrt(b * b + S * S) > 10 && (v(), n.hasMoved = !0), f.slide && n.hasMoved) {
+    const f = e(), b = s.clientX - n.startX, C = s.clientY - n.startY;
+    if (Math.sqrt(b * b + C * C) > 10 && (v(), n.hasMoved = !0), f.slide && n.hasMoved) {
       const D = s.currentTarget, c = g(D);
       if (n.isTouch && !n.sliding) {
-        const $e = Math.abs(c === "vertical" ? S : b), ke = Math.abs(c === "vertical" ? b : S);
+        const $e = Math.abs(c === "vertical" ? C : b), ke = Math.abs(c === "vertical" ? b : C);
         if ($e < ke) return;
       }
       n.sliding = !0;
-      const Y = f.slide.min ?? 0, N = f.slide.max ?? 100, we = N - Y, pe = c === "vertical" ? -S : b, ue = o ?? { width: D.clientWidth, height: D.clientHeight }, be = c === "vertical" ? ue.height : ue.width, xe = pe / be * we, ye = Math.max(Y, Math.min(N, f.slide.value + xe));
+      const Y = f.slide.min ?? 0, N = f.slide.max ?? 100, we = N - Y, pe = c === "vertical" ? -C : b, ue = o ?? { width: D.clientWidth, height: D.clientHeight }, be = c === "vertical" ? ue.height : ue.width, xe = pe / be * we, ye = Math.max(Y, Math.min(N, f.slide.value + xe));
       f.slide.onChange(Math.round(ye)), n.startX = s.clientX, n.startY = s.clientY, s.preventDefault();
     }
   }, w = (s) => {
-    const f = e(), b = n.isDown, S = Date.now() - n.startTime, z = f.hold?.delay ?? 300;
-    v(), b && f.tap && !n.hasMoved && S < z && f.tap();
+    const f = e(), b = n.isDown, C = Date.now() - n.startTime, z = f.hold?.delay ?? 300;
+    v(), b && f.tap && !n.hasMoved && C < z && f.tap();
     try {
       s.currentTarget.releasePointerCapture(s.pointerId);
     } catch {
@@ -1251,7 +1251,7 @@ function un(e, t) {
   };
   return {
     onPointerDown: a,
-    onPointerMove: C,
+    onPointerMove: S,
     onPointerUp: w,
     onPointerCancel: M,
     onPointerEnter: (s) => {
@@ -1304,9 +1304,18 @@ const gn = Object.fromEntries(
   /** Optional display name override (renders as text input) */
   title: () => A.string().optional().meta({ title: "Title", description: "Optional display name override" }),
   /** Multi-select entity picker for a HA domain */
-  entityIds: (e) => A.array(A.string()).default([]).meta({ domain: e, title: "Entities" }),
+  entityIds: (e, t) => A.array(A.string()).default([]).meta({
+    domain: e,
+    title: "Entities",
+    ...t?.deviceClass ? { deviceClass: t.deviceClass } : {}
+  }),
   /** Single-select entity picker for a HA domain */
-  singleEntity: (e) => A.array(A.string()).default([]).meta({ domain: e, title: "Entity", singleSelect: !0 }),
+  singleEntity: (e, t) => A.array(A.string()).default([]).meta({
+    domain: e,
+    title: "Entity",
+    singleSelect: !0,
+    ...t?.deviceClass ? { deviceClass: t.deviceClass } : {}
+  }),
   /** Area picker dropdown */
   areaId: () => A.string().optional().meta({ formType: "area-picker", title: "Area" })
 };
@@ -1340,7 +1349,7 @@ function mn(e) {
 function vn() {
   return document.documentElement.classList.contains("dark");
 }
-const Lt = "1.1.0", Ut = {
+const Lt = "1.2.0", Ut = {
   version: Lt
 }, wn = Ut.version;
 export {
@@ -1376,8 +1385,8 @@ export {
   gn as svgColors,
   Fn as trackEntityHistory,
   Gn as untrackEntityHistory,
-  Sn as useArea,
-  Cn as useCamera,
+  Cn as useArea,
+  Sn as useCamera,
   Mn as useConnection,
   Dn as useCurrency,
   Tn as useEntities,

package/dist/vite/index.js

@@ -1,26 +1,26 @@
-import { createHash as _ } from "node:crypto";
-import { existsSync as l, rmSync as R, mkdirSync as D, readdirSync as I, statSync as k, readFileSync as w, writeFileSync as p } from "node:fs";
+import { createHash as R } from "node:crypto";
+import { existsSync as l, rmSync as T, mkdirSync as D, readdirSync as I, statSync as P, readFileSync as g, writeFileSync as w } from "node:fs";
 import { createRequire as F } from "node:module";
-import { resolve as a, join as d, dirname as y, sep as x } from "node:path";
-import { fileURLToPath as T } from "node:url";
-import { widgetManifestSchema as U, formatSchemaError as C } from "@glasshome/widget-contract";
-import H from "@tailwindcss/vite";
+import { resolve as c, join as u, dirname as y, sep as x } from "node:path";
+import { fileURLToPath as H } from "node:url";
+import { widgetManifestSchema as U, formatSchemaError as A } from "@glasshome/widget-contract";
+import C from "@tailwindcss/vite";
 function L(e) {
   const t = JSON.stringify(e, Object.keys(e).sort());
-  return _("sha256").update(t).digest("hex").slice(0, 16);
+  return R("sha256").update(t).digest("hex").slice(0, 16);
 }
-const J = "virtual:glasshome-widget", P = "\0virtual:glasshome-widget", A = "/@glasshome/preview";
-function h(e) {
+const V = "virtual:glasshome-widget", E = "\0virtual:glasshome-widget", B = "/@glasshome/preview";
+function p(e) {
   return x === "\\" ? e.split(x).join("/") : e;
 }
 function S() {
-  const e = T(import.meta.url);
-  return a(y(e), "../../preview");
+  const e = H(import.meta.url);
+  return c(y(e), "../../preview");
 }
-function $(e) {
+function k(e) {
   return e === "solid-js" || e.startsWith("solid-js/") || e === "@glasshome/widget-sdk" || e.startsWith("@glasshome/widget-sdk/") || e === "@glasshome/ui" || e.startsWith("@glasshome/ui/");
 }
-function j() {
+function O() {
   return {
     name: "glasshome-widget:sync-layer-guard",
     apply: "build",
@@ -33,35 +33,57 @@ function j() {
     }
   };
 }
-const B = "node_modules/.cache/glasshome-widgets";
-function E(e) {
+const J = "node_modules/.cache/glasshome-widgets";
+function $(e) {
   try {
-    return F(d(process.cwd(), "package.json")).resolve(e);
+    return F(u(process.cwd(), "package.json")).resolve(e);
   } catch {
     return null;
   }
 }
-function O(e, t, n) {
-  const o = a(e, B);
-  D(o, { recursive: !0 });
-  const i = E("@glasshome/ui/styles");
-  if (!i)
+const G = [
+  "--radius",
+  "--background",
+  "--foreground",
+  "--card",
+  "--primary",
+  "--border",
+  "--muted",
+  "--accent"
+];
+function j(e, t) {
+  const i = u(e, `${t}.css`);
+  if (!l(i)) return;
+  const n = g(i, "utf-8");
+  for (const o of n.matchAll(/:host[^{]*\{([^}]*)\}/g)) {
+    const s = o[1] ?? "", r = G.find((a) => s.includes(`${a}:`));
+    if (r)
+      throw new Error(
+        `[glasshome-widget] "${t}.css" defines theme variable "${r}" on :host. Theme variables must inherit from the document so widgets follow the household theme — never re-scope them into the widget's shadow root.`
+      );
+  }
+}
+function N(e, t, i) {
+  const n = c(e, J);
+  D(n, { recursive: !0 });
+  const o = $("@glasshome/ui/styles");
+  if (!o)
     throw new Error(
       "[widget-sdk] @glasshome/ui is required to build widgets (it provides the theme every GlassHome widget ships with). Add it to your widget's dependencies."
     );
-  const s = a(y(i), "../.."), r = E("@glasshome/widget-sdk/tailwind-sources"), c = r ? y(r) : null, g = [
-    d(s, "src"),
-    d(s, "dist"),
-    ...c ? [d(c, "src"), d(c, "dist")] : [],
-    y(n)
-  ].filter((u) => l(u)), m = a(o, `${t}.tailwind.css`);
-  p(
+  const s = c(y(o), "../.."), r = $("@glasshome/widget-sdk/tailwind-sources"), a = r ? y(r) : null, h = [
+    u(s, "src"),
+    u(s, "dist"),
+    ...a ? [u(a, "src"), u(a, "dist")] : [],
+    y(i)
+  ].filter((d) => l(d)), m = c(n, `${t}.tailwind.css`);
+  w(
     m,
     [
       '@import "tailwindcss" source(none);',
       '@import "tw-animate-css";',
       '@import "@glasshome/ui/styles/theme";',
-      ...g.map((u) => `@source "${h(u)}";`),
+      ...h.map((d) => `@source "${p(d)}";`),
       "@custom-variant dark {",
       "  &:is(.dark *) { @slot }",
       "  :host(.dark) & { @slot }",
@@ -70,84 +92,84 @@ function O(e, t, n) {
     ].join(`
 `)
   );
-  const f = a(o, `${t}.entry.ts`);
-  return p(
+  const f = c(n, `${t}.entry.ts`);
+  return w(
     f,
     [
-      `import "${h(m)}";`,
-      `export { default } from "${h(n)}";`,
+      `import "${p(m)}";`,
+      `export { default } from "${p(i)}";`,
       ""
     ].join(`
 `)
   ), f;
 }
-function W() {
-  const e = H();
+function _() {
+  const e = C();
   for (const t of e)
     t.apply ??= "build";
   return e;
 }
-function G(e) {
+function q(e) {
   const t = [];
   if (!l(e)) return t;
-  for (const n of I(e)) {
-    const o = a(e, n);
-    if (!k(o).isDirectory()) continue;
-    const i = a(o, "index.tsx"), s = a(o, "manifest.json");
-    l(i) && l(s) && t.push({ name: n, entry: i });
+  for (const i of I(e)) {
+    const n = c(e, i);
+    if (!P(n).isDirectory()) continue;
+    const o = c(n, "index.tsx"), s = c(n, "manifest.json");
+    l(o) && l(s) && t.push({ name: i, entry: o });
   }
   return t;
 }
-function V(e, t) {
-  const n = [];
+function z(e, t) {
+  const i = [];
   if (l(e))
-    for (const i of I(e)) {
-      if (!k(d(e, i)).isDirectory()) continue;
-      const s = d(e, i, "manifest.json");
+    for (const o of I(e)) {
+      if (!P(u(e, o)).isDirectory()) continue;
+      const s = u(e, o, "manifest.json");
       if (!l(s)) continue;
       const r = U.safeParse(
-        JSON.parse(w(s, "utf-8"))
+        JSON.parse(g(s, "utf-8"))
       );
       if (!r.success)
         throw new Error(
-          `[registry] Invalid manifest for "${i}": ${C(r.error)}`
+          `[registry] Invalid manifest for "${o}": ${A(r.error)}`
         );
-      const c = l(d(t, `${i}.css`));
-      n.push({
+      const a = l(u(t, `${o}.css`));
+      i.push({
         ...r.data,
-        bundleUrl: `./${i}.js`,
-        ...c ? { cssUrl: `./${i}.css` } : {}
+        bundleUrl: `./${o}.js`,
+        ...a ? { cssUrl: `./${o}.css` } : {}
       });
     }
-  const o = {
+  const n = {
     version: 1,
     generatedAt: (/* @__PURE__ */ new Date()).toISOString(),
     baseUrl: "./",
-    widgets: n
+    widgets: i
   };
-  l(t) || D(t, { recursive: !0 }), p(d(t, "registry.json"), JSON.stringify(o, null, 2)), console.log(`[registry] Generated registry.json with ${n.length} widget(s)`);
+  l(t) || D(t, { recursive: !0 }), w(u(t, "registry.json"), JSON.stringify(n, null, 2)), console.log(`[registry] Generated registry.json with ${i.length} widget(s)`);
 }
-async function q(e) {
-  const { build: t } = await import("vite"), n = process.cwd(), o = a(n, e?.srcDir ?? "src"), i = a(n, e?.outDir ?? "dist");
-  let s = G(o);
+async function M(e) {
+  const { build: t } = await import("vite"), i = process.cwd(), n = c(i, e?.srcDir ?? "src"), o = c(i, e?.outDir ?? "dist");
+  let s = q(n);
   if (s.length === 0) {
-    console.warn("[glasshome-widgets] No widgets found in", o);
+    console.warn("[glasshome-widgets] No widgets found in", n);
     return;
   }
   if (e?.only) {
     const r = new Set(e.only);
-    s = s.filter((c) => r.has(c.name));
+    s = s.filter((a) => r.has(a.name));
   }
-  e?.only || l(i) && R(i, { recursive: !0 }), l(i) || D(i, { recursive: !0 });
+  e?.only || l(o) && T(o, { recursive: !0 }), l(o) || D(o, { recursive: !0 });
   for (const r of s)
     await t({
       configFile: !1,
-      root: n,
-      plugins: [...W(), ...e?.plugins ?? [], j()],
+      root: i,
+      plugins: [..._(), ...e?.plugins ?? [], O()],
       ...e?.viteConfig,
       build: {
         lib: {
-          entry: O(n, r.name, r.entry),
+          entry: N(i, r.name, r.entry),
           formats: ["es"],
           fileName: r.name,
           // Widget CSS ships as a separate asset (adopted by the host's
@@ -155,19 +177,19 @@ async function q(e) {
           cssFileName: r.name
         },
         rollupOptions: {
-          external: $
+          external: k
         },
-        outDir: i,
+        outDir: o,
         emptyOutDir: !1,
         copyPublicDir: !1,
         ...e?.viteConfig?.build
       },
       logLevel: "warn"
-    });
-  V(o, i);
+    }), j(o, r.name);
+  z(n, o);
 }
-function ee(e) {
-  const t = e?.entry ?? "src/index.tsx", n = {
+function te(e) {
+  const t = e?.entry ?? "src/index.tsx", i = {
     name: "glasshome-widget:build",
     apply: "build",
     config() {
@@ -175,100 +197,101 @@ function ee(e) {
       return {
         build: {
           lib: {
-            entry: O(s, "index", a(s, t)),
+            entry: N(s, "index", c(s, t)),
             formats: ["es"],
             fileName: "index",
             cssFileName: "index"
           },
           rollupOptions: {
-            external: $
+            external: k
           }
         }
       };
     }
-  }, o = {
+  }, n = {
     name: "glasshome-widget:dev",
     apply: "serve",
     enforce: "pre",
     config() {
-      const s = S(), r = process.cwd(), c = a(r, "..", "..");
+      const s = S(), r = process.cwd(), a = c(r, "..", "..");
       return {
         server: {
           fs: {
-            allow: [s, r, c]
+            allow: [s, r, a]
           }
         }
       };
     },
     configureServer(s) {
-      const r = S(), c = d(r, "preview.html");
-      s.middlewares.use(async (g, m, f) => {
-        if (g.url === "/" || g.url === "/index.html")
+      const r = S(), a = u(r, "preview.html");
+      s.middlewares.use(async (h, m, f) => {
+        if (h.url === "/" || h.url === "/index.html")
           try {
-            let u = w(c, "utf-8");
-            u = await s.transformIndexHtml(g.url, u), m.setHeader("Content-Type", "text/html"), m.statusCode = 200, m.end(u);
-          } catch (u) {
-            f(u);
+            let d = g(a, "utf-8");
+            d = await s.transformIndexHtml(h.url, d), m.setHeader("Content-Type", "text/html"), m.statusCode = 200, m.end(d);
+          } catch (d) {
+            f(d);
           }
         else
           f();
       });
     },
     resolveId(s) {
-      if (s === A) {
+      if (s === B) {
         const r = S();
-        return h(d(r, "host.tsx"));
+        return p(u(r, "host.tsx"));
       }
-      if (s === J)
-        return P;
+      if (s === V)
+        return E;
     },
     load(s) {
-      if (s === P)
-        return `export { default } from "${h(a(process.cwd(), t))}";`;
+      if (s === E)
+        return `export { default } from "${p(c(process.cwd(), t))}";`;
     }
-  }, i = {
+  }, o = {
     name: "glasshome-widget:schema",
     apply: "build",
     async closeBundle() {
-      const s = a(process.cwd(), "dist", "index.js");
+      j(c(process.cwd(), "dist"), "index");
+      const s = c(process.cwd(), "dist", "index.js");
       if (l(s))
         try {
-          const c = (await import(`${s}?t=${Date.now()}`)).default;
-          if (!c?.configSchema) return;
-          const { z: g } = await import("zod"), m = g.toJSONSchema(c.configSchema, { unrepresentable: "any" }), f = a(process.cwd(), "manifest.json");
+          const a = (await import(`${s}?t=${Date.now()}`)).default;
+          if (!a?.configSchema) return;
+          const { z: h } = await import("zod"), m = h.toJSONSchema(a.configSchema, { unrepresentable: "any" }), f = c(process.cwd(), "manifest.json");
           if (l(f)) {
-            const b = JSON.parse(w(f, "utf-8"));
-            b.schema = m, p(f, JSON.stringify(b, null, 2));
+            const b = JSON.parse(g(f, "utf-8"));
+            b.schema = m, w(f, JSON.stringify(b, null, 2));
           }
-          const u = L(m), v = a(process.cwd(), ".schema-hash");
-          if (l(v) && w(v, "utf-8").trim() !== u) {
-            const N = c.manifest?.name ?? "unknown";
+          const d = L(m), v = c(process.cwd(), ".schema-hash");
+          if (l(v) && g(v, "utf-8").trim() !== d) {
+            const W = a.manifest?.name ?? "unknown";
             console.warn(
-              `[widget-sdk] Schema shape changed for "${N}" — verify configVersion was bumped`
+              `[widget-sdk] Schema shape changed for "${W}" — verify configVersion was bumped`
             );
           }
-          p(v, u);
+          w(v, d);
         } catch {
         }
     }
   };
-  return [...W(), n, j(), i, o];
+  return [..._(), i, O(), o, n];
 }
-function se(e) {
-  const t = e?.srcDir ?? "src", n = e?.outDir ?? "dist";
-  let o = [];
+function re(e) {
+  const t = e?.srcDir ?? "src", i = e?.outDir ?? "dist";
+  let n = [];
   return [{
     name: "glasshome-widgets:build",
     apply: "build",
     config(s) {
-      return o = (s.plugins ?? []).flat().filter(Boolean).filter(
+      return n = (s.plugins ?? []).flat().filter(Boolean).filter(
         (r) => !r.name?.startsWith("glasshome-widgets:")
       ), {
         build: {
           rollupOptions: {
             input: { __glasshome_noop: "\0glasshome-noop" }
           },
-          outDir: n,
+          outDir: i,
           copyPublicDir: !1
         }
       };
@@ -280,19 +303,19 @@ function se(e) {
       if (s === "\0glasshome-noop") return "export {}";
     },
     async closeBundle() {
-      await q({
+      await M({
         srcDir: t,
-        outDir: n,
-        plugins: o
+        outDir: i,
+        plugins: n
       });
     }
   }];
 }
 export {
-  q as buildWidgets,
-  G as discoverWidgets,
-  V as generateRegistry,
-  ee as glasshomeWidget,
-  se as glasshomeWidgets,
-  $ as isWidgetExternal
+  M as buildWidgets,
+  q as discoverWidgets,
+  z as generateRegistry,
+  te as glasshomeWidget,
+  re as glasshomeWidgets,
+  k as isWidgetExternal
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@glasshome/widget-sdk",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "description": "SDK for building GlassHome dashboard widgets with SolidJS",
   "keywords": [
     "glasshome",