@websolutespa/bom-llm 0.2.5 → 0.2.7

package/dist/umd/index.js

@@ -8135,7 +8135,7 @@
   }
   var jsxRuntimeExports = jsxRuntime.exports;
 
-  const [useLayout, LayoutContextProvider] = createGenericContext();
+  const [useLayout_, LayoutContextProvider] = createGenericContext();
   function LayoutProvider(_ref) {
     let {
       children,
@@ -8147,6 +8147,7 @@
       children: children
     });
   }
+  const useLayout = useLayout_;
 
   function useAutosizeTextArea(textAreaRef, value) {
     reactExports.useEffect(() => {
@@ -19875,6 +19876,21 @@
     }
   }
 
+  const LLM_MINIMIZED_KEY = 'llm-minimized';
+  function getPersistedMinimized() {
+    try {
+      return sessionStorage.getItem(LLM_MINIMIZED_KEY) === 'true';
+    } catch {
+      return false;
+    }
+  }
+  function persistMinimized(minimized) {
+    try {
+      sessionStorage.setItem(LLM_MINIMIZED_KEY, String(minimized));
+    } catch {
+      // error
+    }
+  }
   const createLlmViewStore = _ref => {
     let {
       threadId,
@@ -19905,6 +19921,7 @@
       fixed: false,
       idle: true,
       visible: false,
+      minimized: getPersistedMinimized(),
       scrollable: false,
       direction: 0
     };
@@ -20030,9 +20047,11 @@
           },
           send: async (prompt, onMessage, onEnd) => {
             await send(prompt, () => {
+              persistMinimized(false);
               set({
                 skipCustomIntro: true,
-                opened: true
+                opened: true,
+                minimized: false
               });
               setTimeout(() => {
               }, 50);
@@ -20053,8 +20072,10 @@
               pushDataLayer({
                 event: opened ? 'llm_open' : 'llm_close'
               });
+              persistMinimized(false);
               return {
-                opened
+                opened,
+                minimized: false
               };
             });
           },
@@ -20082,6 +20103,12 @@
               introed
             }));
           },
+          setMinimized: minimized => {
+            persistMinimized(minimized);
+            set(state => ({
+              minimized
+            }));
+          },
           setVisible: visible => set(state => ({
             visible
           })),
@@ -32885,6 +32912,10 @@ void main(void) {
       wrapper
     } = _ref;
     const label = useLabel();
+    const streaming = useLlm(state => state.streaming);
+    const {
+      clear
+    } = useLlm(state => state.actions);
     const {
       send
     } = useLlmView(state => state.actions);
