@elizaos/app-core 2.0.0-alpha.37

package/dist/components/CodingAgentSettingsSection.js

@@ -0,0 +1,268 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button } from "@elizaos/ui";
+import { useCallback, useEffect, useState } from "react";
+import { client } from "../api";
+import { useTimeout } from "../hooks";
+import { useApp } from "../state";
+import { ConfigSaveFooter } from "./ConfigSaveFooter";
+const AGENT_TABS = ["claude", "gemini", "codex", "aider"];
+const APPROVAL_PRESETS = [
+    {
+        value: "readonly",
+        labelKey: "codingagentsettingssection.PresetReadOnly",
+        descKey: "codingagentsettingssection.PresetReadOnlyDesc",
+    },
+    {
+        value: "standard",
+        labelKey: "codingagentsettingssection.PresetStandard",
+        descKey: "codingagentsettingssection.PresetStandardDesc",
+    },
+    {
+        value: "permissive",
+        labelKey: "codingagentsettingssection.PresetPermissive",
+        descKey: "codingagentsettingssection.PresetPermissiveDesc",
+    },
+    {
+        value: "autonomous",
+        labelKey: "codingagentsettingssection.PresetAutonomous",
+        descKey: "codingagentsettingssection.PresetAutonomousDesc",
+    },
+];
+const AGENT_PROVIDER_MAP = {
+    claude: "anthropic",
+    gemini: "google-genai",
+    codex: "openai",
+    aider: "anthropic",
+};
+const AIDER_PROVIDER_MAP = {
+    anthropic: "anthropic",
+    openai: "openai",
+    google: "google-genai",
+};
+const FALLBACK_MODELS = {
+    anthropic: [
+        { value: "claude-opus-4-6", label: "Claude Opus 4.6" },
+        { value: "claude-sonnet-4-6", label: "Claude Sonnet 4.6" },
+        { value: "claude-haiku-4-5-20251001", label: "Claude Haiku 4.5" },
+    ],
+    "google-genai": [
+        { value: "gemini-2.5-pro", label: "Gemini 2.5 Pro" },
+        { value: "gemini-2.5-flash", label: "Gemini 2.5 Flash" },
+    ],
+    openai: [
+        { value: "o3", label: "o3" },
+        { value: "o4-mini", label: "o4-mini" },
+        { value: "gpt-4o", label: "GPT-4o" },
+    ],
+};
+const AGENT_LABELS = {
+    claude: "Claude",
+    gemini: "Gemini",
+    codex: "Codex",
+    aider: "Aider",
+};
+const KNOWN_AGENT_ADAPTERS = new Set([
+    "claude",
+    "gemini",
+    "codex",
+    "aider",
+]);
+const ENV_PREFIX = {
+    claude: "PARALLAX_CLAUDE",
+    gemini: "PARALLAX_GEMINI",
+    codex: "PARALLAX_CODEX",
+    aider: "PARALLAX_AIDER",
+};
+export function CodingAgentSettingsSection() {
+    const { setTimeout } = useTimeout();
+    const { t } = useApp();
+    const [activeTab, setActiveTab] = useState("claude");
+    const [loading, setLoading] = useState(true);
+    const [dirty, setDirty] = useState(false);
+    const [saving, setSaving] = useState(false);
+    const [saveSuccess, setSaveSuccess] = useState(false);
+    const [saveError, setSaveError] = useState(null);
+    const [prefs, setPrefs] = useState({});
+    const [providerModels, setProviderModels] = useState({});
+    const [preflightLoaded, setPreflightLoaded] = useState(false);
+    const [preflightByAgent, setPreflightByAgent] = useState({});
+    useEffect(() => {
+        void (async () => {
+            setLoading(true);
+            try {
+                const [cfg, anthropicRes, googleRes, openaiRes, preflightRes] = await Promise.all([
+                    client.getConfig(),
+                    client.fetchModels("anthropic", false).catch(() => null),
+                    client.fetchModels("google-genai", false).catch(() => null),
+                    client.fetchModels("openai", false).catch(() => null),
+                    fetch("/api/coding-agents/preflight")
+                        .then((response) => (response.ok ? response.json() : null))
+                        .catch(() => null),
+                ]);
+                const env = (cfg.env ?? {});
+                const loaded = {};
+                for (const agent of ["CLAUDE", "GEMINI", "CODEX", "AIDER"]) {
+                    const prefix = `PARALLAX_${agent}`;
+                    if (env[`${prefix}_MODEL_POWERFUL`]) {
+                        loaded[`${prefix}_MODEL_POWERFUL`] =
+                            env[`${prefix}_MODEL_POWERFUL`];
+                    }
+                    if (env[`${prefix}_MODEL_FAST`]) {
+                        loaded[`${prefix}_MODEL_FAST`] = env[`${prefix}_MODEL_FAST`];
+                    }
+                }
+                if (env.PARALLAX_AIDER_PROVIDER) {
+                    loaded.PARALLAX_AIDER_PROVIDER = env.PARALLAX_AIDER_PROVIDER;
+                }
+                if (env.PARALLAX_DEFAULT_APPROVAL_PRESET) {
+                    loaded.PARALLAX_DEFAULT_APPROVAL_PRESET =
+                        env.PARALLAX_DEFAULT_APPROVAL_PRESET;
+                }
+                if (env.PARALLAX_AGENT_SELECTION_STRATEGY) {
+                    loaded.PARALLAX_AGENT_SELECTION_STRATEGY =
+                        env.PARALLAX_AGENT_SELECTION_STRATEGY;
+                }
+                if (env.PARALLAX_DEFAULT_AGENT_TYPE) {
+                    loaded.PARALLAX_DEFAULT_AGENT_TYPE = env.PARALLAX_DEFAULT_AGENT_TYPE;
+                }
+                setPrefs(loaded);
+                const models = {};
+                for (const [providerId, response] of [
+                    ["anthropic", anthropicRes],
+                    ["google-genai", googleRes],
+                    ["openai", openaiRes],
+                ]) {
+                    if (response?.models &&
+                        Array.isArray(response.models) &&
+                        response.models.length > 0) {
+                        const chatModels = response.models
+                            .filter((model) => model.category === "chat")
+                            .map((model) => ({
+                            value: model.id,
+                            label: model.name || model.id,
+                        }));
+                        if (chatModels.length > 0) {
+                            models[providerId] = chatModels;
+                        }
+                    }
+                }
+                setProviderModels(models);
+                if (Array.isArray(preflightRes)) {
+                    const mapped = {};
+                    for (const item of preflightRes) {
+                        const raw = item.adapter?.toLowerCase();
+                        const key = raw && KNOWN_AGENT_ADAPTERS.has(raw)
+                            ? raw
+                            : undefined;
+                        if (key) {
+                            mapped[key] = item;
+                        }
+                    }
+                    setPreflightByAgent(mapped);
+                    setPreflightLoaded(true);
+                }
+            }
+            catch {
+                // Fall back to built-in defaults when config or model fetches fail.
+            }
+            setLoading(false);
+        })();
+    }, []);
+    const installedAgents = AGENT_TABS.filter((agent) => preflightByAgent[agent]?.installed === true);
+    const availableAgents = preflightLoaded && installedAgents.length > 0
+        ? installedAgents
+        : AGENT_TABS;
+    const getInstallState = (agent) => {
+        if (!preflightLoaded) {
+            return "unknown";
+        }
+        return preflightByAgent[agent]?.installed ? "installed" : "missing";
+    };
+    useEffect(() => {
+        if (availableAgents.length === 0) {
+            return;
+        }
+        if (!availableAgents.includes(activeTab)) {
+            setActiveTab(availableAgents[0]);
+        }
+    }, [activeTab, availableAgents]);
+    const setPref = useCallback((key, value) => {
+        setPrefs((previous) => ({ ...previous, [key]: value }));
+        setDirty(true);
+    }, []);
+    const handleSave = useCallback(async () => {
+        setSaving(true);
+        setSaveError(null);
+        setSaveSuccess(false);
+        try {
+            const envPatch = {};
+            for (const [key, value] of Object.entries(prefs)) {
+                if (value) {
+                    envPatch[key] = value;
+                }
+            }
+            await client.updateConfig({ env: envPatch });
+            setDirty(false);
+            setSaveSuccess(true);
+            setTimeout(() => setSaveSuccess(false), 2500);
+        }
+        catch (error) {
+            setSaveError(error instanceof Error ? error.message : "Failed to save");
+        }
+        setSaving(false);
+    }, [prefs, setTimeout]);
+    const getProviderId = (tab, aiderProvider) => tab === "aider"
+        ? AIDER_PROVIDER_MAP[aiderProvider]
+        : AGENT_PROVIDER_MAP[tab];
+    const getModelOptions = (providerId) => providerModels[providerId] ?? FALLBACK_MODELS[providerId] ?? [];
+    if (loading) {
+        return (_jsx("div", { className: "py-4 text-center text-[var(--muted)] text-xs", children: t("codingagentsettingssection.LoadingCodingAgent") }));
+    }
+    const prefix = ENV_PREFIX[activeTab];
+    const aiderProvider = (prefs.PARALLAX_AIDER_PROVIDER ||
+        "anthropic");
+    const providerId = getProviderId(activeTab, aiderProvider);
+    const modelOptions = getModelOptions(providerId);
+    const powerfulValue = prefs[`${prefix}_MODEL_POWERFUL`] ?? "";
+    const fastValue = prefs[`${prefix}_MODEL_FAST`] ?? "";
+    const isDynamic = Boolean(providerModels[providerId]);
+    const approvalPreset = (prefs.PARALLAX_DEFAULT_APPROVAL_PRESET ||
+        "permissive");
+    const selectionStrategy = (prefs.PARALLAX_AGENT_SELECTION_STRATEGY ||
+        "fixed");
+    const defaultAgentType = (prefs.PARALLAX_DEFAULT_AGENT_TYPE ||
+        "claude");
+    const effectiveDefaultAgentType = availableAgents.includes(defaultAgentType)
+        ? defaultAgentType
+        : availableAgents[0];
+    if (preflightLoaded && installedAgents.length === 0) {
+        return (_jsxs("div", { className: "flex flex-col gap-2 text-xs", children: [_jsx("div", { className: "text-[var(--muted)]", children: t("codingagentsettingssection.NoSupportedCLIs") }), _jsx("div", { className: "flex flex-col gap-1 text-[11px] text-[var(--muted)]", children: AGENT_TABS.map((agent) => {
+                        const preflight = preflightByAgent[agent];
+                        return (_jsxs("div", { children: [_jsxs("span", { className: "font-semibold", children: [AGENT_LABELS[agent], ":"] }), " ", preflight?.installCommand
+                                    ? `${t("codingagentsettingssection.InstallWith")} ${preflight.installCommand}`
+                                    : "", preflight?.docsUrl ? ` (${preflight.docsUrl})` : ""] }, agent));
+                    }) })] }));
+    }
+    return (_jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx("span", { className: "text-xs font-semibold", children: t("codingagentsettingssection.AgentSelectionStra") }), _jsxs("select", { className: "px-2.5 py-1.5 border border-border bg-card text-xs focus:border-accent focus:outline-none shadow-sm rounded-lg", value: selectionStrategy, onChange: (event) => setPref("PARALLAX_AGENT_SELECTION_STRATEGY", event.target.value), children: [_jsx("option", { value: "fixed", children: t("codingagentsettingssection.Fixed") }), _jsx("option", { value: "ranked", children: t("codingagentsettingssection.RankedAutoSelect") })] }), _jsx("div", { className: "text-[11px] text-[var(--muted)] mt-1.5", children: selectionStrategy === "fixed"
+                            ? t("codingagentsettingssection.AgentUsedWhenNoEStrategyFixed")
+                            : t("codingagentsettingssection.AgentUsedWhenNoEStrategyRanked") })] }), selectionStrategy === "fixed" && (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx("span", { className: "text-xs font-semibold", children: t("codingagentsettingssection.DefaultAgentType") }), _jsx("select", { className: "px-2.5 py-1.5 border border-border bg-card text-xs focus:border-accent focus:outline-none shadow-sm rounded-lg", value: effectiveDefaultAgentType, onChange: (event) => setPref("PARALLAX_DEFAULT_AGENT_TYPE", event.target.value), children: availableAgents.map((agent) => (_jsx("option", { value: agent, children: AGENT_LABELS[agent] }, agent))) }), _jsx("div", { className: "text-[11px] text-[var(--muted)]", children: t("codingagentsettingssection.AgentUsedWhenNoE") })] })), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx("span", { className: "text-xs font-semibold", children: t("codingagentsettingssection.DefaultPermissionL") }), _jsx("select", { className: "px-2.5 py-1.5 border border-border bg-card text-xs focus:border-accent focus:outline-none shadow-sm rounded-lg", value: approvalPreset, onChange: (event) => setPref("PARALLAX_DEFAULT_APPROVAL_PRESET", event.target.value), children: APPROVAL_PRESETS.map((preset) => (_jsx("option", { value: preset.value, children: t(preset.labelKey) }, preset.value))) }), _jsxs("div", { className: "text-[11px] text-[var(--muted)] mt-1.5", children: [APPROVAL_PRESETS.find((preset) => preset.value === approvalPreset)
+                                ?.descKey
+                                ? t(APPROVAL_PRESETS.find((preset) => preset.value === approvalPreset)?.descKey ?? "")
+                                : "", t("codingagentsettingssection.AppliesToAllNewlySpawned")] })] }), _jsx("div", { className: "flex gap-1 rounded-xl border border-border bg-card/50 p-1 shrink-0", children: availableAgents.map((agent) => {
+                    const active = activeTab === agent;
+                    const installState = getInstallState(agent);
+                    return (_jsx(Button, { variant: active ? "default" : "ghost", size: "sm", className: `flex-1 h-9 rounded-lg border border-transparent px-3 py-2 text-xs font-semibold ${active
+                            ? "bg-accent text-accent-foreground shadow-sm"
+                            : "text-muted hover:bg-bg-hover hover:text-txt"}`, onClick: () => setActiveTab(agent), children: _jsxs("span", { className: "inline-flex items-center gap-1.5", children: [_jsx("span", { children: AGENT_LABELS[agent] }), installState === "installed" && (_jsx("span", { className: "text-[10px] font-medium opacity-80", children: t("codingagentsettingssection.Installed") })), installState === "unknown" && (_jsx("span", { className: "text-[10px] font-medium opacity-70", children: t("codingagentsettingssection.Unknown") }))] }) }, agent));
+                }) }), preflightLoaded && (_jsxs("div", { className: "text-[11px] text-[var(--muted)] mt-1.5", children: [t("codingagentsettingssection.Availability"), " ", AGENT_TABS.map((agent) => {
+                        const installState = getInstallState(agent);
+                        const label = installState === "installed"
+                            ? t("codingagentsettingssection.Installed")
+                            : installState === "missing"
+                                ? t("codingagentsettingssection.NotInstalled")
+                                : t("codingagentsettingssection.Unknown");
+                        return `${AGENT_LABELS[agent]}: ${label}`;
+                    }).join(" · ")] })), activeTab === "aider" && (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx("span", { className: "text-xs font-semibold", children: t("codingagentsettingssection.Provider") }), _jsxs("select", { className: "px-2.5 py-1.5 border border-border bg-card text-xs focus:border-accent focus:outline-none shadow-sm rounded-lg", value: aiderProvider, onChange: (event) => setPref("PARALLAX_AIDER_PROVIDER", event.target.value), children: [_jsx("option", { value: "anthropic", children: t("codingagentsettingssection.Anthropic") }), _jsx("option", { value: "openai", children: t("codingagentsettingssection.OpenAI") }), _jsx("option", { value: "google", children: t("codingagentsettingssection.Google") })] })] })), _jsxs("div", { className: "flex gap-3", children: [_jsxs("div", { className: "flex-1 flex flex-col gap-1.5", children: [_jsx("span", { className: "text-xs font-semibold", children: t("codingagentsettingssection.PowerfulModel") }), _jsxs("select", { className: "px-2.5 py-1.5 border border-border bg-card text-xs focus:border-accent focus:outline-none shadow-sm rounded-lg", value: powerfulValue, onChange: (event) => setPref(`${prefix}_MODEL_POWERFUL`, event.target.value), children: [_jsx("option", { value: "", children: t("codingagentsettingssection.Default") }), modelOptions.map((option) => (_jsx("option", { value: option.value, children: option.label }, option.value)))] })] }), _jsxs("div", { className: "flex-1 flex flex-col gap-1.5", children: [_jsx("span", { className: "text-xs font-semibold", children: t("codingagentsettingssection.FastModel") }), _jsxs("select", { className: "px-2.5 py-1.5 border border-border bg-card text-xs focus:border-accent focus:outline-none shadow-sm rounded-lg", value: fastValue, onChange: (event) => setPref(`${prefix}_MODEL_FAST`, event.target.value), children: [_jsx("option", { value: "", children: t("codingagentsettingssection.Default") }), modelOptions.map((option) => (_jsx("option", { value: option.value, children: option.label }, option.value)))] })] })] }), _jsx("div", { className: "text-[11px] text-[var(--muted)] mt-1.5", children: isDynamic
+                    ? t("codingagentsettingssection.ModelsFetched")
+                    : t("codingagentsettingssection.UsingFallback") }), _jsx(ConfigSaveFooter, { dirty: dirty, saving: saving, saveError: saveError, saveSuccess: saveSuccess, onSave: () => void handleSave() })] }));
+}

