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

package/dist/index.js

@@ -1,652 +1,35 @@
+import {
+  useDarkMode,
+  useIsDarkTheme
+} from "./chunk-NV2RZ5KT.js";
+import {
+  AudioPlayer,
+  ConversationLocalesProvider,
+  ConversationWallpaper,
+  DateDivider,
+  EmojiPicker,
+  FileIcon,
+  Lightbox,
+  MediaRenderer,
+  MessageBubble,
+  MessageComposer,
+  StatusTicks,
+  cn,
+  formatFileSize,
+  formatTimestamp,
+  useConversationLocales
+} from "./chunk-4R6Y43DQ.js";
 import {
   htmlToWA,
   parseWhatsAppFormatting,
-  useDarkMode,
   waToHTML,
   waToHTMLInline
-} from "./chunk-ZDURDZTM.js";
-
-// src/MessageBubble.tsx
-import { useState as useState3 } from "react";
-import { Check } from "lucide-react";
-
-// src/ConversationLocalesProvider.tsx
-import { createContext, useContext } from "react";
-import { jsx } from "react/jsx-runtime";
-var DEFAULT_LOCALES = {
-  bubble: {
-    customer: "Cliente",
-    bot: "Bot",
-    agent: "Atendente",
-    document: "documento",
-    media: "m\xEDdia",
-    templateLabel: "Template",
-    readAt: "Lida \xE0s ",
-    windowExpired: "Janela de 24h expirada",
-    viewImage: "Ver imagem",
-    listenAudio: "Ouvir \xE1udio",
-    viewVideo: "Ver v\xEDdeo"
-  },
-  selection: {
-    select: "Selecionar"
-  },
-  dateDivider: {
-    today: "Hoje",
-    yesterday: "Ontem"
-  }
-};
-var ConversationLocalesContext = createContext(DEFAULT_LOCALES);
-function ConversationLocalesProvider({ children, locales }) {
-  const merged = {
-    bubble: { ...DEFAULT_LOCALES.bubble, ...locales?.bubble },
-    selection: { ...DEFAULT_LOCALES.selection, ...locales?.selection },
-    dateDivider: { ...DEFAULT_LOCALES.dateDivider, ...locales?.dateDivider }
-  };
-  return /* @__PURE__ */ jsx(ConversationLocalesContext.Provider, { value: merged, children });
-}
-function useConversationLocales() {
-  return useContext(ConversationLocalesContext);
-}
-
-// src/StatusTicks.tsx
-import { AlertTriangle } from "lucide-react";
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
-var STATUS_COLOR_CLASS = {
-  sent: "text-black/40 dark:text-white/40",
-  delivered: "text-black/40 dark:text-white/40",
-  read: "text-sky-500",
-  failed: "text-red-500"
-};
-function Ticks({ double }) {
-  return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 20 12", width: "15", height: "9", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
-    double && /* @__PURE__ */ jsx2("path", { d: "M1 6.5L4.5 10L11 2", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round", strokeLinejoin: "round" }),
-    /* @__PURE__ */ jsx2(
-      "path",
-      {
-        d: double ? "M6 6.5L9.5 10L19 1" : "M1 6.5L5 10.5L14.5 1",
-        stroke: "currentColor",
-        strokeWidth: "1.6",
-        strokeLinecap: "round",
-        strokeLinejoin: "round"
-      }
-    )
-  ] });
-}
-function StatusTicks({ status, title }) {
-  const colorClass = STATUS_COLOR_CLASS[status] ?? STATUS_COLOR_CLASS.sent;
-  return /* @__PURE__ */ jsx2("span", { className: `cursor-help leading-none flex items-center ${colorClass}`, title, children: status === "failed" ? /* @__PURE__ */ jsx2(AlertTriangle, { size: 11 }) : /* @__PURE__ */ jsx2(Ticks, { double: status !== "sent" }) });
-}
-
-// src/MediaRenderer.tsx
-import { useState as useState2 } from "react";
-
-// src/AudioPlayer.tsx
-import { useEffect, useRef, useState } from "react";
-import { Pause, Play } from "lucide-react";
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-var BARS = Array.from({ length: 30 }, (_, i) => {
-  const heights = [3, 5, 8, 12, 7, 10, 14, 9, 6, 11, 15, 8, 4, 13, 7, 10, 6, 12, 9, 5, 14, 8, 11, 6, 13, 7, 10, 5, 9, 4];
-  return heights[i % heights.length];
-});
-function fmt(sec) {
-  if (!isFinite(sec)) return "0:00";
-  const m = Math.floor(sec / 60);
-  const s = Math.floor(sec % 60);
-  return `${m}:${s.toString().padStart(2, "0")}`;
-}
-function AudioPlayer({ src, isMine = false }) {
-  const audioRef = useRef(null);
-  const [playing, setPlaying] = useState(false);
-  const [progress, setProgress] = useState(0);
-  const [duration, setDuration] = useState(0);
-  const [current, setCurrent] = useState(0);
-  useEffect(() => {
-    const audio = audioRef.current;
-    if (!audio) return;
-    const onTime = () => {
-      setCurrent(audio.currentTime);
-      setProgress(audio.duration ? audio.currentTime / audio.duration : 0);
-    };
-    const onMeta = () => setDuration(audio.duration);
-    const onEnd = () => {
-      setPlaying(false);
-      setProgress(0);
-      setCurrent(0);
-    };
-    audio.addEventListener("timeupdate", onTime);
-    audio.addEventListener("loadedmetadata", onMeta);
-    audio.addEventListener("ended", onEnd);
-    return () => {
-      audio.removeEventListener("timeupdate", onTime);
-      audio.removeEventListener("loadedmetadata", onMeta);
-      audio.removeEventListener("ended", onEnd);
-    };
-  }, []);
-  const toggle = () => {
-    const audio = audioRef.current;
-    if (!audio) return;
-    if (playing) {
-      audio.pause();
-      setPlaying(false);
-    } else {
-      audio.play();
-      setPlaying(true);
-    }
-  };
-  const seek = (e) => {
-    const audio = audioRef.current;
-    if (!audio || !audio.duration) return;
-    const rect = e.currentTarget.getBoundingClientRect();
-    const ratio = (e.clientX - rect.left) / rect.width;
-    audio.currentTime = ratio * audio.duration;
-  };
-  const activeBars = Math.round(progress * BARS.length);
-  const playBtn = isMine ? "bg-green-600 hover:bg-green-700 text-white" : "bg-gray-600 hover:bg-gray-700 text-white";
-  const activeBar = isMine ? "bg-green-700" : "bg-gray-700";
-  const inactiveBar = isMine ? "bg-green-300" : "bg-gray-300";
-  return /* @__PURE__ */ jsxs2("div", { className: "flex items-center gap-2 w-full", style: { minWidth: "200px", maxWidth: "260px" }, children: [
-    /* @__PURE__ */ jsx3("audio", { ref: audioRef, src, preload: "metadata" }),
-    /* @__PURE__ */ jsx3(
-      "button",
-      {
-        onClick: toggle,
-        className: `flex-shrink-0 w-9 h-9 rounded-full flex items-center justify-center transition-colors ${playBtn}`,
-        children: playing ? /* @__PURE__ */ jsx3(Pause, { size: 16 }) : /* @__PURE__ */ jsx3(Play, { size: 16, className: "translate-x-0.5" })
-      }
-    ),
-    /* @__PURE__ */ jsxs2("div", { className: "flex-1 flex flex-col gap-1", children: [
-      /* @__PURE__ */ jsx3("div", { className: "flex items-end gap-0.5 h-8 cursor-pointer", onClick: seek, children: BARS.map((h, i) => /* @__PURE__ */ jsx3(
-        "div",
-        {
-          className: `flex-1 rounded-full transition-colors ${i < activeBars ? activeBar : inactiveBar}`,
-          style: { height: `${h * 2}px` }
-        },
-        i
-      )) }),
-      /* @__PURE__ */ jsx3("span", { className: "text-gray-400 tabular-nums text-xs", children: playing || current > 0 ? fmt(current) : fmt(duration) })
-    ] })
-  ] });
-}
-
-// src/FileIcon.tsx
-import { FileArchive, FileSpreadsheet, FileText, File as FileGeneric } from "lucide-react";
-import { jsx as jsx4 } from "react/jsx-runtime";
-var EXTENSION_STYLE = {
-  pdf: { Icon: FileText, colorClass: "text-red-500" },
-  doc: { Icon: FileText, colorClass: "text-blue-500" },
-  docx: { Icon: FileText, colorClass: "text-blue-500" },
-  xls: { Icon: FileSpreadsheet, colorClass: "text-green-600" },
-  xlsx: { Icon: FileSpreadsheet, colorClass: "text-green-600" },
-  zip: { Icon: FileArchive, colorClass: "text-orange-500" }
-};
-function getExtension(filename, mimeType) {
-  const fromFilename = filename?.split(".").pop()?.toLowerCase();
-  if (fromFilename && EXTENSION_STYLE[fromFilename]) return fromFilename;
-  return mimeType?.split("/")[1]?.toLowerCase() ?? "";
-}
-function FileIcon({ filename, mimeType, size = 20, className = "" }) {
-  const extension = getExtension(filename, mimeType);
-  const style = EXTENSION_STYLE[extension] ?? { Icon: FileGeneric, colorClass: "text-gray-500" };
-  const { Icon, colorClass } = style;
-  return /* @__PURE__ */ jsx4(Icon, { size, className: `${colorClass} ${className}`.trim() });
-}
-
-// src/lib/format.ts
-function formatTimestamp(timestamp) {
-  try {
-    const date = new Date(timestamp);
-    const hours = date.getHours().toString().padStart(2, "0");
-    const minutes = date.getMinutes().toString().padStart(2, "0");
-    return `${hours}:${minutes}`;
-  } catch {
-    return timestamp;
-  }
-}
-function formatDateTime(iso) {
-  const d = new Date(iso);
-  return d.toLocaleString("pt-BR", { day: "2-digit", month: "2-digit", hour: "2-digit", minute: "2-digit" });
-}
-function isSameDay(a, b) {
-  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
-}
-var FILE_SIZE_UNITS = ["B", "KB", "MB", "GB"];
-function formatFileSize(bytes) {
-  if (!isFinite(bytes) || bytes < 0) return "";
-  if (bytes < 1) return "0 B";
-  const exponent = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), FILE_SIZE_UNITS.length - 1);
-  const value = bytes / 1024 ** exponent;
-  const formatted = exponent === 0 ? value.toString() : value.toFixed(value < 10 ? 1 : 0);
-  return `${formatted} ${FILE_SIZE_UNITS[exponent]}`;
-}
-
-// src/MediaRenderer.tsx
-import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
-function resolveMediaSource(message) {
-  if (message.mediaUrl) return message.mediaUrl;
-  if (message.base64) {
-    const prefix = message.mimeType ? `data:${message.mimeType};base64,` : "data:application/octet-stream;base64,";
-    return prefix + message.base64;
-  }
-  return null;
-}
-function hasLazyRef(message) {
-  return Boolean(message.uploadId || message.mediaId);
-}
-function useLazyMediaUrl(message, onResolveUrl) {
-  const [url, setUrl] = useState2(null);
-  const [loading, setLoading] = useState2(false);
-  const [error, setError] = useState2(false);
-  const load = async () => {
-    if (url || loading || !onResolveUrl) return;
-    setLoading(true);
-    setError(false);
-    try {
-      const resolved = await onResolveUrl(message);
-      if (resolved) setUrl(resolved);
-      else setError(true);
-    } catch {
-      setError(true);
-    } finally {
-      setLoading(false);
-    }
-  };
-  return { url, loading, error, load };
-}
-function MediaRenderer({ message, onLightbox, onResolveUrl }) {
-  const { bubble } = useConversationLocales();
-  const eagerSrc = resolveMediaSource(message);
-  const lazy = useLazyMediaUrl(message, onResolveUrl);
-  const src = eagerSrc ?? lazy.url;
-  const canLazyLoad = !eagerSrc && hasLazyRef(message) && Boolean(onResolveUrl);
-  const lazyButtonClass = "text-xs text-blue-600 underline flex items-center gap-1";
-  switch (message.type) {
-    case "image":
-    case "sticker": {
-      if (!src && canLazyLoad) {
-        return /* @__PURE__ */ jsx5("button", { onClick: lazy.load, className: lazyButtonClass, children: lazy.loading ? "Carregando..." : lazy.error ? "Erro \u2014 tentar novamente" : bubble.viewImage });
-      }
-      return /* @__PURE__ */ jsx5("div", { className: "min-w-[200px]", children: src ? /* @__PURE__ */ jsx5("img", { src, alt: message.caption ?? "Image", className: "w-full max-h-80 object-cover cursor-pointer hover:opacity-90 transition-opacity", onClick: () => onLightbox(src), loading: "lazy" }) : /* @__PURE__ */ jsx5("div", { className: "w-full h-40 bg-gray-200 flex items-center justify-center text-gray-400", children: /* @__PURE__ */ jsxs3("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
-        /* @__PURE__ */ jsx5("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2", ry: "2" }),
-        /* @__PURE__ */ jsx5("circle", { cx: "8.5", cy: "8.5", r: "1.5" }),
-        /* @__PURE__ */ jsx5("polyline", { points: "21 15 16 10 5 21" })
-      ] }) }) });
-    }
-    case "video": {
-      if (!src && canLazyLoad) {
-        return /* @__PURE__ */ jsx5("button", { onClick: lazy.load, className: lazyButtonClass, children: lazy.loading ? "Carregando..." : lazy.error ? "Erro \u2014 tentar novamente" : bubble.viewVideo });
-      }
-      return /* @__PURE__ */ jsx5("div", { className: "min-w-[200px]", children: src ? /* @__PURE__ */ jsx5("video", { src, className: "w-full max-h-80 rounded-lg", controls: true, preload: "metadata", children: /* @__PURE__ */ jsx5("track", { kind: "captions" }) }) : /* @__PURE__ */ jsx5("div", { className: "w-full h-32 bg-gray-200 rounded-lg flex items-center justify-center text-gray-400", children: /* @__PURE__ */ jsxs3("svg", { width: "32", height: "32", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
-        /* @__PURE__ */ jsx5("polygon", { points: "23 7 16 12 23 17 23 7" }),
-        /* @__PURE__ */ jsx5("rect", { x: "1", y: "5", width: "15", height: "14", rx: "2", ry: "2" })
-      ] }) }) });
-    }
-    case "audio": {
-      if (!src && canLazyLoad) {
-        return /* @__PURE__ */ jsx5("button", { onClick: lazy.load, className: lazyButtonClass, children: lazy.loading ? "Carregando..." : lazy.error ? "Erro \u2014 tentar novamente" : bubble.listenAudio });
-      }
-      return /* @__PURE__ */ jsx5("div", { className: "min-w-[200px]", children: src ? /* @__PURE__ */ jsx5(AudioPlayer, { src, isMine: message.direction === "outbound" }) : /* @__PURE__ */ jsx5("div", { className: "h-12 bg-gray-200 rounded-lg flex items-center justify-center text-gray-400 text-xs", children: "Audio unavailable" }) });
-    }
-    case "document": {
-      const typeLabel = message.mimeType?.split("/")[1]?.toUpperCase() ?? "FILE";
-      const sizeLabel = message.sizeBytes ? formatFileSize(message.sizeBytes) : null;
-      return /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-3 min-w-[200px]", children: [
-        /* @__PURE__ */ jsx5("div", { className: "w-10 h-10 bg-gray-200 rounded-lg flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx5(FileIcon, { filename: message.filename, mimeType: message.mimeType }) }),
-        /* @__PURE__ */ jsxs3("div", { className: "flex-1 min-w-0", children: [
-          /* @__PURE__ */ jsx5("p", { className: "text-sm font-medium truncate", children: message.filename ?? "Document" }),
-          /* @__PURE__ */ jsx5("p", { className: "text-xs text-gray-500", children: sizeLabel ? `${typeLabel} \xB7 ${sizeLabel}` : typeLabel })
-        ] }),
-        src ? /* @__PURE__ */ jsx5("a", { href: src, download: message.filename, className: "w-8 h-8 flex items-center justify-center rounded-full bg-gray-200 hover:bg-gray-300 flex-shrink-0 transition-colors", "aria-label": "Download", children: /* @__PURE__ */ jsxs3("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", className: "text-gray-600", children: [
-          /* @__PURE__ */ jsx5("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
-          /* @__PURE__ */ jsx5("polyline", { points: "7 10 12 15 17 10" }),
-          /* @__PURE__ */ jsx5("line", { x1: "12", y1: "15", x2: "12", y2: "3" })
-        ] }) }) : canLazyLoad ? /* @__PURE__ */ jsx5(
-          "button",
-          {
-            onClick: lazy.load,
-            disabled: lazy.loading,
-            className: "w-8 h-8 flex items-center justify-center rounded-full bg-gray-200 hover:bg-gray-300 flex-shrink-0 transition-colors disabled:opacity-50",
-            "aria-label": "Download",
-            children: /* @__PURE__ */ jsxs3("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", className: "text-gray-600", children: [
-              /* @__PURE__ */ jsx5("path", { d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }),
-              /* @__PURE__ */ jsx5("polyline", { points: "7 10 12 15 17 10" }),
-              /* @__PURE__ */ jsx5("line", { x1: "12", y1: "15", x2: "12", y2: "3" })
-            ] })
-          }
-        ) : null,
-        lazy.error && /* @__PURE__ */ jsx5("span", { className: "text-xs text-red-500 flex-shrink-0", children: "Erro" })
-      ] });
-    }
-    default:
-      return null;
-  }
-}
-
-// src/Lightbox.tsx
-import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
-function Lightbox({ imageUrl, caption, onClose }) {
-  return /* @__PURE__ */ jsx6("div", { className: "fixed inset-0 z-50 bg-black/85 flex items-center justify-center p-4", onClick: onClose, children: /* @__PURE__ */ jsxs4("div", { className: "max-w-[90vw] max-h-[90vh] flex flex-col items-center", onClick: (e) => e.stopPropagation(), children: [
-    /* @__PURE__ */ jsx6("img", { src: imageUrl, alt: caption ?? "Image", className: "max-w-full max-h-[80vh] object-contain rounded-lg" }),
-    caption && /* @__PURE__ */ jsx6("p", { className: "text-white text-sm mt-3 text-center", children: caption }),
-    /* @__PURE__ */ jsx6("button", { onClick: onClose, className: "mt-4 px-4 py-2 bg-white/20 text-white rounded-lg hover:bg-white/30 transition-colors", children: "Fechar" })
-  ] }) });
-}
-
-// src/MessageBubble.tsx
-import { Fragment, jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
-var BUBBLE_COLOR = {
-  agent: "bg-[#d9fdd3] dark:bg-[#005c4b]",
-  bot: "bg-[#d7f0ec] dark:bg-[#0a3d3a]",
-  customer: "bg-white dark:bg-[#202c33]"
-};
-var MEDIA_TYPES = /* @__PURE__ */ new Set(["image", "audio", "video", "document", "sticker"]);
-function MessageBubble({
-  message,
-  isMine,
-  senderName,
-  isFirstInGroup = true,
-  isSelecting = false,
-  isSelected = false,
-  onToggleSelect,
-  onResolveMediaUrl
-}) {
-  const { bubble, selection } = useConversationLocales();
-  const [lightboxSrc, setLightboxSrc] = useState3(null);
-  const bubbleColor = BUBBLE_COLOR[message.sender] ?? BUBBLE_COLOR.customer;
-  const hasError = message.status === "failed";
-  const isMedia = MEDIA_TYPES.has(message.type);
-  const isTemplate = message.type === "template";
-  const displayName = message.sender === "agent" && senderName ? senderName : bubble[message.sender] ?? message.sender;
-  const tooltipText = message.status === "read" && message.readAt ? `${bubble.readAt}${formatDateTime(message.readAt)}` : message.status === "failed" ? bubble.windowExpired : void 0;
-  const tailCornerClass = isFirstInGroup ? isMine ? "rounded-tr-md" : "rounded-tl-md" : "";
-  const checkbox = /* @__PURE__ */ jsx7(
-    "button",
-    {
-      onClick: (e) => {
-        e.stopPropagation();
-        onToggleSelect?.();
-      },
-      title: selection.select,
-      className: `
-        flex-shrink-0 self-end mb-1 w-5 h-5 rounded-full border-2 flex items-center justify-center transition-all
-        ${isSelected ? "bg-teal-600 border-teal-600" : "bg-white/80 dark:bg-black/40 border-black/20 dark:border-white/30"}
-        ${isSelecting ? "opacity-100" : "opacity-0 group-hover:opacity-100"}
-      `,
-      children: isSelected && /* @__PURE__ */ jsx7(Check, { size: 12, className: "text-white", strokeWidth: 3 })
-    }
-  );
-  return /* @__PURE__ */ jsxs5("div", { className: `flex items-end gap-1.5 ${isMine ? "justify-end" : "justify-start"} group ${isFirstInGroup ? "mt-2" : "mt-0.5"}`, children: [
-    isMine && checkbox,
-    /* @__PURE__ */ jsxs5(
-      "div",
-      {
-        onClick: isSelecting ? onToggleSelect : void 0,
-        className: `
-          max-w-[75%] sm:max-w-[65%] rounded-2xl ${tailCornerClass} px-2.5 py-1.5 shadow-sm
-          ${bubbleColor}
-          ${hasError ? "ring-1 ring-inset ring-red-400" : ""}
-          ${isSelecting ? "cursor-pointer" : ""}
-          ${isSelected ? "ring-2 ring-teal-500" : ""}
-          relative
-        `,
-        children: [
-          isMine && isFirstInGroup && (message.sender === "bot" || message.sender === "agent" && senderName) && /* @__PURE__ */ jsx7("div", { className: "text-xs font-semibold mb-0.5 text-teal-700 dark:text-teal-400", children: displayName }),
-          isMedia ? /* @__PURE__ */ jsx7(MediaRenderer, { message, onLightbox: setLightboxSrc, onResolveUrl: onResolveMediaUrl }) : /* @__PURE__ */ jsxs5(Fragment, { children: [
-            isTemplate && /* @__PURE__ */ jsxs5("p", { className: "text-xs text-gray-500 dark:text-gray-400 flex items-center gap-1 mb-0.5", children: [
-              /* @__PURE__ */ jsx7("span", { children: "\u{1F4E8}" }),
-              /* @__PURE__ */ jsxs5("span", { className: "font-medium", children: [
-                bubble.templateLabel,
-                message.templateName ? ` \u2014 ${message.templateName}` : ""
-              ] })
-            ] }),
-            /* @__PURE__ */ jsx7("div", { className: "text-sm text-gray-900 dark:text-gray-100 whitespace-pre-wrap break-words leading-[19px]", children: parseWhatsAppFormatting(message.content ?? "") })
-          ] }),
-          /* @__PURE__ */ jsxs5("div", { className: "flex items-center justify-end gap-1 mt-0.5 select-none", children: [
-            /* @__PURE__ */ jsx7("span", { className: "text-xs text-black/40 dark:text-white/40 font-medium", children: formatTimestamp(message.timestamp) }),
-            isMine && message.status && /* @__PURE__ */ jsx7(StatusTicks, { status: message.status, title: tooltipText })
-          ] })
-        ]
-      }
-    ),
-    !isMine && checkbox,
-    lightboxSrc && /* @__PURE__ */ jsx7(Lightbox, { imageUrl: lightboxSrc, onClose: () => setLightboxSrc(null) })
-  ] });
-}
-
-// src/Wallpaper.tsx
-import { jsx as jsx8 } from "react/jsx-runtime";
-function ConversationWallpaper({ children, className = "" }) {
-  return /* @__PURE__ */ jsx8("div", { className: `cv-wallpaper ${className}`.trim(), children });
-}
-
-// src/EmojiPicker.tsx
-import { useState as useState4, useCallback } from "react";
-import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
-var EMOJI_CATEGORIES = [
-  {
-    name: "Smileys",
-    emojis: ["\u{1F600}", "\u{1F603}", "\u{1F604}", "\u{1F601}", "\u{1F605}", "\u{1F602}", "\u{1F923}", "\u{1F60A}", "\u{1F607}", "\u{1F642}", "\u{1F609}", "\u{1F60C}", "\u{1F60D}", "\u{1F970}", "\u{1F618}", "\u{1F617}", "\u{1F60B}", "\u{1F61B}", "\u{1F61C}", "\u{1F92A}"]
-  },
-  {
-    name: "Gestures",
-    emojis: ["\u{1F44D}", "\u{1F44E}", "\u{1F44C}", "\u270C\uFE0F", "\u{1F91E}", "\u{1F91F}", "\u{1F918}", "\u{1F919}", "\u{1F44B}", "\u{1F91A}", "\u{1F590}\uFE0F", "\u270B", "\u{1F596}", "\u{1F44F}", "\u{1F64C}", "\u{1F91D}", "\u{1F64F}", "\u270D\uFE0F", "\u{1F485}", "\u{1F933}"]
-  },
-  {
-    name: "Hearts",
-    emojis: ["\u2764\uFE0F", "\u{1F9E1}", "\u{1F49B}", "\u{1F49A}", "\u{1F499}", "\u{1F49C}", "\u{1F5A4}", "\u{1F90D}", "\u{1F90E}", "\u{1F494}", "\u2763\uFE0F", "\u{1F495}", "\u{1F49E}", "\u{1F493}", "\u{1F497}", "\u{1F496}", "\u{1F498}", "\u{1F49D}", "\u{1F49F}", "\u2665\uFE0F"]
-  },
-  {
-    name: "Food",
-    emojis: ["\u{1F354}", "\u{1F35F}", "\u{1F355}", "\u{1F32D}", "\u{1F37F}", "\u{1F9C2}", "\u{1F953}", "\u{1F95A}", "\u{1F373}", "\u{1F9C7}", "\u{1F95E}", "\u{1F9C8}", "\u{1F35E}", "\u{1F950}", "\u{1F968}", "\u{1F96F}", "\u{1F956}", "\u{1F9C0}", "\u{1F957}", "\u{1F959}"]
-  },
-  {
-    name: "Drinks",
-    emojis: ["\u2615", "\u{1F375}", "\u{1F376}", "\u{1F37E}", "\u{1F377}", "\u{1F378}", "\u{1F379}", "\u{1F37A}", "\u{1F37B}", "\u{1F942}", "\u{1F943}", "\u{1F964}", "\u{1F9CB}", "\u{1F9C3}", "\u{1F9C9}", "\u{1F9CA}", "\u{1F962}", "\u{1F37D}\uFE0F", "\u{1F374}", "\u{1F944}"]
-  },
-  {
-    name: "Objects",
-    emojis: ["\u{1F381}", "\u{1F382}", "\u{1F388}", "\u{1F389}", "\u{1F38A}", "\u{1F380}", "\u{1F4F1}", "\u{1F4BB}", "\u231A", "\u{1F4F7}", "\u{1F511}", "\u{1F4B0}", "\u{1F4B3}", "\u{1F4DD}", "\u{1F4CC}", "\u{1F4CD}", "\u2702\uFE0F", "\u{1F50D}", "\u{1F4A1}", "\u{1F514}"]
-  }
-];
-var EmojiPicker = ({ onSelect, className = "" }) => {
-  const [activeCategory, setActiveCategory] = useState4(0);
-  const handleSelect = useCallback(
-    (emoji) => {
-      onSelect(emoji);
-    },
-    [onSelect]
-  );
-  return /* @__PURE__ */ jsxs6("div", { className: `bg-white border border-gray-200 rounded-lg shadow-lg overflow-hidden ${className}`, children: [
-    /* @__PURE__ */ jsx9("div", { className: "flex border-b border-gray-200 overflow-x-auto", children: EMOJI_CATEGORIES.map((category, index) => /* @__PURE__ */ jsxs6(
-      "button",
-      {
-        onClick: () => setActiveCategory(index),
-        className: `px-3 py-2 text-xs font-medium whitespace-nowrap border-b-2 transition-colors ${activeCategory === index ? "border-blue-500 text-blue-600" : "border-transparent text-gray-500 hover:text-gray-700"}`,
-        children: [
-          category.emojis[0],
-          " ",
-          category.name
-        ]
-      },
-      category.name
-    )) }),
-    /* @__PURE__ */ jsx9("div", { className: "grid grid-cols-10 gap-0.5 p-2 max-h-[240px] overflow-y-auto", children: EMOJI_CATEGORIES[activeCategory].emojis.map((emoji) => /* @__PURE__ */ jsx9(
-      "button",
-      {
-        onClick: () => handleSelect(emoji),
-        className: "w-8 h-8 flex items-center justify-center text-lg hover:bg-gray-100 rounded transition-colors cursor-pointer",
-        "aria-label": emoji,
-        children: emoji
-      },
-      emoji
-    )) })
-  ] });
-};
-
-// src/MessageComposer.tsx
-import { useState as useState5, useRef as useRef2, useCallback as useCallback2 } from "react";
-import { Fragment as Fragment2, jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
-var DEFAULT_ACCEPTED_FILE_TYPES = "image/*,video/*,audio/*,.pdf,.doc,.docx,.xls,.xlsx,.zip";
-var MessageComposer = ({
-  onSend,
-  onAttach,
-  value: externalValue,
-  onChange: externalOnChange,
-  features,
-  placeholder = "Digite uma mensagem...",
-  maxLength,
-  disabled = false,
-  acceptedFileTypes = DEFAULT_ACCEPTED_FILE_TYPES
-}) => {
-  const [internalText, setInternalText] = useState5("");
-  const [showEmoji, setShowEmoji] = useState5(false);
-  const [attachments, setAttachments] = useState5([]);
-  const textareaRef = useRef2(null);
-  const fileInputRef = useRef2(null);
-  const isControlled = externalValue !== void 0;
-  const text = isControlled ? externalValue : internalText;
-  const setText = useCallback2((newText) => {
-    if (isControlled) {
-      externalOnChange?.(newText);
-    } else {
-      setInternalText(newText);
-    }
-  }, [isControlled, externalOnChange]);
-  const showEmojiButton = features?.emoji !== false;
-  const showAttachButton = features?.documents !== false;
-  const sendMessage = useCallback2(() => {
-    const trimmed = text.trim();
-    if (!trimmed && attachments.length === 0) return;
-    if (trimmed) onSend(trimmed);
-    for (const a of attachments) {
-      onAttach?.(a.file);
-      URL.revokeObjectURL(a.previewUrl);
-    }
-    if (!isControlled) setInternalText("");
-    setAttachments([]);
-    setShowEmoji(false);
-    if (textareaRef.current) textareaRef.current.style.height = "auto";
-  }, [text, attachments, onSend, onAttach, isControlled]);
-  const handleKeyDown = useCallback2((e) => {
-    if (e.key === "Enter" && !e.shiftKey) {
-      e.preventDefault();
-      if (!disabled) sendMessage();
-    }
-  }, [sendMessage, disabled]);
-  const handleInput = useCallback2(() => {
-    const ta = textareaRef.current;
-    if (!ta) return;
-    ta.style.height = "auto";
-    ta.style.height = `${Math.min(ta.scrollHeight, 100)}px`;
-  }, []);
-  const handleEmojiSelect = useCallback2((emoji) => {
-    const ta = textareaRef.current;
-    if (!ta) {
-      setText(text + emoji);
-      return;
-    }
-    const start = ta.selectionStart;
-    const end = ta.selectionEnd;
-    const newText = text.slice(0, start) + emoji + text.slice(end);
-    setText(newText);
-    requestAnimationFrame(() => {
-      ta.focus();
-      ta.setSelectionRange(start + emoji.length, start + emoji.length);
-      handleInput();
-    });
-  }, [text, setText, handleInput]);
-  const handleFileChange = useCallback2((e) => {
-    const files = e.target.files;
-    if (!files) return;
-    const previews = [];
-    for (let i = 0; i < files.length; i++) {
-      const file = files[i];
-      previews.push({ file, previewUrl: file.type.startsWith("image/") ? URL.createObjectURL(file) : "" });
-    }
-    setAttachments((prev) => [...prev, ...previews]);
-    if (fileInputRef.current) fileInputRef.current.value = "";
-  }, []);
-  const removeAttachment = useCallback2((index) => {
-    setAttachments((prev) => {
-      const next = [...prev];
-      if (next[index].previewUrl) URL.revokeObjectURL(next[index].previewUrl);
-      next.splice(index, 1);
-      return next;
-    });
-  }, []);
-  const insertFormatting = useCallback2((marker) => {
-    const ta = textareaRef.current;
-    if (!ta) return;
-    const start = ta.selectionStart;
-    const end = ta.selectionEnd;
-    const sel = text.slice(start, end);
-    if (sel) {
-      setText(text.slice(0, start) + marker + sel + marker + text.slice(end));
-      requestAnimationFrame(() => {
-        ta.focus();
-        ta.setSelectionRange(start + marker.length + sel.length + marker.length, start + marker.length + sel.length + marker.length);
-      });
-    }
-  }, [text, setText]);
-  const canSend = text.trim().length > 0 || attachments.length > 0;
-  const remaining = maxLength ? maxLength - text.length : null;
-  return /* @__PURE__ */ jsxs7("div", { children: [
-    attachments.length > 0 && /* @__PURE__ */ jsx10("div", { className: "flex gap-2 px-1 pb-2 overflow-x-auto", children: attachments.map((a, i) => /* @__PURE__ */ jsxs7("div", { className: "relative flex-shrink-0", children: [
-      a.previewUrl ? /* @__PURE__ */ jsx10("img", { src: a.previewUrl, alt: "", className: "w-16 h-16 object-cover rounded-lg border border-gray-200" }) : /* @__PURE__ */ jsx10("div", { className: "w-16 h-16 bg-gray-100 rounded-lg border border-gray-200 flex items-center justify-center", children: /* @__PURE__ */ jsxs7("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", stroke: "#9ca3af", strokeWidth: "1.5", children: [
-        /* @__PURE__ */ jsx10("path", { d: "M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" }),
-        /* @__PURE__ */ jsx10("polyline", { points: "14 2 14 8 20 8" })
-      ] }) }),
-      /* @__PURE__ */ jsx10("button", { onClick: () => removeAttachment(i), className: "absolute -top-2 -right-2 w-5 h-5 bg-gray-600 text-white rounded-full flex items-center justify-center hover:bg-gray-800 text-xs", children: "\u2715" })
-    ] }, i)) }),
-    /* @__PURE__ */ jsxs7("div", { className: "flex items-end gap-1.5 bg-[#f0f2f5] rounded-xl px-3 py-2", children: [
-      showEmojiButton && /* @__PURE__ */ jsxs7("div", { className: "relative flex-shrink-0", children: [
-        /* @__PURE__ */ jsx10("button", { onClick: () => setShowEmoji((v) => !v), className: "w-9 h-9 flex items-center justify-center rounded-full text-gray-500 hover:bg-gray-200 transition-colors", "aria-label": "Emoji", children: /* @__PURE__ */ jsxs7("svg", { width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
-          /* @__PURE__ */ jsx10("circle", { cx: "12", cy: "12", r: "10" }),
-          /* @__PURE__ */ jsx10("path", { d: "M8 14s1.5 2 4 2 4-2 4-2" }),
-          /* @__PURE__ */ jsx10("circle", { cx: "9", cy: "9", r: "0.5", fill: "currentColor" }),
-          /* @__PURE__ */ jsx10("circle", { cx: "15", cy: "9", r: "0.5", fill: "currentColor" })
-        ] }) }),
-        showEmoji && /* @__PURE__ */ jsx10("div", { className: "absolute bottom-full left-0 mb-2 z-10", children: /* @__PURE__ */ jsx10(EmojiPicker, { onSelect: handleEmojiSelect }) })
-      ] }),
-      /* @__PURE__ */ jsx10(
-        "textarea",
-        {
-          ref: textareaRef,
-          value: text,
-          onChange: (e) => {
-            setText(e.target.value);
-            handleInput();
-          },
-          onKeyDown: handleKeyDown,
-          placeholder,
-          rows: 1,
-          disabled,
-          className: "flex-1 resize-none bg-transparent text-[15px] text-[#3b4a54] placeholder-[#8696a0] outline-none py-1.5 max-h-[100px] leading-relaxed",
-          style: { fontFamily: "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif" }
-        }
-      ),
-      showAttachButton && /* @__PURE__ */ jsxs7(Fragment2, { children: [
-        /* @__PURE__ */ jsx10("input", { ref: fileInputRef, type: "file", multiple: true, accept: acceptedFileTypes, onChange: handleFileChange, className: "hidden" }),
-        /* @__PURE__ */ jsx10("button", { onClick: () => fileInputRef.current?.click(), className: "w-9 h-9 flex items-center justify-center rounded-full text-gray-500 hover:bg-gray-200 flex-shrink-0 transition-colors", "aria-label": "Anexar", children: /* @__PURE__ */ jsx10("svg", { width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx10("path", { d: "M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48" }) }) })
-      ] }),
-      /* @__PURE__ */ jsx10(
-        "button",
-        {
-          onClick: sendMessage,
-          disabled: !canSend || disabled,
-          className: `w-10 h-10 flex items-center justify-center rounded-full flex-shrink-0 transition-all ${canSend && !disabled ? "bg-[#00a884] text-white hover:bg-[#06cf9c] shadow-sm" : "bg-gray-200 text-gray-400 cursor-not-allowed"}`,
-          "aria-label": "Enviar",
-          children: /* @__PURE__ */ jsx10("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "currentColor", children: /* @__PURE__ */ jsx10("path", { d: "M2.01 21L23 12 2.01 3 2 10l15 2-15 2z" }) })
-        }
-      )
-    ] }),
-    remaining !== null && /* @__PURE__ */ jsx10("div", { className: "flex justify-end mt-1 pr-1", children: /* @__PURE__ */ jsx10("span", { className: `text-xs ${remaining < 20 ? "text-red-500" : "text-gray-400"}`, children: remaining }) })
-  ] });
-};
+} from "./chunk-OGRRHQQW.js";
 
 // src/WhatsAppMessageEditor.tsx
