@glasshome/widget-sdk 1.7.0 → 1.8.0

package/dist/deprecations.js

@@ -32,6 +32,14 @@ var e = "https://glasshome.app/docs/widget-sdk/config", t = [
 		docsUrl: e,
 		sourcePattern: "widgetFields\\.areaId\\b"
 	},
+	{
+		id: "area-by-field-name",
+		since: "1.8.0",
+		removeIn: "2.0.0",
+		replacement: "field.area()",
+		docsUrl: e,
+		sourcePattern: "\\bareaId\\s*:\\s*z\\.string\\("
+	},
 	{
 		id: "raw-zod-config",
 		since: "1.4.0",

package/dist/framework/config/index.d.ts

@@ -71,6 +71,17 @@ declare function entity(domain: string, o?: EntitiesOpts): z.ZodDefault<z.ZodArr
 declare function area(o?: {
     title?: string;
 }): z.ZodOptional<z.ZodString>;
+/**
+ * Icon name (e.g. "mdi:lightbulb"). The host renders its icon picker; the
+ * widget only declares that this field is an icon.
+ */
+declare function icon(o: {
+    title?: string;
+    default: string;
+}): z.ZodDefault<z.ZodString>;
+declare function icon(o?: {
+    title?: string;
+}): z.ZodOptional<z.ZodString>;
 declare function stringList(o: {
     title: string;
     description?: string;
@@ -89,6 +100,7 @@ export declare const field: {
     entities: typeof entities;
     entity: typeof entity;
     area: typeof area;
+    icon: typeof icon;
     stringList: typeof stringList;
     group: typeof group;
 };

package/dist/framework/fields.d.ts

@@ -4,7 +4,7 @@ import { z } from "zod";
  *
  * @deprecated since 1.4.0, removed in 2.0.0. Use the config API instead:
  * `defineConfig` + `field.*` (`field.title()`, `field.entities()`, `field.entity()`,
- * `field.area()`). See https://glasshome.app/docs/widget-sdk/config
+ * `field.area()`, `field.icon()`). See https://glasshome.app/docs/widget-sdk/config
  */
 export declare const widgetFields: {
     /**

package/dist/index.js

@@ -1246,16 +1246,23 @@ function Xt(e) {
 	});
 }
 function Zt(e) {
+	let t = l.string().meta({
+		formType: "icon-picker",
+		title: e?.title ?? "Icon"
+	});
+	return e?.default === void 0 ? t.optional() : t.default(e.default);
+}
+function Qt(e) {
 	return l.array(l.string()).default([]).meta($({
 		title: e.title,
 		description: e.description
 	}));
 }
-function Qt(e, t) {
+function $t(e, t) {
 	let n = l.object(e);
 	return n.default(Se(n)).meta({ title: t.title });
 }
-var $t = {
+var en = {
 	title: Ut,
 	text: Wt,
 	number: Gt,
@@ -1264,15 +1271,16 @@ var $t = {
 	entities: Jt,
 	entity: Yt,
 	area: Xt,
-	stringList: Zt,
-	group: Qt
+	icon: Zt,
+	stringList: Qt,
+	group: $t
 };
-function en(e) {
+function tn(e) {
 	return l.object(e);
 }
 //#endregion
 //#region src/shared/spline.ts
-function tn(e) {
+function nn(e) {
 	if (e.length < 2) return "";
 	let t = e[0], n = e[1];
 	if (!t || !n) return "";
@@ -1299,14 +1307,14 @@ function tn(e) {
 }
 //#endregion
 //#region src/theme.ts
-function nn() {
+function rn() {
 	return document.documentElement.classList.contains("dark");
 }
 //#endregion
 //#region src/version.ts
-var rn = {
+var an = {
 	name: "@glasshome/widget-sdk",
-	version: "1.7.0",
+	version: "1.8.0",
 	description: "SDK for building GlassHome dashboard widgets with SolidJS",
 	keywords: [
 		"glasshome",
@@ -1394,4 +1402,4 @@ var rn = {
 	engines: { node: ">=18" }
 }.version;
 //#endregion
-export { rn as SDK_VERSION, Vt as ToneSchema, U as Widget, Pe as WidgetContent, e as WidgetCtx, Ct as WidgetDialog, Re as WidgetIcon, o as WidgetManifestSchema, Me as WidgetSliderFill, Be as WidgetStatus, Ue as WidgetTitle, tt as WidgetValue, ee as byDomain, We as calculateLightGroup, Ge as calculateSensorGroup, Xe as countActiveEntities, en as defineConfig, Ce as defineWidget, i as deprecations, $t as field, a as formatDeprecation, s as formatSchemaError, Ye as getEntityAttribute, u as getForecasts, d as getStream, f as getWebRtcClientConfig, p as hassMediaUrl, n as injectTokens, nn as isDark, Je as isEntityActive, tn as monotoneCubicPath, m as sendWebRtcCandidate, h as startWebRtcSession, g as state, Bt as svgColors, _ as trackEntityHistory, v as untrackEntityHistory, y as useArea, b as useCamera, te as useConnection, x as useCurrency, ne as useEntities, S as useEntity, re as useEntityHistory, ie as useEntityStatistics, C as useForecast, ae as useHassConfig, wt as useIntersectionPause, oe as useLocale, Tt as useReducedMotion, Te as useService, ce as useStore, le as useTemperatureUnit, Oe as useToggle, De as useTurnOff, Ee as useTurnOn, pe as useUnitSystem, t as useWidgetContext, Et as useWidgetDialog, Dt as useWidgetEntityGroup, Lt as useWidgetGestures, Ht as widgetFields, c as z };
+export { an as SDK_VERSION, Vt as ToneSchema, U as Widget, Pe as WidgetContent, e as WidgetCtx, Ct as WidgetDialog, Re as WidgetIcon, o as WidgetManifestSchema, Me as WidgetSliderFill, Be as WidgetStatus, Ue as WidgetTitle, tt as WidgetValue, ee as byDomain, We as calculateLightGroup, Ge as calculateSensorGroup, Xe as countActiveEntities, tn as defineConfig, Ce as defineWidget, i as deprecations, en as field, a as formatDeprecation, s as formatSchemaError, Ye as getEntityAttribute, u as getForecasts, d as getStream, f as getWebRtcClientConfig, p as hassMediaUrl, n as injectTokens, rn as isDark, Je as isEntityActive, nn as monotoneCubicPath, m as sendWebRtcCandidate, h as startWebRtcSession, g as state, Bt as svgColors, _ as trackEntityHistory, v as untrackEntityHistory, y as useArea, b as useCamera, te as useConnection, x as useCurrency, ne as useEntities, S as useEntity, re as useEntityHistory, ie as useEntityStatistics, C as useForecast, ae as useHassConfig, wt as useIntersectionPause, oe as useLocale, Tt as useReducedMotion, Te as useService, ce as useStore, le as useTemperatureUnit, Oe as useToggle, De as useTurnOff, Ee as useTurnOn, pe as useUnitSystem, t as useWidgetContext, Et as useWidgetDialog, Dt as useWidgetEntityGroup, Lt as useWidgetGestures, Ht as widgetFields, c as z };

package/dist/vite/index.d.ts

@@ -3,6 +3,14 @@ export interface GlasshomeWidgetOptions {
     /** Entry file for the widget (default: "src/index.tsx") */
     entry?: string;
 }
+/**
+ * Most previews anyone will look at, and the ceiling the hub renders to.
+ *
+ * Declaring more than this used to mean the extras were quietly not rendered:
+ * the gallery looked complete and was not. Failing the build instead makes the
+ * author decide which states matter rather than discovering the loss never.
+ */
+export declare const MAX_EXAMPLES = 20;
 /**
  * Configuration-drift guard (D-11). Imports the built bundle, derives the JSON
  * Schema from its configSchema, and compares against the recorded

package/dist/vite/index.js

@@ -10,7 +10,28 @@ function v(e) {
 	let t = JSON.stringify(e, Object.keys(e).sort());
 	return r("sha256").update(t).digest("hex").slice(0, 16);
 }
-async function y(e) {
+var y = 20;
+async function b(e, t) {
+	if (e === void 0) return;
+	let n;
+	try {
+		({z: n} = await import("zod"));
+	} catch {
+		return;
+	}
+	let r = n.number().int().positive(), i = n.array(n.object({
+		config: n.record(n.string(), n.unknown()),
+		size: n.object({
+			w: r,
+			h: r
+		}),
+		label: n.string().optional()
+	})).max(20).safeParse(e);
+	if (i.success) return;
+	let a = i.error.issues.map((e) => `  examples${e.path.length ? `[${e.path.join("][")}]` : ""}: ${e.message}`).join("\n");
+	throw Error(`[widget-sdk] Invalid \`examples\` for "${t}":\n${a}\nEach example needs a \`config\` object and a \`size\` of whole positive tiles, and at most 20 are rendered.`);
+}
+async function x(e) {
 	if (!i(e.outFile)) return;
 	let t;
 	try {
@@ -18,7 +39,7 @@ async function y(e) {
 	} catch {
 		return;
 	}
-	if (!t?.configSchema) return;
+	if (await b(t?.manifest?.examples, t?.manifest?.name ?? e.widgetName), !t?.configSchema) return;
 	let n;
 	try {
 		let { z: e } = await import("zod");
@@ -47,17 +68,17 @@ async function y(e) {
 		configVersion: a
 	})}\n`);
 }
-var b = "virtual:glasshome-widget", x = "\0virtual:glasshome-widget", S = "/@glasshome/preview";
-function C(e) {
+var S = "virtual:glasshome-widget", C = "\0virtual:glasshome-widget", w = "/@glasshome/preview";
+function T(e) {
 	return h === "\\" ? e.split(h).join("/") : e;
 }
-function w() {
+function E() {
 	return m(f(g(import.meta.url)), "../../preview");
 }
-function T(e) {
+function D(e) {
 	return t(e);
 }
-function E() {
+function O() {
 	return {
 		name: "glasshome-widget:sync-layer-guard",
 		apply: "build",
@@ -67,15 +88,15 @@ function E() {
 		}
 	};
 }
-var D = "node_modules/.cache/glasshome-widgets";
-function O(e) {
+var k = "node_modules/.cache/glasshome-widgets";
+function A(e) {
 	try {
 		return d(p(process.cwd(), "package.json")).resolve(e);
 	} catch {
 		return null;
 	}
 }
-var k = [
+var j = [
 	"--radius",
 	"--background",
 	"--foreground",
@@ -85,21 +106,21 @@ var k = [
 	"--muted",
 	"--accent"
 ];
-function A(e, t) {
+function M(e, t) {
 	let n = p(e, `${t}.css`);
 	if (!i(n)) return;
 	let r = o(n, "utf-8");
 	for (let e of r.matchAll(/:host[^{]*\{([^}]*)\}/g)) {
-		let n = e[1] ?? "", r = k.find((e) => n.includes(`${e}:`));
+		let n = e[1] ?? "", r = j.find((e) => n.includes(`${e}:`));
 		if (r) throw 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 j(e, t, n) {
-	let r = m(e, D);
+function N(e, t, n) {
+	let r = m(e, k);
 	a(r, { recursive: !0 });
-	let o = O("@glasshome/ui/styles");
+	let o = A("@glasshome/ui/styles");
 	if (!o) throw 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.");
-	let s = m(f(o), "../.."), c = O("@glasshome/widget-sdk/tailwind-sources"), l = c ? f(c) : null, d = [
+	let s = m(f(o), "../.."), c = A("@glasshome/widget-sdk/tailwind-sources"), l = c ? f(c) : null, d = [
 		p(s, "src"),
 		p(s, "dist"),
 		...l ? [p(l, "src"), p(l, "dist")] : [],
@@ -109,7 +130,7 @@ function j(e, t, n) {
 		"@import \"tailwindcss\" source(none);",
 		"@import \"tw-animate-css\";",
 		"@import \"@glasshome/ui/styles/theme\";",
-		...d.map((e) => `@source "${C(e)}";`),
+		...d.map((e) => `@source "${T(e)}";`),
 		"@custom-variant dark {",
 		"  &:is(.dark *) { @slot }",
 		"  :host(.dark) & { @slot }",
@@ -118,17 +139,17 @@ function j(e, t, n) {
 	].join("\n"));
 	let g = m(r, `${t}.entry.ts`);
 	return u(g, [
-		`import "${C(h)}";`,
-		`export { default } from "${C(n)}";`,
+		`import "${T(h)}";`,
+		`export { default } from "${T(n)}";`,
 		""
 	].join("\n")), g;
 }
-function M() {
+function P() {
 	let e = _();
 	for (let t of e) t.apply ??= "build";
 	return e;
 }
-function N(e) {
+function F(e) {
 	let t = [];
 	if (!i(e)) return t;
 	for (let n of s(e)) {
@@ -142,7 +163,7 @@ function N(e) {
 	}
 	return t;
 }
-function P(t, r) {
+function I(t, r) {
 	let c = [];
 	if (i(t)) for (let a of s(t)) {
 		if (!l(p(t, a)).isDirectory()) continue;
@@ -165,8 +186,8 @@ function P(t, r) {
 	};
 	i(r) || a(r, { recursive: !0 }), u(p(r, "registry.json"), JSON.stringify(d, null, 2)), console.log(`[registry] Generated registry.json with ${c.length} widget(s)`);
 }
-async function F(e) {
-	let { build: t } = await import("vite"), n = process.cwd(), r = m(n, e?.srcDir ?? "src"), o = m(n, e?.outDir ?? "dist"), s = N(r);
+async function L(e) {
+	let { build: t } = await import("vite"), n = process.cwd(), r = m(n, e?.srcDir ?? "src"), o = m(n, e?.outDir ?? "dist"), s = F(r);
 	if (s.length === 0) {
 		console.warn("[glasshome-widgets] No widgets found in", r);
 		return;
@@ -180,33 +201,33 @@ async function F(e) {
 		configFile: !1,
 		root: n,
 		plugins: [
-			...M(),
+			...P(),
 			...e?.plugins ?? [],
-			E()
+			O()
 		],
 		...e?.viteConfig,
 		build: {
 			lib: {
-				entry: j(n, r.name, r.entry),
+				entry: N(n, r.name, r.entry),
 				formats: ["es"],
 				fileName: r.name,
 				cssFileName: r.name
 			},
-			rollupOptions: { external: T },
+			rollupOptions: { external: D },
 			outDir: o,
 			emptyOutDir: !1,
 			copyPublicDir: !1,
 			...e?.viteConfig?.build
 		},
 		logLevel: "warn"
-	}), A(o, r.name), await y({
+	}), M(o, r.name), await x({
 		outFile: p(o, `${r.name}.js`),
 		hashFile: p(f(r.entry), ".schema-hash"),
 		widgetName: r.name
 	});
-	P(r, o);
+	I(r, o);
 }
-function I(e) {
+function R(e) {
 	let t = e?.entry ?? "src/index.tsx", n = {
 		name: "glasshome-widget:build",
 		apply: "build",
@@ -214,12 +235,12 @@ function I(e) {
 			let e = process.cwd();
 			return { build: {
 				lib: {
-					entry: j(e, "index", m(e, t)),
+					entry: N(e, "index", m(e, t)),
 					formats: ["es"],
 					fileName: "index",
 					cssFileName: "index"
 				},
-				rollupOptions: { external: T }
+				rollupOptions: { external: D }
 			} };
 		}
 	}, r = {
@@ -227,7 +248,7 @@ function I(e) {
 		apply: "serve",
 		enforce: "pre",
 		config() {
-			let e = w(), t = process.cwd();
+			let e = E(), t = process.cwd();
 			return { server: { fs: { allow: [
 				e,
 				t,
@@ -235,7 +256,7 @@ function I(e) {
 			] } } };
 		},
 		configureServer(e) {
-			let t = p(w(), "preview.html");
+			let t = p(E(), "preview.html");
 			e.middlewares.use(async (n, r, i) => {
 				if (n.url === "/" || n.url === "/index.html") try {
 					let i = o(t, "utf-8");
@@ -247,17 +268,17 @@ function I(e) {
 			});
 		},
 		resolveId(e) {
-			if (e === S) return C(p(w(), "host.tsx"));
-			if (e === b) return x;
+			if (e === w) return T(p(E(), "host.tsx"));
+			if (e === S) return C;
 		},
 		load(e) {
-			if (e === x) return `export { default } from "${C(m(process.cwd(), t))}";`;
+			if (e === C) return `export { default } from "${T(m(process.cwd(), t))}";`;
 		}
 	}, i = {
 		name: "glasshome-widget:schema",
 		apply: "build",
 		async closeBundle() {
-			A(m(process.cwd(), "dist"), "index"), await y({
+			M(m(process.cwd(), "dist"), "index"), await x({
 				outFile: m(process.cwd(), "dist", "index.js"),
 				hashFile: m(process.cwd(), ".schema-hash"),
 				widgetName: "index",
@@ -266,14 +287,14 @@ function I(e) {
 		}
 	};
 	return [
-		...M(),
+		...P(),
 		n,
-		E(),
+		O(),
 		i,
 		r
 	];
 }
-function L(e) {
+function z(e) {
 	let t = e?.srcDir ?? "src", n = e?.outDir ?? "dist", r = [];
 	return [{
 		name: "glasshome-widgets:build",
@@ -292,7 +313,7 @@ function L(e) {
 			if (e === "\0glasshome-noop") return "export {}";
 		},
 		async closeBundle() {
-			await F({
+			await L({
 				srcDir: t,
 				outDir: n,
 				plugins: r
@@ -301,4 +322,4 @@ function L(e) {
 	}];
 }
 //#endregion
-export { F as buildWidgets, N as discoverWidgets, P as generateRegistry, I as glasshomeWidget, L as glasshomeWidgets, T as isWidgetExternal, y as runSchemaGuard };
+export { y as MAX_EXAMPLES, L as buildWidgets, F as discoverWidgets, I as generateRegistry, R as glasshomeWidget, z as glasshomeWidgets, D as isWidgetExternal, x as runSchemaGuard };

package/package.json

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