@adatechnology/conversations-ui 0.1.0-rc.4 → 0.1.0-rc.6

package/dist/preview/index.js

@@ -1,9 +1,12 @@
 import {
+  ConversationDocumentsPanel,
   ConversationWallpaper,
+  ConversationsProvider,
   DateDivider,
+  DocumentsLibrary,
   MessageBubble,
   MessageComposer
-} from "../chunk-4R6Y43DQ.js";
+} from "../chunk-LITPZCWW.js";
 import "../chunk-OGRRHQQW.js";
 
 // src/preview/previewStore.ts
@@ -135,108 +138,6 @@ function createMockEventSource() {
   };
 }
 
-// src/preview/createMockConversationsApi.ts
-var PREVIEW_IMAGE_BASE64 = "iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNkYGD4DwABBAEAX+XyEgAAAABJRU5ErkJggg==";
-var DEFAULT_LATENCY_MS = 120;
-function createMockConversationsApi(params) {
-  const latencyMs = params.latencyMs ?? DEFAULT_LATENCY_MS;
-  async function withLatency(produce) {
-    await new Promise((resolve) => setTimeout(resolve, latencyMs));
-    return produce();
-  }
-  return {
-    fetchConversations(fetchParams) {
-      return withLatency(() => {
-        const conversations = params.store.listConversations({
-          waitingHuman: fetchParams?.waitingHuman,
-          search: fetchParams?.search
-        });
-        const limit = fetchParams?.limit ?? conversations.length;
-        const page = fetchParams?.page ?? 1;
-        return conversations.slice((page - 1) * limit, page * limit);
-      });
-    },
-    fetchMessages(conversationId, fetchParams) {
-      return withLatency(() => {
-        const messages = params.store.listMessages(conversationId);
-        const limit = fetchParams?.limit;
-        return limit ? messages.slice(-limit) : messages;
-      });
-    },
-    sendMessage(conversationId, text) {
-      return withLatency(
-        () => params.store.appendMessage({ conversationId, content: text, direction: "outbound", sender: "agent" })
-      );
-    },
-    sendMedia(conversationId, data) {
-      return withLatency(
-        () => params.store.appendMessage({
-          conversationId,
-          content: data.caption ?? data.filename,
-          direction: "outbound",
-          sender: "agent"
-        })
-      );
-    },
-    sendTemplate(conversationId, data) {
-      return withLatency(() => {
-        params.store.appendMessage({
-          conversationId,
-          content: `[template] ${data.templateName}`,
-          direction: "outbound",
-          sender: "agent"
-        });
-      });
-    },
-    markRead(conversationId) {
-      return withLatency(() => params.store.markRead(conversationId));
-    },
-    getContext(conversationId) {
-      return withLatency(() => {
-        const conversation = params.store.listConversations().find((item) => item.id === conversationId);
-        return {
-          currentState: conversation?.currentState ?? "unknown",
-          mode: conversation?.mode ?? "bot",
-          preview: true
-        };
-      });
-    },
-    getDocuments() {
-      return withLatency(() => []);
-    },
-    getDocumentUrl() {
-      return withLatency(() => `data:image/png;base64,${PREVIEW_IMAGE_BASE64}`);
-    },
-    getMediaProxyUrl() {
-      return withLatency(() => ({ mimeType: "image/png", data: PREVIEW_IMAGE_BASE64 }));
-    }
-  };
-}
-
-// src/preview/createMockSSEProvider.ts
-function createMockSSEProvider(params) {
-  function connect(channel) {
-    const source = createMockEventSource();
-    const unsubscribe = params.store.subscribe(channel, (emission) => {
-      source.emit(emission.event, emission.payload);
-    });
-    const close = source.close.bind(source);
-    source.close = () => {
-      unsubscribe();
-      close();
-    };
-    return source;
-  }
-  return {
-    connectConversationStream(conversationId) {
-      return connect(conversationChannel(conversationId));
-    },
-    connectGlobalStream() {
-      return connect(GLOBAL_CHANNEL);
-    }
-  };
-}
-
 // src/preview/previewFixtures.ts
 var BASE_DAY = "2026-07-26";
 function at(time) {
@@ -297,6 +198,24 @@ var PREVIEW_CONVERSATIONS = [
     waitingHuman: false,
     unread: 1,
     currentState: "list_import"
+  },
+  {
+    // Cobre TODO tipo que o composer aceita (DEFAULT_ACCEPTED_FILE_TYPES: image/*, video/*,
+    // audio/*, .pdf, .doc, .docx, .xls, .xlsx, .zip) mais sticker. Existe para que cada ramo do
+    // MediaRenderer e cada ícone/cor do FileIcon apareçam em algum lugar — ramo sem fixture é ramo
+    // que ninguém olha até quebrar em produção.
+    id: "5511944443333",
+    whatsappNumber: "5511944443333",
+    clientName: "Rita Documentos",
+    lastContent: "segue a planilha do pedido",
+    lastDirection: "inbound",
+    lastAt: at("15:10:00"),
+    lastInboundAt: at("15:10:00"),
+    mode: "human",
+    assignedUserId: "agent-1",
+    waitingHuman: false,
+    unread: 3,
+    currentState: "human_handling"
   }
 ];
 var PREVIEW_MESSAGES = {
@@ -375,8 +294,555 @@ var PREVIEW_MESSAGES = {
       sender: "customer",
       timestamp: at("13:31:00")
     }
+  ],
+  // Um tipo por mensagem, na ordem em que o MediaRenderer os trata.
+  "5511944443333": [
+    {
+      id: "fixture-doc-image",
+      type: "image",
+      mediaId: "preview-image-1",
+      mimeType: "image/png",
+      caption: "foto da prateleira",
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:00:00")
+    },
+    {
+      id: "fixture-doc-video",
+      type: "video",
+      mediaId: "preview-video-1",
+      mimeType: "video/mp4",
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:01:00")
+    },
+    {
+      id: "fixture-doc-audio",
+      type: "audio",
+      mediaId: "preview-audio-2",
+      mimeType: "audio/ogg",
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:02:00")
+    },
+    {
+      id: "fixture-doc-sticker",
+      type: "sticker",
+      mediaId: "preview-sticker-1",
+      mimeType: "image/webp",
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:03:00")
+    },
+    // Os cinco ramos do FileIcon: pdf, doc, xls, zip e o genérico do fallback.
+    {
+      id: "fixture-doc-pdf",
+      type: "document",
+      uploadId: "preview/documentos/nota-fiscal.pdf",
+      filename: "nota-fiscal.pdf",
+      mimeType: "application/pdf",
+      sizeBytes: 184320,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:04:00")
+    },
+    {
+      id: "fixture-doc-docx",
+      type: "document",
+      uploadId: "preview/documentos/contrato.docx",
+      filename: "contrato.docx",
+      mimeType: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
+      sizeBytes: 42112,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:05:00")
+    },
+    {
+      id: "fixture-doc-doc",
+      type: "document",
+      uploadId: "preview/documentos/procuracao.doc",
+      filename: "procuracao.doc",
+      mimeType: "application/msword",
+      sizeBytes: 31744,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:06:00")
+    },
+    {
+      id: "fixture-doc-xlsx",
+      type: "document",
+      uploadId: "preview/documentos/pedido.xlsx",
+      filename: "pedido.xlsx",
+      mimeType: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
+      sizeBytes: 15872,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:07:00")
+    },
+    {
+      id: "fixture-doc-xls",
+      type: "document",
+      uploadId: "preview/documentos/tabela-antiga.xls",
+      filename: "tabela-antiga.xls",
+      mimeType: "application/vnd.ms-excel",
+      sizeBytes: 9216,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:08:00")
+    },
+    {
+      id: "fixture-doc-zip",
+      type: "document",
+      uploadId: "preview/documentos/comprovantes.zip",
+      filename: "comprovantes.zip",
+      mimeType: "application/zip",
+      sizeBytes: 2355200,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:09:00")
+    },
+    {
+      id: "fixture-doc-txt",
+      type: "document",
+      uploadId: "preview/documentos/lista-compras.txt",
+      filename: "lista-compras.txt",
+      mimeType: "text/plain",
+      sizeBytes: 1024,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:10:00")
+    },
+    {
+      id: "fixture-doc-csv",
+      type: "document",
+      uploadId: "preview/documentos/planilha-do-pedido.csv",
+      filename: "planilha-do-pedido.csv",
+      mimeType: "text/csv",
+      sizeBytes: 2048,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:11:00")
+    },
+    {
+      id: "fixture-doc-pptx",
+      type: "document",
+      uploadId: "preview/documentos/apresentacao.pptx",
+      filename: "apresentacao.pptx",
+      mimeType: "application/vnd.openxmlformats-officedocument.presentationml.presentation",
+      sizeBytes: 512e3,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:12:00")
+    },
+    {
+      id: "fixture-doc-ppt",
+      type: "document",
+      uploadId: "preview/documentos/antiga.ppt",
+      filename: "antiga.ppt",
+      mimeType: "application/vnd.ms-powerpoint",
+      sizeBytes: 348160,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:13:00")
+    },
+    // Mídia enviada COMO arquivo: aí a Meta manda o nome, então é onde a extensão de música e de
+    // vídeo aparece na lista. Mandada como `image`/`audio`/`video` (acima e abaixo) ela chega sem
+    // nome nenhum, e o rótulo vira o id da mídia — como em produção.
+    {
+      id: "fixture-doc-mp3",
+      type: "document",
+      uploadId: "preview/documentos/musica-do-anuncio.mp3",
+      filename: "musica-do-anuncio.mp3",
+      mimeType: "audio/mpeg",
+      sizeBytes: 3145728,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:14:00")
+    },
+    {
+      id: "fixture-doc-m4a",
+      type: "document",
+      uploadId: "preview/documentos/recado.m4a",
+      filename: "recado.m4a",
+      mimeType: "audio/mp4",
+      sizeBytes: 486400,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:15:00")
+    },
+    {
+      id: "fixture-doc-mp4-file",
+      type: "document",
+      uploadId: "preview/documentos/video-do-produto.mp4",
+      filename: "video-do-produto.mp4",
+      mimeType: "video/mp4",
+      sizeBytes: 8388608,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:16:00")
+    },
+    {
+      id: "fixture-doc-jpg",
+      type: "document",
+      uploadId: "preview/documentos/foto-do-recibo.jpg",
+      filename: "foto-do-recibo.jpg",
+      mimeType: "image/jpeg",
+      sizeBytes: 262144,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:17:00")
+    },
+    // As espécies restantes que a Meta aceita, sem nome de arquivo — fecham a lista de tipos
+    // aceitos e exercitam o fallback de ícone pela família do mimeType.
+    {
+      id: "fixture-media-jpeg",
+      type: "image",
+      mediaId: "preview-image-jpeg",
+      mimeType: "image/jpeg",
+      sizeBytes: 138240,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:18:00")
+    },
+    {
+      id: "fixture-media-3gp",
+      type: "video",
+      mediaId: "preview-video-3gp",
+      mimeType: "video/3gp",
+      sizeBytes: 921600,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:19:00")
+    },
+    {
+      id: "fixture-media-aac",
+      type: "audio",
+      mediaId: "preview-audio-aac",
+      mimeType: "audio/aac",
+      sizeBytes: 76800,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:20:00")
+    },
+    {
+      id: "fixture-media-amr",
+      type: "audio",
+      mediaId: "preview-audio-amr",
+      mimeType: "audio/amr",
+      sizeBytes: 24576,
+      direction: "inbound",
+      sender: "customer",
+      timestamp: at("15:21:00")
+    }
   ]
 };
