@elizaos/ui 2.0.3-beta.2 → 2.0.3-beta.3

package/components/local-inference/LocalInferencePanel.js

@@ -1,31 +1,29 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CheckCircle2, Play } from "lucide-react";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { client } from "../../api/index.js";
-import { appNameInterpolationVars, useBranding } from "../../config/branding.js";
 import { useRenderGuard } from "../../hooks/useRenderGuard.js";
 import { filterSettingsDefaultLocalModels } from "../../services/local-inference/catalog-policy.js";
-import { useApp } from "../../state/index.js";
+import { useAppSelectorShallow } from "../../state/index.js";
 import { resolveApiUrl } from "../../utils/asset-url.js";
 import { getElizaApiToken } from "../../utils/eliza-globals.js";
+import { openEventSource } from "../../utils/event-source.js";
 import { AdvancedSettingsDisclosure } from "../settings/settings-control-primitives.js";
 import { Button } from "../ui/button.js";
 import { ActiveModelBar } from "./ActiveModelBar.js";
-import { CustomModelSearch } from "./CustomModelSearch.js";
 import { DeviceBridgeStatusBar } from "./DeviceBridgeStatus.js";
 import { DevicesPanel } from "./DevicesPanel.js";
 import { DownloadQueue } from "./DownloadQueue.js";
 import { FirstRunOffer } from "./FirstRunOffer.js";
 import { HardwareBadge } from "./HardwareBadge.js";
-import { displayModelName } from "./hub-utils.js";
 import { ModelHubView } from "./ModelHubView.js";
 import { ModelUpdatesPanel } from "./ModelUpdatesPanel.js";
-import { SlotAssignments } from "./SlotAssignments.js";
 import { useDeviceBridgeStatus } from "./useDeviceBridgeStatus.js";
 export function LocalInferencePanel() {
     useRenderGuard("LocalInferencePanel");
-    const { setActionNotice, t } = useApp();
-    const branding = useBranding();
+    const { setActionNotice, t } = useAppSelectorShallow((s) => ({
+        setActionNotice: s.setActionNotice,
+        t: s.t,
+    }));
     const [hub, setHub] = useState(null);
     const [busy, setBusy] = useState(false);
     const [error, setError] = useState(null);
@@ -55,8 +53,12 @@ export function LocalInferencePanel() {
         // route's `isStreamAuthorized` accepts either source.
         const url = resolveApiUrl("/api/local-inference/downloads/stream");
         const withToken = appendTokenParam(url);
-        const es = new EventSource(withToken, { withCredentials: false });
+        // On-device runtimes are reached over the native IPC base, which
+        // EventSource cannot open; skip live updates there rather than throwing.
+        const es = openEventSource(withToken, { withCredentials: false });
         eventSourceRef.current = es;
+        if (!es)
+            return;
         es.onmessage = (event) => {
             try {
                 const payload = JSON.parse(event.data);
@@ -129,15 +131,6 @@ export function LocalInferencePanel() {
             }), "success", 2000);
         });
     }, [setActionNotice, withBusy, t]);
