reachat 1.0.6 → 1.1.0

package/dist/index.umd.cjs

@@ -146,9 +146,9 @@
   };
   const SvgBack = (props) => /* @__PURE__ */ React__namespace.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 1, strokeLinecap: "round", strokeLinejoin: "round", className: "lucide lucide-chevron-left", ...props }, /* @__PURE__ */ React__namespace.createElement("path", { d: "m15 18-6-6 6-6" }));
   const SessionMessagePanel = ({ children }) => {
-    const { activeSessionId, theme, isCompact, selectSession } = React.useContext(ChatContext);
-    const isVisible = isCompact && activeSessionId;
-    return (!isCompact || isVisible) && /* @__PURE__ */ jsxRuntime.jsx(
+    const { activeSessionId, theme, isCompact, selectSession, viewType } = React.useContext(ChatContext);
+    const isVisible = isCompact && activeSessionId || viewType === "chat" || !isCompact;
+    return isVisible && /* @__PURE__ */ jsxRuntime.jsx(
       framerMotion.motion.div,
       {
         initial: { translateX: "200%" },
@@ -167,7 +167,7 @@
           [theme.messages.console]: !isCompact
         }),
         children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: reablocks.cn(theme.messages.inner), children: [
-          isCompact && /* @__PURE__ */ jsxRuntime.jsxs(
+          isCompact && viewType !== "chat" && /* @__PURE__ */ jsxRuntime.jsxs(
             reablocks.Button,
             {
               variant: "text",
@@ -225,9 +225,8 @@
       "msHyphens": "none",
       "hyphens": "none",
       "padding": "1em",
-      "margin": "0.5em 0",
-      "overflow": "auto",
-      "borderRadius": "0.3em"
+      "margin": "0",
+      "overflow": "auto"
     },
     'code[class*="language-"]::-moz-selection': {
       "background": "#1e293b",
@@ -1192,6 +1191,7 @@
     copyClassName,
     copyIcon = /* @__PURE__ */ jsxRuntime.jsx(SvgCopy, {}),
     language,
+    toolbarClassName,
     theme = dark
   }) => {
     const match = language == null ? void 0 : language.match(/language-(\w+)/);
@@ -1204,17 +1204,20 @@
       });
     };
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: reablocks.cn("relative", className), children: [
-      copyIcon && /* @__PURE__ */ jsxRuntime.jsx(
-        reablocks.Button,
-        {
-          className: reablocks.cn(copyClassName),
-          size: "small",
-          variant: "text",
-          title: "Copy code",
-          onClick: () => handleCopy(children),
-          children: copyIcon
-        }
-      ),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: reablocks.cn(toolbarClassName), children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { children: lang }),
+        copyIcon && /* @__PURE__ */ jsxRuntime.jsx(
+          reablocks.Button,
+          {
+            className: reablocks.cn(copyClassName),
+            size: "small",
+            variant: "text",
+            title: "Copy code",
+            onClick: () => handleCopy(children),
+            children: copyIcon
+          }
+        )
+      ] }),
       /* @__PURE__ */ jsxRuntime.jsx(
         reactSyntaxHighlighter.Prism,
         {
@@ -1244,7 +1247,8 @@
               ...props,
               language: className,
               className: reablocks.cn(theme.messages.message.markdown.code, className),
-              copyClassName: reablocks.cn(theme.messages.message.markdown.copy)
+              copyClassName: reablocks.cn(theme.messages.message.markdown.copy),
+              toolbarClassName: reablocks.cn(theme.messages.message.markdown.toolbar)
             }
           ),
           table: (props) => /* @__PURE__ */ jsxRuntime.jsx(TableComponent, { ...props, className: reablocks.cn(theme.messages.message.markdown.table) }),
@@ -1521,7 +1525,7 @@ ${response}`),
       }
     }, [activeSession, isAnimating]);
     function handleShowMore() {
-      showNext(10);
+      showNext(limit);
       requestAnimationFrame(() => contentRef.current.scrollTop = 0);
     }
     const reversedConvos = React.useMemo(
@@ -1530,7 +1534,7 @@ ${response}`),
     );
     const { data, hasMore, showNext } = reablocks.useInfinityList({
       items: reversedConvos,
-      limit
+      size: limit
     });
     const reReversedConvo = React.useMemo(() => [...data].reverse(), [data]);
     const convosToRender = limit ? reReversedConvo : activeSession == null ? void 0 : activeSession.conversations;
@@ -1555,7 +1559,7 @@ ${response}`),
           initial: "hidden",
           animate: "visible",
           onAnimationComplete: () => {
-            setIsAnimating(false);
+            requestAnimationFrame(() => setIsAnimating(false));
           },
           children: children(convosToRender)
         },
@@ -1565,7 +1569,7 @@ ${response}`),
   };
   const chatTheme = {
     base: "dark:text-white text-gray-500",
-    console: "flex w-full gap-10 h-full",
+    console: "flex w-full gap-4 h-full",
     companion: "w-full h-full overflow-hidden",
     empty: "text-center flex-1",
     sessions: {
@@ -1589,7 +1593,7 @@ ${response}`),
     },
     messages: {
       base: "",
-      console: "flex flex-col mr-5 flex-1 overflow-hidden",
+      console: "flex flex-col mx-5 flex-1 overflow-hidden",
       companion: "flex w-full h-full",
       back: "self-start p-0 my-2",
       inner: "flex-1 h-full flex flex-col",
@@ -1635,13 +1639,14 @@ ${response}`),
           }
         },
         markdown: {
-          copy: "absolute right-0 top-0 [&>svg]:w-4 [&>svg]:h-4 opacity-50",
+          copy: "sticky py-1 [&>svg]:w-4 [&>svg]:h-4 opacity-50",
           p: "mb-2",
           a: "text-blue-400 underline",
           table: "table-auto w-full m-2",
           th: "px-4 py-2 text-left font-bold border-b border-gray-500",
           td: "px-4 py-2",
-          code: "m-2 rounded",
+          code: "m-2 rounded-b relative",
+          toolbar: "text-xs dark:bg-gray-700/50 flex items-center justify-between px-2 py-1 rounded-t sticky top-0 backdrop-blur-md bg-gray-200 ",
           li: "mb-2 ml-6",
           ul: "mb-4 list-disc",
           ol: "mb-4 list-decimal"
@@ -1762,6 +1767,7 @@ ${response}`),
         disabled,
         isLoading,
         isCompact,
+        viewType,
         activeSessionId: internalActiveSessionID,
         selectSession: handleSelectSession,
         deleteSession: handleDeleteSession,
@@ -1773,6 +1779,7 @@ ${response}`),
       [
         isLoading,
         isCompact,
+        viewType,
         disabled,
         theme,
         remarkPlugins,