@apia/ai 4.0.43 → 4.0.45

package/dist/index.js

@@ -1,13 +1,14 @@
 import { makeObservable, observable, action, toJS, makeAutoObservable } from 'mobx';
 import { jsxs, jsx, Fragment } from '@apia/theme/jsx-runtime';
-import { Box, getVariant, Textarea, Paragraph } from '@apia/theme';
+import { Box, Label, getVariant, Form, spacing, Paragraph, Textarea } from '@apia/theme';
 import { observer } from 'mobx-react-lite';
 import { ApiaApi, makeApiaUrl, parseSuccessfulResponse } from '@apia/api';
-import { FiltersStore, IconButton, ApiaUtil, SortableList, SortableListItem, ChatMessage, SimpleButton } from '@apia/components';
+import { FiltersStore, ApiaUtil, FileCard, importComponent, MDRenderer, AutogrowTextarea, IconButton, SimpleButton, SortableList, SortableListItem } from '@apia/components';
 import axios from 'axios';
-import { AudioRecorder, EventEmitter } from '@apia/util';
-import { createContext } from 'react';
+import { findScrollContainer, getLabel, decodeBase64ToUtf8, AudioRecorder, EventEmitter } from '@apia/util';
+import { useRef, useEffect, memo, Suspense, useState, createContext } from 'react';
 import { uniqueId } from '@apia/notifications';
