@elizaos/ui 2.0.0-alpha.85 → 2.0.0-beta.2

package/components/apps/per-app-config.js

@@ -0,0 +1,99 @@
+/**
+ * Per-app config — launch mode, always-on-top default, and free-form
+ * app-declared settings. NOT widget visibility (lives in widgets/visibility.ts).
+ *
+ * Persisted to localStorage under `eliza:apps:<slug>`. Subscribers receive
+ * change notifications via the `storage` event so multiple windows stay in
+ * sync.
+ */
+const DEFAULT_CONFIG = {
+    launchMode: "window",
+    alwaysOnTop: false,
+    settings: {},
+};
+const KEY_PREFIX = "eliza:apps:";
+function storageKey(slug) {
+    return `${KEY_PREFIX}${slug}`;
+}
+function isLaunchMode(value) {
+    return value === "window" || value === "inline";
+}
+function sanitizeSettings(value) {
+    if (!value || typeof value !== "object" || Array.isArray(value))
+        return {};
+    const next = {};
+    for (const [key, raw] of Object.entries(value)) {
+        if (typeof key === "string" && key.length > 0) {
+            next[key] = raw;
+        }
+    }
+    return next;
+}
+function parseConfig(raw) {
+    if (!raw)
+        return { ...DEFAULT_CONFIG, settings: {} };
+    let parsed;
+    try {
+        parsed = JSON.parse(raw);
+    }
+    catch {
+        return { ...DEFAULT_CONFIG, settings: {} };
+    }
+    if (!parsed || typeof parsed !== "object") {
+        return { ...DEFAULT_CONFIG, settings: {} };
+    }
+    const candidate = parsed;
+    return {
+        launchMode: isLaunchMode(candidate.launchMode)
+            ? candidate.launchMode
+            : DEFAULT_CONFIG.launchMode,
+        alwaysOnTop: typeof candidate.alwaysOnTop === "boolean"
+            ? candidate.alwaysOnTop
+            : DEFAULT_CONFIG.alwaysOnTop,
+        settings: sanitizeSettings(candidate.settings),
+    };
+}
+export function loadPerAppConfig(slug) {
+    if (typeof window === "undefined")
+        return { ...DEFAULT_CONFIG, settings: {} };
+    try {
+        return parseConfig(window.localStorage.getItem(storageKey(slug)));
+    }
+    catch {
+        return { ...DEFAULT_CONFIG, settings: {} };
+    }
+}
+export function savePerAppConfig(slug, config) {
+    if (typeof window === "undefined")
+        return;
+    try {
+        const sanitized = {
+            launchMode: isLaunchMode(config.launchMode)
+                ? config.launchMode
+                : DEFAULT_CONFIG.launchMode,
+            alwaysOnTop: Boolean(config.alwaysOnTop),
+            settings: sanitizeSettings(config.settings),
+        };
+        window.localStorage.setItem(storageKey(slug), JSON.stringify(sanitized));
+    }
+    catch {
+        /* ignore — sandboxed storage */
+    }
+}
+export function subscribePerAppConfig(slug, listener) {
+    if (typeof window === "undefined")
+        return () => { };
+    const key = storageKey(slug);
+    const handler = (event) => {
+        if (event.key !== key)
+            return;
+        listener(parseConfig(event.newValue));
+    };
+    window.addEventListener("storage", handler);
+    return () => {
+        window.removeEventListener("storage", handler);
+    };
+}
+export function getDefaultPerAppConfig() {
+    return { ...DEFAULT_CONFIG, settings: {} };
+}

package/components/apps/run-attention.d.ts

@@ -0,0 +1,3 @@
+import type { AppRunSummary } from "../../api";
+export declare function getRunAttentionReasons(run: AppRunSummary, now?: number): string[];
+//# sourceMappingURL=run-attention.d.ts.map

package/components/apps/run-attention.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"run-attention.d.ts","sourceRoot":"","sources":["../../../../../../src/components/apps/run-attention.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AA2C/C,wBAAgB,sBAAsB,CACpC,GAAG,EAAE,aAAa,EAClB,GAAG,GAAE,MAAmB,GACvB,MAAM,EAAE,CAgDV"}

package/components/apps/run-attention.js

