@mcp-b/react-components 0.16.1 → 0.17.0

package/dist/components/PreviewCard.js

@@ -1,3 +1,4 @@
+import { n as mergeBaseClassName } from "../class-names-Bk-QLWWI.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { PreviewCard as PreviewCard$1 } from "@base-ui/react/preview-card";
@@ -31,8 +32,8 @@ const PreviewCardRoot = (props) => {
 /**
 * Link element that triggers the preview card on hover.
 */
-function PreviewCardTrigger({ className = "", ref, ...props }) {
-	const classes = ["preview-card__trigger", className].filter(Boolean).join(" ");
+function PreviewCardTrigger({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["preview-card__trigger"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(PreviewCard$1.Trigger, {
 		ref,
 		"data-slot": "hover-card-trigger",
@@ -52,12 +53,8 @@ const PreviewCardPortal = (props) => {
 /**
 * Optional backdrop behind the preview card.
 */
-function PreviewCardBackdrop({ className = "", ref, ...props }) {
-	const classes = [
-		"preview-card__backdrop",
-		"base-ui-backdrop",
-		className
-	].filter(Boolean).join(" ");
+function PreviewCardBackdrop({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["preview-card__backdrop", "base-ui-backdrop"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(PreviewCard$1.Backdrop, {
 		ref,
 		"data-slot": "hover-card-backdrop",
@@ -68,12 +65,8 @@ function PreviewCardBackdrop({ className = "", ref, ...props }) {
 /**
 * Positions the preview card relative to the trigger.
 */
-function PreviewCardPositioner({ className = "", ref, ...props }) {
-	const classes = [
-		"preview-card__positioner",
-		"base-ui-positioner",
-		className
-	].filter(Boolean).join(" ");
+function PreviewCardPositioner({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["preview-card__positioner", "base-ui-positioner"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(PreviewCard$1.Positioner, {
 		ref,
 		"data-slot": "hover-card-positioner",
@@ -84,12 +77,8 @@ function PreviewCardPositioner({ className = "", ref, ...props }) {
 /**
 * Container for preview card content.
 */
-function PreviewCardPopup({ className = "", ref, ...props }) {
-	const classes = [
-		"preview-card__popup",
-		"base-ui-popup",
-		className
-	].filter(Boolean).join(" ");
+function PreviewCardPopup({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["preview-card__popup", "base-ui-popup"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(PreviewCard$1.Popup, {
 		ref,
 		"data-slot": "hover-card-content",
@@ -102,8 +91,8 @@ function PreviewCardPopup({ className = "", ref, ...props }) {
 * between triggers. Pair the adaptive classes from `base-ui-motion.css` with
 * the positioner, popup, and this viewport when that behavior is needed.
 */
-function PreviewCardViewport({ className = "", ref, ...props }) {
-	const classes = ["preview-card__viewport", className].filter(Boolean).join(" ");
+function PreviewCardViewport({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["preview-card__viewport"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(PreviewCard$1.Viewport, {
 		ref,
 		"data-slot": "hover-card-viewport",
@@ -114,8 +103,8 @@ function PreviewCardViewport({ className = "", ref, ...props }) {
 /**
 * Decorative arrow pointing to the trigger.
 */
-function PreviewCardArrow({ className = "", ref, ...props }) {
-	const classes = ["preview-card__arrow", className].filter(Boolean).join(" ");
+function PreviewCardArrow({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["preview-card__arrow"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(PreviewCard$1.Arrow, {
 		ref,
 		"data-slot": "hover-card-arrow",

package/dist/components/PricingBillingToggle.js

@@ -1,4 +1,4 @@
-import { t as cx } from "../class-names-9UtZwb0J.js";
+import { t as cx } from "../class-names-Bk-QLWWI.js";
 import { Badge } from "./Badge.js";
 import { Checkbox } from "./Checkbox.js";
 import { Switch } from "./Switch.js";

package/dist/components/PricingFAQ.js

@@ -1,5 +1,5 @@
+import { t as cx } from "../class-names-Bk-QLWWI.js";
 import { Accordion } from "./Accordion.js";
-import { t as cx } from "../class-names-9UtZwb0J.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/PricingFAQ.tsx

package/dist/components/PricingPlanCard.js

@@ -1,8 +1,8 @@
-import { t as cx } from "../class-names-9UtZwb0J.js";
-import { O as MinusIcon, S as InfoIcon, o as CheckIcon } from "../icons-CpfUer49.js";
+import { t as cx } from "../class-names-Bk-QLWWI.js";
+import { C as InfoIcon, k as MinusIcon, s as CheckIcon } from "../icons--FqCZEc3.js";
 import { Button } from "./Button.js";
-import { Separator } from "./Separator.js";
 import { Tooltip } from "./Tooltip.js";
+import { Separator } from "./Separator.js";
 import { Badge } from "./Badge.js";
 import { Card } from "./Card.js";
 import { getPlanPrice, getPlanYearlySavings } from "./Pricing.js";

package/dist/components/PricingUsageCalculator.js

@@ -1,9 +1,9 @@
-import { t as cx } from "../class-names-9UtZwb0J.js";
+import { t as cx } from "../class-names-Bk-QLWWI.js";
 import { Separator } from "./Separator.js";
+import { Progress } from "./Progress.js";
 import { Slider } from "./Slider.js";
 import { Card } from "./Card.js";
 import { formatPricingUsage, getUsagePrice } from "./Pricing.js";
-import { Progress } from "./Progress.js";
 import * as React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/PricingUsageCalculator.tsx

package/dist/components/Progress.d.ts

@@ -3,20 +3,15 @@ import { Progress as Progress$1 } from "@base-ui/react/progress";
 
 //#region src/components/Progress.d.ts
 type ProgressColor = "primary" | "success" | "warning" | "destructive";
-interface ProgressProps extends Omit<React.ComponentPropsWithRef<typeof Progress$1.Root>, "className"> {
-  className?: string;
+interface ProgressProps extends React.ComponentPropsWithRef<typeof Progress$1.Root> {
   /**
    * The semantic color of the progress bar.
    * @default 'primary'
    */
   color?: ProgressColor;
 }
-interface ProgressTrackProps extends Omit<React.ComponentPropsWithRef<typeof Progress$1.Track>, "className"> {
-  className?: string;
-}
-interface ProgressIndicatorProps extends Omit<React.ComponentPropsWithRef<typeof Progress$1.Indicator>, "className"> {
-  className?: string;
-}
+interface ProgressTrackProps extends React.ComponentPropsWithRef<typeof Progress$1.Track> {}
+interface ProgressIndicatorProps extends React.ComponentPropsWithRef<typeof Progress$1.Indicator> {}
 /**
  * A progress indicator component for showing completion status.
  *

package/dist/components/Progress.js

@@ -1,3 +1,4 @@
+import { n as mergeBaseClassName } from "../class-names-Bk-QLWWI.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { Progress as Progress$1 } from "@base-ui/react/progress";
@@ -16,12 +17,8 @@ import { Progress as Progress$1 } from "@base-ui/react/progress";
 *
 * @see {@link https://base-ui.com/react/components/progress | Base UI Progress}
 */
-function ProgressRoot({ color = "primary", className = "", ref, ...props }) {
-	const classes = [
-		"progress",
-		`progress--${color}`,
-		className
-	].filter(Boolean).join(" ");
+function ProgressRoot({ color = "primary", className, ref, ...props }) {
+	const classes = mergeBaseClassName(["progress", `progress--${color}`].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(Progress$1.Root, {
 		ref,
 		"data-slot": "progress",
@@ -29,8 +26,8 @@ function ProgressRoot({ color = "primary", className = "", ref, ...props }) {
 		...props
 	});
 }
-function ProgressTrack({ className = "", ref, ...props }) {
-	const classes = ["progress__track", className].filter(Boolean).join(" ");
+function ProgressTrack({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["progress__track"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(Progress$1.Track, {
 		ref,
 		"data-slot": "progress-track",
@@ -38,8 +35,8 @@ function ProgressTrack({ className = "", ref, ...props }) {
 		...props
 	});
 }
-function ProgressIndicator({ className = "", ref, ...props }) {
-	const classes = ["progress__indicator", className].filter(Boolean).join(" ");
+function ProgressIndicator({ className, ref, ...props }) {
+	const classes = mergeBaseClassName(["progress__indicator"].filter(Boolean).join(" "), className);
 	return /* @__PURE__ */ jsx(Progress$1.Indicator, {
 		ref,
 		"data-slot": "progress-indicator",

package/dist/components/PromptInput.d.ts

@@ -1,2 +1,2 @@
-import { $ as PromptInputDictation, A as PromptInputCommandComposerProps, At as PromptInputTabLabelProps, B as PromptInputCommandItem, Bt as TooltipSide, C as PromptInputBody, Ct as PromptInputSubmitProps, D as PromptInputButtonTooltip, Dt as PromptInputTabItem, E as PromptInputButtonProps, Et as PromptInputTabBodyProps, F as PromptInputCommandGroupLabel, Ft as PromptInputTextareaProps, G as PromptInputCommandSeparator, Gt as usePromptInputController, H as PromptInputCommandList, Ht as getApprovalStateKey, I as PromptInputCommandGroupLabelProps, It as PromptInputTools, J as PromptInputContextAction, K as PromptInputCommandSeparatorProps, Kt as useProviderAttachments, L as PromptInputCommandGroupProps, Lt as PromptInputToolsProps, M as PromptInputCommandEmpty, Mt as PromptInputTabsList, N as PromptInputCommandEmptyProps, Nt as PromptInputTabsListProps, O as PromptInputCommand, Ot as PromptInputTabItemProps, P as PromptInputCommandGroup, Pt as PromptInputTextarea, Q as PromptInputControllerProps, R as PromptInputCommandInput, Rt as PromptInputTooltipConfig, S as PromptInputAttachmentsProps, St as PromptInputSubmit, T as PromptInputButton, Tt as PromptInputTabBody, U as PromptInputCommandListProps, Ut as getPendingToolApprovals, V as PromptInputCommandItemProps, Vt as getApprovalRequestId, W as PromptInputCommandProps, Wt as usePromptInputAttachments, X as PromptInputContextSelector, Y as PromptInputContextItem, Z as PromptInputContextSelectorProps, _ as PromptInputApproval, _t as PromptInputReference, a as PromptInputActionAddAttachments, at as PromptInputHoverCard, b as PromptInputAttachmentProps, bt as PromptInputSelect, c as PromptInputActionAddScreenshotProps, ct as PromptInputHoverCardProps, d as PromptInputActionMenuContentProps, dt as PromptInputMessage, et as PromptInputDictationProps, f as PromptInputActionMenuItem, ft as PromptInputPermissionSelector, g as PromptInputActionMenuTriggerProps, gt as PromptInputProviderProps, h as PromptInputActionMenuTrigger, ht as PromptInputProvider, i as PromptInput, it as PromptInputHeaderProps, j as PromptInputCommandDefinition, jt as PromptInputTabProps, k as PromptInputCommandComposer, kt as PromptInputTabLabel, l as PromptInputActionMenu, lt as PromptInputHoverCardTrigger, m as PromptInputActionMenuProps, mt as PromptInputProps, n as PendingToolApproval, nt as PromptInputFooterProps, o as PromptInputActionAddAttachmentsProps, ot as PromptInputHoverCardContent, p as PromptInputActionMenuItemProps, pt as PromptInputPermissionSelectorProps, q as PromptInputCommandTrigger, r as PermissionMode, rt as PromptInputHeader, s as PromptInputActionAddScreenshot, st as PromptInputHoverCardContentProps, t as AttachmentsContext, tt as PromptInputFooter, u as PromptInputActionMenuContent, ut as PromptInputHoverCardTriggerProps, v as PromptInputApprovalProps, vt as PromptInputReferences, w as PromptInputBodyProps, wt as PromptInputTab, x as PromptInputAttachments, xt as PromptInputSelectProps, y as PromptInputAttachment, yt as PromptInputReferencesProps, z as PromptInputCommandInputProps, zt as TextInputContext } from "../PromptInput-BWTuXMOD.js";
-export { AttachmentsContext, PendingToolApproval, PermissionMode, PromptInput, PromptInputActionAddAttachments, PromptInputActionAddAttachmentsProps, PromptInputActionAddScreenshot, PromptInputActionAddScreenshotProps, PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuContentProps, PromptInputActionMenuItem, PromptInputActionMenuItemProps, PromptInputActionMenuProps, PromptInputActionMenuTrigger, PromptInputActionMenuTriggerProps, PromptInputApproval, PromptInputApprovalProps, PromptInputAttachment, PromptInputAttachmentProps, PromptInputAttachments, PromptInputAttachmentsProps, PromptInputBody, PromptInputBodyProps, PromptInputButton, PromptInputButtonProps, PromptInputButtonTooltip, PromptInputCommand, PromptInputCommandComposer, PromptInputCommandComposerProps, PromptInputCommandDefinition, PromptInputCommandEmpty, PromptInputCommandEmptyProps, PromptInputCommandGroup, PromptInputCommandGroupLabel, PromptInputCommandGroupLabelProps, PromptInputCommandGroupProps, PromptInputCommandInput, PromptInputCommandInputProps, PromptInputCommandItem, PromptInputCommandItemProps, PromptInputCommandList, PromptInputCommandListProps, PromptInputCommandProps, PromptInputCommandSeparator, PromptInputCommandSeparatorProps, PromptInputCommandTrigger, PromptInputContextAction, PromptInputContextItem, PromptInputContextSelector, PromptInputContextSelectorProps, PromptInputControllerProps, PromptInputDictation, PromptInputDictationProps, PromptInputFooter, PromptInputFooterProps, PromptInputHeader, PromptInputHeaderProps, PromptInputHoverCard, PromptInputHoverCardContent, PromptInputHoverCardContentProps, PromptInputHoverCardProps, PromptInputHoverCardTrigger, PromptInputHoverCardTriggerProps, PromptInputMessage, PromptInputPermissionSelector, PromptInputPermissionSelectorProps, PromptInputProps, PromptInputProvider, PromptInputProviderProps, PromptInputReference, PromptInputReferences, PromptInputReferencesProps, PromptInputSelect, PromptInputSelectProps, PromptInputSubmit, PromptInputSubmitProps, PromptInputTab, PromptInputTabBody, PromptInputTabBodyProps, PromptInputTabItem, PromptInputTabItemProps, PromptInputTabLabel, PromptInputTabLabelProps, PromptInputTabProps, PromptInputTabsList, PromptInputTabsListProps, PromptInputTextarea, PromptInputTextareaProps, PromptInputTools, PromptInputToolsProps, PromptInputTooltipConfig, TextInputContext, TooltipSide, getApprovalRequestId, getApprovalStateKey, getPendingToolApprovals, usePromptInputAttachments, usePromptInputController, useProviderAttachments };
+import { $ as PromptInputDictationProps, A as PromptInputCommandDefinition, At as PromptInputTabProps, B as PromptInputCommandItemProps, Bt as getApprovalRequestId, C as PromptInputBodyProps, Ct as PromptInputTab, D as PromptInputCommand, Dt as PromptInputTabItemProps, E as PromptInputButtonTooltip, Et as PromptInputTabItem, F as PromptInputCommandGroupLabelProps, Ft as PromptInputTools, G as PromptInputCommandSeparatorProps, Gt as useProviderAttachments, H as PromptInputCommandListProps, Ht as getPendingToolApprovals, I as PromptInputCommandGroupProps, It as PromptInputToolsProps, J as PromptInputContextItem, K as PromptInputCommandTrigger, L as PromptInputCommandInput, Lt as PromptInputTooltipConfig, M as PromptInputCommandEmptyProps, Mt as PromptInputTabsListProps, N as PromptInputCommandGroup, Nt as PromptInputTextarea, O as PromptInputCommandComposer, Ot as PromptInputTabLabel, P as PromptInputCommandGroupLabel, Pt as PromptInputTextareaProps, Q as PromptInputDictation, R as PromptInputCommandInputProps, Rt as TextInputContext, S as PromptInputBody, St as PromptInputSubmitProps, T as PromptInputButtonProps, Tt as PromptInputTabBodyProps, U as PromptInputCommandProps, Ut as usePromptInputAttachments, V as PromptInputCommandList, Vt as getApprovalStateKey, W as PromptInputCommandSeparator, Wt as usePromptInputController, X as PromptInputContextSelectorProps, Y as PromptInputContextSelector, Z as PromptInputControllerProps, _ as PromptInputApprovalProps, _t as PromptInputReferences, a as PromptInputActionAddAttachmentsProps, at as PromptInputHoverCardContent, b as PromptInputAttachments, bt as PromptInputSelectProps, c as PromptInputActionMenu, ct as PromptInputHoverCardTrigger, d as PromptInputActionMenuItem, dt as PromptInputPermissionSelector, et as PromptInputFooter, f as PromptInputActionMenuItemProps, ft as PromptInputPermissionSelectorProps, g as PromptInputApproval, gt as PromptInputReference, h as PromptInputActionMenuTriggerProps, ht as PromptInputProviderProps, i as PromptInputActionAddAttachments, it as PromptInputHoverCard, j as PromptInputCommandEmpty, jt as PromptInputTabsList, k as PromptInputCommandComposerProps, kt as PromptInputTabLabelProps, l as PromptInputActionMenuContent, lt as PromptInputHoverCardTriggerProps, m as PromptInputActionMenuTrigger, mt as PromptInputProvider, n as PermissionMode, nt as PromptInputHeader, o as PromptInputActionAddScreenshot, ot as PromptInputHoverCardContentProps, p as PromptInputActionMenuProps, pt as PromptInputProps, q as PromptInputContextAction, r as PromptInput, rt as PromptInputHeaderProps, s as PromptInputActionAddScreenshotProps, st as PromptInputHoverCardProps, t as AttachmentsContext, tt as PromptInputFooterProps, u as PromptInputActionMenuContentProps, ut as PromptInputMessage, v as PromptInputAttachment, vt as PromptInputReferencesProps, w as PromptInputButton, wt as PromptInputTabBody, x as PromptInputAttachmentsProps, xt as PromptInputSubmit, y as PromptInputAttachmentProps, yt as PromptInputSelect, z as PromptInputCommandItem, zt as TooltipSide } from "../PromptInput-OLfXPuHM.js";
+export { AttachmentsContext, PermissionMode, PromptInput, PromptInputActionAddAttachments, PromptInputActionAddAttachmentsProps, PromptInputActionAddScreenshot, PromptInputActionAddScreenshotProps, PromptInputActionMenu, PromptInputActionMenuContent, PromptInputActionMenuContentProps, PromptInputActionMenuItem, PromptInputActionMenuItemProps, PromptInputActionMenuProps, PromptInputActionMenuTrigger, PromptInputActionMenuTriggerProps, PromptInputApproval, PromptInputApprovalProps, PromptInputAttachment, PromptInputAttachmentProps, PromptInputAttachments, PromptInputAttachmentsProps, PromptInputBody, PromptInputBodyProps, PromptInputButton, PromptInputButtonProps, PromptInputButtonTooltip, PromptInputCommand, PromptInputCommandComposer, PromptInputCommandComposerProps, PromptInputCommandDefinition, PromptInputCommandEmpty, PromptInputCommandEmptyProps, PromptInputCommandGroup, PromptInputCommandGroupLabel, PromptInputCommandGroupLabelProps, PromptInputCommandGroupProps, PromptInputCommandInput, PromptInputCommandInputProps, PromptInputCommandItem, PromptInputCommandItemProps, PromptInputCommandList, PromptInputCommandListProps, PromptInputCommandProps, PromptInputCommandSeparator, PromptInputCommandSeparatorProps, PromptInputCommandTrigger, PromptInputContextAction, PromptInputContextItem, PromptInputContextSelector, PromptInputContextSelectorProps, PromptInputControllerProps, PromptInputDictation, PromptInputDictationProps, PromptInputFooter, PromptInputFooterProps, PromptInputHeader, PromptInputHeaderProps, PromptInputHoverCard, PromptInputHoverCardContent, PromptInputHoverCardContentProps, PromptInputHoverCardProps, PromptInputHoverCardTrigger, PromptInputHoverCardTriggerProps, PromptInputMessage, PromptInputPermissionSelector, PromptInputPermissionSelectorProps, PromptInputProps, PromptInputProvider, PromptInputProviderProps, PromptInputReference, PromptInputReferences, PromptInputReferencesProps, PromptInputSelect, PromptInputSelectProps, PromptInputSubmit, PromptInputSubmitProps, PromptInputTab, PromptInputTabBody, PromptInputTabBodyProps, PromptInputTabItem, PromptInputTabItemProps, PromptInputTabLabel, PromptInputTabLabelProps, PromptInputTabProps, PromptInputTabsList, PromptInputTabsListProps, PromptInputTextarea, PromptInputTextareaProps, PromptInputTools, PromptInputToolsProps, PromptInputTooltipConfig, TextInputContext, TooltipSide, getApprovalRequestId, getApprovalStateKey, getPendingToolApprovals, usePromptInputAttachments, usePromptInputController, useProviderAttachments };

package/dist/components/PromptInput.js

@@ -1,5 +1,5 @@
-import { t as cx } from "../class-names-9UtZwb0J.js";
-import { B as SpinnerIcon, D as MicrophoneIcon, F as PlusIcon, J as WrenchIcon, N as PencilIcon, U as StopIcon, V as SquareIcon, Y as XIcon, i as ArrowUpIcon, j as PaperclipIcon, k as MonitorIcon, o as CheckIcon, q as WarningIcon, s as ChevronDownIcon, v as FileIcon, y as FolderIcon } from "../icons-CpfUer49.js";
+import { n as mergeBaseClassName, t as cx } from "../class-names-Bk-QLWWI.js";
+import { A as MonitorIcon, H as SquareIcon, I as PlusIcon, J as WarningIcon, M as PaperclipIcon, O as MicrophoneIcon, V as SpinnerIcon, W as StopIcon, X as XIcon, Y as WrenchIcon, b as FolderIcon, c as ChevronDownIcon, i as ArrowUpIcon, s as CheckIcon, y as FileIcon } from "../icons--FqCZEc3.js";
 import { Button } from "./Button.js";
 import { Tooltip } from "./Tooltip.js";
 import { t as AttachmentPreview } from "../attachment-preview-DIs50Q0h.js";
@@ -7,10 +7,12 @@ import { Menu } from "./Menu.js";
 import { Combobox } from "./Combobox.js";
 import { Select } from "./Select.js";
 import { Tabs } from "./Tabs.js";
+import { ThinkExecutionApproval, ThinkPendingApproval, getPausedExecution } from "./ThinkPendingApproval.js";
+import { ToolApproval } from "./ToolApproval.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";
+import { isToolUIPart } from "ai";
+import { getToolApproval } from "@cloudflare/think/react";
 //#region src/components/PromptInput.tsx
 const PromptInputController = React.createContext(null);
 const LocalAttachmentsContext = React.createContext(null);
@@ -611,7 +613,7 @@ function PromptInputDictation({ voice, beforeStart, className, disabled, ref, ..
 			]
 		}) : null,
 		/* @__PURE__ */ jsx("span", {
-			className: "prompt-input__dictation-status",
+			className: "prompt-input__dictation-status sigvelo-visually-hidden",
 			role: "status",
 			"aria-live": "polite",
 			"aria-atomic": "true",
@@ -730,7 +732,7 @@ function PromptInputActionMenuContent({ anchor, positionMethod, side, sideOffset
 		collisionAvoidance,
 		children: /* @__PURE__ */ jsx(Menu.Popup, {
 			tabIndex,
-			className: cx("prompt-input__action-menu", className),
+			className: mergeBaseClassName("prompt-input__action-menu", className),
 			...props,
 			children
 		})
@@ -738,7 +740,7 @@ function PromptInputActionMenuContent({ anchor, positionMethod, side, sideOffset
 }
 function PromptInputActionMenuItem({ className, ...props }) {
 	return /* @__PURE__ */ jsx(Menu.Item, {
-		className: cx("prompt-input__action-menu-item", className),
+		className: mergeBaseClassName("prompt-input__action-menu-item", className),
 		...props
 	});
 }
@@ -867,11 +869,20 @@ function PromptInputSubmit({ className, status = "ready", onStop, variant = "nor
 		children: children ?? (isQueueing ? /* @__PURE__ */ jsx(ArrowUpIcon, {}) : defaultSubmitIcon(status))
 	});
 }
-function getPausedExecution(part) {
-	if (part.state !== "output-available") return void 0;
-	const output = getToolOutput(part);
-	return output?.status === "paused" && typeof output.executionId === "string" ? output : void 0;
-}
+/**
+* Resolve Think execution approvals that do not use the AI SDK
+* `approval-requested` part: paused codemode executions and durable-pause
+* approvals from `pendingApprovals()`. Pass the whole upstream Think agent
+* stub; the component calls its client-callable RPCs directly:
+*
+* ```tsx
+* <PromptInputApproval part={part} thinkStub={agent.stub} />
+* ```
+*
+* On approve, upstream resumes or runs the parked execution and auto-continues
+* the chat. Both RPCs are idempotent, so a stale click resolves to "already
+* handled".
+*/
 /** The id a response must carry: the approval id, or the paused run's executionId. */
 function getApprovalRequestId(part) {
 	if (part.state === "approval-requested") return getToolApproval(part)?.id;
@@ -888,22 +899,13 @@ function getApprovalStateKey(part) {
 /** Derives pending tool approvals straight from the messages — no app-owned shapes. */
 function getPendingToolApprovals(messages, { pausedExecutions = false } = {}) {
 	const pending = [];
-	messages.forEach((message, messageIndex) => {
-		message.parts.forEach((part, partIndex) => {
-			if (isToolUIPart(part) && (part.state === "approval-requested" || pausedExecutions && getPausedExecution(part))) pending.push({
-				message,
-				messageIndex,
-				part,
-				partIndex
-			});
+	messages.forEach((message) => {
+		message.parts.forEach((part) => {
+			if (isToolUIPart(part) && (part.state === "approval-requested" || pausedExecutions && getPausedExecution(part))) pending.push(part);
 		});
 	});
 	return pending;
 }
-function formatApprovalValue(value) {
-	if (typeof value === "string") return value;
-	return JSON.stringify(value);
-}
 /**
 * The composer's approval state: when a tool call awaits human approval the
 * prompt input area becomes the confirmation. "Yes" approves on click; typing
@@ -912,183 +914,32 @@ function formatApprovalValue(value) {
 * current selection — approve by default.
 */
 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);
-	const yesRef = React.useRef(null);
-	const reasonRef = React.useRef(null);
-	const approval = part?.state === "approval-requested" ? part.approval : void 0;
-	const paused = part ? getPausedExecution(part) : void 0;
-	const approvalId = part ? getApprovalStateKey(part) : durableApproval?.executionId;
-	React.useEffect(() => {
-		setSelected("approve");
-		setReason("");
-		setBusy(false);
-	}, [approvalId]);
-	if (!part && !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;
-		setBusy(true);
-		const trimmed = reason.trim();
-		const denyReason = !approved && trimmed ? trimmed : void 0;
-		try {
-			if (approval) await onRespond?.({
-				id: approval.id,
-				approved,
-				reason: 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");
-	const input = durableApproval?.descriptor.input ?? (part ? getToolInput(part) : void 0);
-	const inputEntries = input && typeof input === "object" && !Array.isArray(input) ? Object.entries(input) : void 0;
-	return /* @__PURE__ */ jsxs("div", {
-		ref,
-		role: "group",
-		"aria-label": `Approve ${toolName}`,
+	const shared = {
 		className: cx("prompt-input__approval", className),
-		onKeyDown: (event) => {
-			if (event.key === "ArrowDown" || event.key === "ArrowUp") {
-				event.preventDefault();
-				(selected === "approve" ? reasonRef : yesRef).current?.focus();
-			} else if (event.key === "1" && event.target !== reasonRef.current) yesRef.current?.focus();
-		},
-		...props,
-		children: [
-			/* @__PURE__ */ jsxs("div", {
-				className: "prompt-input__approval-question",
-				children: [/* @__PURE__ */ jsx("span", { children: question ?? (durableApproval ? /* @__PURE__ */ jsxs(Fragment, { children: [
-					"Do you want to allow ",
-					/* @__PURE__ */ jsx("code", { children: durableApproval.descriptor.summary }),
-					"?"
-				] }) : paused ? /* @__PURE__ */ jsx(Fragment, { children: "The agent's code is paused on these calls. Allow it to continue?" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-					"Do you want to allow the agent to run ",
-					/* @__PURE__ */ jsx("code", { children: toolName }),
-					"?"
-				] })) }), count && count > 1 ? /* @__PURE__ */ jsxs("span", {
-					className: "prompt-input__approval-count",
-					children: ["1 of ", count]
-				}) : null]
-			}),
-			paused ? /* @__PURE__ */ jsx("div", {
-				className: "prompt-input__approval-preview",
-				children: paused.pending.map((action) => /* @__PURE__ */ jsxs("div", {
-					className: "prompt-input__approval-preview-row",
-					children: [
-						/* @__PURE__ */ jsxs("span", {
-							className: "prompt-input__approval-preview-key",
-							children: [
-								action.connector,
-								".",
-								action.method
-							]
-						}),
-						" ",
-						action.args === void 0 ? null : formatApprovalValue(action.args)
-					]
-				}, action.seq))
-			}) : input !== void 0 ? /* @__PURE__ */ jsx("div", {
-				className: "prompt-input__approval-preview",
-				children: inputEntries ? inputEntries.map(([key, value]) => /* @__PURE__ */ jsxs("div", {
-					className: "prompt-input__approval-preview-row",
-					children: [
-						/* @__PURE__ */ jsx("span", {
-							className: "prompt-input__approval-preview-key",
-							children: key
-						}),
-						" ",
-						formatApprovalValue(value)
-					]
-				}, key)) : /* @__PURE__ */ jsx("div", {
-					className: "prompt-input__approval-preview-row",
-					children: formatApprovalValue(input)
-				})
-			}) : null,
-			/* @__PURE__ */ jsxs("div", {
-				className: "prompt-input__approval-options",
-				children: [/* @__PURE__ */ jsxs("button", {
-					ref: yesRef,
-					type: "button",
-					className: "prompt-input__approval-option",
-					"data-selected": selected === "approve" || void 0,
-					disabled: busy,
-					onClick: () => void respond(true),
-					onFocus: () => setSelected("approve"),
-					children: [
-						/* @__PURE__ */ jsx("span", {
-							className: "prompt-input__approval-key",
-							children: "1"
-						}),
-						"Yes",
-						/* @__PURE__ */ jsx("span", {
-							className: "prompt-input__approval-arrows",
-							"aria-hidden": "true",
-							children: "↑↓"
-						})
-					]
-				}), /* @__PURE__ */ jsxs("div", {
-					className: "prompt-input__approval-option prompt-input__approval-deny",
-					"data-selected": selected === "deny" || void 0,
-					children: [
-						/* @__PURE__ */ jsx("span", {
-							className: "prompt-input__approval-key",
-							"aria-hidden": "true",
-							children: /* @__PURE__ */ jsx(PencilIcon, { size: 11 })
-						}),
-						/* @__PURE__ */ jsx("input", {
-							ref: reasonRef,
-							type: "text",
-							className: "prompt-input__approval-reason",
-							"aria-label": `Deny ${toolName} and tell the agent what to do differently`,
-							placeholder: "No, and tell the agent what to do differently",
-							value: reason,
-							disabled: busy,
-							onFocus: () => setSelected("deny"),
-							onChange: (event) => {
-								setSelected("deny");
-								setReason(event.currentTarget.value);
-							},
-							onKeyDown: (event) => {
-								if (event.key === "Enter" && !event.nativeEvent.isComposing) {
-									event.preventDefault();
-									respond(false);
-								}
-							}
-						}),
-						onSkip ? /* @__PURE__ */ jsx(Button, {
-							type: "button",
-							size: "xs",
-							variant: "ghost",
-							color: "neutral",
-							className: "prompt-input__approval-skip",
-							disabled: busy,
-							onClick: onSkip,
-							children: "Skip"
-						}) : null,
-						/* @__PURE__ */ jsxs(Button, {
-							type: "button",
-							size: "xs",
-							color: "primary",
-							className: "prompt-input__approval-submit",
-							disabled: busy,
-							onClick: submit,
-							children: [selected === "approve" ? "Approve" : "Submit", /* @__PURE__ */ jsx("kbd", {
-								className: "prompt-input__approval-kbd",
-								children: "⏎"
-							})]
-						})
-					]
-				})]
-			})
-		]
+		count,
+		onSkip,
+		question,
+		ref,
+		...props
+	};
+	if (part?.state === "approval-requested" && onRespond) return /* @__PURE__ */ jsx(ToolApproval, {
+		...shared,
+		part,
+		onRespond
+	});
+	if (part && thinkStub && getPausedExecution(part)) return /* @__PURE__ */ jsx(ThinkExecutionApproval, {
+		...shared,
+		part,
+		thinkStub,
+		onSettled: onExecutionSettled
+	});
+	if (durableApproval && thinkStub) return /* @__PURE__ */ jsx(ThinkPendingApproval, {
+		...shared,
+		approval: durableApproval,
+		thinkStub,
+		onSettled: onExecutionSettled
 	});
+	return null;
 }
 const PromptInputSelect = Select;
 const PromptInputHoverCardContext = React.createContext(null);
@@ -1169,7 +1020,7 @@ const PromptInputCommandInput = Combobox.Input;
 function PromptInputCommandList({ className, ref, ...props }) {
 	return /* @__PURE__ */ jsx(Combobox.List, {
 		ref,
-		className: cx("prompt-input__command-list", className),
+		className: mergeBaseClassName("prompt-input__command-list", className),
 		...props
 	});
 }
@@ -1240,6 +1091,7 @@ function PromptInputCommandComposer({ commands, mentionCommands, value, onValueC
 			className: "prompt-input__command-positioner",
 			children: /* @__PURE__ */ jsxs(Combobox.Popup, {
 				className: "prompt-input__command-popup",
+				"data-recipe": "composer-command-surface",
 				children: [/* @__PURE__ */ jsx(PromptInputCommandList, {
 					"data-command-trigger": trigger,
 					children: (group) => /* @__PURE__ */ jsxs(PromptInputCommandGroup, {

package/dist/components/Queue.d.ts

@@ -1,4 +1,4 @@
-import { Collapsible } from "./Collapsible.js";
+import { t as Collapsible } from "../Collapsible-N64ASIQr.js";
 import { r as ButtonProps } from "../Button-FX_hpqxm.js";
 import { ScrollArea } from "./ScrollArea.js";
 import * as React from "react";
@@ -61,9 +61,7 @@ declare function Queue({
 }: QueueProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface QueueSectionProps extends Omit<React.ComponentProps<typeof Collapsible.Root>, "className" | "unstyled"> {
-  className?: string;
-}
+interface QueueSectionProps extends Omit<React.ComponentProps<typeof Collapsible.Root>, "unstyled"> {}
 /**
  * A collapsible section within a Queue. Holds a trigger label and a list
  * of QueueItem children.
@@ -76,9 +74,7 @@ declare function QueueSection({
 }: QueueSectionProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface QueueSectionTriggerProps extends Omit<React.ComponentProps<typeof Collapsible.Trigger>, "className" | "unstyled"> {
-  className?: string;
-}
+interface QueueSectionTriggerProps extends Omit<React.ComponentProps<typeof Collapsible.Trigger>, "unstyled"> {}
 declare function QueueSectionTrigger({
   className,
   children,
@@ -104,9 +100,7 @@ declare function QueueSectionLabel({
 }: QueueSectionLabelProps & {
   ref?: React.Ref<HTMLSpanElement>;
 }): React.JSX.Element;
-interface QueueListProps extends Omit<React.ComponentProps<typeof ScrollArea.Root>, "className"> {
-  className?: string;
-}
+interface QueueListProps extends React.ComponentProps<typeof ScrollArea.Root> {}
 declare function QueueList({
   className,
   children,
@@ -115,9 +109,7 @@ declare function QueueList({
 }: QueueListProps & {
   ref?: React.Ref<HTMLDivElement>;
 }): React.JSX.Element;
-interface QueueSectionContentProps extends Omit<React.ComponentProps<typeof Collapsible.Panel>, "className" | "unstyled"> {
-  className?: string;
-}
+interface QueueSectionContentProps extends Omit<React.ComponentProps<typeof Collapsible.Panel>, "unstyled"> {}
 declare function QueueSectionContent({
   className,
   ref,
@@ -176,9 +168,7 @@ declare function QueueItemDescription({
   ref?: React.Ref<HTMLParagraphElement>;
 }): React.JSX.Element;
 interface QueueItemActionsProps extends React.HTMLAttributes<HTMLDivElement> {}
-interface QueueItemActionProps extends Omit<ButtonProps, "variant" | "color" | "size" | "className"> {
-  className?: string;
-}
+interface QueueItemActionProps extends Omit<ButtonProps, "variant" | "color" | "size"> {}
 declare function QueueItemActions({
   className,
   children,

package/dist/components/Queue.js

@@ -1,6 +1,6 @@
+import { t as cx } from "../class-names-Bk-QLWWI.js";
 import { Collapsible } from "./Collapsible.js";
-import { t as cx } from "../class-names-9UtZwb0J.js";
-import { l as ChevronRightIcon, o as CheckIcon, p as DotIcon, v as FileIcon } from "../icons-CpfUer49.js";
+import { m as DotIcon, s as CheckIcon, u as ChevronRightIcon, y as FileIcon } from "../icons--FqCZEc3.js";
 import { Button } from "./Button.js";
 import { Badge } from "./Badge.js";
 import { ScrollArea } from "./ScrollArea.js";

package/dist/components/RadioGroup.d.ts

@@ -3,20 +3,15 @@ import { RadioGroup as RadioGroup$1 } from "@base-ui/react/radio-group";
 import { Radio as Radio$1 } from "@base-ui/react/radio";
 
 //#region src/components/RadioGroup.d.ts
-interface RadioGroupProps extends Omit<React.ComponentPropsWithRef<typeof RadioGroup$1>, "className"> {
-  className?: string;
+interface RadioGroupProps extends React.ComponentPropsWithRef<typeof RadioGroup$1> {
   /**
    * The orientation of the radio group.
    * @default 'vertical'
    */
   orientation?: "horizontal" | "vertical";
 }
-interface RadioProps extends Omit<React.ComponentPropsWithRef<typeof Radio$1.Root>, "className"> {
-  className?: string;
-}
-interface RadioIndicatorProps extends Omit<React.ComponentPropsWithRef<typeof Radio$1.Indicator>, "className"> {
-  className?: string;
-}
+interface RadioProps extends React.ComponentPropsWithRef<typeof Radio$1.Root> {}
+interface RadioIndicatorProps extends React.ComponentPropsWithRef<typeof Radio$1.Indicator> {}
 /**
  * A radio group component for selecting one option from a list.
  *