@btst/stack 1.4.0 → 1.5.0

package/dist/node_modules/.pnpm/react-day-picker@9.12.0_react@19.2.0/node_modules/react-day-picker/dist/esm/utils/rangeIncludesDate.cjs

@@ -0,0 +1,37 @@
+'use strict';
+
+const DateLib = require('../classes/DateLib.cjs');
+
+/**
+ * Checks if a given date is within a specified date range.
+ *
+ * @since 9.0.0
+ * @param range - The date range to check against.
+ * @param date - The date to check.
+ * @param excludeEnds - If `true`, the range's start and end dates are excluded.
+ * @param dateLib - The date utility library instance.
+ * @returns `true` if the date is within the range, otherwise `false`.
+ * @group Utilities
+ */
+function rangeIncludesDate(range, date, excludeEnds = false, dateLib = DateLib.defaultDateLib) {
+    let { from, to } = range;
+    const { differenceInCalendarDays, isSameDay } = dateLib;
+    if (from && to) {
+        const isRangeInverted = differenceInCalendarDays(to, from) < 0;
+        if (isRangeInverted) {
+            [from, to] = [to, from];
+        }
+        const isInRange = differenceInCalendarDays(date, from) >= (excludeEnds ? 1 : 0) &&
+            differenceInCalendarDays(to, date) >= (excludeEnds ? 1 : 0);
+        return isInRange;
+    }
+    if (!excludeEnds && to) {
+        return isSameDay(to, date);
+    }
+    if (!excludeEnds && from) {
+        return isSameDay(from, date);
+    }
+    return false;
+}
+
+exports.rangeIncludesDate = rangeIncludesDate;

package/dist/node_modules/.pnpm/react-day-picker@9.12.0_react@19.2.0/node_modules/react-day-picker/dist/esm/utils/rangeIncludesDate.mjs

@@ -0,0 +1,35 @@
+import { defaultDateLib } from '../classes/DateLib.mjs';
+
+/**
+ * Checks if a given date is within a specified date range.
+ *
+ * @since 9.0.0
+ * @param range - The date range to check against.
+ * @param date - The date to check.
+ * @param excludeEnds - If `true`, the range's start and end dates are excluded.
+ * @param dateLib - The date utility library instance.
+ * @returns `true` if the date is within the range, otherwise `false`.
+ * @group Utilities
+ */
+function rangeIncludesDate(range, date, excludeEnds = false, dateLib = defaultDateLib) {
+    let { from, to } = range;
+    const { differenceInCalendarDays, isSameDay } = dateLib;
+    if (from && to) {
+        const isRangeInverted = differenceInCalendarDays(to, from) < 0;
+        if (isRangeInverted) {
+            [from, to] = [to, from];
+        }
+        const isInRange = differenceInCalendarDays(date, from) >= (excludeEnds ? 1 : 0) &&
+            differenceInCalendarDays(to, date) >= (excludeEnds ? 1 : 0);
+        return isInRange;
+    }
+    if (!excludeEnds && to) {
+        return isSameDay(to, date);
+    }
+    if (!excludeEnds && from) {
+        return isSameDay(from, date);
+    }
+    return false;
+}
+
+export { rangeIncludesDate };

package/dist/node_modules/.pnpm/react-day-picker@9.12.0_react@19.2.0/node_modules/react-day-picker/dist/esm/utils/rangeOverlaps.cjs

@@ -0,0 +1,23 @@
+'use strict';
+
+const rangeIncludesDate = require('./rangeIncludesDate.cjs');
+const DateLib = require('../classes/DateLib.cjs');
+
+/**
+ * Determines if two date ranges overlap.
+ *
+ * @since 9.2.2
+ * @param rangeLeft - The first date range.
+ * @param rangeRight - The second date range.
+ * @param dateLib - The date utility library instance.
+ * @returns `true` if the ranges overlap, otherwise `false`.
+ * @group Utilities
+ */
+function rangeOverlaps(rangeLeft, rangeRight, dateLib = DateLib.defaultDateLib) {
+    return (rangeIncludesDate.rangeIncludesDate(rangeLeft, rangeRight.from, false, dateLib) ||
+        rangeIncludesDate.rangeIncludesDate(rangeLeft, rangeRight.to, false, dateLib) ||
+        rangeIncludesDate.rangeIncludesDate(rangeRight, rangeLeft.from, false, dateLib) ||
+        rangeIncludesDate.rangeIncludesDate(rangeRight, rangeLeft.to, false, dateLib));
+}
+
+exports.rangeOverlaps = rangeOverlaps;

