@usecrow/ui 0.1.43 → 0.1.45

package/dist/index.d.cts

@@ -198,65 +198,6 @@ interface WidgetConfigResponse {
     }>;
 }
 
-/** Identity data passed to the identify function */
-interface IdentifyData {
-    /** JWT token from your backend */
-    token: string;
-    /** User's display name */
-    name?: string;
-    /** Additional metadata */
-    [key: string]: unknown;
-}
-/** Function to identify a user */
-type IdentifyFunction = (data: IdentifyData) => void;
-/** Client-side tool handler */
-type ToolHandler = (args: Record<string, unknown>) => Promise<unknown> | unknown;
-/** Map of tool names to handlers */
-type ToolsMap = Record<string, ToolHandler>;
-interface CrowWidgetProps {
-    /** Product ID for this widget */
-    productId: string;
-    /** API URL (defaults to relative path) */
-    apiUrl?: string;
-    /** Widget variant: floating (with bubble) or embedded (for preview) */
-    variant?: "floating" | "embedded";
-    /** Custom styles to override DB and default styles */
-    styles?: Partial<WidgetStyleConfig>;
-    /** Skip fetching styles from API (use for preview mode with local state) */
-    previewMode?: boolean;
-    /** Whether to show AI thinking/reasoning to users (overrides API setting if provided) */
-    showThinking?: boolean;
-    /** Custom agent name shown in header (overrides API setting if provided) */
-    agentName?: string;
-    /** Custom welcome message (overrides API setting if provided) */
-    welcomeMessage?: string;
-    /** Callback when widget is ready */
-    onReady?: () => void;
-    /**
-     * Callback to identify the user. Called with an identify function
-     * that you should call with the user's token when available.
-     */
-    onIdentify?: (identify: IdentifyFunction) => void;
-    /** Client-side tools the agent can call */
-    tools?: ToolsMap;
-    /** Custom navigation function for SPA-safe page navigation (e.g. router.push from Next.js or React Router) */
-    navigate?: (path: string) => void;
-    /** Callback fired when a server-side tool completes, with the tool name and full result data */
-    onToolResult?: (toolName: string, result: Record<string, unknown>) => void;
-    /**
-     * Async function that returns a JWT for user identity verification.
-     * Called on mount and automatically on 401 (token refresh).
-     * Preferred over onIdentify for simpler integration.
-     */
-    getIdentityToken?: () => Promise<string>;
-    /**
-     * Page context data sent with every message. Reactive — updates whenever
-     * the object reference changes. Replaces window.crow('setContext', ...).
-     */
-    context?: Record<string, unknown>;
-}
-declare function CrowWidget({ productId, apiUrl, variant, styles: propStyles, previewMode, showThinking: showThinkingProp, agentName: agentNameProp, welcomeMessage: welcomeMessageProp, onReady, onIdentify, tools, navigate, onToolResult, getIdentityToken, context, }: CrowWidgetProps): react_jsx_runtime.JSX.Element;
-
 /**
  * Shared TypeScript interfaces for the widget and copilot
  */
@@ -300,14 +241,18 @@ interface ToolCall {
     timestamp: Date;
 }
 /**
- * Map of tool name → custom React renderer.
- * When a tool completes and a renderer exists for its name,
- * the widget renders that component inline instead of the default status.
+ * Map of tool name → custom renderer for inline tool results.
+ *
+ * Return types:
+ * - ReactNode (React SDK) — rendered directly
+ * - string (script tag) — sanitized HTML rendered via innerHTML
+ * - HTMLElement (script tag) — mounted into a container (for Chart.js, D3, etc.)
  */
+type ToolRendererResult = ReactNode | string | HTMLElement;
 type ToolRenderers = Record<string, (props: {
     result: unknown;
     status: string;
-}) => ReactNode>;
+}) => ToolRendererResult>;
 interface WorkflowTodo {
     id: string;
     text: string;
@@ -359,9 +304,76 @@ declare global {
         __crow_journey_callback?: (event: JourneyEvent) => void;
         __crow_client_tools?: Record<string, ClientToolHandler>;
         __crow_page_context?: Record<string, unknown>;
+        __crow_identity_token_fetcher?: () => Promise<string>;
+        __crow_on_tool_result?: (toolName: string, result: Record<string, unknown>) => void;
+        __crow_tool_renderers?: ToolRenderers;
     }
 }
 
