@page-speed/agent-everywhere 0.3.1 → 0.4.0

package/dist/index.d.cts

@@ -22,6 +22,36 @@ interface AgentMessage {
     feedback?: MessageFeedback;
     /** For chart/data messages */
     data?: DataPayload;
+    /**
+     * An inline confirmation / proposed-plan / action panel attached to this
+     * message. Rendered in the transcript flow (after the message content) so it
+     * never covers the assistant response. See `ConfirmationData`.
+     */
+    confirmation?: ConfirmationData;
+}
+/**
+ * Data-only description of an inline confirmation / proposed-plan panel. The
+ * `MessageList` renders this with the `ConfirmationPanel` component, reusing the
+ * shared markdown rendering for the body so long plans keep readable spacing.
+ */
+interface ConfirmationData {
+    /** Panel heading, e.g. "Proposed plan". */
+    title?: string;
+    /** Short scope/summary label, e.g. "3 pages to change". */
+    summary?: string;
+    /** Plan / confirmation body. Rendered as markdown by default. */
+    body?: string;
+    /** Render the body verbatim instead of as markdown. */
+    markdown?: boolean;
+    /** Action buttons (confirm / cancel / regenerate, …). */
+    actions?: ConfirmationActionData[];
+}
+interface ConfirmationActionData {
+    id: string;
+    label: string;
+    variant?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link';
+    disabled?: boolean;
+    busy?: boolean;
 }
 interface MessageMetadata {
     model?: string;
@@ -943,8 +973,8 @@ interface UseSemanticBuilderResult {
 declare function useSemanticBuilder<TBlock = AgentBlock>({ socketUrl, resolveSocketUrl, websiteId, pageCategoryId, pageName, pageSlug, blocks, contentBrief, enabled, onGeneratedBlocks, onUndoRequest, buildWelcomeMessage, webSocketImpl, }: UseSemanticBuilderOptions<TBlock>): UseSemanticBuilderResult;
 
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "outline" | "default" | "destructive" | "secondary" | "ghost" | null | undefined;
-    size?: "sm" | "default" | "lg" | "icon" | null | undefined;
+    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends react.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
     asChild?: boolean;
@@ -956,7 +986,7 @@ declare const Input: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProp
 declare const Textarea: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & react.RefAttributes<HTMLTextAreaElement>>;
 
 declare const badgeVariants: (props?: ({
-    variant?: "error" | "outline" | "default" | "destructive" | "secondary" | "success" | "warning" | null | undefined;
+    variant?: "default" | "destructive" | "outline" | "secondary" | "error" | "success" | "warning" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface BadgeProps extends react.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
 }
@@ -988,6 +1018,23 @@ interface MessageBubbleProps {
     unstyled?: boolean;
 }
 declare function MessageBubble({ role, children, className, unstyled }: MessageBubbleProps): react.JSX.Element;
+interface MessageContentProps {
+    children: React.ReactNode;
+    className?: string;
+    /**
+     * When the content is a plain string, render it as markdown (headings,
+     * lists, bold/italic, code, links) instead of raw text. Defaults to true.
+     * Set false for content that should be shown verbatim.
+     */
+    markdown?: boolean;
+}
+declare function MessageContent({ children, className, markdown, }: MessageContentProps): react.JSX.Element;
+interface MessageContainerProps {
+    role: MessageRole;
+    children: React.ReactNode;
+    className?: string;
+}
+declare function MessageContainer({ role, children, className }: MessageContainerProps): react.JSX.Element;
 
 interface AgentAvatarProps {
     role: MessageRole;
@@ -1090,7 +1137,7 @@ interface PromptInputProps {
     /** Input class */
     inputClassName?: string;
     /** Variant styling */
-    variant?: 'default' | 'minimal' | 'bordered';
+    variant?: "default" | "minimal" | "bordered";
     /**
      * Minimum number of visible text rows. Default 1 (grows as the user types).
      */
@@ -1316,6 +1363,11 @@ interface MessageListProps {
     renderMessage?: (message: AgentMessage) => React.ReactNode;
     /** Feedback handler passed to feedback-capable messages. */
     onFeedback?: (messageId: string, vote: 'up' | 'down') => void;
+    /**
+     * Invoked when an inline confirmation-panel action is activated. Receives the
+     * owning message id and the action id.
+     */
+    onConfirmAction?: (messageId: string, actionId: string) => void;
     className?: string;
 }
 /**
@@ -1324,7 +1376,7 @@ interface MessageListProps {
  * content, attachments, and any structured data payload. This is the default
  * conversation body shared by every surface.
  */
-declare function MessageList({ messages, showAvatars, renderMessage, className, }: MessageListProps): react.JSX.Element;
+declare function MessageList({ messages, showAvatars, renderMessage, onConfirmAction, className, }: MessageListProps): react.JSX.Element;
 
 interface PersonaSelectorProps {
     /** Available personas to choose from. */
@@ -1601,6 +1653,56 @@ interface SettingsPanelProps {
 }
 declare function SettingsPanel({ groups, onChange, className }: SettingsPanelProps): react.JSX.Element;
 
+interface ConfirmationAction {
+    id: string;
+    label: string;
+    /** Button variant; defaults to 'default' for the first action, 'outline' otherwise. */
+    variant?: ButtonProps['variant'];
+    /** Disable this action. */
+    disabled?: boolean;
+    /** Render a loading/busy state and disable the button. */
+    busy?: boolean;
+}
+interface ConfirmationPanelProps {
+    /** Panel heading, e.g. "Proposed plan". */
+    title?: string;
+    /**
+     * Short label shown beside the title (e.g. "0 pages to change"). Rendered as
+     * a badge so scope/summary metadata reads at a glance.
+     */
+    summary?: string;
+    /**
+     * The plan / confirmation body. When a string is passed it is rendered
+     * through the same markdown pipeline as assistant messages, so headings,
+     * paragraphs, and bullet/numbered lists keep their spacing and line breaks.
+     * Pass `markdown={false}` to render verbatim, or pass a node for custom body.
+     */
+    body?: React.ReactNode;
+    /**
+     * Render the string body as markdown. Defaults to true. Ignored for node
+     * bodies (which are rendered as-is).
+     */
+    markdown?: boolean;
+    /** Leading icon for the header. Defaults to a clipboard list icon. */
+    icon?: React.ReactNode;
+    /** Action buttons (confirm / cancel / regenerate, …). */
+    actions?: ConfirmationAction[];
+    /** Invoked with the action id when an action button is activated. */
+    onAction?: (id: string) => void;
+    /** Accessible label for the panel region. Defaults to the title. */
+    ariaLabel?: string;
+    className?: string;
+}
+/**
+ * An inline confirmation / proposed-plan / action panel.
+ *
+ * It is designed to flow inside the transcript like any other message — NOT to
+ * be pinned above the input — so it never covers the latest assistant response.
+ * The body reuses {@link MessageContent}, giving long plans the same markdown
+ * rendering, typography, and spacing as normal assistant messages.
+ */
+declare function ConfirmationPanel({ title, summary, body, markdown, icon, actions, onAction, ariaLabel, className, }: ConfirmationPanelProps): react.JSX.Element;
+
 /**
  * Lifecycle of an agent-to-agent handoff.
  *  - 'connecting' → the target agent is being brought online / routed to.
@@ -2543,6 +2645,12 @@ interface AgentSurfaceProps {
     renderMessage?: (message: AgentMessage) => ReactNode;
     /** Feedback handler passed to MessageList. */
     onFeedback?: (messageId: string, vote: 'up' | 'down') => void;
+    /**
+     * Handler for inline confirmation-panel actions. Receives the owning message
+     * id and the activated action id. Confirmation panels render inline in the
+     * transcript (via `message.confirmation`), never pinned over the response.
+     */
+    onConfirmAction?: (messageId: string, actionId: string) => void;
     /**
      * Structured report rendered in the data region. Used by the
      * dashboard/split surfaces (sidebar or data panel). If omitted, a custom
@@ -2582,6 +2690,6 @@ interface AgentSurfaceProps {
  *   - 'overlay'    → OverlayModal (centered modal conversation)
  *   - 'mobile'     → MobileShell (full-height mobile layout)
  */
-declare function AgentSurface({ mode, messages, isLoading, inputValue, onInputChange, onSubmit, inputPlaceholder, input, title, subtitle, icon, headerActions, suggestions, showAvatars, renderMessage, onFeedback, report, dataPanel, isOpen, onToggle, onClose, onExitFullscreen, position, status, className, }: AgentSurfaceProps): react.JSX.Element;
+declare function AgentSurface({ mode, messages, isLoading, inputValue, onInputChange, onSubmit, inputPlaceholder, input, title, subtitle, icon, headerActions, suggestions, showAvatars, renderMessage, onFeedback, onConfirmAction, report, dataPanel, isOpen, onToggle, onClose, onExitFullscreen, position, status, className, }: AgentSurfaceProps): react.JSX.Element;
 
-export { type AgendaItem, type AgendaItemAction, type AgendaItemState, type AgendaSlotOption, type AgentAction, type AgentAttachment, AgentAvatar, type AgentBackend, type AgentBlock, type AgentConfig, type AgentContextValue, type AgentEvent, type AgentEventType, type AgentFeatures, AgentHandoff, type AgentHandoffProps, type AgentMessage, type AgentPersona, AgentProvider, type AgentProviderProps, type AgentReport, type AgentState, type AgentStreamChunk, AgentSurface, type AgentSurfaceProps, AllocationBreakdown, type AllocationSegment, type AllocationSummaryStat, type AnalyticsBreakdownRow, AnalyticsDashboard, type AnalyticsDashboardProps, type AnalyticsDistributionSegment, type AnalyticsHighlight, type AnalyticsMetric, type AnalyticsRankedRow, type AnalyticsRecentItem, type AnalyticsTrend, type AssistantMessageBlocksEnvelope, type AssistantMessageCompleteEnvelope, type AssistantMessageDeltaEnvelope, type AssistantMessageStartEnvelope, type AssistantMessageThinkingDeltaEnvelope, type Attachment, type AttachmentKind, type AttachmentMediaType, type AttachmentType, Avatar, AvatarFallback, AvatarImage, Badge, type BlockUpdateMode, Button, ChartContainer, type ChartData, type ChartDataPoint, type ChartType, type ChatMessageRole, ChatPanel, Collapsible, CollapsibleContent, CollapsibleTrigger, type ComponentCapability, type ComponentCategory, type ComponentManifestEntry, type ComponentSlot, type ConnectionReadyEnvelope, type ConnectionState, ControlGrid, type ControlTile, type ControlTileType, ConversationAnalytics, ConversationArtifact, type ConversationArtifactProps, type ConversationHistoryItem, type DataPayload, DataPayloadView, DataTable, DynamicRenderer, type EditorAdjustment, type EditorTool, type EmotionScore, type EntityAction, EntityCard, type EntityCardData, type EntityField, type ErrorEnvelope, type ExecutionStep, type ExecutionStepStatus, type FeedbackCategory, type FeedbackSentiment, FileDropZone, FloatingWidget, FullBleedSurface, type FullBleedSurfaceProps, FullscreenDashboard, type GenerateReportOptions, GuidedLessonFlow, type HandoffAction, type HandoffAgent, type HandoffCandidate, type HandoffStatus, type HandoffVariant, ImageGenerator, type InlineSuggestion, InlineSuggestionsInput, Input, type LayoutConfig, type LayoutMode, type LessonStep, type LibraryPrompt, type Listing, type ListingAction, ListingFeed, type ListingField, type ManifestPropSpec, MediaEditorCanvas, MediaGallery, type MediaItem, type MediaKind, MessageActions, MessageBubble, type MessageFeedback, MessageList, type MessageListProps, type MessageMetadata, type MessageRole, MessageWithAttachments, MessageWithFeedback, MessageWithReasoning, MessageWithSteps, type MetricData, MetricsGrid, MobileShell, type MockBackendConfig, MultimodalInput, OnboardingWizard, type OptionCardItem, OptionCards, type OrchestrationCommand, OverlayModal, PerformanceMetrics, PersonaSelector, Progress, ProgressTracker, PromptInput, PromptLibrary, type PromptTemplate, QuickReplies, type QuickReply, QuizCard, type QuizOption, type QuizQuestion, type QuizResult, type ReasoningStatus, type ReasoningStep, type Recommendation, type RecommendationAction, RecommendationCards, type RecommendationTone, type RenderInstruction, type ReportSection, ReportView, ScheduleTimeline, ScrollArea, ScrollBar, type SemanticBuilderChatMessage, SemanticBuilderSocketClient, type SendMessageOptions, type SendOptions, SentimentDisplay, type SentimentScore, type ServerEnvelope, type SettingControl, type SettingsGroup, SettingsPanel, SlotRenderer, type SocketClientOptions, type SocketSendPayload, type SocketUrlResolver, SplitView, StatusBadge, SystemMessage, type TableColumn, type TableData, TemplateSelector, type TemplateVariable, Textarea, type ThemeConfig, Timestamp, type ToolCall, type ToolDefinition, type ToolResult, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type TrendDirection, type TrendTone, TypingIndicator, type UseSemanticBuilderOptions, type UseSemanticBuilderResult, type UserMessageEnvelope, type WidgetPosition, WritingAssistant, badgeVariants, buildSocketUrl, buttonVariants, calculatePercentage, cn, componentManifest, componentMap, componentRegistry, copyToClipboard, createMockBackend, debounce, delay, findComponentsByCapability, findComponentsByCategory, findComponentsBySurface, formatBytes, formatCurrency, formatNumber, formatRelativeTime, formatTime, generateId, getInitials, getManifestEntry, getSentimentBgColor, getSentimentColor, isBrowser, isInIframe, normalizeWebsiteId, parseTextWithBold, registerAllComponents, truncate, useAgent, useAgentBackend, useAgentInput, useAgentLayout, useAgentMessages, useSemanticBuilder };
+export { type AgendaItem, type AgendaItemAction, type AgendaItemState, type AgendaSlotOption, type AgentAction, type AgentAttachment, AgentAvatar, type AgentBackend, type AgentBlock, type AgentConfig, type AgentContextValue, type AgentEvent, type AgentEventType, type AgentFeatures, AgentHandoff, type AgentHandoffProps, type AgentMessage, type AgentPersona, AgentProvider, type AgentProviderProps, type AgentReport, type AgentState, type AgentStreamChunk, AgentSurface, type AgentSurfaceProps, AllocationBreakdown, type AllocationSegment, type AllocationSummaryStat, type AnalyticsBreakdownRow, AnalyticsDashboard, type AnalyticsDashboardProps, type AnalyticsDistributionSegment, type AnalyticsHighlight, type AnalyticsMetric, type AnalyticsRankedRow, type AnalyticsRecentItem, type AnalyticsTrend, type AssistantMessageBlocksEnvelope, type AssistantMessageCompleteEnvelope, type AssistantMessageDeltaEnvelope, type AssistantMessageStartEnvelope, type AssistantMessageThinkingDeltaEnvelope, type Attachment, type AttachmentKind, type AttachmentMediaType, type AttachmentType, Avatar, AvatarFallback, AvatarImage, Badge, type BlockUpdateMode, Button, ChartContainer, type ChartData, type ChartDataPoint, type ChartType, type ChatMessageRole, ChatPanel, Collapsible, CollapsibleContent, CollapsibleTrigger, type ComponentCapability, type ComponentCategory, type ComponentManifestEntry, type ComponentSlot, type ConfirmationAction, type ConfirmationActionData, type ConfirmationData, ConfirmationPanel, type ConfirmationPanelProps, type ConnectionReadyEnvelope, type ConnectionState, ControlGrid, type ControlTile, type ControlTileType, ConversationAnalytics, ConversationArtifact, type ConversationArtifactProps, type ConversationHistoryItem, type DataPayload, DataPayloadView, DataTable, DynamicRenderer, type EditorAdjustment, type EditorTool, type EmotionScore, type EntityAction, EntityCard, type EntityCardData, type EntityField, type ErrorEnvelope, type ExecutionStep, type ExecutionStepStatus, type FeedbackCategory, type FeedbackSentiment, FileDropZone, FloatingWidget, FullBleedSurface, type FullBleedSurfaceProps, FullscreenDashboard, type GenerateReportOptions, GuidedLessonFlow, type HandoffAction, type HandoffAgent, type HandoffCandidate, type HandoffStatus, type HandoffVariant, ImageGenerator, type InlineSuggestion, InlineSuggestionsInput, Input, type LayoutConfig, type LayoutMode, type LessonStep, type LibraryPrompt, type Listing, type ListingAction, ListingFeed, type ListingField, type ManifestPropSpec, MediaEditorCanvas, MediaGallery, type MediaItem, type MediaKind, MessageActions, MessageBubble, type MessageBubbleProps, MessageContainer, type MessageContainerProps, MessageContent, type MessageContentProps, type MessageFeedback, MessageList, type MessageListProps, type MessageMetadata, type MessageRole, MessageWithAttachments, MessageWithFeedback, MessageWithReasoning, MessageWithSteps, type MetricData, MetricsGrid, MobileShell, type MockBackendConfig, MultimodalInput, OnboardingWizard, type OptionCardItem, OptionCards, type OrchestrationCommand, OverlayModal, PerformanceMetrics, PersonaSelector, Progress, ProgressTracker, PromptInput, PromptLibrary, type PromptTemplate, QuickReplies, type QuickReply, QuizCard, type QuizOption, type QuizQuestion, type QuizResult, type ReasoningStatus, type ReasoningStep, type Recommendation, type RecommendationAction, RecommendationCards, type RecommendationTone, type RenderInstruction, type ReportSection, ReportView, ScheduleTimeline, ScrollArea, ScrollBar, type SemanticBuilderChatMessage, SemanticBuilderSocketClient, type SendMessageOptions, type SendOptions, SentimentDisplay, type SentimentScore, type ServerEnvelope, type SettingControl, type SettingsGroup, SettingsPanel, SlotRenderer, type SocketClientOptions, type SocketSendPayload, type SocketUrlResolver, SplitView, StatusBadge, SystemMessage, type TableColumn, type TableData, TemplateSelector, type TemplateVariable, Textarea, type ThemeConfig, Timestamp, type ToolCall, type ToolDefinition, type ToolResult, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type TrendDirection, type TrendTone, TypingIndicator, type UseSemanticBuilderOptions, type UseSemanticBuilderResult, type UserMessageEnvelope, type WidgetPosition, WritingAssistant, badgeVariants, buildSocketUrl, buttonVariants, calculatePercentage, cn, componentManifest, componentMap, componentRegistry, copyToClipboard, createMockBackend, debounce, delay, findComponentsByCapability, findComponentsByCategory, findComponentsBySurface, formatBytes, formatCurrency, formatNumber, formatRelativeTime, formatTime, generateId, getInitials, getManifestEntry, getSentimentBgColor, getSentimentColor, isBrowser, isInIframe, normalizeWebsiteId, parseTextWithBold, registerAllComponents, truncate, useAgent, useAgentBackend, useAgentInput, useAgentLayout, useAgentMessages, useSemanticBuilder };

package/dist/index.d.ts

@@ -22,6 +22,36 @@ interface AgentMessage {
     feedback?: MessageFeedback;
     /** For chart/data messages */
     data?: DataPayload;
+    /**
+     * An inline confirmation / proposed-plan / action panel attached to this
+     * message. Rendered in the transcript flow (after the message content) so it
+     * never covers the assistant response. See `ConfirmationData`.
+     */
+    confirmation?: ConfirmationData;
+}
+/**
+ * Data-only description of an inline confirmation / proposed-plan panel. The
+ * `MessageList` renders this with the `ConfirmationPanel` component, reusing the
+ * shared markdown rendering for the body so long plans keep readable spacing.
+ */
+interface ConfirmationData {
+    /** Panel heading, e.g. "Proposed plan". */
+    title?: string;
+    /** Short scope/summary label, e.g. "3 pages to change". */
+    summary?: string;
+    /** Plan / confirmation body. Rendered as markdown by default. */
+    body?: string;
+    /** Render the body verbatim instead of as markdown. */
+    markdown?: boolean;
+    /** Action buttons (confirm / cancel / regenerate, …). */
+    actions?: ConfirmationActionData[];
+}
+interface ConfirmationActionData {
+    id: string;
+    label: string;
+    variant?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link';
+    disabled?: boolean;
+    busy?: boolean;
 }
 interface MessageMetadata {
     model?: string;
@@ -943,8 +973,8 @@ interface UseSemanticBuilderResult {
 declare function useSemanticBuilder<TBlock = AgentBlock>({ socketUrl, resolveSocketUrl, websiteId, pageCategoryId, pageName, pageSlug, blocks, contentBrief, enabled, onGeneratedBlocks, onUndoRequest, buildWelcomeMessage, webSocketImpl, }: UseSemanticBuilderOptions<TBlock>): UseSemanticBuilderResult;
 
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "outline" | "default" | "destructive" | "secondary" | "ghost" | null | undefined;
-    size?: "sm" | "default" | "lg" | "icon" | null | undefined;
+    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends react.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
     asChild?: boolean;
@@ -956,7 +986,7 @@ declare const Input: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProp
 declare const Textarea: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & react.RefAttributes<HTMLTextAreaElement>>;
 
 declare const badgeVariants: (props?: ({
-    variant?: "error" | "outline" | "default" | "destructive" | "secondary" | "success" | "warning" | null | undefined;
+    variant?: "default" | "destructive" | "outline" | "secondary" | "error" | "success" | "warning" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface BadgeProps extends react.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
 }
@@ -988,6 +1018,23 @@ interface MessageBubbleProps {
     unstyled?: boolean;
 }
 declare function MessageBubble({ role, children, className, unstyled }: MessageBubbleProps): react.JSX.Element;
+interface MessageContentProps {
+    children: React.ReactNode;
+    className?: string;
+    /**
+     * When the content is a plain string, render it as markdown (headings,
+     * lists, bold/italic, code, links) instead of raw text. Defaults to true.
+     * Set false for content that should be shown verbatim.
+     */
+    markdown?: boolean;
+}
+declare function MessageContent({ children, className, markdown, }: MessageContentProps): react.JSX.Element;
+interface MessageContainerProps {
+    role: MessageRole;
+    children: React.ReactNode;
+    className?: string;
+}
+declare function MessageContainer({ role, children, className }: MessageContainerProps): react.JSX.Element;
 
 interface AgentAvatarProps {
     role: MessageRole;
@@ -1090,7 +1137,7 @@ interface PromptInputProps {
     /** Input class */
     inputClassName?: string;
     /** Variant styling */
-    variant?: 'default' | 'minimal' | 'bordered';
+    variant?: "default" | "minimal" | "bordered";
     /**
      * Minimum number of visible text rows. Default 1 (grows as the user types).
      */
@@ -1316,6 +1363,11 @@ interface MessageListProps {
     renderMessage?: (message: AgentMessage) => React.ReactNode;
     /** Feedback handler passed to feedback-capable messages. */
     onFeedback?: (messageId: string, vote: 'up' | 'down') => void;
+    /**
+     * Invoked when an inline confirmation-panel action is activated. Receives the
+     * owning message id and the action id.
+     */
+    onConfirmAction?: (messageId: string, actionId: string) => void;
     className?: string;
 }
 /**
@@ -1324,7 +1376,7 @@ interface MessageListProps {
  * content, attachments, and any structured data payload. This is the default
  * conversation body shared by every surface.
  */
-declare function MessageList({ messages, showAvatars, renderMessage, className, }: MessageListProps): react.JSX.Element;
+declare function MessageList({ messages, showAvatars, renderMessage, onConfirmAction, className, }: MessageListProps): react.JSX.Element;
 
 interface PersonaSelectorProps {
     /** Available personas to choose from. */
@@ -1601,6 +1653,56 @@ interface SettingsPanelProps {
 }
 declare function SettingsPanel({ groups, onChange, className }: SettingsPanelProps): react.JSX.Element;
 
+interface ConfirmationAction {
+    id: string;
+    label: string;
+    /** Button variant; defaults to 'default' for the first action, 'outline' otherwise. */
+    variant?: ButtonProps['variant'];
+    /** Disable this action. */
+    disabled?: boolean;
+    /** Render a loading/busy state and disable the button. */
+    busy?: boolean;
+}
+interface ConfirmationPanelProps {
+    /** Panel heading, e.g. "Proposed plan". */
+    title?: string;
+    /**
+     * Short label shown beside the title (e.g. "0 pages to change"). Rendered as
+     * a badge so scope/summary metadata reads at a glance.
+     */
+    summary?: string;
+    /**
+     * The plan / confirmation body. When a string is passed it is rendered
+     * through the same markdown pipeline as assistant messages, so headings,
+     * paragraphs, and bullet/numbered lists keep their spacing and line breaks.
+     * Pass `markdown={false}` to render verbatim, or pass a node for custom body.
+     */
+    body?: React.ReactNode;
+    /**
+     * Render the string body as markdown. Defaults to true. Ignored for node
+     * bodies (which are rendered as-is).
+     */
+    markdown?: boolean;
+    /** Leading icon for the header. Defaults to a clipboard list icon. */
+    icon?: React.ReactNode;
+    /** Action buttons (confirm / cancel / regenerate, …). */
+    actions?: ConfirmationAction[];
+    /** Invoked with the action id when an action button is activated. */
+    onAction?: (id: string) => void;
+    /** Accessible label for the panel region. Defaults to the title. */
+    ariaLabel?: string;
+    className?: string;
+}
+/**
+ * An inline confirmation / proposed-plan / action panel.
+ *
+ * It is designed to flow inside the transcript like any other message — NOT to
+ * be pinned above the input — so it never covers the latest assistant response.
+ * The body reuses {@link MessageContent}, giving long plans the same markdown
+ * rendering, typography, and spacing as normal assistant messages.
+ */
+declare function ConfirmationPanel({ title, summary, body, markdown, icon, actions, onAction, ariaLabel, className, }: ConfirmationPanelProps): react.JSX.Element;
+
 /**
  * Lifecycle of an agent-to-agent handoff.
  *  - 'connecting' → the target agent is being brought online / routed to.
@@ -2543,6 +2645,12 @@ interface AgentSurfaceProps {
     renderMessage?: (message: AgentMessage) => ReactNode;
     /** Feedback handler passed to MessageList. */
     onFeedback?: (messageId: string, vote: 'up' | 'down') => void;
+    /**
+     * Handler for inline confirmation-panel actions. Receives the owning message
+     * id and the activated action id. Confirmation panels render inline in the
+     * transcript (via `message.confirmation`), never pinned over the response.
+     */
+    onConfirmAction?: (messageId: string, actionId: string) => void;
     /**
      * Structured report rendered in the data region. Used by the
      * dashboard/split surfaces (sidebar or data panel). If omitted, a custom
@@ -2582,6 +2690,6 @@ interface AgentSurfaceProps {
  *   - 'overlay'    → OverlayModal (centered modal conversation)
  *   - 'mobile'     → MobileShell (full-height mobile layout)
  */
-declare function AgentSurface({ mode, messages, isLoading, inputValue, onInputChange, onSubmit, inputPlaceholder, input, title, subtitle, icon, headerActions, suggestions, showAvatars, renderMessage, onFeedback, report, dataPanel, isOpen, onToggle, onClose, onExitFullscreen, position, status, className, }: AgentSurfaceProps): react.JSX.Element;
+declare function AgentSurface({ mode, messages, isLoading, inputValue, onInputChange, onSubmit, inputPlaceholder, input, title, subtitle, icon, headerActions, suggestions, showAvatars, renderMessage, onFeedback, onConfirmAction, report, dataPanel, isOpen, onToggle, onClose, onExitFullscreen, position, status, className, }: AgentSurfaceProps): react.JSX.Element;
 
-export { type AgendaItem, type AgendaItemAction, type AgendaItemState, type AgendaSlotOption, type AgentAction, type AgentAttachment, AgentAvatar, type AgentBackend, type AgentBlock, type AgentConfig, type AgentContextValue, type AgentEvent, type AgentEventType, type AgentFeatures, AgentHandoff, type AgentHandoffProps, type AgentMessage, type AgentPersona, AgentProvider, type AgentProviderProps, type AgentReport, type AgentState, type AgentStreamChunk, AgentSurface, type AgentSurfaceProps, AllocationBreakdown, type AllocationSegment, type AllocationSummaryStat, type AnalyticsBreakdownRow, AnalyticsDashboard, type AnalyticsDashboardProps, type AnalyticsDistributionSegment, type AnalyticsHighlight, type AnalyticsMetric, type AnalyticsRankedRow, type AnalyticsRecentItem, type AnalyticsTrend, type AssistantMessageBlocksEnvelope, type AssistantMessageCompleteEnvelope, type AssistantMessageDeltaEnvelope, type AssistantMessageStartEnvelope, type AssistantMessageThinkingDeltaEnvelope, type Attachment, type AttachmentKind, type AttachmentMediaType, type AttachmentType, Avatar, AvatarFallback, AvatarImage, Badge, type BlockUpdateMode, Button, ChartContainer, type ChartData, type ChartDataPoint, type ChartType, type ChatMessageRole, ChatPanel, Collapsible, CollapsibleContent, CollapsibleTrigger, type ComponentCapability, type ComponentCategory, type ComponentManifestEntry, type ComponentSlot, type ConnectionReadyEnvelope, type ConnectionState, ControlGrid, type ControlTile, type ControlTileType, ConversationAnalytics, ConversationArtifact, type ConversationArtifactProps, type ConversationHistoryItem, type DataPayload, DataPayloadView, DataTable, DynamicRenderer, type EditorAdjustment, type EditorTool, type EmotionScore, type EntityAction, EntityCard, type EntityCardData, type EntityField, type ErrorEnvelope, type ExecutionStep, type ExecutionStepStatus, type FeedbackCategory, type FeedbackSentiment, FileDropZone, FloatingWidget, FullBleedSurface, type FullBleedSurfaceProps, FullscreenDashboard, type GenerateReportOptions, GuidedLessonFlow, type HandoffAction, type HandoffAgent, type HandoffCandidate, type HandoffStatus, type HandoffVariant, ImageGenerator, type InlineSuggestion, InlineSuggestionsInput, Input, type LayoutConfig, type LayoutMode, type LessonStep, type LibraryPrompt, type Listing, type ListingAction, ListingFeed, type ListingField, type ManifestPropSpec, MediaEditorCanvas, MediaGallery, type MediaItem, type MediaKind, MessageActions, MessageBubble, type MessageFeedback, MessageList, type MessageListProps, type MessageMetadata, type MessageRole, MessageWithAttachments, MessageWithFeedback, MessageWithReasoning, MessageWithSteps, type MetricData, MetricsGrid, MobileShell, type MockBackendConfig, MultimodalInput, OnboardingWizard, type OptionCardItem, OptionCards, type OrchestrationCommand, OverlayModal, PerformanceMetrics, PersonaSelector, Progress, ProgressTracker, PromptInput, PromptLibrary, type PromptTemplate, QuickReplies, type QuickReply, QuizCard, type QuizOption, type QuizQuestion, type QuizResult, type ReasoningStatus, type ReasoningStep, type Recommendation, type RecommendationAction, RecommendationCards, type RecommendationTone, type RenderInstruction, type ReportSection, ReportView, ScheduleTimeline, ScrollArea, ScrollBar, type SemanticBuilderChatMessage, SemanticBuilderSocketClient, type SendMessageOptions, type SendOptions, SentimentDisplay, type SentimentScore, type ServerEnvelope, type SettingControl, type SettingsGroup, SettingsPanel, SlotRenderer, type SocketClientOptions, type SocketSendPayload, type SocketUrlResolver, SplitView, StatusBadge, SystemMessage, type TableColumn, type TableData, TemplateSelector, type TemplateVariable, Textarea, type ThemeConfig, Timestamp, type ToolCall, type ToolDefinition, type ToolResult, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type TrendDirection, type TrendTone, TypingIndicator, type UseSemanticBuilderOptions, type UseSemanticBuilderResult, type UserMessageEnvelope, type WidgetPosition, WritingAssistant, badgeVariants, buildSocketUrl, buttonVariants, calculatePercentage, cn, componentManifest, componentMap, componentRegistry, copyToClipboard, createMockBackend, debounce, delay, findComponentsByCapability, findComponentsByCategory, findComponentsBySurface, formatBytes, formatCurrency, formatNumber, formatRelativeTime, formatTime, generateId, getInitials, getManifestEntry, getSentimentBgColor, getSentimentColor, isBrowser, isInIframe, normalizeWebsiteId, parseTextWithBold, registerAllComponents, truncate, useAgent, useAgentBackend, useAgentInput, useAgentLayout, useAgentMessages, useSemanticBuilder };
+export { type AgendaItem, type AgendaItemAction, type AgendaItemState, type AgendaSlotOption, type AgentAction, type AgentAttachment, AgentAvatar, type AgentBackend, type AgentBlock, type AgentConfig, type AgentContextValue, type AgentEvent, type AgentEventType, type AgentFeatures, AgentHandoff, type AgentHandoffProps, type AgentMessage, type AgentPersona, AgentProvider, type AgentProviderProps, type AgentReport, type AgentState, type AgentStreamChunk, AgentSurface, type AgentSurfaceProps, AllocationBreakdown, type AllocationSegment, type AllocationSummaryStat, type AnalyticsBreakdownRow, AnalyticsDashboard, type AnalyticsDashboardProps, type AnalyticsDistributionSegment, type AnalyticsHighlight, type AnalyticsMetric, type AnalyticsRankedRow, type AnalyticsRecentItem, type AnalyticsTrend, type AssistantMessageBlocksEnvelope, type AssistantMessageCompleteEnvelope, type AssistantMessageDeltaEnvelope, type AssistantMessageStartEnvelope, type AssistantMessageThinkingDeltaEnvelope, type Attachment, type AttachmentKind, type AttachmentMediaType, type AttachmentType, Avatar, AvatarFallback, AvatarImage, Badge, type BlockUpdateMode, Button, ChartContainer, type ChartData, type ChartDataPoint, type ChartType, type ChatMessageRole, ChatPanel, Collapsible, CollapsibleContent, CollapsibleTrigger, type ComponentCapability, type ComponentCategory, type ComponentManifestEntry, type ComponentSlot, type ConfirmationAction, type ConfirmationActionData, type ConfirmationData, ConfirmationPanel, type ConfirmationPanelProps, type ConnectionReadyEnvelope, type ConnectionState, ControlGrid, type ControlTile, type ControlTileType, ConversationAnalytics, ConversationArtifact, type ConversationArtifactProps, type ConversationHistoryItem, type DataPayload, DataPayloadView, DataTable, DynamicRenderer, type EditorAdjustment, type EditorTool, type EmotionScore, type EntityAction, EntityCard, type EntityCardData, type EntityField, type ErrorEnvelope, type ExecutionStep, type ExecutionStepStatus, type FeedbackCategory, type FeedbackSentiment, FileDropZone, FloatingWidget, FullBleedSurface, type FullBleedSurfaceProps, FullscreenDashboard, type GenerateReportOptions, GuidedLessonFlow, type HandoffAction, type HandoffAgent, type HandoffCandidate, type HandoffStatus, type HandoffVariant, ImageGenerator, type InlineSuggestion, InlineSuggestionsInput, Input, type LayoutConfig, type LayoutMode, type LessonStep, type LibraryPrompt, type Listing, type ListingAction, ListingFeed, type ListingField, type ManifestPropSpec, MediaEditorCanvas, MediaGallery, type MediaItem, type MediaKind, MessageActions, MessageBubble, type MessageBubbleProps, MessageContainer, type MessageContainerProps, MessageContent, type MessageContentProps, type MessageFeedback, MessageList, type MessageListProps, type MessageMetadata, type MessageRole, MessageWithAttachments, MessageWithFeedback, MessageWithReasoning, MessageWithSteps, type MetricData, MetricsGrid, MobileShell, type MockBackendConfig, MultimodalInput, OnboardingWizard, type OptionCardItem, OptionCards, type OrchestrationCommand, OverlayModal, PerformanceMetrics, PersonaSelector, Progress, ProgressTracker, PromptInput, PromptLibrary, type PromptTemplate, QuickReplies, type QuickReply, QuizCard, type QuizOption, type QuizQuestion, type QuizResult, type ReasoningStatus, type ReasoningStep, type Recommendation, type RecommendationAction, RecommendationCards, type RecommendationTone, type RenderInstruction, type ReportSection, ReportView, ScheduleTimeline, ScrollArea, ScrollBar, type SemanticBuilderChatMessage, SemanticBuilderSocketClient, type SendMessageOptions, type SendOptions, SentimentDisplay, type SentimentScore, type ServerEnvelope, type SettingControl, type SettingsGroup, SettingsPanel, SlotRenderer, type SocketClientOptions, type SocketSendPayload, type SocketUrlResolver, SplitView, StatusBadge, SystemMessage, type TableColumn, type TableData, TemplateSelector, type TemplateVariable, Textarea, type ThemeConfig, Timestamp, type ToolCall, type ToolDefinition, type ToolResult, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, type TrendDirection, type TrendTone, TypingIndicator, type UseSemanticBuilderOptions, type UseSemanticBuilderResult, type UserMessageEnvelope, type WidgetPosition, WritingAssistant, badgeVariants, buildSocketUrl, buttonVariants, calculatePercentage, cn, componentManifest, componentMap, componentRegistry, copyToClipboard, createMockBackend, debounce, delay, findComponentsByCapability, findComponentsByCategory, findComponentsBySurface, formatBytes, formatCurrency, formatNumber, formatRelativeTime, formatTime, generateId, getInitials, getManifestEntry, getSentimentBgColor, getSentimentColor, isBrowser, isInIframe, normalizeWebsiteId, parseTextWithBold, registerAllComponents, truncate, useAgent, useAgentBackend, useAgentInput, useAgentLayout, useAgentMessages, useSemanticBuilder };

package/dist/index.js

@@ -6,7 +6,7 @@ import { createContext, forwardRef, useRef, useImperativeHandle, useCallback, us
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { AnimatePresence, motion } from 'motion/react';
 import { Markdown } from '@page-speed/markdown-to-jsx';
-import { SendIcon, PaperclipIcon, FileTextIcon, MicIcon, ImageIcon, XIcon, SearchIcon, UploadIcon, FileIcon, UserCircleIcon, CheckIcon, SparklesIcon, BookmarkIcon, InfoIcon, CheckCircle2Icon, AlertTriangleIcon, LightbulbIcon, BrainIcon, ChevronDownIcon, ZapIcon, CopyIcon, ThumbsUpIcon, ThumbsDownIcon, BotIcon, UserIcon, DownloadIcon, MinusIcon, TrendingDownIcon, TrendingUpIcon, ChevronUpIcon, ArrowUpDownIcon, LinkIcon, PlayIcon, ExternalLinkIcon, WandIcon, LayoutGridIcon, Grid3X3Icon, ArrowUpRightIcon, ShuffleIcon, SkipForwardIcon, ChevronLeftIcon, ChevronRightIcon, XCircleIcon, HelpCircleIcon, Minimize2Icon, Maximize2Icon, RotateCcwIcon, MessageSquareIcon, GripVerticalIcon, PanelLeftOpenIcon, PanelLeftCloseIcon, CheckCircleIcon, AlertCircleIcon, MoreHorizontalIcon, ArrowLeftIcon, MoreVerticalIcon, Loader2Icon, ArrowRightIcon, AlignLeftIcon, ListIcon, HashIcon, TypeIcon, ClockIcon, CoinsIcon, ActivityIcon, ArrowUpIcon, ArrowDownIcon } from 'lucide-react';
+import { SendIcon, PaperclipIcon, FileTextIcon, MicIcon, ImageIcon, XIcon, SearchIcon, UploadIcon, FileIcon, UserCircleIcon, CheckIcon, SparklesIcon, BookmarkIcon, InfoIcon, CheckCircle2Icon, AlertTriangleIcon, LightbulbIcon, BrainIcon, ChevronDownIcon, ZapIcon, CopyIcon, ThumbsUpIcon, ThumbsDownIcon, BotIcon, UserIcon, DownloadIcon, MinusIcon, TrendingDownIcon, TrendingUpIcon, ChevronUpIcon, ArrowUpDownIcon, LinkIcon, PlayIcon, ExternalLinkIcon, WandIcon, LayoutGridIcon, Grid3X3Icon, ArrowUpRightIcon, ShuffleIcon, SkipForwardIcon, ChevronLeftIcon, ChevronRightIcon, XCircleIcon, HelpCircleIcon, Minimize2Icon, Maximize2Icon, RotateCcwIcon, MessageSquareIcon, GripVerticalIcon, PanelLeftOpenIcon, PanelLeftCloseIcon, CheckCircleIcon, AlertCircleIcon, MoreHorizontalIcon, ClipboardListIcon, ArrowLeftIcon, MoreVerticalIcon, Loader2Icon, ArrowRightIcon, AlignLeftIcon, ListIcon, HashIcon, TypeIcon, ClockIcon, CoinsIcon, ActivityIcon, ArrowUpIcon, ArrowDownIcon } from 'lucide-react';
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
@@ -1212,7 +1212,7 @@ var PromptInput = forwardRef(
       [handleSubmit]
     );
     const variantStyles = {
-      default: "border-t px-3 py-2.5",
+      default: "px-3 py-2.5",
       minimal: "px-3 py-2",
       bordered: "border rounded-lg px-3 py-2.5"
     };
@@ -1221,41 +1221,48 @@ var PromptInput = forwardRef(
       minimal: "bg-transparent px-0",
       bordered: "bg-muted/50"
     };
-    return /* @__PURE__ */ jsx("form", { onSubmit: handleSubmit, className: cn(variantStyles[variant], className), children: /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-2", children: [
-      leftActions,
-      /* @__PURE__ */ jsx(
-        "textarea",
-        {
-          ref: textareaRef,
-          value,
-          onChange: (e) => onChange(e.target.value),
-          onKeyDown: handleKeyDown,
-          placeholder,
-          disabled: disabled || loading,
-          autoFocus,
-          rows: minRows,
-          className: cn(
-            "flex-1 resize-none border-0 px-0 py-1 text-sm leading-5 shadow-none",
-            "placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-0",
-            "disabled:cursor-not-allowed disabled:opacity-50",
-            inputVariantStyles[variant],
-            inputClassName
+    return /* @__PURE__ */ jsx(
+      "form",
+      {
+        onSubmit: handleSubmit,
+        className: cn(variantStyles[variant], className),
+        children: /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-2", children: [
+          leftActions,
+          /* @__PURE__ */ jsx(
+            "textarea",
+            {
+              ref: textareaRef,
+              value,
+              onChange: (e) => onChange(e.target.value),
+              onKeyDown: handleKeyDown,
+              placeholder,
+              disabled: disabled || loading,
+              autoFocus,
+              rows: minRows,
+              className: cn(
+                "flex-1 resize-none border-0 px-0 py-1 text-sm leading-5 shadow-none",
+                "placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-0",
+                "disabled:cursor-not-allowed disabled:opacity-50",
+                inputVariantStyles[variant],
+                inputClassName
+              )
+            }
+          ),
+          rightActions,
+          showSendButton && /* @__PURE__ */ jsx(
+            Button,
+            {
+              type: "submit",
+              size: "sm",
+              variant: variant === "minimal" ? "ghost" : "outline",
+              disabled: !value.trim() || disabled || loading,
+              className: "size-8 shrink-0 p-0",
+              children: sendButtonContent || /* @__PURE__ */ jsx(SendIcon, { className: "size-4" })
+            }
           )
-        }
-      ),
-      rightActions,
-      showSendButton && /* @__PURE__ */ jsx(
-        Button,
-        {
-          type: "submit",
-          size: "sm",
-          variant: variant === "minimal" ? "ghost" : "outline",
-          disabled: !value.trim() || disabled || loading,
-          className: "size-8 shrink-0 p-0",
-          children: sendButtonContent || /* @__PURE__ */ jsx(SendIcon, { className: "size-4" })
-        }
-      )
-    ] }) });
+        ] })
+      }
+    );
   }
 );
 PromptInput.displayName = "PromptInput";
@@ -7691,10 +7698,58 @@ function ReportView({ report, className }) {
     ))
   ] });
 }
+function ConfirmationPanel({
+  title = "Proposed plan",
+  summary,
+  body,
+  markdown = true,
+  icon,
+  actions,
+  onAction,
+  ariaLabel,
+  className
+}) {
+  const hasBody = body !== void 0 && body !== null && body !== "";
+  return /* @__PURE__ */ jsxs(
+    motion.section,
+    {
+      initial: { opacity: 0, y: 6 },
+      animate: { opacity: 1, y: 0 },
+      transition: { duration: 0.2 },
+      "aria-label": ariaLabel ?? title,
+      className: cn(
+        "flex w-full min-w-0 flex-col rounded-lg border bg-card p-4",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("header", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx("span", { className: "flex size-6 shrink-0 items-center justify-center rounded-md bg-muted/60 text-muted-foreground", children: icon ?? /* @__PURE__ */ jsx(ClipboardListIcon, { className: "size-3.5" }) }),
+          /* @__PURE__ */ jsx("h4", { className: "min-w-0 flex-1 truncate font-medium text-sm", children: title }),
+          summary && /* @__PURE__ */ jsx(Badge, { variant: "secondary", className: "shrink-0 text-[10px] font-normal", children: summary })
+        ] }),
+        hasBody && /* @__PURE__ */ jsx("div", { className: "mt-2 min-w-0", children: typeof body === "string" ? /* @__PURE__ */ jsx(MessageContent, { markdown, children: body }) : body }),
+        actions && actions.length > 0 && /* @__PURE__ */ jsx("div", { className: "mt-3 flex flex-wrap gap-2", children: actions.map((action, index) => /* @__PURE__ */ jsx(
+          Button,
+          {
+            type: "button",
+            size: "sm",
+            variant: action.variant ?? (index === 0 ? "default" : "outline"),
+            disabled: action.disabled || action.busy,
+            "aria-busy": action.busy || void 0,
+            onClick: () => onAction?.(action.id),
+            children: action.label
+          },
+          action.id
+        )) })
+      ]
+    }
+  );
+}
 function MessageList({
   messages,
   showAvatars = true,
   renderMessage,
+  onConfirmAction,
   className
 }) {
   return /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-4", className), children: messages.map((message) => {
@@ -7711,7 +7766,18 @@ function MessageList({
         hasSteps && /* @__PURE__ */ jsx(MessageWithSteps, { steps: message.steps }),
         message.content && /* @__PURE__ */ jsx(MessageBubble, { role: message.role, children: /* @__PURE__ */ jsx(MessageContent, { children: message.content }) }),
         hasAttachments && /* @__PURE__ */ jsx(MessageWithAttachments, { attachments: message.attachments }),
-        message.data && /* @__PURE__ */ jsx(DataPayloadView, { payload: message.data })
+        message.data && /* @__PURE__ */ jsx(DataPayloadView, { payload: message.data }),
+        message.confirmation && /* @__PURE__ */ jsx(
+          ConfirmationPanel,
+          {
+            title: message.confirmation.title,
+            summary: message.confirmation.summary,
+            body: message.confirmation.body,
+            markdown: message.confirmation.markdown,
+            actions: message.confirmation.actions,
+            onAction: (actionId) => onConfirmAction?.(message.id, actionId)
+          }
+        )
       ] })
     ] }, message.id);
   }) });