@@ -0,0 +1,77 @@
+const HEARTBEAT_STALE_MS = 2 * 60 * 1000;
+const DOWN_STATUS_PATTERNS = [
+    "disconnected",
+    "failed",
+    "error",
+    "stale",
+    "stopping",
+    "stopped",
+    "paused",
+    "blocked",
+    "offline",
+    "lost",
+    "missing",
+    "unavailable",
+];
+const SESSION_READY_STATUSES = new Set([
+    "running",
+    "active",
+    "connected",
+    "ready",
+    "playing",
+    "live",
+    "monitoring",
+    "steering",
+    "attached",
+    "idle",
+]);
+function isNonEmptyString(value) {
+    return typeof value === "string" && value.trim().length > 0;
+}
+function isDownSessionStatus(status) {
+    const normalized = status.trim().toLowerCase();
+    return DOWN_STATUS_PATTERNS.some((pattern) => normalized.includes(pattern));
+}
+function isReadySessionStatus(status) {
+    return SESSION_READY_STATUSES.has(status.trim().toLowerCase());
+}
+export function getRunAttentionReasons(run, now = Date.now()) {
+    const reasons = [];
+    const heartbeatAt = run.lastHeartbeatAt
+        ? new Date(run.lastHeartbeatAt).getTime()
+        : null;
+    if (run.health.state === "offline") {
+        reasons.push("Run is offline");
+    }
+    else if (run.health.state === "degraded") {
+        reasons.push(run.health.message ?? "Run health is degraded");
+    }
+    if (run.viewerAttachment === "detached") {
+        reasons.push("Viewer is detached");
+    }
+    else if (run.viewerAttachment === "unavailable") {
+        reasons.push("No viewer surface is available");
+    }
+    if (!run.viewer?.url && run.viewerAttachment !== "unavailable") {
+        reasons.push("Viewer URL is missing");
+    }
+    if (run.session?.canSendCommands === false) {
+        reasons.push("Command bridge is unavailable");
+    }
+    if (isNonEmptyString(run.session?.status) &&
+        isDownSessionStatus(run.session.status) &&
+        !isReadySessionStatus(run.session.status)) {
+        reasons.push(`Session status is ${run.session.status}`);
+    }
+    if (heartbeatAt === null) {
+        reasons.push("No heartbeat recorded");
+    }
+    else if (Number.isFinite(heartbeatAt) &&
+        now - heartbeatAt > HEARTBEAT_STALE_MS) {
+        reasons.push("Heartbeat is stale");
+    }
+    if (!run.supportsBackground && run.viewerAttachment !== "attached") {
+        reasons.push("Run may pause when the viewer is detached");
+    }
+    return Array.from(new Set(reasons));
+}

package/components/apps/surfaces/GameOperatorShell.d.ts

