@mcp-b/react-components 0.11.0 → 0.13.0

package/dist/components/PromptInput.js

@@ -1,27 +1,19 @@
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { C as MonitorIcon, E as PencilIcon, F as WarningIcon, L as XIcon, M as SpinnerIcon, N as SquareIcon, O as PlusIcon, h as FileIcon, i as ArrowUpIcon, o as ChevronDownIcon, w as PaperclipIcon } from "../icons-D2Q5n5C1.js";
+import { D as PencilIcon, F as StopIcon, L as WarningIcon, N as SpinnerIcon, P as SquareIcon, S as MicrophoneIcon, T as PaperclipIcon, h as FileIcon, i as ArrowUpIcon, k as PlusIcon, o as ChevronDownIcon, w as MonitorIcon, z as XIcon } from "../icons-Ba9THQKz.js";
 import { Button } from "./Button.js";
-import { Tooltip, TooltipPopup, TooltipPortal, TooltipPositioner, TooltipTrigger } from "./Tooltip.js";
-import { t as AttachmentPreview } from "../attachment-preview-ChtC3HiU.js";
-import { Combobox, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxList, ComboboxSeparator } from "./Combobox.js";
-import { MenuContent, MenuItem, MenuPopup, MenuPortal, MenuPositioner, MenuRadioGroup, MenuRadioItem, MenuRadioItemIndicator, MenuRoot, MenuTrigger } from "./Menu.js";
-import { Select, SelectContent, SelectItem, SelectPortal, SelectPositioner, SelectTrigger, SelectValue } from "./Select.js";
-import { Tab, TabPanel, TabsList } from "./Tabs.js";
+import { Tooltip } from "./Tooltip.js";
+import { t as AttachmentPreview } from "../attachment-preview-DIs50Q0h.js";
+import { Combobox } from "./Combobox.js";
+import { Menu } from "./Menu.js";
+import { Select } from "./Select.js";
+import { Tabs } from "./Tabs.js";
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { getToolApproval, getToolInput, getToolOutput } from "@cloudflare/think/react";
 import { getToolName, isToolUIPart } from "ai";
 //#region src/components/PromptInput.tsx
-const PromptInputContext = React.createContext(null);
 const PromptInputController = React.createContext(null);
-const ProviderAttachmentsContext = React.createContext(null);
 const LocalAttachmentsContext = React.createContext(null);
-const LocalReferencedSourcesContext = React.createContext(null);
-function usePromptInputContext(component) {
-	const ctx = React.useContext(PromptInputContext);
-	if (!ctx) throw new Error(`${component} must be used inside a <PromptInput>.`);
-	return ctx;
-}
 function usePromptInputController() {
 	const ctx = React.useContext(PromptInputController);
 	if (!ctx) throw new Error("Wrap your component inside <PromptInputProvider> to use usePromptInputController().");
@@ -31,24 +23,16 @@ function useOptionalPromptInputController() {
 	return React.useContext(PromptInputController);
 }
 function useProviderAttachments() {
-	const ctx = React.useContext(ProviderAttachmentsContext);
-	if (!ctx) throw new Error("Wrap your component inside <PromptInputProvider> to use useProviderAttachments().");
-	return ctx;
-}
-function useOptionalProviderAttachments() {
-	return React.useContext(ProviderAttachmentsContext);
+	const controller = useOptionalPromptInputController();
+	if (!controller) throw new Error("Wrap your component inside <PromptInputProvider> to use useProviderAttachments().");
+	return controller.attachments;
 }
 function usePromptInputAttachments() {
-	const provider = useOptionalProviderAttachments();
-	const context = React.useContext(LocalAttachmentsContext) ?? provider;
+	const controller = useOptionalPromptInputController();
+	const context = React.useContext(LocalAttachmentsContext) ?? controller?.attachments;
 	if (!context) throw new Error("usePromptInputAttachments must be used within a PromptInput or PromptInputProvider.");
 	return context;
 }
-function usePromptInputReferencedSources() {
-	const ctx = React.useContext(LocalReferencedSourcesContext);
-	if (!ctx) throw new Error("usePromptInputReferencedSources must be used within a PromptInput.");
-	return ctx;
-}
 function PromptInputProvider({ initialInput = "", children }) {
 	const [textInput, setTextInput] = React.useState(initialInput);
 	const [attachmentFiles, setAttachmentFiles] = React.useState([]);
@@ -103,10 +87,7 @@ function PromptInputProvider({ initialInput = "", children }) {
 	}), [attachments, textInput]);
 	return /* @__PURE__ */ jsx(PromptInputController.Provider, {
 		value: controller,
-		children: /* @__PURE__ */ jsx(ProviderAttachmentsContext.Provider, {
-			value: attachments,
-			children
-		})
+		children
 	});
 }
 /**
@@ -116,8 +97,8 @@ function PromptInputProvider({ initialInput = "", children }) {
 *
 * Use for assistant/chat submit forms. Do not use it as a generic textarea or
 * non-chat form. Sigvelo changes: uses shared Menu, Select, Combobox, Tabs,
-* Button, and Tooltip components; maps styles to CSS tokens; adds local
-* attachment and referenced-source helpers.
+* Button, and Tooltip components; maps styles to CSS tokens; and adds local
+* attachment helpers.
 *
 * The form handles Enter-to-submit while multiline editing remains in the
 * textarea. Attachment controls need accessible labels through their buttons
@@ -140,15 +121,12 @@ function PromptInputProvider({ initialInput = "", children }) {
 *
 * @see {@link https://elements.ai-sdk.dev/components/prompt-input | AI Elements Prompt Input}
 */