-    const handleDownloadSpec = useCallback((spec) => {
-        void withBusy(async () => {
-            await client.startLocalInferenceDownload(spec);
-            setActionNotice(t("localinference.downloadingModel", {
-                model: displayModelName(spec),
-                defaultValue: "Downloading {{model}}",
-            }), "success", 2000);
-        });
-    }, [setActionNotice, withBusy, t]);
     const handleCancel = useCallback((modelId) => {
         void withBusy(async () => {
             await client.cancelLocalInferenceDownload(modelId);
@@ -216,9 +209,6 @@ export function LocalInferencePanel() {
             await refresh();
         });
     }, [refresh, setActionNotice, withBusy, t]);
-    const handleAssignmentsChange = useCallback((next) => {
-        setHub((prev) => prev ? { ...prev, assignments: next } : prev);
-    }, []);
     if (error && !hub) {
         return (_jsxs("div", { className: "flex items-center justify-between gap-3 rounded-sm border border-danger/30 bg-danger/10 px-3 py-2 text-sm text-danger", children: [_jsx("span", { children: error }), _jsx(Button, { size: "sm", variant: "outline", className: "h-8 rounded-sm", onClick: refresh, children: t("localinference.retry", { defaultValue: "Retry" }) })] }));
     }
@@ -230,10 +220,6 @@ export function LocalInferencePanel() {
     const catalog = filterSettingsDefaultLocalModels(hub.catalog);
     return (_jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(HardwareBadge, { hardware: hub.hardware }), _jsx(DeviceBridgeStatusBar, { status: deviceBridgeStatus }), _jsx(FirstRunOffer, { catalog: catalog, installed: hub.installed, downloads: hub.downloads, hardware: hub.hardware, onDownload: handleDownload, busy: busy }), _jsx(ActiveModelBar, { active: hub.active, installed: hub.installed, onUnload: handleUnload, busy: busy }), _jsx("nav", { className: "inline-flex h-8 w-fit items-center rounded-sm border border-border/60 bg-bg/40 p-0.5", children: [
                     ["curated", "Eliza-1"],
-                    [
-                        "search",
-                        t("localinference.tabSearch", { defaultValue: "Search" }),
-                    ],
                     [
                         "downloads",
                         t("localinference.tabDownloads", { defaultValue: "Downloads" }),
@@ -241,31 +227,9 @@ export function LocalInferencePanel() {
                 ].map(([id, label]) => {
                     const active = tab === id;
                     return (_jsx("button", { type: "button", onClick: () => setTab(id), className: `h-7 rounded-sm px-2.5 text-xs font-medium transition-colors ${active ? "bg-card text-txt " : "text-muted hover:text-txt"}`, children: _jsxs("span", { className: "inline-flex items-center gap-1.5", children: [label, id === "downloads" && hub.downloads.length > 0 ? (_jsx("span", { className: "rounded-full border border-border/50 bg-card px-1.5 py-0.5 text-[10px] leading-none text-muted", children: hub.downloads.length })) : null] }) }, id));
-                }) }), tab === "curated" && (_jsx(ModelHubView, { catalog: catalog, installed: hub.installed, downloads: hub.downloads, active: hub.active, hardware: hub.hardware, onDownload: handleDownload, onCancel: handleCancel, onActivate: handleActivate, onUninstall: handleUninstall, onVerify: handleVerify, onRedownload: handleRedownload, busy: busy })), tab === "search" && (_jsx(CustomModelSearch, { installed: hub.installed, downloads: hub.downloads, active: hub.active, hardware: hub.hardware, onDownload: handleDownloadSpec, onCancel: handleCancel, onActivate: handleActivate, onUninstall: handleUninstall, busy: busy })), tab === "downloads" && (_jsx(DownloadQueue, { downloads: hub.downloads, catalog: hub.catalog, onCancel: handleCancel })), _jsx(VoiceModelUpdatesSection, {}), _jsx(AdvancedSettingsDisclosure, { title: t("localinference.assignmentsTitle", {
-                    defaultValue: "Local model assignments",
-                }), lazy: true, children: _jsxs("div", { className: "flex flex-col gap-3", children: [_jsx(SlotAssignments, { installed: hub.installed, assignments: hub.assignments, onChange: handleAssignmentsChange }), _jsx(DevicesPanel, { status: deviceBridgeStatus }), _jsx(ExternalInstalledSummary, { installed: hub.installed, onActivate: handleActivate, active: hub.active, busy: busy, t: t, branding: branding })] }) })] }));
-}
-function ExternalInstalledSummary({ installed, onActivate, active, busy, t, branding, }) {
-    const external = installed.filter((m) => m.source === "external-scan");
-    if (external.length === 0)
-        return null;
-    return (_jsxs("section", { className: "space-y-2 border-t border-border/40 pt-3", children: [_jsx("header", { children: _jsx("h3", { className: "text-[10px] font-medium uppercase tracking-wider text-muted", title: t("localinference.discoveredTooltip", {
-                        defaultValue: "{{appName}} can load these models without re-downloading.",
-                        ...appNameInterpolationVars(branding),
-                    }), children: t("localinference.discoveredTitle", {
-                        defaultValue: "Discovered from other tools",
-                    }) }) }), _jsx("div", { className: "grid grid-cols-1 gap-2 md:grid-cols-2", children: external.map((m) => {
-                    const isActive = active.modelId === m.id && active.status !== "error";
-                    return (_jsxs("div", { className: "flex items-center justify-between gap-2 rounded-sm border border-border/50 bg-card/60 px-2 py-1.5", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "truncate text-sm font-medium text-txt", children: displayModelName(m) }), _jsxs("div", { className: "truncate text-xs-tight text-muted", children: [m.externalOrigin, " \u00B7 ", formatSize(m.sizeBytes)] })] }), isActive ? (_jsx("span", { className: "inline-flex h-8 w-8 shrink-0 items-center justify-center rounded-sm border border-ok/35 bg-ok/10 text-ok", title: t("localinference.active", { defaultValue: "Active" }), role: "img", "aria-label": t("localinference.active", {
-                                    defaultValue: "Active",
-                                }), children: _jsx(CheckCircle2, { className: "h-4 w-4", "aria-hidden": true }) })) : (_jsxs(Button, { size: "sm", className: "h-7 rounded-sm px-2 text-xs", onClick: () => onActivate(m.id), disabled: busy, children: [_jsx(Play, { className: "h-3.5 w-3.5", "aria-hidden": true }), t("localinference.activate", { defaultValue: "Activate" })] }))] }, m.id));
-                }) })] }));
-}
-function formatSize(bytes) {
-    const gb = bytes / 1024 ** 3;
-    return gb >= 1
-        ? `${gb.toFixed(1)} GB`
-        : `${Math.round(bytes / 1024 ** 2)} MB`;
+                }) }), tab === "curated" && (_jsx(ModelHubView, { catalog: catalog, installed: hub.installed, downloads: hub.downloads, active: hub.active, hardware: hub.hardware, onDownload: handleDownload, onCancel: handleCancel, onActivate: handleActivate, onUninstall: handleUninstall, onVerify: handleVerify, onRedownload: handleRedownload, busy: busy })), tab === "downloads" && (_jsx(DownloadQueue, { downloads: hub.downloads, catalog: hub.catalog, onCancel: handleCancel, onRetry: handleDownload })), _jsx(VoiceModelUpdatesSection, {}), _jsx(AdvancedSettingsDisclosure, { title: t("localinference.devicesTitle", {
+                    defaultValue: "Local runtime devices",
+                }), lazy: true, children: _jsx(DevicesPanel, { status: deviceBridgeStatus }) })] }));
 }
 function appendTokenParam(url) {
     const token = getElizaApiToken()?.trim();
@@ -286,7 +250,10 @@ function appendTokenParam(url) {
  * cellular/metered toggles are OWNER-only.
  */
 function VoiceModelUpdatesSection() {
-    const { setActionNotice, t } = useApp();
+    const { setActionNotice, t } = useAppSelectorShallow((s) => ({
+        setActionNotice: s.setActionNotice,
+        t: s.t,
+    }));
     const [preferences, setPreferences] = useState({
         autoUpdateOnWifi: true,
         autoUpdateOnCellular: false,

package/components/local-inference/ModelCard.d.ts

@@ -1,4 +1,4 @@
-import type { ActiveModelState, CatalogModel, DownloadJob, HardwareProbe, InstalledModel } from "../../api/client-local-inference";
+import type { ActiveModelState, CatalogModel, DownloadJob, HardwareProbe, InstalledModel } from "../../api/client-local-inference.js";
 interface ModelCardProps {
     model: CatalogModel;
     hardware: HardwareProbe;

package/components/local-inference/ModelCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModelCard.d.ts","sourceRoot":"","sources":["../../../../../../src/components/local-inference/ModelCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,gBAAgB,EAChB,YAAY,EACZ,WAAW,EACX,aAAa,EACb,cAAc,EACf,MAAM,kCAAkC,CAAC;AAiB1C,UAAU,cAAc;IACtB,KAAK,EAAE,YAAY,CAAC;IACpB,QAAQ,EAAE,aAAa,CAAC;IACxB,SAAS,EAAE,cAAc,EAAE,CAAC;IAC5B,SAAS,EAAE,WAAW,EAAE,CAAC;IACzB,MAAM,EAAE,gBAAgB,CAAC;IACzB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,WAAW,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,mEAAmE;IACnE,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,uEAAuE;IACvE,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,IAAI,EAAE,OAAO,CAAC;CACf;AAQD,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,SAAS,EACT,SAAS,EACT,MAAM,EACN,UAAU,EACV,QAAQ,EACR,UAAU,EACV,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,sBAAsB,EACtB,IAAI,GACL,EAAE,cAAc,2CAqIhB"}
+{"version":3,"file":"ModelCard.d.ts","sourceRoot":"","sources":["../../../../../../src/components/local-inference/ModelCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,gBAAgB,EAChB,YAAY,EACZ,WAAW,EACX,aAAa,EACb,cAAc,EACf,MAAM,kCAAkC,CAAC;AAkB1C,UAAU,cAAc;IACtB,KAAK,EAAE,YAAY,CAAC;IACpB,QAAQ,EAAE,aAAa,CAAC;IACxB,SAAS,EAAE,cAAc,EAAE,CAAC;IAC5B,SAAS,EAAE,WAAW,EAAE,CAAC;IACzB,MAAM,EAAE,gBAAgB,CAAC;IACzB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,WAAW,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,mEAAmE;IACnE,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,uEAAuE;IACvE,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,IAAI,EAAE,OAAO,CAAC;CACf;AAQD,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,SAAS,EACT,SAAS,EACT,MAAM,EACN,UAAU,EACV,QAAQ,EACR,UAAU,EACV,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,sBAAsB,EACtB,IAAI,GACL,EAAE,cAAc,2CA6IhB"}

package/components/local-inference/ModelCard.js

@@ -1,10 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useTranslation } from "../../state/TranslationContext.hooks.js";
-import { formatByteSize } from "../../utils/format.js";
 import { Button } from "../ui/button.js";
 import { DownloadProgress } from "./DownloadProgress.js";
-import { computeFit, displayModelName, findDownload, findInstalled, fitLabel, } from "./hub-utils.js";
-const formatBytes = (bytes) => formatByteSize(bytes, { unknownLabel: "—" });
+import { computeFit, displayModelName, findDownload, findInstalled, fitLabel, formatBytes, } from "./hub-utils.js";
+import { catalogRuntimeClass, runtimeClassDescription, } from "./runtime-class-ui.js";
 const FIT_STYLES = {
     fits: "text-emerald-500 border-emerald-500/40 bg-emerald-500/10",
     tight: "text-amber-500 border-amber-500/40 bg-amber-500/10",
@@ -20,7 +19,7 @@ export function ModelCard({ model, hardware, installed, downloads, active, onDow
     const isActive = active.modelId === model.id && active.status !== "error";
     const activating = active.modelId === model.id && active.status === "loading";
     const parameterLabel = model.parameterLabel ?? model.params;
-    return (_jsxs("div", { className: "rounded-sm border border-border bg-card p-4 flex flex-col gap-3", children: [_jsxs("div", { className: "flex items-start justify-between gap-3", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "font-semibold truncate", children: displayModelName(model) }), _jsxs("div", { className: "text-xs text-muted-foreground truncate", children: [parameterLabel, " \u00B7 ", model.quant, " \u00B7 ", model.sizeGb.toFixed(1), " GB"] })] }), _jsx("span", { className: `shrink-0 rounded-full border px-2 py-0.5 text-xs ${FIT_STYLES[fit]}`, children: fitLabel(fit) })] }), _jsx("p", { className: "text-sm text-muted-foreground line-clamp-2", children: model.blurb }), installedEntry && (_jsxs("div", { className: "text-xs text-muted-foreground", children: [t("modelcard.installed", {
+    return (_jsxs("div", { className: "rounded-sm border border-border bg-card p-4 flex flex-col gap-3", children: [_jsxs("div", { className: "flex items-start justify-between gap-3", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "font-semibold truncate", children: displayModelName(model) }), _jsxs("div", { className: "text-xs text-muted-foreground truncate", children: [parameterLabel, " \u00B7 ", model.quant, " \u00B7 ", model.sizeGb.toFixed(1), " GB"] }), _jsx("div", { className: "mt-1 inline-flex w-fit rounded-full border border-border/60 px-1.5 py-0.5 text-[10px] leading-none text-muted-foreground", title: runtimeClassDescription(catalogRuntimeClass(model)), children: runtimeClassDescription(catalogRuntimeClass(model)) })] }), _jsx("span", { className: `shrink-0 rounded-full border px-2 py-0.5 text-xs ${FIT_STYLES[fit]}`, children: fitLabel(fit) })] }), _jsx("p", { className: "text-sm text-muted-foreground line-clamp-2", children: model.blurb }), installedEntry && (_jsxs("div", { className: "text-xs text-muted-foreground", children: [t("modelcard.installed", {
                         size: formatBytes(installedEntry.sizeBytes),
                         defaultValue: "Installed · {{size}}",
                     }), installedEntry.source === "external-scan" &&
@@ -35,7 +34,9 @@ export function ModelCard({ model, hardware, installed, downloads, active, onDow
                             ? t("modelcard.downloadUnavailable", {
                                 defaultValue: "Download unavailable",
                             })
-                            : t("modelcard.download", { defaultValue: "Download" }) })), downloading && (_jsx(Button, { size: "sm", variant: "outline", onClick: () => onCancel(model.id), disabled: busy, children: t("modelcard.cancel", { defaultValue: "Cancel" }) })), installedEntry && !isActive && (_jsx(Button, { size: "sm", onClick: () => onActivate(model.id), disabled: busy || activating, children: activating
+                            : failed
+                                ? t("modelcard.retry", { defaultValue: "Retry" })
+                                : t("modelcard.download", { defaultValue: "Download" }) })), downloading && (_jsx(Button, { size: "sm", variant: "outline", onClick: () => onCancel(model.id), disabled: busy, children: t("modelcard.cancel", { defaultValue: "Cancel" }) })), installedEntry && !isActive && (_jsx(Button, { size: "sm", onClick: () => onActivate(model.id), disabled: busy || activating, children: activating
                             ? t("modelcard.activating", { defaultValue: "Activating…" })
                             : t("modelcard.makeActive", { defaultValue: "Make active" }) })), isActive && (_jsx(Button, { size: "sm", variant: "outline", disabled: true, children: t("modelcard.active", { defaultValue: "Active" }) })), installedEntry && onVerify && (_jsx(Button, { size: "sm", variant: "ghost", onClick: () => onVerify(installedEntry.id), disabled: busy, children: t("modelcard.verify", { defaultValue: "Verify" }) })), installedEntry?.source === "eliza-download" && onRedownload && (_jsx(Button, { size: "sm", variant: "ghost", onClick: () => onRedownload(model.id), disabled: busy, children: t("modelcard.redownload", { defaultValue: "Redownload" }) })), installedEntry?.source === "eliza-download" && (_jsx(Button, { size: "sm", variant: "ghost", onClick: () => onUninstall(model.id), disabled: busy, children: t("modelcard.uninstall", { defaultValue: "Uninstall" }) }))] })] }));
 }

package/components/local-inference/ModelHubView.d.ts

@@ -1,4 +1,4 @@
-import type { ActiveModelState, CatalogModel, DownloadJob, HardwareProbe, InstalledModel } from "../../api/client-local-inference";
+import type { ActiveModelState, CatalogModel, DownloadJob, HardwareProbe, InstalledModel } from "../../api/client-local-inference.js";
 interface ModelHubViewProps {
     catalog: CatalogModel[];
     installed: InstalledModel[];

package/components/local-inference/ModelHubView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModelHubView.d.ts","sourceRoot":"","sources":["../../../../../../src/components/local-inference/ModelHubView.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,gBAAgB,EAChB,YAAY,EACZ,WAAW,EACX,aAAa,EACb,cAAc,EAEf,MAAM,kCAAkC,CAAC;AAoB1C,UAAU,iBAAiB;IACzB,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,SAAS,EAAE,cAAc,EAAE,CAAC;IAC5B,SAAS,EAAE,WAAW,EAAE,CAAC;IACzB,MAAM,EAAE,gBAAgB,CAAC;IACzB,QAAQ,EAAE,aAAa,CAAC;IACxB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,WAAW,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,IAAI,EAAE,OAAO,CAAC;CACf;AAUD,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,SAAS,EACT,SAAS,EACT,MAAM,EACN,QAAQ,EACR,UAAU,EACV,QAAQ,EACR,UAAU,EACV,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,IAAI,GACL,EAAE,iBAAiB,2CA+CnB"}
+{"version":3,"file":"ModelHubView.d.ts","sourceRoot":"","sources":["../../../../../../src/components/local-inference/ModelHubView.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EACV,gBAAgB,EAChB,YAAY,EACZ,WAAW,EACX,aAAa,EACb,cAAc,EAEf,MAAM,kCAAkC,CAAC;AAuB1C,UAAU,iBAAiB;IACzB,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,SAAS,EAAE,cAAc,EAAE,CAAC;IAC5B,SAAS,EAAE,WAAW,EAAE,CAAC;IACzB,MAAM,EAAE,gBAAgB,CAAC;IACzB,QAAQ,EAAE,aAAa,CAAC;IACxB,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACpC,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,WAAW,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,IAAI,EAAE,OAAO,CAAC;CACf;AAUD,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,SAAS,EACT,SAAS,EACT,MAAM,EACN,QAAQ,EACR,UAAU,EACV,QAAQ,EACR,UAAU,EACV,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,IAAI,GACL,EAAE,iBAAiB,2CA+CnB"}

package/components/local-inference/ModelHubView.js

@@ -3,11 +3,10 @@ import { CheckCircle2 } from "lucide-react";
 import { useMemo } from "react";
 import { useRenderGuard } from "../../hooks/useRenderGuard.js";
 import { useTranslation } from "../../state/TranslationContext.hooks.js";
-import { formatByteSize } from "../../utils/format.js";
 import { Button } from "../ui/button.js";
 import { DownloadProgress } from "./DownloadProgress.js";
-import { bucketLabel, computeFit, displayModelName, findDownload, findInstalled, fitLabel, groupByBucket, } from "./hub-utils.js";
-const formatBytes = (bytes) => formatByteSize(bytes, { unknownLabel: "—" });
+import { bucketLabel, computeFit, displayModelName, findDownload, findInstalled, fitLabel, formatBytes, groupByBucket, } from "./hub-utils.js";
+import { catalogRuntimeClass, runtimeClassBadge, runtimeClassDescription, runtimeClassUnavailableReason, } from "./runtime-class-ui.js";
 const BUCKET_ORDER = ["small", "mid", "large", "xl"];
 const FIT_STYLES = {
     fits: "text-ok",
@@ -35,6 +34,9 @@ function ModelListRow({ model, hardware, installed, downloads, active, onDownloa
     const failed = download?.state === "failed";
     const isActive = active.modelId === model.id && active.status !== "error";
     const activating = active.modelId === model.id && active.status === "loading";
+    const runtimeClass = catalogRuntimeClass(model);
+    const unavailableReason = runtimeClassUnavailableReason(runtimeClass);
+    const notRunnable = unavailableReason !== null;
     const modelMeta = [
         model.params,
         model.quant,
@@ -42,7 +44,7 @@ function ModelListRow({ model, hardware, installed, downloads, active, onDownloa
     ];
     return (_jsx("div", { className: "border-border/40 border-b px-2.5 py-2 last:border-b-0", title: model.blurb, children: _jsxs("div", { className: "grid gap-2 md:grid-cols-[minmax(0,1fr)_auto] md:items-center", children: [_jsxs("div", { className: "min-w-0", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [isActive ? (_jsx("span", { className: "inline-flex h-5 w-5 shrink-0 items-center justify-center text-accent", title: t("modelhub.active", { defaultValue: "Active" }), role: "img", "aria-label": t("modelhub.activeModel", {
                                         defaultValue: "Active model",
-                                    }), children: _jsx(CheckCircle2, { className: "h-3.5 w-3.5", "aria-hidden": true }) })) : null, _jsx("div", { className: "min-w-0 flex-1 truncate font-semibold text-sm text-txt", children: displayModelName(model) }), _jsx("span", { className: `inline-flex h-5 w-5 shrink-0 items-center justify-center ${FIT_STYLES[fit]}`, title: fitLabel(fit), role: "img", "aria-label": t("modelhub.fitAria", {
+                                    }), children: _jsx(CheckCircle2, { className: "h-3.5 w-3.5", "aria-hidden": true }) })) : null, _jsx("div", { className: "min-w-0 flex-1 truncate font-semibold text-sm text-txt", children: displayModelName(model) }), _jsx("span", { className: "shrink-0 rounded-full border border-border/60 px-1.5 py-0.5 text-[10px] leading-none text-muted", title: runtimeClassDescription(runtimeClass), children: runtimeClassBadge(runtimeClass) }), _jsx("span", { className: `inline-flex h-5 w-5 shrink-0 items-center justify-center ${FIT_STYLES[fit]}`, title: fitLabel(fit), role: "img", "aria-label": t("modelhub.fitAria", {
                                         fit: fitLabel(fit),
                                         defaultValue: "Fit: {{fit}}",
                                     }), children: _jsx("span", { className: "h-2 w-2 rounded-full bg-current" }) })] }), _jsxs("div", { className: "mt-0.5 flex flex-wrap gap-x-2 gap-y-0.5 text-muted text-xs", children: [_jsx("span", { children: modelMeta.join(" · ") }), installedEntry ? (_jsxs("span", { children: [t("modelhub.installed", {
@@ -54,10 +56,12 @@ function ModelListRow({ model, hardware, installed, downloads, active, onDownloa
                                                 origin: installedEntry.externalOrigin,
                                                 defaultValue: " · via {{origin}}",
                                             })
-                                            : ""] })) : null] }), download && downloading ? (_jsx("div", { className: "mt-1.5", children: _jsx(DownloadProgress, { job: download }) })) : null, failed && download?.error ? (_jsx("div", { className: "mt-1 text-danger text-xs", children: t("modelhub.downloadFailed", {
+                                            : ""] })) : null, notRunnable ? (_jsx("span", { className: "text-warn", title: unavailableReason ?? undefined, children: t("modelhub.notRunnable", {
+                                        defaultValue: "Not runnable on this platform",
+                                    }) })) : null] }), download && downloading ? (_jsx("div", { className: "mt-1.5", children: _jsx(DownloadProgress, { job: download }) })) : null, failed && download?.error ? (_jsx("div", { className: "mt-1 text-danger text-xs", children: t("modelhub.downloadFailed", {
                                 error: download.error,
                                 defaultValue: "Download failed: {{error}}",
-                            }) })) : null] }), _jsxs("div", { className: "flex flex-wrap items-center gap-1.5 md:justify-end", children: [!installedEntry && !downloading ? (_jsx(Button, { size: "sm", className: "h-7 rounded-sm px-2 text-xs", onClick: () => onDownload(model.id), disabled: busy || fit === "wontfit", children: t("modelhub.download", { defaultValue: "Download" }) })) : null, downloading ? (_jsx(Button, { size: "sm", variant: "outline", className: "h-7 rounded-sm px-2 text-xs", onClick: () => onCancel(model.id), disabled: busy, children: t("modelhub.cancel", { defaultValue: "Cancel" }) })) : null, installedEntry && !isActive ? (_jsx(Button, { size: "sm", className: "h-7 rounded-sm px-2 text-xs", onClick: () => onActivate(model.id), disabled: busy || activating, children: activating
+                            }) })) : null] }), _jsxs("div", { className: "flex flex-wrap items-center gap-1.5 md:justify-end", children: [!installedEntry && !downloading ? (_jsx(Button, { size: "sm", className: "h-7 rounded-sm px-2 text-xs", onClick: () => onDownload(model.id), disabled: busy || fit === "wontfit" || notRunnable, title: unavailableReason ?? undefined, children: t("modelhub.download", { defaultValue: "Download" }) })) : null, downloading ? (_jsx(Button, { size: "sm", variant: "outline", className: "h-7 rounded-sm px-2 text-xs", onClick: () => onCancel(model.id), disabled: busy, children: t("modelhub.cancel", { defaultValue: "Cancel" }) })) : null, installedEntry && !isActive ? (_jsx(Button, { size: "sm", className: "h-7 rounded-sm px-2 text-xs", onClick: () => onActivate(model.id), disabled: busy || activating || notRunnable, title: unavailableReason ?? undefined, children: activating
                                 ? t("modelhub.activating", { defaultValue: "Activating..." })
                                 : t("modelhub.makeActive", { defaultValue: "Make active" }) })) : null, installedEntry && onVerify ? (_jsx(Button, { size: "sm", variant: "ghost", className: "h-7 rounded-sm px-2 text-xs", onClick: () => onVerify(installedEntry.id), disabled: busy, children: t("modelhub.verify", { defaultValue: "Verify" }) })) : null, installedEntry?.source === "eliza-download" && onRedownload ? (_jsx(Button, { size: "sm", variant: "ghost", className: "h-7 rounded-sm px-2 text-xs", onClick: () => onRedownload(model.id), disabled: busy, children: t("modelhub.redownload", { defaultValue: "Redownload" }) })) : null, installedEntry?.source === "eliza-download" ? (_jsx(Button, { size: "sm", variant: "ghost", className: "h-7 rounded-sm px-2 text-xs", onClick: () => onUninstall(model.id), disabled: busy, children: t("modelhub.uninstall", { defaultValue: "Uninstall" }) })) : null] })] }) }));
 }

package/components/local-inference/RoutingMatrix.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RoutingMatrix.d.ts","sourceRoot":"","sources":["../../../../../../src/components/local-inference/RoutingMatrix.tsx"],"names":[],"mappings":"AAiEA,wBAAgB,aAAa,4CAoP5B"}
+{"version":3,"file":"RoutingMatrix.d.ts","sourceRoot":"","sources":["../../../../../../src/components/local-inference/RoutingMatrix.tsx"],"names":[],"mappings":"AAsFA,wBAAgB,aAAa,4CA2L5B"}

package/components/local-inference/RoutingMatrix.js

@@ -1,9 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useRef, useState } from "react";
+import { useAgentElement } from "../../agent-surface/index.js";
 import { client } from "../../api/index.js";
+import { useIntervalWhenDocumentVisible } from "../../hooks/useDocumentVisibility.js";
 import { useRenderGuard } from "../../hooks/useRenderGuard.js";
 import { useTranslation } from "../../state/TranslationContext.hooks.js";
+import { Select, SelectContent, SelectItem, SelectValue } from "../ui/select.js";
+import { SettingsSelectTrigger } from "../ui/settings-controls.js";
 import { LOCAL_INFERENCE_SLOT_DESCRIPTORS } from "./slot-metadata.js";
+const PREFERRED_AUTO_VALUE = "__auto__";
 const DEFAULT_POLICY = "prefer-local";
 const POLICIES = [
     {
@@ -20,6 +25,20 @@ const POLICIES = [
         hintKey: "routingmatrix.policy.auto.hint",
         hint: "Run local when this device can handle it, else cloud.",
     },
+    {
+        value: "local-only",
+        labelKey: "routingmatrix.policy.localOnly.label",
+        label: "On-device only",
+        hintKey: "routingmatrix.policy.localOnly.hint",
+        hint: "Always run on this device; never use cloud.",
+    },
+    {
+        value: "cloud-only",
+        labelKey: "routingmatrix.policy.cloudOnly.label",
+        label: "Cloud only",
+        hintKey: "routingmatrix.policy.cloudOnly.hint",
+        hint: "Always use cloud; never run on-device.",
+    },
     {
         value: "cheapest",
         labelKey: "routingmatrix.policy.cheapest.label",
@@ -58,6 +77,7 @@ export function RoutingMatrix() {
         policy: {},
     });
     const [error, setError] = useState(null);
+    const [deviceTier, setDeviceTier] = useState(null);
     const [busySlots, setBusySlots] = useState(() => new Set());
     const requestSeqRef = useRef(new Map());
     const setSlotBusy = useCallback((slot, busy) => {
@@ -72,34 +92,56 @@ export function RoutingMatrix() {
             return next;
         });
     }, []);
+    const refreshRouting = useCallback(async () => {
+        try {
+            const data = await client.getLocalInferenceRouting();
+            setRegistrations(data.registrations);
+            setPreferences(data.preferences);
+            setError(null);
+        }
+        catch (err) {
+            setError(err instanceof Error
+                ? err.message
+                : t("routingmatrix.loadError", {
+                    defaultValue: "Failed to load routing",
+                }));
+        }
+    }, [t]);
+    useEffect(() => {
+        void refreshRouting();
+    }, [refreshRouting]);
+    useIntervalWhenDocumentVisible(() => void refreshRouting(), 15_000);
     useEffect(() => {
         let active = true;
-        const refreshIfActive = async () => {
-            try {
-                const data = await client.getLocalInferenceRouting();
-                if (!active)
-                    return;
-                setRegistrations(data.registrations);
-                setPreferences(data.preferences);
-                setError(null);
-            }
-            catch (err) {
-                if (active) {
-                    setError(err instanceof Error
-                        ? err.message
-                        : t("routingmatrix.loadError", {
-                            defaultValue: "Failed to load routing",
-                        }));
-                }
-            }
-        };
-        void refreshIfActive();
-        const interval = setInterval(() => void refreshIfActive(), 15_000);
+        void (async () => {
+            const result = await client.getLocalInferenceDeviceTier();
+            if (active)
+                setDeviceTier(result);
+        })();
         return () => {
             active = false;
-            clearInterval(interval);
         };
-    }, [t]);
+    }, []);
+    // For an "Auto" slot (no preferred provider pinned) the runtime resolves
+    // on-device vs cloud from the device tier: MAX/GOOD run locally, OKAY/POOR
+    // route to cloud. Surface the same resolution the runtime will make.
+    const autoResolution = useCallback((policy) => {
+        if (!deviceTier)
+            return null;
+        if (policy !== "prefer-local" && policy !== "cheapest")
+            return null;
+        const onDevice = deviceTier.tier === "MAX" || deviceTier.tier === "GOOD";
+        const line = onDevice
+            ? t("routingmatrix.autoOnDevice", {
+                tier: deviceTier.tier,
+                defaultValue: "Auto: on-device · {{tier}} tier",
+            })
+            : t("routingmatrix.autoCloud", {
+                tier: deviceTier.tier,
+                defaultValue: "Auto: cloud · device is {{tier}}",
+            });
+        return { onDevice, line };
+    }, [deviceTier, t]);
     const handlePolicy = useCallback(async (slot, policy) => {
         const requestId = (requestSeqRef.current.get(slot) ?? 0) + 1;
         requestSeqRef.current.set(slot, requestId);
@@ -159,22 +201,55 @@ export function RoutingMatrix() {
                         .sort((a, b) => b.priority - a.priority);
                     const policy = preferences.policy[slot] ?? DEFAULT_POLICY;
                     const preferred = preferences.preferredProvider[slot] ?? "";
-                    const disabled = busySlots.has(slot);
-                    return (_jsxs("div", { className: "rounded-sm border border-border bg-card p-3 flex flex-col gap-2", children: [_jsxs("div", { className: "flex items-center justify-between gap-2", children: [_jsx("span", { className: "font-medium text-sm", title: slot, children: label }), _jsx("span", { className: `h-2 w-2 rounded-full ${candidates.length > 0 ? "bg-ok" : "bg-muted"}`, title: t("routingmatrix.availableProviders", {
-                                            count: candidates.length,
-                                            defaultValue: "{{count}} available providers",
-                                        }), "aria-hidden": true })] }), _jsxs("div", { className: "grid grid-cols-1 gap-2 md:grid-cols-2", children: [_jsxs("label", { className: "flex flex-col gap-1 text-xs", children: [_jsx("span", { className: "text-muted-foreground", children: t("routingmatrix.policyLabel", { defaultValue: "Policy" }) }), _jsx("select", { value: policy, disabled: disabled, onChange: (e) => void handlePolicy(slot, e.target.value), className: "rounded-sm border border-border bg-bg/50 px-2 py-1.5 text-sm", children: POLICIES.map((p) => (_jsx("option", { value: p.value, title: t(p.hintKey, { defaultValue: p.hint }), children: t(p.labelKey, { defaultValue: p.label }) }, p.value))) })] }), _jsxs("label", { className: "flex flex-col gap-1 text-xs", children: [_jsxs("span", { className: "text-muted-foreground", children: [t("routingmatrix.preferredProvider", {
-                                                        defaultValue: "Preferred provider",
-                                                    }), policy !== "manual" &&
-                                                        t("routingmatrix.manualOnly", {
-                                                            defaultValue: " (manual only)",
-                                                        })] }), _jsxs("select", { value: preferred, disabled: disabled, onChange: (e) => void handlePreferred(slot, e.target.value || null), className: "rounded-sm border border-border bg-bg/50 px-2 py-1.5 text-sm disabled:opacity-60", children: [_jsx("option", { value: "", children: t("routingmatrix.auto", { defaultValue: "Auto" }) }), candidates.map((c) => (_jsxs("option", { value: c.provider, children: [c.provider, typeof c.priority === "number"
-                                                                ? t("routingmatrix.priority", {
-                                                                    priority: c.priority,
-                                                                    defaultValue: " (priority {{priority}})",
-                                                                })
-                                                                : ""] }, c.provider)))] })] })] }), candidates.length === 0 ? (_jsx("div", { className: "text-xs text-muted-foreground italic", children: t("routingmatrix.noProvider", {
-                                    defaultValue: "No provider has registered a handler for this slot yet.",
-                                }) })) : (_jsx("div", { className: "flex flex-wrap gap-1", children: candidates.map((c) => (_jsx("span", { className: "rounded-full border border-border px-1.5 py-0.5 text-[10px] text-muted-foreground", children: c.provider }, c.provider))) }))] }, slot));
+                    // The auto-resolution hint only applies when no provider is pinned.
+                    const resolution = preferred === "" ? autoResolution(policy) : null;
+                    return (_jsx(RoutingSlotRow, { slot: slot, label: label, candidates: candidates, policy: policy, preferred: preferred, disabled: busySlots.has(slot), resolution: resolution, onPolicyChange: handlePolicy, onPreferredChange: handlePreferred }, slot));
                 }) })] }));
 }