package/dist/node_modules/.pnpm/react-day-picker@9.12.0_react@19.2.0/node_modules/react-day-picker/dist/esm/utils/rangeOverlaps.mjs

@@ -0,0 +1,21 @@
+import { rangeIncludesDate } from './rangeIncludesDate.mjs';
+import { defaultDateLib } from '../classes/DateLib.mjs';
+
+/**
+ * Determines if two date ranges overlap.
+ *
+ * @since 9.2.2
+ * @param rangeLeft - The first date range.
+ * @param rangeRight - The second date range.
+ * @param dateLib - The date utility library instance.
+ * @returns `true` if the ranges overlap, otherwise `false`.
+ * @group Utilities
+ */
+function rangeOverlaps(rangeLeft, rangeRight, dateLib = defaultDateLib) {
+    return (rangeIncludesDate(rangeLeft, rangeRight.from, false, dateLib) ||
+        rangeIncludesDate(rangeLeft, rangeRight.to, false, dateLib) ||
+        rangeIncludesDate(rangeRight, rangeLeft.from, false, dateLib) ||
+        rangeIncludesDate(rangeRight, rangeLeft.to, false, dateLib));
+}
+
+export { rangeOverlaps };

package/dist/node_modules/.pnpm/react-day-picker@9.12.0_react@19.2.0/node_modules/react-day-picker/dist/esm/utils/toTimeZone.cjs

@@ -0,0 +1,18 @@
+'use strict';
+
+const index = require('../../../../../../@date-fns_tz@1.4.1/node_modules/@date-fns/tz/date/index.cjs');
+require('../../../../../../@date-fns_tz@1.4.1/node_modules/@date-fns/tz/date/mini.cjs');
+
+/**
+ * Convert a {@link Date} or {@link TZDate} instance to the given time zone.
+ * Reuses the same instance when it is already a {@link TZDate} using the target
+ * time zone to avoid extra allocations.
+ */
+function toTimeZone(date, timeZone) {
+    if (date instanceof index.TZDate && date.timeZone === timeZone) {
+        return date;
+    }
+    return new index.TZDate(date, timeZone);
+}
+
+exports.toTimeZone = toTimeZone;

package/dist/node_modules/.pnpm/react-day-picker@9.12.0_react@19.2.0/node_modules/react-day-picker/dist/esm/utils/toTimeZone.mjs

@@ -0,0 +1,16 @@
+import { TZDate } from '../../../../../../@date-fns_tz@1.4.1/node_modules/@date-fns/tz/date/index.mjs';
+import '../../../../../../@date-fns_tz@1.4.1/node_modules/@date-fns/tz/date/mini.mjs';
+
+/**
+ * Convert a {@link Date} or {@link TZDate} instance to the given time zone.
+ * Reuses the same instance when it is already a {@link TZDate} using the target
+ * time zone to avoid extra allocations.
+ */
+function toTimeZone(date, timeZone) {
+    if (date instanceof TZDate && date.timeZone === timeZone) {
+        return date;
+    }
+    return new TZDate(date, timeZone);
+}
+
+export { toTimeZone };

package/dist/node_modules/.pnpm/react-day-picker@9.12.0_react@19.2.0/node_modules/react-day-picker/dist/esm/utils/typeguards.cjs

