@crewhaus/hangar-ui 0.5.0

package/assets/js/views/token.js

@@ -0,0 +1,49 @@
+/**
+ * Token screen — shown on any 401. Explains where the token lives and
+ * accepts a paste; the value goes to sessionStorage only (see api.js).
+ */
+
+import { setToken } from "../api.js";
+import { clear, el } from "../dom.js";
+
+export function renderTokenScreen(root, onSaved) {
+  clear(root);
+  const input = el("input", {
+    class: "input token-input",
+    type: "password",
+    placeholder: "paste your Hangar token",
+    autocomplete: "off",
+    spellcheck: "false",
+    "aria-label": "Hangar token",
+  });
+  const save = el("button", { class: "btn btn-primary", type: "button", text: "Use token" });
+  const form = el("form", { class: "token-form" }, [input, save]);
+  form.addEventListener("submit", (e) => {
+    e.preventDefault();
+    const value = input.value.trim();
+    if (value === "") return;
+    setToken(value);
+    onSaved();
+  });
+  root.appendChild(
+    el("div", { class: "token-screen" }, [
+      el("div", { class: "card token-card" }, [
+        el("h2", { text: "Authentication required" }),
+        el("p", {
+          text:
+            "This console is token-gated. crewhaus hangar prints a ready-to-open URL " +
+            "carrying the token; if you landed here without one, read it from the token " +
+            "file on the machine running Hangar:",
+        }),
+        el("pre", { class: "mdcode", text: "~/.crewhaus/hangar/token" }),
+        el("p", {
+          text:
+            "Paste the token below. It is kept in this tab's sessionStorage only — " +
+            "never in a cookie or a query string.",
+        }),
+        form,
+      ]),
+    ]),
+  );
+  input.focus();
+}

package/dist/index.d.ts

@@ -0,0 +1,15 @@
+/** One embeddable asset: the file's text plus its HTTP content type. */
+export type HangarAsset = {
+    readonly body: string;
+    readonly contentType: string;
+};
+/** Extension → content type for everything the asset tree may contain. */
+export declare const CONTENT_TYPES: Readonly<Record<string, string>>;
+/** Content type for a serve path by extension (octet-stream fallback). */
+export declare function contentTypeFor(path: string): string;
+/**
+ * The embed map, keyed by serve path. `"/"` is the SPA shell (the app is a
+ * hash router, so `/` is the only HTML route); everything else lives under
+ * `/assets/…` exactly as laid out on disk.
+ */
+export declare const hangarAssets: Readonly<Record<string, HangarAsset>>;

package/dist/index.js

