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

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import react__default, { ReactNode, CSSProperties, FormEvent } from 'react';
-import { y as MessagePayload, A as ResolveMediaUrl, v as InteractiveSelection, t as InteractivePayload, p as ConversationsFeatures, m as ConversationSummary, h as ConversationChannel, L as ListConversationsParams, o as ConversationsApi, S as SSEProvider, w as ListDocumentsParams, i as ConversationDocument, n as ConversationTemplate } from './types-B5C1DLu1.js';
-export { C as CHANNEL_CAPABILITIES, a as CHANNEL_FILTER_ALL, b as CONVERSATION_CHANNEL, c as ChannelCapabilities, d as ChannelFilter, e as ChannelFilterOption, f as CompanyDocument, g as CompanyDocumentPage, j as ConversationDocumentPage, k as ConversationEventSource, l as ConversationPage, q as ConversationsTheme, r as ConversationsUIConfig, D as DEFAULT_CONVERSATION_CHANNEL, F as FormatContactHandleParams, H as HANDLE_KIND, s as HandleKind, I as InteractiveOption, u as InteractiveSection, M as MediaRenderer, x as MediaRendererProps, R as REOPEN_MECHANISM, z as ReopenMechanism, B as capabilitiesOf, E as channelFiltersFor, G as contactFlag, J as formatContactHandle } from './types-B5C1DLu1.js';
+import { G as MessagePayload, K as ResolveMediaUrl, z as InteractiveSelection, x as InteractivePayload, r as ConversationsFeatures, o as ConversationSummary, j as ConversationChannel, L as ListConversationsParams, q as ConversationsApi, S as SSEProvider, B as ListDocumentsParams, k as ConversationDocument, p as ConversationTemplate } from './types-O7kMP1Yn.js';
+export { A as AudioRecorderButton, a as AudioRecorderButtonLabels, b as AudioRecorderButtonProps, C as CHANNEL_CAPABILITIES, c as CHANNEL_FILTER_ALL, d as CONVERSATION_CHANNEL, e as ChannelCapabilities, f as ChannelFilter, g as ChannelFilterOption, h as CompanyDocument, i as CompanyDocumentPage, l as ConversationDocumentPage, m as ConversationEventSource, n as ConversationPage, s as ConversationsTheme, t as ConversationsUIConfig, D as DEFAULT_AUDIO_RECORDER_BUTTON_LABELS, u as DEFAULT_CONVERSATION_CHANNEL, v as DEFAULT_MAX_RECORDING_MILLISECONDS, F as FormatContactHandleParams, H as HANDLE_KIND, w as HandleKind, I as InteractiveOption, y as InteractiveSection, M as MediaRenderer, E as MediaRendererProps, R as REOPEN_MECHANISM, J as ReopenMechanism, N as capabilitiesOf, O as channelFiltersFor, P as contactFlag, Q as formatContactHandle } from './types-O7kMP1Yn.js';
 
 interface MessageBubbleProps {
     message: MessagePayload;

package/dist/index.js

@@ -1,15 +1,18 @@
 import {
   AudioPlayer,
+  AudioRecorderButton,
   ConversationDocumentsPanel,
   ConversationLocalesProvider,
   ConversationWallpaper,
   ConversationsProvider,
   DEFAULT_ACCEPTED_FILE_TYPES,
+  DEFAULT_AUDIO_RECORDER_BUTTON_LABELS,
   DEFAULT_CONVERSATION_DOCUMENTS_LABELS,
   DEFAULT_DOCUMENTS_LIBRARY_LABELS,
   DEFAULT_EMOJI_PICKER_LABELS,
   DEFAULT_INTERACTIVE_MESSAGE_LABELS,
   DEFAULT_LIGHTBOX_LABELS,
+  DEFAULT_MAX_RECORDING_MILLISECONDS,
   DEFAULT_MESSAGE_COMPOSER_LABELS,
   DOCUMENT_SOURCE_FILTER,
   DateDivider,
@@ -41,7 +44,7 @@ import {
   useConversationDocuments,
   useConversationLocales,
   useConversations
-} from "./chunk-3RKFU46R.js";
+} from "./chunk-SOWV4264.js";
 import {
   htmlToWA,
   parseWhatsAppFormatting,
@@ -2271,6 +2274,7 @@ function useInboxActions() {
 }
 export {
   AudioPlayer,
+  AudioRecorderButton,
   Avatar,
   CHANNEL_BRAND_COLOR,
   CHANNEL_CAPABILITIES,
@@ -2287,6 +2291,7 @@ export {
   ConversationWallpaper,
   ConversationsProvider,
   DEFAULT_ACCEPTED_FILE_TYPES,
+  DEFAULT_AUDIO_RECORDER_BUTTON_LABELS,
   DEFAULT_AVATAR_LABELS,
   DEFAULT_CONVERSATION_CHANNEL,
   DEFAULT_CONVERSATION_CONTEXT_LABELS,
@@ -2297,6 +2302,7 @@ export {
   DEFAULT_EMOJI_PICKER_LABELS,
   DEFAULT_INTERACTIVE_MESSAGE_LABELS,
   DEFAULT_LIGHTBOX_LABELS,
+  DEFAULT_MAX_RECORDING_MILLISECONDS,
   DEFAULT_MESSAGE_COMPOSER_LABELS,
   DEFAULT_RICH_COMPOSER_TOOLTIPS,
   DEFAULT_TEMPLATES_SETTINGS_LABELS,

package/dist/preview/index.d.ts

@@ -1,4 +1,5 @@
-import { y as MessagePayload, m as ConversationSummary, k as ConversationEventSource, o as ConversationsApi, L as ListConversationsParams, l as ConversationPage, S as SSEProvider, i as ConversationDocument, A as ResolveMediaUrl } from '../types-B5C1DLu1.js';
+import { G as MessagePayload, o as ConversationSummary, m as ConversationEventSource, q as ConversationsApi, L as ListConversationsParams, n as ConversationPage, S as SSEProvider, k as ConversationDocument, K as ResolveMediaUrl } from '../types-O7kMP1Yn.js';
+export { A as AudioRecorderButton, a as AudioRecorderButtonLabels, b as AudioRecorderButtonProps, D as DEFAULT_AUDIO_RECORDER_BUTTON_LABELS } from '../types-O7kMP1Yn.js';
 import * as react from 'react';
 import { InteractiveReplyOption, InboundMediaType } from '@adatechnology/meta-whatsapp-contracts/testing';
 
@@ -205,41 +206,6 @@ type PreviewUploadedMedia = {
 declare function mediaTypeOf(mimeType: string): SendPreviewMediaParams['mediaType'];
 declare function ConversationPreview({ client, sse, conversationId, loadMessages, placeholder, pollIntervalMs, uploadMedia, }: ConversationPreviewProps): react.JSX.Element;
 
-/**
- * Gravação de áudio no simulador, pelo microfone do próprio navegador.
- *
- * Existe porque áudio é o formato que mais chega de cliente real e o que mais quebra fluxo: sem
- * poder gravar aqui, testar o caminho de transcrição exigia mandar mensagem do celular de alguém.
- *
- * O arquivo gravado sai daqui como `File` e segue exatamente o mesmo caminho de um anexo — quem
- * hospeda e devolve o `mediaId` é o host, via `uploadMedia`.
- */
-interface AudioRecorderButtonLabels {
-    start: string;
-    stop: string;
-    unsupported: string;
-    denied: string;
-}
-declare const DEFAULT_AUDIO_RECORDER_BUTTON_LABELS: AudioRecorderButtonLabels;
-interface AudioRecorderButtonProps {
-    onRecorded: (file: File) => void | Promise<void>;
-    onFailure?: (message: string) => void;
-    /**
-     * Avisa quando a gravação começa e termina. O botão é um interruptor — o segundo toque é que
-     * envia — e sem um aviso fora dele o operador grava, não vê nada acontecer e desiste achando
-     * que o microfone está quebrado.
-     */
-    onRecordingChange?: (isRecording: boolean) => void;
-    /**
-     * Teto de duração da gravação, em milissegundos. Passado o tempo, o gravador para e envia o que
-     * tem. Produto com limite próprio sobrescreve.
-     */
-    maxDurationMilliseconds?: number;
-    labels?: Partial<AudioRecorderButtonLabels>;
-    disabled?: boolean;
-}
-declare function AudioRecorderButton({ onRecorded, onFailure, onRecordingChange, maxDurationMilliseconds, labels, disabled, }: AudioRecorderButtonProps): react.JSX.Element;
-
 /**
  * Roteiro que mantém o preview vivo: sem tráfego chegando, a inbox é uma tela estática e as
  * transições que o atendente precisa testar (fila de espera enchendo, handoff, devolução ao bot)
@@ -338,4 +304,4 @@ type MediaTypesPreviewProps = {
 };
 declare function MediaTypesPreview({ conversationId, className, }: MediaTypesPreviewProps): react.JSX.Element;
 
-export { type AppendMessageParams, AudioRecorderButton, type AudioRecorderButtonLabels, type AudioRecorderButtonProps, ConversationPreview, type ConversationPreviewProps, type CreateMockConversationsApiParams, type CreateMockSSEProviderParams, type CreatePreviewStoreParams, type CreatePreviewWebhookClientParams, DEFAULT_AUDIO_RECORDER_BUTTON_LABELS, DEFAULT_PREVIEW_SCRIPT, GLOBAL_CHANNEL, type ListConversationsFilters, MEDIA_TYPES_CONVERSATION_ID, MediaTypesPreview, type MediaTypesPreviewProps, type MockEventSource, PREVIEW_CONVERSATIONS, PREVIEW_DOCUMENTS, PREVIEW_FILE_SAMPLES, PREVIEW_MESSAGES, type PreviewEmission, PreviewInProductionError, type PreviewScriptStep, type PreviewStore, type PreviewStoreListener, type PreviewUploadedMedia, type PreviewWebhookClient, PreviewWebhookRejectedError, type SendPreviewMediaParams, type SetModeParams, type StartPreviewScriptParams, assertPreviewEnvironment, conversationChannel, createMockConversationsApi, createMockEventSource, createMockSSEProvider, createPreviewMediaResolver, createPreviewStore, createPreviewWebhookClient, mediaTypeOf, previewFileBase64, previewFileUrl, resolvePreviewFileSample, signPreviewPayload, startPreviewScript };
+export { type AppendMessageParams, ConversationPreview, type ConversationPreviewProps, type CreateMockConversationsApiParams, type CreateMockSSEProviderParams, type CreatePreviewStoreParams, type CreatePreviewWebhookClientParams, DEFAULT_PREVIEW_SCRIPT, GLOBAL_CHANNEL, type ListConversationsFilters, MEDIA_TYPES_CONVERSATION_ID, MediaTypesPreview, type MediaTypesPreviewProps, type MockEventSource, PREVIEW_CONVERSATIONS, PREVIEW_DOCUMENTS, PREVIEW_FILE_SAMPLES, PREVIEW_MESSAGES, type PreviewEmission, PreviewInProductionError, type PreviewScriptStep, type PreviewStore, type PreviewStoreListener, type PreviewUploadedMedia, type PreviewWebhookClient, PreviewWebhookRejectedError, type SendPreviewMediaParams, type SetModeParams, type StartPreviewScriptParams, assertPreviewEnvironment, conversationChannel, createMockConversationsApi, createMockEventSource, createMockSSEProvider, createPreviewMediaResolver, createPreviewStore, createPreviewWebhookClient, mediaTypeOf, previewFileBase64, previewFileUrl, resolvePreviewFileSample, signPreviewPayload, startPreviewScript };

package/dist/preview/index.js

@@ -1,12 +1,14 @@
 import {
+  AudioRecorderButton,
   ConversationDocumentsPanel,
   ConversationWallpaper,
   ConversationsProvider,
+  DEFAULT_AUDIO_RECORDER_BUTTON_LABELS,
   DateDivider,
   DocumentsLibrary,
   MessageBubble,
   MessageComposer
-} from "../chunk-3RKFU46R.js";
+} from "../chunk-SOWV4264.js";
 import "../chunk-2AYDBWNE.js";
 
 // src/preview/previewStore.ts
@@ -845,98 +847,8 @@ function createMockSSEProvider(params) {
 }
 
 // src/preview/ConversationPreview.tsx
-import { useCallback as useCallback2, useEffect, useMemo, useRef as useRef2, useState as useState2 } from "react";
-
-// src/preview/AudioRecorderButton.tsx
-import { useCallback, useRef, useState } from "react";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } 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."
-};
-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,
-  maxDurationMilliseconds = DEFAULT_MAX_RECORDING_MILLISECONDS,
-  labels,
-  disabled
-}) {
-  const startLabel = labels?.start ?? DEFAULT_AUDIO_RECORDER_BUTTON_LABELS.start;
-  const stopLabel = labels?.stop ?? DEFAULT_AUDIO_RECORDER_BUTTON_LABELS.stop;
-  const [isRecording, setIsRecording] = useState(false);
-  const recorderRef = useRef(null);
-  const autoStopRef = useRef(void 0);
-  const stop = useCallback(() => {
-    recorderRef.current?.stop();
-  }, []);
-  const start = useCallback(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 });
-        void onRecorded(
-          new File([blob], `audio-${Date.now()}.${format.extension}`, { type: format.uploadMimeType })
-        );
-      });
-      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);
-    }
-  }, [labels?.denied, labels?.unsupported, maxDurationMilliseconds, onFailure, onRecorded, onRecordingChange]);
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      type: "button",
-      disabled,
-      onClick: () => isRecording ? stop() : void start(),
-      title: isRecording ? stopLabel : startLabel,
-      "aria-label": isRecording ? stopLabel : startLabel,
-      "aria-pressed": isRecording,
-      className: `flex h-10 w-10 flex-shrink-0 items-center justify-center rounded-full transition-colors ${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__ */ jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx("rect", { x: "6", y: "6", width: "12", height: "12", rx: "2" }) }) : /* @__PURE__ */ jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", children: [
-        /* @__PURE__ */ jsx("path", { d: "M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3z" }),
-        /* @__PURE__ */ jsx("path", { d: "M19 11a7 7 0 0 1-14 0" }),
-        /* @__PURE__ */ jsx("line", { x1: "12", y1: "18", x2: "12", y2: "22" })
-      ] })
-    }
-  );
-}
-
-// src/preview/ConversationPreview.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function mediaTypeOf(mimeType) {
   if (mimeType.startsWith("image/")) return "image";
   if (mimeType.startsWith("video/")) return "video";
