@adatechnology/conversations-ui 0.1.0-rc.12 → 0.1.0-rc.14

package/dist/{chunk-3RKFU46R.js → chunk-SOWV4264.js}

@@ -1081,11 +1081,169 @@ var MessageComposer = ({
   );
 };
 
+// src/AudioRecorderButton.tsx
+import { useCallback as useCallback3, useEffect as useEffect2, useRef as useRef3, useState as useState7 } from "react";
+import { jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
+var DEFAULT_AUDIO_RECORDER_BUTTON_LABELS = {
+  start: "Gravar \xE1udio",
+  stop: "Parar grava\xE7\xE3o",
+  unsupported: "Este navegador n\xE3o grava \xE1udio.",
+  denied: "Sem permiss\xE3o para usar o microfone.",
+  review: "Ou\xE7a antes de enviar",
+  send: "Enviar \xE1udio",
+  discard: "Descartar \xE1udio",
+  empty: "Nada foi captado pelo microfone."
+};
+var DEFAULT_MAX_RECORDING_MILLISECONDS = 5 * 60 * 1e3;
+var RECORDING_FORMATS = [
+  { mimeType: "audio/ogg;codecs=opus", uploadMimeType: "audio/ogg", extension: "ogg" },
+  { mimeType: "audio/mp4", uploadMimeType: "audio/mp4", extension: "m4a" },
+  { mimeType: "audio/webm", uploadMimeType: "audio/webm", extension: "webm" }
+];
+function resolveRecordingFormat() {
+  if (typeof MediaRecorder === "undefined") return void 0;
+  if (typeof MediaRecorder.isTypeSupported !== "function") return RECORDING_FORMATS[0];
+  return RECORDING_FORMATS.find((format) => MediaRecorder.isTypeSupported(format.mimeType));
+}
+function AudioRecorderButton({
+  onRecorded,
+  onFailure,
+  onRecordingChange,
+  reviewBeforeSend = true,
+  maxDurationMilliseconds = DEFAULT_MAX_RECORDING_MILLISECONDS,
+  labels,
+  disabled
+}) {
+  const labelOf = (key) => labels?.[key] ?? DEFAULT_AUDIO_RECORDER_BUTTON_LABELS[key];
+  const [isRecording, setIsRecording] = useState7(false);
+  const [pending, setPending] = useState7(void 0);
+  const recorderRef = useRef3(null);
+  const autoStopRef = useRef3(void 0);
+  const discard = useCallback3(() => {
+    setPending((current) => {
+      if (current) URL.revokeObjectURL(current.objectURL);
+      return void 0;
+    });
+  }, []);
+  useEffect2(() => discard, [discard]);
+  const confirm = useCallback3(() => {
+    if (!pending) return;
+    void onRecorded(pending.file);
+    discard();
+  }, [discard, onRecorded, pending]);
+  const stop = useCallback3(() => {
+    recorderRef.current?.stop();
+  }, []);
+  const start = useCallback3(async () => {
+    const format = resolveRecordingFormat();
+    if (!format || !navigator.mediaDevices?.getUserMedia) {
+      onFailure?.(labels?.unsupported ?? DEFAULT_AUDIO_RECORDER_BUTTON_LABELS.unsupported);
+      return;
+    }
+    try {
+      const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
+      const recorder = new MediaRecorder(stream, { mimeType: format.mimeType });
+      const chunks = [];
+      recorder.addEventListener("dataavailable", (event) => {
+        if (event.data.size > 0) chunks.push(event.data);
+      });
+      recorder.addEventListener("stop", () => {
+        stream.getTracks().forEach((track) => track.stop());
+        clearTimeout(autoStopRef.current);
+        setIsRecording(false);
+        onRecordingChange?.(false);
+        recorderRef.current = null;
+        const blob = new Blob(chunks, { type: format.uploadMimeType });
+        const file = new File([blob], `audio-${Date.now()}.${format.extension}`, {
+          type: format.uploadMimeType
+        });
+        if (blob.size === 0) {
+          onFailure?.(labelOf("empty"));
+          return;
+        }
+        if (!reviewBeforeSend) {
+          void onRecorded(file);
+          return;
+        }
+        setPending({ file, objectURL: URL.createObjectURL(blob) });
+      });
+      recorderRef.current = recorder;
+      recorder.start();
+      autoStopRef.current = setTimeout(() => recorder.stop(), maxDurationMilliseconds);
+      setIsRecording(true);
+      onRecordingChange?.(true);
+    } catch {
+      onFailure?.(labels?.denied ?? DEFAULT_AUDIO_RECORDER_BUTTON_LABELS.denied);
+    }
+  }, [maxDurationMilliseconds, onFailure, onRecorded, onRecordingChange, reviewBeforeSend]);
+  const toggleLabel = isRecording ? labelOf("stop") : labelOf("start");
+  return (
+    /* O painel de revisão flutua sobre o botão em vez de ocupar espaço na barra: o microfone mora
+       na caixa do botão de enviar, e empurrar o composer para cima a cada gravação faria a
+       conversa saltar. */
+    /* @__PURE__ */ jsxs9("div", { className: "relative flex-shrink-0", children: [
+      pending && /* @__PURE__ */ jsxs9(
+        "div",
+        {
+          role: "group",
+          "aria-label": labelOf("review"),
+          className: "absolute bottom-full right-0 z-20 mb-2 flex w-64 items-center gap-2 rounded-xl border border-gray-200 bg-white p-2 shadow-lg dark:border-gray-700 dark:bg-gray-800",
+          children: [
+            /* @__PURE__ */ jsx13("audio", { src: pending.objectURL, controls: true, className: "h-8 min-w-0 flex-1" }),
+            /* @__PURE__ */ jsx13(
+              "button",
+              {
+                type: "button",
+                onClick: discard,
+                title: labelOf("discard"),
+                "aria-label": labelOf("discard"),
+                className: "flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-full text-gray-500 transition-colors hover:bg-gray-100 hover:text-red-500 dark:hover:bg-gray-700",
+                children: /* @__PURE__ */ jsxs9("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", children: [
+                  /* @__PURE__ */ jsx13("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+                  /* @__PURE__ */ jsx13("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+                ] })
+              }
+            ),
+            /* @__PURE__ */ jsx13(
+              "button",
+              {
+                type: "button",
+                onClick: confirm,
+                title: labelOf("send"),
+                "aria-label": labelOf("send"),
+                className: "flex h-8 w-8 flex-shrink-0 items-center justify-center rounded-full bg-emerald-500 text-white transition-colors hover:bg-emerald-600",
+                children: /* @__PURE__ */ jsx13("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx13("path", { d: "M2.01 21L23 12 2.01 3 2 10l15 2-15 2z" }) })
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx13(
+        "button",
+        {
+          type: "button",
+          disabled: disabled || pending !== void 0,
+          onClick: () => isRecording ? stop() : void start(),
+          title: toggleLabel,
+          "aria-label": toggleLabel,
+          "aria-pressed": isRecording,
+          className: `flex h-10 w-10 items-center justify-center rounded-full transition-colors disabled:opacity-50 ${isRecording ? "animate-pulse bg-red-500 text-white ring-4 ring-red-500/30 hover:bg-red-600" : "text-gray-500 hover:bg-gray-200 dark:hover:bg-gray-700"}`,
+          children: isRecording ? /* @__PURE__ */ jsx13("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx13("rect", { x: "6", y: "6", width: "12", height: "12", rx: "2" }) }) : /* @__PURE__ */ jsxs9("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", children: [
+            /* @__PURE__ */ jsx13("path", { d: "M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3z" }),
+            /* @__PURE__ */ jsx13("path", { d: "M19 11a7 7 0 0 1-14 0" }),
+            /* @__PURE__ */ jsx13("line", { x1: "12", y1: "18", x2: "12", y2: "22" })
+          ] })
+        }
+      )
+    ] })
+  );
+}
+
 // src/DateDivider.tsx
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx14 } from "react/jsx-runtime";
 function DateDivider({ iso, className, classNames }) {
   const { dateDivider } = useConversationLocales();
-  return /* @__PURE__ */ jsx13("div", { className: cn("flex justify-center sticky top-0 z-10 my-2 pointer-events-none", classNames?.root, className), children: /* @__PURE__ */ jsx13(
+  return /* @__PURE__ */ jsx14("div", { className: cn("flex justify-center sticky top-0 z-10 my-2 pointer-events-none", classNames?.root, className), children: /* @__PURE__ */ jsx14(
     "span",
     {
       className: cn(
@@ -1152,13 +1310,13 @@ function phoneInitials(number) {
 }
 
 // src/hooks/useAsyncResource.ts
-import { useCallback as useCallback3, useEffect as useEffect2, useRef as useRef3, useState as useState7 } from "react";
+import { useCallback as useCallback4, useEffect as useEffect3, useRef as useRef4, useState as useState8 } from "react";
 function useAsyncResource(fetcher, deps) {
-  const [data, setData] = useState7(void 0);
-  const [loading, setLoading] = useState7(false);
-  const [error, setError] = useState7(void 0);
-  const requestIdRef = useRef3(0);
-  const load = useCallback3(async () => {
+  const [data, setData] = useState8(void 0);
+  const [loading, setLoading] = useState8(false);
+  const [error, setError] = useState8(void 0);
+  const requestIdRef = useRef4(0);
+  const load = useCallback4(async () => {
     const requestId = ++requestIdRef.current;
     setLoading(true);
     setError(void 0);
@@ -1171,7 +1329,7 @@ function useAsyncResource(fetcher, deps) {
       if (requestId === requestIdRef.current) setLoading(false);
     }
   }, deps);
-  useEffect2(() => {
+  useEffect3(() => {
     load();
   }, [load]);
   return { data, loading, error, refetch: load };
@@ -1206,9 +1364,9 @@ function useConversationDocuments(conversationId, params) {
 }
 
 // src/ConversationDocumentsPanel.tsx
-import { useState as useState8 } from "react";
+import { useState as useState9 } from "react";
 import { ArrowUpDown, Bot, Download, Eye, Users } from "lucide-react";
-import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
 var DOCUMENT_SOURCE_FILTER = {
   ALL: "all",
   CUSTOMER: "customer",
@@ -1248,12 +1406,12 @@ function ConversationDocumentsPanel({
 }) {
   const labels = { ...DEFAULT_CONVERSATION_DOCUMENTS_LABELS, ...labelsOverride };
   const context = useConversations();
-  const [search, setSearch] = useState8("");
-  const [sourceFilter, setSourceFilter] = useState8(DOCUMENT_SOURCE_FILTER.ALL);
-  const [sortDirection, setSortDirection] = useState8("desc");
-  const [page, setPage] = useState8(1);
-  const [selectedIds, setSelectedIds] = useState8([]);
-  const [archiveError, setArchiveError] = useState8(false);
+  const [search, setSearch] = useState9("");
+  const [sourceFilter, setSourceFilter] = useState9(DOCUMENT_SOURCE_FILTER.ALL);
+  const [sortDirection, setSortDirection] = useState9("desc");
+  const [page, setPage] = useState9(1);
+  const [selectedIds, setSelectedIds] = useState9([]);
+  const [archiveError, setArchiveError] = useState9(false);
   const hasFilters = search !== "" || sourceFilter !== DOCUMENT_SOURCE_FILTER.ALL || sortDirection !== "desc";
   const { documents, total, loading, error } = useConversationDocuments(open ? conversationId : void 0, {
     search,
@@ -1304,10 +1462,10 @@ function ConversationDocumentsPanel({
     }
   }
   if (!open) return null;
-  return /* @__PURE__ */ jsx14("div", { className: cn("border-b", classNames?.root, className), children: /* @__PURE__ */ jsxs9("section", { className: cn("px-4 py-3", classNames?.body), children: [
-    /* @__PURE__ */ jsx14("p", { className: cn("mb-2 text-sm font-medium", classNames?.title), children: labels.title }),
-    /* @__PURE__ */ jsxs9("div", { className: cn("mb-2 flex flex-wrap items-center gap-2 border-b pb-2", classNames?.filters), children: [
-      /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx15("div", { className: cn("border-b", classNames?.root, className), children: /* @__PURE__ */ jsxs10("section", { className: cn("px-4 py-3", classNames?.body), children: [
+    /* @__PURE__ */ jsx15("p", { className: cn("mb-2 text-sm font-medium", classNames?.title), children: labels.title }),
+    /* @__PURE__ */ jsxs10("div", { className: cn("mb-2 flex flex-wrap items-center gap-2 border-b pb-2", classNames?.filters), children: [
+      /* @__PURE__ */ jsx15(
         "input",
         {
           type: "search",
@@ -1318,7 +1476,7 @@ function ConversationDocumentsPanel({
           className: cn("w-full rounded-md border px-3 py-2 text-sm sm:w-52", classNames?.search)
         }
       ),
-      /* @__PURE__ */ jsxs9(
+      /* @__PURE__ */ jsxs10(
         "select",
         {
           value: sourceFilter,
@@ -1326,25 +1484,25 @@ function ConversationDocumentsPanel({
           "aria-label": labels.sourceFilterAll,
           className: cn("w-full rounded-md border px-2 py-2 text-sm sm:w-36", classNames?.sourceSelect),
           children: [
-            /* @__PURE__ */ jsx14("option", { value: DOCUMENT_SOURCE_FILTER.ALL, children: labels.sourceFilterAll }),
-            /* @__PURE__ */ jsx14("option", { value: DOCUMENT_SOURCE_FILTER.CUSTOMER, children: labels.sourceFilterCustomer }),
-            /* @__PURE__ */ jsx14("option", { value: DOCUMENT_SOURCE_FILTER.TEAM, children: labels.sourceFilterTeam })
+            /* @__PURE__ */ jsx15("option", { value: DOCUMENT_SOURCE_FILTER.ALL, children: labels.sourceFilterAll }),
+            /* @__PURE__ */ jsx15("option", { value: DOCUMENT_SOURCE_FILTER.CUSTOMER, children: labels.sourceFilterCustomer }),
+            /* @__PURE__ */ jsx15("option", { value: DOCUMENT_SOURCE_FILTER.TEAM, children: labels.sourceFilterTeam })
           ]
         }
       ),
-      /* @__PURE__ */ jsxs9(
+      /* @__PURE__ */ jsxs10(
         "button",
         {
           type: "button",
           onClick: () => applyFilter(() => setSortDirection(sortDirection === "desc" ? "asc" : "desc")),
           className: cn("cv-header-action inline-flex items-center gap-1", classNames?.sortButton),
           children: [
-            /* @__PURE__ */ jsx14(ArrowUpDown, { size: 14 }),
+            /* @__PURE__ */ jsx15(ArrowUpDown, { size: 14 }),
             sortDirection === "desc" ? labels.sortMostRecent : labels.sortOldest
           ]
         }
       ),
-      hasFilters ? /* @__PURE__ */ jsx14(
+      hasFilters ? /* @__PURE__ */ jsx15(
         "button",
         {
           type: "button",
@@ -1358,12 +1516,12 @@ function ConversationDocumentsPanel({
         }
       ) : null
     ] }),
-    loading ? /* @__PURE__ */ jsx14("p", { className: cn("text-xs text-gray-500", classNames?.status), children: labels.loading }) : null,
-    error ? /* @__PURE__ */ jsx14("p", { role: "alert", className: cn("text-xs text-red-600 dark:text-red-400", classNames?.status), children: labels.failure }) : null,
-    !loading && !error && documents.length === 0 ? /* @__PURE__ */ jsx14("p", { className: cn("text-xs text-gray-500", classNames?.status), children: hasFilters ? labels.noResults : labels.empty }) : null,
-    canArchive && documents.length > 0 ? /* @__PURE__ */ jsxs9("div", { className: cn("mb-2 flex flex-wrap items-center gap-3 text-xs", classNames?.selectionBar), children: [
-      /* @__PURE__ */ jsxs9("label", { className: "inline-flex items-center gap-1.5", children: [
-        /* @__PURE__ */ jsx14(
+    loading ? /* @__PURE__ */ jsx15("p", { className: cn("text-xs text-gray-500", classNames?.status), children: labels.loading }) : null,
+    error ? /* @__PURE__ */ jsx15("p", { role: "alert", className: cn("text-xs text-red-600 dark:text-red-400", classNames?.status), children: labels.failure }) : null,
+    !loading && !error && documents.length === 0 ? /* @__PURE__ */ jsx15("p", { className: cn("text-xs text-gray-500", classNames?.status), children: hasFilters ? labels.noResults : labels.empty }) : null,
+    canArchive && documents.length > 0 ? /* @__PURE__ */ jsxs10("div", { className: cn("mb-2 flex flex-wrap items-center gap-3 text-xs", classNames?.selectionBar), children: [
+      /* @__PURE__ */ jsxs10("label", { className: "inline-flex items-center gap-1.5", children: [
+        /* @__PURE__ */ jsx15(
           "input",
           {
             type: "checkbox",
@@ -1374,13 +1532,13 @@ function ConversationDocumentsPanel({
         ),
         labels.selectAll
       ] }),
-      selectedIds.length > 0 ? /* @__PURE__ */ jsx14("button", { type: "button", onClick: () => void handleDownloadSelected(), className: "cv-header-action", children: labels.downloadSelected(selectedIds.length) }) : null,
-      archiveError ? /* @__PURE__ */ jsx14("span", { role: "alert", className: "text-red-600 dark:text-red-400", children: labels.archiveFailed }) : null
+      selectedIds.length > 0 ? /* @__PURE__ */ jsx15("button", { type: "button", onClick: () => void handleDownloadSelected(), className: "cv-header-action", children: labels.downloadSelected(selectedIds.length) }) : null,
+      archiveError ? /* @__PURE__ */ jsx15("span", { role: "alert", className: "text-red-600 dark:text-red-400", children: labels.archiveFailed }) : null
     ] }) : null,
-    /* @__PURE__ */ jsx14("ul", { className: cn("space-y-2", classNames?.list), children: documents.map((document2) => {
+    /* @__PURE__ */ jsx15("ul", { className: cn("space-y-2", classNames?.list), children: documents.map((document2) => {
       const isFromCustomer = !TEAM_SOURCES.has(document2.source);
       const SourceIcon = isFromCustomer ? Users : Bot;
-      return /* @__PURE__ */ jsxs9(
+      return /* @__PURE__ */ jsxs10(
         "li",
         {
           className: cn(
@@ -1388,8 +1546,8 @@ function ConversationDocumentsPanel({
             classNames?.item
           ),
           children: [
-            /* @__PURE__ */ jsxs9("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
-              canArchive ? /* @__PURE__ */ jsx14(
+            /* @__PURE__ */ jsxs10("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [
+              canArchive ? /* @__PURE__ */ jsx15(
                 "input",
                 {
                   type: "checkbox",
@@ -1399,9 +1557,9 @@ function ConversationDocumentsPanel({
                   className: cn("shrink-0", classNames?.checkbox)
                 }
               ) : null,
-              /* @__PURE__ */ jsx14(FileIcon, { filename: document2.filename, mimeType: document2.mimeType }),
-              /* @__PURE__ */ jsxs9("div", { className: "min-w-0 flex-1", children: [
-                /* @__PURE__ */ jsxs9(
+              /* @__PURE__ */ jsx15(FileIcon, { filename: document2.filename, mimeType: document2.mimeType }),
+              /* @__PURE__ */ jsxs10("div", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ jsxs10(
                   "div",
                   {
                     className: cn(
@@ -1410,12 +1568,12 @@ function ConversationDocumentsPanel({
                       classNames?.sourceBadge
                     ),
                     children: [
-                      /* @__PURE__ */ jsx14(SourceIcon, { size: 11 }),
+                      /* @__PURE__ */ jsx15(SourceIcon, { size: 11 }),
                       isFromCustomer ? labels.sourceFilterCustomer : labels.sourceFilterTeam
                     ]
                   }
                 ),
-                /* @__PURE__ */ jsx14(
+                /* @__PURE__ */ jsx15(
                   "div",
                   {
                     className: cn("truncate text-sm font-medium", classNames?.filename),
@@ -1423,15 +1581,15 @@ function ConversationDocumentsPanel({
                     children: document2.filename
                   }
                 ),
-                /* @__PURE__ */ jsxs9("div", { className: cn("text-xs text-gray-500 dark:text-gray-400", classNames?.meta), children: [
+                /* @__PURE__ */ jsxs10("div", { className: cn("text-xs text-gray-500 dark:text-gray-400", classNames?.meta), children: [
                   formatDateTime(document2.linkedAt),
                   " \xB7 ",
                   formatFileSize(document2.sizeBytes)
                 ] })
               ] })
             ] }),
-            /* @__PURE__ */ jsxs9("div", { className: "flex shrink-0 gap-1", children: [
-              /* @__PURE__ */ jsx14(
+            /* @__PURE__ */ jsxs10("div", { className: "flex shrink-0 gap-1", children: [
+              /* @__PURE__ */ jsx15(
                 "button",
                 {
                   type: "button",
@@ -1439,10 +1597,10 @@ function ConversationDocumentsPanel({
                   title: labels.view,
                   "aria-label": `${labels.view}: ${document2.filename}`,
                   className: cn("cv-header-icon", classNames?.viewButton),
-                  children: /* @__PURE__ */ jsx14(Eye, { size: 14 })
+                  children: /* @__PURE__ */ jsx15(Eye, { size: 14 })
                 }
               ),
-              /* @__PURE__ */ jsx14(
+              /* @__PURE__ */ jsx15(
                 "button",
                 {
                   type: "button",
@@ -1450,7 +1608,7 @@ function ConversationDocumentsPanel({
                   title: labels.download,
                   "aria-label": `${labels.download}: ${document2.filename}`,
                   className: cn("cv-header-icon", classNames?.downloadButton),
-                  children: /* @__PURE__ */ jsx14(Download, { size: 14 })
+                  children: /* @__PURE__ */ jsx15(Download, { size: 14 })
                 }
               )
             ] })
@@ -1459,7 +1617,7 @@ function ConversationDocumentsPanel({
         document2.id
       );
     }) }),
-    total > perPage ? /* @__PURE__ */ jsxs9(
+    total > perPage ? /* @__PURE__ */ jsxs10(
       "div",
       {
         className: cn(
@@ -1467,9 +1625,9 @@ function ConversationDocumentsPanel({
           classNames?.pagination
         ),
         children: [
-          /* @__PURE__ */ jsx14("span", { className: "text-gray-400", children: labels.total(total) }),
-          /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx14(
+          /* @__PURE__ */ jsx15("span", { className: "text-gray-400", children: labels.total(total) }),
+          /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx15(
               "button",
               {
                 type: "button",
@@ -1480,8 +1638,8 @@ function ConversationDocumentsPanel({
                 children: "\u2039"
               }
             ),
-            /* @__PURE__ */ jsx14("span", { className: "text-gray-500", children: labels.page(page, lastPage) }),
-            /* @__PURE__ */ jsx14(
+            /* @__PURE__ */ jsx15("span", { className: "text-gray-500", children: labels.page(page, lastPage) }),
+            /* @__PURE__ */ jsx15(
               "button",
               {
                 type: "button",
@@ -1500,9 +1658,9 @@ function ConversationDocumentsPanel({
 }
 
 // src/DocumentsLibrary.tsx
-import { useEffect as useEffect3, useState as useState9 } from "react";
+import { useEffect as useEffect4, useState as useState10 } from "react";
 import { ArrowUpDown as ArrowUpDown2, Bot as Bot2, Download as Download2, Eye as Eye2, MessageSquare, Users as Users2 } from "lucide-react";
-import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
 var DEFAULT_DOCUMENTS_LIBRARY_LABELS = {
   title: "Documentos",
   searchPlaceholder: "Buscar por nome do arquivo ou telefone",
@@ -1533,18 +1691,18 @@ function DocumentsLibrary({
 }) {
   const labels = { ...DEFAULT_DOCUMENTS_LIBRARY_LABELS, ...labelsOverride };
   const context = useConversations();
-  const [search, setSearch] = useState9("");
-  const [sourceFilter, setSourceFilter] = useState9(DOCUMENT_SOURCE_FILTER.ALL);
-  const [sortDirection, setSortDirection] = useState9("desc");
-  const [page, setPage] = useState9(1);
-  const [documents, setDocuments] = useState9([]);
-  const [total, setTotal] = useState9(0);
-  const [loading, setLoading] = useState9(false);
-  const [failed, setFailed] = useState9(false);
+  const [search, setSearch] = useState10("");
+  const [sourceFilter, setSourceFilter] = useState10(DOCUMENT_SOURCE_FILTER.ALL);
+  const [sortDirection, setSortDirection] = useState10("desc");
+  const [page, setPage] = useState10(1);
+  const [documents, setDocuments] = useState10([]);
+  const [total, setTotal] = useState10(0);
+  const [loading, setLoading] = useState10(false);
+  const [failed, setFailed] = useState10(false);
   const hasFilters = search !== "" || sourceFilter !== DOCUMENT_SOURCE_FILTER.ALL || sortDirection !== "desc";
   const lastPage = Math.max(1, Math.ceil(total / perPage));
   const fetchAll = context?.api.getAllDocuments;
-  useEffect3(() => {
+  useEffect4(() => {
     if (!fetchAll) return;
     let active = true;
     setLoading(true);
@@ -1577,10 +1735,10 @@ function DocumentsLibrary({
     if (url) window.open(url, "_blank", "noopener,noreferrer");
   }
   if (!fetchAll) return null;
-  return /* @__PURE__ */ jsxs10("div", { className: cn("space-y-3", classNames?.root, className), children: [
-    /* @__PURE__ */ jsx15("h2", { className: cn("text-lg font-semibold", classNames?.title), children: labels.title }),
-    /* @__PURE__ */ jsxs10("div", { className: cn("flex flex-wrap items-center gap-2", classNames?.filters), children: [
-      /* @__PURE__ */ jsx15(
+  return /* @__PURE__ */ jsxs11("div", { className: cn("space-y-3", classNames?.root, className), children: [
+    /* @__PURE__ */ jsx16("h2", { className: cn("text-lg font-semibold", classNames?.title), children: labels.title }),
+    /* @__PURE__ */ jsxs11("div", { className: cn("flex flex-wrap items-center gap-2", classNames?.filters), children: [
+      /* @__PURE__ */ jsx16(
         "input",
         {
           type: "search",
@@ -1591,7 +1749,7 @@ function DocumentsLibrary({
           className: cn("w-full rounded-md border px-3 py-2 text-sm sm:w-64", classNames?.search)
         }
       ),
-      /* @__PURE__ */ jsxs10(
+      /* @__PURE__ */ jsxs11(
         "select",
         {
           value: sourceFilter,
@@ -1599,25 +1757,25 @@ function DocumentsLibrary({
           "aria-label": labels.sourceFilterAll,
           className: cn("w-full rounded-md border px-2 py-2 text-sm sm:w-40", classNames?.sourceSelect),
           children: [
-            /* @__PURE__ */ jsx15("option", { value: DOCUMENT_SOURCE_FILTER.ALL, children: labels.sourceFilterAll }),
-            /* @__PURE__ */ jsx15("option", { value: DOCUMENT_SOURCE_FILTER.CUSTOMER, children: labels.sourceFilterCustomer }),
-            /* @__PURE__ */ jsx15("option", { value: DOCUMENT_SOURCE_FILTER.TEAM, children: labels.sourceFilterTeam })
+            /* @__PURE__ */ jsx16("option", { value: DOCUMENT_SOURCE_FILTER.ALL, children: labels.sourceFilterAll }),
+            /* @__PURE__ */ jsx16("option", { value: DOCUMENT_SOURCE_FILTER.CUSTOMER, children: labels.sourceFilterCustomer }),
+            /* @__PURE__ */ jsx16("option", { value: DOCUMENT_SOURCE_FILTER.TEAM, children: labels.sourceFilterTeam })
           ]
         }
       ),
-      /* @__PURE__ */ jsxs10(
+      /* @__PURE__ */ jsxs11(
         "button",
         {
           type: "button",
           onClick: () => applyFilter(() => setSortDirection(sortDirection === "desc" ? "asc" : "desc")),
           className: cn("cv-header-action inline-flex items-center gap-1", classNames?.sortButton),
           children: [
-            /* @__PURE__ */ jsx15(ArrowUpDown2, { size: 14 }),
+            /* @__PURE__ */ jsx16(ArrowUpDown2, { size: 14 }),
             sortDirection === "desc" ? labels.sortMostRecent : labels.sortOldest
           ]
         }
       ),
-      hasFilters ? /* @__PURE__ */ jsx15(
+      hasFilters ? /* @__PURE__ */ jsx16(
         "button",
         {
           type: "button",
@@ -1631,13 +1789,13 @@ function DocumentsLibrary({
         }
       ) : null
     ] }),
-    loading ? /* @__PURE__ */ jsx15("p", { className: cn("text-sm text-gray-500", classNames?.status), children: labels.loading }) : null,
-    failed ? /* @__PURE__ */ jsx15("p", { role: "alert", className: cn("text-sm text-red-600 dark:text-red-400", classNames?.status), children: labels.failure }) : null,
-    !loading && !failed && documents.length === 0 ? /* @__PURE__ */ jsx15("p", { className: cn("text-sm text-gray-500", classNames?.status), children: hasFilters ? labels.noResults : labels.empty }) : null,
-    /* @__PURE__ */ jsx15("ul", { className: cn("space-y-2", classNames?.list), children: documents.map((document2) => {
+    loading ? /* @__PURE__ */ jsx16("p", { className: cn("text-sm text-gray-500", classNames?.status), children: labels.loading }) : null,
+    failed ? /* @__PURE__ */ jsx16("p", { role: "alert", className: cn("text-sm text-red-600 dark:text-red-400", classNames?.status), children: labels.failure }) : null,
+    !loading && !failed && documents.length === 0 ? /* @__PURE__ */ jsx16("p", { className: cn("text-sm text-gray-500", classNames?.status), children: hasFilters ? labels.noResults : labels.empty }) : null,
+    /* @__PURE__ */ jsx16("ul", { className: cn("space-y-2", classNames?.list), children: documents.map((document2) => {
       const isFromCustomer = !TEAM_SOURCES2.has(document2.source);
       const SourceIcon = isFromCustomer ? Users2 : Bot2;
-      return /* @__PURE__ */ jsxs10(
+      return /* @__PURE__ */ jsxs11(
         "li",
         {
           className: cn(
@@ -1645,23 +1803,23 @@ function DocumentsLibrary({
             classNames?.item
           ),
           children: [
-            /* @__PURE__ */ jsxs10("div", { className: "flex min-w-0 flex-1 items-center gap-3", children: [
-              /* @__PURE__ */ jsx15(FileIcon, { filename: document2.filename, mimeType: document2.mimeType }),
-              /* @__PURE__ */ jsxs10("div", { className: "min-w-0 flex-1", children: [
-                /* @__PURE__ */ jsx15("div", { className: cn("truncate text-sm font-medium", classNames?.filename), title: document2.filename, children: document2.filename }),
-                /* @__PURE__ */ jsxs10("div", { className: cn("flex flex-wrap items-center gap-x-2 text-xs text-gray-500", classNames?.meta), children: [
-                  /* @__PURE__ */ jsxs10("span", { className: "inline-flex items-center gap-1", children: [
-                    /* @__PURE__ */ jsx15(SourceIcon, { size: 11 }),
+            /* @__PURE__ */ jsxs11("div", { className: "flex min-w-0 flex-1 items-center gap-3", children: [
+              /* @__PURE__ */ jsx16(FileIcon, { filename: document2.filename, mimeType: document2.mimeType }),
+              /* @__PURE__ */ jsxs11("div", { className: "min-w-0 flex-1", children: [
+                /* @__PURE__ */ jsx16("div", { className: cn("truncate text-sm font-medium", classNames?.filename), title: document2.filename, children: document2.filename }),
+                /* @__PURE__ */ jsxs11("div", { className: cn("flex flex-wrap items-center gap-x-2 text-xs text-gray-500", classNames?.meta), children: [
+                  /* @__PURE__ */ jsxs11("span", { className: "inline-flex items-center gap-1", children: [
+                    /* @__PURE__ */ jsx16(SourceIcon, { size: 11 }),
                     isFromCustomer ? labels.sourceFilterCustomer : labels.sourceFilterTeam
                   ] }),
-                  /* @__PURE__ */ jsx15("span", { children: "\xB7" }),
-                  /* @__PURE__ */ jsx15("span", { children: formatDateTime(document2.linkedAt) }),
-                  /* @__PURE__ */ jsx15("span", { children: "\xB7" }),
-                  /* @__PURE__ */ jsx15("span", { children: formatFileSize(document2.sizeBytes) })
+                  /* @__PURE__ */ jsx16("span", { children: "\xB7" }),
+                  /* @__PURE__ */ jsx16("span", { children: formatDateTime(document2.linkedAt) }),
+                  /* @__PURE__ */ jsx16("span", { children: "\xB7" }),
+                  /* @__PURE__ */ jsx16("span", { children: formatFileSize(document2.sizeBytes) })
                 ] })
               ] })
             ] }),
-            onOpenConversation ? /* @__PURE__ */ jsxs10(
+            onOpenConversation ? /* @__PURE__ */ jsxs11(
               "button",
               {
                 type: "button",
@@ -1669,13 +1827,13 @@ function DocumentsLibrary({
                 title: labels.openConversation,
                 className: cn("cv-header-action inline-flex shrink-0 items-center gap-1", classNames?.conversationLink),
                 children: [
-                  /* @__PURE__ */ jsx15(MessageSquare, { size: 12 }),
+                  /* @__PURE__ */ jsx16(MessageSquare, { size: 12 }),
                   formatPhone(document2.conversationId)
                 ]
               }
-            ) : /* @__PURE__ */ jsx15("span", { className: cn("shrink-0 text-xs text-gray-500", classNames?.conversationLink), children: formatPhone(document2.conversationId) }),
-            /* @__PURE__ */ jsxs10("div", { className: "flex shrink-0 gap-1", children: [
-              /* @__PURE__ */ jsx15(
+            ) : /* @__PURE__ */ jsx16("span", { className: cn("shrink-0 text-xs text-gray-500", classNames?.conversationLink), children: formatPhone(document2.conversationId) }),
+            /* @__PURE__ */ jsxs11("div", { className: "flex shrink-0 gap-1", children: [
+              /* @__PURE__ */ jsx16(
                 "button",
                 {
                   type: "button",
@@ -1683,10 +1841,10 @@ function DocumentsLibrary({
                   title: labels.view,
                   "aria-label": `${labels.view}: ${document2.filename}`,
                   className: "cv-header-icon",
-                  children: /* @__PURE__ */ jsx15(Eye2, { size: 14 })
+                  children: /* @__PURE__ */ jsx16(Eye2, { size: 14 })
                 }
               ),
-              /* @__PURE__ */ jsx15(
+              /* @__PURE__ */ jsx16(
                 "button",
                 {
                   type: "button",
@@ -1694,7 +1852,7 @@ function DocumentsLibrary({
                   title: labels.download,
                   "aria-label": `${labels.download}: ${document2.filename}`,
                   className: "cv-header-icon",
-                  children: /* @__PURE__ */ jsx15(Download2, { size: 14 })
+                  children: /* @__PURE__ */ jsx16(Download2, { size: 14 })
                 }
               )
             ] })
@@ -1703,10 +1861,10 @@ function DocumentsLibrary({
         `${document2.conversationId}:${document2.id}`
       );
     }) }),
-    total > perPage ? /* @__PURE__ */ jsxs10("div", { className: cn("flex items-center justify-between border-t pt-2 text-xs dark:border-gray-700", classNames?.pagination), children: [
-      /* @__PURE__ */ jsx15("span", { className: "text-gray-400", children: labels.total(total) }),
-      /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx15(
+    total > perPage ? /* @__PURE__ */ jsxs11("div", { className: cn("flex items-center justify-between border-t pt-2 text-xs dark:border-gray-700", classNames?.pagination), children: [
+      /* @__PURE__ */ jsx16("span", { className: "text-gray-400", children: labels.total(total) }),
+      /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx16(
           "button",
           {
             type: "button",
@@ -1716,8 +1874,8 @@ function DocumentsLibrary({
             children: "\u2039"
           }
         ),
-        /* @__PURE__ */ jsx15("span", { className: "text-gray-500", children: labels.page(page, lastPage) }),
-        /* @__PURE__ */ jsx15(
+        /* @__PURE__ */ jsx16("span", { className: "text-gray-500", children: labels.page(page, lastPage) }),
+        /* @__PURE__ */ jsx16(
           "button",
           {
             type: "button",
@@ -1762,6 +1920,9 @@ export {
   DEFAULT_MESSAGE_COMPOSER_LABELS,
   DEFAULT_ACCEPTED_FILE_TYPES,
   MessageComposer,
+  DEFAULT_AUDIO_RECORDER_BUTTON_LABELS,
+  DEFAULT_MAX_RECORDING_MILLISECONDS,
+  AudioRecorderButton,
   DateDivider,
   formatPhone,
   phoneCountryFlag,