@@ -0,0 +1,47 @@
+export type GameOperatorEventTone = "user" | "success" | "info" | "warning" | "error";
+export interface GameOperatorEvent {
+    id: string;
+    label: string;
+    message: string;
+    tone?: GameOperatorEventTone;
+    timestamp?: string | number | null;
+}
+export interface GameOperatorAction {
+    id: string;
+    label: string;
+    command: string;
+    testId?: string;
+    active?: boolean;
+    disabled?: boolean;
+}
+export interface GameOperatorDetail {
+    label: string;
+    value: string;
+}
+export interface GameOperatorShellProps {
+    surfaceTestId: string;
+    title: string;
+    statusLabel: string;
+    statusTone?: "live" | "attention" | "idle";
+    objective: string | null;
+    detailItems?: GameOperatorDetail[];
+    primaryActions: GameOperatorAction[];
+    suggestedActions?: GameOperatorAction[];
+    events: GameOperatorEvent[];
+    emptyEventsLabel: string;
+    draft: string;
+    inputPlaceholder: string;
+    sendLabel?: string;
+    sendingLabel?: string;
+    canSend: boolean;
+    sending: boolean;
+    chatInputTestId: string;
+    chatSendTestId: string;
+    noticeTestId?: string;
+    variant?: "detail" | "live" | "running";
+    onDraftChange: (value: string) => void;
+    onSendDraft: () => void;
+    onCommand: (command: string) => void;
+}
+export declare function GameOperatorShell({ surfaceTestId, title, statusLabel, statusTone, objective, detailItems, primaryActions, suggestedActions, events, emptyEventsLabel, draft, inputPlaceholder, sendLabel, sendingLabel, canSend, sending, chatInputTestId, chatSendTestId, noticeTestId, variant, onDraftChange, onSendDraft, onCommand, }: GameOperatorShellProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=GameOperatorShell.d.ts.map

package/components/apps/surfaces/GameOperatorShell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GameOperatorShell.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/apps/surfaces/GameOperatorShell.tsx"],"names":[],"mappings":"AAGA,MAAM,MAAM,qBAAqB,GAC7B,MAAM,GACN,SAAS,GACT,MAAM,GACN,SAAS,GACT,OAAO,CAAC;AAEZ,MAAM,WAAW,iBAAiB;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,qBAAqB,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAAC;CACpC;AAED,MAAM,WAAW,kBAAkB;IACjC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,kBAAkB;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,sBAAsB;IACrC,aAAa,EAAE,MAAM,CAAC;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,MAAM,CAAC;IAC3C,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,WAAW,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACnC,cAAc,EAAE,kBAAkB,EAAE,CAAC;IACrC,gBAAgB,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACxC,MAAM,EAAE,iBAAiB,EAAE,CAAC;IAC5B,gBAAgB,EAAE,MAAM,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,gBAAgB,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,EAAE,MAAM,CAAC;IACxB,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,SAAS,CAAC;IACxC,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,WAAW,EAAE,MAAM,IAAI,CAAC;IACxB,SAAS,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AAyBD,wBAAgB,iBAAiB,CAAC,EAChC,aAAa,EACb,KAAK,EACL,WAAW,EACX,UAAmB,EACnB,SAAS,EACT,WAAgB,EAChB,cAAc,EACd,gBAAqB,EACrB,MAAM,EACN,gBAAgB,EAChB,KAAK,EACL,gBAAgB,EAChB,SAAkB,EAClB,YAAwB,EACxB,OAAO,EACP,OAAO,EACP,eAAe,EACf,cAAc,EACd,YAAY,EACZ,OAAkB,EAClB,aAAa,EACb,WAAW,EACX,SAAS,GACV,EAAE,sBAAsB,2CAkJxB"}

package/components/apps/surfaces/GameOperatorShell.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Input } from "@elizaos/ui";
+function toneClass(tone = "info") {
+    if (tone === "user")
+        return "border-accent/35 bg-accent/10 text-txt";
+    if (tone === "success")
+        return "border-ok/30 bg-ok/10 text-txt";
+    if (tone === "warning")
+        return "border-warn/35 bg-warn/10 text-txt";
+    if (tone === "error")
+        return "border-danger/35 bg-danger/10 text-txt";
+    return "border-border/35 bg-bg/80 text-txt";
+}
+function statusClass(tone) {
+    if (tone === "live")
+        return "border-ok/30 bg-ok/10 text-ok";
+    if (tone === "attention")
+        return "border-warn/35 bg-warn/10 text-warn";
+    return "border-border/45 bg-bg-hover/70 text-muted-strong";
+}
+function formatTimestamp(value) {
+    if (value == null)
+        return null;
+    const date = new Date(value);
+    if (Number.isNaN(date.getTime()))
+        return null;
+    return date.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
+}
+export function GameOperatorShell({ surfaceTestId, title, statusLabel, statusTone = "idle", objective, detailItems = [], primaryActions, suggestedActions = [], events, emptyEventsLabel, draft, inputPlaceholder, sendLabel = "Send", sendingLabel = "Sending", canSend, sending, chatInputTestId, chatSendTestId, noticeTestId, variant = "detail", onDraftChange, onSendDraft, onCommand, }) {
+    const latestEvent = events.at(-1) ?? null;
+    const visibleEvents = events.slice(-12);
+    const handleSubmit = (event) => {
+        event.preventDefault();
+        if (!draft.trim() || sending || !canSend)
+            return;
+        onSendDraft();
+    };
+    return (_jsxs("section", { className: `flex min-h-0 flex-col gap-3 ${variant === "live" ? "h-full p-3" : ""}`, "data-testid": surfaceTestId, children: [_jsxs("div", { className: "rounded-2xl border border-border/35 bg-card/74 p-3 shadow-sm", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx("span", { className: `inline-flex min-h-6 items-center rounded-full border px-2.5 py-1 text-2xs font-medium uppercase tracking-[0.14em] ${statusClass(statusTone)}`, children: statusLabel }), _jsx("span", { className: "text-xs font-semibold text-txt", children: title })] }), objective ? (_jsx("div", { className: "mt-2 text-xs leading-5 text-muted-strong", children: objective })) : null, detailItems.length > 0 ? (_jsx("div", { className: "mt-3 flex flex-wrap gap-2", children: detailItems.map((item) => (_jsxs("span", { className: "rounded-full border border-border/35 bg-bg/65 px-2.5 py-1 text-2xs text-muted-strong", children: [_jsxs("span", { className: "text-muted", children: [item.label, ": "] }), item.value] }, `${item.label}:${item.value}`))) })) : null] }), _jsx("div", { className: "grid grid-cols-2 gap-2", children: primaryActions.map((item) => (_jsx(Button, { type: "button", variant: item.active ? "default" : "outline", size: "sm", className: "min-h-9 rounded-xl shadow-sm", "data-testid": item.testId, disabled: !canSend || sending || item.disabled, onClick: () => onCommand(item.command), children: item.label }, item.id))) }), _jsxs("div", { className: "flex min-h-0 flex-1 flex-col rounded-2xl border border-border/35 bg-card/74 shadow-sm", children: [_jsxs("div", { className: "flex items-center justify-between gap-2 border-b border-border/30 px-3 py-2", children: [_jsx("div", { className: "text-2xs font-semibold uppercase tracking-[0.18em] text-muted", children: "Game chat" }), latestEvent && noticeTestId ? (_jsx("div", { className: "max-w-44 truncate text-2xs text-muted-strong", "data-testid": noticeTestId, title: latestEvent.message, children: latestEvent.message })) : null] }), _jsx("div", { className: "min-h-40 flex-1 space-y-2 overflow-y-auto p-3", children: visibleEvents.length === 0 ? (_jsx("div", { className: "rounded-xl border border-dashed border-border/45 bg-bg/45 px-3 py-4 text-xs leading-5 text-muted-strong", children: emptyEventsLabel })) : (visibleEvents.map((event) => {
+                            const time = formatTimestamp(event.timestamp);
+                            return (_jsxs("div", { className: `rounded-xl border px-3 py-2 text-xs leading-5 ${toneClass(event.tone)}`, children: [_jsxs("div", { className: "mb-1 flex items-center gap-2 text-2xs uppercase tracking-[0.14em] text-muted", children: [_jsx("span", { children: event.label }), time ? _jsx("span", { children: time }) : null] }), _jsx("div", { children: event.message })] }, event.id));
+                        })) }), _jsxs("form", { className: "border-t border-border/30 p-3", onSubmit: handleSubmit, children: [_jsxs("div", { className: "grid gap-2 md:grid-cols-[minmax(0,1fr)_auto]", children: [_jsx(Input, { value: draft, onChange: (event) => onDraftChange(event.target.value), placeholder: inputPlaceholder, className: "min-h-10 rounded-xl", "data-testid": chatInputTestId, disabled: !canSend }), _jsx(Button, { type: "submit", className: "min-h-10 rounded-xl px-4 shadow-sm", "data-testid": chatSendTestId, disabled: !canSend || sending || !draft.trim(), children: sending ? sendingLabel : sendLabel })] }), suggestedActions.length > 0 ? (_jsx("div", { className: "mt-3 flex flex-wrap gap-2", children: suggestedActions.map((item) => (_jsx(Button, { type: "button", variant: "outline", size: "sm", className: "min-h-8 rounded-xl px-3 shadow-sm", "data-testid": item.testId, disabled: !canSend || sending || item.disabled, onClick: () => onCommand(item.command), children: item.label }, item.id))) })) : null] })] })] }));
+}

