synapse-react-client 4.0.2 → 4.0.3

package/dist/components/SynapseChat/SynapseChatInteraction.js

@@ -1,42 +1,56 @@
-import { jsxs as i, Fragment as C, jsx as e } from "react/jsx-runtime";
-import { SynapseSpinner as I } from "../LoadingScreen/LoadingScreen.js";
-import M from "./extractMessageFromTraceEvent.js";
-import { SmartToyTwoTone as L, KeyboardArrowDown as W, KeyboardArrowRight as j } from "@mui/icons-material";
-import { useTheme as B, ListItem as g, ListItemText as A, Box as a, Button as F, Collapse as z, Alert as D } from "@mui/material";
-import { useRef as K, useState as O, useEffect as R, useMemo as p } from "react";
-import { MarkdownSynapse as w } from "../Markdown/MarkdownSynapse.js";
-function $(r) {
-  return "reasoningText" in r ? r.reasoningText : "";
+import { jsxs as s, Fragment as A, jsx as t } from "react/jsx-runtime";
+import { SynapseSpinner as L } from "../LoadingScreen/LoadingScreen.js";
+import j from "./extractMessageFromTraceEvent.js";
+import { SmartToyTwoTone as B, KeyboardArrowDown as P, KeyboardArrowRight as q } from "@mui/icons-material";
+import { useTheme as F, ListItem as T, ListItemText as z, Box as d, Button as E, Collapse as D, Stack as G, Tooltip as K, Chip as O, Alert as $ } from "@mui/material";
+import { useRef as H, useState as _, useEffect as J, useMemo as x } from "react";
+import { MarkdownSynapse as C } from "../Markdown/MarkdownSynapse.js";
+function N(n) {
+  return "reasoningText" in n ? n.reasoningText : "";
 }
-function N({
-  userMessage: r,
-  chatResponseText: s,
-  chatErrorReason: l,
-  chatResponseTrace: d,
-  scrollIntoView: y = !1
+function ee({
+  userMessage: n,
+  chatResponseText: i,
+  chatErrorReason: c,
+  chatResponseTrace: m,
+  scrollIntoView: u = !1,
+  onSendChat: f
 }) {
-  const x = B(), o = K(null), [m, b] = O(!1);
-  R(() => {
-    y && o.current && o.current.scrollIntoView({ behavior: "smooth" });
-  }, [o]);
-  const c = !s && !l, n = p(
-    () => (d ?? []).flatMap((t) => M(t))?.filter((t) => !!t),
-    [d]
-  ), T = n.length > 0, f = p(
-    () => n.filter((t) => "reasoningText" in t).at(-1),
-    [n]
-  ), S = f == null ? "Thinking..." : f.reasoningText, k = c ? S : `${m ? "Hide" : "Show"} Trace`, u = p(() => {
-    const h = new DOMParser().parseFromString(s ?? "", "text/html");
-    return h.querySelectorAll("tool_name").forEach((v) => v.remove()), h.body.textContent ?? "";
-  }, [s]);
-  return /* @__PURE__ */ i(C, { children: [
-    /* @__PURE__ */ e(
-      g,
+  const h = F(), a = H(null), [p, k] = _(!1);
+  J(() => {
+    u && a.current && a.current.scrollIntoView({ behavior: "smooth" });
+  }, [a, u]);
+  const g = !i && !c, l = x(
+    () => (m ?? []).flatMap((e) => j(e))?.filter((e) => !!e),
+    [m]
+  ), v = l.length > 0, y = x(
+    () => l.filter((e) => "reasoningText" in e).at(-1),
+    [l]
+  ), M = y == null ? "Thinking..." : y.reasoningText, I = g ? M : `${p ? "Hide" : "Show"} Trace`, { textContent: w, guidePrompts: b } = x(() => {
+    try {
+      const o = new DOMParser().parseFromString(i ?? "", "text/html");
+      o.querySelectorAll("tool_name, actions").forEach((r) => r.remove());
+      const W = Array.from(
+        o.querySelectorAll("guideprompt")
+      ).map((r) => r.textContent?.trim()).filter((r) => !!r);
+      o.querySelectorAll("guideprompt").forEach((r) => r.remove());
+      const S = o.querySelector("chat");
+      return {
+        textContent: S ? S.textContent ?? "" : o.body.textContent ?? "",
+        guidePrompts: W
+      };
+    } catch (e) {
+      return console.error(e), { textContent: i ?? "", guidePrompts: [] };
+    }
+  }, [i]);
+  return /* @__PURE__ */ s(A, { children: [
+    /* @__PURE__ */ t(
+      T,
       {
-        ref: o,
+        ref: a,
         sx: {
           alignSelf: "flex-end",
-          backgroundColor: x.palette.secondary[100],
+          backgroundColor: h.palette.secondary[100],
           borderRadius: "24px",
           maxWidth: "70%",
           display: "block",
@@ -45,11 +59,11 @@ function N({
           wordWrap: "break-word",
           width: "auto"
         },
-        children: /* @__PURE__ */ e(A, { primary: r })
+        children: /* @__PURE__ */ t(z, { primary: n })
       }
     ),
-    /* @__PURE__ */ i(
-      g,
+    /* @__PURE__ */ s(
+      T,
       {
         sx: {
           display: "grid",
@@ -60,8 +74,8 @@ function N({
           p: "0px"
         },
         children: [
-          /* @__PURE__ */ e(
-            a,
+          /* @__PURE__ */ t(
+            d,
             {
               sx: {
                 p: "3px",
@@ -72,11 +86,11 @@ function N({
                 borderWidth: "1px",
                 borderColor: "grey.300"
               },
-              children: /* @__PURE__ */ e(L, { sx: { color: "secondary.main" } })
+              children: /* @__PURE__ */ t(B, { sx: { color: "secondary.main" } })
             }
           ),
-          /* @__PURE__ */ i(
-            a,
+          /* @__PURE__ */ s(
+            d,
             {
               sx: {
                 borderRadius: "10px",
@@ -85,14 +99,14 @@ function N({
                 overflow: "auto"
               },
               children: [
-                /* @__PURE__ */ i(
-                  a,
+                /* @__PURE__ */ s(
+                  d,
                   {
                     component: "aside",
                     sx: {
                       ".markdown": {
                         fontStyle: "italic",
-                        borderLeft: `4px solid ${x.palette.grey[300]}`,
+                        borderLeft: `4px solid ${h.palette.grey[300]}`,
                         marginLeft: "4px",
                         paddingLeft: "8px",
                         mt: 1,
@@ -100,15 +114,15 @@ function N({
                       }
                     },
                     children: [
-                      /* @__PURE__ */ e(
-                        F,
+                      /* @__PURE__ */ t(
+                        E,
                         {
                           variant: "outlined",
                           size: "small",
-                          startIcon: c ? /* @__PURE__ */ e(I, { size: 14 }) : m ? /* @__PURE__ */ e(W, { sx: { width: "14px" } }) : /* @__PURE__ */ e(j, { sx: { width: "14px" } }),
-                          disabled: !T,
+                          startIcon: g ? /* @__PURE__ */ t(L, { size: 14 }) : p ? /* @__PURE__ */ t(P, { sx: { width: "14px" } }) : /* @__PURE__ */ t(q, { sx: { width: "14px" } }),
+                          disabled: !v,
                           onClick: () => {
-                            b((t) => !t);
+                            k((e) => !e);
                           },
                           sx: {
                             height: "20px",
@@ -124,30 +138,41 @@ function N({
                             pl: 0,
                             ".MuiButton-startIcon": { mr: 0.5 }
                           },
-                          children: /* @__PURE__ */ e(a, { sx: { overflow: "hidden", textOverflow: "ellipsis" }, children: k })
+                          children: /* @__PURE__ */ t(d, { sx: { overflow: "hidden", textOverflow: "ellipsis" }, children: I })
                         }
                       ),
-                      d && /* @__PURE__ */ e(z, { in: m, children: /* @__PURE__ */ e(
-                        w,
+                      m && /* @__PURE__ */ t(D, { in: p, children: /* @__PURE__ */ t(
+                        C,
                         {
-                          markdown: n.map($).filter((t) => t.trim().length > 0).join("<br/><br/>")
+                          markdown: l.map(N).filter((e) => e.trim().length > 0).join("<br/><br/>")
                         }
                       ) })
                     ]
                   }
                 ),
-                u && /* @__PURE__ */ e(w, { markdown: u })
+                w && /* @__PURE__ */ t(C, { markdown: w }),
+                f && b.length > 0 && /* @__PURE__ */ t(G, { direction: "row", flexWrap: "wrap", gap: 1, mt: 1, children: b.map((e) => /* @__PURE__ */ t(K, { title: e, children: /* @__PURE__ */ t(
+                  O,
+                  {
+                    label: e,
+                    variant: "outlined",
+                    color: "primary",
+                    clickable: !0,
+                    onClick: () => f(e),
+                    sx: { maxWidth: 200 }
+                  }
+                ) }, e)) })
               ]
             }
           )
         ]
       }
     ),
-    l && /* @__PURE__ */ e(D, { severity: "error", sx: { my: 2 }, children: l })
+    c && /* @__PURE__ */ t($, { severity: "error", sx: { my: 2 }, children: c })
   ] });
 }
 export {
-  N as SynapseChatInteraction,
-  N as default
+  ee as SynapseChatInteraction,
+  ee as default
 };
 //# sourceMappingURL=SynapseChatInteraction.js.map

package/dist/components/SynapseChat/SynapseChatInteraction.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseChatInteraction.js","sources":["../../../src/components/SynapseChat/SynapseChatInteraction.tsx"],"sourcesContent":["import { SynapseSpinner } from '@/components/LoadingScreen/LoadingScreen'\nimport extractMessageFromTraceEvent, {\n  TraceMessage,\n} from '@/components/SynapseChat/extractMessageFromTraceEvent'\nimport {\n  KeyboardArrowDown,\n  KeyboardArrowRight,\n  SmartToyTwoTone,\n} from '@mui/icons-material'\nimport {\n  Alert,\n  Box,\n  Button,\n  Collapse,\n  ListItem,\n  ListItemText,\n  useTheme,\n} from '@mui/material'\nimport { Color } from '@mui/material/styles'\nimport { TraceEvent } from '@sage-bionetworks/synapse-types'\nimport { useEffect, useMemo, useRef, useState } from 'react'\nimport MarkdownSynapse from '../Markdown/MarkdownSynapse'\n\nexport type SynapseChatInteractionProps = {\n  userMessage: string\n  chatResponseText?: string\n  chatResponseTrace?: TraceEvent[]\n  scrollIntoView?: boolean\n  chatErrorReason?: string\n}\n\n// Show tool calls in the trace. Useful for development. We may want to show them to users in the future.\nconst SHOW_TOOL_USE = false\n\nfunction getMarkdownForTraceMessage(traceMessage: TraceMessage): string {\n  if ('reasoningText' in traceMessage) {\n    return traceMessage.reasoningText\n  }\n  if (SHOW_TOOL_USE && 'toolName' in traceMessage) {\n    return `**Tool Used:** \\`${\n      traceMessage.toolName\n    }\\`\\n\\n**Tool Input:**\\n\\`\\`\\`json\\n${JSON.stringify(\n      traceMessage.toolInput,\n      null,\n      2,\n    )}\\n\\`\\`\\`\\n`\n  }\n  return ''\n}\n\nexport function SynapseChatInteraction({\n  userMessage,\n  chatResponseText,\n  chatErrorReason,\n  chatResponseTrace,\n  scrollIntoView = false,\n}: SynapseChatInteractionProps) {\n  const theme = useTheme()\n  const ref = useRef<HTMLLIElement | null>(null)\n  const [showTrace, setShowTrace] = useState(false)\n  useEffect(() => {\n    // on mount, scroll into view if instructed\n    if (scrollIntoView) {\n      if (ref.current) {\n        ref.current.scrollIntoView({ behavior: 'smooth' })\n      }\n    }\n  }, [ref])\n\n  const isLoading = !chatResponseText && !chatErrorReason\n\n  const traceMessages = useMemo(\n    () =>\n      (chatResponseTrace ?? [])\n        .flatMap(traceEvent => extractMessageFromTraceEvent(traceEvent))\n        ?.filter(trace => !!trace),\n    [chatResponseTrace],\n  )\n\n  const hasTraceInfo = traceMessages.length > 0\n\n  const lastReasoningMessage = useMemo(\n    () => traceMessages.filter(trace => 'reasoningText' in trace).at(-1),\n    [traceMessages],\n  )\n\n  const traceButtonLoadingText =\n    lastReasoningMessage == null\n      ? 'Thinking...'\n      : lastReasoningMessage.reasoningText\n\n  const traceButtonText = isLoading\n    ? traceButtonLoadingText\n    : `${showTrace ? 'Hide' : 'Show'} Trace`\n\n  const textContent = useMemo(() => {\n    const parser = new DOMParser()\n    const doc = parser.parseFromString(chatResponseText ?? '', 'text/html')\n    const elementsToRemove = doc.querySelectorAll('tool_name')\n    elementsToRemove.forEach(element => element.remove())\n    return doc.body.textContent ?? ''\n  }, [chatResponseText])\n\n  return (\n    <>\n      <ListItem\n        ref={ref}\n        sx={{\n          alignSelf: 'flex-end',\n          backgroundColor: (theme.palette.secondary as unknown as Color)[100],\n          borderRadius: '24px',\n          maxWidth: '70%',\n          display: 'block',\n          mb: '5px',\n          p: '8px 12px',\n          wordWrap: 'break-word',\n          width: 'auto',\n        }}\n      >\n        <ListItemText primary={userMessage} />\n      </ListItem>\n      <ListItem\n        sx={{\n          display: 'grid',\n          gridTemplateColumns: '50px auto',\n          columnGap: '0px',\n          justifyItems: 'center',\n          alignItems: 'start',\n          p: '0px',\n        }}\n      >\n        <Box\n          sx={{\n            p: '3px',\n            mt: '10px',\n            height: '31px',\n            borderRadius: '50%',\n            borderStyle: 'solid',\n            borderWidth: '1px',\n            borderColor: 'grey.300',\n          }}\n        >\n          <SmartToyTwoTone sx={{ color: 'secondary.main' }} />\n        </Box>\n        <Box\n          sx={{\n            borderRadius: '10px',\n            padding: '10px',\n            maxWidth: '100%',\n            overflow: 'auto',\n          }}\n        >\n          <Box\n            component={'aside'}\n            sx={{\n              '.markdown': {\n                fontStyle: 'italic',\n                borderLeft: `4px solid ${theme.palette.grey[300]}`,\n                marginLeft: '4px',\n                paddingLeft: '8px',\n                mt: 1,\n                mb: 2,\n              },\n            }}\n          >\n            <Button\n              variant={'outlined'}\n              size={'small'}\n              startIcon={\n                isLoading ? (\n                  <SynapseSpinner size={14} />\n                ) : showTrace ? (\n                  <KeyboardArrowDown sx={{ width: '14px' }} />\n                ) : (\n                  <KeyboardArrowRight sx={{ width: '14px' }} />\n                )\n              }\n              disabled={!hasTraceInfo}\n              onClick={() => {\n                setShowTrace(v => !v)\n              }}\n              sx={{\n                height: '20px',\n                fontSize: '12px',\n                fontWeight: 600,\n                mb: 1,\n                border: 'none !important',\n                color: 'grey.700',\n                justifyContent: 'flex-start',\n                whiteSpace: 'nowrap',\n                maxWidth: '325px',\n                textTransform: 'none',\n                pl: 0,\n                '.MuiButton-startIcon': { mr: 0.5 },\n              }}\n            >\n              <Box sx={{ overflow: 'hidden', textOverflow: 'ellipsis' }}>\n                {traceButtonText}\n              </Box>\n            </Button>\n            {chatResponseTrace && (\n              <Collapse in={showTrace}>\n                <MarkdownSynapse\n                  markdown={traceMessages\n                    .map(getMarkdownForTraceMessage)\n                    .filter(md => md.trim().length > 0)\n                    .join('<br/><br/>')}\n                />\n              </Collapse>\n            )}\n          </Box>\n          {textContent && <MarkdownSynapse markdown={textContent} />}\n        </Box>\n      </ListItem>\n      {chatErrorReason && (\n        <Alert severity={'error'} sx={{ my: 2 }}>\n          {chatErrorReason}\n        </Alert>\n      )}\n    </>\n  )\n}\n\nexport default SynapseChatInteraction\n"],"names":["getMarkdownForTraceMessage","traceMessage","SynapseChatInteraction","userMessage","chatResponseText","chatErrorReason","chatResponseTrace","scrollIntoView","theme","useTheme","ref","useRef","showTrace","setShowTrace","useState","useEffect","isLoading","traceMessages","useMemo","traceEvent","extractMessageFromTraceEvent","trace","hasTraceInfo","lastReasoningMessage","traceButtonLoadingText","traceButtonText","textContent","doc","element","jsxs","Fragment","jsx","ListItem","ListItemText","Box","SmartToyTwoTone","Button","SynapseSpinner","KeyboardArrowDown","KeyboardArrowRight","v","Collapse","MarkdownSynapse","md","Alert"],"mappings":"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"}
+{"version":3,"file":"SynapseChatInteraction.js","sources":["../../../src/components/SynapseChat/SynapseChatInteraction.tsx"],"sourcesContent":["import { SynapseSpinner } from '@/components/LoadingScreen/LoadingScreen'\nimport extractMessageFromTraceEvent, {\n  TraceMessage,\n} from '@/components/SynapseChat/extractMessageFromTraceEvent'\nimport {\n  KeyboardArrowDown,\n  KeyboardArrowRight,\n  SmartToyTwoTone,\n} from '@mui/icons-material'\nimport {\n  Alert,\n  Box,\n  Button,\n  Chip,\n  Collapse,\n  ListItem,\n  ListItemText,\n  Stack,\n  Tooltip,\n  useTheme,\n} from '@mui/material'\nimport { Color } from '@mui/material/styles'\nimport { TraceEvent } from '@sage-bionetworks/synapse-types'\nimport { useEffect, useMemo, useRef, useState } from 'react'\nimport MarkdownSynapse from '../Markdown/MarkdownSynapse'\n\nexport type SynapseChatInteractionProps = {\n  userMessage: string\n  chatResponseText?: string\n  chatResponseTrace?: TraceEvent[]\n  scrollIntoView?: boolean\n  chatErrorReason?: string\n  onSendChat?: (message: string) => void\n}\n\n// Show tool calls in the trace. Useful for development. We may want to show them to users in the future.\nconst SHOW_TOOL_USE = false\n\nfunction getMarkdownForTraceMessage(traceMessage: TraceMessage): string {\n  if ('reasoningText' in traceMessage) {\n    return traceMessage.reasoningText\n  }\n  if (SHOW_TOOL_USE && 'toolName' in traceMessage) {\n    return `**Tool Used:** \\`${\n      traceMessage.toolName\n    }\\`\\n\\n**Tool Input:**\\n\\`\\`\\`json\\n${JSON.stringify(\n      traceMessage.toolInput,\n      null,\n      2,\n    )}\\n\\`\\`\\`\\n`\n  }\n  return ''\n}\n\nexport function SynapseChatInteraction({\n  userMessage,\n  chatResponseText,\n  chatErrorReason,\n  chatResponseTrace,\n  scrollIntoView = false,\n  onSendChat,\n}: SynapseChatInteractionProps) {\n  const theme = useTheme()\n  const ref = useRef<HTMLLIElement | null>(null)\n  const [showTrace, setShowTrace] = useState(false)\n\n  useEffect(() => {\n    // on mount, scroll into view if instructed\n    if (scrollIntoView) {\n      if (ref.current) {\n        ref.current.scrollIntoView({ behavior: 'smooth' })\n      }\n    }\n  }, [ref, scrollIntoView])\n\n  const isLoading = !chatResponseText && !chatErrorReason\n\n  const traceMessages = useMemo(\n    () =>\n      (chatResponseTrace ?? [])\n        .flatMap(traceEvent => extractMessageFromTraceEvent(traceEvent))\n        ?.filter(trace => !!trace),\n    [chatResponseTrace],\n  )\n\n  const hasTraceInfo = traceMessages.length > 0\n\n  const lastReasoningMessage = useMemo(\n    () => traceMessages.filter(trace => 'reasoningText' in trace).at(-1),\n    [traceMessages],\n  )\n\n  const traceButtonLoadingText =\n    lastReasoningMessage == null\n      ? 'Thinking...'\n      : lastReasoningMessage.reasoningText\n\n  const traceButtonText = isLoading\n    ? traceButtonLoadingText\n    : `${showTrace ? 'Hide' : 'Show'} Trace`\n\n  const { textContent, guidePrompts } = useMemo(() => {\n    try {\n      const parser = new DOMParser()\n      const doc = parser.parseFromString(chatResponseText ?? '', 'text/html')\n\n      // Remove tool_name and actions elements (AI XML tags not for display)\n      doc\n        .querySelectorAll('tool_name, actions')\n        .forEach(element => element.remove())\n\n      // Extract guideprompts before removing them\n      const extractedGuidePrompts = Array.from(\n        doc.querySelectorAll('guideprompt'),\n      )\n        .map(el => el.textContent?.trim())\n        .filter((t): t is string => !!t)\n\n      // Remove guideprompt elements\n      doc.querySelectorAll('guideprompt').forEach(element => element.remove())\n\n      // Extract text from <chat> element if present, otherwise use full body text\n      const chatElement = doc.querySelector('chat')\n      return {\n        textContent: chatElement\n          ? chatElement.textContent ?? ''\n          : doc.body.textContent ?? '',\n        guidePrompts: extractedGuidePrompts,\n      }\n    } catch (e) {\n      console.error(e)\n      return { textContent: chatResponseText ?? '', guidePrompts: [] }\n    }\n  }, [chatResponseText])\n\n  return (\n    <>\n      <ListItem\n        ref={ref}\n        sx={{\n          alignSelf: 'flex-end',\n          backgroundColor: (theme.palette.secondary as unknown as Color)[100],\n          borderRadius: '24px',\n          maxWidth: '70%',\n          display: 'block',\n          mb: '5px',\n          p: '8px 12px',\n          wordWrap: 'break-word',\n          width: 'auto',\n        }}\n      >\n        <ListItemText primary={userMessage} />\n      </ListItem>\n      <ListItem\n        sx={{\n          display: 'grid',\n          gridTemplateColumns: '50px auto',\n          columnGap: '0px',\n          justifyItems: 'center',\n          alignItems: 'start',\n          p: '0px',\n        }}\n      >\n        <Box\n          sx={{\n            p: '3px',\n            mt: '10px',\n            height: '31px',\n            borderRadius: '50%',\n            borderStyle: 'solid',\n            borderWidth: '1px',\n            borderColor: 'grey.300',\n          }}\n        >\n          <SmartToyTwoTone sx={{ color: 'secondary.main' }} />\n        </Box>\n        <Box\n          sx={{\n            borderRadius: '10px',\n            padding: '10px',\n            maxWidth: '100%',\n            overflow: 'auto',\n          }}\n        >\n          <Box\n            component={'aside'}\n            sx={{\n              '.markdown': {\n                fontStyle: 'italic',\n                borderLeft: `4px solid ${theme.palette.grey[300]}`,\n                marginLeft: '4px',\n                paddingLeft: '8px',\n                mt: 1,\n                mb: 2,\n              },\n            }}\n          >\n            <Button\n              variant={'outlined'}\n              size={'small'}\n              startIcon={\n                isLoading ? (\n                  <SynapseSpinner size={14} />\n                ) : showTrace ? (\n                  <KeyboardArrowDown sx={{ width: '14px' }} />\n                ) : (\n                  <KeyboardArrowRight sx={{ width: '14px' }} />\n                )\n              }\n              disabled={!hasTraceInfo}\n              onClick={() => {\n                setShowTrace(v => !v)\n              }}\n              sx={{\n                height: '20px',\n                fontSize: '12px',\n                fontWeight: 600,\n                mb: 1,\n                border: 'none !important',\n                color: 'grey.700',\n                justifyContent: 'flex-start',\n                whiteSpace: 'nowrap',\n                maxWidth: '325px',\n                textTransform: 'none',\n                pl: 0,\n                '.MuiButton-startIcon': { mr: 0.5 },\n              }}\n            >\n              <Box sx={{ overflow: 'hidden', textOverflow: 'ellipsis' }}>\n                {traceButtonText}\n              </Box>\n            </Button>\n            {chatResponseTrace && (\n              <Collapse in={showTrace}>\n                <MarkdownSynapse\n                  markdown={traceMessages\n                    .map(getMarkdownForTraceMessage)\n                    .filter(md => md.trim().length > 0)\n                    .join('<br/><br/>')}\n                />\n              </Collapse>\n            )}\n          </Box>\n          {textContent && <MarkdownSynapse markdown={textContent} />}\n          {onSendChat && guidePrompts.length > 0 && (\n            <Stack direction=\"row\" flexWrap=\"wrap\" gap={1} mt={1}>\n              {guidePrompts.map(prompt => (\n                <Tooltip key={prompt} title={prompt}>\n                  <Chip\n                    label={prompt}\n                    variant=\"outlined\"\n                    color=\"primary\"\n                    clickable\n                    onClick={() => onSendChat(prompt)}\n                    sx={{ maxWidth: 200 }}\n                  />\n                </Tooltip>\n              ))}\n            </Stack>\n          )}\n        </Box>\n      </ListItem>\n      {chatErrorReason && (\n        <Alert severity={'error'} sx={{ my: 2 }}>\n          {chatErrorReason}\n        </Alert>\n      )}\n    </>\n  )\n}\n\nexport default SynapseChatInteraction\n"],"names":["getMarkdownForTraceMessage","traceMessage","SynapseChatInteraction","userMessage","chatResponseText","chatErrorReason","chatResponseTrace","scrollIntoView","onSendChat","theme","useTheme","ref","useRef","showTrace","setShowTrace","useState","useEffect","isLoading","traceMessages","useMemo","traceEvent","extractMessageFromTraceEvent","trace","hasTraceInfo","lastReasoningMessage","traceButtonLoadingText","traceButtonText","textContent","guidePrompts","doc","element","extractedGuidePrompts","el","t","chatElement","jsxs","Fragment","jsx","ListItem","ListItemText","Box","SmartToyTwoTone","Button","SynapseSpinner","KeyboardArrowDown","KeyboardArrowRight","v","Collapse","MarkdownSynapse","md","Stack","Tooltip","prompt","Chip","Alert"],"mappings":"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"}

package/dist/components/SynapseChat/SynapseChatMessage.d.ts

@@ -1,5 +1,6 @@
 type SynapseChatMessageProps = {
     chatJobId: string;
+    onSendChat?: (message: string) => void;
 };
 export default function SynapseChatMessage(props: SynapseChatMessageProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/SynapseChat/SynapseChatMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseChatMessage.d.ts","sourceRoot":"","sources":["../../../src/components/SynapseChat/SynapseChatMessage.tsx"],"names":[],"mappings":"AA8CA,KAAK,uBAAuB,GAAG;IAC7B,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CAwBxE"}
+{"version":3,"file":"SynapseChatMessage.d.ts","sourceRoot":"","sources":["../../../src/components/SynapseChat/SynapseChatMessage.tsx"],"names":[],"mappings":"AA8CA,KAAK,uBAAuB,GAAG;IAC7B,SAAS,EAAE,MAAM,CAAA;IACjB,UAAU,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;CACvC,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CAyBxE"}

package/dist/components/SynapseChat/SynapseChatMessage.js

@@ -3,13 +3,13 @@ import { SynapseChatInteraction as h } from "./SynapseChatInteraction.js";
 import m from "../../synapse-queries/asynchronous/usePollAsynchronousJob.js";
 import { useGetChatAgentTraceEvents as f } from "../../synapse-queries/chat/useChat.js";
 import { useState as T, useCallback as l, useEffect as E } from "react";
-function g(n, s) {
-  const [e, r] = T([]), a = l((c) => {
-    r((p) => [...p, ...c]);
-  }, []), o = e.at(e.length - 1), { data: t } = f(
+function d(o, s) {
+  const [a, e] = T([]), n = l((c) => {
+    e((p) => [...p, ...c]);
+  }, []), r = a.at(a.length - 1), { data: t } = f(
     {
-      jobId: n,
-      newerThanTimestamp: o?.timestamp
+      jobId: o,
+      newerThanTimestamp: r?.timestamp
     },
     {
       enabled: s,
@@ -20,20 +20,21 @@ function g(n, s) {
     }
   );
   return E(() => {
-    t && t.page.length > 0 && (a(t.page), console.debug(t.page));
-  }, [a, t]), {
-    traceEvents: e
+    t && t.page.length > 0 && (n(t.page), console.debug(t.page));
+  }, [n, t]), {
+    traceEvents: a
   };
 }
-function I(n) {
-  const { chatJobId: s } = n, { data: e } = m(s), r = e?.requestBody, a = e?.responseBody, o = e?.errorMessage, t = !!s && (!e?.jobState || e.jobState == "PROCESSING"), { traceEvents: c } = g(s, t);
+function I(o) {
+  const { chatJobId: s, onSendChat: a } = o, { data: e } = m(s), n = e?.requestBody, r = e?.responseBody, t = e?.errorMessage, c = !!s && (!e?.jobState || e.jobState == "PROCESSING"), { traceEvents: p } = d(s, c);
   return /* @__PURE__ */ u(
     h,
     {
-      userMessage: r?.chatText,
-      chatResponseText: a?.responseText,
-      chatResponseTrace: c,
-      chatErrorReason: o
+      userMessage: n?.chatText,
+      chatResponseText: r?.responseText,
+      chatResponseTrace: p,
+      chatErrorReason: t,
+      onSendChat: a
     }
   );
 }

package/dist/components/SynapseChat/SynapseChatMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"SynapseChatMessage.js","sources":["../../../src/components/SynapseChat/SynapseChatMessage.tsx"],"sourcesContent":["import SynapseChatInteraction from '@/components/SynapseChat/SynapseChatInteraction'\nimport usePollAsynchronousJob from '@/synapse-queries/asynchronous/usePollAsynchronousJob'\nimport { useGetChatAgentTraceEvents } from '@/synapse-queries/chat/useChat'\nimport {\n  AgentChatRequest,\n  AgentChatResponse,\n  TraceEvent,\n} from '@sage-bionetworks/synapse-types'\nimport { useCallback, useEffect, useState } from 'react'\n\nfunction useTraceEvent(chatJobId: string, enabled: boolean) {\n  const [traceEvents, setTraceEvents] = useState<TraceEvent[]>([])\n\n  const appendTraceEvents = useCallback((newEvents: TraceEvent[]) => {\n    setTraceEvents(prev => {\n      return [...prev, ...newEvents]\n    })\n  }, [])\n\n  const latestTraceEvent = traceEvents.at(traceEvents.length - 1)\n  const { data: newTraceEvents } = useGetChatAgentTraceEvents(\n    {\n      jobId: chatJobId,\n      newerThanTimestamp: latestTraceEvent?.timestamp,\n    },\n    {\n      enabled: enabled,\n      refetchInterval: 1000, // Re-fetch every second if enabled\n      refetchIntervalInBackground: true, // Continue polling even when the tab is not active\n    },\n  )\n  useEffect(() => {\n    if (newTraceEvents && newTraceEvents.page.length > 0) {\n      appendTraceEvents(newTraceEvents.page)\n\n      // send trace events to the console to ease agent debugging\n      // if the trace events do not contain the latest event, add the events to the array\n      console.debug(newTraceEvents.page)\n    }\n  }, [appendTraceEvents, newTraceEvents])\n\n  return {\n    traceEvents,\n  }\n}\n\ntype SynapseChatMessageProps = {\n  chatJobId: string\n}\n\nexport default function SynapseChatMessage(props: SynapseChatMessageProps) {\n  const { chatJobId } = props\n  const { data: asyncJobStatus } = usePollAsynchronousJob(chatJobId)\n\n  const chatRequest = asyncJobStatus?.requestBody as AgentChatRequest\n  const chatResponse = asyncJobStatus?.responseBody as\n    | AgentChatResponse\n    | undefined\n  const chatError = asyncJobStatus?.errorMessage\n\n  // enabled if the job has not finished processing\n  const enableTrace =\n    !!chatJobId &&\n    (!asyncJobStatus?.jobState || asyncJobStatus.jobState == 'PROCESSING')\n  const { traceEvents } = useTraceEvent(chatJobId, enableTrace)\n\n  return (\n    <SynapseChatInteraction\n      userMessage={chatRequest?.chatText}\n      chatResponseText={chatResponse?.responseText}\n      chatResponseTrace={traceEvents}\n      chatErrorReason={chatError}\n    />\n  )\n}\n"],"names":["useTraceEvent","chatJobId","enabled","traceEvents","setTraceEvents","useState","appendTraceEvents","useCallback","newEvents","prev","latestTraceEvent","newTraceEvents","useGetChatAgentTraceEvents","useEffect","SynapseChatMessage","props","asyncJobStatus","usePollAsynchronousJob","chatRequest","chatResponse","chatError","enableTrace","jsx","SynapseChatInteraction"],"mappings":";;;;;AAUA,SAASA,EAAcC,GAAmBC,GAAkB;AAC1D,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAuB,CAAA,CAAE,GAEzDC,IAAoBC,EAAY,CAACC,MAA4B;AACjE,IAAAJ,EAAe,CAAAK,MACN,CAAC,GAAGA,GAAM,GAAGD,CAAS,CAC9B;AAAA,EACH,GAAG,CAAA,CAAE,GAECE,IAAmBP,EAAY,GAAGA,EAAY,SAAS,CAAC,GACxD,EAAE,MAAMQ,EAAA,IAAmBC;AAAA,IAC/B;AAAA,MACE,OAAOX;AAAA,MACP,oBAAoBS,GAAkB;AAAA,IAAA;AAAA,IAExC;AAAA,MACE,SAAAR;AAAA,MACA,iBAAiB;AAAA;AAAA,MACjB,6BAA6B;AAAA;AAAA,IAAA;AAAA,EAC/B;AAEF,SAAAW,EAAU,MAAM;AACd,IAAIF,KAAkBA,EAAe,KAAK,SAAS,MACjDL,EAAkBK,EAAe,IAAI,GAIrC,QAAQ,MAAMA,EAAe,IAAI;AAAA,EAErC,GAAG,CAACL,GAAmBK,CAAc,CAAC,GAE/B;AAAA,IACL,aAAAR;AAAA,EAAA;AAEJ;AAMA,SAAwBW,EAAmBC,GAAgC;AACzE,QAAM,EAAE,WAAAd,MAAcc,GAChB,EAAE,MAAMC,MAAmBC,EAAuBhB,CAAS,GAE3DiB,IAAcF,GAAgB,aAC9BG,IAAeH,GAAgB,cAG/BI,IAAYJ,GAAgB,cAG5BK,IACJ,CAAC,CAACpB,MACD,CAACe,GAAgB,YAAYA,EAAe,YAAY,eACrD,EAAE,aAAAb,EAAA,IAAgBH,EAAcC,GAAWoB,CAAW;AAE5D,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAaL,GAAa;AAAA,MAC1B,kBAAkBC,GAAc;AAAA,MAChC,mBAAmBhB;AAAA,MACnB,iBAAiBiB;AAAA,IAAA;AAAA,EAAA;AAGvB;"}
+{"version":3,"file":"SynapseChatMessage.js","sources":["../../../src/components/SynapseChat/SynapseChatMessage.tsx"],"sourcesContent":["import SynapseChatInteraction from '@/components/SynapseChat/SynapseChatInteraction'\nimport usePollAsynchronousJob from '@/synapse-queries/asynchronous/usePollAsynchronousJob'\nimport { useGetChatAgentTraceEvents } from '@/synapse-queries/chat/useChat'\nimport {\n  AgentChatRequest,\n  AgentChatResponse,\n  TraceEvent,\n} from '@sage-bionetworks/synapse-types'\nimport { useCallback, useEffect, useState } from 'react'\n\nfunction useTraceEvent(chatJobId: string, enabled: boolean) {\n  const [traceEvents, setTraceEvents] = useState<TraceEvent[]>([])\n\n  const appendTraceEvents = useCallback((newEvents: TraceEvent[]) => {\n    setTraceEvents(prev => {\n      return [...prev, ...newEvents]\n    })\n  }, [])\n\n  const latestTraceEvent = traceEvents.at(traceEvents.length - 1)\n  const { data: newTraceEvents } = useGetChatAgentTraceEvents(\n    {\n      jobId: chatJobId,\n      newerThanTimestamp: latestTraceEvent?.timestamp,\n    },\n    {\n      enabled: enabled,\n      refetchInterval: 1000, // Re-fetch every second if enabled\n      refetchIntervalInBackground: true, // Continue polling even when the tab is not active\n    },\n  )\n  useEffect(() => {\n    if (newTraceEvents && newTraceEvents.page.length > 0) {\n      appendTraceEvents(newTraceEvents.page)\n\n      // send trace events to the console to ease agent debugging\n      // if the trace events do not contain the latest event, add the events to the array\n      console.debug(newTraceEvents.page)\n    }\n  }, [appendTraceEvents, newTraceEvents])\n\n  return {\n    traceEvents,\n  }\n}\n\ntype SynapseChatMessageProps = {\n  chatJobId: string\n  onSendChat?: (message: string) => void\n}\n\nexport default function SynapseChatMessage(props: SynapseChatMessageProps) {\n  const { chatJobId, onSendChat } = props\n  const { data: asyncJobStatus } = usePollAsynchronousJob(chatJobId)\n\n  const chatRequest = asyncJobStatus?.requestBody as AgentChatRequest\n  const chatResponse = asyncJobStatus?.responseBody as\n    | AgentChatResponse\n    | undefined\n  const chatError = asyncJobStatus?.errorMessage\n\n  // enabled if the job has not finished processing\n  const enableTrace =\n    !!chatJobId &&\n    (!asyncJobStatus?.jobState || asyncJobStatus.jobState == 'PROCESSING')\n  const { traceEvents } = useTraceEvent(chatJobId, enableTrace)\n\n  return (\n    <SynapseChatInteraction\n      userMessage={chatRequest?.chatText}\n      chatResponseText={chatResponse?.responseText}\n      chatResponseTrace={traceEvents}\n      chatErrorReason={chatError}\n      onSendChat={onSendChat}\n    />\n  )\n}\n"],"names":["useTraceEvent","chatJobId","enabled","traceEvents","setTraceEvents","useState","appendTraceEvents","useCallback","newEvents","prev","latestTraceEvent","newTraceEvents","useGetChatAgentTraceEvents","useEffect","SynapseChatMessage","props","onSendChat","asyncJobStatus","usePollAsynchronousJob","chatRequest","chatResponse","chatError","enableTrace","jsx","SynapseChatInteraction"],"mappings":";;;;;AAUA,SAASA,EAAcC,GAAmBC,GAAkB;AAC1D,QAAM,CAACC,GAAaC,CAAc,IAAIC,EAAuB,CAAA,CAAE,GAEzDC,IAAoBC,EAAY,CAACC,MAA4B;AACjE,IAAAJ,EAAe,CAAAK,MACN,CAAC,GAAGA,GAAM,GAAGD,CAAS,CAC9B;AAAA,EACH,GAAG,CAAA,CAAE,GAECE,IAAmBP,EAAY,GAAGA,EAAY,SAAS,CAAC,GACxD,EAAE,MAAMQ,EAAA,IAAmBC;AAAA,IAC/B;AAAA,MACE,OAAOX;AAAA,MACP,oBAAoBS,GAAkB;AAAA,IAAA;AAAA,IAExC;AAAA,MACE,SAAAR;AAAA,MACA,iBAAiB;AAAA;AAAA,MACjB,6BAA6B;AAAA;AAAA,IAAA;AAAA,EAC/B;AAEF,SAAAW,EAAU,MAAM;AACd,IAAIF,KAAkBA,EAAe,KAAK,SAAS,MACjDL,EAAkBK,EAAe,IAAI,GAIrC,QAAQ,MAAMA,EAAe,IAAI;AAAA,EAErC,GAAG,CAACL,GAAmBK,CAAc,CAAC,GAE/B;AAAA,IACL,aAAAR;AAAA,EAAA;AAEJ;AAOA,SAAwBW,EAAmBC,GAAgC;AACzE,QAAM,EAAE,WAAAd,GAAW,YAAAe,EAAA,IAAeD,GAC5B,EAAE,MAAME,MAAmBC,EAAuBjB,CAAS,GAE3DkB,IAAcF,GAAgB,aAC9BG,IAAeH,GAAgB,cAG/BI,IAAYJ,GAAgB,cAG5BK,IACJ,CAAC,CAACrB,MACD,CAACgB,GAAgB,YAAYA,EAAe,YAAY,eACrD,EAAE,aAAAd,EAAA,IAAgBH,EAAcC,GAAWqB,CAAW;AAE5D,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAaL,GAAa;AAAA,MAC1B,kBAAkBC,GAAc;AAAA,MAChC,mBAAmBjB;AAAA,MACnB,iBAAiBkB;AAAA,MACjB,YAAAL;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components/SynapseChat/SynapsePortalChatDialog.d.ts

@@ -0,0 +1,12 @@
+import { SynapseChatProps } from './SynapseChat';
+export type SynapsePortalChatDialogProps = SynapseChatProps & {
+    open: boolean;
+    onClose: () => void;
+};
+/**
+ * A dialog that wraps SynapseChat with externally-controlled open/close state.
+ * Only shown when the user is logged in and the PORTAL_CHAT feature flag is enabled.
+ */
+export declare function SynapsePortalChatDialog({ open, onClose, ...chatDialogProps }: SynapsePortalChatDialogProps): import("react/jsx-runtime").JSX.Element;
+export default SynapsePortalChatDialog;
+//# sourceMappingURL=SynapsePortalChatDialog.d.ts.map

package/dist/components/SynapseChat/SynapsePortalChatDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SynapsePortalChatDialog.d.ts","sourceRoot":"","sources":["../../../src/components/SynapseChat/SynapsePortalChatDialog.tsx"],"names":[],"mappings":"AACA,OAAoB,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA;AAE7D,MAAM,MAAM,4BAA4B,GAAG,gBAAgB,GAAG;IAC5D,IAAI,EAAE,OAAO,CAAA;IACb,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB,CAAA;AAED;;;GAGG;AACH,wBAAgB,uBAAuB,CAAC,EACtC,IAAI,EACJ,OAAO,EACP,GAAG,eAAe,EACnB,EAAE,4BAA4B,2CAc9B;AAED,eAAe,uBAAuB,CAAA"}

package/dist/components/SynapseChat/SynapsePortalChatDialog.js

@@ -0,0 +1,30 @@
+import { jsx as e } from "react/jsx-runtime";
+import r from "../DraggableDialog/DraggableDialog.js";
+import { SynapseChat as i } from "./SynapseChat.js";
+function m({
+  open: a,
+  onClose: o,
+  ...t
+}) {
+  return /* @__PURE__ */ e(
+    r,
+    {
+      open: a,
+      onClose: o,
+      title: t.chatbotName || "SynapseChat",
+      children: /* @__PURE__ */ e(
+        i,
+        {
+          hideTitle: !0,
+          textboxPositionOffset: "16px",
+          ...t
+        }
+      )
+    }
+  );
+}
+export {
+  m as SynapsePortalChatDialog,
+  m as default
+};
+//# sourceMappingURL=SynapsePortalChatDialog.js.map

package/dist/components/SynapseChat/SynapsePortalChatDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SynapsePortalChatDialog.js","sources":["../../../src/components/SynapseChat/SynapsePortalChatDialog.tsx"],"sourcesContent":["import DraggableDialog from '../DraggableDialog/DraggableDialog'\nimport SynapseChat, { SynapseChatProps } from './SynapseChat'\n\nexport type SynapsePortalChatDialogProps = SynapseChatProps & {\n  open: boolean\n  onClose: () => void\n}\n\n/**\n * A dialog that wraps SynapseChat with externally-controlled open/close state.\n * Only shown when the user is logged in and the PORTAL_CHAT feature flag is enabled.\n */\nexport function SynapsePortalChatDialog({\n  open,\n  onClose,\n  ...chatDialogProps\n}: SynapsePortalChatDialogProps) {\n  return (\n    <DraggableDialog\n      open={open}\n      onClose={onClose}\n      title={chatDialogProps.chatbotName || 'SynapseChat'}\n    >\n      <SynapseChat\n        hideTitle={true}\n        textboxPositionOffset=\"16px\"\n        {...chatDialogProps}\n      />\n    </DraggableDialog>\n  )\n}\n\nexport default SynapsePortalChatDialog\n"],"names":["SynapsePortalChatDialog","open","onClose","chatDialogProps","jsx","DraggableDialog","SynapseChat"],"mappings":";;;AAYO,SAASA,EAAwB;AAAA,EACtC,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,GAAGC;AACL,GAAiC;AAC/B,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAJ;AAAA,MACA,SAAAC;AAAA,MACA,OAAOC,EAAgB,eAAe;AAAA,MAEtC,UAAA,gBAAAC;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,WAAW;AAAA,UACX,uBAAsB;AAAA,UACrB,GAAGH;AAAA,QAAA;AAAA,MAAA;AAAA,IACN;AAAA,EAAA;AAGN;"}

package/dist/components/SynapseChat/extractMessageFromTraceEvent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"extractMessageFromTraceEvent.d.ts","sourceRoot":"","sources":["../../../src/components/SynapseChat/extractMessageFromTraceEvent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAA;AAG5D,MAAM,MAAM,YAAY,GACpB;IACE,aAAa,EAAE,MAAM,CAAA;CACtB,GACD;IACE,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAEL,MAAM,CAAC,OAAO,UAAU,4BAA4B,CAClD,KAAK,EAAE,UAAU,GAChB,YAAY,EAAE,GAAG,IAAI,CA+BvB"}
+{"version":3,"file":"extractMessageFromTraceEvent.d.ts","sourceRoot":"","sources":["../../../src/components/SynapseChat/extractMessageFromTraceEvent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAA;AAG5D,MAAM,MAAM,YAAY,GACpB;IACE,aAAa,EAAE,MAAM,CAAA;CACtB,GACD;IACE,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,EAAE,MAAM,CAAA;CAClB,CAAA;AAEL,MAAM,CAAC,OAAO,UAAU,4BAA4B,CAClD,KAAK,EAAE,UAAU,GAChB,YAAY,EAAE,GAAG,IAAI,CAqCvB"}

package/dist/components/SynapseChat/extractMessageFromTraceEvent.js

@@ -1,26 +1,32 @@
-import { JSONPath as t } from "jsonpath-plus";
-function c(a) {
-  const e = [], r = JSON.parse(a.message);
-  return t({
+import { JSONPath as o } from "jsonpath-plus";
+function p(n) {
+  const s = [];
+  let a;
+  try {
+    a = JSON.parse(n.message);
+  } catch (e) {
+    return console.error(e), [{ reasoningText: n.message }];
+  }
+  return o({
     path: "$.output.message.content[*]",
-    json: r
-  }).forEach((o) => {
-    const n = t({
+    json: a
+  }).forEach((e) => {
+    const r = o({
       path: "$.reasoningContent.reasoningText.text",
-      json: o
+      json: e
     });
-    n[0] && e.push({ reasoningText: n[0] });
-    const s = t({
+    r[0] && s.push({ reasoningText: r[0] });
+    const t = o({
       path: "$.toolUse[name,input]",
-      json: o
+      json: e
     });
-    s.length > 0 && e.push({
-      toolName: s[0],
-      toolInput: s[1]
+    t.length > 0 && s.push({
+      toolName: t[0],
+      toolInput: t[1]
     });
-  }), e;
+  }), s;
 }
 export {
-  c as default
+  p as default
 };
 //# sourceMappingURL=extractMessageFromTraceEvent.js.map

package/dist/components/SynapseChat/extractMessageFromTraceEvent.js.map

@@ -1 +1 @@
-{"version":3,"file":"extractMessageFromTraceEvent.js","sources":["../../../src/components/SynapseChat/extractMessageFromTraceEvent.ts"],"sourcesContent":["import { TraceEvent } from '@sage-bionetworks/synapse-types'\nimport { JSONPath } from 'jsonpath-plus'\n\nexport type TraceMessage =\n  | {\n      reasoningText: string\n    }\n  | {\n      toolName: string\n      toolInput: string\n    }\n\nexport default function extractMessageFromTraceEvent(\n  event: TraceEvent,\n): TraceMessage[] | null {\n  // WARNING: The message format may change when we change models.\n  const messagesToAdd: TraceMessage[] = []\n  const parsedMessage = JSON.parse(event.message) as object\n\n  const messages = JSONPath({\n    path: '$.output.message.content[*]',\n    json: parsedMessage,\n  })\n\n  messages.forEach((message: any) => {\n    const reasoningMessage = JSONPath({\n      path: '$.reasoningContent.reasoningText.text',\n      json: message,\n    })\n    if (reasoningMessage[0]) {\n      messagesToAdd.push({ reasoningText: reasoningMessage[0] })\n    }\n    const toolUseMessage = JSONPath({\n      path: '$.toolUse[name,input]',\n      json: message,\n    })\n\n    if (toolUseMessage.length > 0) {\n      messagesToAdd.push({\n        toolName: toolUseMessage[0],\n        toolInput: toolUseMessage[1],\n      })\n    }\n  })\n  return messagesToAdd\n}\n"],"names":["extractMessageFromTraceEvent","event","messagesToAdd","parsedMessage","JSONPath","message","reasoningMessage","toolUseMessage"],"mappings":";AAYA,SAAwBA,EACtBC,GACuB;AAEvB,QAAMC,IAAgC,CAAA,GAChCC,IAAgB,KAAK,MAAMF,EAAM,OAAO;AAO9C,SALiBG,EAAS;AAAA,IACxB,MAAM;AAAA,IACN,MAAMD;AAAA,EAAA,CACP,EAEQ,QAAQ,CAACE,MAAiB;AACjC,UAAMC,IAAmBF,EAAS;AAAA,MAChC,MAAM;AAAA,MACN,MAAMC;AAAA,IAAA,CACP;AACD,IAAIC,EAAiB,CAAC,KACpBJ,EAAc,KAAK,EAAE,eAAeI,EAAiB,CAAC,GAAG;AAE3D,UAAMC,IAAiBH,EAAS;AAAA,MAC9B,MAAM;AAAA,MACN,MAAMC;AAAA,IAAA,CACP;AAED,IAAIE,EAAe,SAAS,KAC1BL,EAAc,KAAK;AAAA,MACjB,UAAUK,EAAe,CAAC;AAAA,MAC1B,WAAWA,EAAe,CAAC;AAAA,IAAA,CAC5B;AAAA,EAEL,CAAC,GACML;AACT;"}
+{"version":3,"file":"extractMessageFromTraceEvent.js","sources":["../../../src/components/SynapseChat/extractMessageFromTraceEvent.ts"],"sourcesContent":["import { TraceEvent } from '@sage-bionetworks/synapse-types'\nimport { JSONPath } from 'jsonpath-plus'\n\nexport type TraceMessage =\n  | {\n      reasoningText: string\n    }\n  | {\n      toolName: string\n      toolInput: string\n    }\n\nexport default function extractMessageFromTraceEvent(\n  event: TraceEvent,\n): TraceMessage[] | null {\n  // WARNING: The message format may change when we change models.\n  const messagesToAdd: TraceMessage[] = []\n  let parsedMessage: object\n  try {\n    parsedMessage = JSON.parse(event.message) as object\n  } catch (e) {\n    console.error(e)\n    return [{ reasoningText: event.message }]\n  }\n\n  const messages = JSONPath({\n    path: '$.output.message.content[*]',\n    json: parsedMessage,\n  })\n\n  messages.forEach((message: any) => {\n    const reasoningMessage = JSONPath({\n      path: '$.reasoningContent.reasoningText.text',\n      json: message,\n    })\n    if (reasoningMessage[0]) {\n      messagesToAdd.push({ reasoningText: reasoningMessage[0] })\n    }\n    const toolUseMessage = JSONPath({\n      path: '$.toolUse[name,input]',\n      json: message,\n    })\n\n    if (toolUseMessage.length > 0) {\n      messagesToAdd.push({\n        toolName: toolUseMessage[0],\n        toolInput: toolUseMessage[1],\n      })\n    }\n  })\n  return messagesToAdd\n}\n"],"names":["extractMessageFromTraceEvent","event","messagesToAdd","parsedMessage","JSONPath","message","reasoningMessage","toolUseMessage"],"mappings":";AAYA,SAAwBA,EACtBC,GACuB;AAEvB,QAAMC,IAAgC,CAAA;AACtC,MAAIC;AACJ,MAAI;AACF,IAAAA,IAAgB,KAAK,MAAMF,EAAM,OAAO;AAAA,EAC1C,SAAS,GAAG;AACV,mBAAQ,MAAM,CAAC,GACR,CAAC,EAAE,eAAeA,EAAM,SAAS;AAAA,EAC1C;AAOA,SALiBG,EAAS;AAAA,IACxB,MAAM;AAAA,IACN,MAAMD;AAAA,EAAA,CACP,EAEQ,QAAQ,CAACE,MAAiB;AACjC,UAAMC,IAAmBF,EAAS;AAAA,MAChC,MAAM;AAAA,MACN,MAAMC;AAAA,IAAA,CACP;AACD,IAAIC,EAAiB,CAAC,KACpBJ,EAAc,KAAK,EAAE,eAAeI,EAAiB,CAAC,GAAG;AAE3D,UAAMC,IAAiBH,EAAS;AAAA,MAC9B,MAAM;AAAA,MACN,MAAMC;AAAA,IAAA,CACP;AAED,IAAIE,EAAe,SAAS,KAC1BL,EAAc,KAAK;AAAA,MACjB,UAAUK,EAAe,CAAC;AAAA,MAC1B,WAAWA,EAAe,CAAC;AAAA,IAAA,CAC5B;AAAA,EAEL,CAAC,GACML;AACT;"}

package/dist/components/SynapseChat/index.d.ts

@@ -2,4 +2,6 @@ import SynapseChat from './SynapseChat';
 import type { SynapseChatProps } from './SynapseChat';
 export { SynapseChat, SynapseChatProps };
 export default SynapseChat;
+export { SynapsePortalChatDialog } from './SynapsePortalChatDialog';
+export type { SynapsePortalChatDialogProps } from './SynapsePortalChatDialog';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/SynapseChat/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SynapseChat/index.ts"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,eAAe,CAAA;AACvC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,WAAW,EAAE,gBAAgB,EAAE,CAAA;AACxC,eAAe,WAAW,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SynapseChat/index.ts"],"names":[],"mappings":"AAAA,OAAO,WAAW,MAAM,eAAe,CAAA;AACvC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,WAAW,EAAE,gBAAgB,EAAE,CAAA;AACxC,eAAe,WAAW,CAAA;AAE1B,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAA;AACnE,YAAY,EAAE,4BAA4B,EAAE,MAAM,2BAA2B,CAAA"}

package/dist/components/SynapseChat/index.js

@@ -1,6 +1,8 @@
-import { SynapseChat as t } from "./SynapseChat.js";
+import { SynapseChat as o } from "./SynapseChat.js";
+import { SynapsePortalChatDialog as e } from "./SynapsePortalChatDialog.js";
 export {
-  t as SynapseChat,
-  t as default
+  o as SynapseChat,
+  e as SynapsePortalChatDialog,
+  o as default
 };
 //# sourceMappingURL=index.js.map

package/dist/components/SynapseChat/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/dist/components/SynapseChat/useChatState.d.ts

@@ -4,5 +4,5 @@ export type ChatState = {
     pendingMessage: string | null;
     chatJobIds: string[];
 };
-export declare function useChatState(agentSession?: AgentSession): ChatState;
+export declare function useChatState(agentSession?: AgentSession, onChatResponse?: (responseText: string) => void): ChatState;
 //# sourceMappingURL=useChatState.d.ts.map

package/dist/components/SynapseChat/useChatState.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useChatState.d.ts","sourceRoot":"","sources":["../../../src/components/SynapseChat/useChatState.ts"],"names":[],"mappings":"AACA,OAAO,EAGL,YAAY,EAEb,MAAM,iCAAiC,CAAA;AAGxC,MAAM,MAAM,SAAS,GAAG;IACtB,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,cAAc,EAAE,MAAM,GAAG,IAAI,CAAA;IAC7B,UAAU,EAAE,MAAM,EAAE,CAAA;CACrB,CAAA;AAED,wBAAgB,YAAY,CAAC,YAAY,CAAC,EAAE,YAAY,GAAG,SAAS,CAsCnE"}
+{"version":3,"file":"useChatState.d.ts","sourceRoot":"","sources":["../../../src/components/SynapseChat/useChatState.ts"],"names":[],"mappings":"AACA,OAAO,EAGL,YAAY,EAEb,MAAM,iCAAiC,CAAA;AAGxC,MAAM,MAAM,SAAS,GAAG;IACtB,QAAQ,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;IACnC,cAAc,EAAE,MAAM,GAAG,IAAI,CAAA;IAC7B,UAAU,EAAE,MAAM,EAAE,CAAA;CACrB,CAAA;AAED,wBAAgB,YAAY,CAC1B,YAAY,CAAC,EAAE,YAAY,EAC3B,cAAc,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,GAC9C,SAAS,CAyCX"}

package/dist/components/SynapseChat/useChatState.js

@@ -1,16 +1,19 @@
 import { useSendChatMessageToAgent as i } from "../../synapse-queries/chat/useChat.js";
-import { useState as r, useCallback as u, useMemo as h } from "react";
-function I(t) {
-  const [s, c] = r([]), [n, o] = r(null), { mutate: a } = i(
+import { useState as c, useCallback as h, useMemo as l } from "react";
+function b(t, r) {
+  const [s, u] = c([]), [n, o] = c(null), { mutate: a } = i(
     {
       onMutate: (e) => {
         o(e.chatText);
+      },
+      onSuccess: (e) => {
+        r?.(e.responseText);
       }
     },
     (e) => {
-      s.includes(e.jobId) || (o(null), c(() => [...s, e.jobId]));
+      s.includes(e.jobId) || (o(null), u(() => [...s, e.jobId]));
     }
-  ), d = u(
+  ), d = h(
     (e) => {
       if (!t?.sessionId)
         throw new Error("No agent session available to send chat message.");
@@ -22,12 +25,12 @@ function I(t) {
     },
     [t?.sessionId, a]
   );
-  return h(
+  return l(
     () => ({ sendChat: d, pendingMessage: n, chatJobIds: s }),
     [d, n, s]
   );
 }
 export {
-  I as useChatState
+  b as useChatState
 };
 //# sourceMappingURL=useChatState.js.map

package/dist/components/SynapseChat/useChatState.js.map

@@ -1 +1 @@
-{"version":3,"file":"useChatState.js","sources":["../../../src/components/SynapseChat/useChatState.ts"],"sourcesContent":["import { useSendChatMessageToAgent } from '@/synapse-queries/chat/useChat'\nimport {\n  AgentChatRequest,\n  AgentChatResponse,\n  AgentSession,\n  AsynchronousJobStatus,\n} from '@sage-bionetworks/synapse-types'\nimport { useCallback, useMemo, useState } from 'react'\n\nexport type ChatState = {\n  sendChat: (message: string) => void\n  pendingMessage: string | null\n  chatJobIds: string[]\n}\n\nexport function useChatState(agentSession?: AgentSession): ChatState {\n  const [chatJobIds, setChatJobIds] = useState<string[]>([])\n  // Optimistic update state for latest unprocessed message\n  const [pendingMessage, setPendingMessage] = useState<string | null>(null)\n\n  const { mutate: sendChatMessageToAgent } = useSendChatMessageToAgent(\n    {\n      onMutate: (newChatMessage: AgentChatRequest) => {\n        // set the pending message to the new chat message\n        setPendingMessage(newChatMessage.chatText)\n      },\n    },\n    (status: AsynchronousJobStatus<AgentChatRequest, AgentChatResponse>) => {\n      if (!chatJobIds.includes(status.jobId)) {\n        setPendingMessage(null)\n        setChatJobIds(() => [...chatJobIds, status.jobId])\n      }\n    },\n  )\n\n  const sendChat = useCallback(\n    (message: string) => {\n      if (!agentSession?.sessionId) {\n        throw new Error('No agent session available to send chat message.')\n      }\n      sendChatMessageToAgent({\n        chatText: message,\n        sessionId: agentSession.sessionId,\n        enableTrace: true,\n      })\n    },\n    [agentSession?.sessionId, sendChatMessageToAgent],\n  )\n\n  return useMemo(\n    () => ({ sendChat, pendingMessage, chatJobIds }),\n    [sendChat, pendingMessage, chatJobIds],\n  )\n}\n"],"names":["useChatState","agentSession","chatJobIds","setChatJobIds","useState","pendingMessage","setPendingMessage","sendChatMessageToAgent","useSendChatMessageToAgent","newChatMessage","status","sendChat","useCallback","message","useMemo"],"mappings":";;AAeO,SAASA,EAAaC,GAAwC;AACnE,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAmB,CAAA,CAAE,GAEnD,CAACC,GAAgBC,CAAiB,IAAIF,EAAwB,IAAI,GAElE,EAAE,QAAQG,EAAA,IAA2BC;AAAA,IACzC;AAAA,MACE,UAAU,CAACC,MAAqC;AAE9C,QAAAH,EAAkBG,EAAe,QAAQ;AAAA,MAC3C;AAAA,IAAA;AAAA,IAEF,CAACC,MAAuE;AACtE,MAAKR,EAAW,SAASQ,EAAO,KAAK,MACnCJ,EAAkB,IAAI,GACtBH,EAAc,MAAM,CAAC,GAAGD,GAAYQ,EAAO,KAAK,CAAC;AAAA,IAErD;AAAA,EAAA,GAGIC,IAAWC;AAAA,IACf,CAACC,MAAoB;AACnB,UAAI,CAACZ,GAAc;AACjB,cAAM,IAAI,MAAM,kDAAkD;AAEpE,MAAAM,EAAuB;AAAA,QACrB,UAAUM;AAAA,QACV,WAAWZ,EAAa;AAAA,QACxB,aAAa;AAAA,MAAA,CACd;AAAA,IACH;AAAA,IACA,CAACA,GAAc,WAAWM,CAAsB;AAAA,EAAA;AAGlD,SAAOO;AAAA,IACL,OAAO,EAAE,UAAAH,GAAU,gBAAAN,GAAgB,YAAAH;IACnC,CAACS,GAAUN,GAAgBH,CAAU;AAAA,EAAA;AAEzC;"}
+{"version":3,"file":"useChatState.js","sources":["../../../src/components/SynapseChat/useChatState.ts"],"sourcesContent":["import { useSendChatMessageToAgent } from '@/synapse-queries/chat/useChat'\nimport {\n  AgentChatRequest,\n  AgentChatResponse,\n  AgentSession,\n  AsynchronousJobStatus,\n} from '@sage-bionetworks/synapse-types'\nimport { useCallback, useMemo, useState } from 'react'\n\nexport type ChatState = {\n  sendChat: (message: string) => void\n  pendingMessage: string | null\n  chatJobIds: string[]\n}\n\nexport function useChatState(\n  agentSession?: AgentSession,\n  onChatResponse?: (responseText: string) => void,\n): ChatState {\n  const [chatJobIds, setChatJobIds] = useState<string[]>([])\n  // Optimistic update state for latest unprocessed message\n  const [pendingMessage, setPendingMessage] = useState<string | null>(null)\n\n  const { mutate: sendChatMessageToAgent } = useSendChatMessageToAgent(\n    {\n      onMutate: (newChatMessage: AgentChatRequest) => {\n        // set the pending message to the new chat message\n        setPendingMessage(newChatMessage.chatText)\n      },\n      onSuccess: (response: AgentChatResponse) => {\n        onChatResponse?.(response.responseText)\n      },\n    },\n    (status: AsynchronousJobStatus<AgentChatRequest, AgentChatResponse>) => {\n      if (!chatJobIds.includes(status.jobId)) {\n        setPendingMessage(null)\n        setChatJobIds(() => [...chatJobIds, status.jobId])\n      }\n    },\n  )\n\n  const sendChat = useCallback(\n    (message: string) => {\n      if (!agentSession?.sessionId) {\n        throw new Error('No agent session available to send chat message.')\n      }\n      sendChatMessageToAgent({\n        chatText: message,\n        sessionId: agentSession.sessionId,\n        enableTrace: true,\n      })\n    },\n    [agentSession?.sessionId, sendChatMessageToAgent],\n  )\n\n  return useMemo(\n    () => ({ sendChat, pendingMessage, chatJobIds }),\n    [sendChat, pendingMessage, chatJobIds],\n  )\n}\n"],"names":["useChatState","agentSession","onChatResponse","chatJobIds","setChatJobIds","useState","pendingMessage","setPendingMessage","sendChatMessageToAgent","useSendChatMessageToAgent","newChatMessage","response","status","sendChat","useCallback","message","useMemo"],"mappings":";;AAeO,SAASA,EACdC,GACAC,GACW;AACX,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAmB,CAAA,CAAE,GAEnD,CAACC,GAAgBC,CAAiB,IAAIF,EAAwB,IAAI,GAElE,EAAE,QAAQG,EAAA,IAA2BC;AAAA,IACzC;AAAA,MACE,UAAU,CAACC,MAAqC;AAE9C,QAAAH,EAAkBG,EAAe,QAAQ;AAAA,MAC3C;AAAA,MACA,WAAW,CAACC,MAAgC;AAC1C,QAAAT,IAAiBS,EAAS,YAAY;AAAA,MACxC;AAAA,IAAA;AAAA,IAEF,CAACC,MAAuE;AACtE,MAAKT,EAAW,SAASS,EAAO,KAAK,MACnCL,EAAkB,IAAI,GACtBH,EAAc,MAAM,CAAC,GAAGD,GAAYS,EAAO,KAAK,CAAC;AAAA,IAErD;AAAA,EAAA,GAGIC,IAAWC;AAAA,IACf,CAACC,MAAoB;AACnB,UAAI,CAACd,GAAc;AACjB,cAAM,IAAI,MAAM,kDAAkD;AAEpE,MAAAO,EAAuB;AAAA,QACrB,UAAUO;AAAA,QACV,WAAWd,EAAa;AAAA,QACxB,aAAa;AAAA,MAAA,CACd;AAAA,IACH;AAAA,IACA,CAACA,GAAc,WAAWO,CAAsB;AAAA,EAAA;AAGlD,SAAOQ;AAAA,IACL,OAAO,EAAE,UAAAH,GAAU,gBAAAP,GAAgB,YAAAH;IACnC,CAACU,GAAUP,GAAgBH,CAAU;AAAA,EAAA;AAEzC;"}