+import { Collector } from '@apia/validations';
 
 const Component = observer(
   (props) => {
@@ -18,16 +19,16 @@ const Component = observer(
   }
 );
 
-var __defProp$4 = Object.defineProperty;
-var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$4 = (obj, key, value) => {
-  __defNormalProp$4(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __defProp$a = Object.defineProperty;
+var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$a = (obj, key, value) => {
+  __defNormalProp$a(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
 class SemanticSearchReference {
   constructor(props) {
-    __publicField$4(this, "state", { title: "", body: "", link: "" });
-    __publicField$4(this, "Component", () => /* @__PURE__ */ jsxs(Fragment, { children: [
+    __publicField$a(this, "state", { title: "", body: "", link: "" });
+    __publicField$a(this, "Component", () => /* @__PURE__ */ jsxs(Fragment, { children: [
       "(",
       /* @__PURE__ */ jsx(Component, { instance: this }),
       ")"
@@ -37,15 +38,15 @@ class SemanticSearchReference {
   }
 }
 
-var __defProp$3 = Object.defineProperty;
-var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$3 = (obj, key, value) => {
-  __defNormalProp$3(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __defProp$9 = Object.defineProperty;
+var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$9 = (obj, key, value) => {
+  __defNormalProp$9(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
 const _SearchController = class _SearchController {
   constructor() {
-    __publicField$3(this, "state", { queryString: "", results: [], isLoading: false, disabled: false });
+    __publicField$9(this, "state", { queryString: "", results: [], isLoading: false, disabled: false });
     makeObservable(this, { state: observable });
   }
   async search(selectedId) {
@@ -83,13 +84,1198 @@ const _SearchController = class _SearchController {
     _SearchController.instance.state.disabled = false;
   }
 };
-__publicField$3(_SearchController, "instance", new _SearchController());
+__publicField$9(_SearchController, "instance", new _SearchController());
 let SearchController = _SearchController;
 
-var __defProp$2 = Object.defineProperty;
-var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$2 = (obj, key, value) => {
-  __defNormalProp$2(obj, typeof key !== "symbol" ? key + "" : key, value);
+const AutoscrollContainer = ({ children, threshold = 150, className }) => {
+  const wrapperRef = useRef(null);
+  const autoScrollEnabled = useRef(true);
+  useEffect(() => {
+    const wrapper = wrapperRef.current;
+    if (!wrapper)
+      return;
+    const scrollEl = findScrollContainer(wrapper);
+    const isNearBottom = () => scrollEl.scrollHeight - (scrollEl.scrollTop + scrollEl.clientHeight) <= threshold;
+    const onWheel = (e) => {
+      if (e.deltaY < 0) {
+        autoScrollEnabled.current = false;
+      } else if (e.deltaY > 0 && isNearBottom()) {
+        autoScrollEnabled.current = true;
+      }
+    };
+    const onScroll = () => {
+      if (isNearBottom()) {
+        autoScrollEnabled.current = true;
+      }
+    };
+    function enable() {
+      autoScrollEnabled.current = true;
+    }
+    scrollEl.addEventListener("wheel", onWheel, { passive: true });
+    scrollEl.addEventListener("scroll", onScroll, { passive: true });
+    document.addEventListener("enableAutoScroll", enable);
+    scrollEl.scrollTo({ top: scrollEl.scrollHeight, behavior: "smooth" });
+    const mo = new MutationObserver(() => {
+      if (autoScrollEnabled.current) {
+        scrollEl.scrollTo({ top: scrollEl.scrollHeight, behavior: "smooth" });
+      }
+    });
+    mo.observe(wrapper, { childList: true, subtree: true });
+    return () => {
+      scrollEl.removeEventListener("wheel", onWheel);
+      scrollEl.removeEventListener("enableAutoScroll", enable);
+      scrollEl.removeEventListener("scroll", onScroll);
+      mo.disconnect();
+    };
+  }, [threshold]);
+  return /* @__PURE__ */ jsx("div", { ref: wrapperRef, className: `${className || ""} autoscrollContainer`, children });
+};
+
+var __defProp$8 = Object.defineProperty;
+var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$8 = (obj, key, value) => {
+  __defNormalProp$8(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+let maxId = 0;
+class ChatMessage {
+  constructor(message = "", messageType = "user", attachments = [], reference = null) {
+    __publicField$8(this, "id");
+    __publicField$8(this, "state");
+    __publicField$8(this, "clone", () => new ChatMessage(
+      this.message,
+      this.messageType,
+      this.attachments.map((x) => {
+        return { ...x };
+      }),
+      this.reference
+    ));
+    this.state = { message, messageType, attachments, reference };
+    this.id = maxId++;
+    if (messageType === "response")
+      this.messageType = "system";
+    if (typeof message === "string")
+      this.message = message;
+    makeObservable(this, {
+      state: observable
+    });
+  }
+  get message() {
+    return this.state.message;
+  }
+  get messageType() {
+    return this.state.messageType;
+  }
+  get attachments() {
+    return this.state.attachments;
+  }
+  get reference() {
+    return this.state.reference;
+  }
+  set message(value) {
+    this.state.message = value;
+  }
+  set messageType(value) {
+    this.state.messageType = value;
+  }
+  set attachments(value) {
+    this.state.attachments = value;
+  }
+  set reference(value) {
+    this.state.reference = value;
+  }
+  removeAttachment(attachment) {
+    this.attachments = this.attachments.filter(
+      (current) => current !== attachment
+    );
+  }
+  addAttachmentDescription(attachment, description) {
+    const a = this.attachments.find((current) => current === attachment);
+    if (a) {
+      a.description = description;
+    }
+  }
+  setMessageType(type) {
+    this.messageType = type;
+  }
+}
+
+const FileAttachment = observer(
+  ({
+    attachment,
+    onAddDescription,
+    onRemove
+  }) => {
+    const { ref } = ApiaUtil.instance.tooltips.useHover({
+      preferredOrientationX: "left",
+      preferredOrientationY: "top",
+      minSize: {
+        width: 200,
+        height: 400
+      },
+      attachToMousePosition: true,
+      closeOnMouseLeaveAttachedElement: true,
+      children: /* @__PURE__ */ jsxs(
+        Box,
+        {
+          sx: {
+            display: "flex",
+            alignItems: "center",
+            flexDirection: "column"
+          },
+          children: [
+            /* @__PURE__ */ jsx("h1", { children: attachment.name }),
+            /* @__PURE__ */ jsx("img", { src: attachment.base64 }),
+            attachment.description && /* @__PURE__ */ jsx(Label, { children: attachment.description })
+          ]
+        }
+      )
+    });
+    return /* @__PURE__ */ jsx(
+      FileCard,
+      {
+        ref,
+        name: attachment.name,
+        handleClose: onRemove,
+        additionalButtons: onAddDescription ? [
+          {
+            icon: "Pencil",
+            onClick: () => {
+              const collector = new Collector();
+              collector.add(
+                new collector.fields.textarea(
+                  "desc",
+                  getLabel("lblDes").text,
+                  { initialValue: attachment.description }
+                )
+              );
+              collector.show({
+                onConfirm: (ev) => {
+                  if (ev) {
+                    onAddDescription(attachment, ev.desc);
+                  }
+                  return true;
+                },
+                title: getLabel("btnAddComment").text
+              });
+            },
+            variant: "icon-only"
+          }
+        ] : []
+      }
+    );
+  }
+);
+
+const Attachments = observer(
+  ({
+    attachments,
+    onRemove,
+    onAddDescription,
+    className
+  }) => {
+    if (!attachments.length)
+      return null;
+    return /* @__PURE__ */ jsx(
+      Box,
+      {
+        className: `attachments ${className}`,
+        ...getVariant("layout.common.chat.attachments"),
+        children: attachments.map((x) => /* @__PURE__ */ jsx(
+          FileAttachment,
+          {
+            attachment: x,
+            onRemove: onRemove ? () => onRemove(x) : void 0,
+            onAddDescription
+          },
+          x.id
+        ))
+      }
+    );
+  }
+);
+
+const MessageBlock = memo(
+  ({ componentData }) => {
+    if (typeof componentData.args === "string") {
+      componentData.args = JSON.parse(componentData.args);
+    }
+    const Component = importComponent(componentData.path);
+    return /* @__PURE__ */ jsx(Suspense, { fallback: null, children: /* @__PURE__ */ jsx(Component, { ...componentData.args }) });
+  }
+);
+
+const MessageBlocks = observer(
+  ({ streamParts }) => {
+    const parts = streamParts.map((p, i) => {
+      if (p.blockType === "describer") {
+        return /* @__PURE__ */ jsx(
+          Box,
+          {
+            variant: "layout.common.ai.semanticSearch.execution.streamBlocks",
+            className: "sem_search__stream_blocks",
+            as: "ul",
+            children: /* @__PURE__ */ jsx(
+              Box,
+              {
+                variant: "layout.common.ai.semanticSearch.execution.streamBlocks",
+                as: "li",
+                className: `sem_search__stream_block ${p.describer.type}`,
+                children: p.describer.content
+              },
+              i
+            )
+          }
+        );
+      } else if (p.blockType === "text") {
+        return p.str.split(/(!!\[[^]+])/g).map((c) => {
+          if (c.match(/^!!\[[^]+]$/)) {
+            const definition = JSON.parse(
+              decodeBase64ToUtf8(
+                (c.match(/^!!\[([^]+)]$/) ?? [void 0, void 0])[1] ?? ""
+              )
+            );
+            return /* @__PURE__ */ jsx(MessageBlock, { componentData: definition }, i);
+          } else {
+            return /* @__PURE__ */ jsx(MDRenderer, { str: c }, i);
+          }
+        });
+      }
+    });
+    return parts;
+  }
+);
+
+const Message = observer(
+  ({
+    className,
+    type,
+    id,
+    message,
+    attachments,
+    reference
+  }) => {
+    return /* @__PURE__ */ jsxs(
+      Box,
+      {
+        as: "pre",
+        className: `history_message ${className || ""} ${type}`,
+        children: [
+          /* @__PURE__ */ jsx(
+            Box,
+            {
+              className: "history_message__content",
+              ...typeof message === "string" ? {
+                children: /* @__PURE__ */ jsx(
+                  MessageBlocks,
+                  {
+                    streamParts: [{ blockType: "text", str: message }]
+                  }
+                )
+              } : { children: message }
+            }
+          ),
+          attachments.length > 0 && /* @__PURE__ */ jsx(Attachments, { attachments }),
+          reference && /* @__PURE__ */ jsx(Box, { className: "history_message__references", children: reference })
+        ]
+      },
+      id
+    );
+  }
+);
+
+const History = observer(
+  ({
+    messages,
+    className
+  }) => {
+    let currentType = "";
+    return /* @__PURE__ */ jsx(AutoscrollContainer, { className, children: /* @__PURE__ */ jsx(
+      Box,
+      {
+        ...getVariant("layout.common.chat.history"),
+        className: "chat_history",
+        children: messages.map((current, i) => {
+          let first = false;
+          let last = false;
+          if (currentType !== current.messageType) {
+            currentType = current.messageType;
+            first = true;
+          }
+          if (i === messages.length - 1 || messages[i + 1].messageType !== current.messageType) {
+            last = true;
+          }
+          return /* @__PURE__ */ jsx(
+            Message,
+            {
+              className: first ? "first" : last ? "last" : void 0,
+              type: current.messageType,
+              id: String(current.id),
+              attachments: current.attachments,
+              reference: current.reference,
+              message: current.message
+            }
+          );
+        })
+      }
+    ) });
+  }
+);
+
+function getBase64FromFile(f) {
+  return ((f2) => new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.readAsDataURL(f2);
+    reader.onload = () => resolve(reader.result);
+    reader.onerror = () => reject();
+  }))(f);
+}
+function getBase64FromBlob(b) {
+  return ((blob) => new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.onloadend = () => {
+      const base64String = reader.result;
+      resolve(base64String);
+    };
+    reader.onerror = reject;
+    reader.readAsDataURL(blob);
+  }))(b);
+}
+
+const TextArea = observer(
+  ({
+    additionalOptions = [],
+    isLoading,
+    isRecording,
+    disablePrevButton,
+    disableNextButton,
+    onSubmit,
+    onChange,
+    onClearHistory,
+    onAttach,
+    onRecord,
+    onRecordCancel,
+    onVideoRecord,
+    onPrev,
+    onNext,
+    value,
+    attachments,
+    className
+  }) => {
+    const fileInputRef = useRef(null);
+    const searchControlsRef = useRef(null);
+    const [dragging, setDragging] = useState(false);
+    const handleAttachments = async (ev) => {
+      if (ev.target.files) {
+        for await (const f of ev.target.files) {
+          const base64 = await getBase64FromFile(f);
+          onAttach({
+            base64,
+            name: f.name,
+            id: f.name
+          });
+        }
+        ev.target.value = "";
+      }
+    };
+    const menuItemsList = [
+      ...additionalOptions.length > 0 ? [...additionalOptions, "separator"] : [],
+      {
+        children: getLabel("btnUpload").text,
+        title: getLabel("btnUpload").text,
+        icon: "File",
+        onClick: () => fileInputRef.current?.click(),
+        key: "2"
+      },
+      {
+        title: getLabel("lblOpenCamera").text,
+        children: getLabel("lblOpenCamera").text,
+        icon: "Camera",
+        onClick: onVideoRecord,
+        key: "3"
+      },
+      "separator",
+      {
+        icon: "ArrowLeft",
+        children: getLabel("btnAiPrevious").text,
+        title: getLabel("btnAiPrevious").text,
+        onClick: onPrev,
+        disabled: disablePrevButton,
+        key: "0"
+      },
+      {
+        icon: "ArrowRight",
+        children: getLabel("btnAiNext").text,
+        title: getLabel("btnAiNext").text,
+        onClick: onNext,
+        disabled: disableNextButton,
+        key: "1"
+      },
+      "separator",
+      {
+        icon: "Trash",
+        onClick: onClearHistory,
+        key: "5",
+        children: getLabel("btnAiDeleteMessages").text,
+        title: getLabel("btnAiDeleteMessages").text
+      }
+    ];
+    const handleDragLeave = (ev) => {
+      ev.preventDefault();
+      setDragging(false);
+    };
+    const handleDrop = (ev) => {
+      ev.preventDefault();
+      setDragging(false);
+      const fileElement = document.getElementById(
+        `invisible__attach__file`
+      );
+      (fileInputRef.current ?? fileElement).files = ev.dataTransfer.files;
+      const event = new Event("change", { bubbles: true });
+      fileElement.dispatchEvent(event);
+    };
+    const handleDragOver = (ev) => {
+      ev.preventDefault();
+    };
+    const handleDragEnter = (ev) => {
+      ev.preventDefault();
+      setDragging(true);
+    };
+    return /* @__PURE__ */ jsxs(
+      Form,
+      {
+        onDrop: handleDrop,
+        onDragOver: handleDragOver,
+        onDragEnter: handleDragEnter,
+        onDragLeave: handleDragLeave,
+        onSubmit: (ev) => {
+          ev.preventDefault();
+          onSubmit();
+        },
+        className: `search_controls ${className}`,
+        ...getVariant("layout.common.chat.form"),
+        children: [
+          dragging ? /* @__PURE__ */ jsx(
+            Box,
+            {
+              sx: {
+                height: "150px",
+                border: "3px dashed #aaa",
+                width: "100%",
+                display: "flex",
+                alignItems: "center",
+                justifyContent: "center"
+              },
+              children: getLabel("msgAiDragAndDrop").text
+            }
+          ) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(
+              AutogrowTextarea,
+              {
+                ref: searchControlsRef,
+                "aria-label": (
+                  /** TODO: Crear etiqueta para búsqueda */
+                  "Frase de b\xFAsqueda"
+                ),
+                value,
+                className: "searchTextArea",
+                onChange: (ev) => onChange(ev.target.value),
+                onKeyDown: (ev) => {
+                  if ((ev.code === "Enter" || ev.code === "NumpadEnter") && !ev.shiftKey) {
+                    ev.preventDefault();
+                    ev.target.closest("form").querySelector('[type="submit"]').click();
+                  }
+                },
+                sx: {
+                  resize: "none",
+                  px: spacing(4),
+                  background: "transparent",
+                  border: "none",
+                  alignContent: "center"
+                }
+              }
+            ),
+            /* @__PURE__ */ jsxs(Box, { className: "chatButtons", children: [
+              /* @__PURE__ */ jsx(
+                IconButton,
+                {
+                  className: "ChatBarButton",
+                  icon: isRecording ? "Trash" : "Ellipsis",
+                  variant: "icon-only",
+                  iconSize: "Sm",
+                  onClick: isRecording ? onRecordCancel : (ev) => {
+                    ApiaUtil.instance.menu.open({
+                      menuProps: {
+                        anchorPoint: { x: ev.clientX, y: ev.clientY }
+                      },
+                      items: menuItemsList
+                    });
+                  }
+                }
+              ),
+              value === "" && attachments.length === 0 || isRecording ? /* @__PURE__ */ jsx(
+                IconButton,
+                {
+                  className: `ChatBarButton ${isRecording ? "isRecording" : ""}`,
+                  icon: isRecording ? "Stop" : "Microphone",
+                  variant: "icon-only",
+                  iconSize: "Sm",
+                  title: getLabel("lblAiRecordAudio").text,
+                  onClick: onRecord,
+                  isLoading,
+                  disabled: isLoading && !isRecording,
+                  sx: {
+                    color: isRecording ? "red" : void 0
+                  },
+                  id: "transcribeAudio"
+                }
+              ) : /* @__PURE__ */ jsx(
+                IconButton,
+                {
+                  className: "ChatBarButton",
+                  isLoading,
+                  icon: "ArrowRight",
+                  variant: "icon-only",
+                  iconSize: "Sm",
+                  title: getLabel("btnBus").title,
+                  type: "submit"
+                }
+              )
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              ref: fileInputRef,
+              id: "invisible__attach__file",
+              type: "file",
+              multiple: true,
+              onChange: handleAttachments,
+              sx: { display: "none" }
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+
+var __defProp$7 = Object.defineProperty;
+var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$7 = (obj, key, value) => {
+  __defNormalProp$7(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class CameraController {
+  constructor() {
+    __publicField$7(this, "state", {
+      videoStream: null,
+      isOpen: false
+    });
+    __publicField$7(this, "currentCapture", null);
+    __publicField$7(this, "videoElement");
+    __publicField$7(this, "Component", () => {
+      return /* @__PURE__ */ jsx(
+        "video",
+        {
+          ref: (el) => {
+            if (el) {
+              el.srcObject = this.videoElement.srcObject;
+              el.autoplay = true;
+              el.playsInline = true;
+            }
+          },
+          style: { width: "100%", height: "auto" }
+        }
+      );
+    });
+    makeObservable(this, {
+      state: observable,
+      openCamera: action,
+      closeCamera: action
+    });
+    this.videoElement = document.createElement("video");
+    this.videoElement.autoplay = true;
+    this.videoElement.playsInline = true;
+  }
+  async openCamera() {
+    try {
+      const stream = await navigator.mediaDevices.getUserMedia({ video: true });
+      this.state.videoStream = stream;
+      this.videoElement.srcObject = stream;
+      this.state.isOpen = true;
+      ApiaUtil.instance.modals.open({
+        children: /* @__PURE__ */ jsx(this.Component, {}),
+        onConfirm: () => {
+          this.closeCamera();
+        },
+        onClose: () => {
+          this.closeCamera();
+        }
+      });
+    } catch (error) {
+      console.error("Error while accessing the camera:", error);
+      this.state.isOpen = false;
+      this.closeCamera();
+    }
+  }
+  async closeCamera() {
+    if (!this.videoElement.srcObject)
+      return;
+    const canvas = document.createElement("canvas");
+    canvas.width = this.videoElement.videoWidth;
+    canvas.height = this.videoElement.videoHeight;
+    const ctx = canvas.getContext("2d");
+    if (ctx)
+      ctx.drawImage(this.videoElement, 0, 0, canvas.width, canvas.height);
+    this.currentCapture = await new Promise((resolve) => {
+      canvas.toBlob((blob) => {
+        if (blob) {
+          const file = new File([blob], "captured_image.jpg", {
+            type: "image/jpeg"
+          });
+          resolve(file);
+        } else {
+          this.closeCamera();
+        }
+      }, "image/jpeg");
+    }).finally(() => {
+      this.state.videoStream?.getTracks().forEach((track) => track.stop());
+      this.state.videoStream = null;
+      this.videoElement.srcObject = null;
+      this.state.isOpen = false;
+    });
+  }
+  pop() {
+    const returnFile = this.currentCapture;
+    this.currentCapture = null;
+    return returnFile;
+  }
+}
+
+var __defProp$6 = Object.defineProperty;
+var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$6 = (obj, key, value) => {
+  __defNormalProp$6(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class ChatController {
+  constructor(props, onMessageSubmit, onClearHistory, additionalOptions, classNames) {
+    this.onMessageSubmit = onMessageSubmit;
+    this.onClearHistory = onClearHistory;
+    this.additionalOptions = additionalOptions;
+    this.classNames = classNames;
+    __publicField$6(this, "currentIndex", 0);
+    __publicField$6(this, "state", {
+      isLoading: false,
+      canRecord: true,
+      canAttach: true,
+      maxAttachmentsSize: 100,
+      messages: [],
+      currentMessage: new ChatMessage("", "user")
+    });
+    __publicField$6(this, "internalAudioRecorder", new AudioRecorder());
+    __publicField$6(this, "internalCameraRecorder", new CameraController());
+    __publicField$6(this, "maxId", 0);
+    __publicField$6(this, "audioRecorder", {
+      cancelOnStop: false,
+      start: () => {
+        this.state.isLoading = true;
+        this.internalAudioRecorder.start().then(async (blob) => {
+          if (this.audioRecorder.cancelOnStop) {
+            this.audioRecorder.cancelOnStop = false;
+            return;
+          }
+          this.state.currentMessage.attachments.push({
+            id: String(this.maxId++),
+            name: `userRecord_${this.audioRecorder.record++}.wav`,
+            base64: await getBase64FromBlob(blob)
+          });
+          const currentMessage = new ChatMessage(
+            this.state.currentMessage.message,
+            "user"
+          );
+          this.state.currentMessage.message = "";
+          const submitMessage = this.state.currentMessage;
+          this.state.currentMessage = currentMessage;
+          await this.handleSubmit({
+            message: submitMessage,
+            eraseCurrentMessage: false
+          });
+        }).finally(() => {
+          this.state.isLoading = false;
+        });
+      },
+      stop: async () => {
+        this.internalAudioRecorder.stop();
+      },
+      record: 0,
+      state: this.internalAudioRecorder.state
+    });
+    __publicField$6(this, "handleSubmit", async (props) => {
+      if (!this.audioRecorder.state.recording) {
+        const currentMessage = props?.message || this.state.currentMessage;
+        if (currentMessage.message || currentMessage.attachments.length > 0) {
+          this.state.isLoading = true;
+          if (props?.eraseCurrentMessage !== false) {
+            this.state.currentMessage = new ChatMessage("", "user");
+          }
+          await this.onMessageSubmit({
+            message: currentMessage,
+            ...this.getAdditionalProps()
+          });
+          this.state.isLoading = false;
+        }
+      }
+    });
+    __publicField$6(this, "History", observer(() => /* @__PURE__ */ jsx(
+      History,
+      {
+        messages: this.state.messages,
+        className: this.classNames?.history
+      }
+    )));
+    __publicField$6(this, "Attachments", observer(() => /* @__PURE__ */ jsx(
+      Attachments,
+      {
+        attachments: this.state.currentMessage.attachments,
+        onRemove: (a) => {
+          this.removeAttachment(a);
+        },
+        className: this.classNames?.attachments,
+        onAddDescription: (a, ev) => this.state.currentMessage.addAttachmentDescription(a, ev)
+      }
+    )));
+    __publicField$6(this, "TextArea", observer(() => /* @__PURE__ */ jsx(
+      TextArea,
+      {
+        additionalOptions: this.additionalOptions,
+        className: this.classNames?.textarea,
+        value: this.state.currentMessage.message,
+        isLoading: this.state.isLoading,
+        isRecording: this.internalAudioRecorder.state.recording,
+        disablePrevButton: !this.canGoPrev(),
+        disableNextButton: !this.canGoNext(),
+        onChange: (ev) => {
+          this.state.currentMessage.message = ev;
+        },
+        onSubmit: () => this.handleSubmit(),
+        onClearHistory: () => {
+          this.clearHistory();
+        },
+        onAttach: async (ev) => {
+          this.state.currentMessage.attachments.push({
+            ...ev,
+            id: String(this.maxId++)
+          });
+        },
+        onRecord: () => {
+          !this.internalAudioRecorder.state.recording ? this.audioRecorder.start() : this.audioRecorder.stop();
+        },
+        onRecordCancel: async () => {
+          if (this.internalAudioRecorder.state.recording) {
+            this.audioRecorder.cancelOnStop = true;
+            await this.audioRecorder.stop();
+          }
+        },
+        onVideoRecord: async () => {
+          !this.internalCameraRecorder.state.isOpen && await this.internalCameraRecorder.openCamera();
+          await new Promise((resolve, _) => {
+            const checkCapture = async () => {
+              if (!this.internalCameraRecorder.state.isOpen) {
+                const capture = this.internalCameraRecorder.pop();
+                if (capture) {
+                  this.state.currentMessage.attachments.push({
+                    id: String(this.maxId++),
+                    name: capture.name,
+                    base64: await getBase64FromFile(capture)
+                  });
+                  return resolve();
+                }
+              } else {
+                requestAnimationFrame(checkCapture);
+              }
+            };
+            checkCapture();
+          });
+        },
+        onPrev: () => {
+          this.prevMessage();
+        },
+        onNext: () => {
+          this.nextMessage();
+        },
+        attachments: this.state.currentMessage.attachments
+      }
+    )));
+    __publicField$6(this, "Renderer", () => /* @__PURE__ */ jsxs(
+      Box,
+      {
+        ...getVariant("layout.common.chat.controller"),
+        className: "chat_controller",
+        children: [
+          /* @__PURE__ */ jsx(this.History, {}),
+          /* @__PURE__ */ jsx(this.Attachments, {}),
+          /* @__PURE__ */ jsx(this.TextArea, {})
+        ]
+      }
+    ));
+    this.state = Object.assign({}, this.state, props);
+    makeObservable(this, { state: observable });
+  }
+  removeMessage(idx) {
+    this.state.messages = this.state.messages.filter((_, i) => i !== idx);
+  }
+  addMessage(message) {
+    this.state.messages.push(message);
+    this.currentIndex = this.state.messages.length;
+  }
+  clearHistory() {
+    this.state.messages = [];
+    this.onClearHistory && this.onClearHistory();
+  }
+  clearMessage() {
+    this.state.currentMessage = new ChatMessage("", "user");
+  }
+  removeAttachment(attachment) {
+    this.state.currentMessage.removeAttachment(attachment);
+  }
+  isForHistory(message) {
+    return message && message.messageType === "user";
+  }
+  canGoNext() {
+    let condition = false;
+    const slice = this.state.messages.slice(
+      this.currentIndex,
+      this.state.messages.length
+    );
+    const n = slice.length;
+    if (this.currentIndex + 1 > n) {
+      return condition;
+    }
+    for (let i = 0; i < n && !condition; i++) {
+      const current = slice[i];
+      condition = current.messageType === "user";
+    }
+    return condition;
+  }
+  canGoPrev() {
+    let condition = false;
+    if (this.currentIndex - 1 === -1) {
+      return condition;
+    }
+    for (let i = this.state.messages.slice(0, this.currentIndex).length - 1; i >= 0 && !condition; i--) {
+      const current = this.state.messages[i];
+      condition = current.messageType === "user";
+    }
+    return condition;
+  }
+  nextMessage() {
+    let newCurrentMessage = void 0;
+    let i = this.currentIndex;
+    const n = this.state.messages.length;
+    if (n === 0 || n - 1 === i) {
+      return;
+    }
+    while (!newCurrentMessage && i < n - 1) {
+      newCurrentMessage = this.state.messages[i + 1];
+      i++;
+      if (this.isForHistory(newCurrentMessage)) {
+        this.state.currentMessage = newCurrentMessage.clone();
+        break;
+      } else {
+        newCurrentMessage = void 0;
+      }
+      if (i === this.currentIndex) {
+        break;
+      }
+    }
+    this.currentIndex = i;
+  }
+  prevMessage() {
+    let newCurrentMessage = void 0;
+    let i = this.currentIndex;
+    const n = this.state.messages.length;
+    if (n === 0 || i === 0) {
+      return;
+    }
+    while (!newCurrentMessage && i > 0) {
+      newCurrentMessage = this.state.messages[i - 1];
+      i--;
+      if (this.isForHistory(newCurrentMessage)) {
+        this.state.currentMessage = newCurrentMessage.clone();
+        break;
+      } else {
+        newCurrentMessage = void 0;
+      }
+      if (i === this.currentIndex) {
+        break;
+      }
+    }
+    this.currentIndex = i;
+  }
+  getAdditionalProps() {
+    return {};
+  }
+}
+
+var __defProp$5 = Object.defineProperty;
+var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$5 = (obj, key, value) => {
+  __defNormalProp$5(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class FloatingChatController extends ChatController {
+  constructor(props) {
+    super(
+      { isWindowOpen: false, ...props },
+      props.onMessageSubmit,
+      props.onClearHistory,
+      props.additionalOptions,
+      props.classNames
+    );
+    __publicField$5(this, "modalTitle");
+    __publicField$5(this, "Window", observer(() => {
+      return this.state.isWindowOpen ? null : /* @__PURE__ */ jsx(
+        IconButton,
+        {
+          className: "chat_controller__open",
+          icon: "Magic",
+          size: "Md",
+          variant: "icon-outline",
+          onClick: () => {
+            this.open();
+          }
+        }
+      );
+    }));
+    this.modalTitle = props.modalTitle;
+    makeObservable({ open: action });
+    if (props.props.isWindowOpen) {
+      this.state.isWindowOpen = false;
+      this.open();
+    }
+  }
+  getModalTitle() {
+    return this.modalTitle;
+  }
+  setModalTitle(title) {
+    this.modalTitle = title;
+  }
+  open() {
+    if (!this.state.isWindowOpen) {
+      this.state.isWindowOpen = true;
+      ApiaUtil.instance.modals.open({
+        variant: "layout.common.chat.assistant.floatingAssistant",
+        defaultPosition: {
+          bottom: "10px",
+          right: "10px"
+        },
+        id: "floatingAssistant",
+        draggable: true,
+        dragBounded: true,
+        children: /* @__PURE__ */ jsx(this.Renderer, {}),
+        onClose: () => {
+          this.state.isWindowOpen = false;
+        },
+        title: this.modalTitle
+      });
+    }
+  }
+}
+
+var __defProp$4 = Object.defineProperty;
+var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$4 = (obj, key, value) => {
+  __defNormalProp$4(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class StreamMessage {
+  constructor() {
+    __publicField$4(this, "blocks", []);
+    __publicField$4(this, "references", []);
+    __publicField$4(this, "tables", {});
+    __publicField$4(this, "charts", {});
+    makeObservable(this, {
+      references: observable,
+      blocks: observable,
+      tables: observable,
+      charts: observable
+    });
+  }
+  addPart(part, afterAddPart) {
+    if (this.blocks.length > 0 && this.blocks[this.blocks.length - 1].blockType === "text" && part.blockType === "text") {
+      const aux = this.blocks[this.blocks.length - 1];
+      if (aux !== part) {
+        aux.str += part.str;
+      }
+    } else {
+      this.blocks.push(part);
+    }
+    afterAddPart && afterAddPart(part);
+  }
+  getLastBlock() {
+    return this.blocks[this.blocks.length - 1];
+  }
+}
+
+const Ellipsis = () => {
+  const [e, setE] = useState(0);
+  let dots = ".";
+  for (let i = 0; i < e; i++) {
+    dots += ".";
+  }
+  const interval = useRef(0);
+  useEffect(() => {
+    interval.current = setInterval(() => {
+      setE((e2) => e2 === 2 ? 0 : e2 + 1);
+    }, 500);
+    return () => {
+      clearInterval(interval.current);
+    };
+  });
+  return /* @__PURE__ */ jsx("div", { className: "ellipsis", children: dots });
+};
+
+const Header = observer(
+  ({ childComponent }) => {
+    return /* @__PURE__ */ jsx(Box, { className: "search_header_container", children: childComponent });
+  }
+);
+
+async function rate(el, how, query) {
+  return new Promise((resolve) => {
+    const collector = new Collector();
+    collector.add(
+      new collector.fields.textarea("comment", "Comment", {
+        validationRules: { required: true },
+        properties: { autoFocus: true }
+      })
+    );
+    const tooltip = ApiaUtil.instance.tooltips.open({
+      attachToElement: { current: el },
+      children: /* @__PURE__ */ jsx(
+        collector.Render,
+        {
+          sx: {
+            width: "300px",
+            minWidth: "unset",
+            ".collector__buttons button": {
+              fontSize: 14,
+              py: 2,
+              px: 3
+            }
+          },
+          resolve: (w) => {
+            (async () => {
+              const result = await ApiaApi.post(
+                makeApiaUrl({ action: "giveFeedback" }),
+                {
+                  postData: {
+                    query,
+                    feedback: w.comment,
+                    positive: how === "up"
+                  },
+                  postDataTreatement: "stringify"
+                }
+              );
+              tooltip.close();
+              resolve(!result?.hasError && !result?.hasMessages);
+            })();
+            return true;
+          }
+        }
+      ),
+      minSize: {
+        width: 300,
+        height: 220
+      },
+      preferredOrientationX: "right",
+      preferredOrientationY: "top",
+      closeOnMouseLeaveAttachedElement: false,
+      closeOnMouseLeaveTooltip: false,
+      closeOnClickOut: true,
+      closeOnClick: false,
+      closeOnEscape: true,
+      closeOnScrollOut: true,
+      closeOthers: true,
+      attachToElementAnchorPoint: "topRight"
+    });
+  });
+}
+
+const MessageBody = observer(
+  ({
+    onRate,
+    store
+  }) => {
+    const [thumb, setThumb] = useState(void 0);
+    const hasText = store.blocks.find((x) => x.blockType === "text");
+    return /* @__PURE__ */ jsxs(Box, { className: "sem_search__system_message", children: [
+      /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(Box, { className: "message__body markdown", children: /* @__PURE__ */ jsx(MessageBlocks, { streamParts: store.blocks }) }),
+        onRate && hasText ? /* @__PURE__ */ jsxs(Box, { className: "sem_search__thumbs", children: [
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              variant: "icon-only",
+              icon: "ThumbsUp",
+              className: thumb === "up" ? "selected" : thumb === "down" ? "unselected" : "no_feedback",
+              onClick: (ev) => onRate(ev.target, "up").then((res) => {
+                if (res) {
+                  setThumb("up");
+                }
+              })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              variant: "icon-only",
+              icon: "ThumbsDown",
+              className: thumb === "down" ? "selected" : thumb === "up" ? "unselected" : "no_feedback",
+              onClick: (ev) => onRate(ev.target, "down").then((res) => {
+                if (res) {
+                  setThumb("down");
+                }
+              })
+            }
+          )
+        ] }) : /* @__PURE__ */ jsx(Fragment, {})
+      ] }),
+      !hasText && /* @__PURE__ */ jsx(Ellipsis, {})
+    ] });
+  }
+);
+
+class MultipleChoiceMessage extends ChatMessage {
+  constructor(question, options, Renderer) {
+    super(
+      Renderer ? /* @__PURE__ */ jsxs(Box, { className: "multipleChoiceMessage customRenderer", children: [
+        /* @__PURE__ */ jsx(Paragraph, { children: question }),
+        options.map((item) => /* @__PURE__ */ jsx(Renderer, { item }, item.url))
+      ] }) : /* @__PURE__ */ jsxs(Box, { className: "multipleChoiceMessage", children: [
+        /* @__PURE__ */ jsx(Paragraph, { children: question }),
+        /* @__PURE__ */ jsx(Box, { as: "ul", children: options.map((current) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+          SimpleButton,
+          {
+            className: "multipleChoice__option",
+            onClick: () => {
+              ApiaUtil.instance.tabs.openTab(current.label, current.url);
+            },
+            children: current.label
+          }
+        ) }, current.label)) })
+      ] }),
+      "multipleChoice"
+    );
+  }
+}
+
+var __defProp$3 = Object.defineProperty;
+var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$3 = (obj, key, value) => {
+  __defNormalProp$3(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
 function isPollProgress(payload) {
@@ -97,9 +1283,9 @@ function isPollProgress(payload) {
 }
 class RoutinesGeneration {
   constructor() {
-    __publicField$2(this, "audioRecorder", new AudioRecorder());
-    __publicField$2(this, "routineId", "");
-    __publicField$2(this, "state", {
+    __publicField$3(this, "audioRecorder", new AudioRecorder());
+    __publicField$3(this, "routineId", "");
+    __publicField$3(this, "state", {
       isLoading: false,
       progress: 0
     });
@@ -303,25 +1489,25 @@ class DashboardsRoutinesGeneration extends RoutinesGeneration {
   }
 }
 
-var __defProp$1 = Object.defineProperty;
-var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$1 = (obj, key, value) => {
-  __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __defProp$2 = Object.defineProperty;
+var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$2 = (obj, key, value) => {
+  __defNormalProp$2(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
 class ResponseStream extends EventEmitter {
   constructor() {
     super(...arguments);
-    __publicField$1(this, "buffer", "");
-    __publicField$1(this, "isRunning", false);
-    __publicField$1(this, "locked", false);
-    __publicField$1(this, "maxCompletionTime", 150);
+    __publicField$2(this, "buffer", "");
+    __publicField$2(this, "isRunning", false);
+    __publicField$2(this, "locked", false);
+    __publicField$2(this, "maxCompletionTime", 150);
     // ms
-    __publicField$1(this, "minPartSize", 2);
-    __publicField$1(this, "partSize", 2);
-    __publicField$1(this, "timing", 5);
+    __publicField$2(this, "minPartSize", 2);
+    __publicField$2(this, "partSize", 2);
+    __publicField$2(this, "timing", 5);
     // ms
-    __publicField$1(this, "waiting", []);
+    __publicField$2(this, "waiting", []);
   }
   calculatePartSize() {
     const totalSize = this.buffer.length + this.waiting.reduce((a, b) => a + b.length, 0);
@@ -438,17 +1624,17 @@ function getSrcFromBase64(base64) {
   return `data:image/jpg;base64,${base64}`;
 }
 
-var __defProp = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => {
-  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __defProp$1 = Object.defineProperty;
+var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$1 = (obj, key, value) => {
+  __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
 class ImagesStore {
   constructor(images, multiple) {
     this.multiple = multiple;
-    __publicField(this, "images", /* @__PURE__ */ new Map());
-    __publicField(this, "selectedId", "");
+    __publicField$1(this, "images", /* @__PURE__ */ new Map());
+    __publicField$1(this, "selectedId", "");
     this.images = new Map(
       images.map((c) => {
         const id = uniqueId();
@@ -578,29 +1764,51 @@ const ViewRendererContext = createContext(
   {}
 );
 
-class MultipleChoiceMessage extends ChatMessage {
-  constructor(question, options, Renderer) {
-    super(
-      Renderer ? /* @__PURE__ */ jsxs(Box, { className: "multipleChoiceMessage customRenderer", children: [
-        /* @__PURE__ */ jsx(Paragraph, { children: question }),
-        options.map((item) => /* @__PURE__ */ jsx(Renderer, { item }, item.url))
-      ] }) : /* @__PURE__ */ jsxs(Box, { className: "multipleChoiceMessage", children: [
-        /* @__PURE__ */ jsx(Paragraph, { children: question }),
-        /* @__PURE__ */ jsx(Box, { as: "ul", children: options.map((current) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-          SimpleButton,
-          {
-            className: "multipleChoice__option",
-            onClick: () => {
-              ApiaUtil.instance.tabs.openTab(current.label, current.url);
-            },
-            children: current.label
-          }
-        ) }, current.label)) })
-      ] }),
-      "multipleChoice"
-    );
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class StreamServicePoller {
+  constructor() {
+    __publicField(this, "closed", true);
+    __publicField(this, "stream", new ResponseStream());
+  }
+  on(ev, cb) {
+    return this.stream.on(ev, cb);
+  }
+  async start(token) {
+    this.closed = false;
+    try {
+      while (!this.closed) {
+        const res = await ApiaApi.post(
+          makeApiaUrl({
+            ajaxUrl: "apia.execution.StreamAction.run",
+            action: "poll",
+            streamToken: token
+          })
+        );
+        if (!res) {
+          this.closed = true;
+          this.stream.emit("error", null);
+        }
+        if (res?.data?.part) {
+          this.stream.emit("part", decodeBase64ToUtf8(res.data.part));
+        }
+        if (res?.data?.closed === "true") {
+          this.closed = true;
+          this.stream.emit("close", null);
+        }
+        if (res?.data?.failed === "true") {
+          this.stream.emit("error", null);
+        }
+      }
+    } finally {
+      this.closed = true;
+    }
   }
 }
 
-export { DashboardsRoutinesGeneration, MultipleChoiceMessage, ResponseStream, RoutinesGeneration, SearchController, SemanticSearchReference as SemanticSearchResult, ViewRendererContext, getImageFromDisk, getImagesFromDisk, getImagesWithDescription };
+export { Attachments, AutoscrollContainer, CameraController, ChatController, ChatMessage, DashboardsRoutinesGeneration, Ellipsis, FloatingChatController, Header, History, Message, MessageBlock, MessageBlocks, MessageBody, MultipleChoiceMessage, ResponseStream, RoutinesGeneration, SearchController, SemanticSearchReference as SemanticSearchResult, StreamMessage, StreamServicePoller, TextArea, ViewRendererContext, getImageFromDisk, getImagesFromDisk, getImagesWithDescription, rate };
 //# sourceMappingURL=index.js.map