@@ -0,0 +1,73 @@
+'use strict';
+
+/**
+ * Checks if the given value is of type {@link DateInterval}.
+ *
+ * @param matcher - The value to check.
+ * @returns `true` if the value is a {@link DateInterval}, otherwise `false`.
+ * @group Utilities
+ */
+function isDateInterval(matcher) {
+    return Boolean(matcher &&
+        typeof matcher === "object" &&
+        "before" in matcher &&
+        "after" in matcher);
+}
+/**
+ * Checks if the given value is of type {@link DateRange}.
+ *
+ * @param value - The value to check.
+ * @returns `true` if the value is a {@link DateRange}, otherwise `false`.
+ * @group Utilities
+ */
+function isDateRange(value) {
+    return Boolean(value && typeof value === "object" && "from" in value);
+}
+/**
+ * Checks if the given value is of type {@link DateAfter}.
+ *
+ * @param value - The value to check.
+ * @returns `true` if the value is a {@link DateAfter}, otherwise `false`.
+ * @group Utilities
+ */
+function isDateAfterType(value) {
+    return Boolean(value && typeof value === "object" && "after" in value);
+}
+/**
+ * Checks if the given value is of type {@link DateBefore}.
+ *
+ * @param value - The value to check.
+ * @returns `true` if the value is a {@link DateBefore}, otherwise `false`.
+ * @group Utilities
+ */
+function isDateBeforeType(value) {
+    return Boolean(value && typeof value === "object" && "before" in value);
+}
+/**
+ * Checks if the given value is of type {@link DayOfWeek}.
+ *
+ * @param value - The value to check.
+ * @returns `true` if the value is a {@link DayOfWeek}, otherwise `false`.
+ * @group Utilities
+ */
+function isDayOfWeekType(value) {
+    return Boolean(value && typeof value === "object" && "dayOfWeek" in value);
+}
+/**
+ * Checks if the given value is an array of valid dates.
+ *
+ * @private
+ * @param value - The value to check.
+ * @param dateLib - The date utility library instance.
+ * @returns `true` if the value is an array of valid dates, otherwise `false`.
+ */
+function isDatesArray(value, dateLib) {
+    return Array.isArray(value) && value.every(dateLib.isDate);
+}
+
+exports.isDateAfterType = isDateAfterType;
+exports.isDateBeforeType = isDateBeforeType;
+exports.isDateInterval = isDateInterval;
+exports.isDateRange = isDateRange;
+exports.isDatesArray = isDatesArray;
+exports.isDayOfWeekType = isDayOfWeekType;

package/dist/node_modules/.pnpm/react-day-picker@9.12.0_react@19.2.0/node_modules/react-day-picker/dist/esm/utils/typeguards.mjs

@@ -0,0 +1,66 @@
+/**
+ * Checks if the given value is of type {@link DateInterval}.
+ *
+ * @param matcher - The value to check.
+ * @returns `true` if the value is a {@link DateInterval}, otherwise `false`.
+ * @group Utilities
+ */
+function isDateInterval(matcher) {
+    return Boolean(matcher &&
+        typeof matcher === "object" &&
+        "before" in matcher &&
+        "after" in matcher);
+}
+/**
+ * Checks if the given value is of type {@link DateRange}.
+ *
+ * @param value - The value to check.
+ * @returns `true` if the value is a {@link DateRange}, otherwise `false`.
+ * @group Utilities
+ */
+function isDateRange(value) {
+    return Boolean(value && typeof value === "object" && "from" in value);
+}
+/**
+ * Checks if the given value is of type {@link DateAfter}.
+ *
+ * @param value - The value to check.
+ * @returns `true` if the value is a {@link DateAfter}, otherwise `false`.
+ * @group Utilities
+ */
+function isDateAfterType(value) {
+    return Boolean(value && typeof value === "object" && "after" in value);
+}
+/**
+ * Checks if the given value is of type {@link DateBefore}.
+ *
+ * @param value - The value to check.
+ * @returns `true` if the value is a {@link DateBefore}, otherwise `false`.
+ * @group Utilities
+ */
+function isDateBeforeType(value) {
+    return Boolean(value && typeof value === "object" && "before" in value);
+}
+/**
+ * Checks if the given value is of type {@link DayOfWeek}.
+ *
+ * @param value - The value to check.
+ * @returns `true` if the value is a {@link DayOfWeek}, otherwise `false`.
+ * @group Utilities
+ */
+function isDayOfWeekType(value) {
+    return Boolean(value && typeof value === "object" && "dayOfWeek" in value);
+}
+/**
+ * Checks if the given value is an array of valid dates.
+ *
+ * @private
+ * @param value - The value to check.
+ * @param dateLib - The date utility library instance.
+ * @returns `true` if the value is an array of valid dates, otherwise `false`.
+ */
+function isDatesArray(value, dateLib) {
+    return Array.isArray(value) && value.every(dateLib.isDate);
+}
+
+export { isDateAfterType, isDateBeforeType, isDateInterval, isDateRange, isDatesArray, isDayOfWeekType };

