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

package/dist/index.js

@@ -4,9 +4,17 @@ import {
 } from "./chunk-NV2RZ5KT.js";
 import {
   AudioPlayer,
+  ConversationDocumentsPanel,
   ConversationLocalesProvider,
   ConversationWallpaper,
+  ConversationsProvider,
+  DEFAULT_CONVERSATION_DOCUMENTS_LABELS,
+  DEFAULT_DOCUMENTS_LIBRARY_LABELS,
+  DEFAULT_LIGHTBOX_LABELS,
+  DEFAULT_MESSAGE_COMPOSER_LABELS,
+  DOCUMENT_SOURCE_FILTER,
   DateDivider,
+  DocumentsLibrary,
   EmojiPicker,
   FileIcon,
   Lightbox,
@@ -15,10 +23,21 @@ import {
   MessageComposer,
   StatusTicks,
   cn,
+  conversationsOf,
+  createMediaUrlResolver,
+  formatDateTime,
   formatFileSize,
+  formatPhone,
   formatTimestamp,
-  useConversationLocales
-} from "./chunk-4R6Y43DQ.js";
+  isSameDay,
+  phoneCountryFlag,
+  phoneInitials,
+  totalOf,
+  useAsyncResource,
+  useConversationDocuments,
+  useConversationLocales,
+  useConversations
+} from "./chunk-LITPZCWW.js";
 import {
   htmlToWA,
   parseWhatsAppFormatting,
@@ -30,6 +49,15 @@ import {
 import { useRef } from "react";
 import { Bold, Italic, Strikethrough } from "lucide-react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var DEFAULT_WHATSAPP_MESSAGE_EDITOR_LABELS = {
+  bold: "Negrito",
+  boldHint: "Negrito (*texto*)",
+  italic: "It\xE1lico",
+  italicHint: "It\xE1lico (_texto_)",
+  strikethrough: "Tachado",
+  strikethroughHint: "Tachado (~texto~)",
+  insertPlaceholder: (token) => `Inserir ${token}`
+};
 var INLINE_TOKEN = /(\*[^*\n]+\*|_[^_\n]+_|~[^~\n]+~|`[^`\n]+`|\{[a-zA-Z_]+\})/g;
 function renderLine(line, lineKey) {
   const nodes = [];
@@ -65,8 +93,10 @@ function WhatsAppMessageEditor({
   placeholders = [],
   rows = 4,
   previewLabel = "Pr\xE9via (como aparece no WhatsApp)",
-  emptyPreviewText = "Sua mensagem aparecer\xE1 aqui\u2026"
+  emptyPreviewText = "Sua mensagem aparecer\xE1 aqui\u2026",
+  labels
 }) {
+  const editorLabels = { ...DEFAULT_WHATSAPP_MESSAGE_EDITOR_LABELS, ...labels };
   const textareaRef = useRef(null);
   function wrapSelection(marker) {
     const textarea = textareaRef.current;
@@ -97,9 +127,9 @@ function WhatsAppMessageEditor({
   const toolbarButtonClass = "inline-flex items-center justify-center h-8 w-8 rounded-lg border border-gray-200 dark:border-gray-600 text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 transition-colors";
   return /* @__PURE__ */ jsxs("div", { children: [
     /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-1.5 mb-2", children: [
-      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => wrapSelection("*"), className: toolbarButtonClass, title: "Negrito (*texto*)", "aria-label": "Negrito", children: /* @__PURE__ */ jsx(Bold, { size: 15 }) }),
-      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => wrapSelection("_"), className: toolbarButtonClass, title: "It\xE1lico (_texto_)", "aria-label": "It\xE1lico", children: /* @__PURE__ */ jsx(Italic, { size: 15 }) }),
-      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => wrapSelection("~"), className: toolbarButtonClass, title: "Tachado (~texto~)", "aria-label": "Tachado", children: /* @__PURE__ */ jsx(Strikethrough, { size: 15 }) }),
+      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => wrapSelection("*"), className: toolbarButtonClass, title: editorLabels.boldHint, "aria-label": editorLabels.bold, children: /* @__PURE__ */ jsx(Bold, { size: 15 }) }),
+      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => wrapSelection("_"), className: toolbarButtonClass, title: editorLabels.italicHint, "aria-label": editorLabels.italic, children: /* @__PURE__ */ jsx(Italic, { size: 15 }) }),
+      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => wrapSelection("~"), className: toolbarButtonClass, title: editorLabels.strikethroughHint, "aria-label": editorLabels.strikethrough, children: /* @__PURE__ */ jsx(Strikethrough, { size: 15 }) }),
       placeholders.length > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
         /* @__PURE__ */ jsx("span", { className: "mx-1 h-5 w-px bg-gray-200 dark:bg-gray-600" }),
         placeholders.map((token) => /* @__PURE__ */ jsx(
@@ -108,7 +138,7 @@ function WhatsAppMessageEditor({
             type: "button",
             onClick: () => insertAtCursor(token),
             className: "inline-flex items-center h-8 px-2 rounded-lg border border-gray-200 dark:border-gray-600 text-xs text-blue-600 dark:text-blue-300 hover:bg-blue-50 dark:hover:bg-blue-900/40 transition-colors",
-            title: `Inserir ${token}`,
+            title: editorLabels.insertPlaceholder(token),
             children: token
           },
           token
@@ -268,6 +298,9 @@ function SimpleEmojiPicker({ onSelect, label = "Emojis", pickerWidth = "280px",
 
 // src/Avatar.tsx
 import { jsx as jsx3 } from "react/jsx-runtime";
+var DEFAULT_AVATAR_LABELS = {
+  unnamedContact: "Contato sem nome"
+};
 var sizeClasses = {
   sm: "w-6 h-6 text-xs",
   md: "w-8 h-8 text-sm",
@@ -293,8 +326,9 @@ function getBgColor(name) {
   const hash = name.charCodeAt(0) + (name.charCodeAt(name.length - 1) || 0);
   return bgColors[hash % bgColors.length];
 }
-function Avatar({ name, avatarUrl, size = "md", className = "" }) {
+function Avatar({ name, avatarUrl, size = "md", className = "", labels }) {
   const sizeClass = sizeClasses[size];
+  const unnamedContactLabel = labels?.unnamedContact ?? DEFAULT_AVATAR_LABELS.unnamedContact;
   if (avatarUrl) {
     return /* @__PURE__ */ jsx3(
       "img",
@@ -312,7 +346,7 @@ function Avatar({ name, avatarUrl, size = "md", className = "" }) {
       {
         className: `${sizeClass} ${bgColor} rounded-full flex items-center justify-center text-white flex-shrink-0 ${className}`,
         role: "img",
-        "aria-label": "Contato sem nome",
+        "aria-label": unnamedContactLabel,
         children: /* @__PURE__ */ jsx3("svg", { viewBox: "0 0 24 24", fill: "currentColor", className: "h-[60%] w-[60%]", "aria-hidden": true, children: /* @__PURE__ */ jsx3("path", { d: "M12 12a5 5 0 1 0 0-10 5 5 0 0 0 0 10Zm0 2c-4.42 0-8 2.24-8 5v1h16v-1c0-2.76-3.58-5-8-5Z" }) })
       }
     );
@@ -330,51 +364,6 @@ function Avatar({ name, avatarUrl, size = "md", className = "" }) {
 // src/ConversationListItem.tsx
 import { useMemo } from "react";
 
-// src/lib/phone.ts
-function formatPhone(number) {
-  const digits = number.replace(/\D/g, "");
-  if (digits.length === 13) {
-    return `+${digits.slice(0, 2)} (${digits.slice(2, 4)}) ${digits.slice(4, 9)}-${digits.slice(9, 13)}`;
-  }
-  if (digits.length === 12) {
-    return `+${digits.slice(0, 2)} (${digits.slice(2, 4)}) ${digits.slice(4, 8)}-${digits.slice(8, 12)}`;
-  }
-  if (digits.length === 11) {
-    return `(${digits.slice(0, 2)}) ${digits.slice(2, 7)}-${digits.slice(7, 11)}`;
-  }
-  if (digits.length === 10) {
-    return `(${digits.slice(0, 2)}) ${digits.slice(2, 6)}-${digits.slice(6, 10)}`;
-  }
-  return number;
-}
-var COUNTRY_FLAG_BY_DIAL_CODE = {
-  "55": "\u{1F1E7}\u{1F1F7}",
-  "351": "\u{1F1F5}\u{1F1F9}",
-  "34": "\u{1F1EA}\u{1F1F8}",
-  "54": "\u{1F1E6}\u{1F1F7}",
-  "56": "\u{1F1E8}\u{1F1F1}",
-  "57": "\u{1F1E8}\u{1F1F4}",
-  "52": "\u{1F1F2}\u{1F1FD}",
-  "598": "\u{1F1FA}\u{1F1FE}",
-  "595": "\u{1F1F5}\u{1F1FE}",
-  "44": "\u{1F1EC}\u{1F1E7}",
-  "49": "\u{1F1E9}\u{1F1EA}",
-  "39": "\u{1F1EE}\u{1F1F9}",
-  "33": "\u{1F1EB}\u{1F1F7}"
-};
-function phoneCountryFlag(number) {
-  const digits = number.replace(/\D/g, "");
-  for (const length of [3, 2, 1]) {
-    const flag = COUNTRY_FLAG_BY_DIAL_CODE[digits.slice(0, length)];
-    if (flag) return flag;
-  }
-  return "";
-}
-function phoneInitials(number) {
-  const digits = number.replace(/\D/g, "");
-  return digits.slice(-2);
-}
-
 // src/conversationChannel.ts
 var CONVERSATION_CHANNEL = {
   WHATSAPP: "whatsapp",
@@ -456,6 +445,10 @@ function contactFlag(params) {
 
 // src/ConversationListItem.tsx
 import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+var DEFAULT_CONVERSATION_LIST_ITEM_LABELS = {
+  expiredWindow: "Janela expirada",
+  warningWindow: "Janela pr\xF3xima do fim"
+};
 function formatRelativeTime(dateStr) {
   try {
     const date = new Date(dateStr);
@@ -516,8 +509,11 @@ var ConversationListItem = ({
   onClick,
   onSelect,
   showDivider = true,
-  highlightActive = true
+  highlightActive = true,
+  labels
 }) => {
+  const expiredWindowLabel = labels?.expiredWindow ?? DEFAULT_CONVERSATION_LIST_ITEM_LABELS.expiredWindow;
+  const warningWindowLabel = labels?.warningWindow ?? DEFAULT_CONVERSATION_LIST_ITEM_LABELS.warningWindow;
   const isActive = active || selected;
   const windowStatus = useMemo(() => getWindowStatus(conversation.lastInboundAt), [conversation.lastInboundAt]);
   const preview = useMemo(() => lastMessagePreview(conversation), [conversation.lastContent]);
@@ -549,8 +545,8 @@ var ConversationListItem = ({
             /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-1.5 min-w-0", children: [
               !conversation.clientName && flag ? /* @__PURE__ */ jsx4("span", { "aria-hidden": true, children: flag }) : null,
               /* @__PURE__ */ jsx4("span", { className: "text-[16px] text-[#111b21] truncate", children: name }),
-              windowStatus && windowStatus.label === "expired" && /* @__PURE__ */ jsx4("span", { className: "w-2 h-2 rounded-full bg-red-500 flex-shrink-0", title: "Janela expirada" }),
-              windowStatus && windowStatus.label === "warning" && /* @__PURE__ */ jsx4("span", { className: "w-2 h-2 rounded-full bg-orange-500 flex-shrink-0", title: "Janela pr\xF3xima do fim" })
+              windowStatus && windowStatus.label === "expired" && /* @__PURE__ */ jsx4("span", { className: "w-2 h-2 rounded-full bg-red-500 flex-shrink-0", title: expiredWindowLabel }),
+              windowStatus && windowStatus.label === "warning" && /* @__PURE__ */ jsx4("span", { className: "w-2 h-2 rounded-full bg-orange-500 flex-shrink-0", title: warningWindowLabel })
             ] }),
             timestamp && /* @__PURE__ */ jsx4("span", { className: "text-xs text-[#667781] flex-shrink-0", children: timestamp })
           ] }),
@@ -1146,116 +1142,6 @@ function isWindowBlocking(window2) {
   return window2 === CONVERSATION_WINDOW.EXPIRED;
 }
 
-// src/ConversationDocumentsPanel.tsx
-import { useState as useState8 } from "react";
-
-// src/providers/ConversationsProvider.tsx
-import { createContext as createContext2, useContext as useContext2 } from "react";
-import { jsx as jsx14 } from "react/jsx-runtime";
-var ConversationsContext = createContext2(null);
-function ConversationsProvider({
-  api,
-  sse,
-  children
-}) {
-  return /* @__PURE__ */ jsx14(ConversationsContext.Provider, { value: { api, sse }, children });
-}
-function useConversations() {
-  return useContext2(ConversationsContext);
-}
-
-// src/hooks/useAsyncResource.ts
-import { useCallback as useCallback3, useEffect as useEffect4, useRef as useRef3, useState as useState7 } from "react";
-function useAsyncResource(fetcher, deps) {
-  const [data, setData] = useState7(void 0);
-  const [loading, setLoading] = useState7(false);
-  const [error, setError] = useState7(void 0);
-  const requestIdRef = useRef3(0);
-  const load = useCallback3(async () => {
-    const requestId = ++requestIdRef.current;
-    setLoading(true);
-    setError(void 0);
-    try {
-      const result = await fetcher();
-      if (requestId === requestIdRef.current) setData(result);
-    } catch (err) {
-      if (requestId === requestIdRef.current) setError(err instanceof Error ? err : new Error(String(err)));
-    } finally {
-      if (requestId === requestIdRef.current) setLoading(false);
-    }
-  }, deps);
-  useEffect4(() => {
-    load();
-  }, [load]);
-  return { data, loading, error, refetch: load };
-}
-
-// src/hooks/useConversationDocuments.ts
-function useConversationDocuments(conversationId, params) {
-  const context = useConversations();
-  if (!context) {
-    throw new Error("useConversationDocuments requires an ancestor <ConversationsProvider>");
-  }
-  const { api } = context;
-  const { data, loading, error, refetch } = useAsyncResource(
-    () => conversationId ? api.getDocuments(conversationId, params) : Promise.resolve([]),
-    [conversationId, params?.search, params?.page]
-  );
-  return { documents: data ?? [], loading, error, refetch };
-}
-
-// src/ConversationDocumentsPanel.tsx
-import { jsx as jsx15, jsxs as jsxs12 } from "react/jsx-runtime";
-var DEFAULT_CONVERSATION_DOCUMENTS_LABELS = {
-  toggle: "\u{1F4CE} Arquivos",
-  title: "Arquivos da conversa",
-  searchPlaceholder: "Buscar arquivo...",
-  empty: "Nenhum arquivo nesta conversa.",
-  loading: "Carregando arquivos\u2026",
-  failure: "N\xE3o foi poss\xEDvel carregar os arquivos.",
-  download: "Baixar"
-};
-function ConversationDocumentsPanel({
-  conversationId,
-  open,
-  labels: labelsOverride,
-  className,
-  classNames
-}) {
-  const labels = { ...DEFAULT_CONVERSATION_DOCUMENTS_LABELS, ...labelsOverride };
-  const context = useConversations();
-  const [search, setSearch] = useState8("");
-  const { documents, loading, error } = useConversationDocuments(open ? conversationId : void 0, { search });
-  async function handleDownload(uploadId) {
-    const url = await context?.api.getDocumentUrl(uploadId);
-    if (url) window.open(url, "_blank", "noopener,noreferrer");
-  }
-  if (!open) return null;
-  return /* @__PURE__ */ jsx15("div", { className: cn("border-b", classNames?.root, className), children: /* @__PURE__ */ jsxs12("section", { className: cn("px-4 py-3", classNames?.body), children: [
-    /* @__PURE__ */ jsx15("p", { className: "mb-2 text-sm font-medium", children: labels.title }),
-    /* @__PURE__ */ jsx15(
-      "input",
-      {
-        type: "search",
-        value: search,
-        onChange: (event) => setSearch(event.target.value),
-        placeholder: labels.searchPlaceholder,
-        className: "mb-2 w-full rounded-md border px-3 py-2 text-sm"
-      }
-    ),
-    loading ? /* @__PURE__ */ jsx15("p", { className: "text-xs text-gray-500", children: labels.loading }) : null,
-    error ? /* @__PURE__ */ jsx15("p", { className: "text-xs text-red-600 dark:text-red-400", children: labels.failure }) : null,
-    !loading && !error && documents.length === 0 ? /* @__PURE__ */ jsx15("p", { className: "text-xs text-gray-500", children: labels.empty }) : null,
-    /* @__PURE__ */ jsx15("ul", { className: "space-y-1", children: documents.map((document2) => /* @__PURE__ */ jsxs12("li", { className: "flex items-center gap-2 text-xs", children: [
-      /* @__PURE__ */ jsx15(FileIcon, { mimeType: document2.mimeType }),
-      /* @__PURE__ */ jsx15("span", { className: "min-w-0 flex-1 truncate", children: document2.filename }),
-      /* @__PURE__ */ jsx15("span", { className: "text-gray-500", children: formatFileSize(document2.sizeBytes) }),
-      /* @__PURE__ */ jsx15("span", { className: "text-gray-500", children: formatTimestamp(document2.linkedAt) }),
-      /* @__PURE__ */ jsx15("button", { type: "button", onClick: () => void handleDownload(document2.id), className: "cv-header-action", children: labels.download })
-    ] }, document2.id)) })
-  ] }) });
-}
-
 // src/conversationTranscript.ts
 var SENDER_LABEL = {
   customer: "Cliente",
@@ -1292,53 +1178,67 @@ function downloadTextFile(filename, content) {
 }
 
 // src/useWaitingNotifications.ts
-import { useState as useState9, useEffect as useEffect5, useRef as useRef4, useCallback as useCallback4 } from "react";
-function useWaitingNotifications() {
-  const conversationsCtx = useConversations();
-  const [conversations, setConversations] = useState9([]);
-  const previousUnreadMap = useRef4(/* @__PURE__ */ new Map());
-  const notifiedIds = useRef4(/* @__PURE__ */ new Set());
-  const pollConversations = useCallback4(async () => {
-    if (!conversationsCtx) return;
+import { useState as useState7, useEffect as useEffect4, useRef as useRef3, useCallback as useCallback3 } from "react";
+var DEFAULT_POLL_INTERVAL_MS = 1e4;
+var DEFAULT_LIMIT = 50;
+var DEFAULT_LABELS = {
+  title: (conversation) => conversation.clientName ?? conversation.whatsappNumber,
+  body: (conversation) => conversation.lastContent ?? "Nova mensagem"
+};
+function useWaitingNotifications(params) {
+  const conversationsContext = useConversations();
+  const [conversations, setConversations] = useState7([]);
+  const previousUnreadMap = useRef3(/* @__PURE__ */ new Map());
+  const notifiedIds = useRef3(/* @__PURE__ */ new Set());
+  const isPollingRef = useRef3(false);
+  const isEnabled = params?.enabled ?? true;
+  const intervalMs = params?.intervalMs ?? DEFAULT_POLL_INTERVAL_MS;
+  const icon = params?.icon;
+  const listParams = params?.params;
+  const labelTitle = params?.labels?.title ?? DEFAULT_LABELS.title;
+  const labelBody = params?.labels?.body ?? DEFAULT_LABELS.body;
+  const refresh = useCallback3(async () => {
+    if (!conversationsContext || isPollingRef.current) return;
+    isPollingRef.current = true;
     try {
-      const result = await conversationsCtx.api.fetchConversations({ limit: 50 });
+      const result = conversationsOf(
+        await conversationsContext.api.fetchConversations({ limit: DEFAULT_LIMIT, ...listParams })
+      );
       setConversations(result);
       const currentMap = /* @__PURE__ */ new Map();
-      for (const conv of result) {
-        currentMap.set(conv.id, conv.unread);
-      }
-      for (const conv of result) {
-        if (conv.unread <= 0) continue;
-        const prev = previousUnreadMap.current.get(conv.id) ?? 0;
-        if (conv.unread > prev && !notifiedIds.current.has(conv.id)) {
-          notifiedIds.current.add(conv.id);
-          if (typeof window !== "undefined" && "Notification" in window && Notification.permission === "granted") {
-            const title = conv.clientName ?? conv.whatsappNumber;
-            const body = conv.lastContent ?? "Nova mensagem";
-            new Notification(title, { body, icon: "/favicon.ico" });
-          }
+      for (const conversation of result) currentMap.set(conversation.id, conversation.unread);
+      for (const conversation of result) {
+        if (conversation.unread <= 0) continue;
+        const previousUnread = previousUnreadMap.current.get(conversation.id) ?? 0;
+        if (conversation.unread <= previousUnread || notifiedIds.current.has(conversation.id)) continue;
+        notifiedIds.current.add(conversation.id);
+        if (typeof window !== "undefined" && "Notification" in window && Notification.permission === "granted") {
+          new Notification(labelTitle(conversation), { body: labelBody(conversation), ...icon ? { icon } : {} });
         }
       }
       previousUnreadMap.current = currentMap;
     } catch {
+    } finally {
+      isPollingRef.current = false;
     }
-  }, [conversationsCtx]);
-  useEffect5(() => {
+  }, [conversationsContext, listParams, icon, labelTitle, labelBody]);
+  useEffect4(() => {
+    if (!isEnabled) return;
     if (typeof window !== "undefined" && "Notification" in window && Notification.permission === "default") {
       Notification.requestPermission();
     }
-    pollConversations();
-    const interval = setInterval(pollConversations, 1e4);
+    void refresh();
+    const interval = setInterval(() => void refresh(), intervalMs);
     return () => clearInterval(interval);
-  }, [pollConversations]);
-  const unreadCount = conversations.reduce((sum, conv) => sum + conv.unread, 0);
-  return { unreadCount, conversations };
+  }, [refresh, isEnabled, intervalMs]);
+  const unreadCount = conversations.reduce((sum, conversation) => sum + conversation.unread, 0);
+  return { unreadCount, conversations, refresh };
 }
 
 // src/settings/WhatsAppTemplateSettingsForm.tsx
 import { Plus, RefreshCw, Save, Trash2 } from "lucide-react";
-import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
-var DEFAULT_LABELS = {
+import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
+var DEFAULT_LABELS2 = {
   sectionTitle: "WhatsApp",
   sectionDescription: "Template usado para reabrir a janela de 24h com o cliente.",
   templateLabel: "Template aprovado",
@@ -1372,7 +1272,7 @@ function WhatsAppTemplateSettingsForm({
   onSave,
   labels: labelsOverride
 }) {
-  const labels = { ...DEFAULT_LABELS, ...labelsOverride };
+  const labels = { ...DEFAULT_LABELS2, ...labelsOverride };
   const selected = templates.find((template) => template.name === selectedTemplateName);
   function handleSelect(name) {
     const template = templates.find((t) => t.name === name);
@@ -1396,16 +1296,16 @@ function WhatsAppTemplateSettingsForm({
     }
     onVariablesChange([...variables, token]);
   }
-  return /* @__PURE__ */ jsxs13("section", { className: "bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden", children: [
-    /* @__PURE__ */ jsxs13("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: [
-      /* @__PURE__ */ jsx16("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: labels.sectionTitle }),
-      /* @__PURE__ */ jsx16("p", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1", children: labels.sectionDescription })
+  return /* @__PURE__ */ jsxs12("section", { className: "bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden", children: [
+    /* @__PURE__ */ jsxs12("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: [
+      /* @__PURE__ */ jsx14("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: labels.sectionTitle }),
+      /* @__PURE__ */ jsx14("p", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1", children: labels.sectionDescription })
     ] }),
-    /* @__PURE__ */ jsxs13("form", { onSubmit: onSave, className: "p-6 space-y-4", children: [
-      /* @__PURE__ */ jsxs13("div", { children: [
-        /* @__PURE__ */ jsxs13("div", { className: "flex items-center justify-between mb-1.5", children: [
-          /* @__PURE__ */ jsx16("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.templateLabel }),
-          /* @__PURE__ */ jsxs13(
+    /* @__PURE__ */ jsxs12("form", { onSubmit: onSave, className: "p-6 space-y-4", children: [
+      /* @__PURE__ */ jsxs12("div", { children: [
+        /* @__PURE__ */ jsxs12("div", { className: "flex items-center justify-between mb-1.5", children: [
+          /* @__PURE__ */ jsx14("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.templateLabel }),
+          /* @__PURE__ */ jsxs12(
             "button",
             {
               type: "button",
@@ -1413,31 +1313,31 @@ function WhatsAppTemplateSettingsForm({
               disabled: loadingTemplates,
               className: "flex items-center gap-1 text-xs text-blue-600 dark:text-blue-400 hover:underline disabled:opacity-50",
               children: [
-                /* @__PURE__ */ jsx16(RefreshCw, { size: 11, className: loadingTemplates ? "animate-spin" : "" }),
+                /* @__PURE__ */ jsx14(RefreshCw, { size: 11, className: loadingTemplates ? "animate-spin" : "" }),
                 labels.refreshList
               ]
             }
           )
         ] }),
-        templatesError && /* @__PURE__ */ jsxs13("div", { className: "mb-2 rounded-lg bg-amber-50 dark:bg-amber-950/40 border border-amber-200 dark:border-amber-800 px-3 py-2 text-xs text-amber-700 dark:text-amber-400", children: [
+        templatesError && /* @__PURE__ */ jsxs12("div", { className: "mb-2 rounded-lg bg-amber-50 dark:bg-amber-950/40 border border-amber-200 dark:border-amber-800 px-3 py-2 text-xs text-amber-700 dark:text-amber-400", children: [
           labels.errorLoading,
-          /* @__PURE__ */ jsx16("br", {}),
-          /* @__PURE__ */ jsxs13("span", { className: "text-gray-500 dark:text-gray-400 mt-0.5 block", children: [
+          /* @__PURE__ */ jsx14("br", {}),
+          /* @__PURE__ */ jsxs12("span", { className: "text-gray-500 dark:text-gray-400 mt-0.5 block", children: [
             labels.currentNameSaved,
             " ",
-            /* @__PURE__ */ jsx16("strong", { children: selectedTemplateName || "\u2014" })
+            /* @__PURE__ */ jsx14("strong", { children: selectedTemplateName || "\u2014" })
           ] })
         ] }),
-        loadingTemplates && /* @__PURE__ */ jsx16("div", { className: "h-10 rounded-xl bg-gray-100 dark:bg-gray-700 animate-pulse" }),
-        !loadingTemplates && !templatesError && /* @__PURE__ */ jsxs13(
+        loadingTemplates && /* @__PURE__ */ jsx14("div", { className: "h-10 rounded-xl bg-gray-100 dark:bg-gray-700 animate-pulse" }),
+        !loadingTemplates && !templatesError && /* @__PURE__ */ jsxs12(
           "select",
           {
             value: selectedTemplateName,
             onChange: (e) => handleSelect(e.target.value),
             className: "w-full border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100 rounded-xl px-3 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all",
             children: [
-              /* @__PURE__ */ jsx16("option", { value: "", children: labels.selectPlaceholder }),
-              templates.map((template) => /* @__PURE__ */ jsxs13("option", { value: template.name, disabled: template.status !== "APPROVED", children: [
+              /* @__PURE__ */ jsx14("option", { value: "", children: labels.selectPlaceholder }),
+              templates.map((template) => /* @__PURE__ */ jsxs12("option", { value: template.name, disabled: template.status !== "APPROVED", children: [
                 template.displayName,
                 " \xB7 ",
                 template.shortId,
@@ -1449,27 +1349,27 @@ function WhatsAppTemplateSettingsForm({
             ]
           }
         ),
-        selected?.bodyText && /* @__PURE__ */ jsx16("div", { className: "mt-2 rounded-lg bg-gray-50 dark:bg-gray-700/50 border border-gray-200 dark:border-gray-600 px-3 py-2 text-xs text-gray-600 dark:text-gray-300 whitespace-pre-wrap", children: selected.bodyText })
+        selected?.bodyText && /* @__PURE__ */ jsx14("div", { className: "mt-2 rounded-lg bg-gray-50 dark:bg-gray-700/50 border border-gray-200 dark:border-gray-600 px-3 py-2 text-xs text-gray-600 dark:text-gray-300 whitespace-pre-wrap", children: selected.bodyText })
       ] }),
-      /* @__PURE__ */ jsxs13("div", { children: [
-        /* @__PURE__ */ jsxs13("div", { className: "flex items-center justify-between mb-1.5", children: [
-          /* @__PURE__ */ jsx16("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.variablesLabel }),
-          /* @__PURE__ */ jsxs13(
+      /* @__PURE__ */ jsxs12("div", { children: [
+        /* @__PURE__ */ jsxs12("div", { className: "flex items-center justify-between mb-1.5", children: [
+          /* @__PURE__ */ jsx14("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.variablesLabel }),
+          /* @__PURE__ */ jsxs12(
             "button",
             {
               type: "button",
               onClick: () => onVariablesChange([...variables, ""]),
               className: "flex items-center gap-1 text-xs text-blue-600 dark:text-blue-400 hover:underline",
               children: [
-                /* @__PURE__ */ jsx16(Plus, { size: 12 }),
+                /* @__PURE__ */ jsx14(Plus, { size: 12 }),
                 labels.addVariable
               ]
             }
           )
         ] }),
-        availableVariables.length > 0 && /* @__PURE__ */ jsxs13("div", { className: "mb-3 rounded-lg border border-gray-200 dark:border-gray-600 bg-gray-50 dark:bg-gray-700/40 p-2.5", children: [
-          /* @__PURE__ */ jsx16("p", { className: "text-xs font-medium text-gray-600 dark:text-gray-300 mb-1.5", children: labels.variablesAvailableTitle }),
-          /* @__PURE__ */ jsx16("div", { className: "flex flex-wrap gap-1.5", children: availableVariables.map((available) => /* @__PURE__ */ jsxs13(
+        availableVariables.length > 0 && /* @__PURE__ */ jsxs12("div", { className: "mb-3 rounded-lg border border-gray-200 dark:border-gray-600 bg-gray-50 dark:bg-gray-700/40 p-2.5", children: [
+          /* @__PURE__ */ jsx14("p", { className: "text-xs font-medium text-gray-600 dark:text-gray-300 mb-1.5", children: labels.variablesAvailableTitle }),
+          /* @__PURE__ */ jsx14("div", { className: "flex flex-wrap gap-1.5", children: availableVariables.map((available) => /* @__PURE__ */ jsxs12(
             "button",
             {
               type: "button",
@@ -1477,8 +1377,8 @@ function WhatsAppTemplateSettingsForm({
               title: `Inserir ${available.token}`,
               className: "inline-flex items-center gap-1 rounded-md border border-gray-200 dark:border-gray-600 bg-white dark:bg-gray-800 px-2 py-1 text-xs hover:border-blue-400 dark:hover:border-blue-500 transition-colors",
               children: [
-                /* @__PURE__ */ jsx16("code", { className: "text-blue-600 dark:text-blue-300", children: available.token }),
-                /* @__PURE__ */ jsxs13("span", { className: "text-gray-400 dark:text-gray-500", children: [
+                /* @__PURE__ */ jsx14("code", { className: "text-blue-600 dark:text-blue-300", children: available.token }),
+                /* @__PURE__ */ jsxs12("span", { className: "text-gray-400 dark:text-gray-500", children: [
                   "\xB7 ",
                   available.label
                 ] })
@@ -1486,13 +1386,13 @@ function WhatsAppTemplateSettingsForm({
             },
             available.token
           )) }),
-          /* @__PURE__ */ jsx16("p", { className: "mt-1.5 text-[11px] text-gray-400 dark:text-gray-500", children: labels.variablesAvailableHint })
+          /* @__PURE__ */ jsx14("p", { className: "mt-1.5 text-[11px] text-gray-400 dark:text-gray-500", children: labels.variablesAvailableHint })
         ] }),
-        /* @__PURE__ */ jsx16("p", { className: "text-xs text-gray-400 dark:text-gray-500 mb-2", children: labels.variablesMappingHint }),
-        variables.length === 0 && /* @__PURE__ */ jsx16("p", { className: "text-xs text-gray-400 dark:text-gray-500 italic", children: labels.noVariables }),
-        /* @__PURE__ */ jsx16("div", { className: "space-y-2", children: variables.map((variable, index) => /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx16("span", { className: "text-xs text-gray-400 dark:text-gray-500 w-6 text-right flex-shrink-0", children: `{{${index + 1}}}` }),
-          /* @__PURE__ */ jsx16(
+        /* @__PURE__ */ jsx14("p", { className: "text-xs text-gray-400 dark:text-gray-500 mb-2", children: labels.variablesMappingHint }),
+        variables.length === 0 && /* @__PURE__ */ jsx14("p", { className: "text-xs text-gray-400 dark:text-gray-500 italic", children: labels.noVariables }),
+        /* @__PURE__ */ jsx14("div", { className: "space-y-2", children: variables.map((variable, index) => /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsx14("span", { className: "text-xs text-gray-400 dark:text-gray-500 w-6 text-right flex-shrink-0", children: `{{${index + 1}}}` }),
+          /* @__PURE__ */ jsx14(
             "input",
             {
               type: "text",
@@ -1502,27 +1402,27 @@ function WhatsAppTemplateSettingsForm({
               className: "flex-1 border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100 rounded-lg px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all placeholder:text-gray-400 dark:placeholder:text-gray-500"
             }
           ),
-          /* @__PURE__ */ jsx16(
+          /* @__PURE__ */ jsx14(
             "button",
             {
               type: "button",
               onClick: () => removeVariable(index),
               className: "text-gray-400 hover:text-red-500 dark:hover:text-red-400 transition-colors flex-shrink-0",
               title: labels.removeVariable,
-              children: /* @__PURE__ */ jsx16(Trash2, { size: 14 })
+              children: /* @__PURE__ */ jsx14(Trash2, { size: 14 })
             }
           )
         ] }, index)) })
       ] }),
-      saveSuccess && /* @__PURE__ */ jsx16("div", { className: "bg-green-50 dark:bg-green-950/40 border border-green-200 dark:border-green-800 rounded-xl px-4 py-3 text-sm text-green-700 dark:text-green-400", children: labels.saveSuccess }),
-      /* @__PURE__ */ jsx16("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs13(
+      saveSuccess && /* @__PURE__ */ jsx14("div", { className: "bg-green-50 dark:bg-green-950/40 border border-green-200 dark:border-green-800 rounded-xl px-4 py-3 text-sm text-green-700 dark:text-green-400", children: labels.saveSuccess }),
+      /* @__PURE__ */ jsx14("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs12(
         "button",
         {
           type: "submit",
           disabled: saving || !selectedTemplateName.trim(),
           className: "flex items-center gap-2 bg-blue-600 hover:bg-blue-700 disabled:bg-blue-400 text-white font-semibold px-5 py-2.5 rounded-xl transition-colors text-sm",
           children: [
-            saving ? /* @__PURE__ */ jsx16("span", { className: "w-4 h-4 border-2 border-white/40 border-t-white rounded-full animate-spin" }) : /* @__PURE__ */ jsx16(Save, { size: 14 }),
+            saving ? /* @__PURE__ */ jsx14("span", { className: "w-4 h-4 border-2 border-white/40 border-t-white rounded-full animate-spin" }) : /* @__PURE__ */ jsx14(Save, { size: 14 }),
             saving ? labels.saving : labels.save
           ]
         }
@@ -1533,12 +1433,13 @@ function WhatsAppTemplateSettingsForm({
 
 // src/settings/WhatsAppCreateTemplateForm.tsx
 import { SendHorizonal } from "lucide-react";
-import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
-var DEFAULT_LABELS2 = {
+import { jsx as jsx15, jsxs as jsxs13 } from "react/jsx-runtime";
+var DEFAULT_LABELS3 = {
   sectionTitle: "Criar novo template",
   sectionDescription: "Envia um template para aprova\xE7\xE3o da Meta.",
   nameLabel: "Nome do template",
   nameHint: "Somente letras min\xFAsculas, n\xFAmeros e underscore.",
+  namePlaceholder: "reengajamento_cliente",
   categoryLabel: "Categoria",
   languageLabel: "Idioma",
   headerLabel: "Cabe\xE7alho",
@@ -1584,82 +1485,82 @@ function WhatsAppCreateTemplateForm({
   labels: labelsOverride,
   variableExamples = DEFAULT_VARIABLE_EXAMPLES
 }) {
-  const labels = { ...DEFAULT_LABELS2, ...labelsOverride };
+  const labels = { ...DEFAULT_LABELS3, ...labelsOverride };
   const detectedVariables = detectVariables(value.bodyText);
   function set(key, next) {
     onChange({ ...value, [key]: next });
   }
-  return /* @__PURE__ */ jsxs14("section", { className: "bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden", children: [
-    /* @__PURE__ */ jsxs14("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: [
-      /* @__PURE__ */ jsx17("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: labels.sectionTitle }),
-      /* @__PURE__ */ jsx17("p", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1", children: labels.sectionDescription })
+  return /* @__PURE__ */ jsxs13("section", { className: "bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden", children: [
+    /* @__PURE__ */ jsxs13("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: [
+      /* @__PURE__ */ jsx15("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: labels.sectionTitle }),
+      /* @__PURE__ */ jsx15("p", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1", children: labels.sectionDescription })
     ] }),
-    /* @__PURE__ */ jsxs14("form", { onSubmit, className: "p-6 space-y-4", children: [
-      /* @__PURE__ */ jsxs14("div", { children: [
-        /* @__PURE__ */ jsx17("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.nameLabel }),
-        /* @__PURE__ */ jsx17("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.nameHint }),
-        /* @__PURE__ */ jsx17(
+    /* @__PURE__ */ jsxs13("form", { onSubmit, className: "p-6 space-y-4", children: [
+      /* @__PURE__ */ jsxs13("div", { children: [
+        /* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.nameLabel }),
+        /* @__PURE__ */ jsx15("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.nameHint }),
+        /* @__PURE__ */ jsx15(
           "input",
           {
             type: "text",
             value: value.name,
             onChange: (e) => set("name", e.target.value.toLowerCase().replace(/[^a-z0-9_]/g, "_")),
-            placeholder: "reengajamento_cliente",
+            placeholder: labels.namePlaceholder,
             className: "w-full border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100 rounded-xl px-3 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all",
             required: true
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs14("div", { className: "grid grid-cols-2 gap-3", children: [
-        /* @__PURE__ */ jsxs14("div", { children: [
-          /* @__PURE__ */ jsx17("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.categoryLabel }),
-          /* @__PURE__ */ jsxs14(
+      /* @__PURE__ */ jsxs13("div", { className: "grid grid-cols-2 gap-3", children: [
+        /* @__PURE__ */ jsxs13("div", { children: [
+          /* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.categoryLabel }),
+          /* @__PURE__ */ jsxs13(
             "select",
             {
               value: value.category,
               onChange: (e) => set("category", e.target.value),
               className: "w-full border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100 rounded-xl px-3 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all",
               children: [
-                /* @__PURE__ */ jsx17("option", { value: "UTILITY", children: "UTILITY (Transacional)" }),
-                /* @__PURE__ */ jsx17("option", { value: "MARKETING", children: "MARKETING (Promocional)" })
+                /* @__PURE__ */ jsx15("option", { value: "UTILITY", children: "UTILITY (Transacional)" }),
+                /* @__PURE__ */ jsx15("option", { value: "MARKETING", children: "MARKETING (Promocional)" })
               ]
             }
           )
         ] }),
-        /* @__PURE__ */ jsxs14("div", { children: [
-          /* @__PURE__ */ jsx17("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.languageLabel }),
-          /* @__PURE__ */ jsxs14(
+        /* @__PURE__ */ jsxs13("div", { children: [
+          /* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.languageLabel }),
+          /* @__PURE__ */ jsxs13(
             "select",
             {
               value: value.language,
               onChange: (e) => set("language", e.target.value),
               className: "w-full border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100 rounded-xl px-3 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400 focus:border-transparent transition-all",
               children: [
-                /* @__PURE__ */ jsx17("option", { value: "pt_BR", children: "Portugu\xEAs (Brasil)" }),
-                /* @__PURE__ */ jsx17("option", { value: "en_US", children: "Ingl\xEAs (EUA)" }),
-                /* @__PURE__ */ jsx17("option", { value: "es_ES", children: "Espanhol" })
+                /* @__PURE__ */ jsx15("option", { value: "pt_BR", children: "Portugu\xEAs (Brasil)" }),
+                /* @__PURE__ */ jsx15("option", { value: "en_US", children: "Ingl\xEAs (EUA)" }),
+                /* @__PURE__ */ jsx15("option", { value: "es_ES", children: "Espanhol" })
               ]
             }
           )
         ] })
       ] }),
-      /* @__PURE__ */ jsxs14("div", { children: [
-        /* @__PURE__ */ jsx17("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.headerLabel }),
-        /* @__PURE__ */ jsx17("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.headerHint }),
-        /* @__PURE__ */ jsxs14("div", { className: "flex gap-2", children: [
-          /* @__PURE__ */ jsxs14(
+      /* @__PURE__ */ jsxs13("div", { children: [
+        /* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.headerLabel }),
+        /* @__PURE__ */ jsx15("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.headerHint }),
+        /* @__PURE__ */ jsxs13("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ jsxs13(
             "select",
             {
               value: value.headerType,
               onChange: (e) => set("headerType", e.target.value),
               className: "border border-gray-200 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-100 rounded-xl px-3 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-400 transition-all",
               children: [
-                /* @__PURE__ */ jsx17("option", { value: "NONE", children: labels.headerNone }),
-                /* @__PURE__ */ jsx17("option", { value: "TEXT", children: labels.headerText })
+                /* @__PURE__ */ jsx15("option", { value: "NONE", children: labels.headerNone }),
+                /* @__PURE__ */ jsx15("option", { value: "TEXT", children: labels.headerText })
               ]
             }
           ),
-          value.headerType === "TEXT" && /* @__PURE__ */ jsx17(
+          value.headerType === "TEXT" && /* @__PURE__ */ jsx15(
             "input",
             {
               type: "text",
@@ -1672,10 +1573,10 @@ function WhatsAppCreateTemplateForm({
           )
         ] })
       ] }),
-      /* @__PURE__ */ jsxs14("div", { children: [
-        /* @__PURE__ */ jsx17("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.bodyLabel }),
-        /* @__PURE__ */ jsx17("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.bodyHint }),
-        /* @__PURE__ */ jsx17(
+      /* @__PURE__ */ jsxs13("div", { children: [
+        /* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.bodyLabel }),
+        /* @__PURE__ */ jsx15("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.bodyHint }),
+        /* @__PURE__ */ jsx15(
           "textarea",
           {
             value: value.bodyText,
@@ -1686,26 +1587,26 @@ function WhatsAppCreateTemplateForm({
             required: true
           }
         ),
-        detectedVariables.length > 0 && /* @__PURE__ */ jsxs14("div", { className: "mt-2 rounded-lg bg-gray-50 dark:bg-gray-700/50 border border-gray-200 dark:border-gray-600 px-3 py-2", children: [
-          /* @__PURE__ */ jsx17("p", { className: "font-medium text-gray-500 dark:text-gray-400 mb-1.5 uppercase tracking-wide text-xs", children: labels.detectedVariables }),
-          /* @__PURE__ */ jsx17("div", { className: "flex flex-wrap gap-2", children: detectedVariables.map((num) => /* @__PURE__ */ jsxs14("span", { className: "inline-flex items-center gap-1 text-xs", children: [
-            /* @__PURE__ */ jsx17("code", { className: "bg-blue-100 dark:bg-blue-900/40 text-blue-700 dark:text-blue-300 px-1.5 py-0.5 rounded font-mono", children: `{{${num}}}` }),
-            /* @__PURE__ */ jsxs14("span", { className: "text-gray-400 dark:text-gray-500", children: [
+        detectedVariables.length > 0 && /* @__PURE__ */ jsxs13("div", { className: "mt-2 rounded-lg bg-gray-50 dark:bg-gray-700/50 border border-gray-200 dark:border-gray-600 px-3 py-2", children: [
+          /* @__PURE__ */ jsx15("p", { className: "font-medium text-gray-500 dark:text-gray-400 mb-1.5 uppercase tracking-wide text-xs", children: labels.detectedVariables }),
+          /* @__PURE__ */ jsx15("div", { className: "flex flex-wrap gap-2", children: detectedVariables.map((num) => /* @__PURE__ */ jsxs13("span", { className: "inline-flex items-center gap-1 text-xs", children: [
+            /* @__PURE__ */ jsx15("code", { className: "bg-blue-100 dark:bg-blue-900/40 text-blue-700 dark:text-blue-300 px-1.5 py-0.5 rounded font-mono", children: `{{${num}}}` }),
+            /* @__PURE__ */ jsxs13("span", { className: "text-gray-400 dark:text-gray-500", children: [
               "= ",
               variableExamples[Number(num) - 1] ?? labels.variableLabel(Number(num))
             ] })
           ] }, num)) }),
-          /* @__PURE__ */ jsxs14("p", { className: "text-gray-400 dark:text-gray-500 mt-1.5 text-xs", children: [
+          /* @__PURE__ */ jsxs13("p", { className: "text-gray-400 dark:text-gray-500 mt-1.5 text-xs", children: [
             labels.configureHintPrefix,
-            /* @__PURE__ */ jsx17("strong", { children: labels.configureHintLink }),
+            /* @__PURE__ */ jsx15("strong", { children: labels.configureHintLink }),
             labels.configureHintSuffix
           ] })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs14("div", { children: [
-        /* @__PURE__ */ jsx17("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.footerLabel }),
-        /* @__PURE__ */ jsx17("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.footerHint }),
-        /* @__PURE__ */ jsx17(
+      /* @__PURE__ */ jsxs13("div", { children: [
+        /* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.footerLabel }),
+        /* @__PURE__ */ jsx15("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.footerHint }),
+        /* @__PURE__ */ jsx15(
           "input",
           {
             type: "text",
@@ -1717,48 +1618,48 @@ function WhatsAppCreateTemplateForm({
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs14("div", { children: [
-        /* @__PURE__ */ jsx17("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300 mb-2 block", children: labels.previewLabel }),
-        /* @__PURE__ */ jsxs14("div", { className: "rounded-2xl bg-[#e5ddd5] dark:bg-[#1a1a2e] border border-gray-300 dark:border-gray-600 overflow-hidden shadow-inner", children: [
-          /* @__PURE__ */ jsxs14("div", { className: "bg-[#075e54] px-4 py-2.5 flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx17("div", { className: "w-8 h-8 rounded-full bg-white/20 flex items-center justify-center text-white text-xs font-bold", children: previewCompanyName.slice(0, 2).toUpperCase() }),
-            /* @__PURE__ */ jsxs14("div", { children: [
-              /* @__PURE__ */ jsx17("p", { className: "text-white text-xs font-semibold leading-tight", children: previewCompanyName }),
-              /* @__PURE__ */ jsx17("p", { className: "text-white/60 text-xs", children: labels.previewOnline })
+      /* @__PURE__ */ jsxs13("div", { children: [
+        /* @__PURE__ */ jsx15("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300 mb-2 block", children: labels.previewLabel }),
+        /* @__PURE__ */ jsxs13("div", { className: "rounded-2xl bg-[#e5ddd5] dark:bg-[#1a1a2e] border border-gray-300 dark:border-gray-600 overflow-hidden shadow-inner", children: [
+          /* @__PURE__ */ jsxs13("div", { className: "bg-[#075e54] px-4 py-2.5 flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx15("div", { className: "w-8 h-8 rounded-full bg-white/20 flex items-center justify-center text-white text-xs font-bold", children: previewCompanyName.slice(0, 2).toUpperCase() }),
+            /* @__PURE__ */ jsxs13("div", { children: [
+              /* @__PURE__ */ jsx15("p", { className: "text-white text-xs font-semibold leading-tight", children: previewCompanyName }),
+              /* @__PURE__ */ jsx15("p", { className: "text-white/60 text-xs", children: labels.previewOnline })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs14("div", { className: "px-3 py-4 space-y-3", style: { minHeight: "120px" }, children: [
-            /* @__PURE__ */ jsx17("div", { className: "flex justify-start", style: { maxWidth: "85%" }, children: /* @__PURE__ */ jsxs14("div", { className: "bg-white dark:bg-gray-700 rounded-lg rounded-tl-none px-3 py-2 shadow-sm", children: [
-              /* @__PURE__ */ jsx17("p", { className: "text-gray-500 dark:text-gray-400 leading-tight text-sm", children: labels.previewDescription }),
-              /* @__PURE__ */ jsx17("p", { className: "text-gray-400 dark:text-gray-500 mt-1 text-right text-[9px]", children: "12:00" })
+          /* @__PURE__ */ jsxs13("div", { className: "px-3 py-4 space-y-3", style: { minHeight: "120px" }, children: [
+            /* @__PURE__ */ jsx15("div", { className: "flex justify-start", style: { maxWidth: "85%" }, children: /* @__PURE__ */ jsxs13("div", { className: "bg-white dark:bg-gray-700 rounded-lg rounded-tl-none px-3 py-2 shadow-sm", children: [
+              /* @__PURE__ */ jsx15("p", { className: "text-gray-500 dark:text-gray-400 leading-tight text-sm", children: labels.previewDescription }),
+              /* @__PURE__ */ jsx15("p", { className: "text-gray-400 dark:text-gray-500 mt-1 text-right text-[9px]", children: "12:00" })
             ] }) }),
-            /* @__PURE__ */ jsx17("div", { className: "flex justify-end ml-auto", style: { maxWidth: "85%" }, children: /* @__PURE__ */ jsxs14("div", { className: "bg-[#dcf8c6] dark:bg-[#1b5e20] rounded-lg rounded-tr-none px-3 py-2 shadow-sm", children: [
-              value.headerType === "TEXT" && value.headerText && /* @__PURE__ */ jsx17("p", { className: "text-xs font-bold text-gray-700 dark:text-gray-200 mb-1", children: fillPreviewTokens(value.headerText) || labels.previewHeaderFallback }),
-              /* @__PURE__ */ jsx17("p", { className: "text-sm text-gray-800 dark:text-gray-100 leading-relaxed", children: value.bodyText ? fillPreviewTokens(value.bodyText) : /* @__PURE__ */ jsx17("span", { className: "text-gray-400 italic", children: labels.previewBodyPlaceholder }) }),
-              value.footerText && /* @__PURE__ */ jsx17("p", { className: "text-gray-400 dark:text-gray-400 mt-1 text-xs", children: value.footerText }),
-              /* @__PURE__ */ jsx17("p", { className: "text-gray-400 dark:text-gray-400 mt-1 text-right text-[9px]", children: "12:01 \u2713" })
+            /* @__PURE__ */ jsx15("div", { className: "flex justify-end ml-auto", style: { maxWidth: "85%" }, children: /* @__PURE__ */ jsxs13("div", { className: "bg-[#dcf8c6] dark:bg-[#1b5e20] rounded-lg rounded-tr-none px-3 py-2 shadow-sm", children: [
+              value.headerType === "TEXT" && value.headerText && /* @__PURE__ */ jsx15("p", { className: "text-xs font-bold text-gray-700 dark:text-gray-200 mb-1", children: fillPreviewTokens(value.headerText) || labels.previewHeaderFallback }),
+              /* @__PURE__ */ jsx15("p", { className: "text-sm text-gray-800 dark:text-gray-100 leading-relaxed", children: value.bodyText ? fillPreviewTokens(value.bodyText) : /* @__PURE__ */ jsx15("span", { className: "text-gray-400 italic", children: labels.previewBodyPlaceholder }) }),
+              value.footerText && /* @__PURE__ */ jsx15("p", { className: "text-gray-400 dark:text-gray-400 mt-1 text-xs", children: value.footerText }),
+              /* @__PURE__ */ jsx15("p", { className: "text-gray-400 dark:text-gray-400 mt-1 text-right text-[9px]", children: "12:01 \u2713" })
             ] }) })
           ] })
         ] })
       ] }),
-      result && /* @__PURE__ */ jsxs14(
+      result && /* @__PURE__ */ jsxs13(
         "div",
         {
           className: `rounded-xl px-4 py-3 text-sm ${result.ok ? "bg-green-50 dark:bg-green-950/40 border border-green-200 dark:border-green-800 text-green-700 dark:text-green-400" : "bg-red-50 dark:bg-red-950/40 border border-red-200 dark:border-red-800 text-red-700 dark:text-red-400"}`,
           children: [
             result.message,
-            result.ok && result.status && /* @__PURE__ */ jsx17("p", { className: "text-xs mt-1 opacity-75", children: labels.successStatus(result.status) })
+            result.ok && result.status && /* @__PURE__ */ jsx15("p", { className: "text-xs mt-1 opacity-75", children: labels.successStatus(result.status) })
           ]
         }
       ),
-      /* @__PURE__ */ jsx17("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs14(
+      /* @__PURE__ */ jsx15("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs13(
         "button",
         {
           type: "submit",
           disabled: submitting || !value.name || !value.bodyText,
           className: "flex items-center gap-2 bg-emerald-600 hover:bg-emerald-700 disabled:bg-emerald-400 text-white font-semibold px-5 py-2.5 rounded-xl transition-colors text-sm",
           children: [
-            submitting ? /* @__PURE__ */ jsx17("span", { className: "w-4 h-4 border-2 border-white/40 border-t-white rounded-full animate-spin" }) : /* @__PURE__ */ jsx17(SendHorizonal, { size: 14 }),
+            submitting ? /* @__PURE__ */ jsx15("span", { className: "w-4 h-4 border-2 border-white/40 border-t-white rounded-full animate-spin" }) : /* @__PURE__ */ jsx15(SendHorizonal, { size: 14 }),
             submitting ? labels.sending : labels.sendForApproval
           ]
         }
@@ -1769,8 +1670,8 @@ function WhatsAppCreateTemplateForm({
 
 // src/settings/WelcomeFarewellForm.tsx
 import { LogOut, Mail, Save as Save2 } from "lucide-react";
-import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
-var DEFAULT_LABELS3 = {
+import { jsx as jsx16, jsxs as jsxs14 } from "react/jsx-runtime";
+var DEFAULT_LABELS4 = {
   sectionTitle: "Boas-vindas e encerramento",
   welcomeMessage: "Mensagem de boas-vindas",
   welcomeMessagePlaceholder: "Ol\xE1! Sou o assistente virtual da {empresa}...",
@@ -1796,16 +1697,16 @@ function WelcomeFarewellForm({
   farewellPlaceholders = DEFAULT_FAREWELL_PLACEHOLDERS,
   labels: labelsOverride
 }) {
-  const labels = { ...DEFAULT_LABELS3, ...labelsOverride };
-  return /* @__PURE__ */ jsxs15("section", { className: "bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden", children: [
-    /* @__PURE__ */ jsx18("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: /* @__PURE__ */ jsx18("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: labels.sectionTitle }) }),
-    /* @__PURE__ */ jsxs15("form", { onSubmit: onSave, className: "p-6 space-y-5", children: [
-      /* @__PURE__ */ jsxs15("div", { children: [
-        /* @__PURE__ */ jsxs15("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1.5 flex items-center gap-1.5", children: [
-          /* @__PURE__ */ jsx18(Mail, { size: 13, className: "text-blue-600 dark:text-blue-400" }),
+  const labels = { ...DEFAULT_LABELS4, ...labelsOverride };
+  return /* @__PURE__ */ jsxs14("section", { className: "bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden", children: [
+    /* @__PURE__ */ jsx16("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: /* @__PURE__ */ jsx16("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: labels.sectionTitle }) }),
+    /* @__PURE__ */ jsxs14("form", { onSubmit: onSave, className: "p-6 space-y-5", children: [
+      /* @__PURE__ */ jsxs14("div", { children: [
+        /* @__PURE__ */ jsxs14("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1.5 flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx16(Mail, { size: 13, className: "text-blue-600 dark:text-blue-400" }),
           labels.welcomeMessage
         ] }),
-        /* @__PURE__ */ jsx18(
+        /* @__PURE__ */ jsx16(
           WhatsAppMessageEditor,
           {
             value: welcomeMessage,
@@ -1814,14 +1715,14 @@ function WelcomeFarewellForm({
             placeholders: welcomePlaceholders
           }
         ),
-        /* @__PURE__ */ jsx18("p", { className: "mt-1.5 text-xs text-gray-500 dark:text-gray-400", children: labels.welcomeMessageHint })
+        /* @__PURE__ */ jsx16("p", { className: "mt-1.5 text-xs text-gray-500 dark:text-gray-400", children: labels.welcomeMessageHint })
       ] }),
-      /* @__PURE__ */ jsxs15("div", { children: [
-        /* @__PURE__ */ jsxs15("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1.5 flex items-center gap-1.5", children: [
-          /* @__PURE__ */ jsx18(LogOut, { size: 13, className: "text-blue-600 dark:text-blue-400" }),
+      /* @__PURE__ */ jsxs14("div", { children: [
+        /* @__PURE__ */ jsxs14("label", { className: "block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1.5 flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx16(LogOut, { size: 13, className: "text-blue-600 dark:text-blue-400" }),
           labels.farewellMessage
         ] }),
-        /* @__PURE__ */ jsx18(
+        /* @__PURE__ */ jsx16(
           WhatsAppMessageEditor,
           {
             value: farewellMessage,
@@ -1830,17 +1731,17 @@ function WelcomeFarewellForm({
             placeholders: farewellPlaceholders
           }
         ),
-        /* @__PURE__ */ jsx18("p", { className: "mt-1.5 text-xs text-gray-500 dark:text-gray-400", children: labels.farewellMessageHint })
+        /* @__PURE__ */ jsx16("p", { className: "mt-1.5 text-xs text-gray-500 dark:text-gray-400", children: labels.farewellMessageHint })
       ] }),
-      saveSuccess && /* @__PURE__ */ jsx18("div", { className: "bg-green-50 dark:bg-green-950/40 border border-green-200 dark:border-green-800 rounded-xl px-4 py-3 text-sm text-green-700 dark:text-green-400", children: labels.saveSuccess }),
-      /* @__PURE__ */ jsx18("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs15(
+      saveSuccess && /* @__PURE__ */ jsx16("div", { className: "bg-green-50 dark:bg-green-950/40 border border-green-200 dark:border-green-800 rounded-xl px-4 py-3 text-sm text-green-700 dark:text-green-400", children: labels.saveSuccess }),
+      /* @__PURE__ */ jsx16("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs14(
         "button",
         {
           type: "submit",
           disabled: saving,
           className: "flex items-center gap-2 bg-blue-600 hover:bg-blue-700 disabled:bg-blue-400 text-white font-semibold px-5 py-2.5 rounded-xl transition-colors text-sm",
           children: [
-            saving ? /* @__PURE__ */ jsx18("span", { className: "w-4 h-4 border-2 border-white/40 border-t-white rounded-full animate-spin" }) : /* @__PURE__ */ jsx18(Save2, { size: 14 }),
+            saving ? /* @__PURE__ */ jsx16("span", { className: "w-4 h-4 border-2 border-white/40 border-t-white rounded-full animate-spin" }) : /* @__PURE__ */ jsx16(Save2, { size: 14 }),
             saving ? labels.saving : labels.save
           ]
         }
@@ -1850,8 +1751,8 @@ function WelcomeFarewellForm({
 }
 
 // src/settings/WhatsAppTemplatesSettings.tsx
-import { useState as useState10 } from "react";
-import { jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
+import { useState as useState8 } from "react";
+import { jsx as jsx17, jsxs as jsxs15 } from "react/jsx-runtime";
 var TEMPLATE_SETTINGS_TAB = {
   SELECT: "select",
   CREATE: "create"
@@ -1866,10 +1767,10 @@ function WhatsAppTemplatesSettings({
   ...settingsProps
 }) {
   const labels = { ...DEFAULT_TEMPLATES_SETTINGS_LABELS, ...labelsOverride };
-  const [tab, setTab] = useState10(TEMPLATE_SETTINGS_TAB.SELECT);
-  return /* @__PURE__ */ jsxs16("div", { className: "space-y-4", children: [
-    /* @__PURE__ */ jsxs16("nav", { className: "flex gap-1 border-b", role: "tablist", children: [
-      /* @__PURE__ */ jsx19(
+  const [tab, setTab] = useState8(TEMPLATE_SETTINGS_TAB.SELECT);
+  return /* @__PURE__ */ jsxs15("div", { className: "space-y-4", children: [
+    /* @__PURE__ */ jsxs15("nav", { className: "flex gap-1 border-b", role: "tablist", children: [
+      /* @__PURE__ */ jsx17(
         "button",
         {
           type: "button",
@@ -1880,7 +1781,7 @@ function WhatsAppTemplatesSettings({
           children: labels.selectTab
         }
       ),
-      create ? /* @__PURE__ */ jsx19(
+      create ? /* @__PURE__ */ jsx17(
         "button",
         {
           type: "button",
@@ -1892,14 +1793,14 @@ function WhatsAppTemplatesSettings({
         }
       ) : null
     ] }),
-    tab === TEMPLATE_SETTINGS_TAB.SELECT ? /* @__PURE__ */ jsx19(WhatsAppTemplateSettingsForm, { ...settingsProps }) : create ? /* @__PURE__ */ jsx19(WhatsAppCreateTemplateForm, { ...create }) : null
+    tab === TEMPLATE_SETTINGS_TAB.SELECT ? /* @__PURE__ */ jsx17(WhatsAppTemplateSettingsForm, { ...settingsProps }) : create ? /* @__PURE__ */ jsx17(WhatsAppCreateTemplateForm, { ...create }) : null
   ] });
 }
 
 // src/settings/TopicsForm.tsx
 import { Megaphone, Save as Save3 } from "lucide-react";
-import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
-var DEFAULT_LABELS4 = {
+import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
+var DEFAULT_LABELS5 = {
   sectionTitle: "T\xF3picos intermedi\xE1rios",
   sectionDescription: "Mensagens autom\xE1ticas para assuntos espec\xEDficos, disparadas quando o cliente demonstra interesse.",
   messagePlaceholder: "Digite a mensagem autom\xE1tica para este t\xF3pico...",
@@ -1915,20 +1816,20 @@ function TopicsForm({
   saveSuccess = false,
   labels: labelsOverride
 }) {
-  const labels = { ...DEFAULT_LABELS4, ...labelsOverride };
-  return /* @__PURE__ */ jsxs17("section", { className: "bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden", children: [
-    /* @__PURE__ */ jsxs17("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: [
-      /* @__PURE__ */ jsxs17("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100 flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx20(Megaphone, { size: 16, className: "text-orange-600 dark:text-orange-400" }),
+  const labels = { ...DEFAULT_LABELS5, ...labelsOverride };
+  return /* @__PURE__ */ jsxs16("section", { className: "bg-white dark:bg-gray-800 rounded-xl border border-gray-200 dark:border-gray-700 overflow-hidden", children: [
+    /* @__PURE__ */ jsxs16("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: [
+      /* @__PURE__ */ jsxs16("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100 flex items-center gap-2", children: [
+        /* @__PURE__ */ jsx18(Megaphone, { size: 16, className: "text-orange-600 dark:text-orange-400" }),
         labels.sectionTitle
       ] }),
-      /* @__PURE__ */ jsx20("p", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1", children: labels.sectionDescription })
+      /* @__PURE__ */ jsx18("p", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1", children: labels.sectionDescription })
     ] }),
-    /* @__PURE__ */ jsxs17("form", { onSubmit: onSave, className: "p-6 space-y-6", children: [
-      topics.map((topic) => /* @__PURE__ */ jsxs17("div", { className: "space-y-2", children: [
-        /* @__PURE__ */ jsxs17("div", { className: "flex items-start gap-4", children: [
-          /* @__PURE__ */ jsx20("div", { className: "flex-1", children: /* @__PURE__ */ jsx20("p", { className: "text-sm font-medium text-gray-900 dark:text-gray-100", children: topic.label }) }),
-          /* @__PURE__ */ jsx20(
+    /* @__PURE__ */ jsxs16("form", { onSubmit: onSave, className: "p-6 space-y-6", children: [
+      topics.map((topic) => /* @__PURE__ */ jsxs16("div", { className: "space-y-2", children: [
+        /* @__PURE__ */ jsxs16("div", { className: "flex items-start gap-4", children: [
+          /* @__PURE__ */ jsx18("div", { className: "flex-1", children: /* @__PURE__ */ jsx18("p", { className: "text-sm font-medium text-gray-900 dark:text-gray-100", children: topic.label }) }),
+          /* @__PURE__ */ jsx18(
             "button",
             {
               type: "button",
@@ -1936,7 +1837,7 @@ function TopicsForm({
               className: `relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none ${topic.enabled ? "bg-blue-600 dark:bg-blue-500" : "bg-gray-200 dark:bg-gray-700"}`,
               role: "switch",
               "aria-checked": topic.enabled,
-              children: /* @__PURE__ */ jsx20(
+              children: /* @__PURE__ */ jsx18(
                 "span",
                 {
                   className: `pointer-events-none inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out ${topic.enabled ? "translate-x-5" : "translate-x-0"}`
@@ -1945,7 +1846,7 @@ function TopicsForm({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx20(
+        /* @__PURE__ */ jsx18(
           "textarea",
           {
             value: topic.message,
@@ -1957,27 +1858,27 @@ function TopicsForm({
           }
         )
       ] }, topic.key)),
-      /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-3", children: [
-        /* @__PURE__ */ jsxs17(
+      /* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsxs16(
           "button",
           {
             type: "submit",
             disabled: saving,
             className: "inline-flex items-center gap-2 rounded-lg bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-700 disabled:opacity-50",
             children: [
-              /* @__PURE__ */ jsx20(Save3, { size: 14 }),
+              /* @__PURE__ */ jsx18(Save3, { size: 14 }),
               labels.saveButton
             ]
           }
         ),
-        saveSuccess && /* @__PURE__ */ jsx20("span", { className: "text-sm text-green-600 dark:text-green-400", children: labels.saveSuccess })
+        saveSuccess && /* @__PURE__ */ jsx18("span", { className: "text-sm text-green-600 dark:text-green-400", children: labels.saveSuccess })
       ] })
     ] })
   ] });
 }
 
 // src/hooks/useConversationMessages.ts
-import { useCallback as useCallback5 } from "react";
+import { useCallback as useCallback4 } from "react";
 function useConversationMessages(conversationId, params) {
   const context = useConversations();
   if (!context) {
@@ -1988,7 +1889,7 @@ function useConversationMessages(conversationId, params) {
     () => api.fetchMessages(conversationId, params),
     [conversationId, params?.limit, params?.before]
   );
-  const sendMessage = useCallback5(
+  const sendMessage = useCallback4(
     async (text) => {
       const message = await api.sendMessage(conversationId, text);
       await refetch();
@@ -1996,7 +1897,7 @@ function useConversationMessages(conversationId, params) {
     },
     [api, conversationId, refetch]
   );
-  const sendMedia = useCallback5(
+  const sendMedia = useCallback4(
     async (mediaData) => {
       const message = await api.sendMedia(conversationId, mediaData);
       await refetch();
@@ -2004,14 +1905,14 @@ function useConversationMessages(conversationId, params) {
     },
     [api, conversationId, refetch]
   );
-  const sendTemplate = useCallback5(
+  const sendTemplate = useCallback4(
     async (templateData) => {
       await api.sendTemplate(conversationId, templateData);
       await refetch();
     },
     [api, conversationId, refetch]
   );
-  const markRead = useCallback5(() => api.markRead(conversationId), [api, conversationId]);
+  const markRead = useCallback4(() => api.markRead(conversationId), [api, conversationId]);
   return { messages: data ?? [], loading, error, refetch, sendMessage, sendMedia, sendTemplate, markRead };
 }
 
@@ -2022,11 +1923,15 @@ function useConversationList(params) {
     throw new Error("useConversationList requires an ancestor <ConversationsProvider>");
   }
   const { api } = context;
+  const filtersKey = JSON.stringify(params?.filters ?? {});
   const { data, loading, error, refetch } = useAsyncResource(
     () => api.fetchConversations(params),
-    [params?.page, params?.limit, params?.waitingHuman, params?.search]
+    [params?.page, params?.limit, params?.waitingHuman, params?.search, filtersKey]
   );
-  return { conversations: data ?? [], loading, error, refetch };
+  if (data === void 0) {
+    return { conversations: [], total: 0, loading, error, refetch };
+  }
+  return { conversations: conversationsOf(data), total: totalOf(data), loading, error, refetch };
 }
 
 // src/hooks/useConversationContext.ts
@@ -2041,12 +1946,12 @@ function useConversationContext(conversationId) {
 }
 
 // src/hooks/useConversationRealtime.ts
-import { useEffect as useEffect6, useRef as useRef5 } from "react";
+import { useEffect as useEffect5, useRef as useRef4 } from "react";
 function useConversationRealtime(conversationId, onEvent) {
   const context = useConversations();
-  const onEventRef = useRef5(onEvent);
+  const onEventRef = useRef4(onEvent);
   onEventRef.current = onEvent;
-  useEffect6(() => {
+  useEffect5(() => {
     if (!context || !conversationId) return;
     const source = context.sse.connectConversationStream(conversationId);
     const handler = (event) => onEventRef.current(event);
@@ -2059,9 +1964,9 @@ function useConversationRealtime(conversationId, onEvent) {
 }
 function useGlobalRealtime(onEvent) {
   const context = useConversations();
-  const onEventRef = useRef5(onEvent);
+  const onEventRef = useRef4(onEvent);
   onEventRef.current = onEvent;
-  useEffect6(() => {
+  useEffect5(() => {
     if (!context) return;
     const source = context.sse.connectGlobalStream();
     const handler = (event) => onEventRef.current(event);
@@ -2072,6 +1977,38 @@ function useGlobalRealtime(onEvent) {
     };
   }, [context]);
 }
+
+// src/hooks/useConversationActions.ts
+import { useMemo as useMemo2 } from "react";
+function useConversationActions(conversationId) {
+  const context = useConversations();
+  if (!context) {
+    throw new Error("useConversationActions requires an ancestor <ConversationsProvider>");
+  }
+  const { api } = context;
+  return useMemo2(
+    () => ({
+      takeover: api.takeover ? () => api.takeover(conversationId) : void 0,
+      release: api.release ? () => api.release(conversationId) : void 0,
+      finalize: api.finalize ? () => api.finalize(conversationId) : void 0
+    }),
+    [api, conversationId]
+  );
+}
+function useInboxActions() {
+  const context = useConversations();
+  if (!context) {
+    throw new Error("useInboxActions requires an ancestor <ConversationsProvider>");
+  }
+  const { api } = context;
+  return useMemo2(
+    () => ({
+      markAllRead: api.markAllRead ? () => api.markAllRead() : void 0,
+      listTemplates: api.listTemplates ? () => api.listTemplates() : void 0
+    }),
+    [api]
+  );
+}
 export {
   AudioPlayer,
   Avatar,
@@ -2089,13 +2026,21 @@ export {
   ConversationRow,
   ConversationWallpaper,
   ConversationsProvider,
+  DEFAULT_AVATAR_LABELS,
   DEFAULT_CONVERSATION_CHANNEL,
   DEFAULT_CONVERSATION_CONTEXT_LABELS,
   DEFAULT_CONVERSATION_DOCUMENTS_LABELS,
   DEFAULT_CONVERSATION_HEADER_LABELS,
+  DEFAULT_CONVERSATION_LIST_ITEM_LABELS,
+  DEFAULT_DOCUMENTS_LIBRARY_LABELS,
+  DEFAULT_LIGHTBOX_LABELS,
+  DEFAULT_MESSAGE_COMPOSER_LABELS,
   DEFAULT_TEMPLATES_SETTINGS_LABELS,
+  DEFAULT_WHATSAPP_MESSAGE_EDITOR_LABELS,
   DEFAULT_WINDOW_EXPIRED_LABELS,
+  DOCUMENT_SOURCE_FILTER,
   DateDivider,
+  DocumentsLibrary,
   EmojiPicker,
   FileIcon,
   HANDLE_KIND,
@@ -2125,17 +2070,21 @@ export {
   capabilitiesOf,
   channelFiltersFor,
   contactFlag,
+  createMediaUrlResolver,
   downloadTextFile,
   formatContactHandle,
+  formatDateTime,
   formatFileSize,
   formatPhone,
   formatStalledFor,
   formatTimestamp,
   htmlToWA,
+  isSameDay,
   isWindowBlocking,
   parseWhatsAppFormatting,
   phoneInitials,
   toast,
+  useConversationActions,
   useConversationContext,
   useConversationDocuments,
   useConversationList,
@@ -2145,6 +2094,7 @@ export {
   useConversations,
   useDarkMode,
   useGlobalRealtime,
+  useInboxActions,
   useIsDarkTheme,
   useIsNarrow,
   useToast,