@glasshome/widget-cli 0.4.13 → 0.5.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@glasshome/widget-cli",
-  "version": "0.4.13",
+  "version": "0.5.0",
   "description": "CLI for creating and managing GlassHome widgets",
   "type": "module",
   "bin": {
@@ -21,7 +21,8 @@
   },
   "dependencies": {
     "@clack/prompts": "^0.10.0",
-    "@glasshome/widget-sdk": "^0.5.0",
+    "@glasshome/widget-contract": "0.1.0",
+    "@glasshome/widget-sdk": "1.0.0",
     "open": "^11.0.0",
     "semver": "^7.6.0",
     "vite-plugin-solid": "^2.11.0"

package/src/commands/connect.ts

@@ -52,8 +52,28 @@ async function uploadAndRegister(
     throw new Error(`Failed to upload bundle for ${slug}: HTTP ${uploadRes.status}`);
   }
 
+  // Widgets render in shadow roots and need their own stylesheet uploaded
+  // alongside the bundle.
+  const cssPath = resolve(distDir, `${slug}.css`);
+  let cssUrl: string | undefined;
+  if (existsSync(cssPath)) {
+    const cssRes = await fetch(`${api}/bundles/local/local/${slug}`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "text/css",
+        Authorization: `Bearer ${token}`,
+      },
+      body: readFileSync(cssPath, "utf-8"),
+    });
+    if (!cssRes.ok) {
+      throw new Error(`Failed to upload stylesheet for ${slug}: HTTP ${cssRes.status}`);
+    }
+    cssUrl = `/bundles/local/local/${slug}/bundle.css`;
+  }
+
   const manifest = { ...widget };
   delete (manifest as Record<string, unknown>).bundleUrl;
+  delete (manifest as Record<string, unknown>).cssUrl;
 
   await trpcMutate({
     apiUrl: api,
@@ -64,6 +84,7 @@ async function uploadAndRegister(
       name: slug,
       version: widget.version,
       bundleUrl: `/bundles/local/local/${slug}/bundle.js`,
+      ...(cssUrl ? { cssUrl } : {}),
       manifestJson: JSON.stringify(manifest),
     },
   });
