hzl-web 2.2.0 → 2.4.0

package/dist/ui/site.webmanifest

@@ -6,6 +6,18 @@
   "start_url": "/",
   "scope": "/",
   "icons": [
+    {
+      "src": "/web-app-manifest-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "any"
+    },
+    {
+      "src": "/web-app-manifest-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "any"
+    },
     {
       "src": "/web-app-manifest-192x192.png",
       "sizes": "192x192",
@@ -19,6 +31,21 @@
       "purpose": "maskable"
     }
   ],
+  "screenshots": [
+    {
+      "src": "/screenshot-wide.png",
+      "sizes": "1280x720",
+      "type": "image/png",
+      "form_factor": "wide",
+      "label": "HZL task dashboard - desktop view"
+    },
+    {
+      "src": "/screenshot-mobile.png",
+      "sizes": "390x844",
+      "type": "image/png",
+      "label": "HZL task dashboard - mobile view"
+    }
+  ],
   "theme_color": "#1a1a1a",
   "background_color": "#1a1a1a",
   "display": "standalone"

package/dist/ui-embed.d.ts

@@ -1,9 +1,9 @@
-export declare const DASHBOARD_HTML: string;
-export declare const DASHBOARD_SITE_MANIFEST: string;
-export declare const DASHBOARD_SERVICE_WORKER: string;
-export declare const DASHBOARD_FAVICON_PNG_96: Buffer<ArrayBufferLike>;
-export declare const DASHBOARD_FAVICON_ICO: Buffer<ArrayBufferLike>;
-export declare const DASHBOARD_APPLE_TOUCH_ICON: Buffer<ArrayBufferLike>;
-export declare const DASHBOARD_WEB_APP_ICON_192: Buffer<ArrayBufferLike>;
-export declare const DASHBOARD_WEB_APP_ICON_512: Buffer<ArrayBufferLike>;
+export interface EmbeddedFile {
+    content: Buffer;
+    contentType: string;
+}
+/** All files from dist/ui/ keyed by URL path (e.g. "/index.html", "/assets/main-abc.js") */
+export declare const UI_FILES: Map<string, EmbeddedFile>;
+/** Legacy dashboard HTML for the HZL_LEGACY_DASHBOARD=1 feature toggle */
+export declare const LEGACY_DASHBOARD_HTML: string;
 //# sourceMappingURL=ui-embed.d.ts.map

package/dist/ui-embed.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ui-embed.d.ts","sourceRoot":"","sources":["../src/ui-embed.ts"],"names":[],"mappings":"AAmCA,eAAO,MAAM,cAAc,QAA2B,CAAC;AACvD,eAAO,MAAM,uBAAuB,QAAiC,CAAC;AACtE,eAAO,MAAM,wBAAwB,QAAsB,CAAC;AAC5D,eAAO,MAAM,wBAAwB,yBAAoC,CAAC;AAC1E,eAAO,MAAM,qBAAqB,yBAA8B,CAAC;AACjE,eAAO,MAAM,0BAA0B,yBAAuC,CAAC;AAC/E,eAAO,MAAM,0BAA0B,yBAA+C,CAAC;AACvF,eAAO,MAAM,0BAA0B,yBAA+C,CAAC"}
+{"version":3,"file":"ui-embed.d.ts","sourceRoot":"","sources":["../src/ui-embed.ts"],"names":[],"mappings":"AAOA,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;CACrB;AAqED,4FAA4F;AAC5F,eAAO,MAAM,QAAQ,EAAE,GAAG,CAAC,MAAM,EAAE,YAAY,CAAwB,CAAC;AAExE,0EAA0E;AAC1E,eAAO,MAAM,qBAAqB,EAAE,MAWhC,CAAC"}

package/dist/ui-embed.js

@@ -1,38 +1,80 @@
-import { accessSync, readFileSync } from 'fs';
+import { existsSync, readFileSync, readdirSync, statSync } from 'fs';
 import { fileURLToPath } from 'url';