package/dist/packages/better-stack/src/plugins/ai-chat/client/components/chat-interface.cjs

@@ -22,7 +22,8 @@ function ChatInterface({
   initialMessages,
   id,
   variant = "full",
-  className
+  className,
+  onMessagesChange
 }) {
   const {
     navigate,
@@ -31,7 +32,8 @@ function ChatInterface({
     apiBasePath,
     headers,
     mode,
-    showAttribution
+    showAttribution,
+    chatSuggestions
   } = context.usePluginOverrides(
     "ai-chat",
     { showAttribution: true }
@@ -57,6 +59,7 @@ function ChatInterface({
       setCurrentConversationId(id);
       isFirstMessageSentRef.current = false;
       hasNavigatedRef.current = false;
+      isEditInProgressRef.current = false;
     }
   }, [id, isPublicMode]);
   const { conversation, isLoading: isLoadingConversation } = chatHooks.useConversation(
@@ -73,6 +76,13 @@ function ChatInterface({
     }
   }, [currentConversationId, isPublicMode]);
   const editMessagesRef = React.useRef(null);
+  const isEditInProgressRef = React.useRef(false);
+  const [isMessagesInitialized, setIsMessagesInitialized] = React.useState(
+    () => (
+      // Start as initialized if there are no initialMessages to load
+      !initialMessages || initialMessages.length === 0
+    )
+  );
   const transport = React.useMemo(
     () => new ai.DefaultChatTransport({
       api: apiPath,
@@ -139,6 +149,9 @@ function ChatInterface({
     }
   });
   React.useEffect(() => {
+    if (isEditInProgressRef.current) {
+      return;
+    }
     if (conversation?.messages && conversation.messages.length > 0 && messages.length === 0) {
       const uiMessages = conversation.messages.filter((m) => m.role !== "data").map((m) => {
         let parts;
@@ -164,6 +177,7 @@ function ChatInterface({
   React.useEffect(() => {
     if (initialMessages && initialMessages.length > 0 && messages.length === 0) {
       setMessages(initialMessages);
+      setIsMessagesInitialized(true);
     }
   }, [initialMessages, setMessages, messages.length]);
   const [input, setInput] = React.useState("");
@@ -179,6 +193,11 @@ function ChatInterface({
       }
     }
   }, [messages]);
+  React.useEffect(() => {
+    if (isPublicMode && onMessagesChange && isMessagesInitialized) {
+      onMessagesChange(messages);
+    }
+  }, [messages, isPublicMode, onMessagesChange, isMessagesInitialized]);
   const handleInputChange = (e) => {
     setInput(e.target.value);
   };
@@ -224,6 +243,7 @@ function ChatInterface({
     if (pendingEdit && messages.length === pendingEdit.expectedLength) {
       const textToSend = pendingEdit.text;
       setPendingEdit(null);
+      isEditInProgressRef.current = false;
       sendMessage({ text: textToSend });
     }
   }, [messages.length, pendingEdit, sendMessage]);
@@ -234,6 +254,7 @@ function ChatInterface({
       const messageToEdit = messages[messageIndex];
       if (!messageToEdit || messageToEdit.role !== "user") return;
       const truncatedMessages = messages.slice(0, messageIndex);
+      isEditInProgressRef.current = true;
       editMessagesRef.current = truncatedMessages;
       setPendingEdit({ text: newText, expectedLength: messageIndex });
       setMessages(truncatedMessages);
@@ -259,7 +280,19 @@ function ChatInterface({
               isWidget ? "max-w-full" : "max-w-3xl mx-auto w-full"
             ),
             children: [
-              messages.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col items-center justify-center h-full min-h-[300px] text-muted-foreground", children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: localization.CHAT_EMPTY_STATE }) }) : messages.map((m, index) => /* @__PURE__ */ jsxRuntime.jsx(
+              messages.length === 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col h-full min-h-[300px]", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 flex items-center justify-center text-muted-foreground", children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: localization.CHAT_EMPTY_STATE }) }),
+                chatSuggestions && chatSuggestions.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap justify-center gap-2 pb-4 max-w-md mx-auto", children: chatSuggestions.map((suggestion, index) => /* @__PURE__ */ jsxRuntime.jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => setInput(suggestion),
+                    className: "px-3 py-2 text-sm rounded-lg border border-border bg-background hover:bg-accent hover:text-accent-foreground transition-colors text-foreground",
+                    children: suggestion
+                  },
+                  index
+                )) })
+              ] }) : messages.map((m, index) => /* @__PURE__ */ jsxRuntime.jsx(
                 chatMessage.ChatMessage,
                 {
                   message: m,

package/dist/packages/better-stack/src/plugins/ai-chat/client/components/chat-interface.mjs

@@ -20,7 +20,8 @@ function ChatInterface({
   initialMessages,
   id,
   variant = "full",
-  className
+  className,
+  onMessagesChange
 }) {
   const {
     navigate,
@@ -29,7 +30,8 @@ function ChatInterface({
     apiBasePath,
     headers,
     mode,
-    showAttribution
+    showAttribution,
+    chatSuggestions
   } = usePluginOverrides(
     "ai-chat",
     { showAttribution: true }
@@ -55,6 +57,7 @@ function ChatInterface({
       setCurrentConversationId(id);
       isFirstMessageSentRef.current = false;
       hasNavigatedRef.current = false;
+      isEditInProgressRef.current = false;
     }
   }, [id, isPublicMode]);
   const { conversation, isLoading: isLoadingConversation } = useConversation(
@@ -71,6 +74,13 @@ function ChatInterface({
     }
   }, [currentConversationId, isPublicMode]);
   const editMessagesRef = useRef(null);
+  const isEditInProgressRef = useRef(false);
+  const [isMessagesInitialized, setIsMessagesInitialized] = useState(
+    () => (
+      // Start as initialized if there are no initialMessages to load
+      !initialMessages || initialMessages.length === 0
+    )
+  );
   const transport = useMemo(
     () => new DefaultChatTransport({
       api: apiPath,
@@ -137,6 +147,9 @@ function ChatInterface({
     }
   });
   useEffect(() => {
+    if (isEditInProgressRef.current) {
+      return;
+    }
     if (conversation?.messages && conversation.messages.length > 0 && messages.length === 0) {
       const uiMessages = conversation.messages.filter((m) => m.role !== "data").map((m) => {
         let parts;
@@ -162,6 +175,7 @@ function ChatInterface({
   useEffect(() => {
     if (initialMessages && initialMessages.length > 0 && messages.length === 0) {
       setMessages(initialMessages);
+      setIsMessagesInitialized(true);
     }
   }, [initialMessages, setMessages, messages.length]);
   const [input, setInput] = useState("");
@@ -177,6 +191,11 @@ function ChatInterface({
       }
     }
   }, [messages]);
+  useEffect(() => {
+    if (isPublicMode && onMessagesChange && isMessagesInitialized) {
+      onMessagesChange(messages);
+    }
+  }, [messages, isPublicMode, onMessagesChange, isMessagesInitialized]);
   const handleInputChange = (e) => {
     setInput(e.target.value);
   };
@@ -222,6 +241,7 @@ function ChatInterface({
     if (pendingEdit && messages.length === pendingEdit.expectedLength) {
       const textToSend = pendingEdit.text;
       setPendingEdit(null);
+      isEditInProgressRef.current = false;
       sendMessage({ text: textToSend });
     }
   }, [messages.length, pendingEdit, sendMessage]);
@@ -232,6 +252,7 @@ function ChatInterface({
       const messageToEdit = messages[messageIndex];
       if (!messageToEdit || messageToEdit.role !== "user") return;
       const truncatedMessages = messages.slice(0, messageIndex);
+      isEditInProgressRef.current = true;
       editMessagesRef.current = truncatedMessages;
       setPendingEdit({ text: newText, expectedLength: messageIndex });
       setMessages(truncatedMessages);
@@ -257,7 +278,19 @@ function ChatInterface({
               isWidget ? "max-w-full" : "max-w-3xl mx-auto w-full"
             ),
             children: [
-              messages.length === 0 ? /* @__PURE__ */ jsx("div", { className: "flex flex-col items-center justify-center h-full min-h-[300px] text-muted-foreground", children: /* @__PURE__ */ jsx("p", { children: localization.CHAT_EMPTY_STATE }) }) : messages.map((m, index) => /* @__PURE__ */ jsx(
+              messages.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col h-full min-h-[300px]", children: [
+                /* @__PURE__ */ jsx("div", { className: "flex-1 flex items-center justify-center text-muted-foreground", children: /* @__PURE__ */ jsx("p", { children: localization.CHAT_EMPTY_STATE }) }),
+                chatSuggestions && chatSuggestions.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap justify-center gap-2 pb-4 max-w-md mx-auto", children: chatSuggestions.map((suggestion, index) => /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => setInput(suggestion),
+                    className: "px-3 py-2 text-sm rounded-lg border border-border bg-background hover:bg-accent hover:text-accent-foreground transition-colors text-foreground",
+                    children: suggestion
+                  },
+                  index
+                )) })
+              ] }) : messages.map((m, index) => /* @__PURE__ */ jsx(
                 ChatMessage,
                 {
                   message: m,

package/dist/packages/better-stack/src/plugins/ai-chat/client/components/chat-layout.cjs

@@ -17,7 +17,9 @@ function ChatLayout({
   layout = "full",
   className,
   showSidebar = true,
-  widgetHeight = "600px"
+  widgetHeight = "600px",
+  initialMessages,
+  onMessagesChange
 }) {
   const [sidebarOpen, setSidebarOpen] = React.useState(true);
   const [mobileSidebarOpen, setMobileSidebarOpen] = React.useState(false);
@@ -37,7 +39,16 @@ function ChatLayout({
           className
         ),
         style: { height: widgetHeight },
-        children: /* @__PURE__ */ jsxRuntime.jsx(chatInterface.ChatInterface, { apiPath, id: conversationId, variant: "widget" })
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          chatInterface.ChatInterface,
+          {
+            apiPath,
+            id: conversationId,
+            variant: "widget",
+            initialMessages,
+            onMessagesChange
+          }
+        )
       }
     );
   }
@@ -109,7 +120,9 @@ function ChatLayout({
             {
               apiPath,
               id: conversationId,
-              variant: "full"
+              variant: "full",
+              initialMessages,
+              onMessagesChange
             },
             `chat-${conversationId ?? "new"}-${chatResetKey}`
           )

package/dist/packages/better-stack/src/plugins/ai-chat/client/components/chat-layout.mjs

@@ -15,7 +15,9 @@ function ChatLayout({
   layout = "full",
   className,
   showSidebar = true,
-  widgetHeight = "600px"
+  widgetHeight = "600px",
+  initialMessages,
+  onMessagesChange
 }) {
   const [sidebarOpen, setSidebarOpen] = useState(true);
   const [mobileSidebarOpen, setMobileSidebarOpen] = useState(false);
@@ -35,7 +37,16 @@ function ChatLayout({
           className
         ),
         style: { height: widgetHeight },
-        children: /* @__PURE__ */ jsx(ChatInterface, { apiPath, id: conversationId, variant: "widget" })
+        children: /* @__PURE__ */ jsx(
+          ChatInterface,
+          {
+            apiPath,
+            id: conversationId,
+            variant: "widget",
+            initialMessages,
+            onMessagesChange
+          }
+        )
       }
     );
   }
@@ -107,7 +118,9 @@ function ChatLayout({
             {
               apiPath,
               id: conversationId,
-              variant: "full"
+              variant: "full",
+              initialMessages,
+              onMessagesChange
             },
             `chat-${conversationId ?? "new"}-${chatResetKey}`
           )

package/dist/packages/better-stack/src/plugins/ai-chat/client/components/chat-message.cjs

@@ -7,9 +7,11 @@ const markdownContent = require('../../../../../../ui/src/components/markdown-co
 const button = require('../../../../../../ui/src/components/button.cjs');
 const dialog = require('../../../../../../ui/src/components/dialog.cjs');
 const lucideReact = require('lucide-react');
+const ai = require('ai');
 const React = require('react');
 const context = require('@btst/stack/context');
 const index = require('../localization/index.cjs');
+const toolCallDisplay = require('./tool-call-display.cjs');
 require('highlight.js/styles/panda-syntax-light.css');
 const completeMarkdown = require('remend');
 
@@ -83,7 +85,8 @@ function ChatMessage({
   const {
     Link,
     Image,
-    localization: customLocalization
+    localization: customLocalization,
+    toolRenderers
   } = context.usePluginOverrides(
     "ai-chat",
     {}
@@ -155,6 +158,12 @@ function ChatMessage({
     }
     return [];
   }, [message.parts]);
+  const toolParts = React.useMemo(() => {
+    if (message.parts && Array.isArray(message.parts)) {
+      return message.parts.filter((part) => ai.isToolUIPart(part));
+    }
+    return [];
+  }, [message.parts]);
   const displayContent = React.useMemo(() => {
     if (!textContent) return "";
     if (isStreaming && !isUser) {
@@ -276,7 +285,7 @@ function ChatMessage({
                   )
                 ] })
               ) : (
-                // Assistant messages: rendered markdown + files + images
+                // Assistant messages: rendered markdown + files + images + tool calls
                 /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "wrap-break-word space-y-2", children: [
                   fileParts.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-2", children: fileParts.map((part, index) => /* @__PURE__ */ jsxRuntime.jsxs(
                     "a",
@@ -304,6 +313,29 @@ function ChatMessage({
                     },
                     index
                   )) }),
+                  toolParts.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-2", children: toolParts.map((part) => {
+                    const toolName = ai.getToolName(part);
+                    const toolCallId = part.toolCallId;
+                    const state = part.state;
+                    const input = part.input;
+                    const output = part.output;
+                    const errorText = part.errorText;
+                    const isLoading = state === "input-streaming" || state === "input-available";
+                    const toolCallProps = {
+                      toolCallId,
+                      toolName,
+                      state,
+                      input,
+                      output,
+                      errorText,
+                      isLoading
+                    };
+                    const CustomRenderer = toolRenderers?.[toolName];
+                    if (CustomRenderer) {
+                      return /* @__PURE__ */ jsxRuntime.jsx(CustomRenderer, { ...toolCallProps }, toolCallId);
+                    }
+                    return /* @__PURE__ */ jsxRuntime.jsx(toolCallDisplay.ToolCallDisplay, { ...toolCallProps }, toolCallId);
+                  }) }),
                   displayContent ? /* @__PURE__ */ jsxRuntime.jsx(
                     markdownContent.MarkdownContent,
                     {
@@ -312,7 +344,7 @@ function ChatMessage({
                       LinkComponent: Link ?? DefaultLink,
                       ImageComponent
                     }
-                  ) : imageParts.length === 0 && fileParts.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: "..." }) : null
+                  ) : imageParts.length === 0 && fileParts.length === 0 && toolParts.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: "..." }) : null
                 ] })
               )
             }