import { jsx as _jsx } from "react/jsx-runtime";
import React, { useMemo } from "react";
import { MODELS } from "../../core/model-registry.js";
import { SlashStyledSelectList } from "./SlashStyledSelectList.js";
const MAX_MODELS_TO_SHOW = 6;
const PROVIDER_LABEL = {
    anthropic: "Anthropic",
    openai: "OpenAI",
    gemini: "Gemini",
    glm: "Z.AI",
    moonshot: "Moonshot",
    xiaomi: "Xiaomi",
    minimax: "MiniMax",
    deepseek: "DeepSeek",
    openrouter: "OpenRouter",
    sakana: "Sakana",
};
export function ModelSelector({ onSelect, onCancel, loggedInProviders, currentModel, currentProvider, }) {
    const currentValue = `${currentProvider}:${currentModel}`;
    const items = useMemo(() => MODELS.filter((m) => loggedInProviders.includes(m.provider)).map((m) => {
        const value = `${m.provider}:${m.id}`;
        const isCurrent = value === currentValue;
        return {
            label: `${isCurrent ? "* " : "  "}${m.id}`,
            value,
            description: PROVIDER_LABEL[m.provider] ?? m.provider,
        };
    }), [currentValue, loggedInProviders]);
    const initialIndex = Math.max(0, items.findIndex((item) => item.value === currentValue));
    return (_jsx(SlashStyledSelectList, { items: items, onSelect: onSelect, onCancel: onCancel, initialIndex: initialIndex, maxItemsToShow: MAX_MODELS_TO_SHOW }));
}
//# sourceMappingURL=ModelSelector.js.map