-import { dirname, join } from 'path';
+import { dirname, join, extname } from 'path';
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
-// In development, read from source. In production, this will be the dist folder.
-// For dev, we try the src folder first, then fall back to the build location.
-function resolveUiPath(relativePath) {
-    const paths = [
-        join(__dirname, 'ui', relativePath), // dist/ui/* (prod)
-        join(__dirname, '..', 'src', 'ui', relativePath), // src/ui/* (dev from dist)
+const MIME_TYPES = {
+    '.html': 'text/html; charset=utf-8',
+    '.css': 'text/css; charset=utf-8',
+    '.js': 'application/javascript; charset=utf-8',
+    '.json': 'application/json; charset=utf-8',
+    '.webmanifest': 'application/manifest+json; charset=utf-8',
+    '.png': 'image/png',
+    '.ico': 'image/x-icon',
+    '.svg': 'image/svg+xml',
+    '.woff': 'font/woff',
+    '.woff2': 'font/woff2',
+    '.txt': 'text/plain; charset=utf-8',
+};
+function getMimeType(filePath) {
+    return MIME_TYPES[extname(filePath).toLowerCase()] ?? 'application/octet-stream';
+}
+/**
+ * Resolve the ui directory path.
+ * Prefers dist/ui/ (contains Vite-built React app + copied legacy.html).
+ * Falls back to src/ui/ when dist hasn't been built yet.
+ */
+function resolveUiDir() {
+    // When running from compiled JS (dist/), __dirname is dist/ so 'ui' = dist/ui/
+    // When running from source (src/) via vitest, __dirname is src/ so we look up to dist/ui/
+    const candidates = [
+        join(__dirname, 'ui'), // dist/ui/ when running from dist/
+        join(__dirname, '..', 'dist', 'ui'), // dist/ui/ when running from src/ (vitest)
+        join(__dirname, '..', 'src', 'ui'), // src/ui/ fallback (dev without build)
     ];
-    for (const p of paths) {
-        try {
-            accessSync(p);
-            return p;
+    for (const dir of candidates) {
+        if (existsSync(dir))
+            return dir;
+    }
+    throw new Error(`Could not find ui directory - checked: ${candidates.join(', ')}`);
+}
+/**
+ * Recursively load all files from a directory into a Map keyed by URL path.
+ * e.g. dist/ui/index.html -> "/index.html", dist/ui/assets/main-abc.js -> "/assets/main-abc.js"
+ */
+function loadDirectory(dir, prefix = '') {
+    const files = new Map();
+    for (const entry of readdirSync(dir)) {
+        const fullPath = join(dir, entry);
+        const urlPath = prefix + '/' + entry;
+        if (statSync(fullPath).isDirectory()) {
+            for (const [k, v] of loadDirectory(fullPath, urlPath)) {
+                files.set(k, v);
+            }
         }
-        catch {
-            // Try next path
+        else {
+            files.set(urlPath, {
+                content: readFileSync(fullPath),
+                contentType: getMimeType(fullPath),
+            });
         }
     }
-    throw new Error(`Could not find ${relativePath} - checked: ${paths.join(', ')}`);
-}
-function loadUiText(relativePath) {
-    return readFileSync(resolveUiPath(relativePath), 'utf-8');
+    return files;
 }
-function loadUiBinary(relativePath) {
-    return readFileSync(resolveUiPath(relativePath));
-}
-export const DASHBOARD_HTML = loadUiText('index.html');
-export const DASHBOARD_SITE_MANIFEST = loadUiText('site.webmanifest');
-export const DASHBOARD_SERVICE_WORKER = loadUiText('sw.js');
-export const DASHBOARD_FAVICON_PNG_96 = loadUiBinary('favicon-96x96.png');
-export const DASHBOARD_FAVICON_ICO = loadUiBinary('favicon.ico');
-export const DASHBOARD_APPLE_TOUCH_ICON = loadUiBinary('apple-touch-icon.png');
-export const DASHBOARD_WEB_APP_ICON_192 = loadUiBinary('web-app-manifest-192x192.png');
-export const DASHBOARD_WEB_APP_ICON_512 = loadUiBinary('web-app-manifest-512x512.png');
+const uiDir = resolveUiDir();
+/** All files from dist/ui/ keyed by URL path (e.g. "/index.html", "/assets/main-abc.js") */
+export const UI_FILES = loadDirectory(uiDir);
+/** Legacy dashboard HTML for the HZL_LEGACY_DASHBOARD=1 feature toggle */
+export const LEGACY_DASHBOARD_HTML = (() => {
+    const legacyPath = join(uiDir, 'legacy.html');
+    if (existsSync(legacyPath)) {
+        return readFileSync(legacyPath, 'utf-8');
+    }
+    // Fallback: try src/ui/legacy.html when running from dist
+    const srcLegacy = join(__dirname, '..', 'src', 'ui', 'legacy.html');
+    if (existsSync(srcLegacy)) {
+        return readFileSync(srcLegacy, 'utf-8');
+    }
+    return '<html><body>Legacy dashboard not found.</body></html>';
+})();
 //# sourceMappingURL=ui-embed.js.map

package/dist/ui-embed.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui-embed.js","sourceRoot":"","sources":["../src/ui-embed.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,IAAI,CAAC;AAC9C,OAAO,EAAE,aAAa,EAAE,MAAM,KAAK,CAAC;AACpC,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,MAAM,CAAC;AAErC,MAAM,UAAU,GAAG,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AAClD,MAAM,SAAS,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;AAEtC,iFAAiF;AACjF,8EAA8E;AAC9E,SAAS,aAAa,CAAC,YAAoB;IACzC,MAAM,KAAK,GAAG;QACZ,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,YAAY,CAAC,EAAE,mBAAmB;QACxD,IAAI,CAAC,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,YAAY,CAAC,EAAE,2BAA2B;KAC9E,CAAC;IAEF,KAAK,MAAM,CAAC,IAAI,KAAK,EAAE,CAAC;QACtB,IAAI,CAAC;YACH,UAAU,CAAC,CAAC,CAAC,CAAC;YACd,OAAO,CAAC,CAAC;QACX,CAAC;QAAC,MAAM,CAAC;YACP,gBAAgB;QAClB,CAAC;IACH,CAAC;IAED,MAAM,IAAI,KAAK,CAAC,kBAAkB,YAAY,eAAe,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACnF,CAAC;AAED,SAAS,UAAU,CAAC,YAAoB;IACtC,OAAO,YAAY,CAAC,aAAa,CAAC,YAAY,CAAC,EAAE,OAAO,CAAC,CAAC;AAC5D,CAAC;AAED,SAAS,YAAY,CAAC,YAAoB;IACxC,OAAO,YAAY,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC,CAAC;AACnD,CAAC;AAED,MAAM,CAAC,MAAM,cAAc,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;AACvD,MAAM,CAAC,MAAM,uBAAuB,GAAG,UAAU,CAAC,kBAAkB,CAAC,CAAC;AACtE,MAAM,CAAC,MAAM,wBAAwB,GAAG,UAAU,CAAC,OAAO,CAAC,CAAC;AAC5D,MAAM,CAAC,MAAM,wBAAwB,GAAG,YAAY,CAAC,mBAAmB,CAAC,CAAC;AAC1E,MAAM,CAAC,MAAM,qBAAqB,GAAG,YAAY,CAAC,aAAa,CAAC,CAAC;AACjE,MAAM,CAAC,MAAM,0BAA0B,GAAG,YAAY,CAAC,sBAAsB,CAAC,CAAC;AAC/E,MAAM,CAAC,MAAM,0BAA0B,GAAG,YAAY,CAAC,8BAA8B,CAAC,CAAC;AACvF,MAAM,CAAC,MAAM,0BAA0B,GAAG,YAAY,CAAC,8BAA8B,CAAC,CAAC"}
+{"version":3,"file":"ui-embed.js","sourceRoot":"","sources":["../src/ui-embed.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hzl-web",
-  "version": "2.2.0",
+  "version": "2.4.0",
   "description": "Web dashboard for HZL - A Kanban-style task monitoring UI.",
   "type": "module",
   "main": "dist/index.js",
@@ -52,16 +52,29 @@
     "visualization"
   ],
   "dependencies": {
-    "hzl-core": "2.2.0"
+    "d3": "^7.9.0",
+    "dompurify": "^3.3.1",
+    "force-graph": "^1.51.1",
+    "marked": "^17.0.3",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "hzl-core": "2.4.0"
   },
   "devDependencies": {
+    "@types/d3": "^7.4.3",
+    "@types/dompurify": "^3.2.0",
     "@types/node": "^25.2.1",
+    "@types/react": "^19.1.0",
+    "@types/react-dom": "^19.1.0",
+    "@vitejs/plugin-react": "^4.5.2",
     "libsql": "^0.5.0",
     "typescript": "^5.3.0",
+    "vite": "^6.3.5",
     "vitest": "^4.0.18"
   },
   "scripts": {
-    "build": "tsc -b && cp -r src/ui dist/",
+    "build": "vite build && tsc -b && cp src/ui/legacy.html dist/ui/legacy.html",
+    "dev": "vite",
     "test": "vitest run",
     "test:ci": "vitest run --coverage",
     "test:watch": "vitest"