@@ -983,15 +895,15 @@ function ConversationPreview({
   pollIntervalMs,
   uploadMedia
 }) {
-  const [messages, setMessages] = useState2([]);
-  const [failure, setFailure] = useState2(void 0);
-  const [loadFailure, setLoadFailure] = useState2(void 0);
-  const [isRecording, setIsRecording] = useState2(false);
-  const [pendingLocal, setPendingLocal] = useState2([]);
-  const loadMessagesRef = useRef2(loadMessages);
-  const bottomRef = useRef2(null);
+  const [messages, setMessages] = useState([]);
+  const [failure, setFailure] = useState(void 0);
+  const [loadFailure, setLoadFailure] = useState(void 0);
+  const [isRecording, setIsRecording] = useState(false);
+  const [pendingLocal, setPendingLocal] = useState([]);
+  const loadMessagesRef = useRef(loadMessages);
+  const bottomRef = useRef(null);
   loadMessagesRef.current = loadMessages;
-  const refresh = useCallback2(async () => {
+  const refresh = useCallback(async () => {
     try {
       const loaded = await loadMessagesRef.current(conversationId);
       setMessages(loaded);
@@ -1084,11 +996,11 @@ function ConversationPreview({
       setFailure(error instanceof Error ? error.message : "Falha ao enviar o arquivo.");
     }
   }
-  return /* @__PURE__ */ jsxs2("div", { className: "flex h-full min-h-0 flex-col", children: [
-    /* @__PURE__ */ jsxs2(ConversationWallpaper, { className: "flex-1 min-h-0 overflow-y-auto px-4 py-3", children: [
-      rendered.map(({ message, isFirstInGroup, showDateDivider }) => /* @__PURE__ */ jsxs2("div", { children: [
-        showDateDivider ? /* @__PURE__ */ jsx2(DateDivider, { iso: message.timestamp }) : null,
-        /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full min-h-0 flex-col", children: [
+    /* @__PURE__ */ jsxs(ConversationWallpaper, { className: "flex-1 min-h-0 overflow-y-auto px-4 py-3", children: [
+      rendered.map(({ message, isFirstInGroup, showDateDivider }) => /* @__PURE__ */ jsxs("div", { children: [
+        showDateDivider ? /* @__PURE__ */ jsx(DateDivider, { iso: message.timestamp }) : null,
+        /* @__PURE__ */ jsx(
           MessageBubble,
           {
             message,
@@ -1098,17 +1010,17 @@ function ConversationPreview({
           }
         )
       ] }, message.id)),
-      /* @__PURE__ */ jsx2("div", { ref: bottomRef })
+      /* @__PURE__ */ jsx("div", { ref: bottomRef })
     ] }),
-    failure ? /* @__PURE__ */ jsx2("p", { role: "alert", className: "px-4 py-2 text-sm text-red-600 dark:text-red-400", children: failure }) : null,
-    loadFailure ? /* @__PURE__ */ jsx2("p", { role: "status", className: "px-4 py-2 text-sm text-amber-700 dark:text-amber-400", children: loadFailure }) : null,
-    /* @__PURE__ */ jsx2(
+    failure ? /* @__PURE__ */ jsx("p", { role: "alert", className: "px-4 py-2 text-sm text-red-600 dark:text-red-400", children: failure }) : null,
+    loadFailure ? /* @__PURE__ */ jsx("p", { role: "status", className: "px-4 py-2 text-sm text-amber-700 dark:text-amber-400", children: loadFailure }) : null,
+    /* @__PURE__ */ jsx(
       MessageComposer,
       {
         onSend: (text) => void handleSend(text),
         onAttach: uploadMedia ? (file) => void handleAttach(file) : void 0,
-        placeholder: isRecording ? "Gravando\u2026 toque no quadrado para enviar" : placeholder ?? "Escreva como o cliente\u2026",
-        idleAction: uploadMedia ? /* @__PURE__ */ jsx2(
+        placeholder: isRecording ? "Gravando\u2026 toque no quadrado para ouvir" : placeholder ?? "Escreva como o cliente\u2026",
+        idleAction: uploadMedia ? /* @__PURE__ */ jsx(
           AudioRecorderButton,
           {
             onRecorded: (file) => void handleAttach(file),
@@ -1218,7 +1130,7 @@ function startPreviewScript(params) {
 
 // src/preview/MediaTypesPreview.tsx
 import { useMemo as useMemo2 } from "react";
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var MEDIA_TYPES_CONVERSATION_ID = "5511944443333";
 function MediaTypesPreview({
   conversationId = MEDIA_TYPES_CONVERSATION_ID,
@@ -1233,26 +1145,26 @@ function MediaTypesPreview({
   const messages = PREVIEW_MESSAGES[conversationId] ?? [];
   const documents = PREVIEW_DOCUMENTS[conversationId] ?? [];
   const mimeTypes = [...new Set(documents.map((document) => document.mimeType))];
-  return /* @__PURE__ */ jsx3(ConversationsProvider, { api, sse, children: /* @__PURE__ */ jsxs3("div", { className, children: [
-    /* @__PURE__ */ jsxs3("header", { className: "border-b px-4 py-3 dark:border-gray-700", children: [
-      /* @__PURE__ */ jsx3("h1", { className: "text-lg font-semibold", children: "Teste manual de m\xEDdia" }),
-      /* @__PURE__ */ jsxs3("p", { className: "text-sm text-gray-500", children: [
+  return /* @__PURE__ */ jsx2(ConversationsProvider, { api, sse, children: /* @__PURE__ */ jsxs2("div", { className, children: [
+    /* @__PURE__ */ jsxs2("header", { className: "border-b px-4 py-3 dark:border-gray-700", children: [
+      /* @__PURE__ */ jsx2("h1", { className: "text-lg font-semibold", children: "Teste manual de m\xEDdia" }),
+      /* @__PURE__ */ jsxs2("p", { className: "text-sm text-gray-500", children: [
         documents.length,
         " arquivos, ",
         mimeTypes.length,
         " tipos. Clique no olho para abrir em aba nova e no bot\xE3o da bolha para carregar a m\xEDdia na thread \u2014 \xE9 o que teste automatizado n\xE3o v\xEA."
       ] })
     ] }),
-    /* @__PURE__ */ jsxs3("div", { className: "grid gap-4 p-4 lg:grid-cols-2", children: [
-      /* @__PURE__ */ jsxs3("section", { className: "space-y-3", children: [
-        /* @__PURE__ */ jsx3("h2", { className: "text-sm font-semibold uppercase tracking-wide text-gray-500", children: "Biblioteca da empresa" }),
-        /* @__PURE__ */ jsx3(DocumentsLibrary, { perPage: documents.length || 20 })
+    /* @__PURE__ */ jsxs2("div", { className: "grid gap-4 p-4 lg:grid-cols-2", children: [
+      /* @__PURE__ */ jsxs2("section", { className: "space-y-3", children: [
+        /* @__PURE__ */ jsx2("h2", { className: "text-sm font-semibold uppercase tracking-wide text-gray-500", children: "Biblioteca da empresa" }),
+        /* @__PURE__ */ jsx2(DocumentsLibrary, { perPage: documents.length || 20 })
       ] }),
-      /* @__PURE__ */ jsxs3("section", { className: "space-y-3", children: [
-        /* @__PURE__ */ jsx3("h2", { className: "text-sm font-semibold uppercase tracking-wide text-gray-500", children: "Painel da conversa" }),
-        /* @__PURE__ */ jsx3(ConversationDocumentsPanel, { conversationId, open: true, perPage: documents.length || 20 }),
-        /* @__PURE__ */ jsx3("h2", { className: "text-sm font-semibold uppercase tracking-wide text-gray-500", children: "Bolhas na thread" }),
-        /* @__PURE__ */ jsx3(ConversationWallpaper, { className: "max-h-[70vh] overflow-y-auto rounded-lg px-3 py-2", children: messages.map((message, index) => /* @__PURE__ */ jsx3(
+      /* @__PURE__ */ jsxs2("section", { className: "space-y-3", children: [
+        /* @__PURE__ */ jsx2("h2", { className: "text-sm font-semibold uppercase tracking-wide text-gray-500", children: "Painel da conversa" }),
+        /* @__PURE__ */ jsx2(ConversationDocumentsPanel, { conversationId, open: true, perPage: documents.length || 20 }),
+        /* @__PURE__ */ jsx2("h2", { className: "text-sm font-semibold uppercase tracking-wide text-gray-500", children: "Bolhas na thread" }),
+        /* @__PURE__ */ jsx2(ConversationWallpaper, { className: "max-h-[70vh] overflow-y-auto rounded-lg px-3 py-2", children: messages.map((message, index) => /* @__PURE__ */ jsx2(
           MessageBubble,
           {
             message,

package/dist/{types-B5C1DLu1.d.ts → types-O7kMP1Yn.d.ts}

@@ -104,6 +104,57 @@ interface MediaRendererProps {
 }
 declare function MediaRenderer({ message, onLightbox, onResolveUrl, className }: MediaRendererProps): react.JSX.Element | null;
 
+/**
+ * Gravação de áudio no simulador, pelo microfone do próprio navegador.
+ *
+ * Existe porque áudio é o formato que mais chega de cliente real e o que mais quebra fluxo: sem
+ * poder gravar aqui, testar o caminho de transcrição exigia mandar mensagem do celular de alguém.
+ *
+ * O arquivo gravado sai daqui como `File` e segue exatamente o mesmo caminho de um anexo — quem
+ * hospeda e devolve o `mediaId` é o host, via `uploadMedia`.
+ */
+interface AudioRecorderButtonLabels {
+    start: string;
+    stop: string;
+    unsupported: string;
+    denied: string;
+    review: string;
+    send: string;
+    discard: string;
+    empty: string;
+}
+declare const DEFAULT_AUDIO_RECORDER_BUTTON_LABELS: AudioRecorderButtonLabels;
+interface AudioRecorderButtonProps {
+    onRecorded: (file: File) => void | Promise<void>;
+    onFailure?: (message: string) => void;
+    /**
+     * Avisa quando a gravação começa e termina. O botão é um interruptor — o segundo toque é que
+     * envia — e sem um aviso fora dele o operador grava, não vê nada acontecer e desiste achando
+     * que o microfone está quebrado.
+     */
+    onRecordingChange?: (isRecording: boolean) => void;
+    /**
+     * Abre uma etapa de revisão quando a gravação para: o áudio toca ali mesmo e só sai depois de
+     * confirmado. Ligado por padrão — voz é o único anexo que quem envia não viu antes de mandar, e
+     * sem ouvir não há como saber se o microfone captou alguma coisa. Desligar volta ao envio direto.
+     */
+    reviewBeforeSend?: boolean;
+    /**
+     * Teto de duração da gravação, em milissegundos. Passado o tempo, o gravador para e envia o que
+     * tem. Produto com limite próprio sobrescreve.
+     */
+    maxDurationMilliseconds?: number;
+    labels?: Partial<AudioRecorderButtonLabels>;
+    disabled?: boolean;
+}
+/**
+ * Cinco minutos: com o codec de voz do WhatsApp isso dá menos de 3MB, folgado dentro do teto de
+ * 16MB que a Meta impõe a áudio, e é mais do que qualquer recado de cliente. O corte automático
+ * existe porque gravação esquecida aberta só se descobre no envio, com o arquivo inteiro perdido.
+ */
+declare const DEFAULT_MAX_RECORDING_MILLISECONDS: number;
+declare function AudioRecorderButton({ onRecorded, onFailure, onRecordingChange, reviewBeforeSend, maxDurationMilliseconds, labels, disabled, }: AudioRecorderButtonProps): react.JSX.Element;
+
 /**
  * Canal de origem da conversa e o que cada um permite.
  *
@@ -362,4 +413,4 @@ interface ConversationDocument {
     linkedAt: string;
 }
 
-export { type ResolveMediaUrl as A, capabilitiesOf as B, CHANNEL_CAPABILITIES as C, DEFAULT_CONVERSATION_CHANNEL as D, channelFiltersFor as E, type FormatContactHandleParams as F, contactFlag as G, HANDLE_KIND as H, type InteractiveOption as I, formatContactHandle as J, type ListConversationsParams as L, MediaRenderer as M, REOPEN_MECHANISM as R, type SSEProvider as S, CHANNEL_FILTER_ALL as a, CONVERSATION_CHANNEL as b, type ChannelCapabilities as c, type ChannelFilter as d, type ChannelFilterOption as e, type CompanyDocument as f, type CompanyDocumentPage as g, type ConversationChannel as h, type ConversationDocument as i, type ConversationDocumentPage as j, type ConversationEventSource as k, type ConversationPage as l, type ConversationSummary as m, type ConversationTemplate as n, type ConversationsApi as o, type ConversationsFeatures as p, type ConversationsTheme as q, type ConversationsUIConfig as r, type HandleKind as s, type InteractivePayload as t, type InteractiveSection as u, type InteractiveSelection as v, type ListDocumentsParams as w, type MediaRendererProps as x, type MessagePayload as y, type ReopenMechanism as z };
+export { AudioRecorderButton as A, type ListDocumentsParams as B, CHANNEL_CAPABILITIES as C, DEFAULT_AUDIO_RECORDER_BUTTON_LABELS as D, type MediaRendererProps as E, type FormatContactHandleParams as F, type MessagePayload as G, HANDLE_KIND as H, type InteractiveOption as I, type ReopenMechanism as J, type ResolveMediaUrl as K, type ListConversationsParams as L, MediaRenderer as M, capabilitiesOf as N, channelFiltersFor as O, contactFlag as P, formatContactHandle as Q, REOPEN_MECHANISM as R, type SSEProvider as S, type AudioRecorderButtonLabels as a, type AudioRecorderButtonProps as b, CHANNEL_FILTER_ALL as c, CONVERSATION_CHANNEL as d, type ChannelCapabilities as e, type ChannelFilter as f, type ChannelFilterOption as g, type CompanyDocument as h, type CompanyDocumentPage as i, type ConversationChannel as j, type ConversationDocument as k, type ConversationDocumentPage as l, type ConversationEventSource as m, type ConversationPage as n, type ConversationSummary as o, type ConversationTemplate as p, type ConversationsApi as q, type ConversationsFeatures as r, type ConversationsTheme as s, type ConversationsUIConfig as t, DEFAULT_CONVERSATION_CHANNEL as u, DEFAULT_MAX_RECORDING_MILLISECONDS as v, type HandleKind as w, type InteractivePayload as x, type InteractiveSection as y, type InteractiveSelection as z };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adatechnology/conversations-ui",
-  "version": "0.1.0-rc.12",
+  "version": "0.1.0-rc.14",
   "description": "WhatsApp conversation UI components — parametrizável por endpoint, tema e feature flags",
   "publishConfig": {
     "access": "public"

package/src/AudioRecorderButton.test.tsx

@@ -0,0 +1,30 @@
+import { describe, expect, it } from 'bun:test'
+import { renderToStaticMarkup } from 'react-dom/server'
+
+import { AudioRecorderButton, DEFAULT_AUDIO_RECORDER_BUTTON_LABELS } from './AudioRecorderButton'
+
+const noop = () => {}
+
+describe('AudioRecorderButton', () => {
+  it('começa oferecendo gravar, sem painel de revisão à vista', () => {
+    const markup = renderToStaticMarkup(<AudioRecorderButton onRecorded={noop} />)
+
+    expect(markup).toContain(`title="${DEFAULT_AUDIO_RECORDER_BUTTON_LABELS.start}"`)
+    expect(markup).not.toContain(`title="${DEFAULT_AUDIO_RECORDER_BUTTON_LABELS.send}"`)
+    expect(markup).not.toContain('<audio')
+  })
+
+  it('deixa o host trocar o texto de um rótulo sem perder os outros', () => {
+    const markup = renderToStaticMarkup(
+      <AudioRecorderButton onRecorded={noop} labels={{ start: 'Gravar recado' }} />,
+    )
+
+    expect(markup).toContain('title="Gravar recado"')
+  })
+
+  it('mantém a caixa de 40px do botão de enviar para a barra não pular', () => {
+    const markup = renderToStaticMarkup(<AudioRecorderButton onRecorded={noop} />)
+
+    expect(markup).toContain('h-10 w-10')
+  })
+})