package/components/apps/surfaces/registry.d.ts

@@ -0,0 +1,11 @@
+import type { AppOperatorSurfaceComponent } from "./types";
+/**
+ * Register an operator surface component for a given app package name.
+ * Call this once per app at module load time (e.g. from the app's UI entry).
+ *
+ * @example
+ *   registerOperatorSurface("@elizaos/app-babylon", BabylonOperatorSurface);
+ */
+export declare function registerOperatorSurface(appName: string, component: AppOperatorSurfaceComponent): void;
+export declare function getAppOperatorSurface(appName: string | null | undefined): AppOperatorSurfaceComponent | null;
+//# sourceMappingURL=registry.d.ts.map

package/components/apps/surfaces/registry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"registry.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/apps/surfaces/registry.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,SAAS,CAAC;AAc3D;;;;;;GAMG;AACH,wBAAgB,uBAAuB,CACrC,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,2BAA2B,GACrC,IAAI,CAEN;AAED,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,GACjC,2BAA2B,GAAG,IAAI,CAGpC"}

package/components/apps/surfaces/registry.js

@@ -0,0 +1,23 @@
+/**
+ * Registry of operator surface components keyed by app package name.
+ *
+ * Apps register their surface on startup via side-effect import. The host
+ * app entry imports each game/app UI package which calls
+ * `registerOperatorSurface` during module initialization.
+ */
+const OPERATOR_SURFACE_COMPONENTS = new Map();
+/**
+ * Register an operator surface component for a given app package name.
+ * Call this once per app at module load time (e.g. from the app's UI entry).
+ *
+ * @example
+ *   registerOperatorSurface("@elizaos/app-babylon", BabylonOperatorSurface);
+ */
+export function registerOperatorSurface(appName, component) {
+    OPERATOR_SURFACE_COMPONENTS.set(appName, component);
+}
+export function getAppOperatorSurface(appName) {
+    if (!appName)
+        return null;
+    return OPERATOR_SURFACE_COMPONENTS.get(appName) ?? null;
+}