@@ -32892,7 +32923,8 @@ void main(void) {
       setWrapper
     } = useActions();
     const onAction = async action => {
-      const prompt = action.message || `${action.label}: ${JSON.stringify(wrapper.actions)}`;
+      const prompt = action.message || action.label;
+      clear();
       await send(prompt, response => {
         // console.log('PageActions.onChunk', response.chunks);
       }, response => {
@@ -32910,7 +32942,11 @@ void main(void) {
       }), wrapper.actions.map(x => /*#__PURE__*/jsxRuntimeExports.jsxs("button", {
         type: "button",
         className: getClassNames(style$h.action),
-        onClick: () => onAction(x),
+        disabled: streaming,
+        onClick: e => {
+          e.stopPropagation();
+          onAction(x);
+        },
         children: [/*#__PURE__*/jsxRuntimeExports.jsx(ActionIcon, {
           action: x
         }), /*#__PURE__*/jsxRuntimeExports.jsx("span", {
@@ -40825,6 +40861,9 @@ void main(void) {
       removeHistory
     } = useLlm(state => state.actions);
     // console.log('item', item);
+    if (!item.user) {
+      return;
+    }
     return /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
       className: getClassNames(style$e.history),
       onClick: () => setHistory(item),
@@ -41342,7 +41381,11 @@ void main(void) {
   const PageSubmit = () => {
     const label = useLabel();
     useLlm(state => state.components);
+    const streaming = useLlm(state => state.streaming);
     const prompt = useLlm(state => state.prompt);
+    const {
+      clear
+    } = useLlm(state => state.actions);
     const {
       send
     } = useLlmView(state => state.actions);
@@ -41351,6 +41394,7 @@ void main(void) {
       if (!prompt) {
         return;
       }
+      clear();
       await send(prompt, response => {
         // console.log('PagePrompt.onChunk', response.chunks);
       }, response => {
@@ -41360,7 +41404,7 @@ void main(void) {
     return /*#__PURE__*/jsxRuntimeExports.jsx("button", {
       type: "submit",
       className: getClassNames(style$5.submit),
-      "aria-disabled": !prompt,
+      disabled: !prompt || streaming,
       "aria-label": label('llm.sendPrompt'),
       onClick: onSubmit,
       children: /*#__PURE__*/jsxRuntimeExports.jsx(IconLlmArrowUp, {})
@@ -41405,7 +41449,8 @@ void main(void) {
     const prompt = useLlm(state => state.prompt);
     const streaming = useLlm(state => state.streaming);
     const {
-      setPrompt
+      setPrompt,
+      clear
     } = useLlm(state => state.actions);
     const {
       send
@@ -41416,6 +41461,7 @@ void main(void) {
       if (!prompt) {
         return;
       }
+      clear();
       await send(prompt, response => {
         // console.log('PagePrompt.onChunk', response.chunks);
       }, response => {
@@ -41427,7 +41473,7 @@ void main(void) {
       setPrompt(prompt);
     };
     const onKeyDown = event => {
-      if (event.code == 'Enter' && !event.shiftKey) {
+      if (event.code == 'Enter' && !event.shiftKey && !streaming) {
         onSubmit(event);
       }
     };
@@ -42216,6 +42262,32 @@ void main(void) {
     });
   };
 
+  const MinimizeButton = _ref => {
+    let {
+      onClick,
+      label
+    } = _ref;
+    return /*#__PURE__*/jsxRuntimeExports.jsx("button", {
+      type: "button",
+      className: "llm__trigger-minimize",
+      onClick: onClick,
+      "aria-label": label,
+      children: /*#__PURE__*/jsxRuntimeExports.jsx("svg", {
+        width: "16",
+        height: "16",
+        viewBox: "0 0 16 16",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: /*#__PURE__*/jsxRuntimeExports.jsx("path", {
+          d: "M4 6L8 10L12 6",
+          stroke: "currentColor",
+          strokeWidth: "1.5",
+          strokeLinecap: "round",
+          strokeLinejoin: "round"
+        })
+      })
+    });
+  };
   const Trigger = () => {
     const theme = useLlm(state => state.theme);
     const {
@@ -42223,16 +42295,21 @@ void main(void) {
     } = useLlm(state => state.components);
     const app = useLlm(state => state.app);
     const opened = useLlmView(state => state.opened);
+    const minimized = useLlmView(state => state.minimized);
     const {
-      open
+      open,
+      setMinimized
     } = useLlmView(state => state.actions);
     const label = useLabel();
+    const enableMinimize = app?.contents.enableMinimize;
     const collapsedWelcomeText = messageMapper(app?.contents.collapsedWelcomeText);
     const collapsedWelcomeTextCta = messageMapper(app?.contents.collapsedWelcomeTextCta);
     const collapsedWelcomeTextHover = messageMapper(app?.contents.collapsedWelcomeTextHover);
     const position = theme.trigger?.position || 'bottom';
     return /*#__PURE__*/jsxRuntimeExports.jsxs(motion.nav, {
-      className: getClassNames('llm__trigger', '-' + position),
+      className: getClassNames('llm__trigger', '-' + position, {
+        '-minimized': minimized
+      }),
       initial: {
         y: '200%',
         opacity: 0
@@ -42246,7 +42323,7 @@ void main(void) {
         opacity: 0
       },
       transition: {
-        duration: .4
+        duration: 0.4
       },
       "aria-label": "Trigger"
       /*
@@ -42262,14 +42339,20 @@ void main(void) {
         children: [/*#__PURE__*/jsxRuntimeExports.jsx(Blob, {}), /*#__PURE__*/jsxRuntimeExports.jsx("span", {
           children: label('llm.button')
         })]
-      }), !opened && (collapsedWelcomeText || collapsedWelcomeTextCta || collapsedWelcomeTextHover) && /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
+      }), !opened && !minimized && (collapsedWelcomeText || collapsedWelcomeTextCta || collapsedWelcomeTextHover) && /*#__PURE__*/jsxRuntimeExports.jsxs("div", {
         className: "llm__trigger-popup -llm-t-body2",
         children: [(collapsedWelcomeText || collapsedWelcomeTextCta) && /*#__PURE__*/jsxRuntimeExports.jsxs(motion.div, {
           className: "llm__trigger-message",
           exit: {
             opacity: 0
           },
-          children: [/*#__PURE__*/jsxRuntimeExports.jsx(Canvas, {}), collapsedWelcomeText, collapsedWelcomeTextCta && /*#__PURE__*/jsxRuntimeExports.jsx("button", {
+          children: [/*#__PURE__*/jsxRuntimeExports.jsx(Canvas, {}), collapsedWelcomeText, enableMinimize && /*#__PURE__*/jsxRuntimeExports.jsx(MinimizeButton, {
+            onClick: e => {
+              e.stopPropagation();
+              setMinimized(true);
+            },
+            label: label('llm.minimize') || 'Minimize'
+          }), collapsedWelcomeTextCta && /*#__PURE__*/jsxRuntimeExports.jsx("button", {
             type: "button",
             className: "llm__trigger-cta",
             children: collapsedWelcomeTextCta
@@ -45245,6 +45328,7 @@ ${Object.entries(vars).map(_ref2 => {
       decorateUrl,
       label,
       onAction,
+      onMessage,
       ...options
     } = sanitizedConfig;
     const theme = getThemes([customTheme], config.defaultTheme);
@@ -45484,6 +45568,7 @@ ${Object.entries(vars).map(_ref2 => {
             if (typeof onMessage === 'function') {
               onMessage(response);
             }
+            state.actions.onMessage(response);
           },
           // onEnd
           response => {
@@ -45785,6 +45870,12 @@ ${Object.entries(vars).map(_ref2 => {
           }
           return;
         },
+        onMessage: async message => {
+          if (typeof onMessage === 'function') {
+            return await onMessage(message);
+          }
+          return;
+        },
         clear: () => {
           const {
             abort
@@ -46396,6 +46487,13 @@ ${Object.entries(vars).map(_ref2 => {
         id: data.market,
         title: data.market
       }],
+      app: {
+        id: 'app',
+        brand: {
+          name: 'Mixer',
+          social: []
+        }
+      },
       menu: {},
       topLevelHrefs: {},
       topLevelRoutes: {}