@adatechnology/conversations-ui 0.1.0-rc.28 → 0.1.0-rc.29

package/dist/{chunk-UZJBYD5O.js → chunk-GY472G6E.js}

@@ -1966,9 +1966,9 @@ function ConversationDocumentsPanel({
 }
 
 // src/DocumentsLibrary.tsx
-import { useEffect as useEffect4, useState as useState11 } 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 jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
+import { useEffect as useEffect4, useRef as useRef5, useState as useState11 } from "react";
+import { ArrowUpDown as ArrowUpDown2, Bot as Bot2, Download as Download2, Eye as Eye2, MessageSquare, Upload, Users as Users2 } from "lucide-react";
+import { Fragment as Fragment4, jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
 var DEFAULT_DOCUMENTS_LIBRARY_LABELS = {
   title: "Documentos",
   searchPlaceholder: "Buscar por nome do arquivo ou telefone",
@@ -1985,6 +1985,8 @@ var DEFAULT_DOCUMENTS_LIBRARY_LABELS = {
   sortMostRecent: "Mais recentes",
   sortOldest: "Mais antigos",
   clearFilters: "Limpar filtros",
+  upload: "Enviar documento",
+  uploadError: "N\xE3o foi poss\xEDvel enviar o arquivo.",
   total: (count) => `${count} arquivo${count === 1 ? "" : "s"}`,
   page: (current, last) => `${current} / ${last}`
 };
@@ -2007,9 +2009,14 @@ function DocumentsLibrary({
   const [total, setTotal] = useState11(0);
   const [loading, setLoading] = useState11(false);
   const [failed, setFailed] = useState11(false);
+  const [uploading, setUploading] = useState11(false);
+  const [uploadFailed, setUploadFailed] = useState11(false);
+  const [reloadToken, setReloadToken] = useState11(0);
+  const fileInputRef = useRef5(null);
   const hasFilters = search !== "" || sourceFilter !== DOCUMENT_SOURCE_FILTER.ALL || sortDirection !== "desc";
   const lastPage = Math.max(1, Math.ceil(total / perPage));
   const fetchAll = context?.api.getAllDocuments;
+  const uploadDocument = context?.api.uploadDocument;
   useEffect4(() => {
     if (!fetchAll) return;
     let active = true;
@@ -2033,7 +2040,7 @@ function DocumentsLibrary({
     return () => {
       active = false;
     };
-  }, [fetchAll, search, sourceFilter, sortDirection, page, perPage]);
+  }, [fetchAll, search, sourceFilter, sortDirection, page, perPage, reloadToken]);
   function applyFilter(change) {
     change();
     setPage(1);
@@ -2042,6 +2049,19 @@ function DocumentsLibrary({
     const url = await context?.api.getDocumentUrl(uploadId, disposition);
     if (url) window.open(url, "_blank", "noopener,noreferrer");
   }
+  async function handleUpload(file) {
+    if (!uploadDocument) return;
+    setUploading(true);
+    setUploadFailed(false);
+    try {
+      await uploadDocument(file);
+      setReloadToken((token) => token + 1);
+    } catch {
+      setUploadFailed(true);
+    } finally {
+      setUploading(false);
+    }
+  }
   if (!fetchAll) return null;
   return /* @__PURE__ */ jsxs12("div", { className: cn("space-y-3", classNames?.root, className), children: [
     /* @__PURE__ */ jsx17("h2", { className: cn("text-lg font-semibold", classNames?.title), children: labels.title }),
@@ -2099,10 +2119,41 @@ function DocumentsLibrary({
           className: cn("cv-header-action", classNames?.clearButton),
           children: labels.clearFilters
         }
-      ) : null
+      ) : null,
+      uploadDocument ? /* @__PURE__ */ jsxs12(Fragment4, { children: [
+        /* @__PURE__ */ jsx17(
+          "input",
+          {
+            ref: fileInputRef,
+            type: "file",
+            hidden: true,
+            onChange: (event) => {
+              const file = event.target.files?.[0];
+              event.target.value = "";
+              if (file) void handleUpload(file);
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxs12(
+          "button",
+          {
+            "data-cv-tooltip": labels.upload,
+            "aria-label": labels.upload,
+            type: "button",
+            onClick: () => fileInputRef.current?.click(),
+            disabled: uploading,
+            className: "cv-header-action ml-auto inline-flex items-center gap-1 disabled:opacity-40",
+            children: [
+              /* @__PURE__ */ jsx17(Upload, { size: 14, "aria-hidden": "true" }),
+              labels.upload
+            ]
+          }
+        )
+      ] }) : null
     ] }),
     loading ? /* @__PURE__ */ jsx17("p", { className: cn("text-sm text-gray-500", classNames?.status), children: labels.loading }) : null,
     failed ? /* @__PURE__ */ jsx17("p", { role: "alert", className: cn("text-sm text-red-600 dark:text-red-400", classNames?.status), children: labels.failure }) : null,
+    uploadFailed ? /* @__PURE__ */ jsx17("p", { role: "alert", className: cn("text-sm text-red-600 dark:text-red-400", classNames?.status), children: labels.uploadError }) : null,
     !loading && !failed && documents.length === 0 ? /* @__PURE__ */ jsx17("p", { className: cn("text-sm text-gray-500", classNames?.status), children: hasFilters ? labels.noResults : labels.empty }) : null,
     /* @__PURE__ */ jsx17("ul", { className: cn("space-y-2", classNames?.list), children: documents.map((document2) => {
       const isFromCustomer = !TEAM_SOURCES2.has(document2.source);

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 import * as react from 'react';
 import react__default, { ReactNode, CSSProperties, UIEvent, FormEvent, RefObject } from 'react';
-import { G as MessagePayload, N as ResolveMediaUrl, z as InteractiveSelection, J as MessageTranscription, x as InteractivePayload, r as ConversationsFeatures, o as ConversationSummary, j as ConversationChannel, L as ListConversationsParams, q as ConversationsApi, S as SSEProvider, T as TranscriptionMode, B as ListDocumentsParams, k as ConversationDocument, p as ConversationTemplate, f as ChannelFilter, g as ChannelFilterOption } from './types-BfINicc-.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, 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, K as ReopenMechanism, O as TranscriptionStatus, P as capabilitiesOf, Q as channelFiltersFor, U as contactFlag, V as formatContactHandle } from './types-BfINicc-.js';
+import { G as MessagePayload, N as ResolveMediaUrl, z as InteractiveSelection, J as MessageTranscription, x as InteractivePayload, r as ConversationsFeatures, o as ConversationSummary, j as ConversationChannel, L as ListConversationsParams, q as ConversationsApi, S as SSEProvider, T as TranscriptionMode, B as ListDocumentsParams, k as ConversationDocument, p as ConversationTemplate, f as ChannelFilter, g as ChannelFilterOption } from './types-De5aN-E_.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, 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, K as ReopenMechanism, O as TranscriptionStatus, P as capabilitiesOf, Q as channelFiltersFor, U as contactFlag, V as formatContactHandle } from './types-De5aN-E_.js';
 
 interface MessageBubbleProps {
     message: MessagePayload;
@@ -727,6 +727,8 @@ interface DocumentsLibraryLabels {
     sortMostRecent: string;
     sortOldest: string;
     clearFilters: string;
+    upload: string;
+    uploadError: string;
     total: (count: number) => string;
     page: (current: number, last: number) => string;
 }
@@ -835,6 +837,8 @@ interface DocumentsWorkspaceLabels {
     readonly bulkDownloadZip: string;
     readonly bulkRemove: (count: number) => string;
     readonly bulkRemoveConfirm: (count: number) => string;
+    readonly upload: string;
+    readonly uploadError: string;
     readonly columnFilename: string;
     readonly columnContact: string;
     readonly columnType: string;

package/dist/index.js

@@ -57,7 +57,7 @@ import {
   useConversationDocuments,
   useConversationLocales,
   useConversations
-} from "./chunk-UZJBYD5O.js";
+} from "./chunk-GY472G6E.js";
 import {
   ZERO_WIDTH_SPACE,
   htmlToWA,
@@ -1869,8 +1869,8 @@ function isWindowBlocking(window2) {
 }
 
 // src/documents/DocumentsWorkspace.tsx
-import { useEffect as useEffect7, useMemo as useMemo2, useState as useState11 } from "react";
-import { Download as Download2, Eye, MessageSquare, Trash2, X as X3 } from "lucide-react";
+import { useEffect as useEffect7, useMemo as useMemo2, useRef as useRef5, useState as useState11 } from "react";
+import { Download as Download2, Eye, MessageSquare, Trash2, Upload, X as X3 } from "lucide-react";
 
 // src/listing/index.tsx
 import { useState as useState9 } from "react";
@@ -2092,6 +2092,8 @@ var DEFAULT_DOCUMENTS_WORKSPACE_LABELS = {
   bulkDownloadZip: "Baixar em zip",
   bulkRemove: (count) => `Excluir ${count}`,
   bulkRemoveConfirm: (count) => `Excluir ${count} arquivo${count === 1 ? "" : "s"}?`,
+  upload: "Enviar documento",
+  uploadError: "N\xE3o foi poss\xEDvel enviar o arquivo.",
   columnFilename: "Arquivo",
   columnContact: "Contato",
   columnType: "Tipo",
@@ -2147,10 +2149,14 @@ function DocumentsWorkspace({
   const [selectedIds, setSelectedIds] = useState11(/* @__PURE__ */ new Set());
   const [reloadToken, setReloadToken] = useState11(0);
   const [busy, setBusy] = useState11(false);
+  const [uploading, setUploading] = useState11(false);
+  const [uploadFailed, setUploadFailed] = useState11(false);
+  const fileInputRef = useRef5(null);
   const debouncedSearch = useDebouncedValue(search);
   const fetchAll = context?.api.getAllDocuments;
   const removeDocument = context?.api.deleteDocument;
   const downloadArchive = context?.api.downloadDocumentsArchiveByIds;
+  const uploadDocument = context?.api.uploadDocument;
   const extraKey = JSON.stringify(extra);
   const sourceOptions = useMemo2(
     () => sources ?? Object.entries(labels.sourceLabels).map(([value, label]) => ({ value, label })),
@@ -2234,6 +2240,19 @@ function DocumentsWorkspace({
       setBusy(false);
     }
   }
+  async function handleUpload(file) {
+    if (!uploadDocument) return;
+    setUploading(true);
+    setUploadFailed(false);
+    try {
+      await uploadDocument(file, Object.keys(extra).length > 0 ? extra : void 0);
+      setReloadToken((token) => token + 1);
+    } catch {
+      setUploadFailed(true);
+    } finally {
+      setUploading(false);
+    }
+  }
   async function handleDownloadArchive() {
     if (!downloadArchive) return;
     setBusy(true);
@@ -2307,8 +2326,39 @@ function DocumentsWorkspace({
       hasFilters ? /* @__PURE__ */ jsxs14("button", { "data-cv-tooltip": labels.clearFilters, "aria-label": labels.clearFilters, type: "button", onClick: clearFilters, className: "cv-header-action inline-flex items-center gap-1", children: [
         /* @__PURE__ */ jsx16(X3, { size: 12, "aria-hidden": "true" }),
         labels.clearFilters
+      ] }) : null,
+      uploadDocument ? /* @__PURE__ */ jsxs14(Fragment5, { children: [
+        /* @__PURE__ */ jsx16(
+          "input",
+          {
+            ref: fileInputRef,
+            type: "file",
+            hidden: true,
+            onChange: (event) => {
+              const file = event.target.files?.[0];
+              event.target.value = "";
+              if (file) void handleUpload(file);
+            }
+          }
+        ),
+        /* @__PURE__ */ jsxs14(
+          "button",
+          {
+            "data-cv-tooltip": labels.upload,
+            "aria-label": labels.upload,
+            type: "button",
+            onClick: () => fileInputRef.current?.click(),
+            disabled: uploading,
+            className: "cv-header-action ml-auto inline-flex items-center gap-1 disabled:opacity-40",
+            children: [
+              /* @__PURE__ */ jsx16(Upload, { size: 12, "aria-hidden": "true" }),
+              labels.upload
+            ]
+          }
+        )
       ] }) : null
     ] }),
+    uploadFailed ? /* @__PURE__ */ jsx16("p", { role: "alert", className: cn("text-sm text-red-600 dark:text-red-400", classNames?.status), children: labels.uploadError }) : null,
     canSelect ? /* @__PURE__ */ jsxs14(
       BulkActionBar,
       {
@@ -2516,7 +2566,7 @@ function downloadTextFile(filename, content) {
 }
 
 // src/useWaitingNotifications.ts
-import { useState as useState12, useEffect as useEffect8, useRef as useRef5, useCallback as useCallback5 } from "react";
+import { useState as useState12, useEffect as useEffect8, useRef as useRef6, useCallback as useCallback5 } from "react";
 var DEFAULT_POLL_INTERVAL_MS = 1e4;
 var DEFAULT_LIMIT = 50;
 var DEFAULT_LABELS = {
@@ -2526,9 +2576,9 @@ var DEFAULT_LABELS = {
 function useWaitingNotifications(params) {
   const conversationsContext = useConversations();
   const [conversations, setConversations] = useState12([]);
-  const previousUnreadMap = useRef5(/* @__PURE__ */ new Map());
-  const notifiedIds = useRef5(/* @__PURE__ */ new Set());
-  const isPollingRef = useRef5(false);
+  const previousUnreadMap = useRef6(/* @__PURE__ */ new Map());
+  const notifiedIds = useRef6(/* @__PURE__ */ new Set());
+  const isPollingRef = useRef6(false);
   const isEnabled = params?.enabled ?? true;
   const intervalMs = params?.intervalMs ?? DEFAULT_POLL_INTERVAL_MS;
   const icon = params?.icon;
@@ -3708,16 +3758,16 @@ function useConversationMessages(conversationId, params) {
 }
 
 // src/hooks/useScrollToLatestMessage.ts
-import { useCallback as useCallback8, useLayoutEffect, useRef as useRef6, useState as useState15 } from "react";
+import { useCallback as useCallback8, useLayoutEffect, useRef as useRef7, useState as useState15 } from "react";
 var NEAR_BOTTOM_THRESHOLD_PX = 120;
 var SCROLL_BEHAVIOR = "auto";
 function useScrollToLatestMessage({
   conversationId,
   messageCount
 }) {
-  const containerRef = useRef6(null);
+  const containerRef = useRef7(null);
   const [isAwayFromBottom, setIsAwayFromBottom] = useState15(false);
-  const isAwayFromBottomRef = useRef6(false);
+  const isAwayFromBottomRef = useRef7(false);
   const scrollToBottom = useCallback8((behavior = SCROLL_BEHAVIOR) => {
     const container = containerRef.current;
     if (!container) return;
@@ -3730,7 +3780,7 @@ function useScrollToLatestMessage({
     isAwayFromBottomRef.current = away;
     setIsAwayFromBottom((current) => current === away ? current : away);
   }, []);
-  const jumpedForConversationRef = useRef6(void 0);
+  const jumpedForConversationRef = useRef7(void 0);
   useLayoutEffect(() => {
     const isNewConversation = jumpedForConversationRef.current !== conversationId;
     if (isNewConversation) {
@@ -3777,10 +3827,10 @@ function useConversationContext(conversationId) {
 }
 
 // src/hooks/useConversationRealtime.ts
-import { useEffect as useEffect10, useRef as useRef7 } from "react";
+import { useEffect as useEffect10, useRef as useRef8 } from "react";
 function useConversationRealtime(conversationId, onEvent) {
   const sse = useConversations()?.sse;
-  const onEventRef = useRef7(onEvent);
+  const onEventRef = useRef8(onEvent);
   onEventRef.current = onEvent;
   useEffect10(() => {
     if (!sse || !conversationId) return;
@@ -3795,7 +3845,7 @@ function useConversationRealtime(conversationId, onEvent) {
 }
 function useGlobalRealtime(onEvent) {
   const sse = useConversations()?.sse;
-  const onEventRef = useRef7(onEvent);
+  const onEventRef = useRef8(onEvent);
   onEventRef.current = onEvent;
   useEffect10(() => {
     if (!sse) return;
@@ -3937,7 +3987,7 @@ function BulkTemplateModal({
 }
 
 // src/workspace/ConversationPane.tsx
-import { useEffect as useEffect12, useRef as useRef8, useState as useState17 } from "react";
+import { useEffect as useEffect12, useRef as useRef9, useState as useState17 } from "react";
 import { jsx as jsx25, jsxs as jsxs23 } from "react/jsx-runtime";
 function ConversationPane({
   conversation,
@@ -3977,7 +4027,7 @@ function ConversationPane({
   const [draft, setDraft] = useState17(initialComposerText ?? "");
   const [queuedFiles, setQueuedFiles] = useState17([]);
   const [isSendingDraft, setIsSendingDraft] = useState17(false);
-  const sendInFlightRef = useRef8(false);
+  const sendInFlightRef = useRef9(false);
   useEffect12(() => {
     setSelectedMessageIds(/* @__PURE__ */ new Set());
     setDraft(initialComposerText ?? "");
@@ -4383,7 +4433,7 @@ var DEFAULT_CONVERSATIONS_WORKSPACE_LABELS = {
 };
 
 // src/workspace/useConversationsInbox.ts
-import { useCallback as useCallback9, useEffect as useEffect13, useMemo as useMemo5, useRef as useRef9, useState as useState18 } from "react";
+import { useCallback as useCallback9, useEffect as useEffect13, useMemo as useMemo5, useRef as useRef10, useState as useState18 } from "react";
 var CONVERSATIONS_PER_PAGE = 50;
 function defaultDescribeFailure(error) {
   const status = error.status;
@@ -4441,7 +4491,7 @@ function useConversationsInbox(params = {}) {
       setSelectedId(void 0);
     }
   }, [conversations, selectedId]);
-  const lastMarkReadAttempt = useRef9(void 0);
+  const lastMarkReadAttempt = useRef10(void 0);
   useEffect13(() => {
     if (!markReadOnOpen || !selectedId) return;
     const opened = conversations.find((conversation) => conversation.id === selectedId);

package/dist/preview/index.d.ts

@@ -1,5 +1,5 @@
-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, N as ResolveMediaUrl } from '../types-BfINicc-.js';
-export { A as AudioRecorderButton, a as AudioRecorderButtonLabels, b as AudioRecorderButtonProps, D as DEFAULT_AUDIO_RECORDER_BUTTON_LABELS } from '../types-BfINicc-.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, N as ResolveMediaUrl } from '../types-De5aN-E_.js';
+export { A as AudioRecorderButton, a as AudioRecorderButtonLabels, b as AudioRecorderButtonProps, D as DEFAULT_AUDIO_RECORDER_BUTTON_LABELS } from '../types-De5aN-E_.js';
 import * as react from 'react';
 import { ReactNode } from 'react';
 import { InteractiveReplyOption, InboundMediaType } from '@adatechnology/meta-whatsapp-contracts/testing';

package/dist/preview/index.js

@@ -8,7 +8,7 @@ import {
   DocumentsLibrary,
   MessageBubble,
   MessageComposer
-} from "../chunk-UZJBYD5O.js";
+} from "../chunk-GY472G6E.js";
 import "../chunk-WCBDXZ3X.js";
 
 // src/preview/previewStore.ts

package/dist/{types-BfINicc-.d.ts → types-De5aN-E_.d.ts}

@@ -396,6 +396,17 @@ interface ConversationsApi {
      * `downloadDocumentsArchive`, que é por conversa. Ausente, a seleção em lote não oferece o botão.
      */
     downloadDocumentsArchiveByIds?(uploadIds: readonly string[]): Promise<Blob>;
+    /**
+     * Envia um arquivo avulso direto pra biblioteca, fora do fluxo de uma conversa. **Opcional por
+     * capacidade:** cada host tem seu próprio contrato de upload (base64, multipart, presigned URL) —
+     * o pacote não escolhe um formato de payload, só entrega o `File` do input e deixa o host montar
+     * a chamada do jeito que seu backend espera. Ausente, a tela de biblioteca não desenha o botão de
+     * enviar, em vez de oferecer uma ação que sempre falha.
+     *
+     * `extra` é o mesmo vocabulário livre do produto que já viaja em `renderFilters` — cliente,
+     * unidade, campanha — pra associar o arquivo enviado ao contexto que a tela estava filtrando.
+     */
+    uploadDocument?(file: File, extra?: Readonly<Record<string, string | number>>): Promise<ConversationDocument>;
     getMediaProxyUrl(mediaId: string): Promise<{
         mimeType: string;
         data: string;

package/package.json

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

package/src/DocumentsLibrary.tsx

@@ -7,8 +7,8 @@
  * clicável. Sem essa referência, uma lista global de anexos não responde nenhuma pergunta.
  */
 
-import { useEffect, useState } from 'react'
-import { ArrowUpDown, Bot, Download, Eye, MessageSquare, Users } from 'lucide-react'
+import { useEffect, useRef, useState } from 'react'
+import { ArrowUpDown, Bot, Download, Eye, MessageSquare, Upload, Users } from 'lucide-react'
 import { useConversations } from './providers/ConversationsProvider'
 import { DOCUMENT_SOURCE_FILTER, type DocumentSourceFilter } from './ConversationDocumentsPanel'
 import { FileIcon } from './FileIcon'
@@ -34,6 +34,8 @@ export interface DocumentsLibraryLabels {
   sortMostRecent: string
   sortOldest: string
   clearFilters: string
+  upload: string
+  uploadError: string
   total: (count: number) => string
   page: (current: number, last: number) => string
 }
@@ -54,6 +56,8 @@ export const DEFAULT_DOCUMENTS_LIBRARY_LABELS: DocumentsLibraryLabels = {
   sortMostRecent: 'Mais recentes',
   sortOldest: 'Mais antigos',
   clearFilters: 'Limpar filtros',
+  upload: 'Enviar documento',
+  uploadError: 'Não foi possível enviar o arquivo.',
   total: (count: number) => `${count} arquivo${count === 1 ? '' : 's'}`,
   page: (current: number, last: number) => `${current} / ${last}`,
 }
@@ -106,9 +110,15 @@ export function DocumentsLibrary({
   const [loading, setLoading] = useState(false)
   const [failed, setFailed] = useState(false)
 
+  const [uploading, setUploading] = useState(false)
+  const [uploadFailed, setUploadFailed] = useState(false)
+  const [reloadToken, setReloadToken] = useState(0)
+  const fileInputRef = useRef<HTMLInputElement>(null)
+
   const hasFilters = search !== '' || sourceFilter !== DOCUMENT_SOURCE_FILTER.ALL || sortDirection !== 'desc'
   const lastPage = Math.max(1, Math.ceil(total / perPage))
   const fetchAll = context?.api.getAllDocuments
+  const uploadDocument = context?.api.uploadDocument
 
   useEffect(() => {
     if (!fetchAll) return
@@ -140,7 +150,7 @@ export function DocumentsLibrary({
     return () => {
       active = false
     }
-  }, [fetchAll, search, sourceFilter, sortDirection, page, perPage])
+  }, [fetchAll, search, sourceFilter, sortDirection, page, perPage, reloadToken])
 
   function applyFilter(change: () => void): void {
     change()
@@ -152,6 +162,20 @@ export function DocumentsLibrary({
     if (url) window.open(url, '_blank', 'noopener,noreferrer')
   }
 
+  async function handleUpload(file: File): Promise<void> {
+    if (!uploadDocument) return
+    setUploading(true)
+    setUploadFailed(false)
+    try {
+      await uploadDocument(file)
+      setReloadToken((token) => token + 1)
+    } catch {
+      setUploadFailed(true)
+    } finally {
+      setUploading(false)
+    }
+  }
+
   // Host sem `getAllDocuments` não tem o que mostrar aqui — some, em vez de renderizar vazio para
   // sempre e fazer parecer que a empresa não tem arquivo nenhum.
   if (!fetchAll) return null
@@ -207,6 +231,32 @@ export function DocumentsLibrary({
             {labels.clearFilters}
           </button>
         ) : null}
+
+        {uploadDocument ? (
+          <>
+            <input
+              ref={fileInputRef}
+              type="file"
+              hidden
+              onChange={(event) => {
+                const file = event.target.files?.[0]
+                event.target.value = ''
+                if (file) void handleUpload(file)
+              }}
+            />
+            <button
+              data-cv-tooltip={labels.upload}
+              aria-label={labels.upload}
+              type="button"
+              onClick={() => fileInputRef.current?.click()}
+              disabled={uploading}
+              className="cv-header-action ml-auto inline-flex items-center gap-1 disabled:opacity-40"
+            >
+              <Upload size={14} aria-hidden="true" />
+              {labels.upload}
+            </button>
+          </>
+        ) : null}
       </div>
 
       {loading ? <p className={cn('text-sm text-gray-500', classNames?.status)}>{labels.loading}</p> : null}
@@ -215,6 +265,11 @@ export function DocumentsLibrary({
           {labels.failure}
         </p>
       ) : null}
+      {uploadFailed ? (
+        <p role="alert" className={cn('text-sm text-red-600 dark:text-red-400', classNames?.status)}>
+          {labels.uploadError}
+        </p>
+      ) : null}
       {!loading && !failed && documents.length === 0 ? (
         <p className={cn('text-sm text-gray-500', classNames?.status)}>
           {hasFilters ? labels.noResults : labels.empty}

package/src/documents/DocumentsWorkspace.tsx

@@ -9,8 +9,8 @@
  * remontasse isso à mão voltaria a divergir dos outros — foi o que aconteceu antes desta tela existir.
  */
 
-import { useEffect, useMemo, useState, type ReactNode } from 'react'
-import { Download, Eye, MessageSquare, Trash2, X } from 'lucide-react'
+import { useEffect, useMemo, useRef, useState, type ReactNode } from 'react'
+import { Download, Eye, MessageSquare, Trash2, Upload, X } from 'lucide-react'
 
 import { useConversations } from '../providers/ConversationsProvider'
 import { FileIcon } from '../FileIcon'
@@ -106,11 +106,15 @@ export function DocumentsWorkspace({
   const [selectedIds, setSelectedIds] = useState<ReadonlySet<string>>(new Set())
   const [reloadToken, setReloadToken] = useState(0)
   const [busy, setBusy] = useState(false)
+  const [uploading, setUploading] = useState(false)
+  const [uploadFailed, setUploadFailed] = useState(false)
+  const fileInputRef = useRef<HTMLInputElement>(null)
 
   const debouncedSearch = useDebouncedValue(search)
   const fetchAll = context?.api.getAllDocuments
   const removeDocument = context?.api.deleteDocument
   const downloadArchive = context?.api.downloadDocumentsArchiveByIds
+  const uploadDocument = context?.api.uploadDocument
   const extraKey = JSON.stringify(extra)
 
   const sourceOptions = useMemo<readonly FilterOption[]>(
@@ -224,6 +228,20 @@ export function DocumentsWorkspace({
     }
   }
 
+  async function handleUpload(file: File): Promise<void> {
+    if (!uploadDocument) return
+    setUploading(true)
+    setUploadFailed(false)
+    try {
+      await uploadDocument(file, Object.keys(extra).length > 0 ? extra : undefined)
+      setReloadToken((token) => token + 1)
+    } catch {
+      setUploadFailed(true)
+    } finally {
+      setUploading(false)
+    }
+  }
+
   async function handleDownloadArchive(): Promise<void> {
     if (!downloadArchive) return
     setBusy(true)
@@ -304,8 +322,40 @@ export function DocumentsWorkspace({
             {labels.clearFilters}
           </button>
         ) : null}
+
+        {uploadDocument ? (
+          <>
+            <input
+              ref={fileInputRef}
+              type="file"
+              hidden
+              onChange={(event) => {
+                const file = event.target.files?.[0]
+                event.target.value = ''
+                if (file) void handleUpload(file)
+              }}
+            />
+            <button
+              data-cv-tooltip={labels.upload}
+              aria-label={labels.upload}
+              type="button"
+              onClick={() => fileInputRef.current?.click()}
+              disabled={uploading}
+              className="cv-header-action ml-auto inline-flex items-center gap-1 disabled:opacity-40"
+            >
+              <Upload size={12} aria-hidden="true" />
+              {labels.upload}
+            </button>
+          </>
+        ) : null}
       </div>
 
+      {uploadFailed ? (
+        <p role="alert" className={cn('text-sm text-red-600 dark:text-red-400', classNames?.status)}>
+          {labels.uploadError}
+        </p>
+      ) : null}
+
       {canSelect ? (
         <BulkActionBar
           selectedCount={selectedIds.size}

package/src/documents/labels.ts

@@ -28,6 +28,8 @@ export interface DocumentsWorkspaceLabels {
   readonly bulkDownloadZip: string
   readonly bulkRemove: (count: number) => string
   readonly bulkRemoveConfirm: (count: number) => string
+  readonly upload: string
+  readonly uploadError: string
   readonly columnFilename: string
   readonly columnContact: string
   readonly columnType: string
@@ -70,6 +72,8 @@ export const DEFAULT_DOCUMENTS_WORKSPACE_LABELS: DocumentsWorkspaceLabels = {
   bulkDownloadZip: 'Baixar em zip',
   bulkRemove: (count) => `Excluir ${count}`,
   bulkRemoveConfirm: (count) => `Excluir ${count} arquivo${count === 1 ? '' : 's'}?`,
+  upload: 'Enviar documento',
+  uploadError: 'Não foi possível enviar o arquivo.',
   columnFilename: 'Arquivo',
   columnContact: 'Contato',
   columnType: 'Tipo',

package/src/providers/types.ts

@@ -145,6 +145,17 @@ export interface ConversationsApi {
    * `downloadDocumentsArchive`, que é por conversa. Ausente, a seleção em lote não oferece o botão.
    */
   downloadDocumentsArchiveByIds?(uploadIds: readonly string[]): Promise<Blob>
+  /**
+   * Envia um arquivo avulso direto pra biblioteca, fora do fluxo de uma conversa. **Opcional por
+   * capacidade:** cada host tem seu próprio contrato de upload (base64, multipart, presigned URL) —
+   * o pacote não escolhe um formato de payload, só entrega o `File` do input e deixa o host montar
+   * a chamada do jeito que seu backend espera. Ausente, a tela de biblioteca não desenha o botão de
+   * enviar, em vez de oferecer uma ação que sempre falha.
+   *
+   * `extra` é o mesmo vocabulário livre do produto que já viaja em `renderFilters` — cliente,
+   * unidade, campanha — pra associar o arquivo enviado ao contexto que a tela estava filtrando.
+   */
+  uploadDocument?(file: File, extra?: Readonly<Record<string, string | number>>): Promise<ConversationDocument>
   getMediaProxyUrl(mediaId: string): Promise<{ mimeType: string; data: string }>
 
   /**