package/components/apps/surfaces/types.d.ts

@@ -0,0 +1,10 @@
+import type { ComponentType } from "react";
+export type AppOperatorSurfaceVariant = "detail" | "live" | "running";
+export type AppOperatorSurfaceFocus = "all" | "dashboard" | "chat";
+export interface AppOperatorSurfaceProps {
+    appName: string;
+    variant?: AppOperatorSurfaceVariant;
+    focus?: AppOperatorSurfaceFocus;
+}
+export type AppOperatorSurfaceComponent = ComponentType<AppOperatorSurfaceProps>;
+//# sourceMappingURL=types.d.ts.map

package/components/apps/surfaces/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../../../src/components/apps/surfaces/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE3C,MAAM,MAAM,yBAAyB,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,CAAC;AACtE,MAAM,MAAM,uBAAuB,GAAG,KAAK,GAAG,WAAW,GAAG,MAAM,CAAC;AAEnE,MAAM,WAAW,uBAAuB;IACtC,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,yBAAyB,CAAC;IACpC,KAAK,CAAC,EAAE,uBAAuB,CAAC;CACjC;AAED,MAAM,MAAM,2BAA2B,GACrC,aAAa,CAAC,uBAAuB,CAAC,CAAC"}

package/components/apps/surfaces/types.js

@@ -0,0 +1 @@
+export {};

package/components/apps/useRegistryCatalog.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Shared catalog fetch for views that need to resolve a slug against the
+ * union of `client.listApps()` (installed) and `client.listCatalogApps()`
+ * (registry). A module-level promise coalesces concurrent callers so two
+ * views mounted for the same slug only hit the API once.
+ */
+import { type RegistryAppInfo } from "../../api";
+interface RegistryCatalogState {
+    catalog: RegistryAppInfo[] | null;
+    error: string | null;
+}
+export declare function useRegistryCatalog(): RegistryCatalogState;
+export {};
+//# sourceMappingURL=useRegistryCatalog.d.ts.map

package/components/apps/useRegistryCatalog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRegistryCatalog.d.ts","sourceRoot":"","sources":["../../../../../../src/components/apps/useRegistryCatalog.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,OAAO,EAAU,KAAK,eAAe,EAAE,MAAM,WAAW,CAAC;AAEzD,UAAU,oBAAoB;IAC5B,OAAO,EAAE,eAAe,EAAE,GAAG,IAAI,CAAC;IAClC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAyBD,wBAAgB,kBAAkB,IAAI,oBAAoB,CA2BzD"}

package/components/apps/useRegistryCatalog.js

