@ensembleapp/client-sdk 0.0.4 → 0.0.7

package/dist/index.js

@@ -136,6 +136,90 @@ function useChat({
   };
 }
 
+// lib/hooks/useFeedback.ts
+import { useCallback, useState as useState2 } from "react";
+function useFeedback({
+  api,
+  threadId,
+  agentId,
+  agentExecutionId
+}) {
+  const { baseUrl, token } = api;
+  const [submittedFeedback, setSubmittedFeedback] = useState2({});
+  const [isSubmitting, setIsSubmitting] = useState2(null);
+  const [error, setError] = useState2(null);
+  const submitFeedback = useCallback(
+    async ({ messageId, rating, improvementText }) => {
+      setIsSubmitting(messageId);
+      setError(null);
+      try {
+        const response = await fetch(`${baseUrl}/api/feedback`, {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+            Authorization: `Bearer ${token}`
+          },
+          body: JSON.stringify({
+            threadId,
+            messageId,
+            rating,
+            improvementText: improvementText || void 0,
+            agentId: agentId || void 0,
+            orchestrationId: agentExecutionId || void 0
+          })
+        });
+        if (!response.ok) {
+          const errorData = await response.json().catch(() => ({}));
+          throw new Error(errorData.error || `Failed to submit feedback: ${response.statusText}`);
+        }
+        const { data } = await response.json();
+        const feedback = {
+          id: data.id,
+          messageId: data.messageId,
+          rating: data.rating,
+          improvementText: data.improvementText,
+          createdAt: new Date(data.createdAt)
+        };
+        setSubmittedFeedback((prev) => ({
+          ...prev,
+          [messageId]: {
+            rating: feedback.rating,
+            comment: feedback.improvementText
+          }
+        }));
+        return feedback;
+      } catch (err) {
+        const error2 = err instanceof Error ? err : new Error("Unknown error");
+        setError(error2);
+        console.error("Failed to submit feedback:", error2);
+        return null;
+      } finally {
+        setIsSubmitting(null);
+      }
+    },
+    [baseUrl, token, threadId, agentId, agentExecutionId]
+  );
+  const getFeedbackForMessage = useCallback(
+    (messageId) => {
+      return submittedFeedback[messageId];
+    },
+    [submittedFeedback]
+  );
+  const hasFeedback = useCallback(
+    (messageId) => {
+      return messageId in submittedFeedback;
+    },
+    [submittedFeedback]
+  );
+  return {
+    submitFeedback,
+    getFeedbackForMessage,
+    hasFeedback,
+    isSubmitting,
+    error
+  };
+}
+
 // #style-inject:#style-inject
 function styleInject(css, { insertAt } = {}) {
   if (!css || typeof document === "undefined") return;
@@ -163,7 +247,7 @@ styleInject(':root[data-chat-widget],\n[data-chat-widget] {\n  --chat-primary: #
 
 // lib/components/ChatWidget.tsx
 import { ChevronRight, Send, StopCircle } from "lucide-react";
-import { useCallback as useCallback2, useEffect as useEffect3, useMemo, useRef as useRef2, useState as useState3 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect4, useMemo, useRef as useRef2, useState as useState5 } from "react";
 import ReactMarkdown from "react-markdown";
 
 // ../../node_modules/ccount/index.js
@@ -7453,7 +7537,7 @@ ZodNaN.create = (params) => {
     ...processCreateParams(params)
   });
 };