@@ -7932,6 +7998,7 @@ function AgentSurface({
   showAvatars = true,
   renderMessage,
   onFeedback,
+  onConfirmAction,
   report,
   dataPanel,
   isOpen = true,
@@ -7948,7 +8015,8 @@ function AgentSurface({
       messages,
       showAvatars,
       renderMessage,
-      onFeedback
+      onFeedback,
+      onConfirmAction
     }
   );
   const resolvedInput = input ?? (onInputChange && onSubmit !== void 0 ? /* @__PURE__ */ jsx("div", { className: "border-t p-2", children: /* @__PURE__ */ jsx(
@@ -8055,6 +8123,6 @@ function AgentSurface({
   }
 }
 
-export { AgentAvatar, AgentHandoff, AgentProvider, AgentSurface, AllocationBreakdown, AnalyticsDashboard, Avatar, AvatarFallback, AvatarImage, Badge, Button, ChartContainer, ChatPanel, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, ControlGrid, ConversationAnalytics, ConversationArtifact, DataPayloadView, DataTable, DynamicRenderer, EntityCard, FileDropZone, FloatingWidget, FullBleedSurface, FullscreenDashboard, GuidedLessonFlow, ImageGenerator, InlineSuggestionsInput, Input, ListingFeed, MediaEditorCanvas, MediaGallery, MessageActions, MessageBubble, MessageList, MessageWithAttachments, MessageWithFeedback, MessageWithReasoning, MessageWithSteps, MetricsGrid, MobileShell, MultimodalInput, OnboardingWizard, OptionCards, OverlayModal, PerformanceMetrics, PersonaSelector, Progress, ProgressTracker, PromptInput, PromptLibrary, QuickReplies, QuizCard, RecommendationCards, ReportView, ScheduleTimeline, ScrollArea, ScrollBar, SemanticBuilderSocketClient, SentimentDisplay, SettingsPanel, SlotRenderer, SplitView, StatusBadge, SystemMessage, TemplateSelector, Textarea, Timestamp, Tooltip4 as Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TypingIndicator, WritingAssistant, badgeVariants, buildSocketUrl, buttonVariants, calculatePercentage, cn, componentManifest, componentMap, componentRegistry, copyToClipboard, createMockBackend, debounce, delay, findComponentsByCapability, findComponentsByCategory, findComponentsBySurface, formatBytes, formatCurrency, formatNumber, formatRelativeTime, formatTime, generateId, getInitials, getManifestEntry, getSentimentBgColor, getSentimentColor, isBrowser, isInIframe, normalizeWebsiteId, parseTextWithBold, registerAllComponents, truncate, useAgent, useAgentBackend, useAgentInput, useAgentLayout, useAgentMessages, useSemanticBuilder };
+export { AgentAvatar, AgentHandoff, AgentProvider, AgentSurface, AllocationBreakdown, AnalyticsDashboard, Avatar, AvatarFallback, AvatarImage, Badge, Button, ChartContainer, ChatPanel, Collapsible, CollapsibleContent2 as CollapsibleContent, CollapsibleTrigger2 as CollapsibleTrigger, ConfirmationPanel, ControlGrid, ConversationAnalytics, ConversationArtifact, DataPayloadView, DataTable, DynamicRenderer, EntityCard, FileDropZone, FloatingWidget, FullBleedSurface, FullscreenDashboard, GuidedLessonFlow, ImageGenerator, InlineSuggestionsInput, Input, ListingFeed, MediaEditorCanvas, MediaGallery, MessageActions, MessageBubble, MessageContainer, MessageContent, MessageList, MessageWithAttachments, MessageWithFeedback, MessageWithReasoning, MessageWithSteps, MetricsGrid, MobileShell, MultimodalInput, OnboardingWizard, OptionCards, OverlayModal, PerformanceMetrics, PersonaSelector, Progress, ProgressTracker, PromptInput, PromptLibrary, QuickReplies, QuizCard, RecommendationCards, ReportView, ScheduleTimeline, ScrollArea, ScrollBar, SemanticBuilderSocketClient, SentimentDisplay, SettingsPanel, SlotRenderer, SplitView, StatusBadge, SystemMessage, TemplateSelector, Textarea, Timestamp, Tooltip4 as Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TypingIndicator, WritingAssistant, badgeVariants, buildSocketUrl, buttonVariants, calculatePercentage, cn, componentManifest, componentMap, componentRegistry, copyToClipboard, createMockBackend, debounce, delay, findComponentsByCapability, findComponentsByCategory, findComponentsBySurface, formatBytes, formatCurrency, formatNumber, formatRelativeTime, formatTime, generateId, getInitials, getManifestEntry, getSentimentBgColor, getSentimentColor, isBrowser, isInIframe, normalizeWebsiteId, parseTextWithBold, registerAllComponents, truncate, useAgent, useAgentBackend, useAgentInput, useAgentLayout, useAgentMessages, useSemanticBuilder };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map