@@ -0,0 +1,52 @@
+/**
+ * Shared catalog fetch for views that need to resolve a slug against the
+ * union of `client.listApps()` (installed) and `client.listCatalogApps()`
+ * (registry). A module-level promise coalesces concurrent callers so two
+ * views mounted for the same slug only hit the API once.
+ */
+import { useEffect, useState } from "react";
+import { client } from "../../api/index.js";
+let inflight = null;
+function fetchRegistryCatalog() {
+    if (inflight)
+        return inflight;
+    inflight = (async () => {
+        const [serverApps, catalogApps] = await Promise.all([
+            client.listApps().catch(() => []),
+            client.listCatalogApps().catch(() => []),
+        ]);
+        return [...catalogApps, ...serverApps].filter((entry, index, items) => !items
+            .slice(index + 1)
+            .some((candidate) => candidate.name === entry.name));
+    })().finally(() => {
+        // Allow next mount cycle to refetch — keeps stale data out without
+        // spamming the API for siblings mounting in the same tick.
+        inflight = null;
+    });
+    return inflight;
+}
+export function useRegistryCatalog() {
+    const [state, setState] = useState({
+        catalog: null,
+        error: null,
+    });
+    useEffect(() => {
+        let cancelled = false;
+        fetchRegistryCatalog().then((catalog) => {
+            if (cancelled)
+                return;
+            setState({ catalog, error: null });
+        }, (err) => {
+            if (cancelled)
+                return;
+            setState({
+                catalog: null,
+                error: err instanceof Error ? err.message : String(err),
+            });
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, []);
+    return state;
+}

package/components/apps/viewer-auth.d.ts

@@ -0,0 +1,7 @@
+import type { AppRunSummary, AppViewerAuthMessage } from "../../api/client-types-cloud";
+export declare function resolveEmbeddedViewerUrl(viewerUrl: string): string;
+export declare function resolvePostMessageTargetOrigin(viewerUrl: string): string;
+export declare function resolveViewerReadyEventType(payload: AppViewerAuthMessage | null | undefined): string | null;
+export declare function buildViewerSessionKey(viewerUrl: string, payload: AppViewerAuthMessage | null | undefined): string;
+export declare function shouldUseEmbeddedAppViewer(run: AppRunSummary | null | undefined): boolean;
+//# sourceMappingURL=viewer-auth.d.ts.map

package/components/apps/viewer-auth.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"viewer-auth.d.ts","sourceRoot":"","sources":["../../../../../../src/components/apps/viewer-auth.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,oBAAoB,EACrB,MAAM,8BAA8B,CAAC;AAOtC,wBAAgB,wBAAwB,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,CASlE;AAED,wBAAgB,8BAA8B,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,CAaxE;AAED,wBAAgB,2BAA2B,CACzC,OAAO,EAAE,oBAAoB,GAAG,IAAI,GAAG,SAAS,GAC/C,MAAM,GAAG,IAAI,CAUf;AAED,wBAAgB,qBAAqB,CACnC,SAAS,EAAE,MAAM,EACjB,OAAO,EAAE,oBAAoB,GAAG,IAAI,GAAG,SAAS,GAC/C,MAAM,CAER;AAED,wBAAgB,0BAA0B,CACxC,GAAG,EAAE,aAAa,GAAG,IAAI,GAAG,SAAS,GACpC,OAAO,CAeT"}

package/components/apps/viewer-auth.js

@@ -0,0 +1,55 @@
+import { resolveApiUrl } from "../../utils/index.js";
+function normalizeEmbedFlag(value) {
+    return value?.trim().toLowerCase() === "true";
+}
+export function resolveEmbeddedViewerUrl(viewerUrl) {
+    const normalized = viewerUrl.trim();
+    if (!normalized) {
+        return normalized;
+    }
+    if (normalized.startsWith("/api/")) {
+        return resolveApiUrl(normalized);
+    }
+    return normalized;
+}
+export function resolvePostMessageTargetOrigin(viewerUrl) {
+    const resolvedViewerUrl = resolveEmbeddedViewerUrl(viewerUrl);
+    try {
+        const parsed = resolvedViewerUrl.startsWith("/")
+            ? new URL(resolvedViewerUrl, window.location.origin)
+            : new URL(resolvedViewerUrl);
+        if (parsed.protocol !== "http:" && parsed.protocol !== "https:") {
+            return "*";
+        }
+        return parsed.origin === "null" ? "*" : parsed.origin;
+    }
+    catch {
+        return "*";
+    }
+}
+export function resolveViewerReadyEventType(payload) {
+    if (!payload?.type) {
+        return null;
+    }
+    const normalizedType = payload.type.trim();
+    if (normalizedType.length === 0) {
+        return null;
+    }
+    return normalizedType.replace(/_AUTH$/i, "_READY");
+}
+export function buildViewerSessionKey(viewerUrl, payload) {
+    return `${resolveEmbeddedViewerUrl(viewerUrl)}::${JSON.stringify(payload ?? null)}`;
+}
+export function shouldUseEmbeddedAppViewer(run) {
+    const viewer = run?.viewer;
+    if (!viewer?.url) {
+        return false;
+    }
+    if (viewer.postMessageAuth) {
+        return true;
+    }
+    if (normalizeEmbedFlag(viewer.embedParams?.embedded)) {
+        return true;
+    }
+    return typeof viewer.embedParams?.surface === "string";
+}

package/components/auth/LoginView.d.ts

@@ -0,0 +1,17 @@
+import { type AuthLoginResult } from "../../api/auth-client";
+export interface LoginViewProps {
+    /**
+     * Called after a successful login so the shell can redirect to the
+     * main dashboard.
+     */
+    onLoginSuccess: () => void;
+    /** Injected login function (tests). */
+    loginFn?: (params: {
+        displayName: string;
+        password: string;
+        rememberDevice?: boolean;
+    }) => Promise<AuthLoginResult>;
+    reason?: "remote_auth_required" | "remote_password_not_configured";
+}
+export declare function LoginView({ onLoginSuccess, loginFn, reason }: LoginViewProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=LoginView.d.ts.map

package/components/auth/LoginView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoginView.d.ts","sourceRoot":"","sources":["../../../../../../src/components/auth/LoginView.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,KAAK,eAAe,EAAqB,MAAM,uBAAuB,CAAC;AAWhF,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,uCAAuC;IACvC,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE;QACjB,WAAW,EAAE,MAAM,CAAC;QACpB,QAAQ,EAAE,MAAM,CAAC;QACjB,cAAc,CAAC,EAAE,OAAO,CAAC;KAC1B,KAAK,OAAO,CAAC,eAAe,CAAC,CAAC;IAC/B,MAAM,CAAC,EAAE,sBAAsB,GAAG,gCAAgC,CAAC;CACpE;AAuJD,wBAAgB,SAAS,CAAC,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,cAAc,2CAgF5E"}

package/components/auth/LoginView.js

@@ -0,0 +1,62 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, Card, CardContent, CardHeader, CardTitle, cn, Input, Label, } from "@elizaos/ui";
+import { useCallback, useId, useState } from "react";
+import { authLoginPassword } from "../../api/auth-client.js";
+import { OnboardingStepDivider, onboardingBodyTextShadowStyle, onboardingDescriptionClass, onboardingEyebrowClass, onboardingTitleClass, } from "../onboarding/onboarding-step-chrome.js";
+function PasswordTab({ onLoginSuccess, loginFn, }) {
+    const displayNameId = useId().replace(/:/g, "");
+    const passwordId = useId().replace(/:/g, "");
+    const [displayName, setDisplayName] = useState("");
+    const [password, setPassword] = useState("");
+    const [rememberDevice, setRememberDevice] = useState(false);
+    const [submitState, setSubmitState] = useState({
+        phase: "idle",
+    });
+    const handleSubmit = useCallback(async (e) => {
+        e.preventDefault();
+        if (!displayName.trim() || !password)
+            return;
+        setSubmitState({ phase: "submitting" });
+        let result;
+        try {
+            const fn = loginFn ?? authLoginPassword;
+            result = await fn({
+                displayName: displayName.trim(),
+                password,
+                rememberDevice,
+            });
+        }
+        catch (err) {
+            setSubmitState({
+                phase: "error",
+                message: err instanceof Error ? err.message : "Network error — try again.",
+            });
+            return;
+        }
+        if (result.ok === false) {
+            setSubmitState({ phase: "error", message: result.message });
+            return;
+        }
+        setSubmitState({ phase: "success" });
+        onLoginSuccess();
+    }, [displayName, password, rememberDevice, loginFn, onLoginSuccess]);
+    const isSubmitting = submitState.phase === "submitting";
+    return (_jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-5", noValidate: true, children: [_jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: displayNameId, className: "text-xs uppercase tracking-wide text-muted-foreground", children: "Display name" }), _jsx(Input, { id: displayNameId, type: "text", autoComplete: "username", placeholder: "Your display name", value: displayName, onChange: (e) => {
+                                    setDisplayName(e.target.value);
+                                    if (submitState.phase === "error")
+                                        setSubmitState({ phase: "idle" });
+                                }, disabled: isSubmitting, "aria-required": "true" })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: passwordId, className: "text-xs uppercase tracking-wide text-muted-foreground", children: "Password" }), _jsx(Input, { id: passwordId, type: "password", autoComplete: "current-password", placeholder: "Your password", value: password, onChange: (e) => {
+                                    setPassword(e.target.value);
+                                    if (submitState.phase === "error")
+                                        setSubmitState({ phase: "idle" });
+                                }, disabled: isSubmitting, "aria-required": "true" })] }), _jsxs("label", { className: "flex cursor-pointer items-center gap-2 text-sm text-muted-foreground select-none", children: [_jsx("input", { type: "checkbox", checked: rememberDevice, onChange: (e) => setRememberDevice(e.target.checked), disabled: isSubmitting, className: "h-4 w-4 rounded border-border accent-primary" }), "Remember this device for 30 days"] })] }), submitState.phase === "error" && (_jsx("p", { role: "alert", className: "rounded-lg border border-[color:color-mix(in_srgb,var(--danger)_38%,transparent)] bg-[color:color-mix(in_srgb,var(--danger)_12%,transparent)] px-4 py-3 text-sm text-danger", children: submitState.message })), _jsx(Button, { type: "submit", disabled: isSubmitting || !displayName.trim() || !password, className: "w-full", children: isSubmitting ? "Signing in…" : "Sign in" })] }));
+}
+// ── Root component ────────────────────────────────────────────────────────────
+const SCREEN_SHELL_CLASS = "relative flex min-h-screen w-full items-center justify-center overflow-hidden bg-bg px-4 py-6 font-body text-txt sm:px-6";
+const SCREEN_CARD_CLASS = "relative z-10 w-full max-w-[520px] overflow-hidden border border-border/60 bg-card/95 shadow-[0_30px_120px_rgba(0,0,0,0.35)] backdrop-blur-xl";
+export function LoginView({ onLoginSuccess, loginFn, reason }) {
+    const remotePasswordMissing = reason === "remote_password_not_configured";
+    return (_jsxs("div", { className: SCREEN_SHELL_CLASS, children: [_jsx("div", { className: "absolute inset-0 overflow-hidden pointer-events-none", children: _jsx("div", { className: "absolute inset-0 bg-[radial-gradient(circle_at_top,rgba(255,255,255,0.08),transparent_40%),linear-gradient(180deg,rgba(11,14,20,0.24),rgba(6,7,8,0.62))]" }) }), _jsxs(Card, { className: SCREEN_CARD_CLASS, children: [_jsx(CardHeader, { className: "pb-2 pt-6 px-6", children: _jsxs("div", { className: "mb-1", children: [_jsx("p", { className: onboardingEyebrowClass, style: onboardingBodyTextShadowStyle, children: "Eliza" }), _jsx(OnboardingStepDivider, {}), _jsx(CardTitle, { className: cn(onboardingTitleClass, "mt-2"), style: { textShadow: "var(--onboarding-text-shadow-strong)" }, children: remotePasswordMissing ? "Remote access blocked" : "Sign in" }), _jsx("p", { className: cn(onboardingDescriptionClass, "mt-2"), style: onboardingBodyTextShadowStyle, children: remotePasswordMissing
+                                        ? "A remote password is required before this instance can accept browser logins from another machine."
+                                        : "Sign in with your password." })] }) }), _jsx(CardContent, { className: "px-6 pb-6", children: remotePasswordMissing ? (_jsxs("div", { role: "alert", className: "space-y-3 rounded-lg border border-border/60 bg-bg/50 px-4 py-3 text-sm leading-6 text-muted-foreground", children: [_jsx("p", { children: "The remote agent has no owner password configured yet, so it cannot accept logins from another machine. Set one on the host first." }), _jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-xs uppercase tracking-wider text-muted-foreground/70", children: "Two ways to fix it:" }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-xs text-muted-foreground/80", children: "From a browser on the host machine, open this URL then go to Settings \u2192 Security:" }), _jsx("code", { className: "block break-all rounded bg-bg/70 px-2 py-1.5 font-mono text-[11px] text-foreground", children: "http://localhost:31337/" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-xs text-muted-foreground/80", children: "Or via SSH (replace YOURNAME and YOURPASS with your own):" }), _jsx("code", { className: "block break-all rounded bg-bg/70 px-2 py-1.5 font-mono text-[11px] text-foreground", children: `curl -X POST http://127.0.0.1:31337/api/auth/setup -H "Content-Type: application/json" -d '{"displayName":"YOURNAME","password":"YOURPASS"}'` })] })] }), _jsx("p", { className: "text-xs text-muted-foreground/70", children: "Then return to this screen \u2014 it will refresh automatically." })] })) : (_jsx(PasswordTab, { onLoginSuccess: onLoginSuccess, loginFn: loginFn })) })] })] }));
+}

package/components/character/CharacterEditor.d.ts

@@ -0,0 +1,12 @@
+import { type ReactNode } from "react";
+export declare function CharacterEditor({ sceneOverlay, inModal: _inModal, onHeaderActionsChange, }?: {
+    sceneOverlay?: boolean;
+    inModal?: boolean;
+    onHeaderActionsChange?: (actions: ReactNode | null) => void;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * Re-export as CharacterView so the upstream App.tsx import resolves here
+ * when the Vite alias redirects ./CharacterView to this file.
+ */
+export { CharacterEditor as CharacterView };
+//# sourceMappingURL=CharacterEditor.d.ts.map

package/components/character/CharacterEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CharacterEditor.d.ts","sourceRoot":"","sources":["../../../../../../src/components/character/CharacterEditor.tsx"],"names":[],"mappings":"AAmFA,OAAO,EAEL,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AA6Df,wBAAgB,eAAe,CAAC,EAC9B,YAAoB,EACpB,OAAO,EAAE,QAAgB,EACzB,qBAAqB,GACtB,GAAE;IACD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,qBAAqB,CAAC,EAAE,CAAC,OAAO,EAAE,SAAS,GAAG,IAAI,KAAK,IAAI,CAAC;CACxD,2CAyyCL;AAED;;;GAGG;AACH,OAAO,EAAE,eAAe,IAAI,aAAa,EAAE,CAAC"}