+var LIBRARY_MEDIA_TYPES = /* @__PURE__ */ new Set(["document", "image", "video", "audio", "sticker"]);
+var PREVIEW_DOCUMENTS = {
+  "5511944443333": (PREVIEW_MESSAGES["5511944443333"] ?? []).filter((message) => LIBRARY_MEDIA_TYPES.has(message.type)).map((message) => ({
+    // Mídia não tem `uploadId` na mensagem: o backend deriva a key do id da mídia na Meta, e o
+    // caminho abaixo imita esse formato para o download assinado receber algo do mesmo feitio.
+    id: message.uploadId ?? (message.mediaId ? `preview/inbound/${message.mediaId}` : message.id),
+    // Só documento chega nomeado. Para os outros o backend salva o id da mídia como rótulo —
+    // manter isso aqui é o que faz o ícone por família do mimeType ser exercitado de verdade.
+    filename: message.filename ?? message.mediaId ?? message.id,
+    mimeType: message.mimeType ?? "application/octet-stream",
+    sizeBytes: message.sizeBytes ?? 0,
+    source: message.sender,
+    linkedAt: message.timestamp
+  }))
+};
+
+// src/preview/previewFileSamples.ts
+var PREVIEW_FILE_SAMPLES = {
+  "application/pdf": "data:application/pdf;base64,JVBERi0xLjQKMSAwIG9iajw8L1R5cGUvQ2F0YWxvZy9QYWdlcyAyIDAgUj4+ZW5kb2JqCjIgMCBvYmo8PC9UeXBlL1BhZ2VzL0tpZHNbMyAwIFJdL0NvdW50IDE+PmVuZG9iagozIDAgb2JqPDwvVHlwZS9QYWdlL1BhcmVudCAyIDAgUi9NZWRpYUJveFswIDAgMjYwIDExMF0vQ29udGVudHMgNCAwIFIvUmVzb3VyY2VzPDwvRm9udDw8L0YxIDUgMCBSPj4+Pj4+ZW5kb2JqCjQgMCBvYmo8PC9MZW5ndGggNjI+PnN0cmVhbQpCVCAvRjEgMTMgVGYgMTggNTUgVGQgKERvY3VtZW50byBkZSBleGVtcGxvIGRvIHByZXZpZXcpIFRqIEVUCmVuZHN0cmVhbWVuZG9iago1IDAgb2JqPDwvVHlwZS9Gb250L1N1YnR5cGUvVHlwZTEvQmFzZUZvbnQvSGVsdmV0aWNhPj5lbmRvYmoKeHJlZgowIDYKMDAwMDAwMDAwMCA2NTUzNSBmIAowMDAwMDAwMDA5IDAwMDAwIG4gCjAwMDAwMDAwNTIgMDAwMDAgbiAKMDAwMDAwMDEwMSAwMDAwMCBuIAowMDAwMDAwMjExIDAwMDAwIG4gCjAwMDAwMDAzMTcgMDAwMDAgbiAKdHJhaWxlcjw8L1NpemUgNi9Sb290IDEgMCBSPj4Kc3RhcnR4cmVmCjM3OAolJUVPRgo=",
+  "image/png": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAIAAADYYG7QAAAACXBIWXMAAAABAAAAAQBPJcTWAAAATElEQVR4nO3OMRHAIAAAMbhDWo2hCYPdu/xIh0RB5rPP+JN1O/AlVISKUBEqQkWoCBWhIlSEilARKkJFqAgVoSJUhIpQESpCRagIlRcgDwI25HmPQAAAAABJRU5ErkJggg==",
+  "image/jpeg": "data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAAQABAAD//gAQTGF2YzYyLjExLjEwMAD/2wBDAAgEBAQEBAUFBQUFBQYGBgYGBgYGBgYGBgYHBwcICAgHBwcGBgcHCAgICAkJCQgICAgJCQoKCgwMCwsODg4RERT/xABMAAEBAAAAAAAAAAAAAAAAAAAABAEBAQAAAAAAAAAAAAAAAAAAAAYQAQAAAAAAAAAAAAAAAAAAAAARAQAAAAAAAAAAAAAAAAAAAAD/wAARCAAwADADASIAAhEAAxEA/9oADAMBAAIRAxEAPwCUBRpwAAAAAAAAAAAAAAAB/9k=",
+  "image/webp": "data:image/webp;base64,UklGRhoAAABXRUJQVlA4TA0AAAAvAAAAEAcQERGIiP4HAA==",
+  "video/mp4": "data:video/mp4;base64,AAAAIGZ0eXBpc29tAAACAGlzb21pc28yYXZjMW1wNDEAAANdbW9vdgAAAGxtdmhkAAAAAAAAAAAAAAAAAAAD6AAAASwAAQAAAQAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAgAAAoh0cmFrAAAAXHRraGQAAAADAAAAAAAAAAAAAAABAAAAAAAAASwAAAAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAABAAAAAAEAAAABAAAAAAAAkZWR0cwAAABxlbHN0AAAAAAAAAAEAAAEsAAAIAAABAAAAAAIAbWRpYQAAACBtZGhkAAAAAAAAAAAAAAAAAAAoAAAAEABVxAAAAAAALWhkbHIAAAAAAAAAAHZpZGUAAAAAAAAAAAAAAABWaWRlb0hhbmRsZXIAAAABq21pbmYAAAAUdm1oZAAAAAEAAAAAAAAAAAAAACRkaW5mAAAAHGRyZWYAAAAAAAAAAQAAAAx1cmwgAAAAAQAAAWtzdGJsAAAAv3N0c2QAAAAAAAAAAQAAAK9hdmMxAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAAAAEAAQABIAAAASAAAAAAAAAABFUxhdmM2Mi4xMS4xMDAgbGlieDI2NAAAAAAAAAAAAAAAGP//AAAANWF2Y0MBZAAK/+EAGGdkAAqs2UQmwEQAAAMABAAAAwBQPEiWWAEABmjr48siwP34+AAAAAAQcGFzcAAAAAEAAAABAAAAFGJ0cnQAAAAAAABO2gAAAAAAAAAYc3R0cwAAAAAAAAABAAAAAwAABAAAAAAUc3RzcwAAAAAAAAABAAAAAQAAAChjdHRzAAAAAAAAAAMAAAABAAAIAAAAAAEAAAwAAAAAAQAABAAAAAAcc3RzYwAAAAAAAAABAAAAAQAAAAMAAAABAAAAIHN0c3oAAAAAAAAAAAAAAAMAAALbAAAADgAAAAwAAAAUc3RjbwAAAAAAAAABAAADjQAAAGF1ZHRhAAAAWW1ldGEAAAAAAAAAIWhkbHIAAAAAAAAAAG1kaXJhcHBsAAAAAAAAAAAAAAAALGlsc3QAAAAkqXRvbwAAABxkYXRhAAAAAQAAAABMYXZmNjIuMy4xMDAAAAAIZnJlZQAAAv1tZGF0AAACrgYF//+q3EXpvebZSLeWLNgg2SPu73gyNjQgLSBjb3JlIDE2NSByMzIyMiBiMzU2MDVhIC0gSC4yNjQvTVBFRy00IEFWQyBjb2RlYyAtIENvcHlsZWZ0IDIwMDMtMjAyNSAtIGh0dHA6Ly93d3cudmlkZW9sYW4ub3JnL3gyNjQuaHRtbCAtIG9wdGlvbnM6IGNhYmFjPTEgcmVmPTMgZGVibG9jaz0xOjA6MCBhbmFseXNlPTB4MzoweDExMyBtZT1oZXggc3VibWU9NyBwc3k9MSBwc3lfcmQ9MS4wMDowLjAwIG1peGVkX3JlZj0xIG1lX3JhbmdlPTE2IGNocm9tYV9tZT0xIHRyZWxsaXM9MSA4eDhkY3Q9MSBjcW09MCBkZWFkem9uZT0yMSwxMSBmYXN0X3Bza2lwPTEgY2hyb21hX3FwX29mZnNldD0tMiB0aHJlYWRzPTIgbG9va2FoZWFkX3RocmVhZHM9MSBzbGljZWRfdGhyZWFkcz0wIG5yPTAgZGVjaW1hdGU9MSBpbnRlcmxhY2VkPTAgYmx1cmF5X2NvbXBhdD0wIGNvbnN0cmFpbmVkX2ludHJhPTAgYmZyYW1lcz0zIGJfcHlyYW1pZD0yIGJfYWRhcHQ9MSBiX2JpYXM9MCBkaXJlY3Q9MSB3ZWlnaHRiPTEgb3Blbl9nb3A9MCB3ZWlnaHRwPTIga2V5aW50PTI1MCBrZXlpbnRfbWluPTEwIHNjZW5lY3V0PTQwIGludHJhX3JlZnJlc2g9MCByY19sb29rYWhlYWQ9NDAgcmM9Y3JmIG1idHJlZT0xIGNyZj0yMy4wIHFjb21wPTAuNjAgcXBtaW49MCBxcG1heD02OSBxcHN0ZXA9NCBpcF9yYXRpbz0xLjQwIGFxPTE6MS4wMACAAAAAJWWIhAA///7mdfgUoKykhh+DdK6xVynnAWznTQ4fVSgMZ1FwY28AAAAKQZoibEN//qePiAAAAAgBnkF5Df8HfQ==",
+  "audio/mpeg": "data:audio/mpeg;base64,SUQzBAAAAAAAIlRTU0UAAAAOAAADTGF2ZjYyLjMuMTAwAAAAAAAAAAAAAAD/40jAAAAAAAAAAAAASW5mbwAAAA8AAAAFAAAGwABVVVVVVVVVVVVVVVVVVVVVVVVVgICAgICAgICAgICAgICAgICAgICqqqqqqqqqqqqqqqqqqqqqqqqqqtXV1dXV1dXV1dXV1dXV1dXV1dXV//////////////////////////8AAAAATGF2YzYyLjExAAAAAAAAAAAAAAAAJALAAAAAAAAABsDR4nNFAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD/40jEAAAAA0gAAAAATEFNRTMuMTAwVVVVVVVVVVVVVVVMQU1FMy4xMDBVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVX/40jEAAAAA0gAAAAATEFNRTMuMTAwVVVVVVVVVVVVVVVMQU1FMy4xMDBVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVX/40jEAAAAA0gAAAAATEFNRTMuMTAwVVVVVVVVVVVVVVVMQU1FMy4xMDBVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVX/40jEAAAAA0gAAAAATEFNRTMuMTAwVVVVVVVVVVVVVVVMQU1FMy4xMDBVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVX/40jEAAAAA0gAAAAATEFNRTMuMTAwVVVVVVVVVVVVVVVMQU1FMy4xMDBVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVVU=",
+  "audio/ogg": "data:audio/ogg;base64,T2dnUwACAAAAAAAAAABXDTmmAAAAAKMnDKEBE09wdXNIZWFkAQE4AYC7AAAAAABPZ2dTAAAAAAAAAAAAAFcNOaYBAAAAZlPuKwE9T3B1c1RhZ3MMAAAATGF2ZjYyLjMuMTAwAQAAAB0AAABlbmNvZGVyPUxhdmM2Mi4xMS4xMDAgbGlib3B1c09nZ1MABLgmAAAAAAAAVw05pgIAAAA3uL6lCw8REhISEhISEhISeAvkwTbsxY2MSUaZpCaweAfJcifhROpV8fDA1d3pUmB4B8l5yMlXwKISI/rvZ/NkwOB4B8l5yMlXwKISI/rvZ/NkwOB4B8l5yMlXwKISI/rvZ/NkwOB4B8l5yMlXwKISI/rvZ/NkwOB4B8l5yMlXwKISI/rvZ/NkwOB4B8l5yMlXwKISI/rvZ/NkwOB4B8l5yMlXwKISI/rvZ/NkwOB4B8l5yMlXwKISI/rvZ/NkwOB4B8l5yMlXwKISI/rvZ/NkwOA=",
+  "audio/mp4": "data:audio/mp4;base64,AAAAHGZ0eXBNNEEgAAACAE00QSBpc29taXNvMgAAAAhmcmVlAAAAQW1kYXTeAgBMYXZjNjIuMTEuMTAwAAIwQA4BGCAHARggBwEYIAcBGCAHARggBwEYIAcBGCAHARggBwEYIAcAAAMibW9vdgAAAGxtdmhkAAAAAAAAAAAAAAAAAAAD6AAAAMgAAQAAAQAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAgAAAk10cmFrAAAAXHRraGQAAAADAAAAAAAAAAAAAAABAAAAAAAAAMgAAAAAAAAAAAAAAAEBAAAAAAEAAAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAABAAAAAAAAAAAAAAAAAAAAkZWR0cwAAABxlbHN0AAAAAAAAAAEAAADIAAAEAAABAAAAAAHFbWRpYQAAACBtZGhkAAAAAAAAAAAAAAAAAACsRAAAJnRVxAAAAAAALWhkbHIAAAAAAAAAAHNvdW4AAAAAAAAAAAAAAABTb3VuZEhhbmRsZXIAAAABcG1pbmYAAAAQc21oZAAAAAAAAAAAAAAAJGRpbmYAAAAcZHJlZgAAAAAAAAABAAAADHVybCAAAAABAAABNHN0YmwAAABqc3RzZAAAAAAAAAABAAAAWm1wNGEAAAAAAAAAAQAAAAAAAAAAAAEAEAAAAACsRAAAAAAANmVzZHMAAAAAA4CAgCUAAQAEgICAF0AVAAAAAAB9AAAAB/oFgICABRIIVuUABoCAgAECAAAAIHN0dHMAAAAAAAAAAgAAAAkAAAQAAAAAAQAAAnQAAAAcc3RzYwAAAAAAAAABAAAAAQAAAAoAAAABAAAAPHN0c3oAAAAAAAAAAAAAAAoAAAAVAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAAFHN0Y28AAAAAAAAAAQAAACwAAAAac2dwZAEAAAByb2xsAAAAAgAAAAH//wAAABxzYmdwAAAAAHJvbGwAAAABAAAACgAAAAEAAABhdWR0YQAAAFltZXRhAAAAAAAAACFoZGxyAAAAAAAAAABtZGlyYXBwbAAAAAAAAAAAAAAAACxpbHN0AAAAJKl0b28AAAAcZGF0YQAAAAEAAAAATGF2ZjYyLjMuMTAw",
+  "audio/aac": "data:audio/aac;base64,//FQQAOf/N4CAExhdmM2Mi4xMS4xMDAAAjBADv/xUEABf/wBGCAH//FQQAF//AEYIAf/8VBAAX/8ARggB//xUEABf/wBGCAH//FQQAF//AEYIAf/8VBAAX/8ARggB//xUEABf/wBGCAH//FQQAF//AEYIAf/8VBAAX/8ARggBw==",
+  "text/plain": "data:text/plain;base64,TGlzdGEgZGUgY29tcHJhcwotIGFycm96IDJrZwotIG9sZW8gMXVuCg==",
+  "text/csv": "data:text/csv;base64,cHJvZHV0byxxdWFudGlkYWRlLHByZWNvCmFycm96LDIsMjQuOTAKb2xlbywxLDcuNTAK",
+  "application/zip": "data:application/zip;base64,UEsDBBQAAAAIANFO/FwtmGOxGwAAABkAAAARAAAAY29tcHJvdmFudGUtMS50eHRLzs8tKMovS8wrSVVISVUoSExPzE3NK8nnAgBQSwMEFAAAAAgA0U78XCftV8YWAAAAFAAAABEAAABjb21wcm92YW50ZS0yLnR4dCtOTS/NS8lXSM7PLSjKL0vMK0nlAgBQSwECFAMUAAAACADRTvxcLZhjsRsAAAAZAAAAEQAAAAAAAAAAAAAAgAEAAAAAY29tcHJvdmFudGUtMS50eHRQSwECFAMUAAAACADRTvxcJ+1XxhYAAAAUAAAAEQAAAAAAAAAAAAAAgAFKAAAAY29tcHJvdmFudGUtMi50eHRQSwUGAAAAAAIAAgB+AAAAjwAAAAAA",
+  "application/vnd.openxmlformats-officedocument.wordprocessingml.document": "data:application/vnd.openxmlformats-officedocument.wordprocessingml.document;base64,UEsDBBQAAAAIANFO/Fx5bjPX6AAAAK0BAAATAAAAW0NvbnRlbnRfVHlwZXNdLnhtbH1QyU7DMBD9FWuuKHHggBCK0wPLETiUDxjZk8SqN3nc0v49Tlt6QIXjzFv1+tXeO7GjzDYGBbdtB4KCjsaGScHn+rV5AMEFg0EXAyk4EMNq6NeHRCyqNrCCuZT0KCXrmTxyGxOFiowxeyz1zJNMqDc4kbzrunupYygUSlMWDxj6Zxpx64p42df3qUcmxyCeTsQlSwGm5KzGUnG5C+ZXSnNOaKvyyOHZJr6pBJBXExbk74Cz7r0Ok60h8YG5vKGvLPkVs5Em6q2vyvZ/mys94zhaTRf94pZy1MRcF/euvSAebfjpL49zD99QSwMEFAAAAAgA0U78XJv9N+qtAAAAKQEAAAsAAABfcmVscy8ucmVsc43POw7CMAwG4KtE3mlaBoRQ0y4IqSsqB7ASN61oHkrCo7cnAwNFDIy2f3+W6/ZpZnanECdnBVRFCYysdGqyWsClP232wGJCq3B2lgQsFKFt6jPNmPJKHCcfWTZsFDCm5A+cRzmSwVg4TzZPBhcMplwGzT3KK2ri27Lc8fBpwNpknRIQOlUB6xdP/9huGCZJRydvhmz6ceIrkWUMmpKAhwuKq3e7yCzwpuarF5sXUEsDBBQAAAAIANFO/FyraIuoqgAAAOcAAAARAAAAd29yZC9kb2N1bWVudC54bWxFjksOwjAMBa8SZU9TWCBUNWWBxAngAKExbaTGjpzQz+1JyoLNPFt+Grm9rn4SM3B0hFoeq1oKwJ6sw0HL5+N+uEgRk0FrJkLQcoMor127NJb6jwdMIgswNouWY0qhUSr2I3gTKwqA+fYm9ibllQe1ENvA1EOM2e8ndarrs/LGoSzKF9mtZCjggtTdCBObRMKCgBV8mPJIIjDMDpZWlU4h7ww7fx71/7H7AlBLAQIUAxQAAAAIANFO/Fx5bjPX6AAAAK0BAAATAAAAAAAAAAAAAACAAQAAAABbQ29udGVudF9UeXBlc10ueG1sUEsBAhQDFAAAAAgA0U78XJv9N+qtAAAAKQEAAAsAAAAAAAAAAAAAAIABGQEAAF9yZWxzLy5yZWxzUEsBAhQDFAAAAAgA0U78XKtoi6iqAAAA5wAAABEAAAAAAAAAAAAAAIAB7wEAAHdvcmQvZG9jdW1lbnQueG1sUEsFBgAAAAADAAMAuQAAAMgCAAAAAA==",
+  "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": "data:application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;base64,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"
+};
+var FAMILY_FALLBACK = {
+  image: "image/png",
+  video: "video/mp4",
+  audio: "audio/mpeg",
+  text: "text/plain"
+};
+function resolvePreviewFileSample(mimeType, filename) {
+  const normalized = (mimeType ?? "").split(";")[0].trim().toLowerCase();
+  const exact = PREVIEW_FILE_SAMPLES[normalized];
+  if (exact) return exact;
+  const family = FAMILY_FALLBACK[normalized.split("/")[0] ?? ""];
+  const byFamily = family ? PREVIEW_FILE_SAMPLES[family] : void 0;
+  if (byFamily) return byFamily;
+  const note = `Preview do SDK: nao existe amostra binaria valida para ${normalized || "tipo desconhecido"}${filename ? ` (${filename})` : ""}. Na tela real este arquivo vem do storage.`;
+  return `data:text/plain;charset=utf-8,${encodeURIComponent(note)}`;
+}
+
+// src/preview/previewMediaSource.ts
+var blobUrlCache = /* @__PURE__ */ new Map();
+function toBlob(dataUrl) {
+  const [head, payload] = dataUrl.split(",");
+  const mimeType = head.replace(/^data:/, "").replace(/;base64$/, "").replace(/;charset=.*$/, "");
+  if (!head.endsWith(";base64")) {
+    return new Blob([decodeURIComponent(payload)], { type: mimeType || "text/plain" });
+  }
+  const binary = atob(payload);
+  const bytes = new Uint8Array(binary.length);
+  for (let index = 0; index < binary.length; index += 1) bytes[index] = binary.charCodeAt(index);
+  return new Blob([bytes], { type: mimeType });
+}
+function previewFileUrl(mimeType, filename) {
+  const dataUrl = resolvePreviewFileSample(mimeType, filename);
+  if (typeof URL === "undefined" || typeof URL.createObjectURL !== "function") return dataUrl;
+  const cached = blobUrlCache.get(dataUrl);
+  if (cached) return cached;
+  const blobUrl = URL.createObjectURL(toBlob(dataUrl));
+  blobUrlCache.set(dataUrl, blobUrl);
+  return blobUrl;
+}
+function previewFileBase64(mimeType, filename) {
+  const dataUrl = resolvePreviewFileSample(mimeType, filename);
+  const [head, payload] = dataUrl.split(",");
+  const declared = head.replace(/^data:/, "").replace(/;base64$/, "").replace(/;charset=.*$/, "");
+  if (head.endsWith(";base64")) return { mimeType: declared, data: payload };
+  return { mimeType: declared, data: btoa(decodeURIComponent(payload)) };
+}
+function createPreviewMediaResolver() {
+  const byId = /* @__PURE__ */ new Map();
+  for (const documents of Object.values(PREVIEW_DOCUMENTS)) {
+    for (const document of documents) {
+      byId.set(document.id, { mimeType: document.mimeType, filename: document.filename });
+    }
+  }
+  return async (message) => {
+    const reference = message.uploadId ?? (message.mediaId ? `preview/inbound/${message.mediaId}` : void 0);
+    if (!reference) return null;
+    const known = byId.get(reference);
+    return previewFileUrl(known?.mimeType ?? message.mimeType, known?.filename ?? message.filename);
+  };
+}
+
+// src/preview/createMockConversationsApi.ts
+var DEFAULT_LATENCY_MS = 120;
+var PREVIEW_AGENT_ID = "preview-agent";
+var PREVIEW_TEMPLATES = [
+  { name: "retomada_atendimento", language: "pt_BR", status: "APPROVED", category: "UTILITY" },
+  { name: "lembrete_documentos", language: "pt_BR", status: "APPROVED", category: "UTILITY" },
+  { name: "promocao_taxa", language: "pt_BR", status: "PENDING", category: "MARKETING" }
+];
+function createMockConversationsApi(params) {
+  const latencyMs = params.latencyMs ?? DEFAULT_LATENCY_MS;
+  async function withLatency(produce) {
+    await new Promise((resolve) => setTimeout(resolve, latencyMs));
+    return produce();
+  }
+  return {
+    // Devolve a forma paginada, não o array puro: é a que o contrato passou a oferecer e a que
+    // permite o preview desenhar controles de página. O total é contado ANTES do corte — depois
+    // dele seria sempre o tamanho da página, e a paginação nunca sairia da primeira.
+    fetchConversations(fetchParams) {
+      return withLatency(() => {
+        const conversations = params.store.listConversations({
+          waitingHuman: fetchParams?.waitingHuman,
+          search: fetchParams?.search
+        });
+        const limit = fetchParams?.limit ?? conversations.length;
+        const page = fetchParams?.page ?? 1;
+        return {
+          conversations: conversations.slice((page - 1) * limit, page * limit),
+          total: conversations.length
+        };
+      });
+    },
+    fetchMessages(conversationId, fetchParams) {
+      return withLatency(() => {
+        const messages = params.store.listMessages(conversationId);
+        const limit = fetchParams?.limit;
+        return limit ? messages.slice(-limit) : messages;
+      });
+    },
+    sendMessage(conversationId, text) {
+      return withLatency(
+        () => params.store.appendMessage({ conversationId, content: text, direction: "outbound", sender: "agent" })
+      );
+    },
+    sendMedia(conversationId, data) {
+      return withLatency(
+        () => params.store.appendMessage({
+          conversationId,
+          content: data.caption ?? data.filename,
+          direction: "outbound",
+          sender: "agent"
+        })
+      );
+    },
+    sendTemplate(conversationId, data) {
+      return withLatency(() => {
+        params.store.appendMessage({
+          conversationId,
+          // Sem nome, o host está pedindo o template padrão do backend — o mock representa isso
+          // pelo que o atendente veria, não por um nome inventado.
+          content: `[template] ${data.templateName ?? PREVIEW_TEMPLATES[0]?.name ?? "padrao"}`,
+          direction: "outbound",
+          sender: "agent"
+        });
+      });
+    },
+    markRead(conversationId) {
+      return withLatency(() => params.store.markRead(conversationId));
+    },
+    getContext(conversationId) {
+      return withLatency(() => {
+        const conversation = params.store.listConversations().find((item) => item.id === conversationId);
+        return {
+          currentState: conversation?.currentState ?? "unknown",
+          mode: conversation?.mode ?? "bot",
+          preview: true
+        };
+      });
+    },
+    /**
+     * Espelha o backend em busca, filtro de origem, ordenação E paginação. Mock que ignora params
+     * faz o painel parecer quebrado aqui e, pior, esconde o caso em que o backend também os ignora
+     * — foi exatamente assim que o filtro de origem passou a existir só no contrato.
+     */
+    getDocuments(conversationId, documentParams) {
+      return withLatency(() => {
+        let documents = [...PREVIEW_DOCUMENTS[conversationId] ?? []];
+        const search = documentParams?.search?.trim().toLowerCase();
+        if (search) {
+          documents = documents.filter((document) => document.filename.toLowerCase().includes(search));
+        }
+        const source = documentParams?.source;
+        if (source === "team") {
+          documents = documents.filter((document) => document.source === "agent" || document.source === "bot");
+        } else if (source) {
+          documents = documents.filter((document) => document.source === source);
+        }
+        documents.sort(
+          (left, right) => documentParams?.sortDirection === "asc" ? left.linkedAt.localeCompare(right.linkedAt) : right.linkedAt.localeCompare(left.linkedAt)
+        );
+        const total = documents.length;
+        const limit = documentParams?.limit ?? total;
+        const page = documentParams?.page ?? 1;
+        return { documents: documents.slice((page - 1) * limit, page * limit), total };
+      });
+    },
+    /**
+     * Zip de mentira: um texto listando o que entraria. Basta para exercitar seleção, botão e o
+     * caminho de download no preview, sem arrastar uma lib de compactação para o pacote.
+     */
+    downloadDocumentsArchive(conversationId, uploadIds) {
+      return withLatency(() => {
+        const known = PREVIEW_DOCUMENTS[conversationId] ?? [];
+        const names = uploadIds.map((id) => known.find((document) => document.id === id)?.filename ?? id);
+        return new Blob([`preview: ${names.length} arquivo(s)
+${names.join("\n")}`], { type: "application/zip" });
+      });
+    },
+    /** Junta as bibliotecas de todas as conversas do fixture, com a origem de cada arquivo. */
+    getAllDocuments(documentParams) {
+      return withLatency(() => {
+        let all = Object.entries(PREVIEW_DOCUMENTS).flatMap(
+          ([conversationId, docs]) => docs.map((document) => ({ ...document, conversationId }))
+        );
+        const search = documentParams?.search?.trim().toLowerCase();
+        if (search) {
+          const digits = search.replace(/\D/g, "");
+          all = all.filter(
+            (document) => document.filename.toLowerCase().includes(search) || digits !== "" && document.conversationId.includes(digits)
+          );
+        }
+        const source = documentParams?.source;
+        if (source === "team") {
+          all = all.filter((document) => document.source === "agent" || document.source === "bot");
+        } else if (source) {
+          all = all.filter((document) => document.source === source);
+        }
+        all.sort(
+          (left, right) => documentParams?.sortDirection === "asc" ? left.linkedAt.localeCompare(right.linkedAt) : right.linkedAt.localeCompare(left.linkedAt)
+        );
+        const total = all.length;
+        const limit = documentParams?.limit ?? total;
+        const page = documentParams?.page ?? 1;
+        return { documents: all.slice((page - 1) * limit, page * limit), total };
+      });
+    },
+    // Devolve os bytes DO TIPO do documento, não uma imagem para tudo: antes, abrir um PDF entregava
+    // um PNG rotulado `application/pdf` e o leitor recusava o arquivo. O `uploadId` é a única pista
+    // que o contrato dá, então o tipo vem da própria biblioteca.
+    getDocumentUrl(uploadId) {
+      return withLatency(() => {
+        const found = Object.values(PREVIEW_DOCUMENTS).flat().find((document) => document.id === uploadId);
+        return previewFileUrl(found?.mimeType, found?.filename);
+      });
+    },
+    // Caminho da mídia ainda não ingerida: o backend busca na Meta e devolve base64. Resolve pelo
+    // id para a bolha receber os bytes DO TIPO dela — devolvendo um PNG para todo id, vídeo e áudio
+    // apareciam quebrados na thread mesmo havendo amostra válida do formato.
+    getMediaProxyUrl(mediaId) {
+      return withLatency(() => {
+        const found = Object.values(PREVIEW_DOCUMENTS).flat().find((document) => document.id === `preview/inbound/${mediaId}`);
+        return previewFileBase64(found?.mimeType, found?.filename);
+      });
+    },
+    takeover(conversationId) {
+      return withLatency(
+        () => params.store.setMode({ conversationId, mode: "human", assignedUserId: PREVIEW_AGENT_ID })
+      );
+    },
+    release(conversationId) {
+      return withLatency(() => params.store.setMode({ conversationId, mode: "bot" }));
+    },
+    // Encerrar devolve ao bot como o release, e é de propósito: a diferença entre os dois é a
+    // despedida, que o host manda antes de chamar aqui. O mock não a inventa.
+    finalize(conversationId) {
+      return withLatency(() => params.store.setMode({ conversationId, mode: "bot" }));
+    },
+    markAllRead() {
+      return withLatency(() => {
+        for (const conversation of params.store.listConversations()) {
+          params.store.markRead(conversation.id);
+        }
+      });
+    },
+    listTemplates() {
+      return withLatency(() => [...PREVIEW_TEMPLATES]);
+    }
+  };
+}
+
+// src/preview/createMockSSEProvider.ts
+function createMockSSEProvider(params) {
+  function connect(channel) {
+    const source = createMockEventSource();
+    const unsubscribe = params.store.subscribe(channel, (emission) => {
+      source.emit(emission.event, emission.payload);
+    });
+    const close = source.close.bind(source);
+    source.close = () => {
+      unsubscribe();
+      close();
+    };
+    return source;
+  }
+  return {
+    connectConversationStream(conversationId) {
+      return connect(conversationChannel(conversationId));
+    },
+    connectGlobalStream() {
+      return connect(GLOBAL_CHANNEL);
+    }
+  };
+}
 
 // src/preview/ConversationPreview.tsx
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
@@ -557,11 +1023,65 @@ function startPreviewScript(params) {
   }, intervalMs);
   return () => clearInterval(timer);
 }