-import { useRef as useRef3 } from "react";
+import { useRef } from "react";
 import { Bold, Italic, Strikethrough } from "lucide-react";
-import { Fragment as Fragment3, jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var INLINE_TOKEN = /(\*[^*\n]+\*|_[^_\n]+_|~[^~\n]+~|`[^`\n]+`|\{[a-zA-Z_]+\})/g;
 function renderLine(line, lineKey) {
   const nodes = [];
@@ -658,11 +41,11 @@ function renderLine(line, lineKey) {
     if (match.index > lastIndex) nodes.push(line.slice(lastIndex, match.index));
     const token = match[0];
     const key = `${lineKey}-${tokenIndex++}`;
-    if (token.startsWith("*")) nodes.push(/* @__PURE__ */ jsx11("strong", { children: token.slice(1, -1) }, key));
-    else if (token.startsWith("_")) nodes.push(/* @__PURE__ */ jsx11("em", { children: token.slice(1, -1) }, key));
-    else if (token.startsWith("~")) nodes.push(/* @__PURE__ */ jsx11("s", { children: token.slice(1, -1) }, key));
-    else if (token.startsWith("`")) nodes.push(/* @__PURE__ */ jsx11("code", { className: "font-mono text-[0.85em]", children: token.slice(1, -1) }, key));
-    else nodes.push(/* @__PURE__ */ jsx11("span", { className: "rounded bg-blue-100 dark:bg-blue-900/50 text-blue-700 dark:text-blue-300 px-1", children: token }, key));
+    if (token.startsWith("*")) nodes.push(/* @__PURE__ */ jsx("strong", { children: token.slice(1, -1) }, key));
+    else if (token.startsWith("_")) nodes.push(/* @__PURE__ */ jsx("em", { children: token.slice(1, -1) }, key));
+    else if (token.startsWith("~")) nodes.push(/* @__PURE__ */ jsx("s", { children: token.slice(1, -1) }, key));
+    else if (token.startsWith("`")) nodes.push(/* @__PURE__ */ jsx("code", { className: "font-mono text-[0.85em]", children: token.slice(1, -1) }, key));
+    else nodes.push(/* @__PURE__ */ jsx("span", { className: "rounded bg-blue-100 dark:bg-blue-900/50 text-blue-700 dark:text-blue-300 px-1", children: token }, key));
     lastIndex = INLINE_TOKEN.lastIndex;
   }
   if (lastIndex < line.length) nodes.push(line.slice(lastIndex));