@@ -0,0 +1,145 @@
+/**
+ * `@crewhaus/hangar-ui` — the Hangar console's static UI, embedded as text.
+ *
+ * Zero-build by design: the `assets/` tree is hand-written browser code
+ * (plain ES modules + one CSS file + one HTML shell, no framework, no npm
+ * deps, no bundler). This module imports every asset `with { type: "text" }`
+ * and exports them keyed by serve path, which is the exact map the CLI hands
+ * to the hangar server's static-asset option.
+ *
+ * STATIC imports only, deliberately: `bun build --compile` embeds only what
+ * the import graph references statically — a runtime `readFileSync` of a
+ * package-relative path resolves under `/$bunfs` in the compiled binary,
+ * where the files were never placed, and bricks every command at boot. The
+ * checked-in asset files stay the single source of truth; this module only
+ * re-exports their text.
+ *
+ * The unit tests enforce the embed map's completeness (every file under
+ * `assets/` appears under its serve path, with the right content type, and
+ * every relative import inside the JS modules resolves within the map), so
+ * adding an asset file without registering it here fails CI.
+ */
+import hangarCss from "../assets/hangar.css" with { type: "text" };
+// bun-types declares `*.html` imports as HTMLBundle (Bun's HTML-bundle
+// feature) and that ambient wins over a local one, but the `type: "text"`
+// import attribute makes this a plain string at runtime — hence the cast.
+import indexHtmlBundle from "../assets/index.html" with { type: "text" };
+import apiJs from "../assets/js/api.js" with { type: "text" };
+import appJs from "../assets/js/app.js" with { type: "text" };
+import domJs from "../assets/js/dom.js" with { type: "text" };
+import keysJs from "../assets/js/keys.js" with { type: "text" };
+import markdownJs from "../assets/js/markdown.js" with { type: "text" };
+import notifyJs from "../assets/js/notify.js" with { type: "text" };
+import omniboxJs from "../assets/js/omnibox.js" with { type: "text" };
+import routerJs from "../assets/js/router.js" with { type: "text" };
+import routesJs from "../assets/js/routes.js" with { type: "text" };
+import shapesJs from "../assets/js/shapes.js" with { type: "text" };
+import supervisionJs from "../assets/js/supervision.js" with { type: "text" };
+import utilJs from "../assets/js/util.js" with { type: "text" };
+import activityViewJs from "../assets/js/views/activity.js" with { type: "text" };
+import approvalsViewJs from "../assets/js/views/approvals.js" with { type: "text" };
+import channelsViewJs from "../assets/js/views/channels.js" with { type: "text" };
+import controlViewJs from "../assets/js/views/control.js" with { type: "text" };
+import costsViewJs from "../assets/js/views/costs.js" with { type: "text" };
+import credsViewJs from "../assets/js/views/creds.js" with { type: "text" };
+import dataViewJs from "../assets/js/views/data.js" with { type: "text" };
+import deployViewJs from "../assets/js/views/deploy.js" with { type: "text" };
+import evalsLabViewJs from "../assets/js/views/evals-lab.js" with { type: "text" };
+import evalsViewJs from "../assets/js/views/evals.js" with { type: "text" };
+import feedbackViewJs from "../assets/js/views/feedback.js" with { type: "text" };
+import healthViewJs from "../assets/js/views/health.js" with { type: "text" };
+import inboxViewJs from "../assets/js/views/inbox.js" with { type: "text" };
+import inspectViewJs from "../assets/js/views/inspect.js" with { type: "text" };
+import jobsViewJs from "../assets/js/views/jobs.js" with { type: "text" };
+import libraryViewJs from "../assets/js/views/library.js" with { type: "text" };
+import memoryFabricViewJs from "../assets/js/views/memory-fabric.js" with { type: "text" };
+import memoryViewJs from "../assets/js/views/memory.js" with { type: "text" };
+import onboardingViewJs from "../assets/js/views/onboarding.js" with { type: "text" };
+import overviewViewJs from "../assets/js/views/overview.js" with { type: "text" };
+import panesViewJs from "../assets/js/views/panes.js" with { type: "text" };
+import procViewJs from "../assets/js/views/proc.js" with { type: "text" };
+import reviewViewJs from "../assets/js/views/review.js" with { type: "text" };
+import runsViewJs from "../assets/js/views/runs.js" with { type: "text" };
+import runtimeViewJs from "../assets/js/views/runtime.js" with { type: "text" };
+import schedulersViewJs from "../assets/js/views/schedulers.js" with { type: "text" };
+import securityViewJs from "../assets/js/views/security.js" with { type: "text" };
+import sessionsViewJs from "../assets/js/views/sessions.js" with { type: "text" };
+import settingsViewJs from "../assets/js/views/settings.js" with { type: "text" };
+import specEditViewJs from "../assets/js/views/spec-edit.js" with { type: "text" };
+import specViewJs from "../assets/js/views/spec.js" with { type: "text" };
+import thredzViewJs from "../assets/js/views/thredz.js" with { type: "text" };
+import tokenViewJs from "../assets/js/views/token.js" with { type: "text" };
+/** Extension → content type for everything the asset tree may contain. */
+export const CONTENT_TYPES = {
+    ".html": "text/html; charset=utf-8",
+    ".css": "text/css; charset=utf-8",
+    ".js": "text/javascript; charset=utf-8",
+    ".mjs": "text/javascript; charset=utf-8",
+    ".json": "application/json; charset=utf-8",
+    ".svg": "image/svg+xml",
+    ".txt": "text/plain; charset=utf-8",
+};
+/** Content type for a serve path by extension (octet-stream fallback). */
+export function contentTypeFor(path) {
+    const dot = path.lastIndexOf(".");
+    const ext = dot >= 0 ? path.slice(dot).toLowerCase() : "";
+    return CONTENT_TYPES[ext] ?? "application/octet-stream";
+}
+const indexHtml = indexHtmlBundle;
+function asset(body, path) {
+    return { body, contentType: contentTypeFor(path) };
+}
+/**
+ * The embed map, keyed by serve path. `"/"` is the SPA shell (the app is a
+ * hash router, so `/` is the only HTML route); everything else lives under
+ * `/assets/…` exactly as laid out on disk.
+ */
+export const hangarAssets = {
+    "/": asset(indexHtml, "index.html"),
+    "/assets/hangar.css": asset(hangarCss, "hangar.css"),
+    "/assets/js/app.js": asset(appJs, "app.js"),
+    "/assets/js/api.js": asset(apiJs, "api.js"),
+    "/assets/js/dom.js": asset(domJs, "dom.js"),
+    "/assets/js/keys.js": asset(keysJs, "keys.js"),
+    "/assets/js/markdown.js": asset(markdownJs, "markdown.js"),
+    "/assets/js/notify.js": asset(notifyJs, "notify.js"),
+    "/assets/js/omnibox.js": asset(omniboxJs, "omnibox.js"),
+    "/assets/js/router.js": asset(routerJs, "router.js"),
+    "/assets/js/routes.js": asset(routesJs, "routes.js"),
+    "/assets/js/shapes.js": asset(shapesJs, "shapes.js"),
+    "/assets/js/supervision.js": asset(supervisionJs, "supervision.js"),
+    "/assets/js/util.js": asset(utilJs, "util.js"),
+    "/assets/js/views/activity.js": asset(activityViewJs, "activity.js"),
+    "/assets/js/views/approvals.js": asset(approvalsViewJs, "approvals.js"),
+    "/assets/js/views/channels.js": asset(channelsViewJs, "channels.js"),
+    "/assets/js/views/control.js": asset(controlViewJs, "control.js"),
+    "/assets/js/views/costs.js": asset(costsViewJs, "costs.js"),
+    "/assets/js/views/creds.js": asset(credsViewJs, "creds.js"),
+    "/assets/js/views/data.js": asset(dataViewJs, "data.js"),
+    "/assets/js/views/deploy.js": asset(deployViewJs, "deploy.js"),
+    "/assets/js/views/evals-lab.js": asset(evalsLabViewJs, "evals-lab.js"),
+    "/assets/js/views/evals.js": asset(evalsViewJs, "evals.js"),
+    "/assets/js/views/feedback.js": asset(feedbackViewJs, "feedback.js"),
+    "/assets/js/views/health.js": asset(healthViewJs, "health.js"),
+    "/assets/js/views/inbox.js": asset(inboxViewJs, "inbox.js"),
+    "/assets/js/views/inspect.js": asset(inspectViewJs, "inspect.js"),
+    "/assets/js/views/jobs.js": asset(jobsViewJs, "jobs.js"),
+    "/assets/js/views/library.js": asset(libraryViewJs, "library.js"),
+    "/assets/js/views/memory-fabric.js": asset(memoryFabricViewJs, "memory-fabric.js"),
+    "/assets/js/views/memory.js": asset(memoryViewJs, "memory.js"),
+    "/assets/js/views/onboarding.js": asset(onboardingViewJs, "onboarding.js"),
+    "/assets/js/views/overview.js": asset(overviewViewJs, "overview.js"),
+    "/assets/js/views/panes.js": asset(panesViewJs, "panes.js"),
+    "/assets/js/views/proc.js": asset(procViewJs, "proc.js"),
+    "/assets/js/views/review.js": asset(reviewViewJs, "review.js"),
+    "/assets/js/views/runs.js": asset(runsViewJs, "runs.js"),
+    "/assets/js/views/runtime.js": asset(runtimeViewJs, "runtime.js"),
+    "/assets/js/views/schedulers.js": asset(schedulersViewJs, "schedulers.js"),
+    "/assets/js/views/security.js": asset(securityViewJs, "security.js"),
+    "/assets/js/views/sessions.js": asset(sessionsViewJs, "sessions.js"),
+    "/assets/js/views/settings.js": asset(settingsViewJs, "settings.js"),
+    "/assets/js/views/spec-edit.js": asset(specEditViewJs, "spec-edit.js"),
+    "/assets/js/views/spec.js": asset(specViewJs, "spec.js"),
+    "/assets/js/views/thredz.js": asset(thredzViewJs, "thredz.js"),
+    "/assets/js/views/token.js": asset(tokenViewJs, "token.js"),
+};

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@crewhaus/hangar-ui",
+  "version": "0.5.0",
+  "type": "module",
+  "description": "The Hangar web console's static UI — zero-build, dependency-free browser ES modules embedded as text assets for the single-binary CLI to hand to the hangar server",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "scripts": {
+    "test": "bun test src"
+  },
+  "license": "Apache-2.0",
+  "author": {
+    "name": "Max Meier",
+    "email": "max@crewhaus.ai",
+    "url": "https://crewhaus.ai"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/crewhaus/factory.git",
+    "directory": "packages/hangar-ui"
+  },
+  "homepage": "https://github.com/crewhaus/factory/tree/main/packages/hangar-ui#readme",
+  "bugs": {
+    "url": "https://github.com/crewhaus/factory/issues"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": ["dist", "assets", "README.md", "LICENSE", "NOTICE"]
+}