@brainfish-ai/components 0.13.7 → 0.13.9

package/dist/components/chat-search/ChatSearchContext.d.ts

@@ -25,10 +25,12 @@ interface ChatSearchContextProps {
     setLoadError: React.Dispatch<React.SetStateAction<string>>;
     showMobileCloseWidgetButton: boolean;
     setShowMobileCloseWidgetButton: React.Dispatch<React.SetStateAction<boolean>>;
+    contentTypeEndpoint?: string;
 }
 export declare const ChatSearchProvider: React.FC<{
     children: ReactNode;
     searchPath?: string;
+    contentTypeEndpoint?: string;
 }>;
 export declare const useChatSearch: () => ChatSearchContextProps;
 export {};

package/dist/components/chat-search/hooks/useScrollManager.d.ts

@@ -1,5 +1,6 @@
 import { RefObject } from 'react';
-export declare const useScrollManager: (answerRefs: RefObject<(HTMLDivElement | null)[]>, containerRef: RefObject<HTMLDivElement | null>) => {
+export declare const useScrollManager: (answerRefs: RefObject<(HTMLDivElement | null)[]>, containerRef: RefObject<HTMLDivElement | null>, bottomRef?: RefObject<HTMLDivElement | null>) => {
     scrollToLastAnswer: () => void;
     scrollToAnswer: (index: number) => void;
+    scrollToBottom: () => void;
 };

package/dist/components/chat-search/types.d.ts

@@ -160,6 +160,7 @@ export interface ChatSearchProps {
     loadConversationEndpoint?: string;
     followUpQuestionsEndpoint?: string;
     autocompleteEndpoint?: string;
+    contentTypeEndpoint?: string;
     disableFollowUpQuestions?: boolean;
     disableImageAttachment?: boolean;
     disableFeedback?: boolean;

package/dist/components/markdown/FormattedMessage.d.ts

@@ -8,7 +8,7 @@ export interface Props {
     message: Message;
     isStreaming?: boolean;
     redirectRules?: RedirectRule[];
-    apiUrl?: string;
+    contentTypeEndpoint?: string;
 }
 export declare const FormattedMessage: FC<Props>;
 export {};

package/dist/esm/chunks/{ChatSearch.CxwRDkGx.js → ChatSearch.CNtUt5oJ.js}

@@ -1,9 +1,9 @@
-import React__default, { Fragment, useState, useCallback, useMemo, createContext, useContext, useRef, useEffect, forwardRef, useImperativeHandle } from 'react';
+import React__default, { useState, useCallback, useMemo, createContext, useContext, Fragment, useRef, useEffect, forwardRef, useImperativeHandle } from 'react';
 import { motion, AnimatePresence } from 'framer-motion';
 import { TooltipProvider, Tooltip, TooltipTrigger, TooltipContent } from '../components/ui/tooltip.js';
 import { Button } from '../components/ui/button.js';
 import { XCircle, Check, Copy, CaretDown, ArrowSquareOut, CaretRight, ArrowsVertical, ArrowDown, MagnifyingGlass, X, CheckCircle, Circle, Image, ArrowRight, ArrowLeft, ArrowsInSimple, ArrowsOutSimple } from '@phosphor-icons/react';
-import { g as getDefaultExportFromCjs, F as FormattedMessage, c as addPopupWidgetUtm } from './FormattedMessage.CpTetIzd.js';
+import { g as getDefaultExportFromCjs, F as FormattedMessage, c as addPopupWidgetUtm } from './FormattedMessage.Ci8jirX2.js';
 import { appendErrors, useForm, Controller } from 'react-hook-form';
 import { validateFieldsNatively, toNestErrors } from '@hookform/resolvers';
 import require$$0 from 'ajv';
@@ -14,13 +14,13 @@ import { S as SimpleSelect } from './simpleSelect.BfAgKOea.js';
 import { c as cn, i as isAnswerUncertain } from './utils.DaMF_LVC.js';
 import { D as DatePicker } from './date-picker.DqcdwXZS.js';
 import { createId } from '@paralleldrive/cuid2';
+import { useImmerReducer } from 'use-immer';
+import { useSearchParam, useEffectOnce } from 'react-use';
 import { MemoizedIcon } from '../components/ui/icon.js';
 import { Collapsible, CollapsibleTrigger, CollapsibleContent } from '../components/ui/collapsible.js';
 import { F as Feedback } from './feedback.NWn6_mYe.js';
 import { G as GeneratingStar } from './generating-star.B0RUXRff.js';
 import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from '../components/ui/dropdown-menu.js';
-import { useImmerReducer } from 'use-immer';
-import { useSearchParam, useEffectOnce } from 'react-use';
 import { ScrollArea } from '../components/ui/scroll-area.js';
 
 import '../ChatSearch.css';function Suggestions({ suggestions, onQuestionClick, title = "Suggested questions" }) {
@@ -3450,36 +3450,6 @@ function ActionButtonsBlock({ block: _block }) {
   return null;
 }
 
-function MarkdownTextBlock({ block, redirectRules, state }) {
-  if (!block.text || block.text.trim() === "") {
-    return /* @__PURE__ */ React__default.createElement("div", { className: "w-full py-4" }, /* @__PURE__ */ React__default.createElement("div", { className: "space-y-4" }, /* @__PURE__ */ React__default.createElement("div", { className: "space-y-3" }, /* @__PURE__ */ React__default.createElement("div", { className: "h-4 rounded w-3/4 shimmer" }), /* @__PURE__ */ React__default.createElement("div", { className: "h-4 rounded w-full shimmer" }), /* @__PURE__ */ React__default.createElement("div", { className: "h-4 rounded w-5/6 shimmer" }))));
-  }
-  const { text } = block;
-  return /* @__PURE__ */ React__default.createElement("div", { className: "w-full" }, /* @__PURE__ */ React__default.createElement("div", { className: "prose prose-sm max-w-none text-foreground" }, /* @__PURE__ */ React__default.createElement(
-    FormattedMessage,
-    {
-      message: {
-        content: text
-      },
-      redirectRules,
-      isStreaming: state === "streaming"
-    }
-  )));
-}
-
-function AnswerBlock({ block, redirectRules, state }) {
-  switch (block.type) {
-    case "markdown-text":
-      return /* @__PURE__ */ React__default.createElement(MarkdownTextBlock, { block, redirectRules, state });
-    case "action-buttons":
-      return /* @__PURE__ */ React__default.createElement(ActionButtonsBlock, { block });
-    case "action-input-form":
-      return /* @__PURE__ */ React__default.createElement(ActionInputFormBlock, { block });
-    default:
-      return null;
-  }
-}
-
 const markdownTextBlock = ({ text = "" } = {}) => ({
   id: createId(),
   type: "markdown-text",
@@ -3512,196 +3482,6 @@ const isActionInputFormBlock = (block) => {
   return block.type === "action-input-form";
 };
 
-const MotionButton$1 = motion(Button);
-const NextBestActions = ({ nextBestActions, onActionClick }) => {
-  if (!nextBestActions.length) return null;
-  return /* @__PURE__ */ React__default.createElement(
-    motion.div,
-    {
-      initial: { opacity: 0, y: 20 },
-      animate: { opacity: 1, y: 0 },
-      exit: { opacity: 0, y: -20 },
-      className: "w-full"
-    },
-    /* @__PURE__ */ React__default.createElement("div", { className: "rounded-lg overflow-hidden bg-card border  divide-y divide-dark-300" }, nextBestActions.map((action, index) => {
-      const handleClick = () => {
-        onActionClick(action);
-      };
-      const className = "w-full h-12 py-2 px-4 inline-flex items-center justify-center gap-2 whitespace-nowrap text-base font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-6 [&_svg]:shrink-0 hover:bg-accent hover:text-accent-foreground";
-      const key = `${action.label}-${index}`.replace(/\s+/g, "-");
-      switch (action.type) {
-        case "email":
-          return /* @__PURE__ */ React__default.createElement(
-            motion.a,
-            {
-              key,
-              initial: { opacity: 0, x: -20 },
-              animate: { opacity: 1, x: 0 },
-              transition: { delay: index * 0.1 },
-              href: `mailto:${action.value}`,
-              target: "_blank",
-              rel: "noopener noreferrer",
-              className,
-              onClick: () => handleClick()
-            },
-            action.icon && /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: action.icon }),
-            /* @__PURE__ */ React__default.createElement("span", { className: "flex-grow" }, action.label),
-            /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: "ArrowSquareOut" })
-          );
-        case "link":
-          return /* @__PURE__ */ React__default.createElement(
-            motion.a,
-            {
-              key,
-              initial: { opacity: 0, x: -20 },
-              animate: { opacity: 1, x: 0 },
-              transition: { delay: index * 0.1 },
-              href: addPopupWidgetUtm(action.value),
-              target: "_blank",
-              rel: "noopener noreferrer",
-              className,
-              onClick: () => handleClick()
-            },
-            action.icon && /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: action.icon }),
-            /* @__PURE__ */ React__default.createElement("span", { className: "flex-grow" }, action.label),
-            /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: "ArrowSquareOut" })
-          );
-        case "phone":
-          return /* @__PURE__ */ React__default.createElement(
-            motion.a,
-            {
-              key,
-              initial: { opacity: 0, x: -20 },
-              animate: { opacity: 1, x: 0 },
-              transition: { delay: index * 0.1 },
-              href: `tel:${action.value}`,
-              target: "_blank",
-              rel: "noopener noreferrer",
-              className,
-              onClick: () => handleClick()
-            },
-            action.icon && /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: action.icon }),
-            /* @__PURE__ */ React__default.createElement("span", { className: "flex-grow" }, action.label),
-            /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: "ArrowSquareOut" })
-          );
-        default:
-          return /* @__PURE__ */ React__default.createElement(Fragment, { key }, /* @__PURE__ */ React__default.createElement(
-            MotionButton$1,
-            {
-              initial: { opacity: 0, x: -20 },
-              animate: { opacity: 1, x: 0 },
-              transition: { delay: index * 0.1 },
-              className: "w-full text-left h-12 rounded-none [&_svg]:pointer-events-none [&_svg]:size-6 [&_svg]:shrink-0 hover:bg-accent hover:text-accent-foreground text-base font-medium",
-              variant: "ghost",
-              onClick: () => handleClick()
-            },
-            /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: "ArrowCircleRight" }),
-            /* @__PURE__ */ React__default.createElement("span", { className: "flex-grow" }, action.label),
-            /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: "ArrowSquareOut" })
-          ));
-      }
-    }))
-  );
-};
-
-var ActionType = /* @__PURE__ */ ((ActionType2) => {
-  ActionType2["CallPhone"] = "call_phone";
-  ActionType2["OpenUrl"] = "open_url";
-  ActionType2["SendEmail"] = "send_email";
-  ActionType2["RunCallback"] = "run_callback";
-  return ActionType2;
-})(ActionType || {});
-var NextBestActionType = /* @__PURE__ */ ((NextBestActionType2) => {
-  NextBestActionType2["Link"] = "link";
-  NextBestActionType2["Email"] = "email";
-  NextBestActionType2["Phone"] = "phone";
-  NextBestActionType2["Callback"] = "callback";
-  NextBestActionType2["Function"] = "function";
-  return NextBestActionType2;
-})(NextBestActionType || {});
-
-const getActionMapping = (action) => {
-  const actionMapping = {
-    [ActionType.CallPhone]: {
-      type: NextBestActionType.Phone,
-      icon: "Phone",
-      getValue: (a) => a.action?.options?.phoneNumber || a.id,
-      getLabel: (a) => a.action?.options?.title || a.type
-    },
-    [ActionType.SendEmail]: {
-      type: NextBestActionType.Email,
-      icon: "EnvelopeSimple",
-      getValue: (a) => a.action?.options?.to || a.id,
-      getLabel: (a) => a.action?.options?.title || a.type
-    },
-    [ActionType.OpenUrl]: {
-      type: NextBestActionType.Link,
-      icon: "Link",
-      getValue: (a) => a.action?.options?.url || a.id,
-      getLabel: (a) => a.action?.options?.title || a.type
-    }
-  };
-  const mapping = actionMapping[action.type] || {
-    type: NextBestActionType.Link,
-    icon: "Link",
-    getValue: (a) => a.action?.options?.url || a.id,
-    getLabel: (a) => a.action?.options?.title || a.type
-  };
-  return mapping;
-};
-
-const AnswerActions = ({
-  actions,
-  nextBestActions,
-  isLastAnswer,
-  handleActionClick,
-  searchQueryId,
-  question,
-  answer
-}) => {
-  const hasActions = actions && actions.length > 0;
-  const hasNextBestActions = nextBestActions && isLastAnswer && nextBestActions.length > 0;
-  const [showAnswerActions] = useState(hasActions || hasNextBestActions);
-  if (!showAnswerActions) {
-    return null;
-  }
-  let mappedActions = [];
-  if (hasActions) {
-    mappedActions = actions.map((action) => {
-      const mapping = getActionMapping(action);
-      return {
-        id: action.id,
-        label: mapping.getLabel(action),
-        type: mapping.type,
-        icon: mapping.icon,
-        value: mapping.getValue(action)
-      };
-    });
-  }
-  if (hasNextBestActions) {
-    const filteredNextBestActions = nextBestActions.filter(
-      (action) => !mappedActions.some((mappedAction) => mappedAction.type === action.type)
-    );
-    mappedActions = mappedActions.concat(filteredNextBestActions);
-  }
-  return /* @__PURE__ */ React__default.createElement("div", { className: "p-4" }, /* @__PURE__ */ React__default.createElement(
-    NextBestActions,
-    {
-      nextBestActions: mappedActions,
-      onActionClick: (action) => {
-        if (action) {
-          handleActionClick?.({
-            action,
-            searchQueryId: searchQueryId || "",
-            query: question,
-            answer
-          });
-        }
-      }
-    }
-  ));
-};
-
 const AnswersActions = {
   SET_ANSWERS: "answers/set_answers",
   CLEAR_ALL: "answers/clear_all",
@@ -4030,10 +3810,7 @@ const useConversationId = (searchPath) => {
 };
 
 const ChatSearchContext = createContext(void 0);
-const ChatSearchProvider = ({
-  children,
-  searchPath
-}) => {
+const ChatSearchProvider = ({ children, searchPath, contentTypeEndpoint }) => {
   const [query, setQuery] = useState("");
   const [queryId, setQueryId] = useState("");
   const [followUpQuery, setFollowUpQuery] = useState("");
@@ -4069,7 +3846,8 @@ const ChatSearchProvider = ({
       loadError,
       setLoadError,
       showMobileCloseWidgetButton,
-      setShowMobileCloseWidgetButton
+      setShowMobileCloseWidgetButton,
+      contentTypeEndpoint
     }),
     [
       query,
@@ -4085,7 +3863,8 @@ const ChatSearchProvider = ({
       clearConversationId,
       isLoadingConversation,
       loadError,
-      showMobileCloseWidgetButton
+      showMobileCloseWidgetButton,
+      contentTypeEndpoint
     ]
   );
   return /* @__PURE__ */ React__default.createElement(ChatSearchContext.Provider, { value: contextValue }, children);
@@ -4098,13 +3877,235 @@ const useChatSearch = () => {
   return context;
 };
 
+function MarkdownTextBlock({ block, redirectRules, state }) {
+  const { contentTypeEndpoint } = useChatSearch();
+  if (!block.text || block.text.trim() === "") {
+    return /* @__PURE__ */ React__default.createElement("div", { className: "w-full py-4" }, /* @__PURE__ */ React__default.createElement("div", { className: "space-y-4" }, /* @__PURE__ */ React__default.createElement("div", { className: "space-y-3" }, /* @__PURE__ */ React__default.createElement("div", { className: "h-4 rounded w-3/4 shimmer" }), /* @__PURE__ */ React__default.createElement("div", { className: "h-4 rounded w-full shimmer" }), /* @__PURE__ */ React__default.createElement("div", { className: "h-4 rounded w-5/6 shimmer" }))));
+  }
+  const { text } = block;
+  return /* @__PURE__ */ React__default.createElement("div", { className: "w-full" }, /* @__PURE__ */ React__default.createElement("div", { className: "prose prose-sm max-w-none text-foreground" }, /* @__PURE__ */ React__default.createElement(
+    FormattedMessage,
+    {
+      message: {
+        content: text
+      },
+      redirectRules,
+      isStreaming: state === "streaming",
+      contentTypeEndpoint
+    }
+  )));
+}
+
+function AnswerBlock({ block, redirectRules, state }) {
+  switch (block.type) {
+    case "markdown-text":
+      return /* @__PURE__ */ React__default.createElement(MarkdownTextBlock, { block, redirectRules, state });
+    case "action-buttons":
+      return /* @__PURE__ */ React__default.createElement(ActionButtonsBlock, { block });
+    case "action-input-form":
+      return /* @__PURE__ */ React__default.createElement(ActionInputFormBlock, { block });
+    default:
+      return null;
+  }
+}
+
+const MotionButton$1 = motion(Button);
+const NextBestActions = ({ nextBestActions, onActionClick }) => {
+  if (!nextBestActions.length) return null;
+  return /* @__PURE__ */ React__default.createElement(
+    motion.div,
+    {
+      initial: { opacity: 0, y: 20 },
+      animate: { opacity: 1, y: 0 },
+      exit: { opacity: 0, y: -20 },
+      className: "w-full"
+    },
+    /* @__PURE__ */ React__default.createElement("div", { className: "rounded-lg overflow-hidden bg-card border  divide-y divide-dark-300" }, nextBestActions.map((action, index) => {
+      const handleClick = () => {
+        onActionClick(action);
+      };
+      const className = "w-full h-12 py-2 px-4 inline-flex items-center justify-center gap-2 whitespace-nowrap text-base font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-6 [&_svg]:shrink-0 hover:bg-accent hover:text-accent-foreground";
+      const key = `${action.label}-${index}`.replace(/\s+/g, "-");
+      switch (action.type) {
+        case "email":
+          return /* @__PURE__ */ React__default.createElement(
+            motion.a,
+            {
+              key,
+              initial: { opacity: 0, x: -20 },
+              animate: { opacity: 1, x: 0 },
+              transition: { delay: index * 0.1 },
+              href: `mailto:${action.value}`,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              className,
+              onClick: () => handleClick()
+            },
+            action.icon && /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: action.icon }),
+            /* @__PURE__ */ React__default.createElement("span", { className: "flex-grow" }, action.label),
+            /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: "ArrowSquareOut" })
+          );
+        case "link":
+          return /* @__PURE__ */ React__default.createElement(
+            motion.a,
+            {
+              key,
+              initial: { opacity: 0, x: -20 },
+              animate: { opacity: 1, x: 0 },
+              transition: { delay: index * 0.1 },
+              href: addPopupWidgetUtm(action.value),
+              target: "_blank",
+              rel: "noopener noreferrer",
+              className,
+              onClick: () => handleClick()
+            },
+            action.icon && /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: action.icon }),
+            /* @__PURE__ */ React__default.createElement("span", { className: "flex-grow" }, action.label),
+            /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: "ArrowSquareOut" })
+          );
+        case "phone":
+          return /* @__PURE__ */ React__default.createElement(
+            motion.a,
+            {
+              key,
+              initial: { opacity: 0, x: -20 },
+              animate: { opacity: 1, x: 0 },
+              transition: { delay: index * 0.1 },
+              href: `tel:${action.value}`,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              className,
+              onClick: () => handleClick()
+            },
+            action.icon && /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: action.icon }),
+            /* @__PURE__ */ React__default.createElement("span", { className: "flex-grow" }, action.label),
+            /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: "ArrowSquareOut" })
+          );
+        default:
+          return /* @__PURE__ */ React__default.createElement(Fragment, { key }, /* @__PURE__ */ React__default.createElement(
+            MotionButton$1,
+            {
+              initial: { opacity: 0, x: -20 },
+              animate: { opacity: 1, x: 0 },
+              transition: { delay: index * 0.1 },
+              className: "w-full text-left h-12 rounded-none [&_svg]:pointer-events-none [&_svg]:size-6 [&_svg]:shrink-0 hover:bg-accent hover:text-accent-foreground text-base font-medium",
+              variant: "ghost",
+              onClick: () => handleClick()
+            },
+            /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: "ArrowCircleRight" }),
+            /* @__PURE__ */ React__default.createElement("span", { className: "flex-grow" }, action.label),
+            /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: "ArrowSquareOut" })
+          ));
+      }
+    }))
+  );
+};
+
+var ActionType = /* @__PURE__ */ ((ActionType2) => {
+  ActionType2["CallPhone"] = "call_phone";
+  ActionType2["OpenUrl"] = "open_url";
+  ActionType2["SendEmail"] = "send_email";
+  ActionType2["RunCallback"] = "run_callback";
+  return ActionType2;
+})(ActionType || {});
+var NextBestActionType = /* @__PURE__ */ ((NextBestActionType2) => {
+  NextBestActionType2["Link"] = "link";
+  NextBestActionType2["Email"] = "email";
+  NextBestActionType2["Phone"] = "phone";
+  NextBestActionType2["Callback"] = "callback";
+  NextBestActionType2["Function"] = "function";
+  return NextBestActionType2;
+})(NextBestActionType || {});
+
+const getActionMapping = (action) => {
+  const actionMapping = {
+    [ActionType.CallPhone]: {
+      type: NextBestActionType.Phone,
+      icon: "Phone",
+      getValue: (a) => a.action?.options?.phoneNumber || a.id,
+      getLabel: (a) => a.action?.options?.title || a.type
+    },
+    [ActionType.SendEmail]: {
+      type: NextBestActionType.Email,
+      icon: "EnvelopeSimple",
+      getValue: (a) => a.action?.options?.to || a.id,
+      getLabel: (a) => a.action?.options?.title || a.type
+    },
+    [ActionType.OpenUrl]: {
+      type: NextBestActionType.Link,
+      icon: "Link",
+      getValue: (a) => a.action?.options?.url || a.id,
+      getLabel: (a) => a.action?.options?.title || a.type
+    }
+  };
+  const mapping = actionMapping[action.type] || {
+    type: NextBestActionType.Link,
+    icon: "Link",
+    getValue: (a) => a.action?.options?.url || a.id,
+    getLabel: (a) => a.action?.options?.title || a.type
+  };
+  return mapping;
+};
+
+const AnswerActions = ({
+  actions,
+  nextBestActions,
+  isLastAnswer,
+  handleActionClick,
+  searchQueryId,
+  question,
+  answer
+}) => {
+  const hasActions = actions && actions.length > 0;
+  const hasNextBestActions = nextBestActions && isLastAnswer && nextBestActions.length > 0;
+  const [showAnswerActions] = useState(hasActions || hasNextBestActions);
+  if (!showAnswerActions) {
+    return null;
+  }
+  let mappedActions = [];
+  if (hasActions) {
+    mappedActions = actions.map((action) => {
+      const mapping = getActionMapping(action);
+      return {
+        id: action.id,
+        label: mapping.getLabel(action),
+        type: mapping.type,
+        icon: mapping.icon,
+        value: mapping.getValue(action)
+      };
+    });
+  }
+  if (hasNextBestActions) {
+    const filteredNextBestActions = nextBestActions.filter(
+      (action) => !mappedActions.some((mappedAction) => mappedAction.type === action.type)
+    );
+    mappedActions = mappedActions.concat(filteredNextBestActions);
+  }
+  return /* @__PURE__ */ React__default.createElement("div", { className: "p-4" }, /* @__PURE__ */ React__default.createElement(
+    NextBestActions,
+    {
+      nextBestActions: mappedActions,
+      onActionClick: (action) => {
+        if (action) {
+          handleActionClick?.({
+            action,
+            searchQueryId: searchQueryId || "",
+            query: question,
+            answer
+          });
+        }
+      }
+    }
+  ));
+};
+
 const useIsChatSearchDirty = () => {
   const { showResults, answers } = useChatSearch();
   const isDirty = Boolean(showResults || answers.length > 0);
   return isDirty;
 };
 