package/dist/components/CommandPalette.d.ts

@@ -0,0 +1,2 @@
+export declare function CommandPalette(): import("react/jsx-runtime").JSX.Element | null;
+//# sourceMappingURL=CommandPalette.d.ts.map

package/dist/components/CommandPalette.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CommandPalette.d.ts","sourceRoot":"","sources":["../../src/components/CommandPalette.tsx"],"names":[],"mappings":"AASA,wBAAgB,cAAc,mDAkR7B"}

package/dist/components/CommandPalette.js

@@ -0,0 +1,181 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef } from "react";
+import { buildCommands as buildCommandPaletteCommands, } from "../chat";
+import { COMMAND_PALETTE_EVENT } from "../events";
+import { useBugReport } from "../hooks";
+import { useApp } from "../state";
+export function CommandPalette() {
+    const { commandPaletteOpen, commandQuery, commandActiveIndex, agentStatus, handleStart, handleRestart, setTab, loadPlugins, loadSkills, loadLogs, loadWorkbench, handleChatClear, activeGameViewerUrl, setState, t, } = useApp();
+    const { open: openBugReport } = useBugReport();
+    const closeCommandPalette = useCallback(() => setState("commandPaletteOpen", false), [setState]);
+    const inputRef = useRef(null);
+    const agentState = agentStatus?.state ?? "stopped";
+    const currentGameViewerUrl = typeof activeGameViewerUrl === "string" ? activeGameViewerUrl : "";
+    const allCommands = useMemo(() => {
+        return buildCommandPaletteCommands({
+            agentState,
+            activeGameViewerUrl: currentGameViewerUrl,
+            handleStart,
+            handleRestart,
+            setTab,
+            setAppsSubTab: () => setState("appsSubTab", "games"),
+            loadPlugins,
+            loadSkills,
+            loadLogs,
+            loadWorkbench,
+            handleChatClear,
+            openBugReport,
+        });
+    }, [
+        agentState,
+        currentGameViewerUrl,
+        handleStart,
+        handleRestart,
+        setTab,
+        setState,
+        loadPlugins,
+        loadSkills,
+        loadLogs,
+        loadWorkbench,
+        handleChatClear,
+        openBugReport,
+    ]);
+    // Filter commands by query
+    const filteredCommands = useMemo(() => {
+        if (!commandQuery.trim())
+            return allCommands;
+        const query = commandQuery.toLowerCase();
+        return allCommands.filter((cmd) => cmd.label.toLowerCase().includes(query));
+    }, [allCommands, commandQuery]);
+    // Listen for milady:command-palette from main.tsx (electron shortcut Cmd/Ctrl+K)
+    useEffect(() => {
+        const toggle = () => {
+            setState("commandPaletteOpen", !commandPaletteOpen);
+            if (!commandPaletteOpen) {
+                setState("commandQuery", "");
+                setState("commandActiveIndex", 0);
+            }
+        };
+        document.addEventListener(COMMAND_PALETTE_EVENT, toggle);
+        return () => document.removeEventListener(COMMAND_PALETTE_EVENT, toggle);
+    }, [commandPaletteOpen, setState]);
+    // Also listen for Ctrl/Meta+K in the browser (non-native context)
+    useEffect(() => {
+        const handleKeyDown = (e) => {
+            if ((e.metaKey || e.ctrlKey) && e.key === "k") {
+                e.preventDefault();
+                setState("commandPaletteOpen", !commandPaletteOpen);
+                if (!commandPaletteOpen) {
+                    setState("commandQuery", "");
+                    setState("commandActiveIndex", 0);
+                }
+            }
+        };
+        window.addEventListener("keydown", handleKeyDown);
+        return () => window.removeEventListener("keydown", handleKeyDown);
+    }, [commandPaletteOpen, setState]);
+    // Auto-focus input when opened
+    useEffect(() => {
+        if (commandPaletteOpen && inputRef.current) {
+            inputRef.current.focus();
+        }
+    }, [commandPaletteOpen]);
+    // Keyboard handling
+    useEffect(() => {
+        if (!commandPaletteOpen)
+            return;
+        const handleKeyDown = (e) => {
+            if (e.key === "Escape") {
+                e.preventDefault();
+                closeCommandPalette();
+                return;
+            }
+            if (e.key === "ArrowDown") {
+                if (filteredCommands.length === 0)
+                    return;
+                e.preventDefault();
+                setState("commandActiveIndex", commandActiveIndex < filteredCommands.length - 1
+                    ? commandActiveIndex + 1
+                    : 0);
+                return;
+            }
+            if (e.key === "ArrowUp") {
+                if (filteredCommands.length === 0)
+                    return;
+                e.preventDefault();
+                setState("commandActiveIndex", commandActiveIndex > 0
+                    ? commandActiveIndex - 1
+                    : filteredCommands.length - 1);
+                return;
+            }
+            if (e.key === "Enter") {
+                if (filteredCommands.length === 0)
+                    return;
+                e.preventDefault();
+                const cmd = filteredCommands[commandActiveIndex];
+                if (cmd) {
+                    cmd.action();
+                    closeCommandPalette();
+                }
+                return;
+            }
+        };
+        window.addEventListener("keydown", handleKeyDown);
+        return () => window.removeEventListener("keydown", handleKeyDown);
+    }, [
+        commandPaletteOpen,
+        commandActiveIndex,
+        filteredCommands,
+        setState,
+        closeCommandPalette,
+    ]);
+    useEffect(() => {
+        if (filteredCommands.length === 0) {
+            if (commandActiveIndex !== 0) {
+                setState("commandActiveIndex", 0);
+            }
+            return;
+        }
+        const maxIndex = filteredCommands.length - 1;
+        if (commandActiveIndex < 0 || commandActiveIndex > maxIndex) {
+            setState("commandActiveIndex", Math.min(Math.max(commandActiveIndex, 0), maxIndex));
+        }
+    }, [commandActiveIndex, filteredCommands.length, setState]);
+    // Reset active index when query changes
+    useEffect(() => {
+        if (commandQuery !== "") {
+            setState("commandActiveIndex", 0);
+        }
+    }, [commandQuery, setState]);
+    if (!commandPaletteOpen)
+        return null;
+    return (_jsx("div", { className: "fixed inset-0 z-[9999] flex items-start justify-center pt-30", style: {
+            background: "color-mix(in srgb, var(--bg) 50%, transparent)",
+            backdropFilter: "blur(4px)",
+        }, onClick: (e) => {
+            if (e.target === e.currentTarget) {
+                closeCommandPalette();
+            }
+        }, onKeyDown: (e) => {
+            if (e.key === "Escape") {
+                e.preventDefault();
+                closeCommandPalette();
+            }
+        }, role: "dialog", "aria-modal": "true", tabIndex: -1, children: _jsxs("div", { className: "w-[520px] max-h-[420px] flex flex-col rounded-xl", style: {
+                background: "color-mix(in srgb, var(--bg) 96%, transparent)",
+                border: "1px solid color-mix(in srgb, var(--accent) 18%, transparent)",
+                borderRadius: "16px",
+                boxShadow: "var(--shadow-lg)",
+            }, role: "document", children: [_jsx("input", { ref: inputRef, type: "text", className: "w-full px-4 py-3.5 bg-transparent text-[15px] outline-none font-body", style: {
+                        borderBottom: "1px solid var(--border)",
+                        color: "var(--text)",
+                    }, placeholder: t("commandpalette.TypeToSearchComma"), value: commandQuery, onChange: (e) => setState("commandQuery", e.target.value) }), _jsx("div", { className: "flex-1 overflow-y-auto py-1", children: filteredCommands.length === 0 ? (_jsx("div", { className: "py-5 text-center text-[13px]", style: { color: "var(--muted)" }, children: t("commandpalette.NoCommandsFound") })) : (filteredCommands.map((cmd, idx) => (_jsxs("button", { type: "button", className: "w-full px-4 py-2.5 cursor-pointer flex justify-between items-center text-left text-sm font-body border-0", style: {
+                            background: idx === commandActiveIndex
+                                ? "var(--bg-hover)"
+                                : "transparent",
+                            color: "var(--text)",
+                        }, onClick: () => {
+                            cmd.action();
+                            closeCommandPalette();
+                        }, onMouseEnter: () => setState("commandActiveIndex", idx), children: [_jsx("span", { children: cmd.label }), cmd.hint && (_jsx("span", { className: "text-xs", style: { color: "var(--muted)" }, children: cmd.hint }))] }, cmd.id)))) })] }) }));
+}

