@ensembleapp/client-sdk 0.0.47 → 0.0.49

package/dist/index.d.ts

@@ -178,6 +178,7 @@ interface ApiConfig {
 }
 /** Agent version selector: 'latest' (default), 'published', or a specific version number */
 type AgentVersion = 'latest' | 'published' | number;
+type StructuredMessagePayload = Record<string, unknown>;
 type UseChatConfig = DeprecatedChatConfig & {
     /** The server API configuration */
     api: ApiConfig;
@@ -200,6 +201,7 @@ declare function useChat({ api, threadId, agentId, agentVersion, agentExecutionI
     messages: ChatMessage[];
     status: ai.ChatStatus;
     isLoadingInitial: boolean;
+    canSendMessage: boolean;
     sendMessage: (message?: (Omit<UIMessage<unknown, ai.UIDataTypes, ai.UITools>, "id" | "role"> & {
         id?: string | undefined;
         role?: "user" | "assistant" | "system" | undefined;
@@ -219,6 +221,7 @@ declare function useChat({ api, threadId, agentId, agentVersion, agentExecutionI
         parts?: never;
         messageId?: string;
     } | undefined, options?: ai.ChatRequestOptions) => Promise<void>;
+    sendStructuredMessage: (text: string, payload: StructuredMessagePayload) => Promise<void>;
     stop: () => Promise<void>;
     setMessages: (messages: UIMessage<unknown, ai.UIDataTypes, ai.UITools>[] | ((messages: UIMessage<unknown, ai.UIDataTypes, ai.UITools>[]) => UIMessage<unknown, ai.UIDataTypes, ai.UITools>[])) => void;
     addToolOutput: <TOOL extends string>({ state, tool, toolCallId, output, errorText, }: {
@@ -310,6 +313,12 @@ interface WidgetRenderOptions {
     messageContext?: MessageContext;
     /** Function to invoke tools from within widgets (client-side enrichment) */
     invokeTool?: InvokeTool;
+    /** Whether the chat is ready for widget-triggered messages */
+    canSendMessage?: boolean;
+    /** Send a visible text message from within widgets */
+    sendMessage?: (text: string) => void | Promise<void>;
+    /** Send visible text plus structured JSON data from within widgets */
+    sendStructuredMessage?: (text: string, payload: Record<string, unknown>) => void | Promise<void>;
 }
 
 /** Enriched results keyed by enrichment name */
@@ -501,6 +510,8 @@ interface ChatWidgetFeedbackOptions {
 interface ChatWidgetHandle {
     /** Send a message programmatically */
     sendMessage: (message: string) => void;
+    /** Send visible text plus structured JSON data for the agent */
+    sendStructuredMessage: (message: string, payload: Record<string, unknown>) => void;
 }
 interface ChatWidgetConfig extends UseChatConfig {
     /** Title for the Chat window */
@@ -658,6 +669,12 @@ interface MessageRendererProps {
     feedback?: FeedbackConfig;
     /** Function to invoke tools from widgets (client-side enrichment) */
     invokeTool?: InvokeTool;
+    /** Whether the chat is ready for widget-triggered messages */
+    canSendMessage?: boolean;
+    /** Function to send a visible text message from widgets */
+    sendMessage?: (text: string) => void | Promise<void>;
+    /** Function to send visible text plus structured JSON data from widgets */
+    sendStructuredMessage?: (text: string, payload: Record<string, unknown>) => void | Promise<void>;
 }
 /**
  * MessageRenderer - renders message content with optional feedback UI.
@@ -665,7 +682,7 @@ interface MessageRendererProps {
  * Renders the content of a ChatMessage (text, tools, widgets, groups) and optionally
  * displays feedback buttons for assistant messages.
  */
-declare function MessageRenderer({ message, widgets, readonly, displayMode, tagExpansion, className, feedback, invokeTool, }: MessageRendererProps): react_jsx_runtime.JSX.Element;
+declare function MessageRenderer({ message, widgets, readonly, displayMode, tagExpansion, className, feedback, invokeTool, canSendMessage, sendMessage, sendStructuredMessage, }: MessageRendererProps): react_jsx_runtime.JSX.Element;
 
 interface DisplayModeProps {
     /** Message sections to render */
@@ -739,4 +756,4 @@ declare const getVendorCardsWidget: (isProd?: boolean) => SDKUIWidgetDefinition[
 
 declare function cn(...inputs: ClassValue[]): string;
 
-export { type AgentVersion, type AnyUIWidgetDefinition, type ApiConfig, type ApprovalUIConfig, BriefDisplayMode, BriefDisplayMode as BriefRenderer, type ChatMessage, type ChatMessageSection, ChatWidget, type ChatWidgetFeedbackOptions, type ChatWidgetHandle, type ChatWidgetConfig as ChatWidgetProps, type ChatWidgetSpeechToTextOptions, type ChatWidgetStyles, type ChatWidgetVoiceOptions, type CustomerReactDOM, type DisplayMode, type DisplayModeProps, type EmbeddableChatWidgetConfig, type EnrichedResults, type FeedbackConfig, type FeedbackHandlers, type FeedbackNote, type FeedbackRating, type FetchApprovalConfigOptions, FullDisplayMode, FullDisplayMode as FullRenderer, type InvokeTool, type MessageContext, type MessageFeedback, MessageRenderer, type MessageRendererProps, type PendingToolApproval, type PendingToolOutput, type PopupAnchorConfig, PopupChatWidget, type PopupChatWidgetProps, type DisplayModeProps as RendererProps, type SDKUIWidgetDefinition, SDK_WIDGET_MARKER, type SubmitFeedbackParams, TagGroupDisplay, type TagGroupDisplayProps, ToolCallDisplay, type ToolCallDisplayProps, type ToolInvokeRequest, type ToolInvokeResult, type ToolPart, type UIMessagePart, type UIWidgetDefinition, type UseChatConfig, type UseFeedbackConfig, type WidgetEnrichConfig, type WidgetRenderOptions, cn, createSDKWidget, createWidget, defaultChatWidgets, fetchApprovalConfig, getVendorCardsWidget, isSDKWidget, registerChatWidgets, transformMessage, useChat, useFeedback };
+export { type AgentVersion, type AnyUIWidgetDefinition, type ApiConfig, type ApprovalUIConfig, BriefDisplayMode, BriefDisplayMode as BriefRenderer, type ChatMessage, type ChatMessageSection, ChatWidget, type ChatWidgetFeedbackOptions, type ChatWidgetHandle, type ChatWidgetConfig as ChatWidgetProps, type ChatWidgetSpeechToTextOptions, type ChatWidgetStyles, type ChatWidgetVoiceOptions, type CustomerReactDOM, type DisplayMode, type DisplayModeProps, type EmbeddableChatWidgetConfig, type EnrichedResults, type FeedbackConfig, type FeedbackHandlers, type FeedbackNote, type FeedbackRating, type FetchApprovalConfigOptions, FullDisplayMode, FullDisplayMode as FullRenderer, type InvokeTool, type MessageContext, type MessageFeedback, MessageRenderer, type MessageRendererProps, type PendingToolApproval, type PendingToolOutput, type PopupAnchorConfig, PopupChatWidget, type PopupChatWidgetProps, type DisplayModeProps as RendererProps, type SDKUIWidgetDefinition, SDK_WIDGET_MARKER, type StructuredMessagePayload, type SubmitFeedbackParams, TagGroupDisplay, type TagGroupDisplayProps, ToolCallDisplay, type ToolCallDisplayProps, type ToolInvokeRequest, type ToolInvokeResult, type ToolPart, type UIMessagePart, type UIWidgetDefinition, type UseChatConfig, type UseFeedbackConfig, type WidgetEnrichConfig, type WidgetRenderOptions, cn, createSDKWidget, createWidget, defaultChatWidgets, fetchApprovalConfig, getVendorCardsWidget, isSDKWidget, registerChatWidgets, transformMessage, useChat, useFeedback };

package/dist/index.js

@@ -31,7 +31,7 @@ styleInject(':root[data-chat-widget],\n[data-chat-widget] {\n  --chat-primary: #
 
 // lib/chat/ChatWidget.tsx
 import { Send, StopCircle } from "lucide-react";
-import { forwardRef, useCallback as useCallback6, useEffect as useEffect6, useImperativeHandle, useMemo as useMemo5, useRef as useRef5, useState as useState9 } from "react";
+import { forwardRef, useCallback as useCallback7, useEffect as useEffect6, useImperativeHandle, useMemo as useMemo5, useRef as useRef5, useState as useState9 } from "react";
 
 // lib/api/fetchApprovalConfig.ts
 async function fetchApprovalConfig(options) {
@@ -21534,7 +21534,7 @@ function lastAssistantMessageIsCompleteWithToolCalls({
 }
 
 // lib/hooks/useChat.ts
-import { useEffect, useMemo, useRef, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 
 // lib/hooks/transform.ts
 function transformMessage(msg) {
@@ -21574,7 +21574,7 @@ function transformMessage(msg) {
       }
       return;
     }
-    if (part.type === "data-thoughts" || part.type === "data-transfer") {
+    if (part.type === "data-thoughts" || part.type === "data-transfer" || part.type === "data-structured-input") {
       return;
     }
     if (groupStack.length > 0) {
@@ -21694,6 +21694,22 @@ function useChat({
       onData?.(dataPart);
     }
   });
+  const sendStructuredMessage = useCallback(
+    async (text4, payload) => {
+      const trimmed = text4.trim();
+      if (!trimmed) return;
+      if (!payload || typeof payload !== "object" || Array.isArray(payload)) {
+        throw new Error("Structured message payload must be a JSON object");
+      }
+      await sendMessage({
+        parts: [
+          { type: "text", text: trimmed },
+          { type: "data-structured-input", data: payload }
+        ]
+      });
+    },
+    [sendMessage]
+  );
   const [isLoadingInitial, setIsLoadingInitial] = useState(true);
   useEffect(() => {
     const fetchInitialMessages = async () => {
@@ -21770,11 +21786,14 @@ function useChat({
     }
     return null;
   }, [messages]);
+  const canSendMessage = status === "ready" && !pendingToolOutput && !pendingToolApproval;
   return {
     messages: rtnMessages,
     status,
     isLoadingInitial,
+    canSendMessage,
     sendMessage,
+    sendStructuredMessage,
     stop,
     setMessages,
     addToolOutput,
@@ -21785,7 +21804,7 @@ function useChat({
 }
 
 // lib/hooks/useFeedback.ts
-import { useCallback, useState as useState2 } from "react";
+import { useCallback as useCallback2, useState as useState2 } from "react";
 function useFeedback({
   api,
   threadId,
@@ -21796,7 +21815,7 @@ function useFeedback({
   const [submittedFeedback, setSubmittedFeedback] = useState2({});
   const [isSubmitting, setIsSubmitting] = useState2(null);
   const [error48, setError] = useState2(null);
-  const submitFeedback = useCallback(
+  const submitFeedback = useCallback2(
     async (messageId, { rating, improvementText, notes }) => {
       setIsSubmitting(messageId);
       setError(null);
@@ -21852,13 +21871,13 @@ function useFeedback({
     },
     [baseUrl, token, threadId, agentId, agentVersion]
   );
-  const getFeedbackForMessage = useCallback(
+  const getFeedbackForMessage = useCallback2(
     (messageId) => {
       return submittedFeedback[messageId];
     },
     [submittedFeedback]
   );
-  const hasFeedback = useCallback(
+  const hasFeedback = useCallback2(
     (messageId) => {
       return messageId in submittedFeedback;
     },
@@ -21880,8 +21899,11 @@ function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
 
+// lib/chat/components/input-fields/InputFields.css
+styleInject(".input-field {\n  margin-bottom: 1rem;\n}\n.input-field__label {\n  display: block;\n  font-size: 0.875rem;\n  font-weight: 500;\n  color: var(--chat-assistant-text);\n  margin-bottom: 0.375rem;\n}\n.input-field__required {\n  color: var(--chat-error);\n  margin-left: 0.125rem;\n}\n.input-field__input,\n.input-field__textarea {\n  width: 100%;\n  padding: 0.5rem 0.75rem;\n  font-size: 0.875rem;\n  line-height: 1.5;\n  color: var(--chat-input-text);\n  background-color: var(--chat-input-bg);\n  border: 1px solid var(--chat-border);\n  border-radius: calc(var(--chat-radius) * 0.5);\n  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;\n  font-family: var(--chat-font-family);\n}\n.input-field__input:focus,\n.input-field__textarea:focus {\n  outline: none;\n  border-color: var(--chat-primary);\n  box-shadow: 0 0 0 3px var(--chat-primary-subtle);\n}\n.input-field__textarea {\n  resize: vertical;\n  min-height: 5rem;\n}\n.input-field__options {\n  display: flex;\n  flex-direction: column;\n  gap: 0.5rem;\n}\n.input-field__option {\n  display: flex;\n  align-items: flex-start;\n  gap: 0.5rem;\n  cursor: pointer;\n  padding: 0.5rem;\n  border-radius: calc(var(--chat-radius) * 0.5);\n  transition: background-color 0.15s ease-in-out;\n}\n.input-field__option:hover {\n  background-color: var(--chat-border);\n}\n.input-field__radio,\n.input-field__checkbox {\n  flex-shrink: 0;\n  margin-top: 0.125rem;\n  width: 1rem;\n  height: 1rem;\n  cursor: pointer;\n  accent-color: var(--chat-primary);\n}\n.input-field__option-content {\n  display: flex;\n  flex-direction: column;\n  gap: 0.125rem;\n}\n.input-field__option-label {\n  font-size: 0.875rem;\n  font-weight: 500;\n  color: var(--chat-assistant-text);\n}\n.input-field__option-description {\n  font-size: 0.75rem;\n  color: var(--chat-input-placeholder);\n}\n.input-field--checkbox .input-field__checkbox-wrapper {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  cursor: pointer;\n  padding: 0.5rem 0;\n}\n.input-field--checkbox .input-field__checkbox-label {\n  font-size: 0.875rem;\n  color: var(--chat-assistant-text);\n}\n.input-field--number .input-field__input {\n  -moz-appearance: textfield;\n}\n.input-field--number .input-field__input::-webkit-outer-spin-button,\n.input-field--number .input-field__input::-webkit-inner-spin-button {\n  -webkit-appearance: none;\n  margin: 0;\n}\n.input-field--date .input-field__input {\n  cursor: pointer;\n}\n");
+
 // lib/chat/components/InputFormOverlay.css
-styleInject('@import "./input-fields/InputFields.css";\n.input-form-overlay {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  top: 0;\n  z-index: 10;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-end;\n  pointer-events: none;\n}\n@keyframes slideUp {\n  from {\n    transform: translateY(100%);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}\n.input-form-overlay__content {\n  pointer-events: auto;\n  animation: slideUp 0.2s ease-out;\n  display: flex;\n  flex-direction: column;\n  background-color: var(--chat-background);\n  border-top: 1px solid var(--chat-border);\n  border-radius: var(--chat-radius) var(--chat-radius) 0 0;\n  box-shadow: var(--chat-shadow-sm);\n  max-height: 80%;\n  font-family: var(--chat-font-family);\n}\n.input-form-overlay__title {\n  font-size: 1rem;\n  font-weight: 600;\n  color: var(--chat-assistant-text);\n  margin: 0 0 0.375rem 0;\n}\n.input-form-overlay__description {\n  font-size: 0.8125rem;\n  color: var(--chat-input-placeholder);\n  margin: 0 0 1rem 0;\n  line-height: 1.4;\n}\n.input-form-overlay__form {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0;\n}\n.input-form-overlay__scrollable {\n  flex: 1;\n  overflow-y: auto;\n  min-height: 0;\n  padding: 1rem 1.25rem;\n}\n.input-form-overlay__fields {\n}\n.input-form-overlay__footer {\n  flex-shrink: 0;\n  padding: 0.5rem 1.25rem;\n  border-top: 1px solid var(--chat-border);\n}\n.input-form-overlay__actions {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  justify-content: flex-start;\n}\n.input-form-overlay__button {\n  padding: 0.5rem 1rem;\n  font-size: 0.875rem;\n  font-weight: 500;\n  border-radius: calc(var(--chat-radius) * 0.5);\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n  border: none;\n}\n.input-form-overlay__button:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.input-form-overlay__button--primary {\n  background-color: var(--chat-primary);\n  color: var(--chat-primary-text);\n}\n.input-form-overlay__button--primary:hover:not(:disabled) {\n  background-color: var(--chat-primary-hover);\n}\n.input-form-overlay__button--secondary {\n  background-color: var(--chat-border);\n  color: var(--chat-assistant-text);\n}\n.input-form-overlay__button--secondary:hover:not(:disabled) {\n  opacity: 0.8;\n}\n.input-form-overlay__freeform-toggle {\n  padding: 0.5rem 0;\n  font-size: 0.75rem;\n  color: var(--chat-input-placeholder);\n  background: none;\n  border: none;\n  cursor: pointer;\n  transition: color 0.15s ease-in-out;\n  white-space: nowrap;\n}\n.input-form-overlay__freeform-toggle:hover {\n  color: var(--chat-primary);\n  text-decoration: underline;\n}\n.input-form-overlay__freeform {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0;\n}\n.input-form-overlay__freeform-body {\n  padding: 1rem 1.25rem;\n}\n.input-form-overlay__freeform-input {\n  flex: 1;\n  width: 100%;\n  padding: 0.625rem;\n  font-size: var(--chat-font-size);\n  line-height: 1.4;\n  color: var(--chat-input-text);\n  background-color: var(--chat-input-bg);\n  border: 1px solid var(--chat-border);\n  border-radius: calc(var(--chat-radius) * 0.5);\n  resize: vertical;\n  min-height: 5rem;\n  font-family: var(--chat-font-family);\n}\n.input-form-overlay__freeform-input:focus {\n  outline: none;\n  border-color: var(--chat-primary);\n  box-shadow: 0 0 0 2px var(--chat-primary-subtle);\n}\n');
+styleInject(".input-form-overlay {\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  top: 0;\n  z-index: 10;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-end;\n  pointer-events: none;\n}\n@keyframes slideUp {\n  from {\n    transform: translateY(100%);\n    opacity: 0;\n  }\n  to {\n    transform: translateY(0);\n    opacity: 1;\n  }\n}\n.input-form-overlay__content {\n  pointer-events: auto;\n  animation: slideUp 0.2s ease-out;\n  display: flex;\n  flex-direction: column;\n  background-color: var(--chat-background);\n  border-top: 1px solid var(--chat-border);\n  border-radius: var(--chat-radius) var(--chat-radius) 0 0;\n  box-shadow: var(--chat-shadow-sm);\n  max-height: 80%;\n  font-family: var(--chat-font-family);\n}\n.input-form-overlay__title {\n  font-size: 1rem;\n  font-weight: 600;\n  color: var(--chat-assistant-text);\n  margin: 0 0 0.375rem 0;\n}\n.input-form-overlay__description {\n  font-size: 0.8125rem;\n  color: var(--chat-input-placeholder);\n  margin: 0 0 1rem 0;\n  line-height: 1.4;\n}\n.input-form-overlay__form {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0;\n}\n.input-form-overlay__scrollable {\n  flex: 1;\n  overflow-y: auto;\n  min-height: 0;\n  padding: 1rem 1.25rem;\n}\n.input-form-overlay__fields {\n}\n.input-form-overlay__footer {\n  flex-shrink: 0;\n  padding: 0.5rem 1.25rem;\n  border-top: 1px solid var(--chat-border);\n}\n.input-form-overlay__actions {\n  display: flex;\n  align-items: center;\n  gap: 0.5rem;\n  justify-content: flex-start;\n}\n.input-form-overlay__button {\n  padding: 0.5rem 1rem;\n  font-size: 0.875rem;\n  font-weight: 500;\n  border-radius: calc(var(--chat-radius) * 0.5);\n  cursor: pointer;\n  transition: all 0.15s ease-in-out;\n  border: none;\n}\n.input-form-overlay__button:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.input-form-overlay__button--primary {\n  background-color: var(--chat-primary);\n  color: var(--chat-primary-text);\n}\n.input-form-overlay__button--primary:hover:not(:disabled) {\n  background-color: var(--chat-primary-hover);\n}\n.input-form-overlay__button--secondary {\n  background-color: var(--chat-border);\n  color: var(--chat-assistant-text);\n}\n.input-form-overlay__button--secondary:hover:not(:disabled) {\n  opacity: 0.8;\n}\n.input-form-overlay__freeform-toggle {\n  padding: 0.5rem 0;\n  font-size: 0.75rem;\n  color: var(--chat-input-placeholder);\n  background: none;\n  border: none;\n  cursor: pointer;\n  transition: color 0.15s ease-in-out;\n  white-space: nowrap;\n}\n.input-form-overlay__freeform-toggle:hover {\n  color: var(--chat-primary);\n  text-decoration: underline;\n}\n.input-form-overlay__freeform {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0;\n}\n.input-form-overlay__freeform-body {\n  padding: 1rem 1.25rem;\n}\n.input-form-overlay__freeform-input {\n  flex: 1;\n  width: 100%;\n  padding: 0.625rem;\n  font-size: var(--chat-font-size);\n  line-height: 1.4;\n  color: var(--chat-input-text);\n  background-color: var(--chat-input-bg);\n  border: 1px solid var(--chat-border);\n  border-radius: calc(var(--chat-radius) * 0.5);\n  resize: vertical;\n  min-height: 5rem;\n  font-family: var(--chat-font-family);\n}\n.input-form-overlay__freeform-input:focus {\n  outline: none;\n  border-color: var(--chat-primary);\n  box-shadow: 0 0 0 2px var(--chat-primary-subtle);\n}\n");
 
 // lib/chat/components/InputFormOverlay.tsx
 import { useState as useState3 } from "react";
@@ -22244,7 +22266,7 @@ function InputFormOverlay({ args, onComplete }) {
 // lib/chat/components/SpeechToTextButton.tsx
 import { Mic, MicOff } from "lucide-react";
 import {
-  useCallback as useCallback2,
+  useCallback as useCallback3,
   useEffect as useEffect2,
   useRef as useRef2,
   useState as useState4
@@ -22279,25 +22301,25 @@ function SpeechToTextButton({
   const countdownFrameRef = useRef2(null);
   const countdownEndRef = useRef2(0);
   const recognitionLanguage = language ?? "en-US";
-  const clearSilenceTimer = useCallback2(() => {
+  const clearSilenceTimer = useCallback3(() => {
     if (silenceTimer.current) {
       clearTimeout(silenceTimer.current);
       silenceTimer.current = null;
     }
   }, []);
-  const clearCountdownFrame = useCallback2(() => {
+  const clearCountdownFrame = useCallback3(() => {
     if (countdownFrameRef.current) {
       cancelAnimationFrame(countdownFrameRef.current);
       countdownFrameRef.current = null;
     }
   }, []);
-  const clearFinalTimer = useCallback2(() => {
+  const clearFinalTimer = useCallback3(() => {
     if (finalTimer.current) {
       clearTimeout(finalTimer.current);
       finalTimer.current = null;
     }
   }, []);
-  const stopListening = useCallback2(() => {
+  const stopListening = useCallback3(() => {
     clearSilenceTimer();
     clearFinalTimer();
     clearCountdownFrame();
@@ -22306,26 +22328,26 @@ function SpeechToTextButton({
     countdownEndRef.current = 0;
     recognitionRef.current?.stop();
   }, [clearSilenceTimer, clearFinalTimer, clearCountdownFrame]);
-  const handleRecognitionError = useCallback2((message) => {
+  const handleRecognitionError = useCallback3((message) => {
     console.error("Speech recognition error:", message);
     onError?.(message);
   }, [onError]);
-  const resetSilenceTimer = useCallback2(() => {
+  const resetSilenceTimer = useCallback3(() => {
     if (!silenceTimeout) return;
     clearSilenceTimer();
     silenceTimer.current = setTimeout(stopListening, silenceTimeout);
   }, [silenceTimeout, clearSilenceTimer, stopListening]);
-  const dispatchInterim = useCallback2((text4) => {
+  const dispatchInterim = useCallback3((text4) => {
     if (text4) {
       onInterim?.(text4);
     }
   }, [onInterim]);
-  const dispatchFinal = useCallback2((text4) => {
+  const dispatchFinal = useCallback3((text4) => {
     if (text4) {
       onFinal?.(text4);
     }
   }, [onFinal]);
-  const flushFinalText = useCallback2(() => {
+  const flushFinalText = useCallback3(() => {
     const buffered = finalTextRef.current.trim();
     if (buffered) {
       dispatchFinal(buffered);
@@ -22333,7 +22355,7 @@ function SpeechToTextButton({
     finalTextRef.current = "";
     clearFinalTimer();
   }, [dispatchFinal, clearFinalTimer]);
-  const updateCountdown = useCallback2(() => {
+  const updateCountdown = useCallback3(() => {
     if (!countdownEndRef.current || !finalDelay) {
       setCountdown(0);
       setCountdownActive(false);
@@ -22350,7 +22372,7 @@ function SpeechToTextButton({
     }
     countdownFrameRef.current = requestAnimationFrame(updateCountdown);
   }, [finalDelay]);
-  const startCountdown = useCallback2(() => {
+  const startCountdown = useCallback3(() => {
     if (!finalDelay) {
       setCountdown(0);
       setCountdownActive(false);
@@ -22362,7 +22384,7 @@ function SpeechToTextButton({
     clearCountdownFrame();
     countdownFrameRef.current = requestAnimationFrame(updateCountdown);
   }, [finalDelay, clearCountdownFrame, updateCountdown]);
-  const scheduleFinalFlush = useCallback2(() => {
+  const scheduleFinalFlush = useCallback3(() => {
     clearFinalTimer();
     if (!finalDelay) {
       flushFinalText();
@@ -22371,7 +22393,7 @@ function SpeechToTextButton({
     startCountdown();
     finalTimer.current = setTimeout(flushFinalText, finalDelay);
   }, [clearFinalTimer, finalDelay, flushFinalText, startCountdown]);
-  const attachRecognitionHandlers = useCallback2((recognition) => {
+  const attachRecognitionHandlers = useCallback3((recognition) => {
     recognition.continuous = true;
     recognition.interimResults = true;
     recognition.lang = recognitionLanguage;
@@ -22429,7 +22451,7 @@ function SpeechToTextButton({
       }
     };
   }, [recognitionLanguage, resetSilenceTimer, startCountdown, dispatchInterim, scheduleFinalFlush, handleRecognitionError, onListeningChange, clearSilenceTimer, flushFinalText, countdownActive]);
-  const ensureRecognition = useCallback2(() => {
+  const ensureRecognition = useCallback3(() => {
     if (typeof window === "undefined") {
       return null;
     }
@@ -22444,7 +22466,7 @@ function SpeechToTextButton({
     attachRecognitionHandlers(recognitionRef.current);
     return recognitionRef.current;
   }, [attachRecognitionHandlers, handleRecognitionError]);
-  const toggleListening = useCallback2(() => {
+  const toggleListening = useCallback3(() => {
     if (disabled) {
       return;
     }
@@ -22608,7 +22630,7 @@ function ToolApprovalOverlay({ approval, config: config2, configLoading, onAppro
 }
 
 // lib/chat/display-modes/BriefDisplayMode.tsx
-import React2, { useCallback as useCallback3, useEffect as useEffect3, useMemo as useMemo2, useRef as useRef3, useState as useState6 } from "react";
+import React2, { useCallback as useCallback4, useEffect as useEffect3, useMemo as useMemo2, useRef as useRef3, useState as useState6 } from "react";
 import { Fragment as Fragment2, jsx as jsx10, jsxs as jsxs9 } from "react/jsx-runtime";
 function CollapsedDisplay({
   collapsed,
@@ -22627,7 +22649,7 @@ function CollapsedDisplay({
     }
     partsCountRef.current = collapsed.parts.length;
   }, [collapsed.parts.length, isExpanded]);
-  const handleToggle = useCallback3(() => {
+  const handleToggle = useCallback4(() => {
     setIsExpanded((prev) => !prev);
   }, []);
   const collapsedClasses = [
@@ -22798,7 +22820,7 @@ function FullDisplayMode({
 }
 
 // lib/chat/renderers/MessageRenderer.tsx
-import React5, { useCallback as useCallback5, useMemo as useMemo4 } from "react";
+import React5, { useCallback as useCallback6, useMemo as useMemo4 } from "react";
 import ReactMarkdown from "react-markdown";
 
 // ../../node_modules/.pnpm/ccount@2.0.1/node_modules/ccount/index.js
@@ -26265,7 +26287,7 @@ styleInject(".chat-widget__feedback {\n  display: flex;\n  align-items: center;\
 
 // lib/chat/components/MessageFeedback.tsx
 import { MessageSquare, MessageSquareText, ThumbsDown, ThumbsUp } from "lucide-react";
-import { useCallback as useCallback4, useEffect as useEffect4, useState as useState7 } from "react";
+import { useCallback as useCallback5, useEffect as useEffect4, useState as useState7 } from "react";
 import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
 var classNames = {
   wrapper: "chat-widget__feedback-wrapper",
@@ -26308,7 +26330,7 @@ var MessageFeedback = ({
       setCommentText(existingComment);
     }
   }, [existingRating, existingComment]);
-  const handlePositiveClick = useCallback4(() => {
+  const handlePositiveClick = useCallback5(() => {
     if (savedRating === "positive") {
       setSavedRating(null);
       setSavedComment("");
@@ -26321,7 +26343,7 @@ var MessageFeedback = ({
       onSubmit(messageId, { rating: "positive" });
     }
   }, [messageId, savedRating, onSubmit]);
-  const handleNegativeClick = useCallback4(() => {
+  const handleNegativeClick = useCallback5(() => {
     if (savedRating === "negative") {
       setSavedRating(null);
       setSavedComment("");
@@ -26337,7 +26359,7 @@ var MessageFeedback = ({
       onSubmit(messageId, { rating: "negative" });
     }
   }, [messageId, savedRating, requireCommentForNegative, onSubmit]);
-  const handleCommentToggle = useCallback4(() => {
+  const handleCommentToggle = useCallback5(() => {
     if (showCommentBox) {
       setShowCommentBox(false);
       if (pendingRating === "negative" && requireCommentForNegative) {
@@ -26348,14 +26370,14 @@ var MessageFeedback = ({
       setShowCommentBox(true);
     }
   }, [showCommentBox, pendingRating, requireCommentForNegative, savedComment]);
-  const handleCommentCancel = useCallback4(() => {
+  const handleCommentCancel = useCallback5(() => {
     setShowCommentBox(false);
     setCommentText(savedComment);
     if (pendingRating === "negative" && requireCommentForNegative) {
       setPendingRating(null);
     }
   }, [pendingRating, requireCommentForNegative, savedComment]);
-  const handleCommentSubmit = useCallback4(() => {
+  const handleCommentSubmit = useCallback5(() => {
     const ratingToSubmit = pendingRating ?? savedRating;
     if (ratingToSubmit === "negative" && requireCommentForNegative && !commentText.trim()) {
       return;
@@ -26609,7 +26631,16 @@ function renderError(container, message) {
   errorDiv.textContent = message;
   container.appendChild(errorDiv);
 }
-function WidgetRenderer({ widget, payload, enriched, messageContext, invokeTool }) {
+function WidgetRenderer({
+  widget,
+  payload,
+  enriched,
+  messageContext,
+  invokeTool,
+  canSendMessage,
+  sendMessage,
+  sendStructuredMessage
+}) {
   const containerRef = useRef4(null);
   const rootRef = useRef4(null);
   const pendingRootUnmountRef = useRef4(null);
@@ -26661,7 +26692,13 @@ function WidgetRenderer({ widget, payload, enriched, messageContext, invokeTool
       }
       let element;
       try {
-        element = widget.render(payload, enriched, { messageContext, invokeTool });
+        element = widget.render(payload, enriched, {
+          messageContext,
+          invokeTool,
+          canSendMessage,
+          sendMessage,
+          sendStructuredMessage
+        });
       } catch (error48) {
         console.error(`Widget "${widget.widgetType}" render function threw:`, error48);
         renderError(containerRef.current, `Widget render error: ${widget.widgetType}`);
@@ -26722,10 +26759,28 @@ To fix, add your ReactDOM to the widget config:
         renderError(containerRef.current, `Widget system error: ${widget.widgetType}`);
       }
     }
-  }, [isSdk, widget, payload, enriched, payloadHash, enrichedHash, messageContext, invokeTool]);
+  }, [
+    isSdk,
+    widget,
+    payload,
+    enriched,
+    payloadHash,
+    enrichedHash,
+    messageContext,
+    invokeTool,
+    canSendMessage,
+    sendMessage,
+    sendStructuredMessage
+  ]);
   if (isSdk) {
     try {
-      const element = widget.render(payload, enriched, { messageContext, invokeTool });
+      const element = widget.render(payload, enriched, {
+        messageContext,
+        invokeTool,
+        canSendMessage,
+        sendMessage,
+        sendStructuredMessage
+      });
       return /* @__PURE__ */ jsx15(Fragment4, { children: element });
     } catch (error48) {
       console.error(`SDK widget "${widget.widgetType}" render threw:`, error48);
@@ -26763,7 +26818,10 @@ function MessageRenderer({
   tagExpansion,
   className,
   feedback,
-  invokeTool
+  invokeTool,
+  canSendMessage,
+  sendMessage,
+  sendStructuredMessage
 }) {
   const messageContext = useMemo4(() => {
     if (!feedback) return void 0;
@@ -26777,7 +26835,7 @@ function MessageRenderer({
     () => feedback?.getFeedback() ?? null,
     [feedback]
   );
-  const renderPart = useCallback5(
+  const renderPart = useCallback6(
     (part, key) => {
       if (part == null) {
         return null;
@@ -26822,7 +26880,10 @@ function MessageRenderer({
                   payload: widget.payload,
                   enriched: widget.enriched ?? {},
                   messageContext: messageContext ?? void 0,
-                  invokeTool
+                  invokeTool,
+                  canSendMessage,
+                  sendMessage,
+                  sendStructuredMessage
                 }
               )
             },
@@ -26832,9 +26893,9 @@ function MessageRenderer({
       }
       return null;
     },
-    [widgets, readonly2, messageContext]
+    [widgets, readonly2, messageContext, invokeTool, canSendMessage, sendMessage, sendStructuredMessage]
   );
-  const renderGroup = useCallback5(
+  const renderGroup = useCallback6(
     (groupName, key, children) => {
       const isExpanded = tagExpansion?.state.get(key) ?? true;
       return /* @__PURE__ */ jsx16(
@@ -27084,11 +27145,14 @@ var ChatWidget = forwardRef(function ChatWidget2({
   const isAtBottomRef = useRef5(true);
   const textareaRef = useRef5(null);
   const suppressScrollRef = useRef5(false);
+  const hasScrolledInitialHistoryRef = useRef5(false);
   const {
     messages,
     status,
     isLoadingInitial,
+    canSendMessage,
     sendMessage,
+    sendStructuredMessage,
     stop,
     setMessages,
     addToolOutput,
@@ -27107,7 +27171,7 @@ var ChatWidget = forwardRef(function ChatWidget2({
     onFinish,
     onMessage
   });
-  const handleToolOutput = useCallback6((result) => {
+  const handleToolOutput = useCallback7((result) => {
     if (pendingToolOutput && addToolOutput) {
       addToolOutput({
         tool: "collect_user_input",
@@ -27116,7 +27180,7 @@ var ChatWidget = forwardRef(function ChatWidget2({
       });
     }
   }, [pendingToolOutput, addToolOutput]);
-  const handleToolApproval = useCallback6((approved, reason) => {
+  const handleToolApproval = useCallback7((approved, reason) => {
     if (!pendingToolApproval) return;
     addToolApprovalResponse({
       id: pendingToolApproval.approvalId,
@@ -27124,14 +27188,19 @@ var ChatWidget = forwardRef(function ChatWidget2({
       reason
     });
   }, [pendingToolApproval, addToolApprovalResponse]);
-  const isInputDisabled = status !== "ready" || !!pendingToolOutput || !!pendingToolApproval;
+  const isInputDisabled = !canSendMessage;
   useImperativeHandle(ref, () => ({
     sendMessage: (message) => {
       if (message.trim() && status === "ready") {
         sendMessage({ text: message });
       }
+    },
+    sendStructuredMessage: (message, payload) => {
+      if (message.trim() && status === "ready") {
+        void sendStructuredMessage(message, payload);
+      }
     }
-  }), [sendMessage, status]);
+  }), [sendMessage, sendStructuredMessage, status]);
   const feedbackEnabled = feedback?.enabled !== false;
   const {
     submitFeedback,
@@ -27173,7 +27242,7 @@ var ChatWidget = forwardRef(function ChatWidget2({
       setApprovalConfigLoading(false);
     });
   }, [pendingToolApproval, api, agentId, agentVersion, onAuthError]);
-  const handleTagToggle = useCallback6((messageId, tagId, currentlyExpanded) => {
+  const handleTagToggle = useCallback7((messageId, tagId, currentlyExpanded) => {
     suppressScrollRef.current = true;
     setTagExpansionState((prev) => {
       const next = new Map(prev);
@@ -27222,12 +27291,31 @@ var ChatWidget = forwardRef(function ChatWidget2({
       sendMessage({ text: initialUserMessage });
     }
   }, [initialUserMessage, isLoadingInitial, status, messages.length, sendMessage]);
-  const handleScroll = useCallback6(() => {
+  const handleScroll = useCallback7(() => {
     if (!scrollContainerRef.current) return;
     const { scrollTop, scrollHeight, clientHeight } = scrollContainerRef.current;
     const distanceToBottom = scrollHeight - scrollTop - clientHeight;
     isAtBottomRef.current = distanceToBottom < 100;
   }, []);
+  const scrollToBottom = useCallback7((behavior = "smooth") => {
+    if (!scrollContainerRef.current) return;
+    scrollContainerRef.current.scrollTo({
+      top: scrollContainerRef.current.scrollHeight,
+      behavior
+    });
+    isAtBottomRef.current = true;
+  }, []);
+  useEffect6(() => {
+    if (isLoadingInitial || hasScrolledInitialHistoryRef.current) return;
+    hasScrolledInitialHistoryRef.current = true;
+    scrollToBottom("auto");
+    const frameId = requestAnimationFrame(() => scrollToBottom("auto"));
+    const timeoutId = window.setTimeout(() => scrollToBottom("auto"), 100);
+    return () => {
+      cancelAnimationFrame(frameId);
+      window.clearTimeout(timeoutId);
+    };
+  }, [isLoadingInitial, scrollToBottom]);
   useEffect6(() => {
     if (suppressScrollRef.current) {
       suppressScrollRef.current = false;
@@ -27236,9 +27324,9 @@ var ChatWidget = forwardRef(function ChatWidget2({
     const lastMessage = messages[messages.length - 1];
     const isUserMessage = lastMessage?.role === "user";
     if (isAtBottomRef.current || isUserMessage) {
-      messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
+      scrollToBottom("smooth");
     }
-  }, [messages, status]);
+  }, [messages, status, scrollToBottom]);
   useEffect6(() => {
     const timer = setTimeout(() => {
       textareaRef.current?.focus();
@@ -27253,7 +27341,7 @@ var ChatWidget = forwardRef(function ChatWidget2({
       setIsSpeechPending(false);
     }
   }, [status]);
-  const sendText = useCallback6((raw) => {
+  const sendText = useCallback7((raw) => {
     const text4 = (raw ?? input).trim();
     if (!text4 || isInputDisabled) return false;
     sendMessage({ text: text4 });
@@ -27274,10 +27362,10 @@ var ChatWidget = forwardRef(function ChatWidget2({
     }
   };
   const speechEnabled = speechToText?.enabled !== false;
-  const handleSpeechInterim = useCallback6((text4) => {
+  const handleSpeechInterim = useCallback7((text4) => {
     setInput(text4);
   }, [setInput]);
-  const handleSpeechFinal = useCallback6((text4) => {
+  const handleSpeechFinal = useCallback7((text4) => {
     const finalText = text4?.trim();
     if (!finalText || isSpeechPending) return;
     setInput(finalText);
@@ -27354,7 +27442,18 @@ var ChatWidget = forwardRef(function ChatWidget2({
                               getFeedback: () => getFeedback(message.id),
                               submitFeedback: (params) => submitFeedback(message.id, params)
                             } : void 0,
-                            invokeTool
+                            invokeTool,
+                            canSendMessage,
+                            sendMessage: (text4) => {
+                              if (canSendMessage) {
+                                sendMessage({ text: text4 });
+                              }
+                            },
+                            sendStructuredMessage: (text4, payload) => {
+                              if (canSendMessage) {
+                                void sendStructuredMessage(text4, payload);
+                              }
+                            }
                           }
                         )
                       }