@axhub/acp 0.1.0

package/dist/components/assistant-ui/acp-elicitation-option-list.mjs

@@ -0,0 +1,157 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CheckCircleIcon, CheckIcon, HelpCircleIcon, XCircleIcon, } from "lucide-react";
+import { useMemo, useState } from "react";
+import { OptionList } from "../tool-ui/option-list.mjs";
+import { ACP_ELICITATION_OPTION_LIST_TOOL_NAME, } from "../../lib/acp2aisdk/elicitation.mjs";
+import { cn } from "../../lib/utils.mjs";
+function isRecord(value) {
+    return Boolean(value && typeof value === "object" && !Array.isArray(value));
+}
+function normalizeString(value) {
+    return typeof value === "string" ? value.trim() : "";
+}
+function normalizeStringArray(value) {
+    if (!Array.isArray(value))
+        return [];
+    return value.map(normalizeString).filter(Boolean);
+}
+function parsePayload(value) {
+    if (!isRecord(value))
+        return null;
+    if (value.selectionMode !== "single" && value.selectionMode !== "multi") {
+        return null;
+    }
+    const options = Array.isArray(value.options)
+        ? value.options.flatMap((option) => {
+            if (!isRecord(option))
+                return [];
+            const id = normalizeString(option.id);
+            const label = normalizeString(option.label);
+            if (!id || !label)
+                return [];
+            return [
+                Object.assign(Object.assign({ id,
+                    label }, (normalizeString(option.description)
+                    ? { description: normalizeString(option.description) }
+                    : {})), (typeof option.disabled === "boolean"
+                    ? { disabled: option.disabled }
+                    : {})),
+            ];
+        })
+        : [];
+    const fieldName = normalizeString(value.fieldName);
+    if (!fieldName || options.length === 0)
+        return null;
+    return Object.assign(Object.assign(Object.assign(Object.assign({ toolCallId: normalizeString(value.toolCallId), message: normalizeString(value.message) || "Choose an option", fieldName, fieldTitle: normalizeString(value.fieldTitle) || fieldName }, (normalizeString(value.fieldDescription)
+        ? { fieldDescription: normalizeString(value.fieldDescription) }
+        : {})), { selectionMode: value.selectionMode, options, defaultValue: value.selectionMode === "multi"
+            ? normalizeStringArray(value.defaultValue)
+            : normalizeString(value.defaultValue) || null, minSelections: typeof value.minSelections === "number" ? value.minSelections : 1 }), (typeof value.maxSelections === "number"
+        ? { maxSelections: value.maxSelections }
+        : {})), { required: value.required === true });
+}
+function parseResult(value) {
+    if (!isRecord(value))
+        return null;
+    if (value.action === "decline" || value.action === "cancel") {
+        return { action: value.action };
+    }
+    if (value.action === "accept" && isRecord(value.content)) {
+        return { action: "accept", content: value.content };
+    }
+    return null;
+}
+function getChoiceFromResult(payload, result) {
+    if (!result)
+        return undefined;
+    if (result.action !== "accept")
+        return null;
+    const choice = result.content[payload.fieldName];
+    if (payload.selectionMode === "multi")
+        return normalizeStringArray(choice);
+    return normalizeString(choice) || null;
+}
+function valueToArray(value) {
+    if (Array.isArray(value))
+        return value;
+    return value ? [value] : [];
+}
+function formatChoiceLabel(payload, value) {
+    const selectedIds = new Set(valueToArray(value));
+    const labels = payload.options
+        .filter((option) => selectedIds.has(option.id))
+        .map((option) => option.label);
+    return labels.length > 0 ? labels.join("、") : "未选择";
+}
+function getReceiptText(payload, action, displayedChoice) {
+    if (action === "decline")
+        return "已拒绝";
+    if (action === "cancel")
+        return "已取消";
+    return `已选择 ${formatChoiceLabel(payload, displayedChoice)}`;
+}
+export function isAcpElicitationOptionListPart(part) {
+    return part.toolName === ACP_ELICITATION_OPTION_LIST_TOOL_NAME;
+}
+export function AcpElicitationOptionListCard(part) {
+    var _a, _b, _c;
+    const payload = useMemo(() => parsePayload(part.args), [part.args]);
+    const result = useMemo(() => parseResult(part.result), [part.result]);
+    const [submitted, setSubmitted] = useState(false);
+    const [submittedAction, setSubmittedAction] = useState(null);
+    const [submittedChoice, setSubmittedChoice] = useState();
+    if (!payload)
+        return null;
+    const disabled = submitted ||
+        Boolean(result) ||
+        ((_a = part.status) === null || _a === void 0 ? void 0 : _a.type) === "complete" ||
+        ((_b = part.status) === null || _b === void 0 ? void 0 : _b.type) === "incomplete";
+    const choice = getChoiceFromResult(payload, result);
+    const displayedChoice = submitted ? (submittedChoice !== null && submittedChoice !== void 0 ? submittedChoice : null) : choice;
+    const receiptAction = (_c = result === null || result === void 0 ? void 0 : result.action) !== null && _c !== void 0 ? _c : submittedAction;
+    const isReceipt = displayedChoice !== undefined;
+    const statusLabel = (result === null || result === void 0 ? void 0 : result.action) === "accept"
+        ? "已选择"
+        : (result === null || result === void 0 ? void 0 : result.action) === "decline"
+            ? "已拒绝"
+            : (result === null || result === void 0 ? void 0 : result.action) === "cancel"
+                ? "已取消"
+                : "等待选择";
+    const StatusIcon = (result === null || result === void 0 ? void 0 : result.action) === "accept"
+        ? CheckCircleIcon
+        : result
+            ? XCircleIcon
+            : HelpCircleIcon;
+    const isAcceptedReceipt = receiptAction === "accept";
+    return (_jsxs("div", { className: "my-2.5 w-full rounded-lg border bg-card p-4 shadow-xs", children: [_jsxs("div", { className: "mb-3 flex items-start gap-3", children: [_jsx(StatusIcon, { className: cn("mt-0.5 size-4 shrink-0", (result === null || result === void 0 ? void 0 : result.action) === "accept"
+                            ? "text-emerald-600 dark:text-emerald-400"
+                            : result
+                                ? "text-muted-foreground"
+                                : "text-primary") }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "break-words font-medium text-base leading-snug", children: payload.message }), _jsxs("div", { className: "mt-1 flex flex-wrap items-center gap-x-2 gap-y-1 text-muted-foreground text-xs", children: [_jsx("span", { children: payload.fieldTitle }), _jsx("span", { "aria-hidden": true, children: "\u00B7" }), _jsx("span", { children: statusLabel })] }), payload.fieldDescription && (_jsx("div", { className: "mt-2 break-words text-muted-foreground text-sm leading-snug", children: payload.fieldDescription }))] })] }), isReceipt ? (_jsxs("div", { className: cn("flex items-center gap-2 rounded-md border px-3 py-2 text-sm", isAcceptedReceipt
+                    ? "border-emerald-200 bg-emerald-50 text-emerald-900 dark:border-emerald-900/50 dark:bg-emerald-950/30 dark:text-emerald-200"
+                    : "border-muted-foreground/20 bg-muted/40 text-muted-foreground"), children: [isAcceptedReceipt ? (_jsx(CheckIcon, { className: "size-4 shrink-0" })) : (_jsx(XCircleIcon, { className: "size-4 shrink-0" })), _jsx("span", { className: "min-w-0 break-words", children: getReceiptText(payload, receiptAction, displayedChoice) })] })) : (_jsx(OptionList, { id: payload.toolCallId || part.toolCallId, options: payload.options, selectionMode: payload.selectionMode, defaultValue: payload.defaultValue, minSelections: payload.minSelections, maxSelections: payload.maxSelections, className: "my-0 border-0 bg-transparent p-0 shadow-none", actions: [
+                    { id: "confirm", label: "确认" },
+                    { id: "cancel", label: "取消", variant: "outline" },
+                ], onAction: (actionId, selectedValue) => {
+                    if (disabled)
+                        return;
+                    setSubmitted(true);
+                    if (actionId === "cancel") {
+                        setSubmittedAction("cancel");
+                        setSubmittedChoice(null);
+                        part.addResult({ action: "cancel" });
+                        return;
+                    }
+                    setSubmittedAction("accept");
+                    setSubmittedChoice(selectedValue);
+                    part.addResult({
+                        action: "accept",
+                        content: {
+                            [payload.fieldName]: payload.selectionMode === "multi"
+                                ? normalizeStringArray(selectedValue)
+                                : normalizeString(selectedValue),
+                        },
+                    });
+                } }))] }));
+}