@@ -94,7 +115,13 @@ export async function runConnect(
 ): Promise<void> {
   const distDir = resolve(cwd, "dist");
   const solid = (await import("vite-plugin-solid")).default;
-  const buildOpts = { srcDir: "src", outDir: "dist", plugins: [solid()] };
+  // delegateEvents: false — widgets run in closed shadow roots where Solid's
+  // document-level event delegation cannot see the target.
+  const buildOpts = {
+    srcDir: "src",
+    outDir: "dist",
+    plugins: [solid({ solid: { delegateEvents: false } })],
+  };
 
   // Step 1: Initial build
   const s = spinner();

package/src/commands/create.ts

@@ -10,6 +10,7 @@ import {
 } from "node:fs";
 import { dirname, join, resolve } from "node:path";
 import { cancel, confirm, isCancel, log, spinner, text } from "@clack/prompts";
+import { getCliVersion } from "../utils/version";
 import { promptWidgetDetails, scaffoldWidget } from "./add";
 
 const templateDir = resolve(import.meta.dir, "../../template");
@@ -114,11 +115,15 @@ export async function runCreate() {
     const projectDesc =
       (projectDescription as string) || `A GlassHome widget project: ${projectName}`;
 
-    // Replace project-level placeholders in package.json
+    // Replace project-level placeholders in package.json. Pin the CLI to the
+    // version that scaffolded the project (caret) so `bun widget` resolves the
+    // project-local binary and `bun update` keeps it current, instead of a
+    // stale global/bunx copy.
     const pkgPath = join(targetDir, "package.json");
     let pkgContent = readFileSync(pkgPath, "utf-8");
     pkgContent = pkgContent.replace(/PROJECT_NAME/g, projectName as string);
     pkgContent = pkgContent.replace(/PROJECT_DESCRIPTION/g, projectDesc);
+    pkgContent = pkgContent.replace(/CLI_VERSION/g, `^${getCliVersion()}`);
     writeFileSync(pkgPath, pkgContent);
 
     // Replace project-level placeholders in README.md

package/src/commands/login.ts

@@ -3,6 +3,7 @@ import { createServer, type IncomingMessage, type ServerResponse } from "node:ht
 import { log, spinner } from "@clack/prompts";
 import open from "open";
 import { getHubUrl, storeToken } from "../utils/auth";
+import { enforceCliVersion, notifyCliUpdate } from "../utils/version";
 
 // Public client: PKCE authenticates it, no client secret. The redirect is an
 // IP-loopback URI (RFC 8252) registered on the hub.
@@ -19,6 +20,11 @@ function base64url(buf: Buffer): string {
 export async function runLogin(hubUrl?: string): Promise<void> {
   const hub = hubUrl ?? getHubUrl();
 
+  // Refuse to start the OAuth dance if the hub no longer supports this CLI;
+  // otherwise a stale client fails mid-flow with an opaque redirect error.
+  await enforceCliVersion(hub);
+  await notifyCliUpdate();
+
   // Generate PKCE parameters
   const codeVerifier = base64url(randomBytes(32));
   const codeChallenge = base64url(createHash("sha256").update(codeVerifier).digest());

package/src/commands/publish.ts

@@ -1,5 +1,5 @@
 import { createHash } from "node:crypto";
-import { readFileSync } from "node:fs";
+import { existsSync, readFileSync } from "node:fs";
 import { resolve } from "node:path";
 import { cancel, isCancel, log, select, spinner } from "@clack/prompts";
 import semver from "semver";
@@ -12,6 +12,7 @@ import {
   readManifest,
   writeManifest,
 } from "../utils/manifest";
+import { enforceCliVersion } from "../utils/version";
 import { runLogin } from "./login";
 
 interface PublishOptions {
@@ -38,6 +39,10 @@ export async function runPublish(
   // Step 2: Authenticate
   const hubUrl = hubUrlOverride ?? getHubUrl();
   if (hubUrlOverride) log.info(`Hub: ${hubUrl}`);
+
+  // Stop an unsupported CLI before it uploads against a protocol it predates.
+  await enforceCliVersion(hubUrl);
+
   let token = await getToken(hubUrl);
 
   if (!token) {
@@ -187,6 +192,17 @@ export async function runPublish(
 
   const sha256Hash = createHash("sha256").update(bundleBuffer).digest("hex");
 
+  // Optional stylesheet emitted next to the bundle; published alongside it
+  // so the Hub can serve and integrity-check both.
+  const cssPath = resolve(cwd, "dist", `${widgetName}.css`);
+  let cssBuffer: Buffer | null = null;
+  if (existsSync(cssPath)) {
+    cssBuffer = Buffer.from(readFileSync(cssPath));
+  }
+  const cssSha256Hash = cssBuffer
+    ? createHash("sha256").update(cssBuffer).digest("hex")
+    : undefined;
+
   s.start(`Publishing ${manifest.name}@${version}...`);
 
   let publishData: Awaited<ReturnType<typeof requestPublish>>;
@@ -203,6 +219,9 @@ export async function runPublish(
       version,
       bundleSize: bundleBuffer.byteLength,
       sha256Hash,
+      ...(cssBuffer && cssSha256Hash
+        ? { cssSize: cssBuffer.byteLength, cssSha256Hash }
+        : {}),
       manifestJson: JSON.stringify(manifest),
     });
   } catch (err: any) {
@@ -222,11 +241,28 @@ export async function runPublish(
     process.exit(1);
   }
 
+  if (cssBuffer) {
+    if (!publishData.cssUploadUrl) {
+      s.stop(
+        `dist/${widgetName}.css exists but the Hub did not return a css upload URL — update the Hub or remove the stylesheet`,
+      );
+      process.exit(1);
+    }
+    s.message(`Uploading ${manifest.name} styles to CDN...`);
+    try {
+      await uploadToR2(publishData.cssUploadUrl, cssBuffer, "text/css");
+    } catch (err: any) {
+      s.stop(`CSS upload failed: ${err.message}`);
+      process.exit(1);
+    }
+  }
+
   s.message(`Confirming ${manifest.name}...`);
   try {
     const result = await confirmPublish(hubUrl, token!, publishData.versionId);
     s.stop(`Published ${manifest.name}@${version}`);
     log.info(`CDN: ${result.bundleUrl}`);
+    if (result.cssUrl) log.info(`CSS: ${result.cssUrl}`);
   } catch (err: any) {
     s.stop(`Confirmation failed: ${err.message}`);
     process.exit(1);

package/src/commands/validate.ts

@@ -1,6 +1,11 @@
 import { existsSync } from "node:fs";
 import { resolve } from "node:path";
 import { log, spinner } from "@clack/prompts";
+import {
+  formatSchemaError,
+  publishManifestSchema,
+  requiresCapabilities,
+} from "@glasshome/widget-contract";
 import {
   discoverWidgets,
   formatBytes,
@@ -28,9 +33,17 @@ function validateManifest(manifest: WidgetManifest): ValidationResult {
     typeof manifest.maxSize.w === "number" &&
     typeof manifest.maxSize.h === "number";
 
-  // Required fields
-  if (!manifest.name) errors.push("Missing required field: name");
-  if (!manifest.sdkVersion) errors.push("Missing required field: sdkVersion");
+  // Canonical publish-time validation shared with the Hub.
+  const schemaResult = publishManifestSchema.safeParse(manifest);
+  if (!schemaResult.success) {
+    errors.push(`Manifest schema: ${formatSchemaError(schemaResult.error)}`);
+    const capabilities = (manifest as { capabilities?: unknown }).capabilities;
+    if (manifest.sdkVersion && requiresCapabilities(manifest.sdkVersion) && capabilities === undefined) {
+      errors.push(
+        `sdkVersion "${manifest.sdkVersion}" only admits SDK >= 1.0.0, so manifest.json must declare "capabilities" — use [] if the widget never reads or controls Home Assistant`,
+      );
+    }
+  }
 
   // INS-05: "*" sdkVersion is rejected at publish time — authors must declare
   // a real range (e.g. "^0.3.0"). Installed widgets that already ship "*" are
@@ -42,13 +55,7 @@ function validateManifest(manifest: WidgetManifest): ValidationResult {
     );
   }
 
-  // Size validation
-  if (!hasValidMinSize) {
-    errors.push("minSize must be an object with numeric w and h properties");
-  }
-  if (!hasValidMaxSize) {
-    errors.push("maxSize must be an object with numeric w and h properties");
-  }
+  // Size validation (cross-field checks the schema does not cover)
   if (
     manifest.defaultSize &&
     (typeof manifest.defaultSize.w !== "number" || typeof manifest.defaultSize.h !== "number")

package/src/utils/hub-api.ts

@@ -29,6 +29,8 @@ interface PublishRequestParams {
   version: string;
   bundleSize: number;
   sha256Hash: string;
+  cssSize?: number;
+  cssSha256Hash?: string;
   manifestJson: string;
 }
 
@@ -37,11 +39,14 @@ interface PublishRequestResponse {
   cdnUrl: string;
   widgetId: string;
   versionId: string;
+  cssUploadUrl?: string;
+  cssUrl?: string;
 }
 
 interface PublishConfirmResponse {
   success: boolean;
   bundleUrl: string;
+  cssUrl?: string;
 }
 
 export async function requestPublish(
@@ -107,10 +112,14 @@ export async function confirmPublish(
   return res.json() as Promise<PublishConfirmResponse>;
 }
 
-export async function uploadToR2(uploadUrl: string, bundleBuffer: Uint8Array): Promise<void> {
+export async function uploadToR2(
+  uploadUrl: string,
+  bundleBuffer: Uint8Array,
+  contentType: string = "application/javascript",
+): Promise<void> {
   const res = await fetch(uploadUrl, {
     method: "PUT",
-    headers: { "Content-Type": "application/javascript" },
+    headers: { "Content-Type": contentType },
     body: bundleBuffer as unknown as BodyInit,
   });
 

package/src/utils/version.ts

@@ -0,0 +1,66 @@
+import { readFileSync } from "node:fs";
+import { resolve } from "node:path";
+import { log } from "@clack/prompts";
+import semver from "semver";
+
+/** This CLI's own version, read from the package.json it ships with. */
+export function getCliVersion(): string {
+  try {
+    const pkgPath = resolve(import.meta.dir, "../../package.json");
+    const pkg = JSON.parse(readFileSync(pkgPath, "utf-8")) as { version?: string };
+    return pkg.version ?? "0.0.0";
+  } catch {
+    return "0.0.0";
+  }
+}
+
+/**
+ * Ask the hub for the minimum CLI version its protocol still accepts and stop
+ * with an actionable message when this CLI is below it. Older hub-facing breaks
+ * (e.g. the 0.4.11 OAuth redirect change) surfaced as opaque errors; this turns
+ * them into "update your CLI". Network/parse failures are non-fatal: the check
+ * never blocks publishing when the hub can't be reached.
+ */
+export async function enforceCliVersion(hubUrl: string): Promise<void> {
+  const current = getCliVersion();
+
+  let minSupported: string | undefined;
+  try {
+    const res = await fetch(`${hubUrl}/api/widgets/cli-version`);
+    if (res.ok) {
+      const data = (await res.json()) as { minSupported?: string };
+      minSupported = data.minSupported;
+    }
+  } catch {
+    return;
+  }
+
+  if (minSupported && semver.valid(minSupported) && semver.lt(current, minSupported)) {
+    throw new Error(
+      `This widget CLI (${current}) is no longer supported by ${hubUrl} (minimum ${minSupported}).\n` +
+        "Update it:  bun add -g @glasshome/widget-cli@latest\n" +
+        "Or run once without installing:  bunx @glasshome/widget-cli@latest <command>",
+    );
+  }
+}
+
+/**
+ * Best-effort nudge: warn when a newer CLI is published on npm. Never blocks;
+ * any failure (offline, registry hiccup) is swallowed.
+ */
+export async function notifyCliUpdate(): Promise<void> {
+  const current = getCliVersion();
+  try {
+    const res = await fetch("https://registry.npmjs.org/@glasshome/widget-cli/latest");
+    if (!res.ok) return;
+    const data = (await res.json()) as { version?: string };
+    const latest = data.version;
+    if (latest && semver.valid(latest) && semver.gt(latest, current)) {
+      log.warn(
+        `A newer widget CLI is available (${current} → ${latest}). Update:  bun add -g @glasshome/widget-cli@latest`,
+      );
+    }
+  } catch {
+    // ignore
+  }
+}

package/template/package.json.template

@@ -16,6 +16,7 @@
     "@glasshome/widget-sdk": "^0.2.0"
   },
   "devDependencies": {
+    "@glasshome/widget-cli": "CLI_VERSION",
     "@types/bun": "latest",
     "typescript": "^5.0.0",
     "vite": "^7.3.1",