@openeryc/pi-coding-agent 0.75.55 → 0.75.56

package/dist/modes/interactive/components/model-hub.js

@@ -0,0 +1,753 @@
+/**
+ * Unified model hub: Select current model, manage cycle whitelist, manage custom providers.
+ */
+import { modelsAreEqual } from "@openeryc/pi-ai";
+import { Container, fuzzyFilter, getKeybindings, Input, Key, matchesKey, Spacer, Text, } from "@openeryc/pi-tui";
+import { theme } from "../theme/theme.js";
+import { DynamicBorder } from "./dynamic-border.js";
+import { keyHint, keyText } from "./keybinding-hints.js";
+// ---------------------------------------------------------------------------
+// Pure helpers (exported for tests)
+// ---------------------------------------------------------------------------
+export function formatTokenCount(count) {
+    if (count >= 1_000_000) {
+        const millions = count / 1_000_000;
+        return millions % 1 === 0 ? `${millions}M` : `${millions.toFixed(1)}M`;
+    }
+    if (count >= 1_000) {
+        const thousands = count / 1_000;
+        return thousands % 1 === 0 ? `${thousands}K` : `${thousands.toFixed(1)}K`;
+    }
+    return count.toString();
+}
+function modelBadges(model) {
+    const parts = [];
+    if (model.reasoning)
+        parts.push("R");
+    parts.push(formatTokenCount(model.contextWindow));
+    return parts.join(" ");
+}
+function isEnabled(enabledIds, id) {
+    return enabledIds === null || enabledIds.includes(id);
+}
+function toggle(enabledIds, id) {
+    if (enabledIds === null)
+        return [id];
+    const index = enabledIds.indexOf(id);
+    if (index >= 0)
+        return [...enabledIds.slice(0, index), ...enabledIds.slice(index + 1)];
+    return [...enabledIds, id];
+}
+function enableAll(enabledIds, allIds, targetIds) {
+    if (enabledIds === null)
+        return null;
+    const targets = targetIds ?? allIds;
+    const result = [...enabledIds];
+    for (const id of targets) {
+        if (!result.includes(id))
+            result.push(id);
+    }
+    return result.length === allIds.length ? null : result;
+}
+function clearAll(enabledIds, allIds, targetIds) {
+    if (enabledIds === null) {
+        return targetIds ? allIds.filter((id) => !targetIds.includes(id)) : [];
+    }
+    const targets = new Set(targetIds ?? enabledIds);
+    return enabledIds.filter((id) => !targets.has(id));
+}
+function move(enabledIds, id, delta) {
+    if (enabledIds === null)
+        return null;
+    const list = [...enabledIds];
+    const index = list.indexOf(id);
+    if (index < 0)
+        return list;
+    const newIndex = index + delta;
+    if (newIndex < 0 || newIndex >= list.length)
+        return list;
+    const result = [...list];
+    [result[index], result[newIndex]] = [result[newIndex], result[index]];
+    return result;
+}
+function getSortedIds(enabledIds, allIds) {
+    if (enabledIds === null)
+        return allIds;
+    const enabledSet = new Set(enabledIds);
+    return [...enabledIds, ...allIds.filter((id) => !enabledSet.has(id))];
+}
+export function buildSelectRows(options) {
+    const { models, currentModel, recentKeys, query, expandedProviders, collapsedLimit = 12 } = options;
+    const rows = [];
+    if (query) {
+        const filtered = fuzzyFilter(models, query, ({ id, provider, model }) => `${id} ${provider} ${provider}/${id} ${model.name ?? ""} ${provider} ${id}`);
+        for (const item of filtered) {
+            rows.push({ kind: "model", item, badges: modelBadges(item.model) });
+        }
+        return rows;
+    }
+    const byKey = new Map(models.map((m) => [`${m.provider}/${m.id}`, m]));
+    const seen = new Set();
+    // Current first (if available)
+    if (currentModel) {
+        const key = `${currentModel.provider}/${currentModel.id}`;
+        const item = byKey.get(key);
+        if (item) {
+            rows.push({ kind: "header", label: "Current" });
+            rows.push({ kind: "model", item, badges: modelBadges(item.model) });
+            seen.add(key);
+        }
+    }
+    // Recent
+    const recentItems = [];
+    for (const key of recentKeys) {
+        if (seen.has(key))
+            continue;
+        const item = byKey.get(key);
+        if (item) {
+            recentItems.push(item);
+            seen.add(key);
+        }
+    }
+    if (recentItems.length > 0) {
+        rows.push({ kind: "header", label: "Recent" });
+        for (const item of recentItems.slice(0, 8)) {
+            rows.push({ kind: "model", item, badges: modelBadges(item.model) });
+        }
+    }
+    // Group remaining by provider
+    const byProvider = new Map();
+    for (const item of models) {
+        const key = `${item.provider}/${item.id}`;
+        if (seen.has(key))
+            continue;
+        const list = byProvider.get(item.provider) ?? [];
+        list.push(item);
+        byProvider.set(item.provider, list);
+    }
+    const providers = [...byProvider.keys()].sort((a, b) => a.localeCompare(b));
+    const currentProvider = currentModel?.provider;
+    for (const provider of providers) {
+        const list = byProvider.get(provider) ?? [];
+        list.sort((a, b) => a.id.localeCompare(b.id));
+        const expand = expandedProviders.has(provider) || provider === currentProvider || list.length <= collapsedLimit;
+        rows.push({ kind: "header", label: provider });
+        if (!expand) {
+            rows.push({ kind: "collapsed", provider, count: list.length });
+            continue;
+        }
+        for (const item of list) {
+            rows.push({ kind: "model", item, badges: modelBadges(item.model) });
+        }
+    }
+    return rows;
+}
+// ---------------------------------------------------------------------------
+// Component
+// ---------------------------------------------------------------------------
+export class ModelHubComponent extends Container {
+    searchInput;
+    listContainer;
+    headerText;
+    footerText;
+    hintText;
+    _focused = false;
+    get focused() {
+        return this._focused;
+    }
+    set focused(value) {
+        this._focused = value;
+        this.searchInput.focused = value;
+    }
+    tui;
+    currentModel;
+    settingsManager;
+    modelRegistry;
+    callbacks;
+    tab;
+    allModels = [];
+    scopedModels;
+    // Select state
+    selectRows = [];
+    selectIndex = 0;
+    expandedProviders = new Set();
+    // Cycle state
+    cycleAllIds = [];
+    cycleModelsById = new Map();
+    enabledIds = null;
+    cycleItems = [];
+    cycleIndex = 0;
+    cycleDirty = false;
+    // Manage state
+    manageRows = [];
+    manageIndex = 0;
+    errorMessage;
+    maxVisible = 10;
+    loadGeneration = 0;
+    constructor(tui, currentModel, settingsManager, modelRegistry, scopedModels, enabledModelIds, callbacks, options) {
+        super();
+        this.tui = tui;
+        this.currentModel = currentModel;
+        this.settingsManager = settingsManager;
+        this.modelRegistry = modelRegistry;
+        this.scopedModels = scopedModels;
+        this.callbacks = callbacks;
+        this.tab = options?.initialTab ?? "select";
+        this.enabledIds = enabledModelIds === null ? null : [...enabledModelIds];
+        this.addChild(new DynamicBorder());
+        this.addChild(new Spacer(1));
+        this.headerText = new Text(this.getHeaderText(), 0, 0);
+        this.addChild(this.headerText);
+        this.hintText = new Text(this.getHintText(), 0, 0);
+        this.addChild(this.hintText);
+        this.addChild(new Spacer(1));
+        this.searchInput = new Input();
+        if (options?.initialSearchInput) {
+            this.searchInput.setValue(options.initialSearchInput);
+        }
+        this.searchInput.onSubmit = () => this.handleConfirm();
+        this.addChild(this.searchInput);
+        this.addChild(new Spacer(1));
+        this.listContainer = new Container();
+        this.addChild(this.listContainer);
+        this.addChild(new Spacer(1));
+        this.footerText = new Text(this.getFooterText(), 0, 0);
+        this.addChild(this.footerText);
+        this.addChild(new DynamicBorder());
+        void this.reload().then(() => {
+            if (options?.initialSearchInput) {
+                this.applySearch();
+            }
+            this.tui.requestRender();
+        });
+    }
+    // ---- public helpers for tests ----
+    getTab() {
+        return this.tab;
+    }
+    getSearchInput() {
+        return this.searchInput;
+    }
+    /** Test helper: force reload completion */
+    async waitForLoad() {
+        await this.reload();
+    }
+    // ---- load ----
+    async reload() {
+        const gen = ++this.loadGeneration;
+        this.modelRegistry.refresh();
+        const loadError = this.modelRegistry.getError();
+        if (loadError) {
+            this.errorMessage = loadError;
+        }
+        else {
+            this.errorMessage = undefined;
+        }
+        try {
+            const available = this.modelRegistry.getAvailable();
+            if (gen !== this.loadGeneration)
+                return;
+            this.allModels = available.map((model) => ({
+                provider: model.provider,
+                id: model.id,
+                model,
+            }));
+            // Refresh scoped models against registry
+            this.scopedModels = this.scopedModels.map((scoped) => {
+                const refreshed = this.modelRegistry.find(scoped.model.provider, scoped.model.id);
+                return refreshed ? { ...scoped, model: refreshed } : scoped;
+            });
+            this.cycleModelsById.clear();
+            this.cycleAllIds = [];
+            for (const item of this.allModels) {
+                const fullId = `${item.provider}/${item.id}`;
+                this.cycleModelsById.set(fullId, item.model);
+                this.cycleAllIds.push(fullId);
+            }
+            this.rebuildManageRows();
+            this.applySearch();
+        }
+        catch (error) {
+            this.allModels = [];
+            this.errorMessage = error instanceof Error ? error.message : String(error);
+            this.applySearch();
+        }
+    }
+    rebuildManageRows() {
+        const rows = [];
+        rows.push({ kind: "action", action: "add", label: "+ Add custom provider (models.json)" });
+        for (const p of this.modelRegistry.listModelsJsonProviders()) {
+            const modelLabel = p.modelIds.length === 0
+                ? "override only"
+                : `${p.modelIds.length} model${p.modelIds.length === 1 ? "" : "s"}`;
+            rows.push({
+                kind: "provider",
+                source: "models_json",
+                id: p.name,
+                label: p.name,
+                detail: `${p.isBuiltIn ? "built-in override" : "custom"} · ${modelLabel}${p.baseUrl ? ` · ${p.baseUrl}` : ""}`,
+            });
+        }
+        const openaiCompat = this.modelRegistry.authStorage.getOpenAICompatibleProviders();
+        for (const [id, info] of Object.entries(openaiCompat)) {
+            rows.push({
+                kind: "provider",
+                source: "openai_compatible",
+                id,
+                label: id,
+                detail: `openai-compatible · ${info.models.length} model${info.models.length === 1 ? "" : "s"} · ${info.baseUrl}`,
+            });
+        }
+        this.manageRows = rows;
+        this.manageIndex = Math.min(this.manageIndex, Math.max(0, rows.length - 1));
+    }
+    // ---- header / footer ----
+    getHeaderText() {
+        const tabs = [
+            { id: "select", label: "Select" },
+            { id: "cycle", label: "Cycle" },
+            { id: "manage", label: "Manage" },
+        ];
+        const parts = tabs.map((t) => (t.id === this.tab ? theme.fg("accent", t.label) : theme.fg("muted", t.label)));
+        return `${theme.fg("muted", "Models: ")}${parts.join(theme.fg("muted", " | "))}`;
+    }
+    getHintText() {
+        if (this.tab === "select") {
+            return (keyHint("tui.input.tab", "tabs") +
+                theme.fg("muted", " · type to search · Enter select · collapsed providers: Enter expand"));
+        }
+        if (this.tab === "cycle") {
+            return (keyHint("tui.input.tab", "tabs") + theme.fg("muted", ` · session-only until ${keyText("app.models.save")}`));
+        }
+        return keyHint("tui.input.tab", "tabs") + theme.fg("muted", " · Enter edit/add · Backspace/Delete remove");
+    }
+    getFooterText() {
+        if (this.tab === "select") {
+            const modelCount = this.selectRows.filter((r) => r.kind === "model").length;
+            return theme.fg("dim", `  ${modelCount} model${modelCount === 1 ? "" : "s"} · Esc cancel`);
+        }
+        if (this.tab === "cycle") {
+            const enabledCount = this.enabledIds?.length ?? this.cycleAllIds.length;
+            const allEnabled = this.enabledIds === null;
+            const countText = allEnabled ? "all enabled" : `${enabledCount}/${this.cycleAllIds.length} enabled`;
+            const parts = [
+                `${keyText("tui.select.confirm")} toggle`,
+                `${keyText("app.models.enableAll")} all`,
+                `${keyText("app.models.clearAll")} clear`,
+                `${keyText("app.models.toggleProvider")} provider`,
+                `${keyText("app.models.reorderUp")}/${keyText("app.models.reorderDown")} reorder`,
+                `${keyText("app.models.save")} save`,
+                countText,
+            ];
+            return this.cycleDirty
+                ? theme.fg("dim", `  ${parts.join(" · ")} `) + theme.fg("warning", "(unsaved)")
+                : theme.fg("dim", `  ${parts.join(" · ")}`);
+        }
+        return theme.fg("dim", "  Enter open · Backspace delete · writing models.json drops comments/trailing commas");
+    }
+    setTab(tab) {
+        if (this.tab === tab)
+            return;
+        this.tab = tab;
+        this.headerText.setText(this.getHeaderText());
+        this.hintText.setText(this.getHintText());
+        this.applySearch();
+    }
+    cycleTab() {
+        const order = ["select", "cycle", "manage"];
+        const idx = order.indexOf(this.tab);
+        this.setTab(order[(idx + 1) % order.length]);
+    }
+    // ---- list building ----
+    applySearch() {
+        const query = this.searchInput.getValue();
+        if (this.tab === "select") {
+            this.selectRows = buildSelectRows({
+                models: this.allModels,
+                currentModel: this.currentModel,
+                recentKeys: this.settingsManager.getRecentModels(),
+                query,
+                expandedProviders: this.expandedProviders,
+            });
+            // Prefer current model selection
+            const currentIdx = this.selectRows.findIndex((r) => r.kind === "model" && modelsAreEqual(this.currentModel, r.item.model));
+            this.selectIndex =
+                currentIdx >= 0 ? currentIdx : Math.min(this.selectIndex, Math.max(0, this.selectRows.length - 1));
+            // Snap to first selectable if landing on header
+            this.ensureSelectableIndex("select");
+        }
+        else if (this.tab === "cycle") {
+            const items = getSortedIds(this.enabledIds, this.cycleAllIds)
+                .filter((id) => this.cycleModelsById.has(id))
+                .map((id) => ({
+                fullId: id,
+                model: this.cycleModelsById.get(id),
+                enabled: isEnabled(this.enabledIds, id),
+            }));
+            this.cycleItems = query ? fuzzyFilter(items, query, (i) => `${i.model.id} ${i.model.provider}`) : items;
+            this.cycleIndex = Math.min(this.cycleIndex, Math.max(0, this.cycleItems.length - 1));
+        }
+        else {
+            this.rebuildManageRows();
+            if (query) {
+                this.manageRows = fuzzyFilter(this.manageRows, query, (r) => r.kind === "action" ? r.label : `${r.label} ${r.detail} ${r.id}`);
+            }
+            this.manageIndex = Math.min(this.manageIndex, Math.max(0, this.manageRows.length - 1));
+        }
+        this.updateList();
+        this.footerText.setText(this.getFooterText());
+    }
+    ensureSelectableIndex(which) {
+        if (which !== "select" || this.selectRows.length === 0)
+            return;
+        if (this.selectRows[this.selectIndex]?.kind === "header") {
+            const next = this.selectRows.findIndex((r, i) => i >= this.selectIndex && r.kind !== "header");
+            if (next >= 0) {
+                this.selectIndex = next;
+                return;
+            }
+            const prev = [...this.selectRows]
+                .map((r, i) => ({ r, i }))
+                .reverse()
+                .find(({ r }) => r.kind !== "header");
+            if (prev)
+                this.selectIndex = prev.i;
+        }
+    }
+    updateList() {
+        this.listContainer.clear();
+        if (this.errorMessage && this.tab !== "manage") {
+            for (const line of this.errorMessage.split("\n")) {
+                this.listContainer.addChild(new Text(theme.fg("error", line), 0, 0));
+            }
+        }
+        if (this.tab === "select") {
+            this.renderSelectList();
+        }
+        else if (this.tab === "cycle") {
+            this.renderCycleList();
+        }
+        else {
+            this.renderManageList();
+        }
+    }
+    renderSelectList() {
+        if (this.selectRows.length === 0) {
+            this.listContainer.addChild(new Text(theme.fg("muted", "  No matching models"), 0, 0));
+            return;
+        }
+        const startIndex = Math.max(0, Math.min(this.selectIndex - Math.floor(this.maxVisible / 2), this.selectRows.length - this.maxVisible));
+        const endIndex = Math.min(startIndex + this.maxVisible, this.selectRows.length);
+        for (let i = startIndex; i < endIndex; i++) {
+            const row = this.selectRows[i];
+            const isSelected = i === this.selectIndex;
+            if (row.kind === "header") {
+                this.listContainer.addChild(new Text(theme.fg("muted", `  ── ${row.label} ──`), 0, 0));
+                continue;
+            }
+            if (row.kind === "collapsed") {
+                const prefix = isSelected ? theme.fg("accent", "→ ") : "  ";
+                const text = isSelected
+                    ? theme.fg("accent", `▸ ${row.provider} (${row.count})`)
+                    : theme.fg("muted", `▸ ${row.provider} (${row.count})`);
+                this.listContainer.addChild(new Text(`${prefix}${text}`, 0, 0));
+                continue;
+            }
+            const isCurrent = modelsAreEqual(this.currentModel, row.item.model);
+            const prefix = isSelected ? theme.fg("accent", "→ ") : "  ";
+            const modelText = isSelected ? theme.fg("accent", row.item.id) : row.item.id;
+            const providerBadge = theme.fg("muted", ` [${row.item.provider}]`);
+            const badges = theme.fg("dim", ` ${row.badges}`);
+            const check = isCurrent ? theme.fg("success", " ✓") : "";
+            this.listContainer.addChild(new Text(`${prefix}${modelText}${providerBadge}${badges}${check}`, 0, 0));
+        }
+        if (startIndex > 0 || endIndex < this.selectRows.length) {
+            this.listContainer.addChild(new Text(theme.fg("muted", `  (${this.selectIndex + 1}/${this.selectRows.length})`), 0, 0));
+        }
+        const selected = this.selectRows[this.selectIndex];
+        if (selected?.kind === "model") {
+            this.listContainer.addChild(new Spacer(1));
+            this.listContainer.addChild(new Text(theme.fg("muted", `  ${selected.item.model.name}`), 0, 0));
+        }
+    }
+    renderCycleList() {
+        if (this.cycleItems.length === 0) {
+            this.listContainer.addChild(new Text(theme.fg("muted", "  No matching models"), 0, 0));
+            return;
+        }
+        const startIndex = Math.max(0, Math.min(this.cycleIndex - Math.floor(this.maxVisible / 2), this.cycleItems.length - this.maxVisible));
+        const endIndex = Math.min(startIndex + this.maxVisible, this.cycleItems.length);
+        const allEnabled = this.enabledIds === null;
+        for (let i = startIndex; i < endIndex; i++) {
+            const item = this.cycleItems[i];
+            const isSelected = i === this.cycleIndex;
+            const prefix = isSelected ? theme.fg("accent", "→ ") : "  ";
+            const modelText = isSelected ? theme.fg("accent", item.model.id) : item.model.id;
+            const providerBadge = theme.fg("muted", ` [${item.model.provider}]`);
+            const status = allEnabled ? "" : item.enabled ? theme.fg("success", " ✓") : theme.fg("dim", " ✗");
+            this.listContainer.addChild(new Text(`${prefix}${modelText}${providerBadge}${status}`, 0, 0));
+        }
+        if (startIndex > 0 || endIndex < this.cycleItems.length) {
+            this.listContainer.addChild(new Text(theme.fg("muted", `  (${this.cycleIndex + 1}/${this.cycleItems.length})`), 0, 0));
+        }
+        if (this.cycleItems.length > 0) {
+            const selected = this.cycleItems[this.cycleIndex];
+            this.listContainer.addChild(new Spacer(1));
+            this.listContainer.addChild(new Text(theme.fg("muted", `  ${selected?.model.name}`), 0, 0));
+        }
+    }
+    renderManageList() {
+        if (this.manageRows.length === 0) {
+            this.listContainer.addChild(new Text(theme.fg("muted", "  No custom providers"), 0, 0));
+            return;
+        }
+        const startIndex = Math.max(0, Math.min(this.manageIndex - Math.floor(this.maxVisible / 2), this.manageRows.length - this.maxVisible));
+        const endIndex = Math.min(startIndex + this.maxVisible, this.manageRows.length);
+        for (let i = startIndex; i < endIndex; i++) {
+            const row = this.manageRows[i];
+            const isSelected = i === this.manageIndex;
+            const prefix = isSelected ? theme.fg("accent", "→ ") : "  ";
+            if (row.kind === "action") {
+                const text = isSelected ? theme.fg("accent", row.label) : theme.fg("success", row.label);
+                this.listContainer.addChild(new Text(`${prefix}${text}`, 0, 0));
+            }
+            else {
+                const text = isSelected ? theme.fg("accent", row.label) : row.label;
+                const detail = theme.fg("muted", `  ${row.detail}`);
+                this.listContainer.addChild(new Text(`${prefix}${text}`, 0, 0));
+                this.listContainer.addChild(new Text(`${detail}`, 0, 0));
+            }
+        }
+    }
+    // ---- input ----
+    handleInput(keyData) {
+        const kb = getKeybindings();
+        if (kb.matches(keyData, "tui.input.tab")) {
+            this.cycleTab();
+            return;
+        }
+        if (kb.matches(keyData, "tui.select.cancel") || matchesKey(keyData, Key.escape)) {
+            this.callbacks.onCancel();
+            return;
+        }
+        if (matchesKey(keyData, Key.ctrl("c"))) {
+            if (this.searchInput.getValue()) {
+                this.searchInput.setValue("");
+                this.applySearch();
+            }
+            else {
+                this.callbacks.onCancel();
+            }
+            return;
+        }
+        if (this.tab === "select") {
+            this.handleSelectInput(keyData, kb);
+        }
+        else if (this.tab === "cycle") {
+            this.handleCycleInput(keyData, kb);
+        }
+        else {
+            this.handleManageInput(keyData, kb);
+        }
+    }
+    handleSelectInput(keyData, kb) {
+        if (kb.matches(keyData, "tui.select.up")) {
+            if (this.selectRows.length === 0)
+                return;
+            let next = this.selectIndex === 0 ? this.selectRows.length - 1 : this.selectIndex - 1;
+            // Skip headers when moving
+            for (let guard = 0; guard < this.selectRows.length; guard++) {
+                if (this.selectRows[next]?.kind !== "header")
+                    break;
+                next = next === 0 ? this.selectRows.length - 1 : next - 1;
+            }
+            this.selectIndex = next;
+            this.updateList();
+            return;
+        }
+        if (kb.matches(keyData, "tui.select.down")) {
+            if (this.selectRows.length === 0)
+                return;
+            let next = this.selectIndex === this.selectRows.length - 1 ? 0 : this.selectIndex + 1;
+            for (let guard = 0; guard < this.selectRows.length; guard++) {
+                if (this.selectRows[next]?.kind !== "header")
+                    break;
+                next = next === this.selectRows.length - 1 ? 0 : next + 1;
+            }
+            this.selectIndex = next;
+            this.updateList();
+            return;
+        }
+        if (kb.matches(keyData, "tui.select.confirm")) {
+            this.handleConfirm();
+            return;
+        }
+        this.searchInput.handleInput(keyData);
+        this.applySearch();
+    }
+    handleCycleInput(keyData, kb) {
+        if (kb.matches(keyData, "tui.select.up")) {
+            if (this.cycleItems.length === 0)
+                return;
+            this.cycleIndex = this.cycleIndex === 0 ? this.cycleItems.length - 1 : this.cycleIndex - 1;
+            this.updateList();
+            return;
+        }
+        if (kb.matches(keyData, "tui.select.down")) {
+            if (this.cycleItems.length === 0)
+                return;
+            this.cycleIndex = this.cycleIndex === this.cycleItems.length - 1 ? 0 : this.cycleIndex + 1;
+            this.updateList();
+            return;
+        }
+        const reorderUp = kb.matches(keyData, "app.models.reorderUp");
+        const reorderDown = kb.matches(keyData, "app.models.reorderDown");
+        if (reorderUp || reorderDown) {
+            if (this.enabledIds === null)
+                return;
+            const item = this.cycleItems[this.cycleIndex];
+            if (item && isEnabled(this.enabledIds, item.fullId)) {
+                const delta = reorderUp ? -1 : 1;
+                const currentIndex = this.enabledIds.indexOf(item.fullId);
+                const newIndex = currentIndex + delta;
+                if (newIndex >= 0 && newIndex < this.enabledIds.length) {
+                    this.enabledIds = move(this.enabledIds, item.fullId, delta);
+                    this.cycleDirty = true;
+                    this.cycleIndex += delta;
+                    this.applySearch();
+                    void this.callbacks.onCycleChange(this.enabledIds === null ? null : [...this.enabledIds]);
+                }
+            }
+            return;
+        }
+        if (kb.matches(keyData, "tui.select.confirm")) {
+            const item = this.cycleItems[this.cycleIndex];
+            if (item) {
+                this.enabledIds = toggle(this.enabledIds, item.fullId);
+                this.cycleDirty = true;
+                this.applySearch();
+                void this.callbacks.onCycleChange(this.enabledIds === null ? null : [...this.enabledIds]);
+            }
+            return;
+        }
+        if (kb.matches(keyData, "app.models.enableAll")) {
+            const targetIds = this.searchInput.getValue() ? this.cycleItems.map((i) => i.fullId) : undefined;
+            this.enabledIds = enableAll(this.enabledIds, this.cycleAllIds, targetIds);
+            this.cycleDirty = true;
+            this.applySearch();
+            void this.callbacks.onCycleChange(this.enabledIds === null ? null : [...this.enabledIds]);
+            return;
+        }
+        if (kb.matches(keyData, "app.models.clearAll")) {
+            const targetIds = this.searchInput.getValue() ? this.cycleItems.map((i) => i.fullId) : undefined;
+            this.enabledIds = clearAll(this.enabledIds, this.cycleAllIds, targetIds);
+            this.cycleDirty = true;
+            this.applySearch();
+            void this.callbacks.onCycleChange(this.enabledIds === null ? null : [...this.enabledIds]);
+            return;
+        }
+        if (kb.matches(keyData, "app.models.toggleProvider")) {
+            const item = this.cycleItems[this.cycleIndex];
+            if (item) {
+                const provider = item.model.provider;
+                const providerIds = this.cycleAllIds.filter((id) => this.cycleModelsById.get(id).provider === provider);
+                const allOn = providerIds.every((id) => isEnabled(this.enabledIds, id));
+                this.enabledIds = allOn
+                    ? clearAll(this.enabledIds, this.cycleAllIds, providerIds)
+                    : enableAll(this.enabledIds, this.cycleAllIds, providerIds);
+                this.cycleDirty = true;
+                this.applySearch();
+                void this.callbacks.onCycleChange(this.enabledIds === null ? null : [...this.enabledIds]);
+            }
+            return;
+        }
+        if (kb.matches(keyData, "app.models.save")) {
+            void this.callbacks.onCyclePersist(this.enabledIds === null ? null : [...this.enabledIds]);
+            this.cycleDirty = false;
+            this.footerText.setText(this.getFooterText());
+            return;
+        }
+        this.searchInput.handleInput(keyData);
+        this.applySearch();
+    }
+    handleManageInput(keyData, kb) {
+        if (kb.matches(keyData, "tui.select.up")) {
+            if (this.manageRows.length === 0)
+                return;
+            this.manageIndex = this.manageIndex === 0 ? this.manageRows.length - 1 : this.manageIndex - 1;
+            this.updateList();
+            return;
+        }
+        if (kb.matches(keyData, "tui.select.down")) {
+            if (this.manageRows.length === 0)
+                return;
+            this.manageIndex = this.manageIndex === this.manageRows.length - 1 ? 0 : this.manageIndex + 1;
+            this.updateList();
+            return;
+        }
+        if (kb.matches(keyData, "tui.select.confirm")) {
+            this.handleConfirm();
+            return;
+        }
+        // Backspace / Delete remove selected provider
+        if (matchesKey(keyData, Key.backspace) || matchesKey(keyData, Key.delete)) {
+            const row = this.manageRows[this.manageIndex];
+            if (row?.kind === "provider") {
+                void this.callbacks.onManageRemove(row.source, row.id);
+            }
+            return;
+        }
+        this.searchInput.handleInput(keyData);
+        this.applySearch();
+    }
+    handleConfirm() {
+        if (this.tab === "select") {
+            const row = this.selectRows[this.selectIndex];
+            if (!row)
+                return;
+            if (row.kind === "collapsed") {
+                this.expandedProviders.add(row.provider);
+                this.applySearch();
+                // Move selection to first model under that provider
+                const idx = this.selectRows.findIndex((r) => r.kind === "model" && r.item.provider === row.provider);
+                if (idx >= 0)
+                    this.selectIndex = idx;
+                this.updateList();
+                return;
+            }
+            if (row.kind === "model") {
+                this.settingsManager.setDefaultModelAndProvider(row.item.model.provider, row.item.model.id);
+                void this.callbacks.onSelectModel(row.item.model);
+            }
+            return;
+        }
+        if (this.tab === "cycle") {
+            const item = this.cycleItems[this.cycleIndex];
+            if (item) {
+                this.enabledIds = toggle(this.enabledIds, item.fullId);
+                this.cycleDirty = true;
+                this.applySearch();
+                void this.callbacks.onCycleChange(this.enabledIds === null ? null : [...this.enabledIds]);
+            }
+            return;
+        }
+        const row = this.manageRows[this.manageIndex];
+        if (!row)
+            return;
+        if (row.kind === "action" && row.action === "add") {
+            void this.callbacks.onManageAdd();
+            return;
+        }
+        if (row.kind === "provider") {
+            void this.callbacks.onManageEdit(row.source, row.id);
+        }
+    }
+    /** Called by parent after manage mutation so list refreshes. */
+    async refreshAfterManage() {
+        await this.reload();
+        this.tui.requestRender();
+    }
+}
+/** Back-compat alias used by older tests/imports. */
+export { ModelHubComponent as ModelSelectorComponent };
+//# sourceMappingURL=model-hub.js.map