@@ -670,9 +53,9 @@ function renderLine(line, lineKey) {
 }
 function renderWhatsApp(text) {
   const lines = text.split("\n");
-  return lines.map((line, index) => /* @__PURE__ */ jsxs8("span", { children: [
+  return lines.map((line, index) => /* @__PURE__ */ jsxs("span", { children: [
     renderLine(line, `ln-${index}`),
-    index < lines.length - 1 ? /* @__PURE__ */ jsx11("br", {}) : null
+    index < lines.length - 1 ? /* @__PURE__ */ jsx("br", {}) : null
   ] }, `ln-${index}`));
 }
 function WhatsAppMessageEditor({
@@ -684,7 +67,7 @@ function WhatsAppMessageEditor({
   previewLabel = "Pr\xE9via (como aparece no WhatsApp)",
   emptyPreviewText = "Sua mensagem aparecer\xE1 aqui\u2026"
 }) {
-  const textareaRef = useRef3(null);
+  const textareaRef = useRef(null);
   function wrapSelection(marker) {
     const textarea = textareaRef.current;
     if (!textarea) return;
@@ -712,14 +95,14 @@ 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__ */ jsxs8("div", { children: [
-    /* @__PURE__ */ jsxs8("div", { className: "flex flex-wrap items-center gap-1.5 mb-2", children: [
-      /* @__PURE__ */ jsx11("button", { type: "button", onClick: () => wrapSelection("*"), className: toolbarButtonClass, title: "Negrito (*texto*)", "aria-label": "Negrito", children: /* @__PURE__ */ jsx11(Bold, { size: 15 }) }),
-      /* @__PURE__ */ jsx11("button", { type: "button", onClick: () => wrapSelection("_"), className: toolbarButtonClass, title: "It\xE1lico (_texto_)", "aria-label": "It\xE1lico", children: /* @__PURE__ */ jsx11(Italic, { size: 15 }) }),
-      /* @__PURE__ */ jsx11("button", { type: "button", onClick: () => wrapSelection("~"), className: toolbarButtonClass, title: "Tachado (~texto~)", "aria-label": "Tachado", children: /* @__PURE__ */ jsx11(Strikethrough, { size: 15 }) }),
-      placeholders.length > 0 && /* @__PURE__ */ jsxs8(Fragment3, { children: [
-        /* @__PURE__ */ jsx11("span", { className: "mx-1 h-5 w-px bg-gray-200 dark:bg-gray-600" }),
-        placeholders.map((token) => /* @__PURE__ */ jsx11(
+  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 }) }),
+      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(
           "button",
           {
             type: "button",
@@ -732,7 +115,7 @@ function WhatsAppMessageEditor({
         ))
       ] })
     ] }),
-    /* @__PURE__ */ jsx11(
+    /* @__PURE__ */ jsx(
       "textarea",
       {
         ref: textareaRef,
@@ -743,17 +126,17 @@ function WhatsAppMessageEditor({
         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 placeholder:text-gray-400 dark:placeholder:text-gray-500 resize-y"
       }
     ),
-    /* @__PURE__ */ jsxs8("div", { className: "mt-2", children: [
-      /* @__PURE__ */ jsx11("p", { className: "text-xs text-gray-500 dark:text-gray-400 mb-1", children: previewLabel }),
-      /* @__PURE__ */ jsx11("div", { className: "rounded-xl bg-[#e5ded8] dark:bg-gray-900 p-3", children: /* @__PURE__ */ jsx11("div", { className: "inline-block max-w-full rounded-lg rounded-tl-none bg-white dark:bg-gray-800 shadow-sm px-3 py-2 text-sm text-gray-800 dark:text-gray-100 whitespace-pre-wrap break-words", children: value.trim() ? renderWhatsApp(value) : /* @__PURE__ */ jsx11("span", { className: "text-gray-400 dark:text-gray-500", children: emptyPreviewText }) }) })
+    /* @__PURE__ */ jsxs("div", { className: "mt-2", children: [
+      /* @__PURE__ */ jsx("p", { className: "text-xs text-gray-500 dark:text-gray-400 mb-1", children: previewLabel }),
+      /* @__PURE__ */ jsx("div", { className: "rounded-xl bg-[#e5ded8] dark:bg-gray-900 p-3", children: /* @__PURE__ */ jsx("div", { className: "inline-block max-w-full rounded-lg rounded-tl-none bg-white dark:bg-gray-800 shadow-sm px-3 py-2 text-sm text-gray-800 dark:text-gray-100 whitespace-pre-wrap break-words", children: value.trim() ? renderWhatsApp(value) : /* @__PURE__ */ jsx("span", { className: "text-gray-400 dark:text-gray-500", children: emptyPreviewText }) }) })
     ] })
   ] });
 }
 
 // src/SimpleEmojiPicker.tsx
-import { useEffect as useEffect2, useRef as useRef4, useState as useState6 } from "react";
+import { useEffect, useRef as useRef2, useState } from "react";
 import { Smile } from "lucide-react";
-import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var EMOJIS = [
   "\u{1F600}",
   "\u{1F602}",
@@ -837,9 +220,9 @@ var EMOJIS = [
   "\u{1F6E1}\uFE0F"
 ];
 function SimpleEmojiPicker({ onSelect, label = "Emojis", pickerWidth = "280px", pickerMaxHeight = "220px" }) {
-  const [open, setOpen] = useState6(false);
-  const containerRef = useRef4(null);
-  useEffect2(() => {
+  const [open, setOpen] = useState(false);
+  const containerRef = useRef2(null);
+  useEffect(() => {
     if (!open) return;
     const handleClickOutside = (e) => {
       if (containerRef.current && !containerRef.current.contains(e.target)) {
@@ -849,23 +232,23 @@ function SimpleEmojiPicker({ onSelect, label = "Emojis", pickerWidth = "280px",
     document.addEventListener("mousedown", handleClickOutside);
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, [open]);
-  return /* @__PURE__ */ jsxs9("div", { ref: containerRef, className: "relative flex-shrink-0", children: [
-    /* @__PURE__ */ jsx12(
+  return /* @__PURE__ */ jsxs2("div", { ref: containerRef, className: "relative flex-shrink-0", children: [
+    /* @__PURE__ */ jsx2(
       "button",
       {
         type: "button",
         onClick: () => setOpen((v) => !v),
         className: "w-7 h-7 flex items-center justify-center rounded-lg text-gray-400 dark:text-gray-500 hover:text-teal-600 dark:hover:text-teal-400 hover:bg-teal-50 dark:hover:bg-teal-900/30 transition-colors",
         title: label,
-        children: /* @__PURE__ */ jsx12(Smile, { size: 15 })
+        children: /* @__PURE__ */ jsx2(Smile, { size: 15 })
       }
     ),
-    open && /* @__PURE__ */ jsx12("div", { className: "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-xl shadow-xl p-2 z-50", children: /* @__PURE__ */ jsx12(
+    open && /* @__PURE__ */ jsx2("div", { className: "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-xl shadow-xl p-2 z-50", children: /* @__PURE__ */ jsx2(
       "div",
       {
         className: "grid grid-cols-10 gap-0.5 overflow-y-auto",
         style: { width: pickerWidth, maxHeight: pickerMaxHeight },
-        children: EMOJIS.map((emoji) => /* @__PURE__ */ jsx12(
+        children: EMOJIS.map((emoji) => /* @__PURE__ */ jsx2(
           "button",
           {
             type: "button",
@@ -883,24 +266,8 @@ function SimpleEmojiPicker({ onSelect, label = "Emojis", pickerWidth = "280px",
   ] });
 }
 
-// src/DateDivider.tsx
-import { jsx as jsx13 } from "react/jsx-runtime";
-function DateDivider({ iso }) {
-  const { dateDivider } = useConversationLocales();
-  return /* @__PURE__ */ jsx13("div", { className: "flex justify-center sticky top-0 z-10 my-2 pointer-events-none", children: /* @__PURE__ */ jsx13("span", { className: "bg-white/95 dark:bg-gray-800/95 text-gray-600 dark:text-gray-300 text-xs font-medium px-3 py-1 rounded-lg shadow-sm", children: formatDividerLabel(iso, dateDivider) }) });
-}
-function formatDividerLabel(iso, dateDivider) {
-  const date = new Date(iso);
-  const today = /* @__PURE__ */ new Date();
-  const yesterday = new Date(today);
-  yesterday.setDate(today.getDate() - 1);
-  if (isSameDay(date, today)) return dateDivider.today;
-  if (isSameDay(date, yesterday)) return dateDivider.yesterday;
-  return date.toLocaleDateString("pt-BR", { day: "2-digit", month: "long", year: "numeric" });
-}
-
 // src/Avatar.tsx
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { jsx as jsx3 } from "react/jsx-runtime";
 var sizeClasses = {
   sm: "w-6 h-6 text-xs",
   md: "w-8 h-8 text-sm",
@@ -929,7 +296,7 @@ function getBgColor(name) {
 function Avatar({ name, avatarUrl, size = "md", className = "" }) {
   const sizeClass = sizeClasses[size];
   if (avatarUrl) {
-    return /* @__PURE__ */ jsx14(
+    return /* @__PURE__ */ jsx3(
       "img",
       {
         src: avatarUrl,
@@ -938,14 +305,24 @@ function Avatar({ name, avatarUrl, size = "md", className = "" }) {
       }
     );
   }
-  const initials = getInitials(name);
   const bgColor = getBgColor(name);
-  return /* @__PURE__ */ jsx14(
+  if (!name) {
+    return /* @__PURE__ */ jsx3(
+      "div",
+      {
+        className: `${sizeClass} ${bgColor} rounded-full flex items-center justify-center text-white flex-shrink-0 ${className}`,
+        role: "img",
+        "aria-label": "Contato sem nome",
+        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" }) })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx3(
     "div",
     {
       className: `${sizeClass} ${bgColor} rounded-full flex items-center justify-center text-white font-semibold flex-shrink-0 ${className}`,
-      title: name || void 0,
-      children: initials
+      title: name,
+      children: getInitials(name)
     }
   );
 }
@@ -970,13 +347,115 @@ function formatPhone(number) {
   }
   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",
+  MESSENGER: "messenger",
+  INSTAGRAM: "instagram",
+  WEBCHAT: "webchat"
+};
+var DEFAULT_CONVERSATION_CHANNEL = CONVERSATION_CHANNEL.WHATSAPP;
+var REOPEN_MECHANISM = {
+  TEMPLATE: "template",
+  TAG: "tag",
+  NONE: "none"
+};
+var HANDLE_KIND = {
+  PHONE: "phone",
+  USERNAME: "username",
+  SESSION: "session"
+};
+var CHANNEL_CAPABILITIES = {
+  [CONVERSATION_CHANNEL.WHATSAPP]: {
+    label: "WhatsApp",
+    icon: "\u{1F4AC}",
+    hasSessionWindow: true,
+    windowHours: 24,
+    reopenMechanism: REOPEN_MECHANISM.TEMPLATE,
+    handleKind: HANDLE_KIND.PHONE
+  },
+  [CONVERSATION_CHANNEL.MESSENGER]: {
+    // Messenger também tem 24h, mas reabre com message tag — não com template aprovado.
+    label: "Messenger",
+    icon: "\u{1F4E8}",
+    hasSessionWindow: true,
+    windowHours: 24,
+    reopenMechanism: REOPEN_MECHANISM.TAG,
+    handleKind: HANDLE_KIND.USERNAME
+  },
+  [CONVERSATION_CHANNEL.INSTAGRAM]: {
+    label: "Instagram",
+    icon: "\u{1F4F7}",
+    hasSessionWindow: true,
+    windowHours: 24,
+    reopenMechanism: REOPEN_MECHANISM.TAG,
+    handleKind: HANDLE_KIND.USERNAME
+  },
+  [CONVERSATION_CHANNEL.WEBCHAT]: {
+    // Chat próprio: sem intermediário, sem janela. Bloquear o composer aqui seria inventar limite.
+    label: "Chat do site",
+    icon: "\u{1F310}",
+    hasSessionWindow: false,
+    windowHours: 0,
+    reopenMechanism: REOPEN_MECHANISM.NONE,
+    handleKind: HANDLE_KIND.SESSION
+  }
+};
+function capabilitiesOf(channel) {
+  return CHANNEL_CAPABILITIES[channel ?? DEFAULT_CONVERSATION_CHANNEL];
+}
+var CHANNEL_FILTER_ALL = "all";
+function channelFiltersFor(conversations) {
+  const present = new Set(
+    conversations.map((conversation) => conversation.channel ?? DEFAULT_CONVERSATION_CHANNEL)
+  );
+  if (present.size < 2) return [];
+  const ordered = Object.keys(CHANNEL_CAPABILITIES).filter((channel) => present.has(channel));
+  return [
+    { value: CHANNEL_FILTER_ALL, label: "Todos" },
+    ...ordered.map((channel) => ({ value: channel, label: CHANNEL_CAPABILITIES[channel].label }))
+  ];
+}
+function formatContactHandle(params) {
+  const { handleKind } = capabilitiesOf(params.channel);
+  if (handleKind === HANDLE_KIND.PHONE) return formatPhone(params.handle);
+  if (handleKind === HANDLE_KIND.USERNAME) return params.handle.startsWith("@") ? params.handle : `@${params.handle}`;
+  return `Visitante ${params.handle.slice(-6)}`;
+}
+function contactFlag(params) {
+  return capabilitiesOf(params.channel).handleKind === HANDLE_KIND.PHONE ? phoneCountryFlag(params.handle) : "";
+}
+
 // src/ConversationListItem.tsx
-import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 function formatRelativeTime(dateStr) {
   try {
     const date = new Date(dateStr);
@@ -1035,50 +514,60 @@ var ConversationListItem = ({
   active = false,
   selected = false,
   onClick,
-  onSelect
+  onSelect,
+  showDivider = true,
+  highlightActive = true
 }) => {
   const isActive = active || selected;
   const windowStatus = useMemo(() => getWindowStatus(conversation.lastInboundAt), [conversation.lastInboundAt]);
   const preview = useMemo(() => lastMessagePreview(conversation), [conversation.lastContent]);
-  const name = conversation.clientName || formatPhone(conversation.whatsappNumber) || conversation.whatsappNumber;
+  const handle = conversation.contactId ?? conversation.whatsappNumber;
+  const displayHandle = formatContactHandle({ handle, channel: conversation.channel });
+  const name = conversation.clientName || displayHandle || handle;
   const timestamp = formatRelativeTime(conversation.lastAt);
+  const flag = contactFlag({ handle, channel: conversation.channel });
   const isInbound = conversation.lastDirection === "inbound";
   const handleClick = () => {
     onClick?.();
     onSelect?.(conversation.id);
   };
-  return /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs3(
     "button",
     {
       onClick: handleClick,
-      className: "w-full flex items-center gap-3 px-3 py-2.5 text-left transition-colors hover:bg-[#f0f2f5] border-b border-[#e9edef]",
+      className: `w-full flex items-center gap-3 px-3 py-2.5 text-left transition-colors ${highlightActive ? "hover:bg-[#f0f2f5]" : ""} ${showDivider ? "border-b border-[#e9edef]" : ""}`,
       style: {
-        backgroundColor: isActive ? "#f0f2f5" : "transparent"
+        backgroundColor: isActive && highlightActive ? "#f0f2f5" : "transparent"
       },
       children: [
-        /* @__PURE__ */ jsxs10("div", { className: "relative flex-shrink-0", children: [
-          /* @__PURE__ */ jsx15(Avatar, { name, size: "lg" }),
-          conversation.waitingHuman && /* @__PURE__ */ jsx15("div", { className: "absolute -bottom-0.5 -right-0.5 w-3.5 h-3.5 bg-amber-400 rounded-full border-2 border-white" })
+        /* @__PURE__ */ jsxs3("div", { className: "relative flex-shrink-0", children: [
+          /* @__PURE__ */ jsx4(Avatar, { name: conversation.clientName, size: "lg" }),
+          conversation.waitingHuman && /* @__PURE__ */ jsx4("div", { className: "absolute -bottom-0.5 -right-0.5 w-3.5 h-3.5 bg-amber-400 rounded-full border-2 border-white" })
         ] }),
-        /* @__PURE__ */ jsxs10("div", { className: "flex-1 min-w-0", children: [
-          /* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-between gap-2", children: [
-            /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-1.5 min-w-0", children: [
-              /* @__PURE__ */ jsx15("span", { className: "text-[16px] text-[#111b21] truncate", children: name }),
-              windowStatus && windowStatus.label === "expired" && /* @__PURE__ */ jsx15("span", { className: "w-2 h-2 rounded-full bg-red-500 flex-shrink-0", title: "Janela expirada" }),
-              windowStatus && windowStatus.label === "warning" && /* @__PURE__ */ jsx15("span", { className: "w-2 h-2 rounded-full bg-orange-500 flex-shrink-0", title: "Janela pr\xF3xima do fim" })
+        /* @__PURE__ */ jsxs3("div", { className: "flex-1 min-w-0", children: [
+          /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between gap-2", children: [
+            /* @__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" })
             ] }),
-            timestamp && /* @__PURE__ */ jsx15("span", { className: "text-xs text-[#667781] flex-shrink-0", children: timestamp })
+            timestamp && /* @__PURE__ */ jsx4("span", { className: "text-xs text-[#667781] flex-shrink-0", children: timestamp })
           ] }),
-          /* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-between mt-0.5", children: [
-            /* @__PURE__ */ jsxs10("span", { className: "text-sm text-[#667781] truncate max-w-[180px]", children: [
-              preview.icon && /* @__PURE__ */ jsx15("span", { className: "mr-1", children: preview.icon }),
+          conversation.clientName ? /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-1 text-xs text-[#667781]", children: [
+            flag ? /* @__PURE__ */ jsx4("span", { "aria-hidden": true, children: flag }) : null,
+            /* @__PURE__ */ jsx4("span", { className: "truncate", children: displayHandle })
+          ] }) : null,
+          /* @__PURE__ */ jsxs3("div", { className: "flex items-center justify-between mt-0.5", children: [
+            /* @__PURE__ */ jsxs3("span", { className: "text-sm text-[#667781] truncate max-w-[180px]", children: [
+              preview.icon && /* @__PURE__ */ jsx4("span", { className: "mr-1", children: preview.icon }),
               preview.preview || "Sem mensagens"
             ] }),
-            conversation.unread > 0 && /* @__PURE__ */ jsx15("span", { className: "bg-[#25d366] text-white text-xs font-semibold rounded-full min-w-[20px] h-5 px-1.5 flex items-center justify-center flex-shrink-0 ml-2", children: conversation.unread > 99 ? "99+" : conversation.unread })
+            conversation.unread > 0 && /* @__PURE__ */ jsx4("span", { className: "bg-[#25d366] text-white text-xs font-semibold rounded-full min-w-[20px] h-5 px-1.5 flex items-center justify-center flex-shrink-0 ml-2", children: conversation.unread > 99 ? "99+" : conversation.unread })
           ] }),
-          /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-1.5 mt-1", children: [
-            conversation.mode === "human" && /* @__PURE__ */ jsx15("span", { className: "text-[10px] px-1.5 py-0.5 rounded font-medium bg-purple-100 text-purple-700", children: "Humano" }),
-            conversation.mode === "bot" && conversation.waitingHuman && /* @__PURE__ */ jsx15("span", { className: "text-[10px] px-1.5 py-0.5 rounded font-medium bg-amber-100 text-amber-700", children: "Aguardando" })
+          /* @__PURE__ */ jsxs3("div", { className: "flex items-center gap-1.5 mt-1", children: [
+            conversation.mode === "human" && /* @__PURE__ */ jsx4("span", { className: "text-[10px] px-1.5 py-0.5 rounded font-medium bg-purple-100 text-purple-700", children: "Humano" }),
+            conversation.mode === "bot" && conversation.waitingHuman && /* @__PURE__ */ jsx4("span", { className: "text-[10px] px-1.5 py-0.5 rounded font-medium bg-amber-100 text-amber-700", children: "Aguardando" })
           ] })
         ] })
       ]
@@ -1087,9 +576,9 @@ var ConversationListItem = ({
 };
 
 // src/Toast.tsx
-import { createContext as createContext2, useContext as useContext2, useState as useState7, useCallback as useCallback3, useEffect as useEffect3 } from "react";
-import { jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
-var ToastContext = createContext2(null);
+import { createContext, useContext, useState as useState2, useCallback, useEffect as useEffect2 } from "react";
+import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
+var ToastContext = createContext(null);
 var nextId = 0;
 var singletonShow = null;
 var toast = {
@@ -1105,34 +594,34 @@ var typeStyles = {
   info: "bg-blue-600"
 };
 var typeIcons = {
-  success: /* @__PURE__ */ jsx16("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx16("polyline", { points: "20 6 9 17 4 12" }) }),
-  error: /* @__PURE__ */ jsxs11("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
-    /* @__PURE__ */ jsx16("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-    /* @__PURE__ */ jsx16("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+  success: /* @__PURE__ */ jsx5("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsx5("polyline", { points: "20 6 9 17 4 12" }) }),
+  error: /* @__PURE__ */ jsxs4("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+    /* @__PURE__ */ jsx5("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+    /* @__PURE__ */ jsx5("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
   ] }),
-  info: /* @__PURE__ */ jsxs11("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
-    /* @__PURE__ */ jsx16("circle", { cx: "12", cy: "12", r: "10" }),
-    /* @__PURE__ */ jsx16("line", { x1: "12", y1: "16", x2: "12", y2: "12" }),
-    /* @__PURE__ */ jsx16("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })
+  info: /* @__PURE__ */ jsxs4("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+    /* @__PURE__ */ jsx5("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx5("line", { x1: "12", y1: "16", x2: "12", y2: "12" }),
+    /* @__PURE__ */ jsx5("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })
   ] })
 };
 function ToastItemComponent({ item, onRemove }) {
-  const [exiting, setExiting] = useState7(false);
-  useEffect3(() => {
+  const [exiting, setExiting] = useState2(false);
+  useEffect2(() => {
     const timer = setTimeout(() => {
       setExiting(true);
       setTimeout(() => onRemove(item.id), 300);
     }, 5e3);
     return () => clearTimeout(timer);
   }, [item.id, onRemove]);
-  return /* @__PURE__ */ jsxs11(
+  return /* @__PURE__ */ jsxs4(
     "div",
     {
       className: `flex items-center gap-2 px-4 py-3 rounded-lg shadow-lg text-white text-sm min-w-[280px] max-w-[400px] ${typeStyles[item.type]} ${exiting ? "animate-slide-out" : "animate-slide-in"}`,
       children: [
-        /* @__PURE__ */ jsx16("span", { className: "flex-shrink-0", children: typeIcons[item.type] }),
-        /* @__PURE__ */ jsx16("span", { className: "flex-1", children: item.message }),
-        /* @__PURE__ */ jsx16(
+        /* @__PURE__ */ jsx5("span", { className: "flex-shrink-0", children: typeIcons[item.type] }),
+        /* @__PURE__ */ jsx5("span", { className: "flex-1", children: item.message }),
+        /* @__PURE__ */ jsx5(
           "button",
           {
             onClick: () => {
@@ -1140,9 +629,9 @@ function ToastItemComponent({ item, onRemove }) {
               setTimeout(() => onRemove(item.id), 300);
             },
             className: "flex-shrink-0 opacity-70 hover:opacity-100 transition-opacity",
-            children: /* @__PURE__ */ jsxs11("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
-              /* @__PURE__ */ jsx16("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-              /* @__PURE__ */ jsx16("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+            children: /* @__PURE__ */ jsxs4("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+              /* @__PURE__ */ jsx5("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+              /* @__PURE__ */ jsx5("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
             ] })
           }
         )
@@ -1151,24 +640,24 @@ function ToastItemComponent({ item, onRemove }) {
   );
 }
 function ToastProvider({ children }) {
-  const [items, setItems] = useState7([]);
-  const show = useCallback3((type, message) => {
+  const [items, setItems] = useState2([]);
+  const show = useCallback((type, message) => {
     const id = ++nextId;
     setItems((prev) => [...prev, { id, type, message }]);
   }, []);
-  const remove = useCallback3((id) => {
+  const remove = useCallback((id) => {
     setItems((prev) => prev.filter((item) => item.id !== id));
   }, []);
-  useEffect3(() => {
+  useEffect2(() => {
     singletonShow = show;
     return () => {
       singletonShow = null;
     };
   }, [show]);
-  return /* @__PURE__ */ jsxs11(ToastContext.Provider, { value: { show }, children: [
+  return /* @__PURE__ */ jsxs4(ToastContext.Provider, { value: { show }, children: [
     children,
-    /* @__PURE__ */ jsx16("div", { className: "fixed top-4 right-4 z-[100] flex flex-col gap-2", children: items.map((item) => /* @__PURE__ */ jsx16(ToastItemComponent, { item, onRemove: remove }, item.id)) }),
-    /* @__PURE__ */ jsx16("style", { children: `
+    /* @__PURE__ */ jsx5("div", { className: "fixed top-4 right-4 z-[100] flex flex-col gap-2", children: items.map((item) => /* @__PURE__ */ jsx5(ToastItemComponent, { item, onRemove: remove }, item.id)) }),
+    /* @__PURE__ */ jsx5("style", { children: `
         @keyframes slide-in {
           from { transform: translateX(100%); opacity: 0; }
           to { transform: translateX(0); opacity: 1; }
@@ -1183,7 +672,7 @@ function ToastProvider({ children }) {
   ] });
 }
 function useToast() {
-  const context = useContext2(ToastContext);
+  const context = useContext(ToastContext);
   if (!context) {
     throw new Error("useToast must be used within a ToastProvider");
   }
@@ -1191,11 +680,11 @@ function useToast() {
 }
 
 // src/MessageText.tsx
-import { useCallback as useCallback4, useState as useState8 } from "react";
-import { jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
+import { useCallback as useCallback2, useState as useState3 } from "react";
+import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
 function MessageText({ message }) {
-  const [copied, setCopied] = useState8(false);
-  const handleCopy = useCallback4(async () => {
+  const [copied, setCopied] = useState3(false);
+  const handleCopy = useCallback2(async () => {
     if (!message.content) return;
     try {
       await navigator.clipboard.writeText(message.content);
@@ -1205,62 +694,611 @@ function MessageText({ message }) {
     }
   }, [message.content]);
   if (message.type === "template")
-    return /* @__PURE__ */ jsx17("p", { className: "text-sm italic text-[#667781]", children: message.content ?? "Template message" });
-  return /* @__PURE__ */ jsxs12(
+    return /* @__PURE__ */ jsx6("p", { className: "text-sm italic text-[#667781]", children: message.content ?? "Template message" });
+  return /* @__PURE__ */ jsxs5(
     "div",
     {
       onClick: handleCopy,
       className: "text-[14.2px] leading-[19px] whitespace-pre-wrap break-words select-all [&_strong]:font-bold [&_em]:italic [&_del]:line-through",
       children: [
-        /* @__PURE__ */ jsx17("span", { children: parseWhatsAppFormatting(message.content ?? "") }),
-        copied && /* @__PURE__ */ jsx17("span", { className: "absolute top-0 right-0 -translate-y-full bg-[#3b4a54] text-white text-[11px] px-1.5 py-0.5 rounded shadow-lg", children: "Copiado!" })
+        /* @__PURE__ */ jsx6("span", { children: parseWhatsAppFormatting(message.content ?? "") }),
+        copied && /* @__PURE__ */ jsx6("span", { className: "absolute top-0 right-0 -translate-y-full bg-[#3b4a54] text-white text-[11px] px-1.5 py-0.5 rounded shadow-lg", children: "Copiado!" })
       ]
     }
   );
 }
 
 // src/MessageTimestamp.tsx
-import { jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
 function MessageTimestamp({ timestamp, status, isOutbound }) {
-  return /* @__PURE__ */ jsxs13("div", { className: "flex items-center justify-end gap-[3px]", children: [
-    /* @__PURE__ */ jsx18("span", { className: "text-[11px] text-[#667781] leading-[15px] select-none", children: timestamp }),
-    isOutbound && status && /* @__PURE__ */ jsx18("span", { className: "flex items-center -mr-[2px]", children: /* @__PURE__ */ jsx18(StatusTicks, { status }) })
+  return /* @__PURE__ */ jsxs6("div", { className: "flex items-center justify-end gap-[3px]", children: [
+    /* @__PURE__ */ jsx7("span", { className: "text-[11px] text-[#667781] leading-[15px] select-none", children: timestamp }),
+    isOutbound && status && /* @__PURE__ */ jsx7("span", { className: "flex items-center -mr-[2px]", children: /* @__PURE__ */ jsx7(StatusTicks, { status }) })
   ] });
 }
 
 // src/MessageTail.tsx
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { jsx as jsx8 } from "react/jsx-runtime";
 function MessageTail({ isOutbound }) {
   if (isOutbound)
-    return /* @__PURE__ */ jsx19("svg", { className: "absolute top-0 -right-[5px] w-[5px] h-[11px]", viewBox: "0 0 5 11", fill: "#d9fdd3", children: /* @__PURE__ */ jsx19("path", { d: "M5 0H0v11c1.5-2 4.5-2 5-4V0z" }) });
-  return /* @__PURE__ */ jsx19("svg", { className: "absolute top-0 -left-[5px] w-[5px] h-[11px]", viewBox: "0 0 5 11", fill: "white", children: /* @__PURE__ */ jsx19("path", { d: "M0 0h5v11C3.5 9 .5 9 0 7V0z" }) });
+    return /* @__PURE__ */ jsx8("svg", { className: "absolute top-0 -right-[5px] w-[5px] h-[11px]", viewBox: "0 0 5 11", fill: "#d9fdd3", children: /* @__PURE__ */ jsx8("path", { d: "M5 0H0v11c1.5-2 4.5-2 5-4V0z" }) });
+  return /* @__PURE__ */ jsx8("svg", { className: "absolute top-0 -left-[5px] w-[5px] h-[11px]", viewBox: "0 0 5 11", fill: "white", children: /* @__PURE__ */ jsx8("path", { d: "M0 0h5v11C3.5 9 .5 9 0 7V0z" }) });
 }
 
-// src/useWaitingNotifications.ts
-import { useState as useState9, useEffect as useEffect4, useRef as useRef5, useCallback as useCallback5 } from "react";
+// src/conversationWindow.ts
+var MINUTE_MS = 6e4;
+var HOUR_MS = 60 * MINUTE_MS;
+var DAY_MS = 24 * HOUR_MS;
+var CONVERSATION_WINDOW = {
+  ALL: "all",
+  FRESH: "fresh",
+  WARNING: "warning",
+  CRITICAL: "critical",
+  EXPIRED: "expired"
+};
+var WINDOW_FILTERS = [
+  { value: CONVERSATION_WINDOW.ALL, label: "Todas", dotClass: "" },
+  { value: CONVERSATION_WINDOW.FRESH, label: "<12h", dotClass: "bg-green-500" },
+  { value: CONVERSATION_WINDOW.WARNING, label: "12-21h", dotClass: "bg-yellow-500" },
+  { value: CONVERSATION_WINDOW.CRITICAL, label: "21-24h", dotClass: "bg-red-500" },
+  { value: CONVERSATION_WINDOW.EXPIRED, label: ">24h", dotClass: "bg-gray-400" }
+];
+var WARNING_RATIO = 0.5;
+var CRITICAL_RATIO = 0.875;
+function windowOf(params) {
+  const capabilities = capabilitiesOf(params.channel);
+  if (!capabilities.hasSessionWindow) return CONVERSATION_WINDOW.FRESH;
+  if (!params.lastInboundAt) return CONVERSATION_WINDOW.EXPIRED;
+  const windowMs = capabilities.windowHours * HOUR_MS;
+  const elapsed = params.now - new Date(params.lastInboundAt).getTime();
+  if (elapsed >= windowMs) return CONVERSATION_WINDOW.EXPIRED;
+  if (elapsed >= windowMs * CRITICAL_RATIO) return CONVERSATION_WINDOW.CRITICAL;
+  if (elapsed >= windowMs * WARNING_RATIO) return CONVERSATION_WINDOW.WARNING;
+  return CONVERSATION_WINDOW.FRESH;
+}
+function formatStalledFor(lastAt, now) {
+  const elapsed = Math.max(0, now - new Date(lastAt).getTime());
+  const days = Math.floor(elapsed / DAY_MS);
+  const hours = Math.floor(elapsed % DAY_MS / HOUR_MS);
+  const minutes = Math.floor(elapsed % HOUR_MS / MINUTE_MS);
+  if (days > 0) return `${days}d ${hours}h:${String(minutes).padStart(2, "0")}m`;
+  if (hours > 0) return `${hours}h:${String(minutes).padStart(2, "0")}m`;
+  return `${minutes}m`;
+}
+
+// src/ChannelIcon.tsx
+import { Fragment as Fragment2, jsx as jsx9, jsxs as jsxs7 } from "react/jsx-runtime";
+var CHANNEL_BRAND_COLOR = {
+  [CONVERSATION_CHANNEL.WHATSAPP]: "#25D366",
+  [CONVERSATION_CHANNEL.MESSENGER]: "#0084FF",
+  [CONVERSATION_CHANNEL.INSTAGRAM]: "#E4405F",
+  [CONVERSATION_CHANNEL.WEBCHAT]: "#64748B"
+};
+function Glyph({ channel }) {
+  const color = CHANNEL_BRAND_COLOR[channel];
+  if (channel === CONVERSATION_CHANNEL.WHATSAPP) {
+    return /* @__PURE__ */ jsxs7(Fragment2, { children: [
+      /* @__PURE__ */ jsx9("circle", { cx: "12", cy: "12", r: "11", fill: color }),
+      /* @__PURE__ */ jsx9(
+        "path",
+        {
+          d: "M8.6 7.2c.3-.1.7 0 .9.3l1 1.6c.2.3.1.7-.1.9l-.7.7c.6 1.3 1.6 2.3 2.9 2.9l.7-.7c.2-.2.6-.3.9-.1l1.6 1c.3.2.4.6.3.9-.4 1-1.4 1.6-2.4 1.4-3-.5-5.4-2.9-5.9-5.9-.2-1 .4-2 1.4-2.4Z",
+          fill: "#fff"
+        }
+      )
+    ] });
+  }
+  if (channel === CONVERSATION_CHANNEL.MESSENGER) {
+    return /* @__PURE__ */ jsxs7(Fragment2, { children: [
+      /* @__PURE__ */ jsx9("circle", { cx: "12", cy: "12", r: "11", fill: color }),
+      /* @__PURE__ */ jsx9("path", { d: "M6.5 15.5 11 10.8l2.4 2.4L17.5 9l-4.6 4.9-2.4-2.4-4 4Z", fill: "#fff", stroke: "#fff", strokeWidth: "1.4", strokeLinejoin: "round" })
+    ] });
+  }
+  if (channel === CONVERSATION_CHANNEL.INSTAGRAM) {
+    return /* @__PURE__ */ jsxs7(Fragment2, { children: [
+      /* @__PURE__ */ jsx9("rect", { x: "2", y: "2", width: "20", height: "20", rx: "6", fill: color }),
+      /* @__PURE__ */ jsx9("rect", { x: "6.5", y: "6.5", width: "11", height: "11", rx: "3.5", fill: "none", stroke: "#fff", strokeWidth: "1.6" }),
+      /* @__PURE__ */ jsx9("circle", { cx: "12", cy: "12", r: "2.6", fill: "none", stroke: "#fff", strokeWidth: "1.6" }),
+      /* @__PURE__ */ jsx9("circle", { cx: "16.4", cy: "7.6", r: "1", fill: "#fff" })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs7(Fragment2, { children: [
+    /* @__PURE__ */ jsx9("circle", { cx: "12", cy: "12", r: "11", fill: color }),
+    /* @__PURE__ */ jsx9("path", { d: "M6.5 8.5h11v7h-5.5L8.5 18v-2.5h-2v-7Z", fill: "#fff" })
+  ] });
+}
+function ChannelIcon({ channel, size = 14, className = "" }) {
+  const resolved = channel ?? CONVERSATION_CHANNEL.WHATSAPP;
+  const { label } = capabilitiesOf(resolved);
+  return /* @__PURE__ */ jsx9(
+    "svg",
+    {
+      viewBox: "0 0 24 24",
+      width: size,
+      height: size,
+      className: `inline-block shrink-0 ${className}`.trim(),
+      role: "img",
+      "aria-label": label,
+      children: /* @__PURE__ */ jsx9(Glyph, { channel: resolved })
+    }
+  );
+}
+
+// src/ConversationRow.tsx
+import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
+var WINDOW_TITLE = {
+  [CONVERSATION_WINDOW.ALL]: "",
+  [CONVERSATION_WINDOW.FRESH]: "Janela de 24h aberta (menos de 12h)",
+  [CONVERSATION_WINDOW.WARNING]: "Janela de 24h fechando (12-21h)",
+  [CONVERSATION_WINDOW.CRITICAL]: "Janela de 24h quase expirada (21-24h)",
+  [CONVERSATION_WINDOW.EXPIRED]: "Janela de 24h expirada \u2014 s\xF3 template"
+};
+var STALLED_THRESHOLD_MS = 60 * 60 * 1e3;
+var WINDOW_BAR_CLASS = {
+  [CONVERSATION_WINDOW.ALL]: "bg-transparent",
+  [CONVERSATION_WINDOW.FRESH]: "bg-green-500",
+  [CONVERSATION_WINDOW.WARNING]: "bg-yellow-500",
+  [CONVERSATION_WINDOW.CRITICAL]: "bg-red-500",
+  [CONVERSATION_WINDOW.EXPIRED]: "bg-gray-300"
+};
+function ConversationRow({
+  conversation,
+  active,
+  selected,
+  now,
+  busy,
+  onOpen,
+  onToggleSelected,
+  onTakeover,
+  className,
+  classNames
+}) {
+  const capabilities = capabilitiesOf(conversation.channel);
+  const window2 = windowOf({ lastInboundAt: conversation.lastInboundAt, now, channel: conversation.channel });
+  const stalledMs = now - new Date(conversation.lastAt).getTime();
+  const isStalled = stalledMs > STALLED_THRESHOLD_MS;
+  const isWaiting = conversation.mode === "bot" && conversation.waitingHuman;
+  return /* @__PURE__ */ jsxs8("div", { className: cn("cv-row flex border-b", active && "cv-row--active", classNames?.root, className), children: [
+    /* @__PURE__ */ jsx10(
+      "span",
+      {
+        className: cn("w-1 shrink-0", WINDOW_BAR_CLASS[window2], classNames?.windowBar),
+        title: WINDOW_TITLE[window2],
+        "aria-label": WINDOW_TITLE[window2]
+      }
+    ),
+    /* @__PURE__ */ jsxs8("div", { className: "min-w-0 flex-1", children: [
+      /* @__PURE__ */ jsxs8("div", { className: "flex items-start gap-2 px-2 pt-2", children: [
+        /* @__PURE__ */ jsx10(
+          "input",
+          {
+            type: "checkbox",
+            checked: selected,
+            onChange: onToggleSelected,
+            "aria-label": `Selecionar conversa ${conversation.whatsappNumber}`,
+            className: "mt-3"
+          }
+        ),
+        /* @__PURE__ */ jsx10("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ jsx10(
+          ConversationListItem,
+          {
+            conversation,
+            active,
+            onClick: onOpen,
+            showDivider: false,
+            highlightActive: false
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ jsxs8("div", { className: "flex flex-wrap items-center gap-1.5 px-4 pb-2 pl-8", children: [
+        /* @__PURE__ */ jsxs8("span", { className: "cv-pill", children: [
+          /* @__PURE__ */ jsx10(ChannelIcon, { channel: conversation.channel }),
+          " ",
+          capabilities.label
+        ] }),
+        conversation.mode === "human" ? /* @__PURE__ */ jsx10("span", { className: "cv-pill cv-pill--success", children: "\u{1F9D1}\u200D\u{1F4BC} em atendimento" }) : null,
+        isWaiting ? /* @__PURE__ */ jsx10("span", { className: "cv-pill cv-pill--warning", children: "\u23F3 aguardando atendimento" }) : null,
+        !isWaiting && conversation.mode === "bot" ? /* @__PURE__ */ jsx10("span", { className: "cv-pill", children: "\u{1F916} bot ativo" }) : null,
+        isStalled ? /* @__PURE__ */ jsxs8("span", { className: "cv-pill cv-pill--danger", children: [
+          "\u23F1\uFE0F parada h\xE1 ",
+          formatStalledFor(conversation.lastAt, now)
+        ] }) : null,
+        isWaiting ? /* @__PURE__ */ jsx10("button", { type: "button", onClick: onTakeover, disabled: busy, className: "cv-header-action", children: "\u25B6\uFE0F Continuar Atendimento" }) : null
+      ] })
+    ] })
+  ] });
+}
+
+// src/ConversationHeader.tsx
+import { useState as useState4 } from "react";
+import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
+var DEFAULT_CONVERSATION_HEADER_LABELS = {
+  botMode: "\u{1F916} atendimento autom\xE1tico",
+  humanMode: "\u{1F9D1}\u200D\u{1F4BC} atendimento humano",
+  returnToBot: "Devolver ao bot",
+  finish: "Finalizar",
+  takeover: "Assumir atendimento",
+  download: "Baixar conversa",
+  documents: "Arquivos da conversa",
+  back: "Voltar para a lista",
+  moreActions: "Mais a\xE7\xF5es"
+};
+function ConversationHeader({
+  conversation,
+  busy = false,
+  onTakeover,
+  onReturnToBot,
+  onFinish,
+  onDownload,
+  onOpenDocuments,
+  documentsOpen = false,
+  onBack,
+  labels: labelsOverride,
+  className,
+  classNames
+}) {
+  const labels = { ...DEFAULT_CONVERSATION_HEADER_LABELS, ...labelsOverride };
+  const isHuman = conversation.mode === "human";
+  const handle = conversation.contactId ?? conversation.whatsappNumber;
+  const displayHandle = formatContactHandle({ handle, channel: conversation.channel });
+  const flag = contactFlag({ handle, channel: conversation.channel });
+  const capabilities = capabilitiesOf(conversation.channel);
+  const [menuOpen, setMenuOpen] = useState4(false);
+  const utilities = [
+    onOpenDocuments ? { key: "documents", icon: "\u{1F4C4}", label: labels.documents, run: onOpenDocuments, active: documentsOpen } : void 0,
+    onDownload ? { key: "download", icon: "\u2B07\uFE0F", label: labels.download, run: onDownload, active: false } : void 0
+  ].filter(
+    (utility) => Boolean(utility)
+  );
+  const actions = [
+    !isHuman && onTakeover ? { key: "takeover", label: labels.takeover, run: onTakeover, className: "cv-header-action--primary" } : void 0,
+    isHuman && onReturnToBot ? { key: "release", label: labels.returnToBot, run: onReturnToBot, className: "" } : void 0,
+    isHuman && onFinish ? { key: "finish", label: `\u2715 ${labels.finish}`, run: onFinish, className: "cv-header-action--danger" } : void 0
+  ].filter((action) => Boolean(action));
+  const menuItems = [
+    ...utilities.map((utility) => ({
+      key: utility.key,
+      label: `${utility.icon} ${utility.label}`,
+      run: utility.run,
+      className: ""
+    })),
+    ...actions
+  ];
+  return /* @__PURE__ */ jsxs9(
+    "header",
+    {
+      className: cn(
+        "flex flex-nowrap items-center justify-between gap-3 border-b px-4 py-3",
+        classNames?.root,
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs9("div", { className: cn("flex min-w-0 flex-1 items-center gap-3", classNames?.identity), children: [
+          onBack ? /* @__PURE__ */ jsx11("button", { type: "button", onClick: onBack, className: "cv-back cv-touch", "aria-label": labels.back, title: labels.back, children: "\u2190" }) : null,
+          /* @__PURE__ */ jsx11(Avatar, { name: conversation.clientName, size: "md" }),
+          /* @__PURE__ */ jsxs9("div", { className: "min-w-0", children: [
+            /* @__PURE__ */ jsx11("p", { className: cn("truncate font-medium", classNames?.name), children: conversation.clientName ?? displayHandle }),
+            /* @__PURE__ */ jsxs9("p", { className: cn("truncate text-xs text-gray-500", classNames?.meta), children: [
+              flag ? `${flag} ` : "",
+              displayHandle,
+              /* @__PURE__ */ jsxs9("span", { className: "ml-2 inline-flex items-center gap-1", children: [
+                /* @__PURE__ */ jsx11(ChannelIcon, { channel: conversation.channel }),
+                /* @__PURE__ */ jsx11("span", { className: "cv-only-wide", children: capabilities.label })
+              ] }),
+              /* @__PURE__ */ jsx11("span", { className: "ml-2 cv-only-wide", children: isHuman ? labels.humanMode : labels.botMode }),
+              /* @__PURE__ */ jsx11("span", { className: "ml-1 cv-only-narrow", title: isHuman ? labels.humanMode : labels.botMode, children: isHuman ? "\u{1F9D1}\u200D\u{1F4BC}" : "\u{1F916}" })
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs9("div", { className: cn("flex shrink-0 items-center gap-2", classNames?.actions), children: [
+          /* @__PURE__ */ jsxs9("div", { className: cn("hidden items-center gap-2 lg:flex", classNames?.desktopActions), children: [
+            utilities.map((utility) => /* @__PURE__ */ jsx11(
+              "button",
+              {
+                type: "button",
+                onClick: utility.run,
+                disabled: busy,
+                "aria-pressed": utility.active,
+                title: utility.label,
+                "aria-label": utility.label,
+                className: `cv-header-icon ${utility.active ? "cv-header-icon--active" : ""}`,
+                children: utility.icon
+              },
+              utility.key
+            )),
+            actions.map((action) => /* @__PURE__ */ jsx11(
+              "button",
+              {
+                type: "button",
+                onClick: action.run,
+                disabled: busy,
+                className: `cv-header-action ${action.className}`,
+                children: action.label
+              },
+              action.key
+            ))
+          ] }),
+          menuItems.length > 0 ? /* @__PURE__ */ jsxs9("div", { className: cn("cv-menu lg:hidden", classNames?.mobileMenu), children: [
+            /* @__PURE__ */ jsx11(
+              "button",
+              {
+                type: "button",
+                onClick: () => setMenuOpen(!menuOpen),
+                "aria-expanded": menuOpen,
+                "aria-label": labels.moreActions,
+                title: labels.moreActions,
+                className: "cv-header-icon cv-touch",
+                children: "\u22EE"
+              }
+            ),
+            menuOpen ? /* @__PURE__ */ jsx11("div", { className: "cv-menu-panel", role: "menu", children: menuItems.map((item) => /* @__PURE__ */ jsx11(
+              "button",
+              {
+                type: "button",
+                role: "menuitem",
+                onClick: () => {
+                  setMenuOpen(false);
+                  item.run();
+                },
+                disabled: busy,
+                className: `cv-header-action cv-touch ${item.className}`,
+                children: item.label
+              },
+              item.key
+            )) }) : null
+          ] }) : null
+        ] })
+      ]
+    }
+  );
+}
+
+// src/ConversationContextPanel.tsx
+import { useState as useState6 } from "react";
+
+// src/useIsNarrow.ts
+import { useEffect as useEffect3, useState as useState5 } from "react";
+var NARROW_MAX_WIDTH_PX = 1023;
+function useIsNarrow() {
+  const [isNarrow, setIsNarrow] = useState5(
+    () => typeof window !== "undefined" && window.matchMedia(`(max-width: ${NARROW_MAX_WIDTH_PX}px)`).matches
+  );
+  useEffect3(() => {
+    const query = window.matchMedia(`(max-width: ${NARROW_MAX_WIDTH_PX}px)`);
+    const handleChange = (event) => setIsNarrow(event.matches);
+    query.addEventListener("change", handleChange);
+    setIsNarrow(query.matches);
+    return () => query.removeEventListener("change", handleChange);
+  }, []);
+  return isNarrow;
+}
+
+// src/ConversationContextPanel.tsx
+import { jsx as jsx12, jsxs as jsxs10 } from "react/jsx-runtime";
+var DEFAULT_CONVERSATION_CONTEXT_LABELS = {
+  title: "\u{1F4CB} Suas Sele\xE7\xF5es",
+  empty: "Nada coletado ainda nesta conversa."
+};
+function ConversationContextPanel({
+  entries,
+  labels: labelsOverride,
+  className,
+  classNames
+}) {
+  const labels = { ...DEFAULT_CONVERSATION_CONTEXT_LABELS, ...labelsOverride };
+  const filled = entries.filter((entry) => Boolean(entry.value));
+  const isNarrow = useIsNarrow();
+  const [manualOpen, setManualOpen] = useState6(void 0);
+  const open = manualOpen ?? (!isNarrow && filled.length > 0);
+  return /* @__PURE__ */ jsxs10("section", { className: cn("border-b", classNames?.root, className), children: [
+    /* @__PURE__ */ jsxs10(
+      "button",
+      {
+        type: "button",
+        onClick: () => setManualOpen(!open),
+        "aria-expanded": open,
+        className: cn("flex w-full items-center gap-2 px-4 py-3 text-left text-sm font-medium", classNames?.toggle),
+        children: [
+          /* @__PURE__ */ jsx12("span", { "aria-hidden": true, className: "text-xs", children: open ? "\u25BE" : "\u25B8" }),
+          /* @__PURE__ */ jsx12("span", { children: labels.title }),
+          /* @__PURE__ */ jsxs10("span", { className: cn("rounded-full bg-gray-200 px-2 text-xs dark:bg-gray-700", classNames?.counter), children: [
+            filled.length,
+            "/",
+            entries.length
+          ] })
+        ]
+      }
+    ),
+    open ? /* @__PURE__ */ jsx12("div", { className: cn("px-4 pb-3", classNames?.body), children: entries.length === 0 ? /* @__PURE__ */ jsx12("p", { className: "text-xs text-gray-500", children: labels.empty }) : /* @__PURE__ */ jsx12("dl", { className: "grid grid-cols-2 gap-2 text-xs", children: entries.map((entry) => /* @__PURE__ */ jsxs10("div", { className: "min-w-0", children: [
+      /* @__PURE__ */ jsxs10("dt", { className: "truncate text-gray-500", children: [
+        entry.icon ? `${entry.icon} ` : "",
+        entry.label
+      ] }),
+      /* @__PURE__ */ jsx12("dd", { className: "truncate font-medium", children: entry.value ? /* @__PURE__ */ jsxs10("span", { className: "text-green-700 dark:text-green-400", children: [
+        "\u2713 ",
+        entry.value
+      ] }) : "\u2014" })
+    ] }, entry.key)) }) }) : null
+  ] });
+}
+
+// src/WindowExpiredNotice.tsx
+import { jsx as jsx13, jsxs as jsxs11 } from "react/jsx-runtime";
+var DEFAULT_WINDOW_EXPIRED_LABELS = {
+  title: "\u23F0 Janela de 24h expirada \u2014 o WhatsApp n\xE3o aceita mensagens livres.",
+  description: "Envie uma mensagem de template para reabrir a conversa com o cliente.",
+  sendTemplate: "\u{1F4E8} Enviar Template (HSM)"
+};
+function WindowExpiredNotice({
+  onSendTemplate,
+  disabled = false,
+  labels: labelsOverride,
+  className
+}) {
+  const labels = { ...DEFAULT_WINDOW_EXPIRED_LABELS, ...labelsOverride };
+  return /* @__PURE__ */ jsxs11("div", { role: "status", className: cn("border-t bg-yellow-50 px-4 py-3 text-sm dark:bg-yellow-950", className), children: [
+    /* @__PURE__ */ jsx13("p", { className: "font-medium text-yellow-900 dark:text-yellow-200", children: labels.title }),
+    /* @__PURE__ */ jsx13("p", { className: "text-yellow-800 dark:text-yellow-300", children: labels.description }),
+    onSendTemplate ? /* @__PURE__ */ jsx13("button", { type: "button", onClick: onSendTemplate, disabled, className: "cv-header-action mt-2", children: labels.sendTemplate }) : null
+  ] });
+}
+function isWindowBlocking(window2) {
+  return window2 === CONVERSATION_WINDOW.EXPIRED;
+}
+
+// src/ConversationDocumentsPanel.tsx
+import { useState as useState8 } from "react";
 
 // src/providers/ConversationsProvider.tsx
-import { createContext as createContext3, useContext as useContext3 } from "react";
-import { jsx as jsx20 } from "react/jsx-runtime";
-var ConversationsContext = createContext3(null);
+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__ */ jsx20(ConversationsContext.Provider, { value: { api, sse }, children });
+  return /* @__PURE__ */ jsx14(ConversationsContext.Provider, { value: { api, sse }, children });
 }
 function useConversations() {
-  return useContext3(ConversationsContext);
+  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",
+  bot: "Bot",
+  agent: "Atendente"
+};
+function buildTranscriptText(params) {
+  const header = [
+    `Conversa: ${params.clientName ?? params.whatsappNumber}`,
+    `N\xFAmero: ${params.whatsappNumber}`,
+    `Mensagens: ${params.messages.length}`,
+    ""
+  ];
+  const lines = params.messages.map((message) => {
+    const stamp = new Date(message.timestamp).toLocaleString("pt-BR");
+    const author = message.agentName ?? SENDER_LABEL[message.sender];
+    const body = message.content ?? message.caption ?? `<${message.type}>`;
+    return `[${stamp}] ${author}: ${body}`;
+  });
+  return [...header, ...lines].join("\n");
+}
+function buildTranscriptFilename(whatsappNumber, generatedAt) {
+  const stamp = generatedAt.toISOString().slice(0, 10);
+  return `conversa-${whatsappNumber}-${stamp}.txt`;
+}
+function downloadTextFile(filename, content) {
+  const blob = new Blob([content], { type: "text/plain;charset=utf-8" });
+  const url = URL.createObjectURL(blob);
+  const anchor = document.createElement("a");
+  anchor.href = url;
+  anchor.download = filename;
+  anchor.click();
+  URL.revokeObjectURL(url);
 }
 
 // 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 = useRef5(/* @__PURE__ */ new Map());
-  const notifiedIds = useRef5(/* @__PURE__ */ new Set());
-  const pollConversations = useCallback5(async () => {
+  const previousUnreadMap = useRef4(/* @__PURE__ */ new Map());
+  const notifiedIds = useRef4(/* @__PURE__ */ new Set());
+  const pollConversations = useCallback4(async () => {
     if (!conversationsCtx) return;
     try {
       const result = await conversationsCtx.api.fetchConversations({ limit: 50 });
@@ -1285,7 +1323,7 @@ function useWaitingNotifications() {
     } catch {
     }
   }, [conversationsCtx]);
-  useEffect4(() => {
+  useEffect5(() => {
     if (typeof window !== "undefined" && "Notification" in window && Notification.permission === "default") {
       Notification.requestPermission();
     }
@@ -1299,7 +1337,7 @@ function useWaitingNotifications() {
 
 // src/settings/WhatsAppTemplateSettingsForm.tsx
 import { Plus, RefreshCw, Save, Trash2 } from "lucide-react";
-import { jsx as jsx21, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
 var DEFAULT_LABELS = {
   sectionTitle: "WhatsApp",
   sectionDescription: "Template usado para reabrir a janela de 24h com o cliente.",
@@ -1358,16 +1396,16 @@ function WhatsAppTemplateSettingsForm({
     }
     onVariablesChange([...variables, token]);
   }
-  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__ */ jsx21("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: labels.sectionTitle }),
-      /* @__PURE__ */ jsx21("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__ */ 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 })
     ] }),
-    /* @__PURE__ */ jsxs14("form", { onSubmit: onSave, className: "p-6 space-y-4", children: [
-      /* @__PURE__ */ jsxs14("div", { children: [
-        /* @__PURE__ */ jsxs14("div", { className: "flex items-center justify-between mb-1.5", children: [
-          /* @__PURE__ */ jsx21("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.templateLabel }),
-          /* @__PURE__ */ jsxs14(
+    /* @__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(
             "button",
             {
               type: "button",
@@ -1375,31 +1413,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__ */ jsx21(RefreshCw, { size: 11, className: loadingTemplates ? "animate-spin" : "" }),
+                /* @__PURE__ */ jsx16(RefreshCw, { size: 11, className: loadingTemplates ? "animate-spin" : "" }),
                 labels.refreshList
               ]
             }
           )
         ] }),
-        templatesError && /* @__PURE__ */ jsxs14("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__ */ 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: [
           labels.errorLoading,
-          /* @__PURE__ */ jsx21("br", {}),
-          /* @__PURE__ */ jsxs14("span", { className: "text-gray-500 dark:text-gray-400 mt-0.5 block", children: [
+          /* @__PURE__ */ jsx16("br", {}),
+          /* @__PURE__ */ jsxs13("span", { className: "text-gray-500 dark:text-gray-400 mt-0.5 block", children: [
             labels.currentNameSaved,
             " ",
-            /* @__PURE__ */ jsx21("strong", { children: selectedTemplateName || "\u2014" })
+            /* @__PURE__ */ jsx16("strong", { children: selectedTemplateName || "\u2014" })
           ] })
         ] }),
-        loadingTemplates && /* @__PURE__ */ jsx21("div", { className: "h-10 rounded-xl bg-gray-100 dark:bg-gray-700 animate-pulse" }),
-        !loadingTemplates && !templatesError && /* @__PURE__ */ jsxs14(
+        loadingTemplates && /* @__PURE__ */ jsx16("div", { className: "h-10 rounded-xl bg-gray-100 dark:bg-gray-700 animate-pulse" }),
+        !loadingTemplates && !templatesError && /* @__PURE__ */ jsxs13(
           "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__ */ jsx21("option", { value: "", children: labels.selectPlaceholder }),
-              templates.map((template) => /* @__PURE__ */ jsxs14("option", { value: template.name, disabled: template.status !== "APPROVED", children: [
+              /* @__PURE__ */ jsx16("option", { value: "", children: labels.selectPlaceholder }),
+              templates.map((template) => /* @__PURE__ */ jsxs13("option", { value: template.name, disabled: template.status !== "APPROVED", children: [
                 template.displayName,
                 " \xB7 ",
                 template.shortId,
@@ -1411,27 +1449,27 @@ function WhatsAppTemplateSettingsForm({
             ]
           }
         ),
-        selected?.bodyText && /* @__PURE__ */ jsx21("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__ */ 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 })
       ] }),
-      /* @__PURE__ */ jsxs14("div", { children: [
-        /* @__PURE__ */ jsxs14("div", { className: "flex items-center justify-between mb-1.5", children: [
-          /* @__PURE__ */ jsx21("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.variablesLabel }),
-          /* @__PURE__ */ jsxs14(
+      /* @__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(
             "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__ */ jsx21(Plus, { size: 12 }),
+                /* @__PURE__ */ jsx16(Plus, { size: 12 }),
                 labels.addVariable
               ]
             }
           )
         ] }),
-        availableVariables.length > 0 && /* @__PURE__ */ jsxs14("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__ */ jsx21("p", { className: "text-xs font-medium text-gray-600 dark:text-gray-300 mb-1.5", children: labels.variablesAvailableTitle }),
-          /* @__PURE__ */ jsx21("div", { className: "flex flex-wrap gap-1.5", children: availableVariables.map((available) => /* @__PURE__ */ jsxs14(
+        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(
             "button",
             {
               type: "button",
@@ -1439,8 +1477,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__ */ jsx21("code", { className: "text-blue-600 dark:text-blue-300", children: available.token }),
-                /* @__PURE__ */ jsxs14("span", { className: "text-gray-400 dark:text-gray-500", 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: [
                   "\xB7 ",
                   available.label
                 ] })
@@ -1448,13 +1486,13 @@ function WhatsAppTemplateSettingsForm({
             },
             available.token
           )) }),
-          /* @__PURE__ */ jsx21("p", { className: "mt-1.5 text-[11px] text-gray-400 dark:text-gray-500", children: labels.variablesAvailableHint })
+          /* @__PURE__ */ jsx16("p", { className: "mt-1.5 text-[11px] text-gray-400 dark:text-gray-500", children: labels.variablesAvailableHint })
         ] }),
-        /* @__PURE__ */ jsx21("p", { className: "text-xs text-gray-400 dark:text-gray-500 mb-2", children: labels.variablesMappingHint }),
-        variables.length === 0 && /* @__PURE__ */ jsx21("p", { className: "text-xs text-gray-400 dark:text-gray-500 italic", children: labels.noVariables }),
-        /* @__PURE__ */ jsx21("div", { className: "space-y-2", children: variables.map((variable, index) => /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsx21("span", { className: "text-xs text-gray-400 dark:text-gray-500 w-6 text-right flex-shrink-0", children: `{{${index + 1}}}` }),
-          /* @__PURE__ */ jsx21(
+        /* @__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(
             "input",
             {
               type: "text",
@@ -1464,27 +1502,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__ */ jsx21(
+          /* @__PURE__ */ jsx16(
             "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__ */ jsx21(Trash2, { size: 14 })
+              children: /* @__PURE__ */ jsx16(Trash2, { size: 14 })
             }
           )
         ] }, index)) })
       ] }),
-      saveSuccess && /* @__PURE__ */ jsx21("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__ */ jsx21("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs14(
+      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(
         "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__ */ jsx21("span", { className: "w-4 h-4 border-2 border-white/40 border-t-white rounded-full animate-spin" }) : /* @__PURE__ */ jsx21(Save, { 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(Save, { size: 14 }),
             saving ? labels.saving : labels.save
           ]
         }
@@ -1495,7 +1533,7 @@ function WhatsAppTemplateSettingsForm({
 
 // src/settings/WhatsAppCreateTemplateForm.tsx
 import { SendHorizonal } from "lucide-react";
-import { jsx as jsx22, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs14 } from "react/jsx-runtime";
 var DEFAULT_LABELS2 = {
   sectionTitle: "Criar novo template",
   sectionDescription: "Envia um template para aprova\xE7\xE3o da Meta.",
@@ -1551,16 +1589,16 @@ function WhatsAppCreateTemplateForm({
   function set(key, next) {
     onChange({ ...value, [key]: next });
   }
-  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__ */ jsxs15("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: [
-      /* @__PURE__ */ jsx22("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: labels.sectionTitle }),
-      /* @__PURE__ */ jsx22("p", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1", children: labels.sectionDescription })
+  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 })
     ] }),
-    /* @__PURE__ */ jsxs15("form", { onSubmit, className: "p-6 space-y-4", children: [
-      /* @__PURE__ */ jsxs15("div", { children: [
-        /* @__PURE__ */ jsx22("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.nameLabel }),
-        /* @__PURE__ */ jsx22("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.nameHint }),
-        /* @__PURE__ */ jsx22(
+    /* @__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(
           "input",
           {
             type: "text",
@@ -1572,56 +1610,56 @@ function WhatsAppCreateTemplateForm({
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs15("div", { className: "grid grid-cols-2 gap-3", children: [
-        /* @__PURE__ */ jsxs15("div", { children: [
-          /* @__PURE__ */ jsx22("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.categoryLabel }),
-          /* @__PURE__ */ jsxs15(
+      /* @__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(
             "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__ */ jsx22("option", { value: "UTILITY", children: "UTILITY (Transacional)" }),
-                /* @__PURE__ */ jsx22("option", { value: "MARKETING", children: "MARKETING (Promocional)" })
+                /* @__PURE__ */ jsx17("option", { value: "UTILITY", children: "UTILITY (Transacional)" }),
+                /* @__PURE__ */ jsx17("option", { value: "MARKETING", children: "MARKETING (Promocional)" })
               ]
             }
           )
         ] }),
-        /* @__PURE__ */ jsxs15("div", { children: [
-          /* @__PURE__ */ jsx22("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.languageLabel }),
-          /* @__PURE__ */ jsxs15(
+        /* @__PURE__ */ jsxs14("div", { children: [
+          /* @__PURE__ */ jsx17("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.languageLabel }),
+          /* @__PURE__ */ jsxs14(
             "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__ */ jsx22("option", { value: "pt_BR", children: "Portugu\xEAs (Brasil)" }),
-                /* @__PURE__ */ jsx22("option", { value: "en_US", children: "Ingl\xEAs (EUA)" }),
-                /* @__PURE__ */ jsx22("option", { value: "es_ES", children: "Espanhol" })
+                /* @__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__ */ jsxs15("div", { children: [
-        /* @__PURE__ */ jsx22("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.headerLabel }),
-        /* @__PURE__ */ jsx22("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.headerHint }),
-        /* @__PURE__ */ jsxs15("div", { className: "flex gap-2", children: [
-          /* @__PURE__ */ jsxs15(
+      /* @__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(
             "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__ */ jsx22("option", { value: "NONE", children: labels.headerNone }),
-                /* @__PURE__ */ jsx22("option", { value: "TEXT", children: labels.headerText })
+                /* @__PURE__ */ jsx17("option", { value: "NONE", children: labels.headerNone }),
+                /* @__PURE__ */ jsx17("option", { value: "TEXT", children: labels.headerText })
               ]
             }
           ),
-          value.headerType === "TEXT" && /* @__PURE__ */ jsx22(
+          value.headerType === "TEXT" && /* @__PURE__ */ jsx17(
             "input",
             {
               type: "text",
@@ -1634,10 +1672,10 @@ function WhatsAppCreateTemplateForm({
           )
         ] })
       ] }),
-      /* @__PURE__ */ jsxs15("div", { children: [
-        /* @__PURE__ */ jsx22("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.bodyLabel }),
-        /* @__PURE__ */ jsx22("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.bodyHint }),
-        /* @__PURE__ */ jsx22(
+      /* @__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(
           "textarea",
           {
             value: value.bodyText,
@@ -1648,26 +1686,26 @@ function WhatsAppCreateTemplateForm({
             required: true
           }
         ),
-        detectedVariables.length > 0 && /* @__PURE__ */ jsxs15("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__ */ jsx22("p", { className: "font-medium text-gray-500 dark:text-gray-400 mb-1.5 uppercase tracking-wide text-xs", children: labels.detectedVariables }),
-          /* @__PURE__ */ jsx22("div", { className: "flex flex-wrap gap-2", children: detectedVariables.map((num) => /* @__PURE__ */ jsxs15("span", { className: "inline-flex items-center gap-1 text-xs", children: [
-            /* @__PURE__ */ jsx22("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__ */ jsxs15("span", { className: "text-gray-400 dark:text-gray-500", children: [
+        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: [
               "= ",
               variableExamples[Number(num) - 1] ?? labels.variableLabel(Number(num))
             ] })
           ] }, num)) }),
-          /* @__PURE__ */ jsxs15("p", { className: "text-gray-400 dark:text-gray-500 mt-1.5 text-xs", children: [
+          /* @__PURE__ */ jsxs14("p", { className: "text-gray-400 dark:text-gray-500 mt-1.5 text-xs", children: [
             labels.configureHintPrefix,
-            /* @__PURE__ */ jsx22("strong", { children: labels.configureHintLink }),
+            /* @__PURE__ */ jsx17("strong", { children: labels.configureHintLink }),
             labels.configureHintSuffix
           ] })
         ] })
       ] }),
-      /* @__PURE__ */ jsxs15("div", { children: [
-        /* @__PURE__ */ jsx22("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: labels.footerLabel }),
-        /* @__PURE__ */ jsx22("p", { className: "text-xs text-gray-400 mb-1.5", children: labels.footerHint }),
-        /* @__PURE__ */ jsx22(
+      /* @__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(
           "input",
           {
             type: "text",
@@ -1679,48 +1717,48 @@ function WhatsAppCreateTemplateForm({
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs15("div", { children: [
-        /* @__PURE__ */ jsx22("label", { className: "text-sm font-medium text-gray-700 dark:text-gray-300 mb-2 block", children: labels.previewLabel }),
-        /* @__PURE__ */ jsxs15("div", { className: "rounded-2xl bg-[#e5ddd5] dark:bg-[#1a1a2e] border border-gray-300 dark:border-gray-600 overflow-hidden shadow-inner", children: [
-          /* @__PURE__ */ jsxs15("div", { className: "bg-[#075e54] px-4 py-2.5 flex items-center gap-2", children: [
-            /* @__PURE__ */ jsx22("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__ */ jsxs15("div", { children: [
-              /* @__PURE__ */ jsx22("p", { className: "text-white text-xs font-semibold leading-tight", children: previewCompanyName }),
-              /* @__PURE__ */ jsx22("p", { className: "text-white/60 text-xs", children: labels.previewOnline })
+      /* @__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__ */ jsxs15("div", { className: "px-3 py-4 space-y-3", style: { minHeight: "120px" }, children: [
-            /* @__PURE__ */ jsx22("div", { className: "flex justify-start", style: { maxWidth: "85%" }, children: /* @__PURE__ */ jsxs15("div", { className: "bg-white dark:bg-gray-700 rounded-lg rounded-tl-none px-3 py-2 shadow-sm", children: [
-              /* @__PURE__ */ jsx22("p", { className: "text-gray-500 dark:text-gray-400 leading-tight text-sm", children: labels.previewDescription }),
-              /* @__PURE__ */ jsx22("p", { className: "text-gray-400 dark:text-gray-500 mt-1 text-right text-[9px]", children: "12:00" })
+          /* @__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__ */ jsx22("div", { className: "flex justify-end ml-auto", style: { maxWidth: "85%" }, children: /* @__PURE__ */ jsxs15("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__ */ jsx22("p", { className: "text-xs font-bold text-gray-700 dark:text-gray-200 mb-1", children: fillPreviewTokens(value.headerText) || labels.previewHeaderFallback }),
-              /* @__PURE__ */ jsx22("p", { className: "text-sm text-gray-800 dark:text-gray-100 leading-relaxed", children: value.bodyText ? fillPreviewTokens(value.bodyText) : /* @__PURE__ */ jsx22("span", { className: "text-gray-400 italic", children: labels.previewBodyPlaceholder }) }),
-              value.footerText && /* @__PURE__ */ jsx22("p", { className: "text-gray-400 dark:text-gray-400 mt-1 text-xs", children: value.footerText }),
-              /* @__PURE__ */ jsx22("p", { className: "text-gray-400 dark:text-gray-400 mt-1 text-right text-[9px]", children: "12:01 \u2713" })
+            /* @__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" })
             ] }) })
           ] })
         ] })
       ] }),
-      result && /* @__PURE__ */ jsxs15(
+      result && /* @__PURE__ */ jsxs14(
         "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__ */ jsx22("p", { className: "text-xs mt-1 opacity-75", children: labels.successStatus(result.status) })
+            result.ok && result.status && /* @__PURE__ */ jsx17("p", { className: "text-xs mt-1 opacity-75", children: labels.successStatus(result.status) })
           ]
         }
       ),
-      /* @__PURE__ */ jsx22("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs15(
+      /* @__PURE__ */ jsx17("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs14(
         "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__ */ jsx22("span", { className: "w-4 h-4 border-2 border-white/40 border-t-white rounded-full animate-spin" }) : /* @__PURE__ */ jsx22(SendHorizonal, { size: 14 }),
+            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 ? labels.sending : labels.sendForApproval
           ]
         }
@@ -1731,7 +1769,7 @@ function WhatsAppCreateTemplateForm({
 
 // src/settings/WelcomeFarewellForm.tsx
 import { LogOut, Mail, Save as Save2 } from "lucide-react";
-import { jsx as jsx23, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs15 } from "react/jsx-runtime";
 var DEFAULT_LABELS3 = {
   sectionTitle: "Boas-vindas e encerramento",
   welcomeMessage: "Mensagem de boas-vindas",
@@ -1759,15 +1797,15 @@ function WelcomeFarewellForm({
   labels: labelsOverride
 }) {
   const labels = { ...DEFAULT_LABELS3, ...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__ */ jsx23("div", { className: "px-6 py-4 border-b border-gray-100 dark:border-gray-700", children: /* @__PURE__ */ jsx23("h2", { className: "text-sm font-semibold text-gray-900 dark:text-gray-100", children: labels.sectionTitle }) }),
-    /* @__PURE__ */ jsxs16("form", { onSubmit: onSave, className: "p-6 space-y-5", children: [
-      /* @__PURE__ */ jsxs16("div", { children: [
-        /* @__PURE__ */ jsxs16("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__ */ jsx23(Mail, { size: 13, className: "text-blue-600 dark:text-blue-400" }),
+  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" }),
           labels.welcomeMessage
         ] }),
-        /* @__PURE__ */ jsx23(
+        /* @__PURE__ */ jsx18(
           WhatsAppMessageEditor,
           {
             value: welcomeMessage,
@@ -1776,14 +1814,14 @@ function WelcomeFarewellForm({
             placeholders: welcomePlaceholders
           }
         ),
-        /* @__PURE__ */ jsx23("p", { className: "mt-1.5 text-xs text-gray-500 dark:text-gray-400", children: labels.welcomeMessageHint })
+        /* @__PURE__ */ jsx18("p", { className: "mt-1.5 text-xs text-gray-500 dark:text-gray-400", children: labels.welcomeMessageHint })
       ] }),
-      /* @__PURE__ */ jsxs16("div", { children: [
-        /* @__PURE__ */ jsxs16("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__ */ jsx23(LogOut, { size: 13, className: "text-blue-600 dark:text-blue-400" }),
+      /* @__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" }),
           labels.farewellMessage
         ] }),
-        /* @__PURE__ */ jsx23(
+        /* @__PURE__ */ jsx18(
           WhatsAppMessageEditor,
           {
             value: farewellMessage,
@@ -1792,17 +1830,17 @@ function WelcomeFarewellForm({
             placeholders: farewellPlaceholders
           }
         ),
-        /* @__PURE__ */ jsx23("p", { className: "mt-1.5 text-xs text-gray-500 dark:text-gray-400", children: labels.farewellMessageHint })
+        /* @__PURE__ */ jsx18("p", { className: "mt-1.5 text-xs text-gray-500 dark:text-gray-400", children: labels.farewellMessageHint })
       ] }),
-      saveSuccess && /* @__PURE__ */ jsx23("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__ */ jsx23("div", { className: "flex justify-end", children: /* @__PURE__ */ jsxs16(
+      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(
         "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__ */ jsx23("span", { className: "w-4 h-4 border-2 border-white/40 border-t-white rounded-full animate-spin" }) : /* @__PURE__ */ jsx23(Save2, { size: 14 }),
+            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 ? labels.saving : labels.save
           ]
         }
@@ -1811,9 +1849,56 @@ function WelcomeFarewellForm({
   ] });
 }
 
+// src/settings/WhatsAppTemplatesSettings.tsx
+import { useState as useState10 } from "react";
+import { jsx as jsx19, jsxs as jsxs16 } from "react/jsx-runtime";
+var TEMPLATE_SETTINGS_TAB = {
+  SELECT: "select",
+  CREATE: "create"
+};
+var DEFAULT_TEMPLATES_SETTINGS_LABELS = {
+  selectTab: "Template de reengajamento",
+  createTab: "Criar template"
+};
+function WhatsAppTemplatesSettings({
+  labels: labelsOverride,
+  create,
+  ...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(
+        "button",
+        {
+          type: "button",
+          role: "tab",
+          "aria-selected": tab === TEMPLATE_SETTINGS_TAB.SELECT,
+          onClick: () => setTab(TEMPLATE_SETTINGS_TAB.SELECT),
+          className: `cv-subtab ${tab === TEMPLATE_SETTINGS_TAB.SELECT ? "cv-subtab--active" : ""}`,
+          children: labels.selectTab
+        }
+      ),
+      create ? /* @__PURE__ */ jsx19(
+        "button",
+        {
+          type: "button",
+          role: "tab",
+          "aria-selected": tab === TEMPLATE_SETTINGS_TAB.CREATE,
+          onClick: () => setTab(TEMPLATE_SETTINGS_TAB.CREATE),
+          className: `cv-subtab ${tab === TEMPLATE_SETTINGS_TAB.CREATE ? "cv-subtab--active" : ""}`,
+          children: labels.createTab
+        }
+      ) : null
+    ] }),
+    tab === TEMPLATE_SETTINGS_TAB.SELECT ? /* @__PURE__ */ jsx19(WhatsAppTemplateSettingsForm, { ...settingsProps }) : create ? /* @__PURE__ */ jsx19(WhatsAppCreateTemplateForm, { ...create }) : null
+  ] });
+}
+
 // src/settings/TopicsForm.tsx
 import { Megaphone, Save as Save3 } from "lucide-react";
-import { jsx as jsx24, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs17 } from "react/jsx-runtime";
 var DEFAULT_LABELS4 = {
   sectionTitle: "T\xF3picos intermedi\xE1rios",
   sectionDescription: "Mensagens autom\xE1ticas para assuntos espec\xEDficos, disparadas quando o cliente demonstra interesse.",
@@ -1834,16 +1919,16 @@ function TopicsForm({
   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__ */ jsx24(Megaphone, { size: 16, className: "text-orange-600 dark:text-orange-400" }),
+        /* @__PURE__ */ jsx20(Megaphone, { size: 16, className: "text-orange-600 dark:text-orange-400" }),
         labels.sectionTitle
       ] }),
-      /* @__PURE__ */ jsx24("p", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1", children: labels.sectionDescription })
+      /* @__PURE__ */ jsx20("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__ */ jsx24("div", { className: "flex-1", children: /* @__PURE__ */ jsx24("p", { className: "text-sm font-medium text-gray-900 dark:text-gray-100", children: topic.label }) }),
-          /* @__PURE__ */ jsx24(
+          /* @__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(
             "button",
             {
               type: "button",
@@ -1851,7 +1936,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__ */ jsx24(
+              children: /* @__PURE__ */ jsx20(
                 "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"}`
@@ -1860,7 +1945,7 @@ function TopicsForm({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx24(
+        /* @__PURE__ */ jsx20(
           "textarea",
           {
             value: topic.message,
@@ -1880,47 +1965,19 @@ function TopicsForm({
             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__ */ jsx24(Save3, { size: 14 }),
+              /* @__PURE__ */ jsx20(Save3, { size: 14 }),
               labels.saveButton
             ]
           }
         ),
-        saveSuccess && /* @__PURE__ */ jsx24("span", { className: "text-sm text-green-600 dark:text-green-400", children: labels.saveSuccess })
+        saveSuccess && /* @__PURE__ */ jsx20("span", { className: "text-sm text-green-600 dark:text-green-400", children: labels.saveSuccess })
       ] })
     ] })
   ] });
 }
 
 // src/hooks/useConversationMessages.ts
-import { useCallback as useCallback7 } from "react";
-
-// src/hooks/useAsyncResource.ts
-import { useCallback as useCallback6, useEffect as useEffect5, useRef as useRef6, useState as useState10 } from "react";
-function useAsyncResource(fetcher, deps) {
-  const [data, setData] = useState10(void 0);
-  const [loading, setLoading] = useState10(false);
-  const [error, setError] = useState10(void 0);
-  const requestIdRef = useRef6(0);
-  const load = useCallback6(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);
-  useEffect5(() => {
-    load();
-  }, [load]);
-  return { data, loading, error, refetch: load };
-}
-
-// src/hooks/useConversationMessages.ts
+import { useCallback as useCallback5 } from "react";
 function useConversationMessages(conversationId, params) {
   const context = useConversations();
   if (!context) {
@@ -1931,7 +1988,7 @@ function useConversationMessages(conversationId, params) {
     () => api.fetchMessages(conversationId, params),
     [conversationId, params?.limit, params?.before]
   );
-  const sendMessage = useCallback7(
+  const sendMessage = useCallback5(
     async (text) => {
       const message = await api.sendMessage(conversationId, text);
       await refetch();
@@ -1939,7 +1996,7 @@ function useConversationMessages(conversationId, params) {
     },
     [api, conversationId, refetch]
   );
-  const sendMedia = useCallback7(
+  const sendMedia = useCallback5(
     async (mediaData) => {
       const message = await api.sendMedia(conversationId, mediaData);
       await refetch();
@@ -1947,14 +2004,14 @@ function useConversationMessages(conversationId, params) {
     },
     [api, conversationId, refetch]
   );
-  const sendTemplate = useCallback7(
+  const sendTemplate = useCallback5(
     async (templateData) => {
       await api.sendTemplate(conversationId, templateData);
       await refetch();
     },
     [api, conversationId, refetch]
   );
-  const markRead = useCallback7(() => api.markRead(conversationId), [api, conversationId]);
+  const markRead = useCallback5(() => api.markRead(conversationId), [api, conversationId]);
   return { messages: data ?? [], loading, error, refetch, sendMessage, sendMedia, sendTemplate, markRead };
 }
 
@@ -1983,25 +2040,11 @@ function useConversationContext(conversationId) {
   return { context: data, loading, error, refetch };
 }
 
-// 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(
-    () => api.getDocuments(conversationId, params),
-    [conversationId, params?.search, params?.page]
-  );
-  return { documents: data ?? [], loading, error, refetch };
-}
-
 // src/hooks/useConversationRealtime.ts
-import { useEffect as useEffect6, useRef as useRef7 } from "react";
+import { useEffect as useEffect6, useRef as useRef5 } from "react";
 function useConversationRealtime(conversationId, onEvent) {
   const context = useConversations();
-  const onEventRef = useRef7(onEvent);
+  const onEventRef = useRef5(onEvent);
   onEventRef.current = onEvent;
   useEffect6(() => {
     if (!context || !conversationId) return;
@@ -2016,7 +2059,7 @@ function useConversationRealtime(conversationId, onEvent) {
 }
 function useGlobalRealtime(onEvent) {
   const context = useConversations();
-  const onEventRef = useRef7(onEvent);
+  const onEventRef = useRef5(onEvent);
   onEventRef.current = onEvent;
   useEffect6(() => {
     if (!context) return;
@@ -2032,13 +2075,30 @@ function useGlobalRealtime(onEvent) {
 export {
   AudioPlayer,
   Avatar,
+  CHANNEL_BRAND_COLOR,
+  CHANNEL_CAPABILITIES,
+  CHANNEL_FILTER_ALL,
+  CONVERSATION_CHANNEL,
+  CONVERSATION_WINDOW,
+  ChannelIcon,
+  ConversationContextPanel,
+  ConversationDocumentsPanel,
+  ConversationHeader,
   ConversationListItem,
   ConversationLocalesProvider,
+  ConversationRow,
   ConversationWallpaper,
   ConversationsProvider,
+  DEFAULT_CONVERSATION_CHANNEL,
+  DEFAULT_CONVERSATION_CONTEXT_LABELS,
+  DEFAULT_CONVERSATION_DOCUMENTS_LABELS,
+  DEFAULT_CONVERSATION_HEADER_LABELS,
+  DEFAULT_TEMPLATES_SETTINGS_LABELS,
+  DEFAULT_WINDOW_EXPIRED_LABELS,
   DateDivider,
   EmojiPicker,
   FileIcon,
+  HANDLE_KIND,
   Lightbox,
   MediaRenderer,
   MessageBubble,
@@ -2046,18 +2106,33 @@ export {
   MessageTail,
   MessageText,
   MessageTimestamp,
+  NARROW_MAX_WIDTH_PX,
+  REOPEN_MECHANISM,
   SimpleEmojiPicker,
   StatusTicks,
+  TEMPLATE_SETTINGS_TAB,
   ToastProvider,
   TopicsForm,
+  WINDOW_FILTERS,
   WelcomeFarewellForm,
   WhatsAppCreateTemplateForm,
   WhatsAppMessageEditor,
   WhatsAppTemplateSettingsForm,
+  WhatsAppTemplatesSettings,
+  WindowExpiredNotice,
+  buildTranscriptFilename,
+  buildTranscriptText,
+  capabilitiesOf,
+  channelFiltersFor,
+  contactFlag,
+  downloadTextFile,
+  formatContactHandle,
   formatFileSize,
   formatPhone,
+  formatStalledFor,
   formatTimestamp,
   htmlToWA,
+  isWindowBlocking,
   parseWhatsAppFormatting,
   phoneInitials,
   toast,
@@ -2070,8 +2145,11 @@ export {
   useConversations,
   useDarkMode,
   useGlobalRealtime,
+  useIsDarkTheme,
+  useIsNarrow,
   useToast,
   useWaitingNotifications,
   waToHTML,
-  waToHTMLInline
+  waToHTMLInline,
+  windowOf
 };