+function RoutingSlotRow({ slot, label, candidates, policy, preferred, disabled, resolution, onPolicyChange, onPreferredChange, }) {
+    const { t } = useTranslation();
+    const policyLabel = t("routingmatrix.policyLabel", {
+        defaultValue: "Policy",
+    });
+    const preferredLabel = t("routingmatrix.preferredProvider", {
+        defaultValue: "Preferred provider",
+    });
+    const policyAgent = useAgentElement({
+        id: `routing-policy-${slot}`,
+        role: "select",
+        label: `${label} ${policyLabel}`,
+        group: "model-routing",
+        status: policy,
+        options: POLICIES.map((p) => p.value),
+        getValue: () => policy,
+        onFill: disabled
+            ? undefined
+            : (next) => onPolicyChange(slot, next),
+    });
+    const preferredAgent = useAgentElement({
+        id: `routing-preferred-${slot}`,
+        role: "select",
+        label: `${label} ${preferredLabel}`,
+        group: "model-routing",
+        status: preferred || undefined,
+        options: candidates.map((c) => c.provider),
+        getValue: () => preferred,
+        onFill: disabled
+            ? undefined
+            : (next) => onPreferredChange(slot, next || null),
+    });
+    return (_jsxs("div", { className: "rounded-sm border border-border bg-card p-3 flex flex-col gap-2", children: [_jsxs("div", { className: "flex items-center justify-between gap-2", children: [_jsx("span", { className: "font-medium text-sm", title: slot, children: label }), _jsx("span", { className: `h-2 w-2 rounded-full ${candidates.length > 0 ? "bg-ok" : "bg-muted"}`, title: t("routingmatrix.availableProviders", {
+                            count: candidates.length,
+                            defaultValue: "{{count}} available providers",
+                        }), "aria-hidden": true })] }), _jsxs("div", { className: "grid grid-cols-1 gap-2 md:grid-cols-2", children: [_jsxs("div", { className: "flex flex-col gap-1 text-xs", children: [_jsx("span", { className: "text-muted", children: policyLabel }), _jsxs(Select, { value: policy, disabled: disabled, onValueChange: (value) => void onPolicyChange(slot, value), children: [_jsx(SettingsSelectTrigger, { ref: policyAgent.ref, variant: "filter", "aria-label": `${label} ${policyLabel}`, ...policyAgent.agentProps, children: _jsx(SelectValue, {}) }), _jsx(SelectContent, { children: POLICIES.map((p) => (_jsx(SelectItem, { value: p.value, title: t(p.hintKey, { defaultValue: p.hint }), children: t(p.labelKey, { defaultValue: p.label }) }, p.value))) })] })] }), _jsxs("div", { className: "flex flex-col gap-1 text-xs", children: [_jsxs("span", { className: "text-muted", children: [preferredLabel, policy !== "manual" &&
+                                        t("routingmatrix.manualOnly", {
+                                            defaultValue: " (manual only)",
+                                        })] }), _jsxs(Select, { value: preferred || PREFERRED_AUTO_VALUE, disabled: disabled, onValueChange: (value) => void onPreferredChange(slot, value === PREFERRED_AUTO_VALUE ? null : value), children: [_jsx(SettingsSelectTrigger, { ref: preferredAgent.ref, variant: "filter", "aria-label": `${label} ${preferredLabel}`, ...preferredAgent.agentProps, children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: PREFERRED_AUTO_VALUE, children: t("routingmatrix.auto", { defaultValue: "Auto" }) }), candidates.map((c) => (_jsxs(SelectItem, { value: c.provider, children: [c.provider, typeof c.priority === "number"
+                                                        ? t("routingmatrix.priority", {
+                                                            priority: c.priority,
+                                                            defaultValue: " (priority {{priority}})",
+                                                        })
+                                                        : ""] }, c.provider)))] })] })] })] }), candidates.length === 0 ? (_jsx("div", { className: "text-xs text-muted italic", children: t("routingmatrix.noProvider", {
+                    defaultValue: "No provider has registered a handler for this slot yet.",
+                }) })) : (_jsx("div", { className: "flex flex-wrap gap-1", children: candidates.map((c) => (_jsx("span", { className: "rounded-full border border-border px-1.5 py-0.5 text-[10px] text-muted", children: c.provider }, c.provider))) })), resolution ? (_jsxs("div", { "data-testid": `routing-auto-resolution-${slot}`, className: `flex items-center gap-1.5 text-[10px] ${resolution.onDevice ? "text-accent" : "text-muted"}`, children: [_jsx("span", { className: `h-1.5 w-1.5 rounded-full ${resolution.onDevice ? "bg-accent" : "bg-muted"}`, "aria-hidden": true }), _jsx("span", { children: resolution.line })] })) : null] }));
+}

