@ensembleapp/client-sdk 0.0.13 → 0.0.15

package/dist/index.d.ts

@@ -5,42 +5,43 @@ import React$1, { ReactNode } from 'react';
 import z, { AnyZodObject } from 'zod';
 import { ClassValue } from 'clsx';
 
-/**
- * Version selector for tools. This should mirror VersionSelector on server-side
- * - 'latest': prefer draft (v0), fallback to last published
- * - 'published': prefer last published, fallback to draft
- * - number: specific version (1+)
- */
+/** @minimum 1 */
 type VersionSelector = 'latest' | 'published' | number;
 /**
- * Configuration for enriching widget data server-side by calling a tool.
- * Uses JEXL expressions to build tool inputs from the widget payload.
+ * fetch data via tool call.
  */
-type WidgetEnrichConfig = {
-    /** Tool ID to call for enrichment */
+type ToolCallConfig = {
     toolId: string;
     /**
-     * Tool version selector. Defaults to 'latest'.
-     * - 'latest': prefer draft, fallback to published
-     * - 'published': prefer published, fallback to draft
-     * - number: specific version (1+)
+     * Select the tool version (default to 'latest' if not provided).
+     * - 'latest': pick draft if exists, fallback to latest published version
+     * - 'published': pick latest published version, fallback to draft version
+     * - number: specific tool version (1+)
      */
     version?: VersionSelector;
     /**
-     * Maps tool input names to JEXL expressions.
-     * Expressions are evaluated with $ as the payload root (auto-normalized).
-     * Use ${...} syntax for JEXL expressions, or literal values.
-     *
-     * Examples:
-     * - "${vendors|map('id')|join(',')}" → "v1,v2,v3"
-     * - "${limit}" → 10
-     * - "static value" → "static value"
-     *
-     * If omitted, the entire payload is passed as tool input.
+     * Tool input can be literal or templated string with expressions
      */
     inputs?: Record<string, unknown>;
 };
-/** Enrichment result containing the full tool response. TThis should mirror ToolResult on server-side. */
+/**
+ * Widget enrichment configuration.
+ * Keys are used to access the enrichment results in the render function.
+ *
+ * Example:
+ * ```typescript
+ * enrich: {
+ *   vendorDetails: { toolId: 'vendor-tool', inputs: { ids: "${vendors}" } },
+ *   pricing: { toolId: 'pricing-tool', inputs: { ids: "${vendors}" } },
+ * },
+ * render: (payload, enriched) => {
+ *   const vendors = enriched?.vendorDetails?.data;
+ *   const pricing = enriched?.pricing?.data;
+ * }
+ * ```
+ */
+type WidgetEnrichConfig = Record<string, ToolCallConfig>;
+/** Enrichment result containing the full tool response. This should mirror ToolResult on server-side. */
 type EnrichmentResult$1 = {
     success: boolean;
     error?: {
@@ -55,8 +56,8 @@ type UIWidget = {
     widgetType: string;
     /** LLM-generated data based on the widget schema specified by the client */
     payload: unknown;
-    /** Server-injected enrichment result from tool call. This mirror ToolResult on server-side. */
-    enrichedResult?: EnrichmentResult$1;
+    /** Server-injected enrichment results from tool calls, keyed by enrichment name */
+    enriched?: Record<string, EnrichmentResult$1>;
 };
 
 type DeprecatedChatConfig = {
@@ -175,8 +176,7 @@ declare function useFeedback({ api, threadId, agentId, agentExecutionId, }: UseF
     error: Error | null;
 };
 
-/** Enrichment result containing the full tool response - this should mirror ToolResult
- * OR maybe we should declare ToolResult here? */
+/** Enrichment result containing the full tool response - this should mirror ToolResult */
 interface EnrichmentResult<TData = unknown> {
     success: boolean;
     error?: {
@@ -186,27 +186,32 @@ interface EnrichmentResult<TData = unknown> {
     data?: TData;
     metadata?: Record<string, unknown>;
 }
-/**
- * Props passed to widget render functions.
- * Contains both the validated payload and optional enriched result.
- */
-interface WidgetRenderProps<TPayload, TEnrichedData = unknown> {
-    /** The validated widget payload matching the schema */
-    payload: TPayload;
-    /** Server-injected enrichment result (only present if widget has enrich config) */
-    enrichedResult?: EnrichmentResult<TEnrichedData>;
-}
-interface UIWidgetDefinition<TSchema extends AnyZodObject = AnyZodObject, TEnrichedData = unknown> {
+/** Enriched results keyed by enrichment name */
+type EnrichedResults<T = unknown> = Record<string, EnrichmentResult<T>>;
+interface UIWidgetDefinition<TSchema extends AnyZodObject = AnyZodObject, TEnriched extends EnrichedResults = EnrichedResults> {
     widgetType: string;
     schema: TSchema;
     /**
-     * Optional enrichment config - if provided, server will call a tool to enrich the data.
-     * The enriched data is passed to the render function as `enrichedResult.data`.
+     * Optional enrichment config - if provided, server will call the tools to enrich the data.
+     * Keys are used to access results in the render function.
+     *
+     * Example:
+     * ```typescript
+     * enrich: {
+     *   vendorDetails: { toolId: 'vendor-tool', inputs: { ids: "${vendors}" } },
+     *   pricing: { toolId: 'pricing-tool', inputs: { ids: "${vendors}" } },
+     * }
+     * ```
      */
     enrich?: WidgetEnrichConfig;
-    render(props: WidgetRenderProps<z.infer<TSchema>, TEnrichedData>): ReactNode;
+    /**
+     * Render function that receives the payload and enriched results.
+     * @param payload - The LLM-generated data matching the schema
+     * @param enriched - Enrichment results keyed by name (empty object if no enrich config)
+     */
+    render(payload: z.infer<TSchema>, enriched: TEnriched): ReactNode;
 }
-declare const createWidget: <TSchema extends AnyZodObject, TEnrichedData = unknown>({ widgetType, schema, enrich, render, }: UIWidgetDefinition<TSchema, TEnrichedData>) => UIWidgetDefinition<TSchema, TEnrichedData>;
+declare const createWidget: <TSchema extends AnyZodObject, TEnriched extends EnrichedResults = EnrichedResults>({ widgetType, schema, enrich, render, }: UIWidgetDefinition<TSchema, TEnriched>) => UIWidgetDefinition<TSchema, TEnriched>;
 
 interface ChatWidgetStyles {
     primaryColor?: string;
@@ -353,4 +358,4 @@ declare const defaultChatWidgets: UIWidgetDefinition[];
 
 declare function cn(...inputs: ClassValue[]): string;
 
-export { type ApiConfig, type ChatContentItem, type ChatMessage, ChatWidget, type ChatWidgetFeedbackOptions, type ChatWidgetInstance, type ChatWidgetConfig as ChatWidgetProps, type ChatWidgetSpeechToTextOptions, type ChatWidgetStyles, type ChatWidgetVoiceOptions, type EmbeddableChatWidgetConfig, type EnrichmentResult, type FeedbackRating, type FeedbackState, type MessageFeedback, type MessageSection, type PopupAnchorConfig, PopupChatWidget, type PopupChatWidgetProps, type SubmitFeedbackParams, type TagGroup, TagGroupDisplay, type TagGroupDisplayProps, type ToolCallContent, ToolCallDisplay, type ToolCallDisplayProps, type UIWidgetDefinition, type UseChatConfig, type UseFeedbackConfig, type WidgetEnrichConfig, type WidgetRenderProps, cn, createChatWidget, createWidget, defaultChatWidgets, registerChatWidgets, useChat, useFeedback };
+export { type ApiConfig, type ChatContentItem, type ChatMessage, ChatWidget, type ChatWidgetFeedbackOptions, type ChatWidgetInstance, type ChatWidgetConfig as ChatWidgetProps, type ChatWidgetSpeechToTextOptions, type ChatWidgetStyles, type ChatWidgetVoiceOptions, type EmbeddableChatWidgetConfig, type EnrichedResults, type EnrichmentResult, type FeedbackRating, type FeedbackState, type MessageFeedback, type MessageSection, type PopupAnchorConfig, PopupChatWidget, type PopupChatWidgetProps, type SubmitFeedbackParams, type TagGroup, TagGroupDisplay, type TagGroupDisplayProps, type ToolCallContent, ToolCallDisplay, type ToolCallDisplayProps, type UIWidgetDefinition, type UseChatConfig, type UseFeedbackConfig, type WidgetEnrichConfig, cn, createChatWidget, createWidget, defaultChatWidgets, registerChatWidgets, useChat, useFeedback };

package/dist/index.js

@@ -18627,7 +18627,7 @@ var DefaultChatTransport = class extends HttpChatTransport {
 };
 
 // lib/hooks/useChat.ts
-import { useEffect, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
 function useChat({
   api,
   threadId,
@@ -18641,6 +18641,29 @@ function useChat({
   onMessage
 }) {
   const { baseUrl, token, headers: customHeaders = {} } = api;
+  const dataContextRef = useRef(dataContext);
+  dataContextRef.current = dataContext;
+  const transport = useMemo(() => new DefaultChatTransport({
+    api: `${baseUrl}/chat`,
+    headers: {
+      "Content-Type": "application/json",
+      Authorization: `Bearer ${token}`,
+      "thread-id": threadId,
+      ...agentId ? { "agent-id": agentId } : {},
+      ...agentExecutionId ? { "agent-execution-id": agentExecutionId } : {},
+      ...customHeaders
+    },
+    // only send last message to server
+    prepareSendMessagesRequest({ messages: messages2, id }) {
+      return {
+        body: {
+          id,
+          message: messages2[messages2.length - 1],
+          dataContext: dataContextRef.current
+        }
+      };
+    }
+  }), [baseUrl, token, threadId, agentId, agentExecutionId, customHeaders]);
   const {
     messages,
     status,
@@ -18649,27 +18672,7 @@ function useChat({
     setMessages
   } = useAIChat({
     id: threadId,
-    transport: new DefaultChatTransport({
-      api: `${baseUrl}/chat`,
-      headers: {
-        "Content-Type": "application/json",
-        Authorization: `Bearer ${token}`,
-        "thread-id": threadId,
-        ...agentId ? { "agent-id": agentId } : {},
-        ...agentExecutionId ? { "agent-execution-id": agentExecutionId } : {},
-        ...customHeaders
-      },
-      // only send last message to server
-      prepareSendMessagesRequest({ messages: messages2, id }) {
-        return {
-          body: {
-            id,
-            message: messages2[messages2.length - 1],
-            dataContext
-          }
-        };
-      }
-    }),
+    transport,
     onError: (error40) => {
       console.error("Chat error:", error40);
       onError?.(error40);
@@ -18909,11 +18912,11 @@ function styleInject(css, { insertAt } = {}) {
 }
 
 // lib/components/ChatWidget.css
-styleInject(':root[data-chat-widget],\n[data-chat-widget] {\n  --chat-primary: #3b82f6;\n  --chat-primary-text: #ffffff;\n  --chat-primary-hover: #2563eb;\n  --chat-background: #ffffff;\n  --chat-border: #e5e7eb;\n  --chat-header-text: #ffffff;\n  --chat-user-text: #ffffff;\n  --chat-assistant-bg: transparent;\n  --chat-assistant-text: #111827;\n  --chat-font-family:\n    "Inter",\n    system-ui,\n    -apple-system,\n    BlinkMacSystemFont,\n    sans-serif;\n  --chat-radius: 0.75rem;\n  --chat-input-bg: #ffffff;\n  --chat-input-text: #111827;\n  --chat-input-placeholder: #6b7280;\n  --chat-thought-border: #d1d5db;\n  --chat-font-size: 0.925rem;\n  --chat-thought-font-size: 0.75rem;\n}\n.chat-widget {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n  min-height: 24rem;\n  background: var(--chat-background);\n  border: 1px solid var(--chat-border);\n  border-radius: var(--chat-radius);\n  box-shadow: 0 20px 45px rgba(15, 23, 42, 0.12);\n  overflow: hidden;\n  font-family: var(--chat-font-family);\n  color: var(--chat-assistant-text);\n}\n.chat-widget__header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  height: 40px;\n  padding: 0.75rem 1rem;\n  background: var(--chat-primary);\n  color: var(--chat-header-text);\n}\n.chat-widget__title {\n  margin: 0;\n  font-size: 0.875rem;\n  font-weight: 600;\n}\n.chat-widget__messages {\n  flex: 1;\n  overflow-y: auto;\n  padding: 1rem;\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n.chat-widget__message {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n}\n.chat-widget__message-row {\n  display: flex;\n}\n.chat-widget__message-row--user {\n  justify-content: flex-end;\n}\n.chat-widget__message-row--assistant {\n  justify-content: flex-start;\n}\n.chat-widget__bubble {\n  max-width: 90%;\n  padding: 0.5rem 0.25rem;\n  border-radius: calc(var(--chat-radius) * 0.65);\n  font-size: var(--chat-font-size);\n}\n.chat-widget__bubble--user {\n  background: var(--chat-primary);\n  color: var(--chat-user-text);\n  border-bottom-right-radius: 0.35rem;\n}\n.chat-widget__bubble--assistant {\n  background: var(--chat-assistant-bg);\n  color: var(--chat-assistant-text);\n  border-bottom-left-radius: 0.35rem;\n}\n.chat-widget__markdown {\n  white-space: normal;\n  font-size: var(--chat-font-size);\n}\n.chat-widget__markdown h1 {\n  font-size: calc(var(--chat-font-size) * 1.4);\n}\n.chat-widget__markdown h2 {\n  font-size: calc(var(--chat-font-size) * 1.25);\n}\n.chat-widget__markdown h3 {\n  font-size: calc(var(--chat-font-size) * 1.1);\n}\n.chat-widget__markdown h4 {\n  font-size: calc(var(--chat-font-size) * 1.05);\n}\n.chat-widget__markdown h5 {\n  font-size: calc(var(--chat-font-size) * 1);\n}\n.chat-widget__markdown h6 {\n  font-size: calc(var(--chat-font-size) * 0.95);\n}\n.chat-widget__anchor-button {\n  position: fixed;\n  bottom: 20px;\n  right: 20px;\n  display: inline-flex;\n  align-items: center;\n  gap: 0.5rem;\n  padding: 0.65rem 0.85rem;\n  background: var(--chat-primary);\n  color: var(--chat-primary-text);\n  border: none;\n  border-radius: 999px;\n  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.2);\n  cursor: pointer;\n  font-weight: 600;\n  z-index: 99999;\n}\n.chat-widget__anchor-button:hover {\n  background: var(--chat-primary-hover);\n}\n.chat-widget__anchor--left {\n  right: auto;\n  left: 20px;\n}\n.chat-widget__anchor-icon {\n  width: 1.1rem;\n  height: 1.1rem;\n}\n.chat-widget__popup {\n  position: fixed;\n  bottom: 80px;\n  right: 20px;\n  z-index: 99998;\n}\n.chat-widget__anchor--left.chat-widget__popup {\n  right: auto;\n  left: 20px;\n}\n.chat-widget__popup-inner {\n  width: 384px;\n  max-width: calc(100vw - 40px);\n  height: 500px;\n  max-height: calc(100vh - 140px);\n  box-shadow: 0 20px 45px rgba(15, 23, 42, 0.12);\n  border-radius: 12px;\n  overflow: hidden;\n}\n.chat-widget__markdown table {\n  width: 100%;\n  border-collapse: collapse;\n  margin: 0.5rem 0;\n}\n.chat-widget__markdown th,\n.chat-widget__markdown td {\n  border: 1px solid var(--chat-border);\n  padding: 0.5rem;\n  text-align: left;\n  vertical-align: top;\n}\n.chat-widget__markdown thead th {\n  background: var(--chat-assistant-bg);\n  color: var(--chat-assistant-text);\n  font-weight: 600;\n}\n.chat-widget__thoughts {\n  min-width: 0;\n  --chat-font-size: var(--chat-thought-font-size);\n}\n.chat-widget__details {\n  border: 0;\n}\n.chat-widget__thoughts-summary {\n  list-style: none;\n  display: flex;\n  align-items: center;\n  gap: 0.35rem;\n  cursor: pointer;\n  color: #6b7280;\n  font-size: 0.8125rem;\n}\n.chat-widget__thoughts-summary:hover {\n  color: var(--chat-assistant-text);\n}\n.chat-widget__thoughts-icon-container {\n  display: flex;\n  border: 1px solid #d1d5db;\n  border-radius: 999px;\n  align-items: center;\n  justify-content: center;\n  width: 1rem;\n  height: 1rem;\n}\n.chat-widget__thoughts-icon {\n  width: 0.75rem;\n  height: 0.75rem;\n  transition: transform 0.2s ease;\n}\n.chat-widget__details[open] .chat-widget__thoughts-icon {\n  transform: rotate(90deg);\n}\n.chat-widget__thoughts-content {\n  margin-top: 0.5rem;\n  margin-left: 0.4rem;\n  padding: 0.75rem;\n  border-left: 2px solid var(--chat-thought-border);\n  border-color: var(--chat-primary);\n  max-width: 100%;\n  overflow-x: auto;\n}\n.chat-widget__thoughts-text {\n  margin: 0;\n  line-height: 1.5;\n  color: #4b5563;\n  font-family:\n    ui-monospace,\n    SFMono-Regular,\n    Menlo,\n    Monaco,\n    Consolas,\n    "Liberation Mono",\n    "Courier New",\n    monospace;\n  white-space: pre-wrap;\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  display: block;\n}\n.chat-widget__loading {\n  display: flex;\n  justify-content: flex-start;\n}\n.chat-widget__loading-bubble {\n  background: var(--chat-assistant-bg);\n  color: var(--chat-assistant-text);\n  border-radius: calc(var(--chat-radius) * 0.65);\n  border-bottom-left-radius: 0.35rem;\n  padding: 0.5rem 0.75rem;\n}\n.chat-widget__loading-dots {\n  display: flex;\n  gap: 0.35rem;\n}\n.chat-widget__loading-dot {\n  width: 0.5rem;\n  height: 0.5rem;\n  border-radius: 999px;\n  background: #9ca3af;\n  animation: chat-widget-bounce 1s infinite ease-in-out;\n}\n.chat-widget__loading-dot[data-delay="1"] {\n  animation-delay: 0.1s;\n}\n.chat-widget__loading-dot[data-delay="2"] {\n  animation-delay: 0.2s;\n}\n@keyframes chat-widget-bounce {\n  0%, 80%, 100% {\n    transform: scale(0.6);\n    opacity: 0.4;\n  }\n  40% {\n    transform: scale(1);\n    opacity: 1;\n  }\n}\n.chat-widget__input {\n  border-top: 1px solid var(--chat-border);\n  padding: 0.25rem 0 0.75rem;\n  background: var(--chat-input-bg);\n}\n.chat-widget__form {\n  position: relative;\n}\n.chat-widget__textarea {\n  width: 100%;\n  border: 0;\n  padding: 0.75rem 5.25rem 0.75rem 0.75rem;\n  background: transparent;\n  font-size: 0.925rem;\n  resize: none;\n  color: var(--chat-input-text);\n  font-family: inherit;\n}\n.chat-widget__textarea::-moz-placeholder {\n  color: var(--chat-input-placeholder);\n}\n.chat-widget__textarea::placeholder {\n  color: var(--chat-input-placeholder);\n}\n.chat-widget__textarea:focus-visible {\n  outline: none;\n}\n.chat-widget__textarea:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.chat-widget__toolbar {\n  position: absolute;\n  top: 0;\n  right: 3.75rem;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  padding: 0 0.5rem;\n  border-right: 1px solid var(--chat-border);\n}\n.chat-widget__submit {\n  position: absolute;\n  top: 50%;\n  right: 0.75rem;\n  transform: translateY(-50%);\n  background: transparent;\n  border: 0;\n  width: 2.5rem;\n  height: 2.5rem;\n  display: grid;\n  place-items: center;\n  color: var(--chat-primary);\n  cursor: pointer;\n}\n.chat-widget__submit:disabled {\n  color: #9ca3af;\n  cursor: not-allowed;\n}\n.chat-widget__submit:not(:disabled):hover {\n  color: var(--chat-primary-hover);\n}\n.chat-widget__send-icon {\n  width: 1.2rem;\n  height: 1.2rem;\n}\n.chat-widget__mic-button {\n  position: relative;\n  border: none;\n  background: transparent;\n  width: 2.25rem;\n  height: 2.25rem;\n  display: grid;\n  place-items: center;\n  color: var(--chat-primary);\n  cursor: pointer;\n  border-radius: 999px;\n}\n.chat-widget__mic-button:disabled {\n  color: #9ca3af;\n  cursor: not-allowed;\n}\n.chat-widget__mic-button--active {\n  color: var(--chat-primary-hover);\n  background: rgba(59, 130, 246, 0.08);\n}\n.chat-widget__mic-icon {\n  width: 1rem;\n  height: 1rem;\n}\n.chat-widget__mic-bar {\n  position: absolute;\n  bottom: 0.1rem;\n  left: 50%;\n  width: 16px;\n  height: 2px;\n  border-radius: 999px;\n  background: rgba(148, 163, 184, 0.4);\n  overflow: hidden;\n  display: block;\n  transform: translateX(-50%);\n  pointer-events: none;\n}\n.chat-widget__mic-bar-fill {\n  display: block;\n  width: 100%;\n  height: 100%;\n  background: currentColor;\n  transform-origin: left;\n  transition: transform 0.12s linear;\n}\n.chat-widget__voice {\n  display: flex;\n  margin-top: 0.25rem;\n}\n.chat-widget__voice-button {\n  border: none;\n  background: none;\n  display: inline-flex;\n  align-items: center;\n  gap: 0.35rem;\n  padding: 0.1rem 0;\n  font-size: 0.8rem;\n  font-weight: 500;\n  color: var(--chat-primary);\n  cursor: pointer;\n}\n.chat-widget__voice-button:disabled {\n  color: #9ca3af;\n  cursor: not-allowed;\n}\n.chat-widget__voice-button--active {\n  color: var(--chat-primary-hover);\n}\n.chat-widget__voice-icon {\n  width: 0.95rem;\n  height: 0.95rem;\n}\n.chat-widget__voice-icon--spin {\n  animation: chat-widget-spin 1s linear infinite;\n}\n@keyframes chat-widget-spin {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n');
+styleInject(':root[data-chat-widget],\n[data-chat-widget] {\n  --chat-primary: #3b82f6;\n  --chat-primary-text: #ffffff;\n  --chat-primary-hover: #2563eb;\n  --chat-background: #ffffff;\n  --chat-border: #e5e7eb;\n  --chat-header-text: #ffffff;\n  --chat-user-text: #ffffff;\n  --chat-assistant-bg: transparent;\n  --chat-assistant-text: #111827;\n  --chat-font-family:\n    "Inter",\n    system-ui,\n    -apple-system,\n    BlinkMacSystemFont,\n    sans-serif;\n  --chat-radius: 0.75rem;\n  --chat-input-bg: #ffffff;\n  --chat-input-text: #111827;\n  --chat-input-placeholder: #6b7280;\n  --chat-thought-border: #d1d5db;\n  --chat-font-size: 0.925rem;\n  --chat-thought-font-size: 0.75rem;\n}\n.chat-widget {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  height: 100%;\n  min-height: 24rem;\n  background: var(--chat-background);\n  border: 1px solid var(--chat-border);\n  border-radius: var(--chat-radius);\n  box-shadow: 0 20px 45px rgba(15, 23, 42, 0.12);\n  overflow: hidden;\n  font-family: var(--chat-font-family);\n  color: var(--chat-assistant-text);\n}\n.chat-widget__header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  height: 40px;\n  padding: 0.75rem 1rem;\n  background: var(--chat-primary);\n  color: var(--chat-header-text);\n}\n.chat-widget__title {\n  margin: 0;\n  font-size: 0.875rem;\n  font-weight: 600;\n}\n.chat-widget__messages {\n  flex: 1;\n  overflow-y: auto;\n  padding: 1rem;\n  display: flex;\n  flex-direction: column;\n  gap: 1rem;\n}\n.chat-widget__message {\n  display: flex;\n  flex-direction: column;\n  gap: 0;\n}\n.chat-widget__message-row {\n  display: flex;\n}\n.chat-widget__message-row--user {\n  justify-content: flex-end;\n}\n.chat-widget__message-row--assistant {\n  justify-content: flex-start;\n}\n.chat-widget__bubble {\n  max-width: 90%;\n  padding: 0.5rem 0.25rem;\n  border-radius: calc(var(--chat-radius) * 0.65);\n  font-size: var(--chat-font-size);\n}\n.chat-widget__bubble--user {\n  background: var(--chat-primary);\n  color: var(--chat-user-text);\n  border-bottom-right-radius: 0.35rem;\n}\n.chat-widget__bubble--assistant {\n  width: 90%;\n  background: var(--chat-assistant-bg);\n  color: var(--chat-assistant-text);\n  border-bottom-left-radius: 0.35rem;\n}\n.chat-widget__widget {\n  width: 100%;\n}\n.chat-widget__markdown {\n  white-space: normal;\n  font-size: var(--chat-font-size);\n}\n.chat-widget__markdown h1 {\n  font-size: calc(var(--chat-font-size) * 1.4);\n}\n.chat-widget__markdown h2 {\n  font-size: calc(var(--chat-font-size) * 1.25);\n}\n.chat-widget__markdown h3 {\n  font-size: calc(var(--chat-font-size) * 1.1);\n}\n.chat-widget__markdown h4 {\n  font-size: calc(var(--chat-font-size) * 1.05);\n}\n.chat-widget__markdown h5 {\n  font-size: calc(var(--chat-font-size) * 1);\n}\n.chat-widget__markdown h6 {\n  font-size: calc(var(--chat-font-size) * 0.95);\n}\n.chat-widget__anchor-button {\n  position: fixed;\n  bottom: 20px;\n  right: 20px;\n  display: inline-flex;\n  align-items: center;\n  gap: 0.5rem;\n  padding: 0.65rem 0.85rem;\n  background: var(--chat-primary);\n  color: var(--chat-primary-text);\n  border: none;\n  border-radius: 999px;\n  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.2);\n  cursor: pointer;\n  font-weight: 600;\n  z-index: 99999;\n}\n.chat-widget__anchor-button:hover {\n  background: var(--chat-primary-hover);\n}\n.chat-widget__anchor--left {\n  right: auto;\n  left: 20px;\n}\n.chat-widget__anchor-icon {\n  width: 1.1rem;\n  height: 1.1rem;\n}\n.chat-widget__popup {\n  position: fixed;\n  bottom: 80px;\n  right: 20px;\n  z-index: 99998;\n}\n.chat-widget__anchor--left.chat-widget__popup {\n  right: auto;\n  left: 20px;\n}\n.chat-widget__popup-inner {\n  width: 384px;\n  max-width: calc(100vw - 40px);\n  height: 500px;\n  max-height: calc(100vh - 140px);\n  box-shadow: 0 20px 45px rgba(15, 23, 42, 0.12);\n  border-radius: 12px;\n  overflow: hidden;\n}\n.chat-widget__markdown table {\n  width: 100%;\n  border-collapse: collapse;\n  margin: 0.5rem 0;\n}\n.chat-widget__markdown th,\n.chat-widget__markdown td {\n  border: 1px solid var(--chat-border);\n  padding: 0.5rem;\n  text-align: left;\n  vertical-align: top;\n}\n.chat-widget__markdown thead th {\n  background: var(--chat-assistant-bg);\n  color: var(--chat-assistant-text);\n  font-weight: 600;\n}\n.chat-widget__thoughts {\n  min-width: 0;\n  --chat-font-size: var(--chat-thought-font-size);\n}\n.chat-widget__details {\n  border: 0;\n}\n.chat-widget__thoughts-summary {\n  list-style: none;\n  display: flex;\n  align-items: center;\n  gap: 0.35rem;\n  cursor: pointer;\n  color: #6b7280;\n  font-size: 0.8125rem;\n}\n.chat-widget__thoughts-summary:hover {\n  color: var(--chat-assistant-text);\n}\n.chat-widget__thoughts-icon-container {\n  display: flex;\n  border: 1px solid #d1d5db;\n  border-radius: 999px;\n  align-items: center;\n  justify-content: center;\n  width: 1rem;\n  height: 1rem;\n}\n.chat-widget__thoughts-icon {\n  width: 0.75rem;\n  height: 0.75rem;\n  transition: transform 0.2s ease;\n}\n.chat-widget__details[open] .chat-widget__thoughts-icon {\n  transform: rotate(90deg);\n}\n.chat-widget__thoughts-content {\n  margin-top: 0.5rem;\n  margin-left: 0.4rem;\n  padding: 0.75rem;\n  border-left: 2px solid var(--chat-thought-border);\n  border-color: var(--chat-primary);\n  max-width: 100%;\n  overflow-x: auto;\n}\n.chat-widget__thoughts-text {\n  margin: 0;\n  line-height: 1.5;\n  color: #4b5563;\n  font-family:\n    ui-monospace,\n    SFMono-Regular,\n    Menlo,\n    Monaco,\n    Consolas,\n    "Liberation Mono",\n    "Courier New",\n    monospace;\n  white-space: pre-wrap;\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  display: block;\n}\n.chat-widget__loading {\n  display: flex;\n  justify-content: flex-start;\n}\n.chat-widget__loading-bubble {\n  background: var(--chat-assistant-bg);\n  color: var(--chat-assistant-text);\n  border-radius: calc(var(--chat-radius) * 0.65);\n  border-bottom-left-radius: 0.35rem;\n  padding: 0.5rem 0.75rem;\n}\n.chat-widget__loading-dots {\n  display: flex;\n  gap: 0.35rem;\n}\n.chat-widget__loading-dot {\n  width: 0.5rem;\n  height: 0.5rem;\n  border-radius: 999px;\n  background: #9ca3af;\n  animation: chat-widget-bounce 1s infinite ease-in-out;\n}\n.chat-widget__loading-dot[data-delay="1"] {\n  animation-delay: 0.1s;\n}\n.chat-widget__loading-dot[data-delay="2"] {\n  animation-delay: 0.2s;\n}\n@keyframes chat-widget-bounce {\n  0%, 80%, 100% {\n    transform: scale(0.6);\n    opacity: 0.4;\n  }\n  40% {\n    transform: scale(1);\n    opacity: 1;\n  }\n}\n.chat-widget__input {\n  border-top: 1px solid var(--chat-border);\n  padding: 0.25rem 0 0.75rem;\n  background: var(--chat-input-bg);\n}\n.chat-widget__form {\n  position: relative;\n}\n.chat-widget__textarea {\n  width: 100%;\n  border: 0;\n  padding: 0.75rem 5.25rem 0.75rem 0.75rem;\n  background: transparent;\n  font-size: 0.925rem;\n  resize: none;\n  color: var(--chat-input-text);\n  font-family: inherit;\n}\n.chat-widget__textarea::-moz-placeholder {\n  color: var(--chat-input-placeholder);\n}\n.chat-widget__textarea::placeholder {\n  color: var(--chat-input-placeholder);\n}\n.chat-widget__textarea:focus-visible {\n  outline: none;\n}\n.chat-widget__textarea:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.chat-widget__toolbar {\n  position: absolute;\n  top: 0;\n  right: 3.75rem;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  padding: 0 0.5rem;\n  border-right: 1px solid var(--chat-border);\n}\n.chat-widget__submit {\n  position: absolute;\n  top: 50%;\n  right: 0.75rem;\n  transform: translateY(-50%);\n  background: transparent;\n  border: 0;\n  width: 2.5rem;\n  height: 2.5rem;\n  display: grid;\n  place-items: center;\n  color: var(--chat-primary);\n  cursor: pointer;\n}\n.chat-widget__submit:disabled {\n  color: #9ca3af;\n  cursor: not-allowed;\n}\n.chat-widget__submit:not(:disabled):hover {\n  color: var(--chat-primary-hover);\n}\n.chat-widget__send-icon {\n  width: 1.2rem;\n  height: 1.2rem;\n}\n.chat-widget__mic-button {\n  position: relative;\n  border: none;\n  background: transparent;\n  width: 2.25rem;\n  height: 2.25rem;\n  display: grid;\n  place-items: center;\n  color: var(--chat-primary);\n  cursor: pointer;\n  border-radius: 999px;\n}\n.chat-widget__mic-button:disabled {\n  color: #9ca3af;\n  cursor: not-allowed;\n}\n.chat-widget__mic-button--active {\n  color: var(--chat-primary-hover);\n  background: rgba(59, 130, 246, 0.08);\n}\n.chat-widget__mic-icon {\n  width: 1rem;\n  height: 1rem;\n}\n.chat-widget__mic-bar {\n  position: absolute;\n  bottom: 0.1rem;\n  left: 50%;\n  width: 16px;\n  height: 2px;\n  border-radius: 999px;\n  background: rgba(148, 163, 184, 0.4);\n  overflow: hidden;\n  display: block;\n  transform: translateX(-50%);\n  pointer-events: none;\n}\n.chat-widget__mic-bar-fill {\n  display: block;\n  width: 100%;\n  height: 100%;\n  background: currentColor;\n  transform-origin: left;\n  transition: transform 0.12s linear;\n}\n.chat-widget__voice {\n  display: flex;\n  margin-top: 0.25rem;\n}\n.chat-widget__voice-button {\n  border: none;\n  background: none;\n  display: inline-flex;\n  align-items: center;\n  gap: 0.35rem;\n  padding: 0.1rem 0;\n  font-size: 0.8rem;\n  font-weight: 500;\n  color: var(--chat-primary);\n  cursor: pointer;\n}\n.chat-widget__voice-button:disabled {\n  color: #9ca3af;\n  cursor: not-allowed;\n}\n.chat-widget__voice-button--active {\n  color: var(--chat-primary-hover);\n}\n.chat-widget__voice-icon {\n  width: 0.95rem;\n  height: 0.95rem;\n}\n.chat-widget__voice-icon--spin {\n  animation: chat-widget-spin 1s linear infinite;\n}\n@keyframes chat-widget-spin {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n');
 
 // lib/components/ChatWidget.tsx
 import { ChevronRight as ChevronRight2, Send, StopCircle } from "lucide-react";
-import React3, { useCallback as useCallback4, useEffect as useEffect4, useMemo, useRef as useRef2, useState as useState6 } from "react";
+import React3, { useCallback as useCallback4, useEffect as useEffect4, useMemo as useMemo2, useRef as useRef3, useState as useState6 } from "react";
 import ReactMarkdown from "react-markdown";
 
 // ../../node_modules/ccount/index.js
@@ -23667,12 +23670,12 @@ async function registerChatWidgets({
   widgets
 }) {
   const widgetSchemas = widgets.map(({ widgetType, schema, enrich }) => {
-    schema = schema.extend({
+    const extendedSchema = schema.extend({
       widgetType: zod_default.literal(widgetType)
     });
     return {
       widgetType,
-      schema: toJsonSchema(schema),
+      schema: toJsonSchema(extendedSchema),
       enrich
     };
   });
@@ -23884,7 +23887,7 @@ import { Mic, MicOff } from "lucide-react";
 import {
   useCallback as useCallback3,
   useEffect as useEffect3,
-  useRef,
+  useRef as useRef2,
   useState as useState4
 } from "react";
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
@@ -23909,13 +23912,13 @@ function SpeechToTextButton({
   const [isListening, setIsListening] = useState4(false);
   const [isSupported, setIsSupported] = useState4(false);
   const [countdown, setCountdown] = useState4(0);
-  const recognitionRef = useRef(null);
+  const recognitionRef = useRef2(null);
   const [countdownActive, setCountdownActive] = useState4(false);
-  const silenceTimer = useRef(null);
-  const finalTimer = useRef(null);
-  const finalTextRef = useRef("");
-  const countdownFrameRef = useRef(null);
-  const countdownEndRef = useRef(0);
+  const silenceTimer = useRef2(null);
+  const finalTimer = useRef2(null);
+  const finalTextRef = useRef2("");
+  const countdownFrameRef = useRef2(null);
+  const countdownEndRef = useRef2(0);
   const recognitionLanguage = language ?? "en-US";
   const clearSilenceTimer = useCallback3(() => {
     if (silenceTimer.current) {
@@ -24270,7 +24273,7 @@ function MessageItemComponent({
         ] }, key);
       }
       const widget = item;
-      return /* @__PURE__ */ jsx5("div", { className: "chat-widget__widget", children: widgetDef.render({ payload: widget.payload, enrichedResult: widget.enrichedResult }) }, key);
+      return /* @__PURE__ */ jsx5("div", { className: "chat-widget__widget", children: widgetDef.render(widget.payload, widget.enriched ?? {}) }, key);
     }
     return null;
   };
@@ -24428,11 +24431,11 @@ function ChatWidget({
   widgets,
   feedback
 }) {
-  const theme = useMemo(
+  const theme = useMemo2(
     () => ({ ...defaultTheme, ...styleProps || {} }),
     [styleProps]
   );
-  const themeVariables = useMemo(
+  const themeVariables = useMemo2(
     () => ({
       "--chat-primary": theme.primaryColor,
       "--chat-primary-text": theme.primaryTextColor,
@@ -24455,11 +24458,11 @@ function ChatWidget({
   const [input, setInput] = useState6("");
   const [isMicActive, setIsMicActive] = useState6(false);
   const [isSpeechPending, setIsSpeechPending] = useState6(false);
-  const messagesEndRef = useRef2(null);
-  const scrollContainerRef = useRef2(null);
-  const isAtBottomRef = useRef2(true);
-  const textareaRef = useRef2(null);
-  const suppressScrollRef = useRef2(false);
+  const messagesEndRef = useRef3(null);
+  const scrollContainerRef = useRef3(null);
+  const isAtBottomRef = useRef3(true);
+  const textareaRef = useRef3(null);
+  const suppressScrollRef = useRef3(false);
   const {
     messages,
     status,
@@ -24504,7 +24507,7 @@ function ChatWidget({
       return next;
     });
   }, []);
-  const voiceConfig = useMemo(() => {
+  const voiceConfig = useMemo2(() => {
     if (!voice || voice.enabled === false || !voice.url) {
       return null;
     }
@@ -24606,7 +24609,7 @@ function ChatWidget({
       setIsMicActive(false);
     }
   }, [speechEnabled]);
-  const lastRegisteredRef = useRef2({
+  const lastRegisteredRef = useRef3({
     threadId: "",
     widgets: null
   });
@@ -24715,7 +24718,7 @@ styleInject(".chat-popup__anchor {\n  position: fixed;\n  inset-block-end: 20px;
 
 // lib/components/PopupChatWidget.tsx
 import { MessageSquare as MessageSquare2, X } from "lucide-react";
-import { useEffect as useEffect5, useMemo as useMemo2, useState as useState7 } from "react";
+import { useEffect as useEffect5, useMemo as useMemo3, useState as useState7 } from "react";
 import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
 function PopupChatWidget({ anchor, ...props }) {
   const [isOpen, setIsOpen] = useState7(anchor?.initiallyOpen ?? false);
@@ -24740,7 +24743,7 @@ function PopupChatWidget({ anchor, ...props }) {
   const anchorPositionClass = anchor?.position === "bottom-start" ? "chat-popup--start" : "chat-popup--end";
   const closeConfig = anchor?.closeButton ?? props.closeButton;
   const showClose = closeConfig?.show !== false;
-  const themeStyle = useMemo2(() => {
+  const themeStyle = useMemo3(() => {
     const primary = props.styles?.primaryColor ?? "#3b82f6";
     const primaryText = props.styles?.primaryTextColor ?? "#ffffff";
     const background = props.styles?.backgroundColor ?? "#ffffff";
@@ -24764,7 +24767,7 @@ function PopupChatWidget({ anchor, ...props }) {
       "--chat-header-text": headerText
     };
   }, [props.styles]);
-  const popupStyle = useMemo2(() => {
+  const popupStyle = useMemo3(() => {
     const size = props.popupSize ?? {};
     return {
       width: size.width ?? "600px",
@@ -24872,7 +24875,7 @@ var createWidget = ({
   widgetType,
   schema,
   enrich,
-  render: (props) => render(props)
+  render
 });
 
 // lib/widgets/default-widgets.tsx
@@ -24885,7 +24888,7 @@ var defaultChatWidgets = [
       profileUri: zod_default.string().optional(),
       details: zod_default.record(zod_default.any()).optional()
     }).describe("showing a person card with name, photo and additional details"),
-    render: ({ payload }) => /* @__PURE__ */ jsx8(
+    render: (payload) => /* @__PURE__ */ jsx8(
       "div",
       {
         style: {
@@ -24934,7 +24937,7 @@ var defaultChatWidgets = [
       uri: zod_default.string().url(),
       text: zod_default.string().optional()
     }).describe("rendering a clickable link"),
-    render: ({ payload }) => /* @__PURE__ */ jsx8(
+    render: (payload) => /* @__PURE__ */ jsx8(
       "a",
       {
         href: payload.uri,
@@ -24971,21 +24974,34 @@ var defaultChatWidgets = [
     widgetType: "vendor-cards",
     schema: zod_default.object({
       vendors: zod_default.array(zod_default.object({
-        id: zod_default.string(),
-        rank: zod_default.number().describe("ranking position of the vendor from 1 to N"),
-        reason: zod_default.string().describe("reason for the vendor ranking")
+        vendor_id: zod_default.string(),
+        rank: zod_default.number().optional().describe("ranking position of the vendor from 1 to N when applicable"),
+        reason: zod_default.string().optional().describe("reason for the vendor ranking when applicable")
       }))
-    }).describe("displaying a list of vendor cards with rankings and reasons"),
+    }).describe("displaying a list of vendor cards with rankings and reasons. Only use this widget when calling Care Network vendor search tools."),
     enrich: {
-      toolId: "LEsUueB52QpakvN1n5HG",
-      inputs: {
-        ids: "${vendors|map('id')|join(',')}"
+      vendorDetails: {
+        toolId: "CPgsswom7FkUYvplmy6H",
+        inputs: {
+          vendorIds: "${vendors|map('vendor_id')|join(',')}"
+        }
       }
     },
-    render: ({ payload, enrichedResult }) => {
-      const vendorData = enrichedResult?.data ?? {};
-      return /* @__PURE__ */ jsx8("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem" }, children: payload.vendors.map((v) => {
-        const data = vendorData[v.id];
+    render: (payload, { vendorDetails }) => {
+      const typedPayload = payload;
+      const vendorData = vendorDetails?.data ?? {};
+      const formatLanguage = (code3) => {
+        const langMap = { en: "English", es: "Spanish", zh: "Chinese", fr: "French" };
+        return langMap[code3.trim()] || code3.trim();
+      };
+      return /* @__PURE__ */ jsx8("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem" }, children: typedPayload.vendors.map((v) => {
+        const data = vendorData[v.vendor_id];
+        const name17 = data?.names?.find((n) => n.type === "org")?.value ?? "Care Provider";
+        const languages = data?.languages ?? [];
+        const ageGroups = data?.details?.age_groups ?? [];
+        const services = data?.details?.services ?? [];
+        const address = data?.location?.formatted_address;
+        const hours = data?.scheduling?.hours;
         return /* @__PURE__ */ jsxs7(
           "div",
           {
@@ -25002,26 +25018,53 @@ var defaultChatWidgets = [
             children: [
               /* @__PURE__ */ jsxs7("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center" }, children: [
                 /* @__PURE__ */ jsxs7("span", { style: { fontWeight: 600, fontSize: "1rem", color: "#111827" }, children: [
-                  "#",
-                  v.rank,
-                  " ",
-                  data?.name ?? `Vendor ${v.id}`
+                  v.rank ? `#${v.rank} ` : "",
+                  name17
                 ] }),
-                data?.rating && /* @__PURE__ */ jsxs7("span", { style: { fontSize: "0.875rem", color: "#6b7280" }, children: [
-                  "\u2B50 ",
-                  data.rating.toFixed(1)
-                ] })
+                hours && /* @__PURE__ */ jsx8("span", { style: { fontSize: "0.75rem", color: "#6b7280" }, children: hours })
               ] }),
-              data?.description && /* @__PURE__ */ jsx8("div", { style: { fontSize: "0.875rem", color: "#6b7280" }, children: data.description }),
-              /* @__PURE__ */ jsxs7("div", { style: { fontSize: "0.875rem", color: "#374151" }, children: [
+              address && /* @__PURE__ */ jsx8("div", { style: { fontSize: "0.875rem", color: "#6b7280" }, children: address }),
+              services.length > 0 && /* @__PURE__ */ jsx8("div", { style: { display: "flex", flexWrap: "wrap", gap: "0.375rem" }, children: services.map((service) => /* @__PURE__ */ jsx8(
+                "span",
+                {
+                  style: {
+                    fontSize: "0.75rem",
+                    padding: "0.125rem 0.5rem",
+                    background: "#dbeafe",
+                    color: "#1e40af",
+                    borderRadius: "9999px"
+                  },
+                  children: service
+                },
+                service
+              )) }),
+              languages.length > 0 && /* @__PURE__ */ jsx8("div", { style: { display: "flex", flexWrap: "wrap", gap: "0.375rem" }, children: languages.map((lang) => /* @__PURE__ */ jsx8(
+                "span",
+                {
+                  style: {
+                    fontSize: "0.75rem",
+                    padding: "0.125rem 0.5rem",
+                    background: "#f3e8ff",
+                    color: "#7c3aed",
+                    borderRadius: "9999px"
+                  },
+                  children: formatLanguage(lang)
+                },
+                lang
+              )) }),
+              ageGroups.length > 0 && /* @__PURE__ */ jsxs7("div", { style: { fontSize: "0.75rem", color: "#6b7280" }, children: [
+                /* @__PURE__ */ jsx8("strong", { children: "Ages:" }),
+                " ",
+                ageGroups.join(", ")
+              ] }),
+              v.reason && /* @__PURE__ */ jsxs7("div", { style: { fontSize: "0.875rem", color: "#374151" }, children: [
                 /* @__PURE__ */ jsx8("strong", { children: "Why:" }),
                 " ",
                 v.reason
-              ] }),
-              data?.address && /* @__PURE__ */ jsx8("div", { style: { fontSize: "0.75rem", color: "#9ca3af" }, children: data.address })
+              ] })
             ]
           },
-          v.id
+          v.vendor_id
         );
       }) });
     }