-function PromptInput({ className, accept, multiple, globalDrop, syncHiddenInput, maxFiles, maxFileSize, onError, onSubmit, children, id, ref, ...props }) {
-	const generatedId = React.useId();
-	const formId = id ?? generatedId;
+function PromptInput({ className, accept, multiple, globalDrop, syncHiddenInput, maxFiles, maxFileSize, onError, onSubmit, children, ref, ...props }) {
 	const controller = useOptionalPromptInputController();
 	const usingProvider = Boolean(controller);
 	const formRef = React.useRef(null);
 	const inputRef = React.useRef(null);
 	const [localFiles, setLocalFiles] = React.useState([]);
-	const [referencedSources, setReferencedSources] = React.useState([]);
 	const files = controller?.attachments.files ?? localFiles;
 	const filesRef = React.useRef(files);
 	filesRef.current = files;
@@ -215,11 +193,6 @@ function PromptInput({ className, accept, multiple, globalDrop, syncHiddenInput,
 			return [];
 		});
 	}, [controller]);
-	const clearReferencedSources = React.useCallback(() => setReferencedSources([]), []);
-	const clear = React.useCallback(() => {
-		clearAttachments();
-		clearReferencedSources();
-	}, [clearAttachments, clearReferencedSources]);
 	const openFileDialog = React.useCallback(() => inputRef.current?.click(), []);
 	React.useEffect(() => {
 		if (!controller) return;
@@ -261,25 +234,6 @@ function PromptInput({ className, accept, multiple, globalDrop, syncHiddenInput,
 		openFileDialog,
 		remove
 	]);
-	const referencedSourcesCtx = React.useMemo(() => ({
-		add: (incoming) => {
-			const array = Array.isArray(incoming) ? incoming : [incoming];
-			setReferencedSources((prev) => [...prev, ...array.map((source) => ({
-				...source,
-				id: source.id ?? createId()
-			}))]);
-		},
-		clear: clearReferencedSources,
-		remove: (sourceId) => setReferencedSources((prev) => prev.filter((source) => source.id !== sourceId)),
-		sources: referencedSources
-	}), [clearReferencedSources, referencedSources]);
-	const submit = React.useCallback(() => {
-		formRef.current?.requestSubmit();
-	}, []);
-	const ctx = React.useMemo(() => ({
-		formId,
-		submit
-	}), [formId, submit]);
 	const handleSubmit = React.useCallback(async (event) => {
 		event.preventDefault();
 		const textarea = event.currentTarget.querySelector("textarea[data-prompt-input-textarea=\"true\"]");
@@ -295,42 +249,35 @@ function PromptInput({ className, accept, multiple, globalDrop, syncHiddenInput,
 				textarea.dispatchEvent(new Event("input", { bubbles: true }));
 			}
 			controller?.textInput.clear();
-			clear();
+			clearAttachments();
 		} catch {}
 	}, [
-		clear,
+		clearAttachments,
 		controller,
 		files,
 		onSubmit
 	]);
-	return /* @__PURE__ */ jsx(PromptInputContext.Provider, {
-		value: ctx,
-		children: /* @__PURE__ */ jsx(LocalAttachmentsContext.Provider, {
-			value: attachmentsCtx,
-			children: /* @__PURE__ */ jsxs(LocalReferencedSourcesContext.Provider, {
-				value: referencedSourcesCtx,
-				children: [/* @__PURE__ */ jsx("input", {
-					ref: inputRef,
-					accept,
-					"aria-label": "Upload files",
-					className: "prompt-input__file-input",
-					multiple,
-					onChange: (event) => {
-						if (event.currentTarget.files?.length) add(event.currentTarget.files);
-						event.currentTarget.value = "";
-					},
-					tabIndex: -1,
-					type: "file"
-				}), /* @__PURE__ */ jsx("form", {
-					ref: formRef,
-					id: formId,
-					className: cx("prompt-input", className),
-					onSubmit: handleSubmit,
-					...props,
-					children
-				})]
-			})
-		})
+	return /* @__PURE__ */ jsxs(LocalAttachmentsContext.Provider, {
+		value: attachmentsCtx,
+		children: [/* @__PURE__ */ jsx("input", {
+			ref: inputRef,
+			accept,
+			"aria-label": "Upload files",
+			className: "prompt-input__file-input",
+			multiple,
+			onChange: (event) => {
+				if (event.currentTarget.files?.length) add(event.currentTarget.files);
+				event.currentTarget.value = "";
+			},
+			tabIndex: -1,
+			type: "file"
+		}), /* @__PURE__ */ jsx("form", {
+			ref: formRef,
+			className: cx("prompt-input", className),
+			onSubmit: handleSubmit,
+			...props,
+			children
+		})]
 	});
 }
 function PromptInputHeader({ className, children, ref, ...props }) {
@@ -421,7 +368,6 @@ function PromptInputTools({ className, children, ref, ...props }) {
 const MIN_TEXTAREA_HEIGHT_PX = 24;
 const MAX_TEXTAREA_HEIGHT_PX = 240;
 function PromptInputTextarea({ className, placeholder = "How can I help?", rows = 1, minHeight = MIN_TEXTAREA_HEIGHT_PX, maxHeight = MAX_TEXTAREA_HEIGHT_PX, onChange, onCompositionEnd, onCompositionStart, onKeyDown, onInput, onPaste, ref, ...props }) {
-	const { submit } = usePromptInputContext("PromptInputTextarea");
 	const controller = useOptionalPromptInputController();
 	const attachments = usePromptInputAttachments();
 	const innerRef = React.useRef(null);
@@ -470,7 +416,7 @@ function PromptInputTextarea({ className, placeholder = "How can I help?", rows
 			if (event.defaultPrevented) return;
 			if (event.key === "Enter" && !event.shiftKey && !isComposing && !event.nativeEvent.isComposing) {
 				event.preventDefault();
-				submit();
+				event.currentTarget.form?.requestSubmit();
 			}
 			if (event.key === "Backspace" && event.currentTarget.value === "" && attachments.files.length > 0) {
 				event.preventDefault();
@@ -516,10 +462,10 @@ function PromptInputButton({ className, tooltip, variant = "ghost", color = "neu
 		children
 	});
 	if (!tooltipConfig) return button;
-	return /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, { render: button }), /* @__PURE__ */ jsx(TooltipPortal, { children: /* @__PURE__ */ jsx(TooltipPositioner, {
+	return /* @__PURE__ */ jsxs(Tooltip.Root, { children: [/* @__PURE__ */ jsx(Tooltip.Trigger, { render: button }), /* @__PURE__ */ jsx(Tooltip.Portal, { children: /* @__PURE__ */ jsx(Tooltip.Positioner, {
 		side: tooltipConfig.side,
 		sideOffset: 6,
-		children: /* @__PURE__ */ jsxs(TooltipPopup, { children: [/* @__PURE__ */ jsx("span", {
+		children: /* @__PURE__ */ jsxs(Tooltip.Popup, { children: [/* @__PURE__ */ jsx("span", {
 			className: "prompt-input__tooltip-content",
 			children: tooltipConfig.content
 		}), tooltipConfig.shortcut ? /* @__PURE__ */ jsx("kbd", {
@@ -528,25 +474,118 @@ function PromptInputButton({ className, tooltip, variant = "ghost", color = "neu
 		}) : null] })
 	}) })] });
 }
+/**
+* Voice-dictation control for PromptInput. Final upstream transcripts are
+* appended to the composer while interim text remains ephemeral.
+*/
+function PromptInputDictation({ voice, className, disabled, ref, ...props }) {
+	const controller = useOptionalPromptInputController();
+	const buttonRef = React.useRef(null);
+	const committedTranscriptRef = React.useRef("");
+	const [isStarting, setIsStarting] = React.useState(false);
+	const [startError, setStartError] = React.useState(null);
+	React.useImperativeHandle(ref, () => buttonRef.current, []);
+	React.useEffect(() => {
+		const transcript = voice.transcript;
+		if (!transcript) return;
+		const previous = committedTranscriptRef.current;
+		const addition = transcript.startsWith(previous) ? transcript.slice(previous.length).trim() : transcript.trim();
+		committedTranscriptRef.current = transcript;
+		if (!addition) return;
+		if (controller) {
+			controller.textInput.setInput(appendDictationTranscript(controller.textInput.value, addition));
+			return;
+		}
+		const textarea = buttonRef.current?.form?.querySelector("textarea[data-prompt-input-textarea=\"true\"]");
+		if (!textarea) return;
+		textarea.value = appendDictationTranscript(textarea.value, addition);
+		textarea.dispatchEvent(new Event("input", { bubbles: true }));
+	}, [controller, voice.transcript]);
+	const error = startError ?? voice.error;
+	const listening = voice.isListening;
+	const label = listening ? "Stop dictation" : error ? "Retry dictation" : "Start dictation";
+	const status = error ? `Dictation failed: ${error}` : listening ? voice.interimTranscript ? "Listening. Speech detected." : "Listening for speech." : isStarting ? "Starting dictation." : "";
+	const level = Math.min(Math.max(voice.audioLevel, 0), 1);
+	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(PromptInputButton, {
+		ref: buttonRef,
+		className: cx("prompt-input__dictation", className),
+		tooltip: {
+			content: label,
+			side: "top"
+		},
+		"aria-label": label,
+		"aria-pressed": listening,
+		"data-error": error ? "true" : void 0,
+		"data-listening": listening ? "true" : void 0,
+		"data-starting": isStarting ? "true" : void 0,
+		disabled: disabled || isStarting,
+		onClick: () => {
+			setStartError(null);
+			if (listening) {
+				voice.stop();
+				return;
+			}
+			setIsStarting(true);
+			voice.start().catch((reason) => {
+				setStartError(reason instanceof Error ? reason.message : String(reason));
+			}).finally(() => setIsStarting(false));
+		},
+		...props,
+		children: /* @__PURE__ */ jsx("span", {
+			className: "prompt-input__dictation-icon",
+			style: { "--prompt-input-dictation-level": level },
+			"aria-hidden": "true",
+			children: isStarting ? /* @__PURE__ */ jsx(SpinnerIcon, {}) : listening ? /* @__PURE__ */ jsx(StopIcon, {}) : /* @__PURE__ */ jsx(MicrophoneIcon, {})
+		})
+	}), /* @__PURE__ */ jsx("span", {
+		className: "prompt-input__dictation-status",
+		role: "status",
+		"aria-live": "polite",
+		"aria-atomic": "true",
+		children: status
+	})] });
+}
+function appendDictationTranscript(current, transcript) {
+	if (!current) return transcript;
+	return `${current}${/\s$/u.test(current) ? "" : " "}${transcript}`;
+}
 function PromptInputActionMenu(props) {
-	return /* @__PURE__ */ jsx(MenuRoot, { ...props });
+	return /* @__PURE__ */ jsx(Menu.Root, { ...props });
 }
 function PromptInputActionMenuTrigger({ className, children, ...props }) {
-	return /* @__PURE__ */ jsx(MenuTrigger, { render: /* @__PURE__ */ jsx(PromptInputButton, {
-		className,
-		...props,
-		children: children ?? /* @__PURE__ */ jsx(PlusIcon, {})
-	}) });
-}
-function PromptInputActionMenuContent({ className, children, ...props }) {
-	return /* @__PURE__ */ jsx(MenuContent, {
-		className: cx("prompt-input__action-menu", className),
-		...props,
-		children
+	return /* @__PURE__ */ jsx(Menu.Trigger, {
+		unstyled: true,
+		render: /* @__PURE__ */ jsx(PromptInputButton, {
+			className: cx("prompt-input__action-menu-trigger", className),
+			...props,
+			children: children ?? /* @__PURE__ */ jsx(PlusIcon, {})
+		})
 	});
 }
+function PromptInputActionMenuContent({ anchor, positionMethod, side, sideOffset = 4, align, alignOffset, collisionBoundary, collisionPadding, sticky, arrowPadding, disableAnchorTracking, collisionAvoidance, className, children, tabIndex = 0, ...props }) {
+	return /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, {
+		anchor,
+		positionMethod,
+		side,
+		sideOffset,
+		align,
+		alignOffset,
+		collisionBoundary,
+		collisionPadding,
+		sticky,
+		arrowPadding,
+		disableAnchorTracking,
+		collisionAvoidance,
+		children: /* @__PURE__ */ jsx(Menu.Popup, {
+			tabIndex,
+			className: cx("prompt-input__action-menu", className),
+			...props,
+			children
+		})
+	}) });
+}
 function PromptInputActionMenuItem({ className, ...props }) {
-	return /* @__PURE__ */ jsx(MenuItem, {
+	return /* @__PURE__ */ jsx(Menu.Item, {
 		className: cx("prompt-input__action-menu-item", className),
 		...props
 	});
@@ -595,28 +634,32 @@ const PERMISSION_MODES = [{
 * whoever owns the approvals (`AgentChat` wires both ends).
 */
 function PromptInputPermissionSelector({ value, onValueChange, question = "How should agent actions be approved?" }) {
-	return /* @__PURE__ */ jsxs(MenuRoot, { children: [/* @__PURE__ */ jsx(MenuTrigger, { render: /* @__PURE__ */ jsxs(PromptInputButton, {
-		size: "xs",
-		className: "prompt-input__permissions-trigger",
-		"data-mode": value,
-		"aria-label": (PERMISSION_MODES.find((mode) => mode.value === value) ?? PERMISSION_MODES[0]).label,
-		children: [/* @__PURE__ */ jsx("span", {
-			className: "prompt-input__permissions-current",
-			children: PERMISSION_MODES.map((mode) => /* @__PURE__ */ jsxs("span", {
-				className: "prompt-input__permissions-current-option",
-				"data-active": mode.value === value || void 0,
-				children: [mode.value === "bypass" ? /* @__PURE__ */ jsx(WarningIcon, { size: 14 }) : null, mode.label]
-			}, mode.value))
-		}), /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12 })]
-	}) }), /* @__PURE__ */ jsx(MenuPortal, { children: /* @__PURE__ */ jsx(MenuPositioner, { children: /* @__PURE__ */ jsxs(MenuPopup, {
+	const selected = PERMISSION_MODES.find((mode) => mode.value === value) ?? PERMISSION_MODES[0];
+	return /* @__PURE__ */ jsxs(Menu.Root, { children: [/* @__PURE__ */ jsx(Menu.Trigger, {
+		unstyled: true,
+		render: /* @__PURE__ */ jsxs(PromptInputButton, {
+			size: "xs",
+			className: "prompt-input__permissions-trigger",
+			"data-mode": value,
+			"aria-label": selected.label,
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "prompt-input__permissions-current",
+				children: PERMISSION_MODES.map((mode) => /* @__PURE__ */ jsxs("span", {
+					className: "prompt-input__permissions-current-option",
+					"data-active": mode.value === value || void 0,
+					children: [mode.value === "bypass" ? /* @__PURE__ */ jsx(WarningIcon, { size: 14 }) : null, mode.label]
+				}, mode.value))
+			}), /* @__PURE__ */ jsx(ChevronDownIcon, { size: 12 })]
+		})
+	}), /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(Menu.Positioner, { children: /* @__PURE__ */ jsxs(Menu.Popup, {
 		className: "prompt-input__permissions-menu",
 		children: [/* @__PURE__ */ jsx("div", {
 			className: "prompt-input__permissions-question",
 			children: question
-		}), /* @__PURE__ */ jsx(MenuRadioGroup, {
+		}), /* @__PURE__ */ jsx(Menu.RadioGroup, {
 			value,
 			onValueChange: (mode) => onValueChange(mode),
-			children: PERMISSION_MODES.map((mode) => /* @__PURE__ */ jsxs(MenuRadioItem, {
+			children: PERMISSION_MODES.map((mode) => /* @__PURE__ */ jsxs(Menu.RadioItem, {
 				value: mode.value,
 				closeOnClick: true,
 				className: "prompt-input__permissions-option",
@@ -629,7 +672,7 @@ function PromptInputPermissionSelector({ value, onValueChange, question = "How s
 						className: "prompt-input__permissions-option-description",
 						children: mode.description
 					})]
-				}), /* @__PURE__ */ jsx(MenuRadioItemIndicator, { className: "prompt-input__permissions-check" })]
+				}), /* @__PURE__ */ jsx(Menu.RadioItemIndicator, { className: "prompt-input__permissions-check" })]
 			}, mode.value))
 		})]
 	}) }) })] });
@@ -702,7 +745,7 @@ function formatApprovalValue(value) {
 * sends the text as the native approval `reason`. Submit (or Enter) sends the
 * current selection — approve by default.
 */
-function PromptInputApproval({ part, approval: durableApproval, onRespond, executionApprovals, onSkip, question, count, className, ref, ...props }) {
+function PromptInputApproval({ part, approval: durableApproval, onRespond, thinkStub, onExecutionSettled, onSkip, question, count, className, ref, ...props }) {
 	const [selected, setSelected] = React.useState("approve");
 	const [reason, setReason] = React.useState("");
 	const [busy, setBusy] = React.useState(false);
@@ -717,7 +760,7 @@ function PromptInputApproval({ part, approval: durableApproval, onRespond, execu
 		setBusy(false);
 	}, [approvalId]);
 	if (!part && !durableApproval) return null;
-	if (approval ? !onRespond : !(executionApprovals && (paused || durableApproval))) return null;
+	if (approval ? !onRespond : !(thinkStub && (paused || durableApproval))) return null;
 	const toolName = durableApproval?.descriptor.action ?? (part ? getToolName(part) : "action");
 	const respond = async (approved) => {
 		if (busy) return;
@@ -730,10 +773,11 @@ function PromptInputApproval({ part, approval: durableApproval, onRespond, execu
 				approved,
 				reason: denyReason
 			});
-			else if (paused) await (approved ? executionApprovals?.approve(paused.executionId) : executionApprovals?.reject(paused.executionId, denyReason));
-			else if (durableApproval) await (approved ? executionApprovals?.approve(durableApproval.executionId) : executionApprovals?.reject(durableApproval.executionId, denyReason));
+			else if (paused && thinkStub) await (approved ? thinkStub.approveExecution(paused.executionId) : thinkStub.rejectExecution(paused.executionId, denyReason));
+			else if (durableApproval && thinkStub) await (approved ? thinkStub.approveExecution(durableApproval.executionId) : thinkStub.rejectExecution(durableApproval.executionId, denyReason));
 		} finally {
 			setBusy(false);
+			if (!approval) onExecutionSettled?.();
 		}
 	};
 	const submit = () => void respond(selected === "approve");
@@ -881,14 +925,6 @@ function PromptInputApproval({ part, approval: durableApproval, onRespond, execu
 	});
 }
 const PromptInputSelect = Select;
-function PromptInputSelectTrigger(props) {
-	return /* @__PURE__ */ jsx(SelectTrigger, { ...props });
-}
-function PromptInputSelectContent(props) {
-	return /* @__PURE__ */ jsx(SelectPortal, { children: /* @__PURE__ */ jsx(SelectPositioner, { children: /* @__PURE__ */ jsx(SelectContent, { ...props }) }) });
-}
-const PromptInputSelectItem = SelectItem;
-const PromptInputSelectValue = SelectValue;
 const PromptInputHoverCardContext = React.createContext(null);
 function PromptInputHoverCard({ openDelay = 0, closeDelay = 0, className, children, ref, ...props }) {
 	const [open, setOpen] = React.useState(false);
@@ -945,9 +981,9 @@ function PromptInputHoverCardContent({ className, ref, ...props }) {
 		...props
 	});
 }
-const PromptInputTabsList = TabsList;
-const PromptInputTab = Tab;
-const PromptInputTabBody = TabPanel;
+const PromptInputTabsList = Tabs.List;
+const PromptInputTab = Tabs.Tab;
+const PromptInputTabBody = Tabs.Panel;
 function PromptInputTabLabel({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx("h3", {
 		ref,
@@ -963,18 +999,18 @@ function PromptInputTabItem({ className, ref, ...props }) {
 	});
 }
 const PromptInputCommand = Combobox;
-const PromptInputCommandInput = ComboboxInput;
+const PromptInputCommandInput = Combobox.Input;
 function PromptInputCommandList({ className, ref, ...props }) {
-	return /* @__PURE__ */ jsx(ComboboxList, {
+	return /* @__PURE__ */ jsx(Combobox.List, {
 		ref,
 		className: cx("prompt-input__command-list", className),
 		...props
 	});
 }
-const PromptInputCommandEmpty = ComboboxEmpty;
-const PromptInputCommandGroup = ComboboxGroup;
-const PromptInputCommandItem = ComboboxItem;
-const PromptInputCommandSeparator = ComboboxSeparator;
+const PromptInputCommandEmpty = Combobox.Empty;
+const PromptInputCommandGroup = Combobox.Group;
+const PromptInputCommandItem = Combobox.Item;
+const PromptInputCommandSeparator = Combobox.Separator;
 function defaultSubmitIcon(status) {
 	switch (status) {
 		case "submitted": return /* @__PURE__ */ jsx(SpinnerIcon, { className: "prompt-input__submit-spinner" });
@@ -1066,4 +1102,4 @@ function createId() {
 	return globalThis.crypto?.randomUUID?.() ?? `prompt-input-${Date.now()}-${Math.random()}`;
 }
 //#endregion
-export { PromptInput, PromptInputActionAddAttachments, PromptInputActionAddScreenshot, PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuItem, PromptInputActionMenuTrigger, PromptInputApproval, PromptInputAttachment, PromptInputAttachments, PromptInputBody, PromptInputButton, PromptInputCommand, PromptInputCommandEmpty, PromptInputCommandGroup, PromptInputCommandInput, PromptInputCommandItem, PromptInputCommandList, PromptInputCommandSeparator, PromptInputFooter, PromptInputHeader, PromptInputHoverCard, PromptInputHoverCardContent, PromptInputHoverCardTrigger, PromptInputPermissionSelector, PromptInputProvider, PromptInputSelect, PromptInputSelectContent, PromptInputSelectItem, PromptInputSelectTrigger, PromptInputSelectValue, PromptInputSubmit, PromptInputTab, PromptInputTabBody, PromptInputTabItem, PromptInputTabLabel, PromptInputTabsList, PromptInputTextarea, PromptInputTools, getApprovalRequestId, getApprovalStateKey, getPendingToolApprovals, usePromptInputAttachments, usePromptInputController, usePromptInputReferencedSources, useProviderAttachments };
+export { PromptInput, PromptInputActionAddAttachments, PromptInputActionAddScreenshot, PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuItem, PromptInputActionMenuTrigger, PromptInputApproval, PromptInputAttachment, PromptInputAttachments, PromptInputBody, PromptInputButton, PromptInputCommand, PromptInputCommandEmpty, PromptInputCommandGroup, PromptInputCommandInput, PromptInputCommandItem, PromptInputCommandList, PromptInputCommandSeparator, PromptInputDictation, PromptInputFooter, PromptInputHeader, PromptInputHoverCard, PromptInputHoverCardContent, PromptInputHoverCardTrigger, PromptInputPermissionSelector, PromptInputProvider, PromptInputSelect, PromptInputSubmit, PromptInputTab, PromptInputTabBody, PromptInputTabItem, PromptInputTabLabel, PromptInputTabsList, PromptInputTextarea, PromptInputTools, getApprovalRequestId, getApprovalStateKey, getPendingToolApprovals, usePromptInputAttachments, usePromptInputController, useProviderAttachments };

package/dist/components/Queue.d.ts

@@ -1,20 +1,9 @@
-import { CollapsiblePanelProps, CollapsibleRootProps, CollapsibleTriggerProps } from "./Collapsible.js";
-import { r as ButtonProps } from "../Button-Ct5I6aTu.js";
-import { ScrollAreaRootProps } from "./ScrollArea.js";
+import { Collapsible } from "./Collapsible.js";
+import { r as ButtonProps } from "../Button-FX_hpqxm.js";
+import { ScrollArea } from "./ScrollArea.js";
 import * as React from "react";
 
 //#region src/components/Queue.d.ts
-interface QueueMessagePart {
-  type: string;
-  text?: string;
-  url?: string;
-  filename?: string;
-  mediaType?: string;
-}
-interface QueueMessage {
-  id: string;
-  parts: QueueMessagePart[];
-}
 interface QueueTodo {
   id: string;
   title: string;
@@ -72,7 +61,7 @@ declare function Queue({
 }: QueueProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface QueueSectionProps extends Omit<CollapsibleRootProps, "className" | "unstyled"> {
+interface QueueSectionProps extends Omit<React.ComponentProps<typeof Collapsible.Root>, "className" | "unstyled"> {
   className?: string;
 }
 /**
@@ -87,7 +76,7 @@ declare function QueueSection({
 }: QueueSectionProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface QueueSectionTriggerProps extends Omit<CollapsibleTriggerProps, "className" | "unstyled"> {
+interface QueueSectionTriggerProps extends Omit<React.ComponentProps<typeof Collapsible.Trigger>, "className" | "unstyled"> {
   className?: string;
 }
 declare function QueueSectionTrigger({
@@ -115,7 +104,7 @@ declare function QueueSectionLabel({
 }: QueueSectionLabelProps & {
   ref?: React.Ref<HTMLSpanElement>;
 }): React.JSX.Element;
-interface QueueListProps extends Omit<ScrollAreaRootProps, "className"> {
+interface QueueListProps extends Omit<React.ComponentProps<typeof ScrollArea.Root>, "className"> {
   className?: string;
 }
 declare function QueueList({
@@ -126,7 +115,7 @@ declare function QueueList({
 }: QueueListProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface QueueSectionContentProps extends Omit<CollapsiblePanelProps, "className" | "unstyled"> {
+interface QueueSectionContentProps extends Omit<React.ComponentProps<typeof Collapsible.Panel>, "className" | "unstyled"> {
   className?: string;
 }
 declare function QueueSectionContent({
@@ -238,4 +227,4 @@ declare function QueueItemFile({
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
 //#endregion
-export { Queue, QueueItem, QueueItemAction, QueueItemActionProps, QueueItemActions, QueueItemActionsProps, QueueItemAttachment, QueueItemAttachmentProps, QueueItemContent, QueueItemContentProps, QueueItemDescription, QueueItemDescriptionProps, QueueItemFile, QueueItemFileProps, QueueItemImage, QueueItemImageProps, QueueItemIndicator, QueueItemIndicatorProps, QueueItemProps, QueueItemStatus, QueueList, QueueListProps, QueueMessage, QueueMessagePart, QueueProps, QueueSection, QueueSectionContent, QueueSectionContentProps, QueueSectionLabel, QueueSectionLabelProps, QueueSectionProps, QueueSectionTrigger, QueueSectionTriggerProps, QueueTodo };
+export { Queue, QueueItem, QueueItemAction, QueueItemActionProps, QueueItemActions, QueueItemActionsProps, QueueItemAttachment, QueueItemAttachmentProps, QueueItemContent, QueueItemContentProps, QueueItemDescription, QueueItemDescriptionProps, QueueItemFile, QueueItemFileProps, QueueItemImage, QueueItemImageProps, QueueItemIndicator, QueueItemIndicatorProps, QueueItemProps, QueueItemStatus, QueueList, QueueListProps, QueueProps, QueueSection, QueueSectionContent, QueueSectionContentProps, QueueSectionLabel, QueueSectionLabelProps, QueueSectionProps, QueueSectionTrigger, QueueSectionTriggerProps, QueueTodo };

package/dist/components/Queue.js

@@ -1,6 +1,6 @@
-import { CollapsiblePanel, CollapsibleRoot, CollapsibleTrigger } from "./Collapsible.js";
+import { Collapsible } from "./Collapsible.js";
 import { t as cx } from "../class-names-9UtZwb0J.js";
-import { a as CheckIcon, c as ChevronRightIcon, h as FileIcon, u as DotIcon } from "../icons-D2Q5n5C1.js";
+import { a as CheckIcon, c as ChevronRightIcon, h as FileIcon, u as DotIcon } from "../icons-Ba9THQKz.js";
 import { Button } from "./Button.js";
 import { Badge } from "./Badge.js";
 import { ScrollArea } from "./ScrollArea.js";
@@ -57,7 +57,7 @@ function Queue({ className, children, ref, ...props }) {
 * of QueueItem children.
 */
 function QueueSection({ className, defaultOpen = true, ref, ...props }) {
-	return /* @__PURE__ */ jsx(CollapsibleRoot, {
+	return /* @__PURE__ */ jsx(Collapsible.Root, {
 		ref,
 		className: cx("queue__section", className),
 		defaultOpen,
@@ -66,7 +66,7 @@ function QueueSection({ className, defaultOpen = true, ref, ...props }) {
 	});
 }
 function QueueSectionTrigger({ className, children, ref, ...props }) {
-	return /* @__PURE__ */ jsxs(CollapsibleTrigger, {
+	return /* @__PURE__ */ jsxs(Collapsible.Trigger, {
 		ref,
 		className: cx("queue__section-trigger", className),
 		...props,
@@ -97,7 +97,7 @@ function QueueSectionLabel({ className, children, count, label, icon, ref, ...pr
 	});
 }
 function QueueList({ className, children, ref, ...props }) {
-	return /* @__PURE__ */ jsxs(ScrollArea, {
+	return /* @__PURE__ */ jsxs(ScrollArea.Root, {
 		ref,
 		className: cx("queue__list", className),
 		...props,
@@ -117,7 +117,7 @@ function QueueList({ className, children, ref, ...props }) {
 	});
 }
 function QueueSectionContent({ className, ref, ...props }) {
-	return /* @__PURE__ */ jsx(CollapsiblePanel, {
+	return /* @__PURE__ */ jsx(Collapsible.Panel, {
 		ref,
 		className: cx("queue__section-content", className),
 		...props,