-const useScrollManager = (answerRefs, containerRef) => {
+const useScrollManager = (answerRefs, containerRef, bottomRef) => {
   const scrollToLastAnswer = () => {
     requestAnimationFrame(() => {
       const lastAnswer = answerRefs.current?.[answerRefs.current.length - 1];
@@ -4129,7 +4130,14 @@ const useScrollManager = (answerRefs, containerRef) => {
       }
     });
   };
-  return { scrollToLastAnswer, scrollToAnswer };
+  const scrollToBottom = () => {
+    setTimeout(() => {
+      if (bottomRef?.current && containerRef.current) {
+        bottomRef.current.scrollIntoView({ behavior: "smooth", block: "end" });
+      }
+    }, 200);
+  };
+  return { scrollToLastAnswer, scrollToAnswer, scrollToBottom };
 };
 
 const defaultRetryOptions = {
@@ -4524,7 +4532,7 @@ function Answer({
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: "rounded-lg relative mx-auto overflow-hidden bg-card border border-primary mb-4",
+      className: "rounded-lg relative mx-auto overflow-hidden bg-card border border-primary",
       "data-name": "SearchResults",
       "data-index": index
     },
@@ -5352,6 +5360,7 @@ const ChatSearchComponent = forwardRef(
     const fileInputRef = useRef(null);
     const primarySearchRef = useRef(null);
     const followUpSearchRef = useRef(null);
+    const bottomRef = useRef(null);
     const { suggestions: autocompleteSuggestions } = useAutocomplete({
       query,
       endpoint: autocompleteEndpoint || "",
@@ -5366,7 +5375,11 @@ const ChatSearchComponent = forwardRef(
       headers,
       mergedTextConfig
     });
-    const { scrollToLastAnswer, scrollToAnswer } = useScrollManager(answerRefs, containerRef);
+    const { scrollToLastAnswer, scrollToAnswer, scrollToBottom } = useScrollManager(
+      answerRefs,
+      containerRef,
+      bottomRef
+    );
     const { subscribeToStateChanges } = useSubscriptionManager();
     const loadFollowUpQuestions = async (searchQueryId, conversationId) => {
       if (!followUpQuestionsEndpoint || disableFollowUpQuestions) {
@@ -5403,6 +5416,7 @@ const ChatSearchComponent = forwardRef(
           for (const line of lines) {
             try {
               if (line === "[DONE]") {
+                scrollToBottom();
                 continue;
               }
               const event = JSON.parse(line);
@@ -5413,6 +5427,7 @@ const ChatSearchComponent = forwardRef(
                     text: event.content
                   })
                 );
+                scrollToBottom();
                 const uncertaintyCheck = isAnswerUncertain(accumulatedAnswer);
                 isUncertain = uncertaintyCheck.uncertain;
                 if (isUncertain) {
@@ -5944,7 +5959,8 @@ const ChatSearchComponent = forwardRef(
             ref: (el) => answerRefs.current[i] = el,
             initial: { opacity: 0, y: 20 },
             animate: { opacity: 1, y: 0 },
-            transition: { duration: 0.5, delay: i * 0.1 }
+            transition: { duration: 0.5, delay: i * 0.1 },
+            className: "space-y-4 last:!mb-8"
           },
           /* @__PURE__ */ React__default.createElement(
             Answer,
@@ -5967,13 +5983,13 @@ const ChatSearchComponent = forwardRef(
               onFeedbackReasonSubmit: (reason) => void handleFeedbackReasonSubmit(reason, answer.searchQueryId)
             }
           ),
-          i === answers.length - 1 && !disableFollowUpQuestions && answer.followUpQuestions && answer.state === "completed" && /* @__PURE__ */ React__default.createElement("div", { className: "mt-4" }, /* @__PURE__ */ React__default.createElement(
+          i === answers.length - 1 && !disableFollowUpQuestions && answer.followUpQuestions && answer.state === "completed" && /* @__PURE__ */ React__default.createElement(
             FollowUpQuestions,
             {
               questions: answer.followUpQuestions,
               onQuestionClick: handleFollowUpQuestionClick
             }
-          ))
+          )
         ))
       ))), showResults && answers.length > 1 && /* @__PURE__ */ React__default.createElement("div", { className: "hidden lg:block" }, /* @__PURE__ */ React__default.createElement(
         TimelineNavigation,
@@ -5986,7 +6002,7 @@ const ChatSearchComponent = forwardRef(
           },
           offset
         }
-      )), disclaimer && isWidgetMode && !(showResults && showFollowUp) && /* @__PURE__ */ React__default.createElement("div", { className: "mt-2 px-3 @3xl:px-0 text-xs text-dark-500 flex items-center gap-1 absolute bottom-12 justify-center text-center w-full" }, /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: "Info", className: "size-4" }), disclaimer)),
+      )), disclaimer && isWidgetMode && !(showResults && showFollowUp) && /* @__PURE__ */ React__default.createElement("div", { className: "mt-2 px-3 @3xl:px-0 text-xs text-dark-500 flex items-center gap-1 absolute bottom-12 justify-center text-center w-full" }, /* @__PURE__ */ React__default.createElement(MemoizedIcon, { iconName: "Info", className: "size-4" }), disclaimer), /* @__PURE__ */ React__default.createElement("div", { ref: bottomRef })),
       showResults && showFollowUp && /* @__PURE__ */ React__default.createElement(
         FollowUpSearchBar,
         {
@@ -6003,8 +6019,8 @@ const ChatSearchComponent = forwardRef(
   }
 );
 ChatSearchComponent.displayName = "ChatSearch";
-const ChatSearch = forwardRef(({ featureFlags, ...props }, ref) => /* @__PURE__ */ React__default.createElement(FeatureFlagProvider, { flags: featureFlags }, /* @__PURE__ */ React__default.createElement(ChatSearchProvider, { searchPath: props.searchPath }, /* @__PURE__ */ React__default.createElement(ChatSearchComponent, { ...props, ref }))));
+const ChatSearch = forwardRef(({ featureFlags, ...props }, ref) => /* @__PURE__ */ React__default.createElement(FeatureFlagProvider, { flags: featureFlags }, /* @__PURE__ */ React__default.createElement(ChatSearchProvider, { searchPath: props.searchPath, contentTypeEndpoint: props.contentTypeEndpoint }, /* @__PURE__ */ React__default.createElement(ChatSearchComponent, { ...props, ref }))));
 ChatSearch.displayName = "ChatSearch";
 
 export { ChatSearch as C, ChatSearchProvider as a, useIsChatSearchDirty as b, useChatSearch as u };
-//# sourceMappingURL=ChatSearch.CxwRDkGx.js.map
+//# sourceMappingURL=ChatSearch.CNtUt5oJ.js.map