@forgeax/interface 0.4.1

package/dist/package/node/components/Bus/CapabilityOverview.js

@@ -0,0 +1,50 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from 'react';
+import { listSharedCapabilities, } from '../../lib/extension-api.js';
+const KIND_ORDER = ['skill', 'command', 'mcp', 'extension', 'memory', 'tool'];
+const KIND_LABELS = {
+    skill: 'Skill',
+    command: 'Command',
+    mcp: 'MCP',
+    extension: 'Plugin',
+    memory: 'Memory',
+    tool: 'Tool',
+};
+function originLabel(capability) {
+    return `${capability.origin}/${capability.trustTier}`;
+}
+export function CapabilityOverview({ refreshKey }) {
+    const [capabilities, setCapabilities] = useState([]);
+    const [generation, setGeneration] = useState(0);
+    const [issues, setIssues] = useState([]);
+    useEffect(() => {
+        let cancelled = false;
+        void listSharedCapabilities()
+            .then((result) => {
+            if (cancelled)
+                return;
+            setCapabilities(result.capabilities);
+            setGeneration(result.generation);
+            setIssues(result.issues);
+        })
+            .catch(() => {
+            if (!cancelled) {
+                setCapabilities([]);
+                setIssues(['Capability snapshot unavailable']);
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [refreshKey]);
+    const counts = useMemo(() => {
+        const result = new Map();
+        for (const kind of KIND_ORDER)
+            result.set(kind, 0);
+        for (const capability of capabilities) {
+            result.set(capability.kind, (result.get(capability.kind) ?? 0) + 1);
+        }
+        return result;
+    }, [capabilities]);
+    return (_jsxs("section", { className: "ba-capability-overview", "aria-label": "Shared capabilities", children: [_jsxs("div", { className: "ba-capability-head", children: [_jsx("span", { className: "ba-capability-dot", "aria-hidden": true }), _jsx("span", { className: "ba-capability-label", children: "Shared capabilities" }), _jsx("span", { className: "ba-capability-count", children: capabilities.length }), _jsxs("span", { className: "ba-capability-generation", children: ["generation ", generation] })] }), _jsx("div", { className: "ba-capability-kinds", role: "list", "aria-label": "Capability kinds", children: KIND_ORDER.map((kind) => (_jsxs("span", { className: `ba-capability-kind ba-capability-kind-${kind}`, role: "listitem", children: [_jsx("span", { children: KIND_LABELS[kind] }), _jsx("strong", { children: counts.get(kind) ?? 0 })] }, kind))) }), capabilities.length > 0 && (_jsx("div", { className: "ba-capability-list", children: capabilities.map((capability) => (_jsxs("div", { className: "ba-capability-row", children: [_jsx("span", { className: `ba-capability-type ba-capability-kind-${capability.kind}`, children: KIND_LABELS[capability.kind] }), _jsx("code", { className: "ba-capability-id", children: capability.localId }), _jsx("span", { className: "ba-capability-extension", children: capability.extensionId }), _jsxs("span", { className: "ba-capability-version", children: ["v", capability.extensionVersion] }), _jsx("span", { className: `ba-capability-state is-${capability.lifecycle.state}`, children: capability.lifecycle.state }), _jsx("span", { className: "ba-capability-origin", children: originLabel(capability) }), capability.lifecycle.requiresRestart && (_jsx("span", { className: "ba-capability-restart", children: "restart" }))] }, capability.capabilityId))) })), issues.length > 0 && (_jsxs("div", { className: "ba-capability-issues", role: "status", children: [issues.length, " capability issue", issues.length === 1 ? '' : 's', " \u2014 open the snapshot API for details"] }))] }));
+}

package/dist/package/node/components/ChatColumn/ChatColumn.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AnchoredResizeHandle } from '@forgeax/app-shell/react';
+import { usePanelRenderers } from '../DockShell/panelRenderers.js';
+import { DockPanelHost } from '../DockShell/DockPanelHost.js';
+import { useShellStore } from '../../store.js';
+import { chatWidthStore, useChatWidth } from './useChatWidth.js';
+// Fixed shell-level chat column (right of the ActivityRail). Chat was pulled out
+// of the dockview so a shell rail can sit immediately to its left; this keeps it
+// drag-resizable via a left-edge handle. Product geometry and styling stay here;
+// App Shell owns the generic anchored pointer lifecycle.
+export function ChatColumn() {
+    const hasChat = !!usePanelRenderers().panels?.chat;
+    const collapsed = useShellStore((s) => s.chatpanelCollapsed);
+    const width = useChatWidth();
+    if (!hasChat || collapsed)
+        return null;
+    return (_jsxs("aside", { className: "studio-chat-col", "data-fx-slot": "ChatColumn", "data-tour-id": "chat", style: { width }, children: [_jsx(AnchoredResizeHandle, { orientation: "col", className: "fx-chat-resizer", ariaLabel: "Resize chat panel", direction: "subtract", readSize: chatWidthStore.getSnapshot, writeSize: chatWidthStore.setSize, resizingBodyClassName: "fx-chat-resizing" }), _jsx(DockPanelHost, { id: "chat" })] }));
+}

package/dist/package/node/components/ChatColumn/SessionTabStrip.js

@@ -0,0 +1,103 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { History, MessageSquare, Plus, X } from 'lucide-react';
+import { Popover, PopoverContent, PopoverTrigger } from '../ui/popover.js';
+import { useTranslation } from '../../i18n/index.js';
+import { tabLabel, useShellStore } from '../../store.js';
+import { confirmDialog } from '../../lib/dialog.js';
+import { formatSessionTime } from '../../lib/session-time.js';
+export function SessionTabStrip() {
+    const { t } = useTranslation();
+    const tabs = useShellStore((state) => state.tabs);
+    const activeSid = useShellStore((state) => state.activeSid);
+    const activeGameSlug = useShellStore((state) => state.activeGameSlug);
+    const switchToSession = useShellStore((state) => state.switchToSession);
+    const closeSession = useShellStore((state) => state.closeSession);
+    const createNewSession = useShellStore((state) => state.createNewSession);
+    const refreshSessions = useShellStore((state) => state.refreshSessions);
+    const [historyOpen, setHistoryOpen] = useState(false);
+    const [creating, setCreating] = useState(false);
+    const [closingSid, setClosingSid] = useState(null);
+    const tabListRef = useRef(null);
+    const activeTabRef = useRef(null);
+    useEffect(() => {
+        activeTabRef.current?.scrollIntoView?.({ block: 'nearest', inline: 'nearest' });
+    }, [activeSid]);
+    useEffect(() => {
+        if (!historyOpen)
+            return;
+        void refreshSessions();
+    }, [activeGameSlug, historyOpen, refreshSessions]);
+    const sortedHistory = useMemo(() => {
+        const now = Date.now();
+        return [...tabs].sort((a, b) => {
+            const aTime = a.lastActivityAt ?? now;
+            const bTime = b.lastActivityAt ?? now;
+            if (aTime !== bTime)
+                return bTime - aTime;
+            return a.sid.localeCompare(b.sid);
+        });
+    }, [historyOpen, tabs]);
+    const selectSession = async (sid, closeHistory = false) => {
+        if (sid !== activeSid)
+            await switchToSession(sid);
+        if (closeHistory)
+            setHistoryOpen(false);
+    };
+    const createSession = async () => {
+        if (creating)
+            return;
+        setCreating(true);
+        try {
+            await createNewSession({ scope: activeGameSlug ?? undefined });
+        }
+        finally {
+            setCreating(false);
+        }
+    };
+    const deleteSession = async (sid, label) => {
+        if (closingSid)
+            return;
+        const confirmed = await confirmDialog({
+            body: t('sessionTabs.closeConfirm', { label }),
+            danger: true,
+        });
+        if (!confirmed)
+            return;
+        setClosingSid(sid);
+        try {
+            await closeSession(sid);
+        }
+        finally {
+            setClosingSid(null);
+        }
+    };
+    const moveFocus = (event, sid) => {
+        if (!['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key))
+            return;
+        const tabButtons = [...(tabListRef.current?.querySelectorAll('[role="tab"]') ?? [])];
+        if (tabButtons.length === 0)
+            return;
+        const index = Math.max(0, tabs.findIndex((tab) => tab.sid === sid));
+        const nextIndex = event.key === 'Home'
+            ? 0
+            : event.key === 'End'
+                ? tabButtons.length - 1
+                : (index + (event.key === 'ArrowRight' ? 1 : -1) + tabButtons.length) % tabButtons.length;
+        event.preventDefault();
+        tabButtons[nextIndex]?.focus();
+        // Manual activation: arrows only move focus. Enter/Space/click activates
+        // the focused button, avoiding overlapping async switchToSession calls
+        // whose provider reconciliation can resolve out of order.
+    };
+    return (_jsxs("div", { className: "chat-session-tabs", "data-testid": "chat-session-tabs", children: [_jsx("div", { ref: tabListRef, className: "chat-session-tab-list", role: "tablist", "aria-label": t('sessionTabs.historyTitle'), children: tabs.map((tab) => {
+                    const active = tab.sid === activeSid;
+                    const label = tabLabel(tab);
+                    return (_jsxs("div", { ref: active ? activeTabRef : undefined, className: `chat-session-tab${active ? ' is-active' : ''}`, "data-session-id": tab.sid, children: [_jsx("button", { type: "button", className: "chat-session-tab-button no-motion-lift", role: "tab", "aria-selected": active, tabIndex: active ? 0 : -1, title: label, onClick: () => void selectSession(tab.sid), onKeyDown: (event) => moveFocus(event, tab.sid), children: _jsx("span", { className: "chat-session-tab-label", children: label }) }), active && (_jsx("button", { type: "button", className: "chat-session-tab-close no-motion-lift", "aria-label": t('sessionTabs.closeTab', { label }), title: t('sessionTabs.closeTab', { label }), disabled: closingSid === tab.sid, onClick: () => void deleteSession(tab.sid, label), children: _jsx(X, { size: 13 }) }))] }, tab.sid));
+                }) }), _jsxs("div", { className: "chat-session-tab-tools", children: [_jsx("button", { type: "button", className: "chat-session-tab-tool no-motion-lift", "aria-label": t('sessionTabs.newSession'), title: t('sessionTabs.newSession'), disabled: creating, onClick: () => void createSession(), children: _jsx(Plus, { size: 16 }) }), _jsxs(Popover, { open: historyOpen, onOpenChange: setHistoryOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx("button", { type: "button", className: `chat-session-tab-tool no-motion-lift${historyOpen ? ' is-active' : ''}`, "aria-label": t('sessionTabs.history'), title: t('sessionTabs.history'), "aria-expanded": historyOpen, children: _jsx(History, { size: 16 }) }) }), _jsx(PopoverContent, { align: "end", sideOffset: 6, className: "w-auto border-0 bg-transparent p-0 shadow-none", children: _jsxs("div", { className: "chat-session-history", "data-testid": "chat-session-history", children: [_jsxs("div", { className: "chat-session-history-title", children: [_jsx(History, { size: 16 }), _jsx("span", { children: t('sessionTabs.historyTitle') })] }), _jsxs("div", { className: "chat-session-history-list", children: [sortedHistory.length === 0 && (_jsx("div", { className: "chat-session-history-empty", children: t('sessionTabs.empty') })), sortedHistory.map((tab) => {
+                                                    const label = tabLabel(tab);
+                                                    const time = formatSessionTime(tab.lastActivityAt);
+                                                    const active = tab.sid === activeSid;
+                                                    return (_jsxs("button", { type: "button", className: `chat-session-history-row no-motion-lift${active ? ' is-active' : ''}`, "data-session-id": tab.sid, "aria-current": active ? 'true' : undefined, onClick: () => void selectSession(tab.sid, true), children: [_jsx(MessageSquare, { size: 15 }), _jsx("span", { className: "chat-session-history-name", children: label }), time && _jsx("span", { className: "chat-session-history-time", children: time })] }, tab.sid));
+                                                })] })] }) })] })] })] }));
+}

package/dist/package/node/components/ChatColumn/useChatWidth.js

@@ -0,0 +1,13 @@
+import { createPersistentSizeStore, usePersistentSizeStore, } from '@forgeax/app-shell/react';
+export const CHAT_MIN_WIDTH = 280;
+export const CHAT_MAX_WIDTH = 720;
+export const CHAT_DEFAULT_WIDTH = 360;
+export const chatWidthStore = createPersistentSizeStore({
+    storageKey: 'forgeax:chat-width',
+    defaultSize: CHAT_DEFAULT_WIDTH,
+    minSize: CHAT_MIN_WIDTH,
+    maxSize: CHAT_MAX_WIDTH,
+});
+export function useChatWidth() {
+    return usePersistentSizeStore(chatWidthStore);
+}

package/dist/package/node/components/CommandPalette/CommandPalette.js

@@ -0,0 +1,242 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/** CommandPalette —— cmdk 命令面板(P2-15,激活死依赖)。
+ *
+ *  数据源 = ActionRegistry(与按钮 / AI 同一张注册表,压缩公理:一表三消费者)。
+ *  执行走 `dispatchAction` 单入口(source:'human')。Ctrl/⌘+K 开合。
+ *
+ *  两段式(P2-16):选中带参数的 action 不再盲发空参被静默拒,而是进「参数引导」
+ *  子界面——用 action 的 description 作使用说明,按 schema 逐字段给输入(enum 下拉 /
+ *  布尔 / 数字 / 文本),提交后校验通过再派发。无参 action 直接执行。任何结果
+ *  (完成 / 受理 / 被拒原因)都在面板内回显,不再「点了没反应」。
+ */
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { Command } from 'cmdk';
+import { createRestartableTimeoutTaskLifecycle } from '@forgeax/app-shell/react';
+import { dispatchAction, getAction, snapshotActions, } from '../../lib/action-registry.js';
+import { setCommandPaletteOpen, useCommandPaletteOpen } from '../../lib/command-palette-store.js';
+
+/** 从 action 的 JSON Schema 派生顶层参数清单(与 registry 的 validateArgs 同口径)。 */
+function paramsOf(def) {
+    const schema = def.schema;
+    if (!schema || typeof schema !== 'object')
+        return [];
+    const props = schema.properties && typeof schema.properties === 'object'
+        ? schema.properties
+        : {};
+    const required = new Set(Array.isArray(schema.required) ? schema.required.filter((k) => typeof k === 'string') : []);
+    return Object.entries(props).map(([key, p]) => ({
+        key,
+        type: typeof p?.type === 'string' ? p.type : undefined,
+        enum: Array.isArray(p?.enum) ? p.enum : undefined,
+        description: typeof p?.description === 'string' ? p.description : undefined,
+        required: required.has(key),
+    }));
+}
+/** 把表单里的字符串按声明类型转回 JS 值(布尔 / 数字 / JSON),供派发。 */
+function coerce(raw, type) {
+    if (type === 'number' || type === 'integer') {
+        const n = Number(raw);
+        if (raw.trim() === '' || Number.isNaN(n))
+            return { ok: false, err: '需要数字' };
+        if (type === 'integer' && !Number.isInteger(n))
+            return { ok: false, err: '需要整数' };
+        return { ok: true, value: n };
+    }
+    if (type === 'boolean')
+        return { ok: true, value: raw === 'true' };
+    if (type === 'object' || type === 'array') {
+        try {
+            return { ok: true, value: JSON.parse(raw) };
+        }
+        catch {
+            return { ok: false, err: '需要合法 JSON' };
+        }
+    }
+    return { ok: true, value: raw };
+}
+function typeHint(p) {
+    const bits = [];
+    if (p.enum?.length)
+        bits.push(`可选:${p.enum.map(String).join(' / ')}`);
+    else if (p.type)
+        bits.push(p.type);
+    bits.push(p.required ? '必填' : '可选');
+    return bits.join(' · ');
+}
+export function CommandPalette() {
+    const open = useCommandPaletteOpen();
+    const [rows, setRows] = useState([]);
+    const [formDef, setFormDef] = useState(null); // 非空 = 处于参数引导子界面
+    const [values, setValues] = useState({});
+    const [feedback, setFeedback] = useState(null);
+    // 动态候选:paramKey → 取值列表(undefined=还在解析,[]=解析完但无项)。
+    const [choices, setChoices] = useState({});
+    const firstFieldRef = useRef(null);
+    const closeTask = useRef(null);
+    const close = useCallback(() => {
+        closeTask.current?.cancel();
+        setCommandPaletteOpen(false);
+        setFormDef(null);
+        setValues({});
+        setFeedback(null);
+    }, []);
+    // 成功后不立刻关:先让绿色回报(含 stateDigest,如 console.clear 的 {cleared:N})显示一下再自动关。
+    const scheduleClose = useCallback(() => {
+        closeTask.current?.schedule();
+    }, []);
+    useEffect(() => {
+        const task = createRestartableTimeoutTaskLifecycle({ delayMs: 1100, task: close });
+        closeTask.current = task;
+        return () => {
+            task.dispose();
+            closeTask.current = null;
+        };
+    }, [close]);
+    // 打开时取一次注册表快照;available 的排前面。
+    useEffect(() => {
+        if (!open)
+            return;
+        const snap = snapshotActions();
+        snap.sort((a, b) => Number(b.available) - Number(a.available) || a.title.localeCompare(b.title));
+        setRows(snap);
+    }, [open]);
+    // 进入参数界面:解析动态候选(choices),就绪后把候选字段默认选到第一项,并聚焦首字段。
+    useEffect(() => {
+        if (!formDef) {
+            setChoices({});
+            return;
+        }
+        firstFieldRef.current?.focus();
+        const provs = formDef.choices ?? {};
+        const keys = Object.keys(provs);
+        if (keys.length === 0)
+            return;
+        let cancelled = false;
+        void (async () => {
+            const resolved = {};
+            await Promise.all(keys.map(async (k) => {
+                try {
+                    resolved[k] = (await provs[k]()) ?? [];
+                }
+                catch {
+                    resolved[k] = [];
+                }
+            }));
+            if (cancelled)
+                return;
+            setChoices(resolved);
+            setValues((v) => {
+                const next = { ...v };
+                for (const k of keys)
+                    if (resolved[k]?.length && !next[k])
+                        next[k] = resolved[k][0];
+                return next;
+            });
+        })();
+        return () => {
+            cancelled = true;
+        };
+    }, [formDef]);
+    /** 真正派发 + 结果回显。成功(完成/受理)返回 true,被拒返回 false。 */
+    const execute = useCallback(async (id, args) => {
+        const res = await dispatchAction(id, args, { source: 'human' });
+        if (res.status === 'rejected') {
+            setFeedback({ kind: 'err', text: res.reason ?? '执行被拒绝' });
+            return false;
+        }
+        // 带上 stateDigest 做可见回报(如 console.clear 的 {cleared:N}),避免「点了没反应」。
+        const digest = res.stateDigest !== undefined ? ` · ${JSON.stringify(res.stateDigest)}` : '';
+        setFeedback({ kind: 'ok', text: (res.status === 'accepted' ? '已受理(异步执行中)' : '已执行') + digest });
+        return true;
+    }, []);
+    /** 列表里选中一条:有参数 → 进引导;无参数 → 直接执行。 */
+    const onSelect = useCallback((id) => {
+        const def = getAction(id);
+        const params = def ? paramsOf(def) : [];
+        if (def && params.length > 0) {
+            const init = {};
+            for (const p of params) {
+                init[p.key] = p.enum?.length ? String(p.enum[0]) : p.type === 'boolean' ? 'true' : '';
+            }
+            setFeedback(null);
+            setValues(init);
+            setFormDef(def);
+            return;
+        }
+        void execute(id, {}).then((ok) => {
+            if (ok)
+                scheduleClose();
+        });
+    }, [execute, scheduleClose]);
+    const submit = useCallback(async () => {
+        if (!formDef)
+            return;
+        const args = {};
+        for (const p of paramsOf(formDef)) {
+            const raw = values[p.key] ?? '';
+            if (raw === '') {
+                if (p.required) {
+                    setFeedback({ kind: 'err', text: `「${p.key}」为必填` });
+                    return;
+                }
+                continue; // 可选留空 → 不发该键
+            }
+            const c = coerce(raw, p.type);
+            if (!c.ok) {
+                setFeedback({ kind: 'err', text: `「${p.key}」${c.err}` });
+                return;
+            }
+            args[p.key] = c.value;
+        }
+        const ok = await execute(formDef.id, args);
+        if (ok)
+            scheduleClose();
+    }, [formDef, values, execute, scheduleClose]);
+    const enabled = useMemo(() => rows.filter((r) => r.available), [rows]);
+    const disabled = useMemo(() => rows.filter((r) => !r.available), [rows]);
+    if (!open)
+        return null;
+    // ── 参数引导子界面 ────────────────────────────────────────────────────────
+    if (formDef) {
+        const params = paramsOf(formDef);
+        return (_jsx("div", { className: "fx-cmdk-overlay", onClick: close, onKeyDown: (e) => {
+                if (e.nativeEvent.isComposing)
+                    return;
+                if (e.key === 'Escape') {
+                    e.preventDefault();
+                    if (formDef) {
+                        setFormDef(null);
+                        setValues({});
+                        setFeedback(null);
+                    }
+                    else
+                        close();
+                }
+            }, tabIndex: -1, children: _jsxs("div", { className: "fx-cmdk-panel", onClick: (e) => e.stopPropagation(), children: [_jsxs("div", { className: "fx-cmdk-form-head", children: [_jsx("button", { className: "fx-cmdk-back", type: "button", onClick: () => setFormDef(null), title: "\u8FD4\u56DE\u547D\u4EE4\u5217\u8868", children: "\u2190 \u8FD4\u56DE" }), _jsx("span", { className: "fx-cmdk-title", children: formDef.title }), _jsx("span", { className: "fx-cmdk-id", children: formDef.id })] }), formDef.description && _jsx("p", { className: "fx-cmdk-guide", children: formDef.description }), _jsxs("form", { className: "fx-cmdk-form", onSubmit: (e) => {
+                            e.preventDefault();
+                            void submit();
+                        }, children: [params.map((p, i) => {
+                                const setRef = (el) => {
+                                    if (i === 0)
+                                        firstFieldRef.current = el;
+                                };
+                                const val = values[p.key] ?? '';
+                                const onChange = (v) => setValues((s) => ({ ...s, [p.key]: v }));
+                                const isDyn = !!formDef.choices?.[p.key]; // 该字段有动态候选提供器
+                                const dynList = choices[p.key]; // undefined=解析中,[]=无项,[...]=候选
+                                return (_jsxs("label", { className: "fx-cmdk-field", children: [_jsxs("span", { className: "fx-cmdk-field-label", children: [p.key, p.required && _jsx("em", { className: "fx-cmdk-req", children: "*" }), _jsx("small", { className: "fx-cmdk-field-hint", children: typeHint(p) })] }), p.enum?.length ? (_jsx("select", { ref: setRef, value: val, onChange: (e) => onChange(e.target.value), children: p.enum.map((o) => (_jsx("option", { value: String(o), children: String(o) }, String(o)))) })) : isDyn ? (dynList === undefined ? (_jsx("select", { disabled: true, ref: setRef, children: _jsx("option", { children: "\u52A0\u8F7D\u4E2D\u2026" }) })) : dynList.length === 0 ? (_jsx("select", { disabled: true, ref: setRef, children: _jsx("option", { children: "\u65E0\u53EF\u7528\u9879" }) })) : (_jsx("select", { ref: setRef, value: val, onChange: (e) => onChange(e.target.value), children: dynList.map((o) => (_jsx("option", { value: o, children: o }, o))) }))) : p.type === 'boolean' ? (_jsxs("select", { ref: setRef, value: val, onChange: (e) => onChange(e.target.value), children: [_jsx("option", { value: "true", children: "true" }), _jsx("option", { value: "false", children: "false" })] })) : p.type === 'number' || p.type === 'integer' ? (_jsx("input", { ref: setRef, type: "number", value: val, onChange: (e) => onChange(e.target.value), placeholder: p.type })) : (_jsx("textarea", { ref: setRef, rows: p.type === 'object' || p.type === 'array' ? 3 : 2, value: val, onChange: (e) => onChange(e.target.value), placeholder: p.type === 'object' || p.type === 'array' ? 'JSON…' : `输入 ${p.key}…`, onKeyDown: (e) => {
+                                                if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) {
+                                                    e.preventDefault();
+                                                    void submit();
+                                                }
+                                            } })), p.description && _jsx("small", { className: "fx-cmdk-field-desc", children: p.description })] }, p.key));
+                            }), feedback && _jsx("div", { className: `fx-cmdk-feedback fx-cmdk-feedback--${feedback.kind}`, children: feedback.text }), _jsxs("div", { className: "fx-cmdk-form-actions", children: [_jsx("span", { className: "fx-cmdk-form-tip", children: "Enter \u6267\u884C \u00B7 Esc \u8FD4\u56DE" }), _jsx("button", { type: "submit", className: "fx-cmdk-run", children: "\u6267\u884C" })] })] })] }) }));
+    }
+    // ── 命令列表 ──────────────────────────────────────────────────────────────
+    return (_jsx("div", { className: "fx-cmdk-overlay", onClick: close, onKeyDown: (e) => {
+            if (!e.nativeEvent.isComposing && e.key === 'Escape') {
+                e.preventDefault();
+                close();
+            }
+        }, tabIndex: -1, children: _jsxs("div", { className: "fx-cmdk-panel", onClick: (e) => e.stopPropagation(), children: [_jsxs(Command, { label: "\u547D\u4EE4\u9762\u677F", children: [_jsx(Command.Input, { autoFocus: true, placeholder: "\u8F93\u5165\u547D\u4EE4\u2026(\u4E0E AI \u53EF\u8C03\u7528\u7684\u529F\u80FD\u540C\u4E00\u5F20\u6CE8\u518C\u8868)" }), _jsxs(Command.List, { children: [_jsx(Command.Empty, { children: "\u6CA1\u6709\u5339\u914D\u7684\u547D\u4EE4" }), enabled.map((r) => (_jsxs(Command.Item, { value: `${r.title} ${r.id}`, onSelect: () => onSelect(r.id), children: [_jsx("span", { className: "fx-cmdk-title", children: r.title }), _jsx("span", { className: "fx-cmdk-id", children: r.id })] }, r.id))), disabled.length > 0 && (_jsx(Command.Group, { heading: "\u5F53\u524D\u4E0D\u53EF\u7528", children: disabled.map((r) => (_jsxs(Command.Item, { value: `${r.title} ${r.id}`, disabled: true, children: [_jsx("span", { className: "fx-cmdk-title", children: r.title }), _jsx("span", { className: "fx-cmdk-reason", children: r.reason })] }, r.id))) }))] })] }), feedback && _jsx("div", { className: `fx-cmdk-feedback fx-cmdk-feedback--${feedback.kind}`, children: feedback.text })] }) }));
+}

package/dist/package/node/components/Confirm/ConfirmDialog.js

@@ -0,0 +1,113 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Doc 07 §9.5 — front half of `requireConfirm`.
+ *
+ * Backend already emits `tool.confirm-required` envelopes when an AI- or
+ * skill-driven `callTool` hits a tool flagged `requireConfirm`. The host UI
+ * reads them off the SSE stream and renders a modal with Allow / Deny.
+ * The user's verdict goes back to `/api/tools/confirm`, which feeds
+ * `tool.confirm-resolved` into the registry's awaiter.
+ *
+ * The modal is intentionally minimal: timer (`expiresAt`), tool id, args
+ * preview, caller kind. No theming yet — the frequent path is "user
+ * accepts" so the heaviest cost is the network roundtrip, not the dialog.
+ */
+import { useEffect, useRef, useState } from 'react';
+import { createIntervalTaskLifecycle, installEventSourceObservation, } from '@forgeax/app-shell/react';
+import { useTranslation } from '../../i18n/index.js';
+import { AlertDialog, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, AlertDialogAction, AlertDialogCancel, } from '../ui/alert-dialog.js';
+export function ConfirmDialog() {
+    const { t } = useTranslation();
+    const [queue, setQueue] = useState([]);
+    const queueRef = useRef([]);
+    queueRef.current = queue;
+    // Tracks confirmIds already given an explicit verdict, so the AlertDialog's
+    // auto onOpenChange(false) (fired by Action/Cancel) does not double-send a
+    // dismiss deny after a real allow/deny. Keeps the verdict exactly-once.
+    const resolvedRef = useRef(new Set());
+    const [now, setNow] = useState(Date.now());
+    useEffect(() => {
+        const clock = createIntervalTaskLifecycle({
+            task: () => setNow(Date.now()),
+            intervalMs: 1000,
+        });
+        clock.start();
+        return clock.dispose;
+    }, []);
+    useEffect(() => {
+        return installEventSourceObservation({
+            url: '/api/events/stream?topic=tool.confirm-*',
+            onEvent: (ev) => {
+                let env = null;
+                try {
+                    env = JSON.parse(ev.data);
+                }
+                catch {
+                    return;
+                }
+                if (!env)
+                    return;
+                if (env.topic === 'tool.confirm-required') {
+                    const p = env.payload;
+                    if (!p?.confirmId)
+                        return;
+                    // De-dup: if the confirmId already in queue, skip.
+                    if (queueRef.current.some((q) => q.confirmId === p.confirmId))
+                        return;
+                    setQueue((prev) => [
+                        ...prev,
+                        {
+                            confirmId: p.confirmId,
+                            toolId: p.toolId,
+                            args: p.args,
+                            callerKind: p.caller?.kind,
+                            message: p.message,
+                            expiresAt: p.expiresAt,
+                        },
+                    ]);
+                }
+                else if (env.topic === 'tool.confirm-resolved') {
+                    // Some other UI / CLI resolved it; drop from queue.
+                    const id = env.payload?.confirmId;
+                    if (!id)
+                        return;
+                    setQueue((prev) => prev.filter((q) => q.confirmId !== id));
+                }
+            },
+        });
+    }, []);
+    const head = queue[0];
+    if (!head)
+        return null;
+    const send = async (decision, reason) => {
+        resolvedRef.current.add(head.confirmId);
+        try {
+            await fetch('/api/tools/confirm', {
+                method: 'POST',
+                headers: { 'content-type': 'application/json' },
+                body: JSON.stringify({ confirmId: head.confirmId, decision, reason }),
+            });
+        }
+        catch { /* server will time out the awaiter on its own */ }
+        setQueue((prev) => prev.filter((q) => q.confirmId !== head.confirmId));
+    };
+    const remainingMs = head.expiresAt ? Math.max(0, head.expiresAt - now) : null;
+    const remainingS = remainingMs == null ? null : Math.ceil(remainingMs / 1000);
+    return (_jsx(AlertDialog, { open: true, onOpenChange: (open) => {
+            // Esc / overlay close == dismiss == deny. Skip if a button already
+            // resolved this confirmId (Action/Cancel also fire onOpenChange).
+            if (!open && !resolvedRef.current.has(head.confirmId)) {
+                void send('deny', 'dismissed');
+            }
+        }, children: _jsxs(AlertDialogContent, { className: "max-w-xl", children: [_jsxs(AlertDialogHeader, { children: [_jsxs("div", { className: "flex items-center justify-between text-sm text-muted-foreground", children: [_jsx("span", { children: t('confirmDialog.wantsToRunTool', { caller: head.callerKind ?? 'AI' }) }), remainingS != null && (_jsxs("span", { className: remainingS < 5 ? 'text-destructive' : 'text-muted-foreground', children: [remainingS, "s"] }))] }), _jsx(AlertDialogTitle, { className: "font-mono text-base", children: head.toolId }), head.message && (_jsx(AlertDialogDescription, { children: head.message }))] }), _jsx("pre", { className: "my-1 max-h-52 overflow-auto rounded bg-muted p-2.5 text-xs text-info", children: safeStringify(head.args) }), _jsxs(AlertDialogFooter, { children: [_jsx(AlertDialogCancel, { onClick: () => send('deny'), children: t('confirmDialog.deny') }), _jsx(AlertDialogAction, { autoFocus: true, onClick: () => send('allow'), children: t('confirmDialog.allow') })] })] }) }));
+}
+function safeStringify(v) {
+    if (v === undefined)
+        return '(no args)';
+    try {
+        return JSON.stringify(v, null, 2);
+    }
+    catch {
+        return String(v);
+    }
+}