+
+// src/preview/MediaTypesPreview.tsx
+import { useMemo as useMemo2 } from "react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var MEDIA_TYPES_CONVERSATION_ID = "5511944443333";
+function MediaTypesPreview({
+  conversationId = MEDIA_TYPES_CONVERSATION_ID,
+  className
+}) {
+  const store = useMemo2(
+    () => createPreviewStore({ conversations: PREVIEW_CONVERSATIONS, messages: PREVIEW_MESSAGES }),
+    []
+  );
+  const api = useMemo2(() => createMockConversationsApi({ store }), [store]);
+  const sse = useMemo2(() => createMockSSEProvider({ store }), [store]);
+  const messages = PREVIEW_MESSAGES[conversationId] ?? [];
+  const documents = PREVIEW_DOCUMENTS[conversationId] ?? [];
+  const mimeTypes = [...new Set(documents.map((document) => document.mimeType))];
+  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__ */ 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__ */ 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,
+            isMine: message.direction === "outbound",
+            isFirstInGroup: index === 0 || messages[index - 1]?.sender !== message.sender
+          },
+          message.id
+        )) })
+      ] })
+    ] })
+  ] }) });
+}
 export {
   ConversationPreview,
   DEFAULT_PREVIEW_SCRIPT,
   GLOBAL_CHANNEL,
+  MEDIA_TYPES_CONVERSATION_ID,
+  MediaTypesPreview,
   PREVIEW_CONVERSATIONS,
+  PREVIEW_DOCUMENTS,
+  PREVIEW_FILE_SAMPLES,
   PREVIEW_MESSAGES,
   PreviewInProductionError,
   PreviewWebhookRejectedError,
@@ -570,7 +1090,11 @@ export {
   createMockConversationsApi,
   createMockEventSource,
   createMockSSEProvider,
+  createPreviewMediaResolver,
   createPreviewStore,
   createPreviewWebhookClient,
+  previewFileBase64,
+  previewFileUrl,
+  resolvePreviewFileSample,
   startPreviewScript
 };