package/dist/components/CompanionSceneHost.d.ts

@@ -0,0 +1,15 @@
+import { type ReactNode } from "react";
+declare function CompanionSceneSurface({ active, interactive, children, }: {
+    active: boolean;
+    interactive?: boolean;
+    children?: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare const CompanionSceneHost: import("react").MemoExoticComponent<typeof CompanionSceneSurface>;
+export declare function useSharedCompanionScene(): boolean;
+export declare function SharedCompanionScene({ active, interactive, children, }: {
+    active: boolean;
+    interactive?: boolean;
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=CompanionSceneHost.d.ts.map

package/dist/components/CompanionSceneHost.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CompanionSceneHost.d.ts","sourceRoot":"","sources":["../../src/components/CompanionSceneHost.tsx"],"names":[],"mappings":"AAQA,OAAO,EAGL,KAAK,SAAS,EAQf,MAAM,OAAO,CAAC;AAgGf,iBAAS,qBAAqB,CAAC,EAC7B,MAAM,EACN,WAAkB,EAClB,QAAQ,GACT,EAAE;IACD,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,2CA8VA;AAED,eAAO,MAAM,kBAAkB,mEAA8B,CAAC;AAE9D,wBAAgB,uBAAuB,IAAI,OAAO,CAEjD;AAED,wBAAgB,oBAAoB,CAAC,EACnC,MAAM,EACN,WAAkB,EAClB,QAAQ,GACT,EAAE;IACD,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,EAAE,SAAS,CAAC;CACrB,2CAQA"}