package/components/local-inference/SlotAssignments.d.ts

@@ -1,4 +1,4 @@
-import type { InstalledModel, ModelAssignments } from "../../api/client-local-inference";
+import type { InstalledModel, ModelAssignments } from "../../api/client-local-inference.js";
 interface SlotAssignmentsProps {
     installed: InstalledModel[];
     assignments: ModelAssignments;

package/components/local-inference/SlotAssignments.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SlotAssignments.d.ts","sourceRoot":"","sources":["../../../../../../src/components/local-inference/SlotAssignments.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAEV,cAAc,EACd,gBAAgB,EACjB,MAAM,kCAAkC,CAAC;AAM1C,UAAU,oBAAoB;IAC5B,SAAS,EAAE,cAAc,EAAE,CAAC;IAC5B,WAAW,EAAE,gBAAgB,CAAC;IAC9B,QAAQ,EAAE,CAAC,WAAW,EAAE,gBAAgB,KAAK,IAAI,CAAC;CACnD;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,WAAW,EACX,QAAQ,GACT,EAAE,oBAAoB,2CA+GtB"}
+{"version":3,"file":"SlotAssignments.d.ts","sourceRoot":"","sources":["../../../../../../src/components/local-inference/SlotAssignments.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAEV,cAAc,EACd,gBAAgB,EACjB,MAAM,kCAAkC,CAAC;AAa1C,UAAU,oBAAoB;IAC5B,SAAS,EAAE,cAAc,EAAE,CAAC;IAC5B,WAAW,EAAE,gBAAgB,CAAC;IAC9B,QAAQ,EAAE,CAAC,WAAW,EAAE,gBAAgB,KAAK,IAAI,CAAC;CACnD;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,WAAW,EACX,QAAQ,GACT,EAAE,oBAAoB,2CAsJtB"}

package/components/local-inference/SlotAssignments.js

@@ -3,7 +3,9 @@ import { useCallback, useRef, useState } from "react";
 import { client } from "../../api/index.js";
 import { appNameInterpolationVars, useBranding } from "../../config/branding.js";
 import { useRenderGuard } from "../../hooks/useRenderGuard.js";
+import { isVerifiedCuratedEliza1Download } from "../../services/local-inference/catalog-policy.js";
 import { useTranslation } from "../../state/TranslationContext.hooks.js";
+import { installedRuntimeClass, runtimeClassBadge, runtimeClassDescription, runtimeClassUnavailableReason, } from "./runtime-class-ui.js";
 import { LOCAL_INFERENCE_SLOT_DESCRIPTORS } from "./slot-metadata.js";
 /**
  * Per-ModelType slot assignment UI. Renders one dropdown per agent model
@@ -17,6 +19,7 @@ export function SlotAssignments({ installed, assignments, onChange, }) {
     const branding = useBranding();
     const requestSeqRef = useRef(new Map());
     const [busySlots, setBusySlots] = useState(() => new Set());
+    const [slotErrors, setSlotErrors] = useState({});
     const setSlotBusy = useCallback((slot, busy) => {
         setBusySlots((prev) => {
             const next = new Set(prev);
@@ -33,35 +36,49 @@ export function SlotAssignments({ installed, assignments, onChange, }) {
         const requestId = (requestSeqRef.current.get(slot) ?? 0) + 1;
         requestSeqRef.current.set(slot, requestId);
         setSlotBusy(slot, true);
+        setSlotErrors((prev) => ({ ...prev, [slot]: undefined }));
         try {
             const response = await client.setLocalInferenceAssignment(slot, modelId);
             if (requestSeqRef.current.get(slot) === requestId) {
                 onChange(response.assignments);
             }
         }
+        catch (err) {
+            // The server rejects a pick the platform's engine can't serve with a
+            // typed reason (422). Surface it inline instead of a silent no-op.
+            if (requestSeqRef.current.get(slot) === requestId) {
+                setSlotErrors((prev) => ({
+                    ...prev,
+                    [slot]: err instanceof Error ? err.message : String(err),
+                }));
+            }
+        }
         finally {
             if (requestSeqRef.current.get(slot) === requestId) {
                 setSlotBusy(slot, false);
             }
         }
     }, [onChange, setSlotBusy]);
-    if (installed.length === 0) {
+    const assignableInstalled = installed.filter(isVerifiedCuratedEliza1Download);
+    if (assignableInstalled.length === 0) {
         return (_jsx("div", { className: "rounded-sm border border-dashed border-border p-4 text-sm text-muted-foreground", children: t("slotassignments.empty", {
-                defaultValue: "Download or scan at least one model to use local inference.",
+                defaultValue: "Download Eliza-1 to enable local inference. Local setup no longer uses scanned or custom GGUFs.",
             }) }));
     }
     return (_jsxs("section", { className: "flex flex-col gap-3", children: [_jsx("h3", { className: "text-sm font-semibold uppercase tracking-wide text-muted-foreground", children: t("slotassignments.title", {
-                    defaultValue: "Local model assignments",
+                    defaultValue: "Managed Eliza-1 routing",
                 }) }), _jsx("p", { className: "text-xs text-muted-foreground", children: t("slotassignments.description", {
-                    defaultValue: "{{appName}} defaults both text routes to the largest installed local model so only one model has to stay in memory. Override a slot only when you explicitly want a different local model.",
+                    defaultValue: "{{appName}} keeps every local slot on the selected Eliza-1 bundle so setup stays one-click and the FFI runtime controls memory.",
                     ...appNameInterpolationVars(branding),
                 }) }), _jsx("div", { className: "grid grid-cols-1 gap-3 md:grid-cols-2", children: LOCAL_INFERENCE_SLOT_DESCRIPTORS.map(({ slot, label, description }) => {
                     const currentId = assignments[slot] ?? "";
-                    return (_jsxs("label", { className: "rounded-sm border border-border bg-card p-3 flex flex-col gap-1.5", children: [_jsx("span", { className: "text-sm font-medium", children: label }), _jsx("span", { className: "text-xs text-muted-foreground", children: description }), _jsxs("select", { value: currentId, disabled: busySlots.has(slot), onChange: (e) => void handleChange(slot, e.target.value || null), className: "mt-1 rounded-sm border border-border bg-bg/50 px-2 py-1.5 text-sm", children: [_jsx("option", { value: "", children: t("slotassignments.auto", { defaultValue: "Auto" }) }), installed.map((m) => (_jsxs("option", { value: m.id, children: [m.displayName, m.source === "external-scan"
-                                                ? t("slotassignments.viaOrigin", {
-                                                    origin: m.externalOrigin,
-                                                    defaultValue: " · via {{origin}}",
-                                                })
-                                                : ""] }, m.id)))] })] }, slot));
+                    const selected = assignableInstalled.find((m) => m.id === currentId);
+                    const selectedRuntimeClass = selected
+                        ? installedRuntimeClass(selected)
+                        : null;
+                    const selectedUnavailableReason = selectedRuntimeClass
+                        ? runtimeClassUnavailableReason(selectedRuntimeClass)
+                        : null;
+                    return (_jsxs("label", { className: "rounded-sm border border-border bg-card p-3 flex flex-col gap-1.5", children: [_jsxs("span", { className: "flex items-center gap-1.5 text-sm font-medium", children: [label, selectedRuntimeClass ? (_jsx("span", { className: "rounded-full border border-border/60 px-1.5 py-0.5 text-[10px] font-normal leading-none text-muted-foreground", title: runtimeClassDescription(selectedRuntimeClass), children: runtimeClassBadge(selectedRuntimeClass) })) : null] }), _jsx("span", { className: "text-xs text-muted-foreground", children: description }), _jsxs("select", { value: currentId, disabled: busySlots.has(slot), onChange: (e) => void handleChange(slot, e.target.value || null), className: "mt-1 rounded-sm border border-border bg-bg/50 px-2 py-1.5 text-sm", children: [_jsx("option", { value: "", children: t("slotassignments.auto", { defaultValue: "Auto" }) }), assignableInstalled.map((m) => (_jsxs("option", { value: m.id, children: [m.displayName, " \u00B7", " ", runtimeClassBadge(installedRuntimeClass(m))] }, m.id)))] }), selectedUnavailableReason ? (_jsx("span", { className: "text-xs text-warn", children: selectedUnavailableReason })) : null, slotErrors[slot] ? (_jsx("span", { className: "text-xs text-danger", children: slotErrors[slot] })) : null] }, slot));
                 }) })] }));
 }

package/components/local-inference/hub-utils.d.ts

@@ -2,8 +2,9 @@
  * Pure helpers used by the Model Hub UI. Kept separate from components so
  * they can be covered by unit tests without a DOM.
  */
-import type { CatalogModel, DownloadJob, HardwareProbe, InstalledModel, ModelBucket } from "../../api/client-local-inference";
+import type { CatalogModel, DownloadJob, HardwareProbe, InstalledModel, ModelBucket } from "../../api/client-local-inference.js";
 export type FitLevel = "fits" | "tight" | "wontfit";
+export declare const formatBytes: (bytes: number) => string;
 export declare function displayModelName(model: {
     id: string;
     displayName?: string;

package/components/local-inference/hub-utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hub-utils.d.ts","sourceRoot":"","sources":["../../../../../../src/components/local-inference/hub-utils.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EACV,YAAY,EACZ,WAAW,EACX,aAAa,EACb,cAAc,EACd,WAAW,EACZ,MAAM,kCAAkC,CAAC;AAI1C,MAAM,MAAM,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;AASpD,wBAAgB,gBAAgB,CAAC,KAAK,EAAE;IACtC,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,MAAM,CAOT;AAED,wBAAgB,SAAS,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CASnD;AAED,wBAAgB,eAAe,CAAC,GAAG,EAAE,WAAW,GAAG,SAAS,GAAG,MAAM,CAGpE;AASD,wBAAgB,WAAW,CAAC,MAAM,EAAE,WAAW,GAAG,MAAM,CAEvD;AAED,wBAAgB,QAAQ,CAAC,GAAG,EAAE,QAAQ,GAAG,MAAM,CAI9C;AAED,wBAAgB,UAAU,CACxB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,aAAa,GACtB,QAAQ,CAEV;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAC3B,KAAK,EAAE,YAAY,EACnB,SAAS,EAAE,cAAc,EAAE,GAC1B,cAAc,GAAG,SAAS,CAU5B;AAED,wBAAgB,YAAY,CAC1B,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,WAAW,EAAE,GACvB,WAAW,GAAG,SAAS,CAEzB;AAED;;;;GAIG;AACH,wBAAgB,gBAAgB,CAC9B,EAAE,EAAE,MAAM,EACV,OAAO,EAAE,YAAY,EAAE,GACtB,YAAY,GAAG,SAAS,CAE1B;AAED,wBAAgB,aAAa,CAC3B,MAAM,EAAE,YAAY,EAAE,GACrB,GAAG,CAAC,WAAW,EAAE,YAAY,EAAE,CAAC,CASlC"}
+{"version":3,"file":"hub-utils.d.ts","sourceRoot":"","sources":["../../../../../../src/components/local-inference/hub-utils.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,KAAK,EACV,YAAY,EACZ,WAAW,EACX,aAAa,EACb,cAAc,EACd,WAAW,EACZ,MAAM,kCAAkC,CAAC;AAK1C,MAAM,MAAM,QAAQ,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,CAAC;AAEpD,eAAO,MAAM,WAAW,GAAI,OAAO,MAAM,KAAG,MACE,CAAC;AAS/C,wBAAgB,gBAAgB,CAAC,KAAK,EAAE;IACtC,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,GAAG,MAAM,CAOT;AAED,wBAAgB,SAAS,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CASnD;AAED,wBAAgB,eAAe,CAAC,GAAG,EAAE,WAAW,GAAG,SAAS,GAAG,MAAM,CAGpE;AASD,wBAAgB,WAAW,CAAC,MAAM,EAAE,WAAW,GAAG,MAAM,CAEvD;AAED,wBAAgB,QAAQ,CAAC,GAAG,EAAE,QAAQ,GAAG,MAAM,CAI9C;AAED,wBAAgB,UAAU,CACxB,KAAK,EAAE,YAAY,EACnB,QAAQ,EAAE,aAAa,GACtB,QAAQ,CAEV;AAED;;;;GAIG;AACH,wBAAgB,aAAa,CAC3B,KAAK,EAAE,YAAY,EACnB,SAAS,EAAE,cAAc,EAAE,GAC1B,cAAc,GAAG,SAAS,CAU5B;AAED,wBAAgB,YAAY,CAC1B,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,WAAW,EAAE,GACvB,WAAW,GAAG,SAAS,CAEzB;AAED;;;;GAIG;AACH,wBAAgB,gBAAgB,CAC9B,EAAE,EAAE,MAAM,EACV,OAAO,EAAE,YAAY,EAAE,GACtB,YAAY,GAAG,SAAS,CAE1B;AAED,wBAAgB,aAAa,CAC3B,MAAM,EAAE,YAAY,EAAE,GACrB,GAAG,CAAC,WAAW,EAAE,YAAY,EAAE,CAAC,CASlC"}

package/components/local-inference/hub-utils.js

@@ -4,6 +4,8 @@
  */
 import { MODEL_CATALOG } from "../../services/local-inference/catalog.js";
 import { assessCatalogModelFit } from "../../services/local-inference/recommendation.js";
+import { formatByteSize } from "../../utils/format.js";
+export const formatBytes = (bytes) => formatByteSize(bytes, { unknownLabel: "—" });
 const ELIZA_1_DISPLAY_NAMES = {
     "eliza-1-2b": "eliza-1-2b",
     "eliza-1-4b": "eliza-1-4b",