+/** Identity data passed to the identify function */
+interface IdentifyData {
+    /** JWT token from your backend */
+    token: string;
+    /** User's display name */
+    name?: string;
+    /** Additional metadata */
+    [key: string]: unknown;
+}
+/** Function to identify a user */
+type IdentifyFunction = (data: IdentifyData) => void;
+/** Client-side tool handler */
+type ToolHandler = (args: Record<string, unknown>) => Promise<unknown> | unknown;
+/** Map of tool names to handlers */
+type ToolsMap = Record<string, ToolHandler>;
+interface CrowWidgetProps {
+    /** Product ID for this widget */
+    productId: string;
+    /** API URL (defaults to relative path) */
+    apiUrl?: string;
+    /** Widget variant: floating (with bubble) or embedded (for preview) */
+    variant?: "floating" | "embedded";
+    /** Custom styles to override DB and default styles */
+    styles?: Partial<WidgetStyleConfig>;
+    /** Skip fetching styles from API (use for preview mode with local state) */
+    previewMode?: boolean;
+    /** Whether to show AI thinking/reasoning to users (overrides API setting if provided) */
+    showThinking?: boolean;
+    /** Custom agent name shown in header (overrides API setting if provided) */
+    agentName?: string;
+    /** Custom welcome message (overrides API setting if provided) */
+    welcomeMessage?: string;
+    /** Callback when widget is ready */
+    onReady?: () => void;
+    /**
+     * Callback to identify the user. Called with an identify function
+     * that you should call with the user's token when available.
+     */
+    onIdentify?: (identify: IdentifyFunction) => void;
+    /** Client-side tools the agent can call */
+    tools?: ToolsMap;
+    /** Custom navigation function for SPA-safe page navigation (e.g. router.push from Next.js or React Router) */
+    navigate?: (path: string) => void;
+    /** Callback fired when a server-side tool completes, with the tool name and full result data */
+    onToolResult?: (toolName: string, result: Record<string, unknown>) => void;
+    /**
+     * Async function that returns a JWT for user identity verification.
+     * Called on mount and automatically on 401 (token refresh).
+     * Preferred over onIdentify for simpler integration.
+     */
+    getIdentityToken?: () => Promise<string>;
+    /**
+     * Page context data sent with every message. Reactive — updates whenever
+     * the object reference changes. Replaces window.crow('setContext', ...).
+     */
+    context?: Record<string, unknown>;
+    /**
+     * Custom renderers for tool results. When a tool completes and a renderer
+     * exists for its name, that component is rendered inline in the chat.
+     */
+    toolRenderers?: ToolRenderers;
+}
+declare function CrowWidget({ productId, apiUrl, variant, styles: propStyles, previewMode, showThinking: showThinkingProp, agentName: agentNameProp, welcomeMessage: welcomeMessageProp, onReady, onIdentify, tools, navigate, onToolResult, getIdentityToken, context, toolRenderers, }: CrowWidgetProps): react_jsx_runtime.JSX.Element;
+
 interface CrowCopilotProps {
     /** Product ID for this copilot */
     productId: string;
@@ -1063,13 +1075,24 @@ declare function WidgetHeader({ isVerifiedUser, showConversationList, onNewChat,
 
 /**
  * CopilotToggleButton - Edge toggle button for floating copilot
+ *
+ * Supports dual interaction:
+ * - Click: toggle sidebar open/close
+ * - Drag: resize sidebar width (when open)
+ *
+ * Forwards ref to the <button> so CopilotContainer can directly
+ * manipulate its style.transition during drag for zero-lag resizing.
  */
 interface CopilotToggleButtonProps {
     isOpen: boolean;
     position: "left" | "right";
     onClick: () => void;
+    /** Called on mousedown to initiate potential drag-to-resize */
+    onMouseDown?: (e: React.MouseEvent) => void;
+    /** Whether the user is actively dragging to resize */
+    isDragging?: boolean;
 }
-declare function CopilotToggleButton({ isOpen, position, onClick, }: CopilotToggleButtonProps): react_jsx_runtime.JSX.Element;
+declare const CopilotToggleButton: react.ForwardRefExoticComponent<CopilotToggleButtonProps & react.RefAttributes<HTMLButtonElement>>;
 
 interface CopilotContainerProps {
     position: "left" | "right";
@@ -1077,8 +1100,9 @@ interface CopilotContainerProps {
     defaultOpen: boolean;
     children: (controls: {
         close: () => void;
+        currentWidth: number;
     }) => ReactNode;
 }
-declare function CopilotContainer({ position, width, defaultOpen, children, }: CopilotContainerProps): react_jsx_runtime.JSX.Element;
+declare function CopilotContainer({ position, width: initialWidth, defaultOpen, children, }: CopilotContainerProps): react_jsx_runtime.JSX.Element;
 
 export { AVAILABLE_MODELS, type ActiveWorkflow, type AnimationsConfig, CSS_VAR_NAMES, ChatBubble, type Citation, type ClientToolHandler, type ColorsConfig, type Conversation, ConversationList, type CopilotBrandingConfig, CopilotContainer, type CopilotDimensionsConfig, type CopilotPositionConfig, type CopilotStyleConfig, CopilotStyleProvider, CopilotToggleButton, CrowCopilot, type CrowCopilotProps, CrowProvider, CrowWidget, type CrowWidgetProps, DEFAULT_COPILOT_STYLES, DEFAULT_MODEL, DEFAULT_WELCOME_MESSAGE, DEFAULT_WIDGET_STYLES, type IdentifyData, type IdentifyFunction, type JourneyEvent, LoadingHistory, MESSAGES_CONTAINER_ID, type Message, MessageBubble, MessageList, MessagesContainer, type Model, ModelSelector, PoweredByBadge, PromptInputBox, ReasoningTrace, type ResolvedCopilotStyles, type ResolvedWidgetStyles, ShadowContainer, StreamingText, ThinkingIndicator, type ToolCall, type ToolHandler, type ToolRenderers, type ToolsMap, type TypographyConfig, WIDGET_CSS, type WidgetBrandingConfig, type WidgetBubbleConfig, type WidgetConfigResponse, type WidgetDimensionsConfig, WidgetHeader, type WidgetPositionConfig, type WidgetProps, type WidgetShadowsConfig, WidgetShell, type WidgetStyleConfig, WidgetStyleProvider, WorkflowPanel, type WorkflowTodo, clearStyleCache, getCssVar, injectStyles, mergeCopilotStyles, mergeWidgetStyles, stylesToCSSVariables, stylesToCssVars, useChat, useConversations, useCopilotStyleContext, useCopilotStyles$1 as useCopilotStyles, useCopilotStyles as useCopilotStylesContext, useCrowAPI, usePreviewCopilotStyles, usePreviewWidgetStyles, useWidgetStyleContext, useWidgetStyles$1 as useWidgetStyles, useWidgetStyles as useWidgetStylesContext, useWorkflow };

package/dist/index.d.ts

@@ -198,65 +198,6 @@ interface WidgetConfigResponse {
     }>;
 }
 
-/** Identity data passed to the identify function */
-interface IdentifyData {
-    /** JWT token from your backend */
-    token: string;
-    /** User's display name */
-    name?: string;
-    /** Additional metadata */
-    [key: string]: unknown;
-}
-/** Function to identify a user */
-type IdentifyFunction = (data: IdentifyData) => void;
-/** Client-side tool handler */
-type ToolHandler = (args: Record<string, unknown>) => Promise<unknown> | unknown;
-/** Map of tool names to handlers */
-type ToolsMap = Record<string, ToolHandler>;
-interface CrowWidgetProps {
-    /** Product ID for this widget */
-    productId: string;
-    /** API URL (defaults to relative path) */
-    apiUrl?: string;
-    /** Widget variant: floating (with bubble) or embedded (for preview) */
-    variant?: "floating" | "embedded";
-    /** Custom styles to override DB and default styles */
-    styles?: Partial<WidgetStyleConfig>;
-    /** Skip fetching styles from API (use for preview mode with local state) */
-    previewMode?: boolean;
-    /** Whether to show AI thinking/reasoning to users (overrides API setting if provided) */
-    showThinking?: boolean;
-    /** Custom agent name shown in header (overrides API setting if provided) */
-    agentName?: string;
-    /** Custom welcome message (overrides API setting if provided) */
-    welcomeMessage?: string;
-    /** Callback when widget is ready */
-    onReady?: () => void;
-    /**
-     * Callback to identify the user. Called with an identify function
-     * that you should call with the user's token when available.
-     */
-    onIdentify?: (identify: IdentifyFunction) => void;
-    /** Client-side tools the agent can call */
-    tools?: ToolsMap;
-    /** Custom navigation function for SPA-safe page navigation (e.g. router.push from Next.js or React Router) */
-    navigate?: (path: string) => void;
-    /** Callback fired when a server-side tool completes, with the tool name and full result data */
-    onToolResult?: (toolName: string, result: Record<string, unknown>) => void;
-    /**
-     * Async function that returns a JWT for user identity verification.
-     * Called on mount and automatically on 401 (token refresh).
-     * Preferred over onIdentify for simpler integration.
-     */
-    getIdentityToken?: () => Promise<string>;
-    /**
-     * Page context data sent with every message. Reactive — updates whenever
-     * the object reference changes. Replaces window.crow('setContext', ...).
-     */
-    context?: Record<string, unknown>;
-}
-declare function CrowWidget({ productId, apiUrl, variant, styles: propStyles, previewMode, showThinking: showThinkingProp, agentName: agentNameProp, welcomeMessage: welcomeMessageProp, onReady, onIdentify, tools, navigate, onToolResult, getIdentityToken, context, }: CrowWidgetProps): react_jsx_runtime.JSX.Element;
-
 /**
  * Shared TypeScript interfaces for the widget and copilot
  */
@@ -300,14 +241,18 @@ interface ToolCall {
     timestamp: Date;
 }
 /**
- * Map of tool name → custom React renderer.
- * When a tool completes and a renderer exists for its name,
- * the widget renders that component inline instead of the default status.
+ * Map of tool name → custom renderer for inline tool results.
+ *
+ * Return types:
+ * - ReactNode (React SDK) — rendered directly
+ * - string (script tag) — sanitized HTML rendered via innerHTML
+ * - HTMLElement (script tag) — mounted into a container (for Chart.js, D3, etc.)
  */
+type ToolRendererResult = ReactNode | string | HTMLElement;
 type ToolRenderers = Record<string, (props: {
     result: unknown;
     status: string;
-}) => ReactNode>;
+}) => ToolRendererResult>;
 interface WorkflowTodo {
     id: string;
     text: string;
@@ -359,9 +304,76 @@ declare global {
         __crow_journey_callback?: (event: JourneyEvent) => void;
         __crow_client_tools?: Record<string, ClientToolHandler>;
         __crow_page_context?: Record<string, unknown>;
+        __crow_identity_token_fetcher?: () => Promise<string>;
+        __crow_on_tool_result?: (toolName: string, result: Record<string, unknown>) => void;
+        __crow_tool_renderers?: ToolRenderers;
     }
 }
 
+/** Identity data passed to the identify function */
+interface IdentifyData {
+    /** JWT token from your backend */
+    token: string;
+    /** User's display name */
+    name?: string;
+    /** Additional metadata */
+    [key: string]: unknown;
+}
+/** Function to identify a user */
+type IdentifyFunction = (data: IdentifyData) => void;
+/** Client-side tool handler */
+type ToolHandler = (args: Record<string, unknown>) => Promise<unknown> | unknown;
+/** Map of tool names to handlers */
+type ToolsMap = Record<string, ToolHandler>;
+interface CrowWidgetProps {
+    /** Product ID for this widget */
+    productId: string;
+    /** API URL (defaults to relative path) */
+    apiUrl?: string;
+    /** Widget variant: floating (with bubble) or embedded (for preview) */
+    variant?: "floating" | "embedded";
+    /** Custom styles to override DB and default styles */
+    styles?: Partial<WidgetStyleConfig>;
+    /** Skip fetching styles from API (use for preview mode with local state) */
+    previewMode?: boolean;
+    /** Whether to show AI thinking/reasoning to users (overrides API setting if provided) */
+    showThinking?: boolean;
+    /** Custom agent name shown in header (overrides API setting if provided) */
+    agentName?: string;
+    /** Custom welcome message (overrides API setting if provided) */
+    welcomeMessage?: string;
+    /** Callback when widget is ready */
+    onReady?: () => void;
+    /**
+     * Callback to identify the user. Called with an identify function
+     * that you should call with the user's token when available.
+     */
+    onIdentify?: (identify: IdentifyFunction) => void;
+    /** Client-side tools the agent can call */
+    tools?: ToolsMap;
+    /** Custom navigation function for SPA-safe page navigation (e.g. router.push from Next.js or React Router) */
+    navigate?: (path: string) => void;
+    /** Callback fired when a server-side tool completes, with the tool name and full result data */
+    onToolResult?: (toolName: string, result: Record<string, unknown>) => void;
+    /**
+     * Async function that returns a JWT for user identity verification.
+     * Called on mount and automatically on 401 (token refresh).
+     * Preferred over onIdentify for simpler integration.
+     */
+    getIdentityToken?: () => Promise<string>;
+    /**
+     * Page context data sent with every message. Reactive — updates whenever
+     * the object reference changes. Replaces window.crow('setContext', ...).
+     */
+    context?: Record<string, unknown>;
+    /**
+     * Custom renderers for tool results. When a tool completes and a renderer
+     * exists for its name, that component is rendered inline in the chat.
+     */
+    toolRenderers?: ToolRenderers;
+}
+declare function CrowWidget({ productId, apiUrl, variant, styles: propStyles, previewMode, showThinking: showThinkingProp, agentName: agentNameProp, welcomeMessage: welcomeMessageProp, onReady, onIdentify, tools, navigate, onToolResult, getIdentityToken, context, toolRenderers, }: CrowWidgetProps): react_jsx_runtime.JSX.Element;
+
 interface CrowCopilotProps {
     /** Product ID for this copilot */
     productId: string;
@@ -1063,13 +1075,24 @@ declare function WidgetHeader({ isVerifiedUser, showConversationList, onNewChat,
 
 /**
  * CopilotToggleButton - Edge toggle button for floating copilot
+ *
+ * Supports dual interaction:
+ * - Click: toggle sidebar open/close
+ * - Drag: resize sidebar width (when open)
+ *
+ * Forwards ref to the <button> so CopilotContainer can directly
+ * manipulate its style.transition during drag for zero-lag resizing.
  */
 interface CopilotToggleButtonProps {
     isOpen: boolean;
     position: "left" | "right";
     onClick: () => void;
+    /** Called on mousedown to initiate potential drag-to-resize */
+    onMouseDown?: (e: React.MouseEvent) => void;
+    /** Whether the user is actively dragging to resize */
+    isDragging?: boolean;
 }
-declare function CopilotToggleButton({ isOpen, position, onClick, }: CopilotToggleButtonProps): react_jsx_runtime.JSX.Element;
+declare const CopilotToggleButton: react.ForwardRefExoticComponent<CopilotToggleButtonProps & react.RefAttributes<HTMLButtonElement>>;
 
 interface CopilotContainerProps {
     position: "left" | "right";
@@ -1077,8 +1100,9 @@ interface CopilotContainerProps {
     defaultOpen: boolean;
     children: (controls: {
         close: () => void;
+        currentWidth: number;
     }) => ReactNode;
 }
-declare function CopilotContainer({ position, width, defaultOpen, children, }: CopilotContainerProps): react_jsx_runtime.JSX.Element;
+declare function CopilotContainer({ position, width: initialWidth, defaultOpen, children, }: CopilotContainerProps): react_jsx_runtime.JSX.Element;
 
 export { AVAILABLE_MODELS, type ActiveWorkflow, type AnimationsConfig, CSS_VAR_NAMES, ChatBubble, type Citation, type ClientToolHandler, type ColorsConfig, type Conversation, ConversationList, type CopilotBrandingConfig, CopilotContainer, type CopilotDimensionsConfig, type CopilotPositionConfig, type CopilotStyleConfig, CopilotStyleProvider, CopilotToggleButton, CrowCopilot, type CrowCopilotProps, CrowProvider, CrowWidget, type CrowWidgetProps, DEFAULT_COPILOT_STYLES, DEFAULT_MODEL, DEFAULT_WELCOME_MESSAGE, DEFAULT_WIDGET_STYLES, type IdentifyData, type IdentifyFunction, type JourneyEvent, LoadingHistory, MESSAGES_CONTAINER_ID, type Message, MessageBubble, MessageList, MessagesContainer, type Model, ModelSelector, PoweredByBadge, PromptInputBox, ReasoningTrace, type ResolvedCopilotStyles, type ResolvedWidgetStyles, ShadowContainer, StreamingText, ThinkingIndicator, type ToolCall, type ToolHandler, type ToolRenderers, type ToolsMap, type TypographyConfig, WIDGET_CSS, type WidgetBrandingConfig, type WidgetBubbleConfig, type WidgetConfigResponse, type WidgetDimensionsConfig, WidgetHeader, type WidgetPositionConfig, type WidgetProps, type WidgetShadowsConfig, WidgetShell, type WidgetStyleConfig, WidgetStyleProvider, WorkflowPanel, type WorkflowTodo, clearStyleCache, getCssVar, injectStyles, mergeCopilotStyles, mergeWidgetStyles, stylesToCSSVariables, stylesToCssVars, useChat, useConversations, useCopilotStyleContext, useCopilotStyles$1 as useCopilotStyles, useCopilotStyles as useCopilotStylesContext, useCrowAPI, usePreviewCopilotStyles, usePreviewWidgetStyles, useWidgetStyleContext, useWidgetStyles$1 as useWidgetStyles, useWidgetStyles as useWidgetStylesContext, useWorkflow };