@burdenoff/fe-libs 2026.1016.3 → 2026.1017.2

package/dist/shared/assistant/voice/handsfree/playbackReference.js

@@ -18,7 +18,10 @@ function o(e, r) {
 	let i = t;
 	t = null, n = [], i();
 }
-function s(t) {
+function s() {
+	return e !== null;
+}
+function c(t) {
 	let r = e;
 	if (r) try {
 		let e = r.context.createMediaElementSource(t), i = r.context.createGain();
@@ -37,19 +40,19 @@ function s(t) {
 		]) t.addEventListener(e, () => o(a, !1));
 	} catch {}
 }
-function c() {
+function l() {
 	for (let e of n) try {
 		e.gain.gain.value = 0;
 	} catch {}
 }
-function l(e) {
+function u(e) {
 	r = e;
 }
-function u() {
+function d() {
 	return n.some((e) => e.active) ? "hosted" : r ? "device" : null;
 }
-function d() {
+function f() {
 	e = null, t = null, n = [], r = !1;
 }
 //#endregion
-export { u as activePlaybackSource, i as attachPlaybackReference, a as detachPlaybackReference, d as resetPlaybackReferenceForTest, l as setDeviceVoice, c as silencePlaybackReference, s as tapPlaybackElement };
+export { d as activePlaybackSource, i as attachPlaybackReference, a as detachPlaybackReference, s as isPlaybackReferenceAttached, f as resetPlaybackReferenceForTest, u as setDeviceVoice, l as silencePlaybackReference, c as tapPlaybackElement };

package/dist/shared/pages/AiPage.d.ts

@@ -1,13 +1,5 @@
-/**
- * AiPage Component
- *
- * Simple branded placeholder page for the /ai route across all app shells.
- * Shows product-specific AI branding with a "coming soon" state.
- */
 export interface AiPageProps {
-    /** Display name of the product (e.g., "VibeControls", "FluidGrids") */
     productName: string;
-    /** Machine-readable product identifier (e.g., "vibecontrols", "fluidgrids") */
     productId: string;
 }
 export declare function AiPage({ productName, productId }: AiPageProps): import('react/jsx-runtime').JSX.Element;

package/dist/shared/pages/AiPage.js

@@ -1,78 +1,132 @@
-import { Bot as e, Brain as t, Sparkles as n, Zap as r } from "lucide-react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { useSafeGatewayClient as e } from "../graphql/GatewayContext.js";
+import { useAuth as t } from "../providers/shell/AuthProvider.js";
+import { useActiveContext as n } from "../providers/shell/ActiveContextProvider.js";
+import { useI18n as r } from "../providers/shell/I18nProvider.js";
+import { PermissionProvider as i, usePermissions as a, useSafePermissions as o } from "../providers/shell/PermissionProvider.js";
+import { MODELS as s, PROVIDERS as c, SUMMARY as l, catalog as u, sevenDays as d, summary as f } from "./ai/contracts.js";
+import { useAiTr as p } from "./ai/i18n.js";
+import { CatalogPanel as m } from "./ai/CatalogPanel.js";
+import { SummaryPanel as h } from "./ai/SummaryPanel.js";
+import { useAiRead as g } from "./ai/useAiRead.js";
+import { useCallback as _, useMemo as v, useState as y } from "react";
+import { Fragment as b, jsx as x, jsxs as S } from "react/jsx-runtime";
 //#region src/shared/pages/AiPage.tsx
-var o = [
-	{
-		icon: t,
-		title: "Intelligent Automation",
-		description: "AI-powered workflows that adapt to your needs"
-	},
-	{
-		icon: n,
-		title: "Smart Suggestions",
-		description: "Context-aware recommendations and insights"
-	},
-	{
-		icon: r,
-		title: "Instant Analysis",
-		description: "Real-time data processing and pattern recognition"
-	}
-];
-function s({ productName: t, productId: n }) {
-	return /* @__PURE__ */ i("div", {
-		className: "flex flex-col items-center justify-center min-h-[calc(100vh-4rem)] px-4 py-12",
+function C({ productName: t, productId: n }) {
+	let r = p(), i = e("workspace");
+	return /* @__PURE__ */ S("main", {
+		className: "mx-auto w-full max-w-6xl space-y-6 px-4 py-6 sm:px-6",
 		"data-product-id": n,
-		children: /* @__PURE__ */ a("div", {
-			className: "max-w-2xl w-full text-center space-y-8",
-			children: [
-				/* @__PURE__ */ i("div", {
-					className: "flex justify-center",
-					children: /* @__PURE__ */ i("div", {
-						className: "rounded-2xl bg-action-primary-bg/10 p-4",
-						children: /* @__PURE__ */ i(e, { className: "size-12 text-action-primary-bg" })
-					})
-				}),
-				/* @__PURE__ */ a("div", {
-					className: "space-y-3",
-					children: [/* @__PURE__ */ a("h1", {
-						className: "text-3xl font-bold tracking-tight text-foreground",
-						children: [t, " AI"]
-					}), /* @__PURE__ */ a("p", {
-						className: "text-lg text-muted-foreground",
-						children: [
-							"AI-powered features for ",
-							t,
-							" are on the way. Stay tuned for intelligent capabilities that will transform how you work."
-						]
-					})]
-				}),
-				/* @__PURE__ */ i("div", {
-					className: "grid grid-cols-1 sm:grid-cols-3 gap-4 pt-4",
-					children: o.map((e) => /* @__PURE__ */ a("div", {
-						className: "rounded-xl border border-border bg-card p-5 text-left space-y-2",
-						children: [
-							/* @__PURE__ */ i(e.icon, { className: "size-5 text-action-primary-bg" }),
-							/* @__PURE__ */ i("h3", {
-								className: "text-sm font-semibold text-foreground",
-								children: e.title
-							}),
-							/* @__PURE__ */ i("p", {
-								className: "text-xs text-muted-foreground",
-								children: e.description
-							})
-						]
-					}, e.title))
-				}),
-				/* @__PURE__ */ i("div", {
-					className: "flex justify-center pt-2",
-					children: /* @__PURE__ */ a("span", {
-						className: "inline-flex items-center gap-1.5 rounded-full bg-amber-500/10 px-3 py-1 text-xs font-medium text-amber-600 dark:text-amber-400",
-						children: [/* @__PURE__ */ i("span", { className: "size-1.5 rounded-full bg-amber-500 animate-pulse" }), "Coming Soon"]
-					})
+		children: [/* @__PURE__ */ S("header", {
+			className: "space-y-2",
+			children: [/* @__PURE__ */ x("h1", {
+				className: "text-2xl font-semibold text-foreground",
+				children: r("title", "{product} AI operations", { product: t })
+			}), /* @__PURE__ */ x("p", {
+				className: "max-w-3xl text-sm text-muted-foreground",
+				children: r("intro", "Review the workspace model catalog and recorded AI usage.")
+			})]
+		}), i ? /* @__PURE__ */ x(w, { children: /* @__PURE__ */ x(T, {
+			productId: n,
+			client: i
+		}) }) : /* @__PURE__ */ x("p", {
+			role: "status",
+			children: r("unavailable", "AI operations are unavailable in this context.")
+		})]
+	});
+}
+function w({ children: e }) {
+	let t = o(), { workspaceId: r } = n();
+	return t ? e : /* @__PURE__ */ x(i, {
+		scopeId: r ?? null,
+		gateway: "workspace",
+		children: e
+	});
+}
+function T({ productId: e, client: i }) {
+	let o = t(), { workspaceId: C } = n(), w = a(), { locale: T } = r(), E = p(), D = v(() => ({
+		workspaceId: C ?? "",
+		actorId: o.user?.id ?? "",
+		profileId: o.activeProfileId,
+		accessToken: o.tokens?.accessToken ?? null,
+		workspaceToken: o.workspaceToken
+	}), [
+		C,
+		o.user?.id,
+		o.activeProfileId,
+		o.tokens?.accessToken,
+		o.workspaceToken
+	]), [O, k] = y(d), [A, j] = y({
+		scope: D,
+		models: 0,
+		providers: 0,
+		revision: 0
+	}), M = A.scope === D ? A.models : 0, N = A.scope === D ? A.providers : 0, P = A.scope === D ? A.revision : 0, F = (e) => o.isLoading ? "loading" : !o.isAuthenticated || !D.workspaceId || !D.actorId || !D.accessToken ? "unavailable" : w.isLoading || w.scopeId !== D.workspaceId ? "loading" : w.error ? "unavailable" : !w.isSuperAdmin && w.permissions?.actorId !== D.actorId ? "loading" : w.hasPermission(e) ? "ready" : "denied", I = v(() => ({ pagination: {
+		limit: 20,
+		offset: M
+	} }), [M]), L = v(() => ({ pagination: {
+		limit: 20,
+		offset: N
+	} }), [N]), R = v(() => ({
+		...O,
+		productKey: e
+	}), [O, e]), z = _((e) => u(e, "models"), []), B = _((e) => u(e, "providers"), []), V = _((t) => f(t, D.workspaceId, e, O), [
+		D.workspaceId,
+		e,
+		O
+	]), H = g(i, D, F("prompt-model:read"), s, I, z, P), U = g(i, D, F("prompt-provider:read"), c, L, B, P), W = g(i, D, F("prompt-invocation:read"), l, R, V, P);
+	function G() {
+		k(d()), j({
+			scope: D,
+			models: M,
+			providers: N,
+			revision: P + 1
+		});
+	}
+	return /* @__PURE__ */ S(b, { children: [
+		/* @__PURE__ */ S("div", {
+			className: "flex flex-wrap items-center justify-between gap-3",
+			children: [/* @__PURE__ */ x("p", {
+				className: "text-sm text-muted-foreground",
+				children: E("readonly", "Read-only workspace view")
+			}), /* @__PURE__ */ x("button", {
+				type: "button",
+				onClick: G,
+				className: "rounded-md border border-border px-3 py-2 text-sm font-medium focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring",
+				children: E("refresh", "Refresh")
+			})]
+		}),
+		/* @__PURE__ */ x(h, {
+			state: W,
+			window: O,
+			locale: T
+		}),
+		/* @__PURE__ */ S("div", {
+			className: "grid gap-6 lg:grid-cols-2",
+			children: [/* @__PURE__ */ x(m, {
+				kind: "models",
+				state: H,
+				offset: M,
+				locale: T,
+				onPage: (e) => j({
+					scope: D,
+					models: e,
+					providers: N,
+					revision: P
 				})
-			]
+			}), /* @__PURE__ */ x(m, {
+				kind: "providers",
+				state: U,
+				offset: N,
+				locale: T,
+				onPage: (e) => j({
+					scope: D,
+					models: M,
+					providers: e,
+					revision: P
+				})
+			})]
 		})
-	});
+	] });
 }
 //#endregion
-export { s as AiPage };
+export { C as AiPage };

package/dist/shared/pages/ai/CatalogPanel.d.ts

@@ -0,0 +1,9 @@
+import { CatalogPage } from './contracts';
+import { ReadState } from './useAiRead';
+export declare function CatalogPanel({ kind, state, offset, locale, onPage, }: {
+    kind: 'models' | 'providers';
+    state: ReadState<CatalogPage>;
+    offset: number;
+    locale: string;
+    onPage: (offset: number) => void;
+}): import('react/jsx-runtime').JSX.Element;

package/dist/shared/pages/ai/CatalogPanel.js

@@ -0,0 +1,80 @@
+import { exactInteger as e } from "./contracts.js";
+import { useAiTr as t } from "./i18n.js";
+import { ReadNotice as n } from "./ReadNotice.js";
+import { Fragment as r, jsx as i, jsxs as a } from "react/jsx-runtime";
+//#region src/shared/pages/ai/CatalogPanel.tsx
+function o({ kind: o, state: s, offset: c, locale: l, onPage: u }) {
+	let d = t(), f = o === "models" ? d("models", "Model catalog") : d("providers", "Provider catalog");
+	return /* @__PURE__ */ a("section", {
+		"aria-label": f,
+		className: "min-w-0 rounded-xl border border-border bg-card p-4 sm:p-5",
+		children: [
+			/* @__PURE__ */ i("h2", {
+				className: "mb-2 text-lg font-semibold",
+				children: f
+			}),
+			/* @__PURE__ */ i("p", {
+				className: "mb-4 text-sm text-muted-foreground",
+				children: o === "models" ? d("modelsDescription", "Models registered for this workspace") : d("providersDescription", "Providers registered for this workspace")
+			}),
+			s.status === "ready" ? /* @__PURE__ */ a(r, { children: [
+				/* @__PURE__ */ i("p", {
+					className: "mb-3 text-sm text-muted-foreground",
+					children: d("catalogTotal", "{count} catalog entries", { count: e(String(s.data.total), l) })
+				}),
+				s.data.items.length === 0 ? /* @__PURE__ */ i("p", {
+					className: "text-sm",
+					children: d("emptyCatalog", "No entries on this page.")
+				}) : /* @__PURE__ */ i("ul", {
+					tabIndex: 0,
+					"aria-label": d("catalogEntries", "{section} entries", { section: f }),
+					className: "max-h-96 overflow-y-auto divide-y divide-border rounded-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-ring",
+					children: s.data.items.map((e) => /* @__PURE__ */ a("li", {
+						className: "space-y-1 py-3",
+						children: [
+							/* @__PURE__ */ i("h3", {
+								className: "break-words font-medium",
+								children: e.displayName
+							}),
+							/* @__PURE__ */ a("p", {
+								className: "break-all text-sm text-muted-foreground",
+								children: [
+									/* @__PURE__ */ i("bdi", { children: e.key }),
+									" · ",
+									/* @__PURE__ */ i("bdi", { children: e.detail })
+								]
+							}),
+							/* @__PURE__ */ a("p", {
+								className: "text-xs text-muted-foreground",
+								children: [e.isActive ? d("active", "Active catalog entry") : d("inactive", "Inactive catalog entry"), e.deprecated ? ` · ${d("deprecated", "Deprecated")}` : ""]
+							})
+						]
+					}, e.id))
+				}),
+				/* @__PURE__ */ i("p", {
+					className: "mt-3 text-xs text-muted-foreground",
+					children: d("registrationNotice", "Registration does not guarantee live availability.")
+				}),
+				/* @__PURE__ */ a("nav", {
+					"aria-label": d("pagination", "{section} pages", { section: f }),
+					className: "mt-4 flex flex-wrap gap-2",
+					children: [/* @__PURE__ */ i("button", {
+						type: "button",
+						disabled: c === 0,
+						onClick: () => u(Math.max(0, c - 20)),
+						className: "rounded-md border border-border px-3 py-2 text-sm disabled:opacity-50",
+						children: d("previous", "Previous")
+					}), /* @__PURE__ */ i("button", {
+						type: "button",
+						disabled: !s.data.hasMore,
+						onClick: () => u(c + 20),
+						className: "rounded-md border border-border px-3 py-2 text-sm disabled:opacity-50",
+						children: d("next", "Next")
+					})]
+				})
+			] }) : /* @__PURE__ */ i(n, { status: s.status })
+		]
+	});
+}
+//#endregion
+export { o as CatalogPanel };

package/dist/shared/pages/ai/ReadNotice.d.ts

@@ -0,0 +1,4 @@
+import { ReadState } from './useAiRead';
+export declare function ReadNotice({ status }: {
+    status: Exclude<ReadState<unknown>['status'], 'ready'>;
+}): import('react/jsx-runtime').JSX.Element;

package/dist/shared/pages/ai/ReadNotice.js

@@ -0,0 +1,18 @@
+import { useAiTr as e } from "./i18n.js";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/shared/pages/ai/ReadNotice.tsx
+function n({ status: n }) {
+	let r = e();
+	return /* @__PURE__ */ t("p", {
+		role: "status",
+		className: "text-sm text-muted-foreground",
+		children: {
+			loading: r("loading", "Loading this workspace…"),
+			denied: r("denied", "You do not have permission to read this section."),
+			unavailable: r("unavailable", "AI operations are unavailable in this context."),
+			error: r("error", "This read could not be completed. Refresh to try again.")
+		}[n]
+	});
+}
+//#endregion
+export { n as ReadNotice };

package/dist/shared/pages/ai/SummaryPanel.d.ts

@@ -0,0 +1,7 @@
+import { UsageSummary, UsageWindow } from './contracts';
+import { ReadState } from './useAiRead';
+export declare function SummaryPanel({ state, window, locale, }: {
+    state: ReadState<UsageSummary>;
+    window: UsageWindow;
+    locale: string;
+}): import('react/jsx-runtime').JSX.Element;

package/dist/shared/pages/ai/SummaryPanel.js

@@ -0,0 +1,135 @@
+import { exactInteger as e, exactUsd as t } from "./contracts.js";
+import { useAiTr as n } from "./i18n.js";
+import { ReadNotice as r } from "./ReadNotice.js";
+import { useMemo as i } from "react";
+import { Fragment as a, jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/shared/pages/ai/SummaryPanel.tsx
+function c({ label: r, value: i, cost: a, locale: c }) {
+	let l = n();
+	return /* @__PURE__ */ s("div", {
+		className: "min-w-0 rounded-lg bg-muted/40 p-3",
+		children: [
+			/* @__PURE__ */ o("dt", {
+				className: "text-sm text-muted-foreground",
+				children: r
+			}),
+			/* @__PURE__ */ o("dd", {
+				className: "mt-1 break-all text-xl font-semibold tabular-nums",
+				children: i.knownSubtotal === null ? l("unknown", "Unknown") : a ? t(i.knownSubtotal, c) : e(i.knownSubtotal, c)
+			}),
+			/* @__PURE__ */ o("dd", {
+				className: "mt-2 text-xs text-muted-foreground",
+				children: l("coverage", "{known} attempts reported; {missing} missing", {
+					known: e(i.knownAttempts, c),
+					missing: e(i.missingAttempts, c)
+				})
+			})
+		]
+	});
+}
+function l({ state: t, window: l, locale: u }) {
+	let d = n(), f = d("summary", "Recorded usage"), p = i(() => new Intl.DateTimeFormat(u, {
+		year: "numeric",
+		month: "short",
+		day: "numeric",
+		hour: "2-digit",
+		minute: "2-digit",
+		timeZone: "UTC"
+	}), [u]), m = t.status === "ready" ? [
+		[d("operations", "Operations"), t.data.operations],
+		[d("attempts", "Recorded attempts"), t.data.attempts],
+		[d("known", "Known"), t.data.knownAttempts],
+		[d("partial", "Partial"), t.data.partialAttempts],
+		[d("unknownAttempts", "Unknown"), t.data.unknownAttempts],
+		[d("pending", "Pending (included in unknown)"), t.data.pendingAttempts]
+	] : [];
+	return /* @__PURE__ */ s("section", {
+		"aria-label": f,
+		className: "min-w-0 rounded-xl border border-border bg-card p-4 sm:p-5",
+		children: [
+			/* @__PURE__ */ o("h2", {
+				className: "text-lg font-semibold",
+				children: f
+			}),
+			/* @__PURE__ */ o("p", {
+				className: "mt-2 break-words text-sm text-muted-foreground",
+				children: d("window", "{from} to {to} UTC", {
+					from: p.format(new Date(l.from)),
+					to: p.format(new Date(l.to))
+				})
+			}),
+			/* @__PURE__ */ o("p", {
+				className: "mt-2 text-sm text-muted-foreground",
+				children: d("summaryNotice", "Recorded attempts for this product. Usage may be incomplete; costs are estimated subtotals.")
+			}),
+			/* @__PURE__ */ o("div", {
+				className: "mt-4",
+				"aria-live": "polite",
+				children: t.status === "ready" ? /* @__PURE__ */ s(a, { children: [
+					t.data.attempts === "0" && /* @__PURE__ */ o("p", {
+						className: "mb-4 text-sm",
+						children: d("emptySummary", "No recorded attempts in this window. Unknown subtotals are not zero usage.")
+					}),
+					/* @__PURE__ */ o("dl", {
+						className: "grid grid-cols-2 gap-3 sm:grid-cols-3 lg:grid-cols-6",
+						children: m.map(([t, n]) => /* @__PURE__ */ s("div", {
+							className: "min-w-0",
+							children: [/* @__PURE__ */ o("dt", {
+								className: "text-xs text-muted-foreground",
+								children: t
+							}), /* @__PURE__ */ o("dd", {
+								className: "break-all text-xl font-semibold tabular-nums",
+								children: e(n, u)
+							})]
+						}, t))
+					}),
+					/* @__PURE__ */ s("dl", {
+						className: "mt-5 grid gap-3 sm:grid-cols-2 2xl:grid-cols-4",
+						children: [
+							/* @__PURE__ */ o(c, {
+								label: d("input", "Known input tokens"),
+								value: t.data.inputTokens,
+								locale: u
+							}),
+							/* @__PURE__ */ o(c, {
+								label: d("output", "Known output tokens"),
+								value: t.data.outputTokens,
+								locale: u
+							}),
+							/* @__PURE__ */ o(c, {
+								label: d("total", "Known total tokens"),
+								value: t.data.totalTokens,
+								locale: u
+							}),
+							/* @__PURE__ */ o(c, {
+								label: d("cost", "Known estimated cost subtotal"),
+								value: t.data.costMicroUsd,
+								cost: !0,
+								locale: u
+							})
+						]
+					}),
+					/* @__PURE__ */ s("details", {
+						className: "mt-4 text-sm text-muted-foreground",
+						children: [/* @__PURE__ */ o("summary", {
+							className: "cursor-pointer",
+							children: d("usageHelp", "About these figures")
+						}), /* @__PURE__ */ s("div", {
+							className: "mt-2 space-y-2 text-xs",
+							children: [
+								/* @__PURE__ */ o("p", { children: d("coverageHelp", "Unknown means no supplied value; zero is a reported value. Missing counts show incomplete coverage. Pending attempts are included in unknown.") }),
+								/* @__PURE__ */ o("p", { children: d("recordedHelp", "These are recorded attempts, not all provider traffic or an invoice. Legacy records are excluded. Failed or timed-out attempts may still report usage. Cached input is included in input tokens.") }),
+								/* @__PURE__ */ o("p", { children: d("exactWindow", "Exact UTC range: {from} (inclusive) to {to} (exclusive).", {
+									from: l.from,
+									to: l.to
+								}) })
+							]
+						})]
+					})
+				] }) : /* @__PURE__ */ o(r, { status: t.status })
+			})
+		]
+	});
+}
+//#endregion
+export { l as SummaryPanel };

package/dist/shared/pages/ai/contracts.d.ts

@@ -0,0 +1,45 @@
+/** Read-only operations owned by Prompts; deliberately exclude credentials and V1. */
+export declare const MODELS: import('graphql').DocumentNode;
+export declare const PROVIDERS: import('graphql').DocumentNode;
+export declare const SUMMARY: import('graphql').DocumentNode;
+export interface CatalogItem {
+    id: string;
+    key: string;
+    displayName: string;
+    isActive: boolean;
+    detail: string;
+    deprecated: boolean;
+}
+export interface CatalogPage {
+    items: CatalogItem[];
+    total: number;
+    hasMore: boolean;
+}
+export interface UsageComponent {
+    knownSubtotal: string | null;
+    knownAttempts: string;
+    missingAttempts: string;
+}
+export interface UsageSummary {
+    operations: string;
+    attempts: string;
+    pendingAttempts: string;
+    knownAttempts: string;
+    partialAttempts: string;
+    unknownAttempts: string;
+    inputTokens: UsageComponent;
+    outputTokens: UsageComponent;
+    totalTokens: UsageComponent;
+    costMicroUsd: UsageComponent;
+}
+export interface UsageWindow {
+    from: string;
+    to: string;
+}
+export declare const PAGE_SIZE = 20;
+export declare function integer(value: unknown): string;
+export declare function catalog(value: unknown, kind: 'models' | 'providers'): CatalogPage;
+export declare function summary(value: unknown, workspaceId: string, productKey: string, window: UsageWindow): UsageSummary;
+export declare function exactInteger(value: string, locale: string): string;
+export declare function exactUsd(value: string, locale: string): string;
+export declare function sevenDays(now?: Date): UsageWindow;