package/dist/components/assistant-ui/acp-selectors.d.ts

@@ -0,0 +1,2 @@
+export declare function AcpHeaderContext(): import("react/jsx-runtime").JSX.Element;
+export declare function AcpComposerSelectors(): import("react/jsx-runtime").JSX.Element;

package/dist/components/assistant-ui/acp-selectors.mjs

@@ -0,0 +1,301 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AuiIf, useAuiState } from "@assistant-ui/react";
+import { CheckIcon, ChevronDownIcon, ChevronRightIcon, GaugeIcon, NetworkIcon, Settings2Icon, SlidersHorizontalIcon, } from "lucide-react";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { ACP_CAPABILITY_REFRESH_EVENT, hydrateAcpCapabilityCacheFromDefaults, persistAcpCapabilityCache, shouldFetchAcpCapabilitySnapshot, } from "../../lib/acp2aisdk/capability-cache.mjs";
+import { useAcpUiRuntimeContext } from "../../lib/acp2aisdk/client-context.mjs";
+import { chooseComposerModelOptions } from "../../lib/acp2aisdk/model-selection.mjs";
+import { ACP_PROVIDER_KEYS, ACP_PROVIDER_REGISTRY, } from "../../lib/acp2aisdk/provider-registry.mjs";
+import { acpApiClient } from "../../lib/api/client.mjs";
+import { cn } from "../../lib/utils.mjs";
+const CONFIG_MENU_DESKTOP_QUERY = "(min-width: 640px)";
+function useMediaQuery(query) {
+    const [matches, setMatches] = useState(false);
+    useEffect(() => {
+        const media = window.matchMedia(query);
+        const syncMatches = () => setMatches(media.matches);
+        syncMatches();
+        media.addEventListener("change", syncMatches);
+        return () => {
+            media.removeEventListener("change", syncMatches);
+        };
+    }, [query]);
+    return matches;
+}
+function getOptionLabel(options, value) {
+    var _a;
+    if (!options.length)
+        return "";
+    return (((_a = options.find((option) => option.value === value)) === null || _a === void 0 ? void 0 : _a.label) || options[0].label);
+}
+const PROVIDER_OPTIONS = ACP_PROVIDER_KEYS.map((provider, index) => ({
+    value: provider,
+    label: ACP_PROVIDER_REGISTRY[provider].label,
+    description: ACP_PROVIDER_REGISTRY[provider].enabledInP0
+        ? "已验证"
+        : "需本地 CLI/登录",
+    order: index,
+}));
+function capabilityOptions(snapshot, key) {
+    var _a, _b;
+    const capability = snapshot === null || snapshot === void 0 ? void 0 : snapshot.capabilities[key];
+    return ((_b = (_a = capability === null || capability === void 0 ? void 0 : capability.options) === null || _a === void 0 ? void 0 : _a.filter((option) => option.value).map((option) => ({
+        value: option.value,
+        label: option.label || option.value,
+        description: option.description,
+    }))) !== null && _b !== void 0 ? _b : []);
+}
+function syncSnapshotSelection(snapshot, actions) {
+    var _a, _b, _c;
+    const capabilities = snapshot === null || snapshot === void 0 ? void 0 : snapshot.capabilities;
+    if ((_a = capabilities === null || capabilities === void 0 ? void 0 : capabilities.model) === null || _a === void 0 ? void 0 : _a.currentValue) {
+        actions.syncModel(capabilities.model.currentValue);
+    }
+    if ((_b = capabilities === null || capabilities === void 0 ? void 0 : capabilities.mode) === null || _b === void 0 ? void 0 : _b.currentValue) {
+        actions.syncModeId(capabilities.mode.currentValue);
+    }
+    if ((_c = capabilities === null || capabilities === void 0 ? void 0 : capabilities.thought_level) === null || _c === void 0 ? void 0 : _c.currentValue) {
+        actions.syncThoughtLevel(capabilities.thought_level.currentValue);
+    }
+}
+function useCapabilitySnapshot() {
+    const { provider, workspacePath, syncModel, syncModeId, syncThoughtLevel } = useAcpUiRuntimeContext();
+    const threadId = useAuiState((state) => { var _a; return (_a = state.threadListItem.remoteId) !== null && _a !== void 0 ? _a : state.threads.mainThreadId; });
+    const [refreshToken, setRefreshToken] = useState(0);
+    const [snapshot, setSnapshot] = useState(() => hydrateAcpCapabilityCacheFromDefaults(provider, workspacePath));
+    useEffect(() => {
+        function handleCapabilityRefresh(event) {
+            var _a;
+            const detail = event.detail;
+            if ((detail === null || detail === void 0 ? void 0 : detail.provider) && detail.provider !== provider)
+                return;
+            if ((detail === null || detail === void 0 ? void 0 : detail.threadId) && detail.threadId !== threadId)
+                return;
+            if (detail &&
+                "workspacePath" in detail &&
+                ((_a = detail.workspacePath) !== null && _a !== void 0 ? _a : null) !== (workspacePath !== null && workspacePath !== void 0 ? workspacePath : null)) {
+                return;
+            }
+            setRefreshToken((current) => current + 1);
+        }
+        window.addEventListener(ACP_CAPABILITY_REFRESH_EVENT, handleCapabilityRefresh);
+        return () => {
+            window.removeEventListener(ACP_CAPABILITY_REFRESH_EVENT, handleCapabilityRefresh);
+        };
+    }, [provider, threadId, workspacePath]);
+    useEffect(() => {
+        let cancelled = false;
+        const cached = hydrateAcpCapabilityCacheFromDefaults(provider, workspacePath);
+        setSnapshot(cached);
+        syncSnapshotSelection(cached, {
+            syncModeId,
+            syncModel,
+            syncThoughtLevel,
+        });
+        const force = refreshToken > 0;
+        if (!shouldFetchAcpCapabilitySnapshot(cached, { force }))
+            return;
+        acpApiClient
+            .getCapabilities({ provider, threadId, workspacePath })
+            .then((body) => {
+            var _a;
+            if (cancelled)
+                return;
+            const nextSnapshot = persistAcpCapabilityCache(provider, workspacePath, (_a = body === null || body === void 0 ? void 0 : body.capabilitySnapshot) !== null && _a !== void 0 ? _a : null);
+            setSnapshot(nextSnapshot);
+            syncSnapshotSelection(nextSnapshot, {
+                syncModeId,
+                syncModel,
+                syncThoughtLevel,
+            });
+        })
+            .catch(() => {
+            if (!cancelled)
+                setSnapshot(cached);
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [
+        provider,
+        refreshToken,
+        syncModeId,
+        syncModel,
+        syncThoughtLevel,
+        threadId,
+        workspacePath,
+    ]);
+    return snapshot;
+}
+export function AcpHeaderContext() {
+    const { provider, model, modeId, thoughtLevel } = useAcpUiRuntimeContext();
+    const providerLabel = ACP_PROVIDER_REGISTRY[provider].label;
+    return (_jsxs("div", { className: "hidden min-w-0 items-center gap-2 text-muted-foreground text-xs md:flex", children: [_jsx("span", { className: "truncate", children: providerLabel }), model ? _jsxs("span", { className: "truncate", children: ["/ ", model] }) : null, modeId ? _jsxs("span", { className: "truncate", children: ["/ ", modeId] }) : null, thoughtLevel ? _jsxs("span", { className: "truncate", children: ["/ ", thoughtLevel] }) : null] }));
+}
+export function AcpComposerSelectors() {
+    const snapshot = useCapabilitySnapshot();
+    const context = useAcpUiRuntimeContext();
+    const modelOptions = useMemo(() => chooseComposerModelOptions({
+        provider: context.provider,
+        acpModelOptions: capabilityOptions(snapshot, "model"),
+        sessionPinnedModel: context.model,
+    }), [context.model, context.provider, snapshot]);
+    const modeOptions = useMemo(() => capabilityOptions(snapshot, "mode"), [snapshot]);
+    const thoughtOptions = useMemo(() => capabilityOptions(snapshot, "thought_level"), [snapshot]);
+    const sections = useMemo(() => [
+        {
+            key: "provider",
+            label: "供应商",
+            value: context.provider,
+            options: PROVIDER_OPTIONS,
+            onChange: context.setProvider,
+            icon: NetworkIcon,
+        },
+        {
+            key: "model",
+            label: "模型",
+            value: context.model,
+            options: modelOptions,
+            onChange: context.setModel,
+            icon: SlidersHorizontalIcon,
+        },
+        {
+            key: "mode",
+            label: "模式",
+            value: context.modeId,
+            options: modeOptions,
+            onChange: context.setModeId,
+            icon: SlidersHorizontalIcon,
+        },
+        {
+            key: "thinking",
+            label: "思考深度",
+            value: context.thoughtLevel,
+            options: thoughtOptions,
+            onChange: context.setThoughtLevel,
+            icon: GaugeIcon,
+        },
+    ], [
+        context.modeId,
+        context.model,
+        context.provider,
+        context.setModeId,
+        context.setModel,
+        context.setProvider,
+        context.setThoughtLevel,
+        context.thoughtLevel,
+        modelOptions,
+        modeOptions,
+        thoughtOptions,
+    ]);
+    if (!modelOptions.length && !modeOptions.length && !thoughtOptions.length) {
+        return (_jsx(AuiIf, { condition: (state) => !state.thread.isEmpty, children: _jsx("div", { className: "flex min-w-0 items-center px-1 text-muted-foreground text-xs", children: "\u4F1A\u8BDD\u5F00\u59CB\u540E\u4F1A\u663E\u793A\u4F9B\u5E94\u5546\u80FD\u529B" }) }));
+    }
+    return _jsx(AcpConfigMenu, { sections: sections });
+}
+function AcpConfigMenu({ sections }) {
+    var _a, _b, _c, _d, _e;
+    const [open, setOpen] = useState(false);
+    const isDesktopLayout = useMediaQuery(CONFIG_MENU_DESKTOP_QUERY);
+    const visibleSections = useMemo(() => sections.filter((section) => section.options.length), [sections]);
+    const [desktopActiveKey, setDesktopActiveKey] = useState((_b = (_a = visibleSections[0]) === null || _a === void 0 ? void 0 : _a.key) !== null && _b !== void 0 ? _b : null);
+    const [mobileExpandedKey, setMobileExpandedKey] = useState(null);
+    const rootRef = useRef(null);
+    const providerSection = visibleSections.find((section) => section.key === "provider");
+    const modelSection = visibleSections.find((section) => section.key === "model");
+    const desktopActiveSection = (_c = visibleSections.find((section) => section.key === desktopActiveKey)) !== null && _c !== void 0 ? _c : visibleSections[0];
+    const providerLabel = providerSection
+        ? getOptionLabel(providerSection.options, providerSection.value || ((_d = providerSection.options[0]) === null || _d === void 0 ? void 0 : _d.value) || null)
+        : "配置";
+    const modelLabel = modelSection
+        ? getOptionLabel(modelSection.options, modelSection.value || ((_e = modelSection.options[0]) === null || _e === void 0 ? void 0 : _e.value) || null)
+        : "";
+    useEffect(() => {
+        var _a, _b;
+        const nextActive = visibleSections.some((section) => section.key === desktopActiveKey)
+            ? desktopActiveKey
+            : ((_b = (_a = visibleSections[0]) === null || _a === void 0 ? void 0 : _a.key) !== null && _b !== void 0 ? _b : null);
+        if (nextActive !== desktopActiveKey)
+            setDesktopActiveKey(nextActive);
+        if (mobileExpandedKey &&
+            !visibleSections.some((section) => section.key === mobileExpandedKey)) {
+            setMobileExpandedKey(null);
+        }
+    }, [desktopActiveKey, mobileExpandedKey, visibleSections]);
+    useEffect(() => {
+        if (!open)
+            return;
+        function closeMenu() {
+            setOpen(false);
+            setMobileExpandedKey(null);
+        }
+        function isInside(target) {
+            var _a;
+            return target instanceof Node && ((_a = rootRef.current) === null || _a === void 0 ? void 0 : _a.contains(target));
+        }
+        function handlePointerDown(event) {
+            if (!isInside(event.target))
+                closeMenu();
+        }
+        function handleFocusIn(event) {
+            if (!isInside(event.target))
+                closeMenu();
+        }
+        function handleKeyDown(event) {
+            if (event.key === "Escape")
+                closeMenu();
+        }
+        document.addEventListener("pointerdown", handlePointerDown);
+        document.addEventListener("focusin", handleFocusIn);
+        document.addEventListener("keydown", handleKeyDown);
+        return () => {
+            document.removeEventListener("pointerdown", handlePointerDown);
+            document.removeEventListener("focusin", handleFocusIn);
+            document.removeEventListener("keydown", handleKeyDown);
+        };
+    }, [open]);
+    function handleTriggerClick() {
+        const nextOpen = !open;
+        setOpen(nextOpen);
+        setDesktopActiveKey((current) => { var _a, _b; return (_b = current !== null && current !== void 0 ? current : (_a = visibleSections[0]) === null || _a === void 0 ? void 0 : _a.key) !== null && _b !== void 0 ? _b : null; });
+        if (!nextOpen)
+            setMobileExpandedKey(null);
+    }
+    function handleSectionClick(sectionKey) {
+        if (isDesktopLayout) {
+            setDesktopActiveKey(sectionKey);
+            return;
+        }
+        setMobileExpandedKey((current) => current === sectionKey ? null : sectionKey);
+    }
+    if (!visibleSections.length)
+        return null;
+    return (_jsxs("div", { ref: rootRef, className: "relative px-0.5", children: [_jsxs("button", { type: "button", className: "inline-flex h-8 max-w-56 items-center gap-1 rounded-md px-2 text-muted-foreground text-xs hover:bg-accent hover:text-accent-foreground", "aria-haspopup": "menu", "aria-expanded": open, "data-acp-config-trigger": "", onClick: handleTriggerClick, children: [_jsx(Settings2Icon, { className: "size-3.5 shrink-0" }), _jsx("span", { className: "truncate", children: modelLabel ? `${providerLabel} · ${modelLabel}` : providerLabel }), _jsx(ChevronDownIcon, { className: "size-3 shrink-0" })] }), open ? (_jsxs("div", { className: "absolute bottom-full left-0 z-50 mb-2 w-[min(20rem,calc(100vw-2rem))] rounded-md border bg-popover p-1 text-popover-foreground shadow-md max-sm:w-[calc(100vw-5rem)]", role: "menu", "data-acp-config-root-menu": "", children: [_jsx("div", { className: "px-2 py-1.5 font-medium text-muted-foreground text-xs", children: "\u914D\u7F6E" }), _jsxs("div", { className: "relative", children: [visibleSections.map((section) => {
+                                var _a;
+                                const Icon = section.icon;
+                                const selectedValue = section.value || ((_a = section.options[0]) === null || _a === void 0 ? void 0 : _a.value) || null;
+                                const selectedLabel = getOptionLabel(section.options, selectedValue);
+                                const isDesktopActive = section.key === (desktopActiveSection === null || desktopActiveSection === void 0 ? void 0 : desktopActiveSection.key);
+                                const isMobileExpanded = section.key === mobileExpandedKey;
+                                return (_jsxs("div", { children: [_jsxs("button", { type: "button", className: cn("flex min-h-11 w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-sm hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:outline-none", isDesktopActive &&
+                                                "sm:bg-accent/70 sm:text-accent-foreground", isMobileExpanded &&
+                                                "max-sm:bg-accent/70 max-sm:text-accent-foreground"), "aria-haspopup": "menu", "aria-expanded": isDesktopLayout ? isDesktopActive : isMobileExpanded, "data-acp-config-section": section.key, onPointerEnter: (event) => {
+                                                if (event.pointerType === "mouse") {
+                                                    setDesktopActiveKey(section.key);
+                                                }
+                                            }, onFocus: () => {
+                                                if (isDesktopLayout)
+                                                    setDesktopActiveKey(section.key);
+                                            }, onClick: () => handleSectionClick(section.key), children: [_jsx(Icon, { className: "size-4 shrink-0 text-muted-foreground" }), _jsxs("span", { className: "min-w-0 flex-1", children: [_jsx("span", { className: "block truncate", children: section.label }), _jsx("span", { className: "block truncate text-muted-foreground text-xs", children: selectedLabel || "默认" })] }), _jsx(ChevronRightIcon, { className: "hidden size-3.5 shrink-0 text-muted-foreground sm:block" }), _jsx(ChevronDownIcon, { className: "size-3.5 shrink-0 text-muted-foreground sm:hidden" })] }), isMobileExpanded ? (_jsx(AcpConfigSubmenu, { section: section, variant: "mobile" })) : null] }, section.key));
+                            }), desktopActiveSection ? (_jsx(AcpConfigSubmenu, { section: desktopActiveSection, variant: "desktop" })) : null] })] })) : null] }));
+}
+function AcpConfigSubmenu({ section, variant, }) {
+    var _a;
+    const selectedValue = section.value || ((_a = section.options[0]) === null || _a === void 0 ? void 0 : _a.value) || null;
+    return (_jsxs("div", { className: cn("overflow-y-auto rounded-md bg-popover p-1 text-popover-foreground", variant === "desktop"
+            ? "absolute bottom-0 left-[calc(100%+0.5rem)] hidden max-h-80 w-[min(22rem,calc(100vw-2rem))] border shadow-md sm:block"
+            : "mt-1 max-h-56 w-full border-x-0 border-b-0 border-t sm:hidden"), role: "menu", "data-acp-config-submenu": variant, children: [_jsx("div", { className: "px-2 py-1.5 font-medium text-muted-foreground text-xs", children: section.label }), section.options.map((option) => (_jsxs("button", { type: "button", className: cn("flex min-h-10 w-full items-center gap-2 rounded-sm px-2 py-1.5 text-left text-sm hover:bg-accent hover:text-accent-foreground focus-visible:bg-accent focus-visible:outline-none", option.value === selectedValue && "bg-accent/60"), role: "menuitemradio", "aria-checked": option.value === selectedValue, "data-acp-config-option": option.value, onClick: () => {
+                    section.onChange(option.value);
+                }, children: [_jsxs("span", { className: "min-w-0 flex-1", children: [_jsx("span", { className: "block truncate", children: option.label }), option.description ? (_jsx("span", { className: "block truncate text-muted-foreground text-xs", children: option.description })) : null] }), option.value === selectedValue ? (_jsx(CheckIcon, { className: "size-4 shrink-0" })) : null] }, option.value)))] }));
+}

package/dist/components/assistant-ui/acp-tool-content.d.ts

@@ -0,0 +1,4 @@
+export declare function AcpToolContentBlocks({ toolCallId, className, }: {
+    toolCallId?: string;
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/assistant-ui/acp-tool-content.mjs

@@ -0,0 +1,127 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useAuiState } from "@assistant-ui/react";
+import { FileCodeIcon, FileTextIcon, LinkIcon, TerminalIcon, } from "lucide-react";
+import { useMemo } from "react";
+import { cn } from "../../lib/utils.mjs";
+function isRecord(value) {
+    return Boolean(value && typeof value === "object" && !Array.isArray(value));
+}
+function normalizeString(value) {
+    return typeof value === "string" ? value.trim() : "";
+}
+function recordsFromMap(value) {
+    if (!isRecord(value))
+        return [];
+    return Object.values(value)
+        .filter((item) => isRecord(item))
+        .sort((left, right) => {
+        const leftUpdatedAt = Number(left.updatedAt) || 0;
+        const rightUpdatedAt = Number(right.updatedAt) || 0;
+        return leftUpdatedAt - rightUpdatedAt;
+    });
+}
+function getAcpToolContentGroup(custom, toolCallId) {
+    const empty = {
+        diffs: [],
+        terminals: [],
+        resources: [],
+        resourceLinks: [],
+        unknown: [],
+    };
+    const acpToolContent = custom === null || custom === void 0 ? void 0 : custom.acpToolContent;
+    if (!isRecord(acpToolContent))
+        return empty;
+    const byToolCallId = acpToolContent.byToolCallId;
+    if (!isRecord(byToolCallId))
+        return empty;
+    const group = byToolCallId[toolCallId];
+    if (!isRecord(group))
+        return empty;
+    return {
+        diffs: recordsFromMap(group.diffs),
+        terminals: recordsFromMap(group.terminals),
+        resources: recordsFromMap(group.resources),
+        resourceLinks: recordsFromMap(group.resourceLinks),
+        unknown: recordsFromMap(group.unknown),
+    };
+}
+function hasContent(group) {
+    return (group.diffs.length > 0 ||
+        group.terminals.length > 0 ||
+        group.resources.length > 0 ||
+        group.resourceLinks.length > 0 ||
+        group.unknown.length > 0);
+}
+function formatUnknown(value) {
+    if (value === null)
+        return "null";
+    if (typeof value === "string")
+        return value;
+    try {
+        return JSON.stringify(value, null, 2);
+    }
+    catch (_a) {
+        return String(value);
+    }
+}
+function BlockShell({ icon: Icon, title, subtitle, children, }) {
+    return (_jsxs("section", { className: "rounded-md border border-border/70 bg-muted/20", children: [_jsxs("header", { className: "flex min-w-0 items-center gap-2 border-b px-3 py-2", children: [_jsx(Icon, { className: "size-4 shrink-0 text-muted-foreground" }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "truncate font-medium text-xs", children: title }), subtitle ? (_jsx("p", { className: "truncate text-muted-foreground text-[11px]", children: subtitle })) : null] })] }), _jsx("div", { className: "min-w-0 p-3", children: children })] }));
+}
+function CodePane({ label, value, className, }) {
+    return (_jsxs("div", { className: "min-w-0", children: [_jsx("p", { className: "mb-1 font-medium text-muted-foreground text-[11px]", children: label }), _jsx("pre", { className: cn("max-h-56 overflow-auto rounded-sm bg-background px-3 py-2 font-mono text-[11px] leading-relaxed whitespace-pre-wrap break-words", className), children: value || " " })] }));
+}
+function DiffView({ diff }) {
+    const path = normalizeString(diff.path) || "diff";
+    const oldText = normalizeString(diff.oldText);
+    const newText = normalizeString(diff.newText);
+    return (_jsx(BlockShell, { icon: FileCodeIcon, title: "Diff", subtitle: path, children: oldText || newText ? (_jsxs("div", { className: "grid min-w-0 gap-2 md:grid-cols-2", children: [_jsx(CodePane, { label: "Before", value: oldText, className: "bg-red-500/5" }), _jsx(CodePane, { label: "After", value: newText, className: "bg-green-500/5" })] })) : (_jsx(CodePane, { label: "Raw", value: formatUnknown(diff) })) }));
+}
+function TerminalBlock({ terminal }) {
+    const terminalId = normalizeString(terminal.terminalId) || "terminal";
+    const output = normalizeString(terminal.output) ||
+        normalizeString(terminal.stdout) ||
+        normalizeString(terminal.stderr) ||
+        normalizeString(terminal.text);
+    return (_jsx(BlockShell, { icon: TerminalIcon, title: "Terminal", subtitle: terminalId, children: _jsx(CodePane, { label: "Output", value: output || formatUnknown(terminal) }) }));
+}
+function getResourceUri(resource) {
+    const nested = isRecord(resource.resource) ? resource.resource : {};
+    return (normalizeString(resource.uri) ||
+        normalizeString(nested.uri) ||
+        normalizeString(resource.name));
+}
+function getResourceText(resource) {
+    const nested = isRecord(resource.resource) ? resource.resource : {};
+    return normalizeString(resource.text) || normalizeString(nested.text);
+}
+function ResourceBlock({ resource, kind, }) {
+    const uri = getResourceUri(resource);
+    const title = normalizeString(resource.title) ||
+        normalizeString(resource.name) ||
+        (kind === "resource" ? "Resource" : "Resource link");
+    const mimeType = normalizeString(resource.mimeType) ||
+        (isRecord(resource.resource)
+            ? normalizeString(resource.resource.mimeType)
+            : "");
+    const text = kind === "resource" ? getResourceText(resource) : "";
+    return (_jsx(BlockShell, { icon: kind === "resource" ? FileTextIcon : LinkIcon, title: title, subtitle: uri, children: _jsxs("div", { className: "flex flex-col gap-2 text-xs", children: [mimeType ? _jsx("p", { className: "text-muted-foreground", children: mimeType }) : null, uri ? (_jsx("code", { className: "rounded-sm bg-background px-2 py-1 font-mono text-[11px] break-all", children: uri })) : null, text ? _jsx(CodePane, { label: "Preview", value: text }) : null, !uri && !text ? (_jsx(CodePane, { label: "Raw", value: formatUnknown(resource) })) : null] }) }));
+}
+function UnknownBlock({ item }) {
+    return (_jsx(BlockShell, { icon: FileTextIcon, title: "ACP block", subtitle: "unknown", children: _jsx(CodePane, { label: "Raw", value: formatUnknown(item) }) }));
+}
+export function AcpToolContentBlocks({ toolCallId, className, }) {
+    const custom = useAuiState((state) => { var _a; return (_a = state.message.metadata) === null || _a === void 0 ? void 0 : _a.custom; });
+    const group = useMemo(() => toolCallId
+        ? getAcpToolContentGroup(custom, toolCallId)
+        : {
+            diffs: [],
+            terminals: [],
+            resources: [],
+            resourceLinks: [],
+            unknown: [],
+        }, [custom, toolCallId]);
+    if (!toolCallId || !hasContent(group))
+        return null;
+    return (_jsxs("div", { className: cn("flex flex-col gap-2 px-4", className), children: [group.diffs.map((diff) => (_jsx(DiffView, { diff: diff }, `diff-${formatUnknown(diff)}`))), group.terminals.map((terminal) => (_jsx(TerminalBlock, { terminal: terminal }, `terminal-${formatUnknown(terminal)}`))), group.resources.map((resource) => (_jsx(ResourceBlock, { resource: resource, kind: "resource" }, `resource-${formatUnknown(resource)}`))), group.resourceLinks.map((resource) => (_jsx(ResourceBlock, { resource: resource, kind: "resource_link" }, `resource-link-${formatUnknown(resource)}`))), group.unknown.map((item) => (_jsx(UnknownBlock, { item: item }, `unknown-${formatUnknown(item)}`)))] }));
+}

package/dist/components/assistant-ui/addons/host.d.ts

@@ -0,0 +1,4 @@
+import type { PropsWithChildren } from "react";
+export declare function ThreadAddonProvider({ children }: PropsWithChildren): import("react/jsx-runtime").JSX.Element;
+export declare function ThreadAddonToolbar(): import("react/jsx-runtime").JSX.Element | null;
+export declare function ThreadAddonHost({ children }: PropsWithChildren): import("react/jsx-runtime").JSX.Element;