-var BRAND = Symbol("zod_brand");
+var BRAND = /* @__PURE__ */ Symbol("zod_brand");
 var ZodBranded = class extends ZodType {
   _parse(input) {
     const { ctx } = this._processInputParams(input);
@@ -7670,7 +7754,7 @@ var NEVER = INVALID;
 var zod_default = external_exports;
 
 // ../../node_modules/zod-to-json-schema/dist/esm/Options.js
-var ignoreOverride = Symbol("Let zodToJsonSchema decide on which parser to use");
+var ignoreOverride = /* @__PURE__ */ Symbol("Let zodToJsonSchema decide on which parser to use");
 var defaultOptions = {
   name: void 0,
   $refStrategy: "root",
@@ -8993,15 +9077,194 @@ function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
 
+// lib/components/MessageFeedback.css
+styleInject(".chat-widget__feedback {\n  display: flex;\n  align-items: center;\n  gap: 0.25rem;\n  margin-top: 0.35rem;\n}\n.chat-widget__feedback-button {\n  border: none;\n  background: transparent;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 1.75rem;\n  height: 1.75rem;\n  padding: 0;\n  color: #9ca3af;\n  cursor: pointer;\n  border-radius: 0.35rem;\n  transition: all 0.15s ease;\n}\n.chat-widget__feedback-button:hover:not(:disabled) {\n  background: rgba(0, 0, 0, 0.05);\n  color: #6b7280;\n}\n.chat-widget__feedback-button:disabled {\n  cursor: default;\n  opacity: 0.5;\n}\n.chat-widget__feedback-button--positive.chat-widget__feedback-button--selected {\n  color: #22c55e;\n  background: rgba(34, 197, 94, 0.1);\n}\n.chat-widget__feedback-button--negative.chat-widget__feedback-button--selected {\n  color: #ef4444;\n  background: rgba(239, 68, 68, 0.1);\n}\n.chat-widget__feedback-button--comment.chat-widget__feedback-button--selected {\n  color: var(--chat-primary, #3b82f6);\n  background: rgba(59, 130, 246, 0.1);\n}\n.chat-widget__feedback-button--comment.chat-widget__feedback-button--has-content {\n  color: var(--chat-primary, #3b82f6);\n}\n.chat-widget__feedback-icon {\n  width: 1rem;\n  height: 1rem;\n}\n.chat-widget__feedback-comment-section {\n  margin-top: 0.75rem;\n  background: var(--chat-background, #ffffff);\n  border: 1px solid var(--chat-border, #e5e7eb);\n  border-radius: 0.5rem;\n  padding: 0.75rem;\n  width: 100%;\n  max-width: 400px;\n}\n.chat-widget__feedback-comment-header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin-bottom: 0.5rem;\n  font-size: 0.8125rem;\n  font-weight: 600;\n  color: var(--chat-assistant-text, #111827);\n}\n.chat-widget__feedback-comment-required {\n  font-size: 0.6875rem;\n  font-weight: 500;\n  color: #ef4444;\n  background: rgba(239, 68, 68, 0.1);\n  padding: 0.125rem 0.375rem;\n  border-radius: 0.25rem;\n}\n.chat-widget__feedback-textarea {\n  width: 100%;\n  min-height: 120px;\n  padding: 0.625rem;\n  border: 1px solid var(--chat-border, #e5e7eb);\n  border-radius: 0.35rem;\n  font-size: 0.875rem;\n  font-family: inherit;\n  resize: vertical;\n  color: var(--chat-input-text, #111827);\n  background: var(--chat-input-bg, #ffffff);\n  line-height: 1.5;\n}\n.chat-widget__feedback-textarea:focus {\n  outline: none;\n  border-color: var(--chat-primary, #3b82f6);\n  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1);\n}\n.chat-widget__feedback-textarea::-moz-placeholder {\n  color: var(--chat-input-placeholder, #6b7280);\n}\n.chat-widget__feedback-textarea::placeholder {\n  color: var(--chat-input-placeholder, #6b7280);\n}\n.chat-widget__feedback-actions {\n  display: flex;\n  justify-content: flex-end;\n  gap: 0.5rem;\n  margin-top: 0.75rem;\n}\n.chat-widget__feedback-cancel,\n.chat-widget__feedback-submit {\n  padding: 0.5rem 1rem;\n  font-size: 0.8125rem;\n  font-weight: 500;\n  border-radius: 0.35rem;\n  cursor: pointer;\n  transition: all 0.15s ease;\n}\n.chat-widget__feedback-cancel {\n  background: transparent;\n  border: 1px solid var(--chat-border, #e5e7eb);\n  color: #6b7280;\n}\n.chat-widget__feedback-cancel:hover {\n  background: rgba(0, 0, 0, 0.05);\n}\n.chat-widget__feedback-submit {\n  background: var(--chat-primary, #3b82f6);\n  border: none;\n  color: var(--chat-primary-text, #ffffff);\n}\n.chat-widget__feedback-submit:hover:not(:disabled) {\n  background: var(--chat-primary-hover, #2563eb);\n}\n.chat-widget__feedback-submit:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.chat-widget__feedback-wrapper {\n  position: relative;\n}\n");
+
+// lib/components/MessageFeedback.tsx
+import { MessageSquare, ThumbsDown, ThumbsUp } from "lucide-react";
+import { useCallback as useCallback2, useEffect as useEffect2, useState as useState3 } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var classNames = {
+  wrapper: "chat-widget__feedback-wrapper",
+  container: "chat-widget__feedback",
+  button: "chat-widget__feedback-button",
+  buttonPositive: "chat-widget__feedback-button--positive",
+  buttonNegative: "chat-widget__feedback-button--negative",
+  buttonComment: "chat-widget__feedback-button--comment",
+  buttonSelected: "chat-widget__feedback-button--selected",
+  buttonHasContent: "chat-widget__feedback-button--has-content",
+  icon: "chat-widget__feedback-icon",
+  commentSection: "chat-widget__feedback-comment-section",
+  commentHeader: "chat-widget__feedback-comment-header",
+  commentRequired: "chat-widget__feedback-comment-required",
+  textarea: "chat-widget__feedback-textarea",
+  actions: "chat-widget__feedback-actions",
+  cancelButton: "chat-widget__feedback-cancel",
+  submitButton: "chat-widget__feedback-submit"
+};
+var MessageFeedback = ({
+  messageId,
+  existingRating,
+  existingComment,
+  isSubmitting,
+  requireCommentForNegative = false,
+  onSubmit
+}) => {
+  const [savedRating, setSavedRating] = useState3(existingRating ?? null);
+  const [savedComment, setSavedComment] = useState3(existingComment ?? "");
+  const [pendingRating, setPendingRating] = useState3(null);
+  const [showCommentBox, setShowCommentBox] = useState3(false);
+  const [commentText, setCommentText] = useState3(existingComment ?? "");
+  useEffect2(() => {
+    if (existingRating) {
+      setSavedRating(existingRating);
+    }
+    if (existingComment !== void 0) {
+      setSavedComment(existingComment);
+      setCommentText(existingComment);
+    }
+  }, [existingRating, existingComment]);
+  const handlePositiveClick = useCallback2(() => {
+    setSavedRating("positive");
+    setPendingRating(null);
+    onSubmit(messageId, "positive", commentText.trim() || void 0);
+  }, [messageId, commentText, onSubmit]);
+  const handleNegativeClick = useCallback2(() => {
+    if (requireCommentForNegative) {
+      setPendingRating("negative");
+      setShowCommentBox(true);
+    } else {
+      setSavedRating("negative");
+      setPendingRating(null);
+      onSubmit(messageId, "negative", commentText.trim() || void 0);
+    }
+  }, [messageId, commentText, requireCommentForNegative, onSubmit]);
+  const handleCommentToggle = useCallback2(() => {
+    if (showCommentBox) {
+      setShowCommentBox(false);
+      if (pendingRating === "negative" && requireCommentForNegative) {
+        setPendingRating(null);
+      }
+      setCommentText(savedComment);
+    } else {
+      setShowCommentBox(true);
+    }
+  }, [showCommentBox, pendingRating, requireCommentForNegative, savedComment]);
+  const handleCommentCancel = useCallback2(() => {
+    setShowCommentBox(false);
+    setCommentText(savedComment);
+    if (pendingRating === "negative" && requireCommentForNegative) {
+      setPendingRating(null);
+    }
+  }, [pendingRating, requireCommentForNegative, savedComment]);
+  const handleCommentSubmit = useCallback2(() => {
+    const ratingToSubmit = pendingRating ?? savedRating;
+    if (!ratingToSubmit) {
+      return;
+    }
+    if (ratingToSubmit === "negative" && requireCommentForNegative && !commentText.trim()) {
+      return;
+    }
+    onSubmit(messageId, ratingToSubmit, commentText.trim() || void 0);
+    setSavedRating(ratingToSubmit);
+    setSavedComment(commentText.trim());
+    setPendingRating(null);
+    setShowCommentBox(false);
+  }, [messageId, pendingRating, savedRating, commentText, requireCommentForNegative, onSubmit]);
+  const displayRating = pendingRating ?? savedRating;
+  const isPositiveSelected = displayRating === "positive";
+  const isNegativeSelected = displayRating === "negative";
+  const isCommentRequired = isNegativeSelected && requireCommentForNegative;
+  const canSubmitComment = !isCommentRequired || commentText.trim().length > 0;
+  const hasComment = savedComment.length > 0;
+  return /* @__PURE__ */ jsxs("div", { className: classNames.wrapper, children: [
+    /* @__PURE__ */ jsxs("div", { className: classNames.container, children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: `${classNames.button} ${classNames.buttonPositive} ${isPositiveSelected ? classNames.buttonSelected : ""}`,
+          onClick: handlePositiveClick,
+          disabled: isSubmitting,
+          title: "Good response",
+          "aria-label": "Mark as good response",
+          children: /* @__PURE__ */ jsx(ThumbsUp, { className: classNames.icon })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: `${classNames.button} ${classNames.buttonNegative} ${isNegativeSelected ? classNames.buttonSelected : ""}`,
+          onClick: handleNegativeClick,
+          disabled: isSubmitting,
+          title: "Could be improved",
+          "aria-label": "Mark as could be improved",
+          children: /* @__PURE__ */ jsx(ThumbsDown, { className: classNames.icon })
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: `${classNames.button} ${classNames.buttonComment} ${showCommentBox ? classNames.buttonSelected : ""} ${hasComment ? classNames.buttonHasContent : ""}`,
+          onClick: handleCommentToggle,
+          disabled: isSubmitting,
+          title: "Add comment",
+          "aria-label": "Add comment",
+          children: /* @__PURE__ */ jsx(MessageSquare, { className: classNames.icon })
+        }
+      )
+    ] }),
+    showCommentBox && /* @__PURE__ */ jsxs("div", { className: classNames.commentSection, children: [
+      /* @__PURE__ */ jsxs("div", { className: classNames.commentHeader, children: [
+        /* @__PURE__ */ jsx("span", { children: "Add a comment" }),
+        isCommentRequired && /* @__PURE__ */ jsx("span", { className: classNames.commentRequired, children: "Required" })
+      ] }),
+      /* @__PURE__ */ jsx(
+        "textarea",
+        {
+          className: classNames.textarea,
+          placeholder: isNegativeSelected ? "What could be improved?" : "Share your thoughts...",
+          value: commentText,
+          onChange: (e) => setCommentText(e.target.value),
+          rows: 5
+        }
+      ),
+      /* @__PURE__ */ jsxs("div", { className: classNames.actions, children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: classNames.cancelButton,
+            onClick: handleCommentCancel,
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: classNames.submitButton,
+            onClick: handleCommentSubmit,
+            disabled: isSubmitting || !canSubmitComment || !displayRating,
+            children: displayRating ? "Save" : "Select Rating First"
+          }
+        )
+      ] })
+    ] })
+  ] });
+};
+
 // lib/components/SpeechToTextButton.tsx
 import { Mic, MicOff } from "lucide-react";
 import {
-  useCallback,
-  useEffect as useEffect2,
+  useCallback as useCallback3,
+  useEffect as useEffect3,
   useRef,
-  useState as useState2
+  useState as useState4
 } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var getSpeechRecognitionCtor = () => {
   if (typeof window === "undefined") return null;
   const win = window;
@@ -9020,36 +9283,36 @@ function SpeechToTextButton({
   disabled,
   className
 }) {
-  const [isListening, setIsListening] = useState2(false);
-  const [isSupported, setIsSupported] = useState2(false);
-  const [countdown, setCountdown] = useState2(0);
+  const [isListening, setIsListening] = useState4(false);
+  const [isSupported, setIsSupported] = useState4(false);
+  const [countdown, setCountdown] = useState4(0);
   const recognitionRef = useRef(null);
-  const [countdownActive, setCountdownActive] = useState2(false);
+  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 recognitionLanguage = language ?? "en-US";
-  const clearSilenceTimer = useCallback(() => {
+  const clearSilenceTimer = useCallback3(() => {
     if (silenceTimer.current) {
       clearTimeout(silenceTimer.current);
       silenceTimer.current = null;
     }
   }, []);
-  const clearCountdownFrame = useCallback(() => {
+  const clearCountdownFrame = useCallback3(() => {
     if (countdownFrameRef.current) {
       cancelAnimationFrame(countdownFrameRef.current);
       countdownFrameRef.current = null;
     }
   }, []);
-  const clearFinalTimer = useCallback(() => {
+  const clearFinalTimer = useCallback3(() => {
     if (finalTimer.current) {
       clearTimeout(finalTimer.current);
       finalTimer.current = null;
     }
   }, []);
-  const stopListening = useCallback(() => {
+  const stopListening = useCallback3(() => {
     clearSilenceTimer();
     clearFinalTimer();
     clearCountdownFrame();
@@ -9058,26 +9321,26 @@ function SpeechToTextButton({
     countdownEndRef.current = 0;
     recognitionRef.current?.stop();
   }, [clearSilenceTimer, clearFinalTimer, clearCountdownFrame]);
-  const handleRecognitionError = useCallback((message) => {
+  const handleRecognitionError = useCallback3((message) => {
     console.error("Speech recognition error:", message);
     onError?.(message);
   }, [onError]);
-  const resetSilenceTimer = useCallback(() => {
+  const resetSilenceTimer = useCallback3(() => {
     if (!silenceTimeout) return;
     clearSilenceTimer();
     silenceTimer.current = setTimeout(stopListening, silenceTimeout);
   }, [silenceTimeout, clearSilenceTimer, stopListening]);
-  const dispatchInterim = useCallback((text3) => {
+  const dispatchInterim = useCallback3((text3) => {
     if (text3) {
       onInterim?.(text3);
     }
   }, [onInterim]);
-  const dispatchFinal = useCallback((text3) => {
+  const dispatchFinal = useCallback3((text3) => {
     if (text3) {
       onFinal?.(text3);
     }
   }, [onFinal]);
-  const flushFinalText = useCallback(() => {
+  const flushFinalText = useCallback3(() => {
     const buffered = finalTextRef.current.trim();
     if (buffered) {
       dispatchFinal(buffered);
@@ -9085,7 +9348,7 @@ function SpeechToTextButton({
     finalTextRef.current = "";
     clearFinalTimer();
   }, [dispatchFinal, clearFinalTimer]);
-  const updateCountdown = useCallback(() => {
+  const updateCountdown = useCallback3(() => {
     if (!countdownEndRef.current || !finalDelay) {
       setCountdown(0);
       setCountdownActive(false);
@@ -9102,7 +9365,7 @@ function SpeechToTextButton({
     }
     countdownFrameRef.current = requestAnimationFrame(updateCountdown);
   }, [finalDelay]);
-  const startCountdown = useCallback(() => {
+  const startCountdown = useCallback3(() => {
     if (!finalDelay) {
       setCountdown(0);
       setCountdownActive(false);
@@ -9114,7 +9377,7 @@ function SpeechToTextButton({
     clearCountdownFrame();
     countdownFrameRef.current = requestAnimationFrame(updateCountdown);
   }, [finalDelay, clearCountdownFrame, updateCountdown]);
-  const scheduleFinalFlush = useCallback(() => {
+  const scheduleFinalFlush = useCallback3(() => {
     clearFinalTimer();
     if (!finalDelay) {
       flushFinalText();
@@ -9123,7 +9386,7 @@ function SpeechToTextButton({
     startCountdown();
     finalTimer.current = setTimeout(flushFinalText, finalDelay);
   }, [clearFinalTimer, finalDelay, flushFinalText, startCountdown]);
-  const attachRecognitionHandlers = useCallback((recognition) => {
+  const attachRecognitionHandlers = useCallback3((recognition) => {
     recognition.continuous = true;
     recognition.interimResults = true;
     recognition.lang = recognitionLanguage;
@@ -9181,7 +9444,7 @@ function SpeechToTextButton({
       }
     };
   }, [recognitionLanguage, resetSilenceTimer, startCountdown, dispatchInterim, scheduleFinalFlush, handleRecognitionError, onListeningChange, clearSilenceTimer, flushFinalText, countdownActive]);
-  const ensureRecognition = useCallback(() => {
+  const ensureRecognition = useCallback3(() => {
     if (typeof window === "undefined") {
       return null;
     }
@@ -9196,7 +9459,7 @@ function SpeechToTextButton({
     attachRecognitionHandlers(recognitionRef.current);
     return recognitionRef.current;
   }, [attachRecognitionHandlers, handleRecognitionError]);
-  const toggleListening = useCallback(() => {
+  const toggleListening = useCallback3(() => {
     if (disabled) {
       return;
     }
@@ -9214,15 +9477,15 @@ function SpeechToTextButton({
       handleRecognitionError("Microphone permission denied or unavailable.");
     }
   }, [disabled, isListening, stopListening, ensureRecognition, handleRecognitionError]);
-  useEffect2(() => {
+  useEffect3(() => {
     if (disabled && isListening) {
       stopListening();
     }
   }, [disabled, isListening, stopListening]);
-  useEffect2(() => {
+  useEffect3(() => {
     setIsSupported(typeof window !== "undefined" && !!getSpeechRecognitionCtor());
   }, []);
-  useEffect2(() => {
+  useEffect3(() => {
     return () => {
       clearSilenceTimer();
       clearFinalTimer();
@@ -9234,7 +9497,7 @@ function SpeechToTextButton({
   if (!isSupported) {
     return null;
   }
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsxs2(
     "button",
     {
       type: "button",
@@ -9248,8 +9511,8 @@ function SpeechToTextButton({
       "aria-pressed": isListening,
       "aria-label": "Toggle microphone",
       children: [
-        isListening ? /* @__PURE__ */ jsx(Mic, { className: "chat-widget__mic-icon" }) : /* @__PURE__ */ jsx(MicOff, { className: "chat-widget__mic-icon" }),
-        finalDelay > 0 && isListening && countdownActive && /* @__PURE__ */ jsx("span", { className: "chat-widget__mic-bar", "aria-hidden": "true", children: /* @__PURE__ */ jsx(
+        isListening ? /* @__PURE__ */ jsx2(Mic, { className: "chat-widget__mic-icon" }) : /* @__PURE__ */ jsx2(MicOff, { className: "chat-widget__mic-icon" }),
+        finalDelay > 0 && isListening && countdownActive && /* @__PURE__ */ jsx2("span", { className: "chat-widget__mic-bar", "aria-hidden": "true", children: /* @__PURE__ */ jsx2(
           "span",
           {
             className: "chat-widget__mic-bar-fill",
@@ -9262,12 +9525,12 @@ function SpeechToTextButton({
 }
 
 // lib/components/ChatWidget.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 var FormattedMarkdown = ({ children }) => {
   const MarkdownComponent = ReactMarkdown;
-  return /* @__PURE__ */ jsx2(MarkdownComponent, { remarkPlugins: [remarkGfm], children: children.replace(/\n\n/gi, "\n\n \n\n") });
+  return /* @__PURE__ */ jsx3(MarkdownComponent, { remarkPlugins: [remarkGfm], children: children.replace(/\n\n/gi, "\n\n \n\n") });
 };
-var classNames = {
+var classNames2 = {
   container: "chat-widget",
   header: "chat-widget__header",
   headerTitle: "chat-widget__title",
@@ -9340,7 +9603,8 @@ function ChatWidget({
   styles: styleProps,
   voice,
   speechToText,
-  widgets
+  widgets,
+  feedback
 }) {
   const theme = useMemo(
     () => ({ ...defaultTheme, ...styleProps || {} }),
@@ -9366,9 +9630,9 @@ function ChatWidget({
     }),
     [theme]
   );
-  const [input, setInput] = useState3("");
-  const [isMicActive, setIsMicActive] = useState3(false);
-  const [isSpeechPending, setIsSpeechPending] = useState3(false);
+  const [input, setInput] = useState5("");
+  const [isMicActive, setIsMicActive] = useState5(false);
+  const [isSpeechPending, setIsSpeechPending] = useState5(false);
   const messagesEndRef = useRef2(null);
   const textareaRef = useRef2(null);
   const {
@@ -9388,6 +9652,23 @@ function ChatWidget({
     onFinish,
     onMessage
   });
+  const feedbackEnabled = feedback?.enabled !== false;
+  const {
+    submitFeedback,
+    getFeedbackForMessage,
+    isSubmitting: feedbackSubmitting
+  } = useFeedback({
+    api,
+    threadId,
+    agentId: agentId ?? void 0,
+    agentExecutionId: agentExecutionId ?? void 0
+  });
+  const handleFeedbackSubmit = useCallback4(
+    (messageId, rating, improvementText) => {
+      submitFeedback({ messageId, rating, improvementText });
+    },
+    [submitFeedback]
+  );
   const voiceConfig = useMemo(() => {
     if (!voice || voice.enabled === false || !voice.url) {
       return null;
@@ -9412,7 +9693,7 @@ function ChatWidget({
       buildPayload
     };
   }, [voice]);
-  useEffect3(() => {
+  useEffect4(() => {
     if (introMessage && messages.length === 0) {
       setMessages([{
         id: "welcome-message",
@@ -9421,16 +9702,16 @@ function ChatWidget({
       }]);
     }
   }, [introMessage, messages.length, setMessages]);
-  useEffect3(() => {
+  useEffect4(() => {
     messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });
   }, [messages, status]);
-  useEffect3(() => {
+  useEffect4(() => {
     const timer = setTimeout(() => {
       textareaRef.current?.focus();
     }, 150);
     return () => clearTimeout(timer);
   }, []);
-  useEffect3(() => {
+  useEffect4(() => {
     if (status === "ready") {
       textareaRef.current?.focus();
     }
@@ -9438,7 +9719,7 @@ function ChatWidget({
       setIsSpeechPending(false);
     }
   }, [status]);
-  const sendText = useCallback2((raw) => {
+  const sendText = useCallback4((raw) => {
     const text3 = (raw ?? input).trim();
     if (!text3 || status !== "ready") return false;
     sendMessage({ text: text3 });
@@ -9459,10 +9740,10 @@ function ChatWidget({
     }
   };
   const speechEnabled = speechToText?.enabled !== false;
-  const handleSpeechInterim = useCallback2((text3) => {
+  const handleSpeechInterim = useCallback4((text3) => {
     setInput(text3);
   }, [setInput]);
-  const handleSpeechFinal = useCallback2((text3) => {
+  const handleSpeechFinal = useCallback4((text3) => {
     const finalText = text3?.trim();
     if (!finalText || isSpeechPending) return;
     setInput(finalText);
@@ -9471,28 +9752,28 @@ function ChatWidget({
       setIsSpeechPending(true);
     }
   }, [sendText, setInput, isSpeechPending]);
-  useEffect3(() => {
+  useEffect4(() => {
     if (!speechEnabled) {
       setIsMicActive(false);
     }
   }, [speechEnabled]);
-  const renderOutput = useCallback2(
+  const renderOutput = useCallback4(
     (messageId, content) => content.map((entry, index) => {
       if (typeof entry === "string") {
-        return /* @__PURE__ */ jsx2("div", { className: "chat-widget__markdown", children: /* @__PURE__ */ jsx2(FormattedMarkdown, { children: entry }) }, `${messageId}-text-${index}`);
+        return /* @__PURE__ */ jsx3("div", { className: "chat-widget__markdown", children: /* @__PURE__ */ jsx3(FormattedMarkdown, { children: entry }) }, `${messageId}-text-${index}`);
       }
       if (!("widgetType" in entry)) {
         return null;
       }
       const widgetDef = widgets?.find((w) => w.widgetType === entry.widgetType);
       if (!widgetDef) {
-        return /* @__PURE__ */ jsxs2("span", { children: [
+        return /* @__PURE__ */ jsxs3("span", { children: [
           "[Unknown widget: ",
           entry.widgetType,
           "]"
         ] }, `${messageId}-unknown-${index}`);
       }
-      return /* @__PURE__ */ jsx2("div", { className: "chat-widget__widget", children: widgetDef.render(entry) }, `${messageId}-widget-${index}`);
+      return /* @__PURE__ */ jsx3("div", { className: "chat-widget__widget", children: widgetDef.render(entry) }, `${messageId}-widget-${index}`);
     }),
     [widgets]
   );
@@ -9500,7 +9781,7 @@ function ChatWidget({
     threadId: "",
     widgets: null
   });
-  useEffect3(() => {
+  useEffect4(() => {
     if (!widgets || widgets.length === 0) return;
     const alreadyRegistered = lastRegisteredRef.current.threadId === threadId && lastRegisteredRef.current.widgets === widgets;
     if (alreadyRegistered) return;
@@ -9510,54 +9791,65 @@ function ChatWidget({
       console.error("Failed to register chat widgets", err);
     });
   }, [api, threadId, widgets]);
-  return /* @__PURE__ */ jsxs2(
+  return /* @__PURE__ */ jsxs3(
     "div",
     {
-      className: cn(classNames.container, className),
+      className: cn(classNames2.container, className),
       style: themeVariables,
       "data-chat-widget": "",
       children: [
-        title && /* @__PURE__ */ jsx2("div", { className: classNames.header, children: /* @__PURE__ */ jsx2("h3", { className: classNames.headerTitle, children: title }) }),
-        /* @__PURE__ */ jsxs2("div", { className: classNames.messagesContainer, children: [
+        title && /* @__PURE__ */ jsx3("div", { className: classNames2.header, children: /* @__PURE__ */ jsx3("h3", { className: classNames2.headerTitle, children: title }) }),
+        /* @__PURE__ */ jsxs3("div", { className: classNames2.messagesContainer, children: [
           messages.map((message) => {
-            return /* @__PURE__ */ jsxs2("div", { className: classNames.messageWrapper, children: [
-              /* @__PURE__ */ jsx2(
+            return /* @__PURE__ */ jsxs3("div", { className: classNames2.messageWrapper, children: [
+              /* @__PURE__ */ jsx3(
                 "div",
                 {
                   className: cn(
-                    classNames.messageRow,
-                    message.role === "user" ? classNames.userMessageRow : classNames.assistantMessageRow
+                    classNames2.messageRow,
+                    message.role === "user" ? classNames2.userMessageRow : classNames2.assistantMessageRow
                   ),
-                  children: message.content.length > 0 && /* @__PURE__ */ jsx2(
+                  children: message.content.length > 0 && /* @__PURE__ */ jsx3(
                     "div",
                     {
                       className: cn(
-                        classNames.messageBubble,
-                        message.role === "user" ? classNames.userMessage : classNames.assistantMessage
+                        classNames2.messageBubble,
+                        message.role === "user" ? classNames2.userMessage : classNames2.assistantMessage
                       ),
                       children: renderOutput(`${message.id}-content`, message.content)
                     }
                   )
                 }
               ),
-              message.role === "assistant" && message.thoughts && message.thoughts.length > 0 && /* @__PURE__ */ jsx2("div", { className: classNames.thoughtsContainer, children: /* @__PURE__ */ jsxs2("details", { className: "chat-widget__details", children: [
-                /* @__PURE__ */ jsxs2("summary", { className: classNames.thoughtsSummary, children: [
-                  /* @__PURE__ */ jsx2("span", { className: classNames.thoughtsIconContainer, children: /* @__PURE__ */ jsx2(ChevronRight, { className: classNames.thoughtsIcon }) }),
-                  /* @__PURE__ */ jsx2("span", { children: "Thoughts" })
+              message.role === "assistant" && message.thoughts && message.thoughts.length > 0 && /* @__PURE__ */ jsx3("div", { className: classNames2.thoughtsContainer, children: /* @__PURE__ */ jsxs3("details", { className: "chat-widget__details", children: [
+                /* @__PURE__ */ jsxs3("summary", { className: classNames2.thoughtsSummary, children: [
+                  /* @__PURE__ */ jsx3("span", { className: classNames2.thoughtsIconContainer, children: /* @__PURE__ */ jsx3(ChevronRight, { className: classNames2.thoughtsIcon }) }),
+                  /* @__PURE__ */ jsx3("span", { children: "Thoughts" })
                 ] }),
-                /* @__PURE__ */ jsx2("div", { className: classNames.thoughtsContent, children: /* @__PURE__ */ jsx2("pre", { className: classNames.thoughtsText, children: renderOutput(`${message.id}-thoughts`, message.thoughts) }) })
-              ] }) })
+                /* @__PURE__ */ jsx3("div", { className: classNames2.thoughtsContent, children: /* @__PURE__ */ jsx3("pre", { className: classNames2.thoughtsText, children: renderOutput(`${message.id}-thoughts`, message.thoughts) }) })
+              ] }) }),
+              feedbackEnabled && message.role === "assistant" && message.id !== "welcome-message" && !(status === "streaming" && message === messages[messages.length - 1]) && /* @__PURE__ */ jsx3(
+                MessageFeedback,
+                {
+                  messageId: message.id,
+                  existingRating: getFeedbackForMessage(message.id)?.rating,
+                  existingComment: getFeedbackForMessage(message.id)?.comment,
+                  isSubmitting: feedbackSubmitting === message.id,
+                  requireCommentForNegative: feedback?.requireCommentForNegative,
+                  onSubmit: handleFeedbackSubmit
+                }
+              )
             ] }, message.id);
           }),
-          status === "streaming" && /* @__PURE__ */ jsx2("div", { className: classNames.loadingContainer, children: /* @__PURE__ */ jsx2("div", { className: classNames.loadingBubble, children: /* @__PURE__ */ jsxs2("div", { className: classNames.loadingDots, children: [
-            /* @__PURE__ */ jsx2("div", { className: classNames.loadingDot }),
-            /* @__PURE__ */ jsx2("div", { className: classNames.loadingDot, "data-delay": "1" }),
-            /* @__PURE__ */ jsx2("div", { className: classNames.loadingDot, "data-delay": "2" })
+          status === "streaming" && /* @__PURE__ */ jsx3("div", { className: classNames2.loadingContainer, children: /* @__PURE__ */ jsx3("div", { className: classNames2.loadingBubble, children: /* @__PURE__ */ jsxs3("div", { className: classNames2.loadingDots, children: [
+            /* @__PURE__ */ jsx3("div", { className: classNames2.loadingDot }),
+            /* @__PURE__ */ jsx3("div", { className: classNames2.loadingDot, "data-delay": "1" }),
+            /* @__PURE__ */ jsx3("div", { className: classNames2.loadingDot, "data-delay": "2" })
           ] }) }) }),
-          /* @__PURE__ */ jsx2("div", { ref: messagesEndRef })
+          /* @__PURE__ */ jsx3("div", { ref: messagesEndRef })
         ] }),
-        /* @__PURE__ */ jsx2("div", { className: classNames.inputContainer, children: /* @__PURE__ */ jsxs2("form", { onSubmit: handleSubmit, className: classNames.inputForm, children: [
-          /* @__PURE__ */ jsx2(
+        /* @__PURE__ */ jsx3("div", { className: classNames2.inputContainer, children: /* @__PURE__ */ jsxs3("form", { onSubmit: handleSubmit, className: classNames2.inputForm, children: [
+          /* @__PURE__ */ jsx3(
             "textarea",
             {
               ref: textareaRef,
@@ -9567,13 +9859,13 @@ function ChatWidget({
               placeholder: inputPlaceholder,
               disabled: status !== "ready",
               rows: 1,
-              className: classNames.textarea
+              className: classNames2.textarea
             }
           ),
-          /* @__PURE__ */ jsx2("div", { className: classNames.toolbar, children: speechEnabled && /* @__PURE__ */ jsx2(
+          /* @__PURE__ */ jsx3("div", { className: classNames2.toolbar, children: speechEnabled && /* @__PURE__ */ jsx3(
             SpeechToTextButton,
             {
-              className: classNames.micButton,
+              className: classNames2.micButton,
               disabled: status !== "ready",
               silenceTimeout: speechToText?.silenceTimeout,
               language: speechToText?.language,
@@ -9584,14 +9876,14 @@ function ChatWidget({
               onListeningChange: setIsMicActive
             }
           ) }),
-          /* @__PURE__ */ jsx2(
+          /* @__PURE__ */ jsx3(
             "button",
             {
               type: "button",
               onClick: status === "streaming" ? stop : handleSendMessage,
               disabled: status === "streaming" ? false : !input.trim() || status !== "ready",
-              className: classNames.submitButton,
-              children: status === "streaming" ? /* @__PURE__ */ jsx2(StopCircle, { className: classNames.sendIcon }) : /* @__PURE__ */ jsx2(Send, { className: classNames.sendIcon })
+              className: classNames2.submitButton,
+              children: status === "streaming" ? /* @__PURE__ */ jsx3(StopCircle, { className: classNames2.sendIcon }) : /* @__PURE__ */ jsx3(Send, { className: classNames2.sendIcon })
             }
           )
         ] }) })
@@ -9604,14 +9896,14 @@ function ChatWidget({
 styleInject(".chat-popup__anchor {\n  position: fixed;\n  inset-block-end: 20px;\n  inset-inline-end: 20px;\n}\n.chat-popup--start {\n  inset-inline-end: auto;\n  inset-inline-start: 20px;\n}\n.chat-popup__anchor-button {\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-popup__anchor-button:hover {\n  background: var(--chat-primary-hover);\n}\n.chat-popup__anchor-icon {\n  width: 1.1rem;\n  height: 1.1rem;\n}\n.chat-popup__panel {\n  position: fixed;\n  inset-block-end: 20px;\n  inset-inline-end: 20px;\n  z-index: 99998;\n  transition: opacity 0.15s ease, visibility 0.15s ease;\n}\n.chat-popup--start.chat-popup__panel {\n  inset-inline-end: auto;\n  inset-inline-start: 20px;\n}\n.chat-popup__panel--open {\n  opacity: 1;\n  visibility: visible;\n  pointer-events: auto;\n}\n.chat-popup__panel--closed {\n  opacity: 0;\n  visibility: hidden;\n  pointer-events: none;\n}\n.chat-popup__panel-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: visible;\n  background: var(--chat-background);\n  border: 1px solid var(--chat-border);\n  position: relative;\n}\n.chat-popup__close {\n  position: absolute;\n  top: 0;\n  z-index: 10;\n  transform: translate(30%, -40%);\n}\n.chat-popup__close--end {\n  inset-inline-end: 0;\n}\n.chat-popup__close--start {\n  inset-inline-start: 0;\n}\n.chat-popup__close-button {\n  border: none;\n  background: var(--chat-primary);\n  color: var(--chat-primary-text);\n  width: 32px;\n  height: 32px;\n  border-radius: 999px;\n  cursor: pointer;\n  display: grid;\n  place-items: center;\n  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.2);\n}\n.chat-popup__close-button:hover {\n  background: var(--chat-primary-hover);\n}\n.chat-popup__close-icon {\n  width: 16px;\n  height: 16px;\n}\n");
 
 // lib/components/PopupChatWidget.tsx
-import { MessageSquare, X } from "lucide-react";
-import { useEffect as useEffect4, useMemo as useMemo2, useState as useState4 } from "react";
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { MessageSquare as MessageSquare2, X } from "lucide-react";
+import { useEffect as useEffect5, useMemo as useMemo2, useState as useState6 } from "react";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 function PopupChatWidget({ anchor, ...props }) {
-  const [isOpen, setIsOpen] = useState4(anchor?.initiallyOpen ?? false);
-  const [hasOpened, setHasOpened] = useState4(anchor?.initiallyOpen ?? false);
+  const [isOpen, setIsOpen] = useState6(anchor?.initiallyOpen ?? false);
+  const [hasOpened, setHasOpened] = useState6(anchor?.initiallyOpen ?? false);
   const openResolved = props.openOverride ?? isOpen;
-  useEffect4(() => {
+  useEffect5(() => {
     if (props.openOverride === void 0) return;
     setIsOpen(props.openOverride);
     if (props.openOverride) {
@@ -9663,8 +9955,8 @@ function PopupChatWidget({ anchor, ...props }) {
       maxHeight: size.maxHeight ?? "calc(100vh - 140px)"
     };
   }, [props.popupSize]);
-  return /* @__PURE__ */ jsxs3("div", { style: themeStyle, children: [
-    /* @__PURE__ */ jsx3("div", { className: cn("chat-popup__anchor", anchorPositionClass), children: anchor?.render ? anchor.render({ isOpen: openResolved, toggle: handleToggle }) : !openResolved && /* @__PURE__ */ jsxs3(
+  return /* @__PURE__ */ jsxs4("div", { style: themeStyle, children: [
+    /* @__PURE__ */ jsx4("div", { className: cn("chat-popup__anchor", anchorPositionClass), children: anchor?.render ? anchor.render({ isOpen: openResolved, toggle: handleToggle }) : !openResolved && /* @__PURE__ */ jsxs4(
       "button",
       {
         type: "button",
@@ -9673,12 +9965,12 @@ function PopupChatWidget({ anchor, ...props }) {
         "aria-expanded": isOpen,
         "aria-label": anchor?.label ?? "Open chat",
         children: [
-          /* @__PURE__ */ jsx3(MessageSquare, { className: "chat-popup__anchor-icon" }),
-          /* @__PURE__ */ jsx3("span", { children: anchor?.label ?? "Chat" })
+          /* @__PURE__ */ jsx4(MessageSquare2, { className: "chat-popup__anchor-icon" }),
+          /* @__PURE__ */ jsx4("span", { children: anchor?.label ?? "Chat" })
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx3(
+    /* @__PURE__ */ jsx4(
       "div",
       {
         className: cn(
@@ -9686,27 +9978,27 @@ function PopupChatWidget({ anchor, ...props }) {
           anchorPositionClass,
           openResolved ? "chat-popup__panel--open" : "chat-popup__panel--closed"
         ),
-        children: /* @__PURE__ */ jsxs3("div", { className: "chat-popup__panel-inner", style: popupStyle, children: [
-          showClose && /* @__PURE__ */ jsx3(
+        children: /* @__PURE__ */ jsxs4("div", { className: "chat-popup__panel-inner", style: popupStyle, children: [
+          showClose && /* @__PURE__ */ jsx4(
             "div",
             {
               className: cn(
                 "chat-popup__close",
                 closeConfig?.position === "top-start" ? "chat-popup__close--start" : "chat-popup__close--end"
               ),
-              children: closeConfig?.render ? closeConfig.render({ toggle: handleToggle }) : /* @__PURE__ */ jsx3(
+              children: closeConfig?.render ? closeConfig.render({ toggle: handleToggle }) : /* @__PURE__ */ jsx4(
                 "button",
                 {
                   type: "button",
                   className: "chat-popup__close-button",
                   onClick: handleToggle,
                   "aria-label": "Close chat",
-                  children: /* @__PURE__ */ jsx3(X, { className: "chat-popup__close-icon" })
+                  children: /* @__PURE__ */ jsx4(X, { className: "chat-popup__close-icon" })
                 }
               )
             }
           ),
-          hasOpened && /* @__PURE__ */ jsx3(ChatWidget, { ...props })
+          hasOpened && /* @__PURE__ */ jsx4(ChatWidget, { ...props })
         ] })
       }
     )
@@ -9715,7 +10007,7 @@ function PopupChatWidget({ anchor, ...props }) {
 
 // lib/createChatWidget.tsx
 import { createRoot } from "react-dom/client";
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { jsx as jsx5 } from "react/jsx-runtime";
 var createChatWidget = (target, props) => {
   if (!target) {
     throw new Error("createChatWidget requires a valid DOM element to mount into.");
@@ -9723,7 +10015,7 @@ var createChatWidget = (target, props) => {
   const root2 = createRoot(target);
   let currentProps = props;
   const render = () => {
-    root2.render(/* @__PURE__ */ jsx4(ChatWidget, { ...currentProps }));
+    root2.render(/* @__PURE__ */ jsx5(ChatWidget, { ...currentProps }));
   };
   render();
   const mergeStyles = (nextStyles) => ({
@@ -9764,16 +10056,16 @@ var createWidget = ({
 });
 
 // lib/widgets/default-widgets.tsx
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
 var defaultChatWidgets = [
   createWidget({
-    widgetType: "person_card",
+    widgetType: "person-card",
     schema: zod_default.object({
       name: zod_default.string(),
       profileUri: zod_default.string().optional(),
       details: zod_default.record(zod_default.any()).optional()
-    }),
-    render: (widget) => /* @__PURE__ */ jsx5(
+    }).describe("showing a person card with name, photo and additional details"),
+    render: (widget) => /* @__PURE__ */ jsx6(
       "div",
       {
         style: {
@@ -9786,8 +10078,8 @@ var defaultChatWidgets = [
           borderRadius: "0.5rem",
           boxShadow: "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)"
         },
-        children: /* @__PURE__ */ jsxs4("div", { style: { display: "flex", alignItems: "flex-start", gap: "0.75rem" }, children: [
-          widget.profileUri && /* @__PURE__ */ jsx5(
+        children: /* @__PURE__ */ jsxs5("div", { style: { display: "flex", alignItems: "flex-start", gap: "0.75rem" }, children: [
+          widget.profileUri && /* @__PURE__ */ jsx6(
             "img",
             {
               src: widget.profileUri,
@@ -9802,14 +10094,14 @@ var defaultChatWidgets = [
               loading: "lazy"
             }
           ),
-          /* @__PURE__ */ jsxs4("div", { style: { flex: 1, minWidth: 0 }, children: [
-            /* @__PURE__ */ jsx5("div", { style: { fontWeight: 600, fontSize: "1rem", color: "#111827", marginBottom: "0.25rem" }, children: widget.name }),
-            widget.details ? /* @__PURE__ */ jsx5("div", { style: { display: "flex", flexDirection: "column", gap: "0.25rem" }, children: Object.entries(widget.details).map(([key, value]) => /* @__PURE__ */ jsxs4("div", { style: { display: "flex", gap: "0.5rem", fontSize: "0.875rem" }, children: [
-              /* @__PURE__ */ jsxs4("span", { style: { color: "#6b7280", fontWeight: 500, minWidth: "fit-content" }, children: [
+          /* @__PURE__ */ jsxs5("div", { style: { flex: 1, minWidth: 0 }, children: [
+            /* @__PURE__ */ jsx6("div", { style: { fontWeight: 600, fontSize: "1rem", color: "#111827", marginBottom: "0.25rem" }, children: widget.name }),
+            widget.details ? /* @__PURE__ */ jsx6("div", { style: { display: "flex", flexDirection: "column", gap: "0.25rem" }, children: Object.entries(widget.details).map(([key, value]) => /* @__PURE__ */ jsxs5("div", { style: { display: "flex", gap: "0.5rem", fontSize: "0.875rem" }, children: [
+              /* @__PURE__ */ jsxs5("span", { style: { color: "#6b7280", fontWeight: 500, minWidth: "fit-content" }, children: [
                 key,
                 ":"
               ] }),
-              /* @__PURE__ */ jsx5("span", { style: { color: "#374151" }, children: String(value) })
+              /* @__PURE__ */ jsx6("span", { style: { color: "#374151" }, children: String(value) })
             ] }, key)) }) : null
           ] })
         ] })
@@ -9821,8 +10113,8 @@ var defaultChatWidgets = [
     schema: zod_default.object({
       uri: zod_default.string().url(),
       text: zod_default.string().optional()
-    }),
-    render: (widget) => /* @__PURE__ */ jsx5(
+    }).describe("rendering a clickable link"),
+    render: (widget) => /* @__PURE__ */ jsx6(
       "a",
       {
         href: widget.uri,
@@ -9864,6 +10156,7 @@ export {
   createWidget,
   defaultChatWidgets,
   registerChatWidgets,
-  useChat
+  useChat,
+  useFeedback
 };
 //# sourceMappingURL=index.js.map