@snksergio/design-system 0.1.1 → 0.4.0

package/dist-lib/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":["../src/components/ui/TableToolbar/parts/toolbar-mobile-sheet.tsx","../src/components/ui/TableToolbar/hooks/use-toolbar-filters.ts","../src/components/ui/TableToolbar/hooks/use-toolbar-sort.ts","../src/components/ui/DataTable/builders/column-builders.ts","../src/components/ui/Modal/modal.styles.ts","../src/components/ui/Modal/modal.tsx","../src/components/ui/TabelaTeste/mock-data.ts","../src/components/ui/TabelaTeste/tabela-teste.styles.ts","../src/components/ui/TabelaTeste/tabela-teste.tsx"],"sourcesContent":["import { useId, useState, type ReactNode } from \"react\";\nimport { MoreHorizontal } from \"lucide-react\";\nimport { Button } from \"../../Button/button\";\nimport {\n  Dialog,\n  DialogContent,\n  DialogTitle,\n  DialogTrigger,\n} from \"../../../shadcn/dialog\";\nimport { cn } from \"@/lib/utils\";\n\nexport type ToolbarMobileDialogProps = {\n  /**\n   * Conteúdo do dialog — geralmente uma stack vertical com `ToolbarMobileSection`,\n   * segmented groups, e botões outline fullWidth.\n   */\n  children: ReactNode;\n  /** Trigger custom. Se omitido, usa um Button outline icon-md com ícone Sliders. */\n  trigger?: ReactNode;\n  /**\n   * Título (acessibilidade — fica visually-hidden por default pra não competir\n   * com o conteúdo). Default \"Filtros e ações\".\n   */\n  title?: string;\n  /** Estado controlado. Se omitido, gerencia internamente. */\n  open?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  /**\n   * className aplicada no trigger wrapper. Default vem com `md:hidden`\n   * (só aparece em mobile). Passe `md:block` pra sobrescrever.\n   */\n  className?: string;\n  /** className do DialogContent (caso queira ajustar largura ou padding) */\n  contentClassName?: string;\n};\n\n/**\n * ToolbarMobileDialog — modal centralizado pra colapsar actions da toolbar em mobile.\n *\n * Visual alinhado com o `<CommandDialog>` do shadcn: 384px, radius 12px,\n * border-default + outline-float (halo), sem header visível, conteúdo direto.\n *\n * Padrão de uso:\n *\n *   <TableToolbar\n *     actions={\n *       <>\n *         <div className=\"hidden md:flex ...\">{...desktop...}</div>\n *         <ToolbarMobileDialog>\n *           <ToolbarMobileSection title=\"Densidade\">\n *             <ToolbarSegmented fluid ... />\n *           </ToolbarMobileSection>\n *           ...\n *         </ToolbarMobileDialog>\n *       </>\n *     }\n *   />\n *\n * Fecha com ESC ou click no overlay (default do Radix Dialog). Não tem botão X\n * pra manter o visual limpo do Command.\n */\nexport function ToolbarMobileDialog({\n  children,\n  trigger,\n  title = \"Filtros e ações\",\n  open: openProp,\n  onOpenChange,\n  className,\n  contentClassName,\n}: ToolbarMobileDialogProps) {\n  const [internalOpen, setInternalOpen] = useState(false);\n  const open = openProp ?? internalOpen;\n  const setOpen = onOpenChange ?? setInternalOpen;\n  const titleId = useId();\n\n  return (\n    <Dialog open={open} onOpenChange={setOpen}>\n      <DialogTrigger asChild>\n        {trigger ?? (\n          <Button\n            color=\"secondary\"\n            variant=\"outline\"\n            size=\"icon-md\"\n            aria-label=\"Mais opções\"\n            className={cn(\"md:hidden\", className)}\n          >\n            <MoreHorizontal />\n          </Button>\n        )}\n      </DialogTrigger>\n      <DialogContent\n        hideClose\n        aria-labelledby={titleId}\n        className={cn(\n          // Visual alinhado com CommandDialog\n          \"overflow-hidden p-0 gap-0 sm:max-w-[384px]\",\n          \"rounded-[12px] border border-border-default outline-float\",\n          contentClassName,\n        )}\n      >\n        <DialogTitle id={titleId} className=\"sr-only\">\n          {title}\n        </DialogTitle>\n        <div className=\"flex flex-col gap-gp-3xl p-pad-2xl max-h-[85vh] overflow-y-auto\">\n          {children}\n        </div>\n      </DialogContent>\n    </Dialog>\n  );\n}\n\n/** Alias legado — usar `ToolbarMobileDialog`. */\nexport const ToolbarMobileSheet = ToolbarMobileDialog;\nexport type ToolbarMobileSheetProps = ToolbarMobileDialogProps;\n\n/**\n * ToolbarMobileSection — grupo lógico dentro do `ToolbarMobileDialog`.\n * Title sutil (peso medium, sem caps), conteúdo empilhado.\n *\n *   <ToolbarMobileSection title=\"Densidade\">\n *     <ToolbarSegmented fluid ... />\n *   </ToolbarMobileSection>\n *\n *   <ToolbarMobileSection title=\"Ações\">\n *     <Button color=\"secondary\" variant=\"outline\" iconLeft={<Filter />} fullWidth\n *             className=\"justify-start\">\n *       Filtrar\n *     </Button>\n *   </ToolbarMobileSection>\n */\nexport type ToolbarMobileSectionProps = {\n  title?: ReactNode;\n  children: ReactNode;\n  className?: string;\n};\n\nexport function ToolbarMobileSection({\n  title,\n  children,\n  className,\n}: ToolbarMobileSectionProps) {\n  return (\n    <section className={cn(\"flex flex-col gap-gp-md\", className)}>\n      {title && (\n        <h3 className=\"text-[12px] font-medium text-fg-muted\">{title}</h3>\n      )}\n      <div className=\"flex flex-col gap-gp-md\">{children}</div>\n    </section>\n  );\n}\n","import { useCallback, useMemo, useState } from \"react\";\n\n/**\n * Filtro genérico — mantém o shape mínimo necessário pra UI/lógica.\n * O consumer pode estender via generics se precisar de campos custom.\n */\nexport type ToolbarFilterEntry = {\n  id: string;\n  columnKey: string;\n  op: string;\n  value: unknown;\n};\n\nexport type UseToolbarFiltersOptions<T extends ToolbarFilterEntry = ToolbarFilterEntry> = {\n  /** Filtros iniciais */\n  initial?: T[];\n  /** Gerador de ID — default usa crypto.randomUUID() ou timestamp fallback */\n  generateId?: () => string;\n};\n\nfunction defaultId(): string {\n  if (typeof crypto !== \"undefined\" && \"randomUUID\" in crypto) {\n    return crypto.randomUUID();\n  }\n  return `f_${Date.now()}_${Math.random().toString(36).slice(2, 9)}`;\n}\n\n/**\n * useToolbarFilters — helper opcional pra gerenciar estado de filtros.\n *\n * Retorna:\n *   - `list`: array de filtros\n *   - `add(entry)`: adiciona um filtro (gera id automático se omitido)\n *   - `remove(id)`: remove por id\n *   - `update(id, patch)`: atualiza parcialmente\n *   - `clear()`: zera tudo\n *   - `replaceAll(next)`: substitui array completo\n *   - `count`: total de filtros com `value` truthy (válidos pra aplicar)\n *\n * Uso (opcional — vc pode usar useState direto também):\n *\n *   const filters = useToolbarFilters({ initial: [...] });\n *   filters.add({ columnKey: \"status\", op: \"eq\", value: \"active\" });\n *   filters.remove(\"f_abc\");\n */\nexport function useToolbarFilters<T extends ToolbarFilterEntry = ToolbarFilterEntry>(\n  options?: UseToolbarFiltersOptions<T>,\n) {\n  const { initial = [], generateId = defaultId } = options ?? {};\n  const [list, setList] = useState<T[]>(initial as T[]);\n\n  const add = useCallback(\n    (entry: Omit<T, \"id\"> & { id?: string }) => {\n      setList((prev) => [\n        ...prev,\n        { ...entry, id: entry.id ?? generateId() } as T,\n      ]);\n    },\n    [generateId],\n  );\n\n  const remove = useCallback((id: string) => {\n    setList((prev) => prev.filter((f) => f.id !== id));\n  }, []);\n\n  const update = useCallback((id: string, patch: Partial<T>) => {\n    setList((prev) =>\n      prev.map((f) => (f.id === id ? ({ ...f, ...patch } as T) : f)),\n    );\n  }, []);\n\n  const clear = useCallback(() => setList([]), []);\n  const replaceAll = useCallback((next: T[]) => setList(next), []);\n\n  const count = useMemo(\n    () =>\n      list.filter((f) => {\n        if (f.value === null || f.value === undefined) return false;\n        if (typeof f.value === \"string\") return f.value.length > 0;\n        if (Array.isArray(f.value)) return f.value.length > 0;\n        return true;\n      }).length,\n    [list],\n  );\n\n  return { list, add, remove, update, clear, replaceAll, count } as const;\n}\n","import { useCallback, useState } from \"react\";\nimport type { SortDirection } from \"../table-toolbar.types\";\n\n// Re-export pra backward-compat (consumers que importavam daqui).\nexport type { SortDirection };\n\nexport type ToolbarSortEntry = {\n  columnKey: string;\n  direction: SortDirection;\n};\n\nexport type UseToolbarSortOptions = {\n  initial?: ToolbarSortEntry[];\n  /** Limite máximo de colunas ordenadas simultaneamente. Default: Infinity. */\n  maxColumns?: number;\n};\n\n/**\n * useToolbarSort — helper opcional pra ordenação multi-coluna.\n *\n * Retorna:\n *   - `list`: array de { columnKey, direction }\n *   - `toggle(columnKey)`: cicla asc → desc → off (remove)\n *   - `set(columnKey, direction)`: força um valor\n *   - `remove(columnKey)`: remove a ordenação de uma coluna\n *   - `clear()`: zera\n *   - `replaceAll(next)`: substitui\n *   - `count`: tamanho da lista\n *   - `directionOf(columnKey)`: lookup helper\n */\nexport function useToolbarSort(options?: UseToolbarSortOptions) {\n  const { initial = [], maxColumns = Infinity } = options ?? {};\n  const [list, setList] = useState<ToolbarSortEntry[]>(initial);\n\n  const toggle = useCallback(\n    (columnKey: string) => {\n      setList((prev) => {\n        const idx = prev.findIndex((s) => s.columnKey === columnKey);\n        if (idx === -1) {\n          // off → asc; respeita maxColumns\n          const next = [...prev, { columnKey, direction: \"asc\" as const }];\n          if (next.length > maxColumns) next.shift();\n          return next;\n        }\n        const current = prev[idx];\n        if (current.direction === \"asc\") {\n          // asc → desc\n          const next = [...prev];\n          next[idx] = { ...current, direction: \"desc\" };\n          return next;\n        }\n        // desc → off (remove)\n        return prev.filter((_, i) => i !== idx);\n      });\n    },\n    [maxColumns],\n  );\n\n  const set = useCallback(\n    (columnKey: string, direction: SortDirection) => {\n      setList((prev) => {\n        const idx = prev.findIndex((s) => s.columnKey === columnKey);\n        if (idx === -1) {\n          const next = [...prev, { columnKey, direction }];\n          if (next.length > maxColumns) next.shift();\n          return next;\n        }\n        const next = [...prev];\n        next[idx] = { columnKey, direction };\n        return next;\n      });\n    },\n    [maxColumns],\n  );\n\n  const remove = useCallback((columnKey: string) => {\n    setList((prev) => prev.filter((s) => s.columnKey !== columnKey));\n  }, []);\n\n  const clear = useCallback(() => setList([]), []);\n  const replaceAll = useCallback(\n    (next: ToolbarSortEntry[]) => setList(next),\n    [],\n  );\n\n  const directionOf = useCallback(\n    (columnKey: string): SortDirection | undefined =>\n      list.find((s) => s.columnKey === columnKey)?.direction,\n    [list],\n  );\n\n  return {\n    list,\n    toggle,\n    set,\n    remove,\n    clear,\n    replaceAll,\n    count: list.length,\n    directionOf,\n  } as const;\n}\n","import type { ReactNode } from \"react\";\nimport type {\n  DataTableColumnDef,\n  DataTableActionItem,\n} from \"../data-table.types\";\n\n/**\n * Column builders — reduzem boilerplate de `DataTableColumnDef` em casos comuns.\n *\n * Todos retornam um `DataTableColumnDef<T>` válido. Você pode spread extra props:\n *\n *   const cols = [\n *     textColumn<Client>(\"id\", \"ID\", { width: 120 }),\n *     currencyColumn<Client>(\"value\", \"Valor\", { sortable: true }),\n *     actionColumn<Client>({ getActions: ({ row }) => [...] }),\n *   ];\n *\n * Para casos custom, declare `DataTableColumnDef<T>` diretamente — builders são\n * conveniência, não substituem a API completa.\n */\n\ntype CommonOverrides<T> = Partial<DataTableColumnDef<T>>;\n\n/** Coluna de texto simples. `type: \"text\"` ativa render auto via registry. */\nexport function textColumn<T>(\n  field: keyof T | string,\n  headerName: string,\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return { field, headerName, type: \"text\", ...overrides };\n}\n\n/** Coluna numérica. `type: \"number\"` aplica tabular-nums + align right + locale format. */\nexport function numberColumn<T>(\n  field: keyof T | string,\n  headerName: string,\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return { field, headerName, type: \"number\", sortable: true, ...overrides };\n}\n\n/** Coluna de moeda — `typeOptions: { currency, locale }` opcional. */\nexport function currencyColumn<T>(\n  field: keyof T | string,\n  headerName: string,\n  overrides?: CommonOverrides<T> & { currency?: string; locale?: string },\n): DataTableColumnDef<T> {\n  const { currency, locale, ...rest } = overrides ?? {};\n  return {\n    field,\n    headerName,\n    type: \"currency\",\n    sortable: true,\n    ...(currency || locale\n      ? { typeOptions: { currency, locale } }\n      : {}),\n    ...rest,\n  };\n}\n\n/** Coluna de email — mailto link automático via registry. */\nexport function emailColumn<T>(\n  field: keyof T | string,\n  headerName: string = \"Email\",\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return { field, headerName, type: \"email\", ...overrides };\n}\n\n/** Coluna de telefone — tel link + máscara automática. */\nexport function phoneColumn<T>(\n  field: keyof T | string,\n  headerName: string = \"Telefone\",\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return { field, headerName, type: \"phone\", ...overrides };\n}\n\n/** Coluna de data — Calendar picker no filter, formato pt-BR no display. */\nexport function dateColumn<T>(\n  field: keyof T | string,\n  headerName: string,\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return { field, headerName, type: \"date\", sortable: true, ...overrides };\n}\n\n/** Coluna de status — Chip colorido via `filterOptions: [{ value, label, color }]`. */\nexport function statusColumn<T>(\n  field: keyof T | string,\n  headerName: string,\n  options: Array<{ value: string | number; label: string; color?: string }>,\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return {\n    field,\n    headerName,\n    type: \"status\",\n    filterType: \"select\",\n    filterOptions: options,\n    enableColumnFilter: true,\n    ...overrides,\n  };\n}\n\n/** Coluna de actions — pinned right, sem sort/resize, auto-renderiza dropdown. */\nexport function actionColumn<T>(opts: {\n  getActions: (params: { row: T }) => DataTableActionItem<T>[];\n  width?: number;\n}): DataTableColumnDef<T> {\n  return {\n    field: \"_actions\",\n    headerName: \"\",\n    type: \"actions\",\n    width: opts.width ?? 120,\n    pinned: \"right\",\n    getActions: opts.getActions,\n  };\n}\n\n/** Coluna custom — render livre. Atalho pra quando consumer quer override total. */\nexport function customColumn<T>(\n  field: keyof T | string,\n  headerName: string,\n  render: (params: { row: T; value: unknown }) => ReactNode,\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return { field, headerName, render, ...overrides };\n}\n","import { tv } from \"@/utils/tv\";\n\n/**\n * Slots tv() pro <Modal>.\n *\n * Estrutura visual idêntica ao TblViewsModal do sandbox (/design-and-table-v2):\n *   header (icon + title + sub)  →  body livre (children)  →  footer (actions)\n *\n * Valores fora da escala DS (gaps 14/18/3px, padding 22px, fonts 12.5/13.5/17px)\n * são arbitrary literal — calibração visual exata do sandbox. Onde o token\n * semantico bate (form-lg=40, form-md=36, radius-lg=10, pad-4xl=24), usar token.\n */\n\n/* ── Dialog container ────────────────────────────────────────────── */\n\nexport const dialog = tv({\n  base: [\n    // Override do DialogContent default (grid + p-pad-4xl + rounded-radius-base + shadow-sh-xl)\n    \"!gap-0 !p-0\",\n    \"border border-border-default\",\n    \"!rounded-radius-2xl !shadow-sh-2xl\",\n    \"outline-float\",\n    \"flex flex-col overflow-hidden\",\n    \"w-[calc(100%-32px)]\",\n  ],\n  variants: {\n    size: {\n      sm: \"!max-w-[440px]\",\n      md: \"!max-w-[540px]\",\n      lg: \"!max-w-[720px]\",\n    },\n  },\n  defaultVariants: { size: \"md\" },\n});\n\n/* ── Close button (X) ────────────────────────────────────────────── */\n\nexport const closeBtn = tv({\n  base: [\n    \"absolute top-[14px] right-[14px] z-[1]\",\n    \"grid place-items-center size-[28px]\",\n    \"rounded-radius-md bg-transparent border-0 cursor-pointer\",\n    \"text-fg-muted opacity-55\",\n    \"transition-[background-color,color,opacity] duration-150\",\n    \"hover:bg-bg-muted hover:text-fg-default hover:opacity-100\",\n    \"focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring-brand\",\n    \"dark:hover:bg-bg-muted-hover\",\n  ],\n});\n\n/* ── Header (icon + title + description) ─────────────────────────── */\n\nexport const head = tv({\n  base: [\n    \"flex items-center gap-[14px]\",\n    \"px-pad-4xl pt-pad-4xl pb-pad-3xl\",   // 24/24/20\n    \"border-b border-border-default\",\n  ],\n  variants: {\n    // Sem icon — alinha texto à esquerda direto\n    withIcon: { false: \"\", true: \"\" },\n  },\n});\n\nexport const headIcon = tv({\n  base: [\n    \"shrink-0 grid place-items-center size-form-lg\",   // 40×40\n    \"bg-bg-muted border border-border-input rounded-radius-lg\",   // radius-lg=10px\n    \"text-fg-default\",\n    \"dark:bg-bg-accent dark:border-border-subtle\",\n  ],\n});\n\nexport const headTitleWrap = tv({\n  base: [\n    \"flex-1 min-w-0\",\n    \"pr-pad-3xl\",   // reserva espaço pro X close (right-14 + 28px) — evita overlap\n  ],\n});\n\nexport const title = tv({\n  base: [\n    \"m-0 mb-[2px]\",\n    \"text-[17px] font-bold leading-[1.3]\",\n    \"text-fg-default\",\n    \"tracking-[-0.01em]\",\n  ],\n});\n\nexport const description = tv({\n  base: \"m-0 text-[12.5px] text-fg-muted leading-[1.45]\",\n});\n\n/* ── Body (children livre) ───────────────────────────────────────── */\n\nexport const body = tv({\n  base: \"flex flex-col gap-[18px] px-pad-4xl py-[22px]\",\n});\n\n/* ── Footer ──────────────────────────────────────────────────────── */\n/**\n * Default: justify-end (todos os botões à direita).\n * Com tertiary: justify-between (tertiary à esquerda, secondary+primary à direita).\n */\nexport const foot = tv({\n  base: [\n    \"flex items-center gap-gp-lg\",        // gap 10px\n    \"px-pad-4xl pt-pad-md pb-[22px]\",     // 24/8/22\n  ],\n  variants: {\n    layout: {\n      end:     \"justify-end\",\n      between: \"justify-between\",\n    },\n  },\n  defaultVariants: { layout: \"end\" },\n});\n\n/** Grupo da direita do footer (secondary + primary) quando há tertiary à esquerda. */\nexport const footRight = tv({\n  base: \"flex items-center gap-gp-lg\",\n});\n","import type { ReactNode } from \"react\";\nimport { X } from \"lucide-react\";\nimport { Dialog, DialogContent, DialogClose } from \"../../shadcn/dialog\";\nimport { Button } from \"../Button/button\";\nimport {\n  dialog,\n  closeBtn,\n  head,\n  headIcon,\n  headTitleWrap,\n  title as titleStyles,\n  description as descStyles,\n  body,\n  foot,\n  footRight,\n} from \"./modal.styles\";\n\n/* ─────────────────────────────────────────────────────────────────\n * Types\n * ───────────────────────────────────────────────────────────────── */\n\nexport type ModalSize = \"sm\" | \"md\" | \"lg\";\n\nexport type ModalAction = {\n  /** Texto do botão. */\n  label: ReactNode;\n  /** Callback do click. */\n  onClick?: () => void;\n  /** Estado disabled. */\n  disabled?: boolean;\n  /** Loading com spinner (usa o do <Button>). */\n  loading?: boolean;\n  /** Quando true, pinta o botão com cor critical (destrutivo). */\n  danger?: boolean;\n};\n\nexport type ModalProps = {\n  /** Controlled open. */\n  open: boolean;\n  /** Callback quando o modal pede pra fechar (X, ESC, overlay click, ou ação). */\n  onClose: () => void;\n\n  /* ── Header (tudo opcional) ───────────────────────────────────── */\n  /**\n   * Ícone do header — renderizado dentro de um container 40×40 à esquerda.\n   * Passe o lucide pronto com `className=\"size-icon-md\"` e `strokeWidth={1.7}`.\n   * Quando ausente, o header não tem icon container (texto começa à esquerda).\n   */\n  icon?: ReactNode;\n  /** Título principal — 17px / 700. */\n  title?: ReactNode;\n  /** Descrição/subtítulo — 12.5px / fg-muted. */\n  description?: ReactNode;\n\n  /* ── Body ─────────────────────────────────────────────────────── */\n  /** Conteúdo do body — flex-col com gap 18px entre filhos. */\n  children?: ReactNode;\n\n  /* ── Footer: modo estruturado ────────────────────────────────── */\n  /**\n   * Ação primária — botão filled (default brand, critical quando `danger`).\n   * Fica sempre na ponta direita do footer.\n   */\n  primaryAction?: ModalAction;\n  /**\n   * Ação secundária — botão outline secondary.\n   * Default label \"Cancelar\". Default onClick = onClose.\n   */\n  secondaryAction?: ModalAction;\n  /**\n   * Ação terciária — opcional. Quando presente, vai pra ESQUERDA do footer\n   * (justify-between). Use pra ações destrutivas (delete) ou neutras (ajuda).\n   * Estilo: ghost critical quando `danger`, ghost secondary caso contrário.\n   */\n  tertiaryAction?: ModalAction;\n\n  /* ── Footer: modo override (escape hatch) ────────────────────── */\n  /**\n   * Se passado, substitui inteiramente as 3 actions estruturadas.\n   * Use quando precisar de layout custom (links, multi-step indicator, etc).\n   */\n  footer?: ReactNode;\n\n  /* ── Visual ───────────────────────────────────────────────────── */\n  /**\n   * Largura máxima do modal:\n   *   - sm: 440px\n   *   - md: 540px (default — match TblViewsModal sandbox)\n   *   - lg: 720px\n   */\n  size?: ModalSize;\n\n  /** Esconde o X de fechar no canto superior direito. */\n  hideClose?: boolean;\n  /** Click no overlay fecha o modal. Default true (comportamento padrão Dialog). */\n  closeOnOverlay?: boolean;\n\n  /** ClassName extra no DialogContent (root). */\n  className?: string;\n};\n\n/* ─────────────────────────────────────────────────────────────────\n * Component\n * ───────────────────────────────────────────────────────────────── */\n\n/**\n * Modal — composto sobre o `<Dialog>` (shadcn) com estrutura de header rico\n * (icon + título + descrição), body livre via children, e footer flexível\n * (até 3 actions estruturadas OU footer custom via slot).\n *\n * Visual alinhado com o `TblViewsModal` do sandbox `/design-and-table-v2`:\n * dialog 540px (md), header com feature-icon 40×40, footer com botões DS.\n *\n * Quando precisar de modal de confirmação destrutiva simples, use `<AlertModal>`.\n */\nexport function Modal({\n  open,\n  onClose,\n  icon,\n  title,\n  description,\n  children,\n  primaryAction,\n  secondaryAction,\n  tertiaryAction,\n  footer,\n  size = \"md\",\n  hideClose = false,\n  closeOnOverlay = true,\n  className,\n}: ModalProps) {\n  const hasHeader = Boolean(icon || title || description);\n  const hasStructuredFooter = Boolean(primaryAction || secondaryAction || tertiaryAction);\n  const showFooter = Boolean(footer) || hasStructuredFooter;\n\n  const handleOpenChange = (next: boolean) => {\n    if (next) return;\n    // Quando closeOnOverlay=false, ignora fechamento por overlay/ESC\n    // (Radix dispara onOpenChange em ambos os casos; aqui simplificamos:\n    // se você quer prevenir, controle externamente).\n    if (!closeOnOverlay) return;\n    onClose();\n  };\n\n  return (\n    <Dialog open={open} onOpenChange={handleOpenChange}>\n      <DialogContent\n        className={dialog({ size, className })}\n        hideClose\n        aria-labelledby={title ? \"modal-title\" : undefined}\n        aria-describedby={description ? \"modal-description\" : undefined}\n      >\n        {!hideClose && (\n          <DialogClose className={closeBtn()} aria-label=\"Fechar\">\n            <X className=\"size-icon-sm\" />\n          </DialogClose>\n        )}\n\n        {hasHeader && (\n          <header className={head()}>\n            {icon && (\n              <span className={headIcon()} aria-hidden=\"true\">\n                {icon}\n              </span>\n            )}\n            {(title || description) && (\n              <div className={headTitleWrap()}>\n                {title && (\n                  <h3 id=\"modal-title\" className={titleStyles()}>\n                    {title}\n                  </h3>\n                )}\n                {description && (\n                  <p id=\"modal-description\" className={descStyles()}>\n                    {description}\n                  </p>\n                )}\n              </div>\n            )}\n          </header>\n        )}\n\n        {children !== undefined && children !== null && (\n          <div className={body()}>{children}</div>\n        )}\n\n        {showFooter && (\n          <footer\n            className={foot({\n              layout: tertiaryAction ? \"between\" : \"end\",\n            })}\n          >\n            {footer ?? <StructuredActions\n              primary={primaryAction}\n              secondary={secondaryAction}\n              tertiary={tertiaryAction}\n              onClose={onClose}\n            />}\n          </footer>\n        )}\n      </DialogContent>\n    </Dialog>\n  );\n}\n\n/* ─────────────────────────────────────────────────────────────────\n * Internal — footer estruturado (a partir das 3 actions)\n * ───────────────────────────────────────────────────────────────── */\n\nfunction StructuredActions({\n  primary,\n  secondary,\n  tertiary,\n  onClose,\n}: {\n  primary?: ModalAction;\n  secondary?: ModalAction;\n  tertiary?: ModalAction;\n  onClose: () => void;\n}) {\n  // Sem tertiary → 1 grupo só (justify-end pelo container).\n  // Com tertiary → 2 grupos (tertiary | secondary+primary), justify-between.\n\n  const renderTertiary = tertiary && (\n    <Button\n      color={tertiary.danger ? \"critical\" : \"secondary\"}\n      variant=\"ghost\"\n      size=\"md\"\n      onClick={tertiary.onClick}\n      disabled={tertiary.disabled}\n      loading={tertiary.loading}\n    >\n      {tertiary.label}\n    </Button>\n  );\n\n  const renderSecondary = secondary && (\n    <Button\n      color=\"secondary\"\n      variant=\"outline\"\n      size=\"md\"\n      onClick={secondary.onClick ?? onClose}\n      disabled={secondary.disabled}\n      loading={secondary.loading}\n    >\n      {secondary.label}\n    </Button>\n  );\n\n  const renderPrimary = primary && (\n    <Button\n      color={primary.danger ? \"critical\" : \"primary\"}\n      variant=\"filled\"\n      size=\"md\"\n      onClick={primary.onClick}\n      disabled={primary.disabled}\n      loading={primary.loading}\n    >\n      {primary.label}\n    </Button>\n  );\n\n  if (tertiary) {\n    return (\n      <>\n        {renderTertiary}\n        <div className={footRight()}>\n          {renderSecondary}\n          {renderPrimary}\n        </div>\n      </>\n    );\n  }\n\n  return (\n    <>\n      {renderSecondary}\n      {renderPrimary}\n    </>\n  );\n}\n","import type { LucideIcon } from \"lucide-react\";\nimport {\n  Hash, User, AtSign, Phone, CheckCircle2, Tag,\n  Users, DollarSign, Calendar, Type,\n} from \"lucide-react\";\n\n/* ── Colunas (idêntico ao sandbox `/design-and-table-v2`) ──────────── */\n\nexport type TabelaCol = {\n  key: string;\n  type: \"select\" | \"id\" | \"person\" | \"email\" | \"phone\" | \"status\" | \"category\" | \"agent\" | \"currency\" | \"date\" | \"text\" | \"actions\";\n  label?: string;\n  icon?: LucideIcon;\n  width?: number;\n  minWidth?: number;\n  sorted?: boolean;\n};\n\nexport const COLUMNS: TabelaCol[] = [\n  { key: \"select\",      width: 44,                              type: \"select\"   },\n  { key: \"id\",          width: 120,    label: \"ID\",             type: \"id\",       icon: Hash },\n  { key: \"name\",        minWidth: 220, label: \"Nome\",           type: \"person\",   icon: User, sorted: true },\n  { key: \"email\",       minWidth: 240, label: \"Email\",          type: \"email\",    icon: AtSign },\n  { key: \"phone\",       minWidth: 170, label: \"Telefone\",       type: \"phone\",    icon: Phone },\n  { key: \"status\",      minWidth: 140, label: \"Status\",         type: \"status\",   icon: CheckCircle2 },\n  { key: \"category\",    minWidth: 130, label: \"Categoria\",      type: \"category\", icon: Tag },\n  { key: \"agent\",       minWidth: 170, label: \"Atribuído\",      type: \"agent\",    icon: Users },\n  { key: \"value\",       width: 130,    label: \"Valor\",          type: \"currency\", icon: DollarSign },\n  { key: \"createdAt\",   width: 130,    label: \"Criado em\",      type: \"date\",     icon: Calendar },\n  { key: \"lastContact\", width: 150,    label: \"Último contato\", type: \"date\",     icon: Calendar },\n  { key: \"location\",    minWidth: 150, label: \"Localização\",    type: \"text\",     icon: Type },\n  { key: \"actions\",     width: 44,                              type: \"actions\"  },\n];\n\nexport function getColCellStyle(col: TabelaCol): React.CSSProperties {\n  if (col.width)    return { width: col.width,       flex: `0 0 ${col.width}px` };\n  if (col.minWidth) return { minWidth: col.minWidth, flex: `1 0 ${col.minWidth}px` };\n  return {};\n}\n\n/* ── Lookups (statuses/categorias/agentes) ─────────────────────────── */\n\nexport const STATUSES = {\n  active:   { label: \"Ativo\",    color: \"var(--color-fg-success)\" },\n  pending:  { label: \"Pendente\", color: \"var(--color-fg-warning)\" },\n  paused:   { label: \"Pausado\",  color: \"var(--color-fg-info)\" },\n  inactive: { label: \"Inativo\",  color: \"var(--color-fg-muted)\" },\n} as const;\n\nexport const CATEGORIES = {\n  royal:      { label: \"Royal\",      kind: \"warning\" as const },\n  licenciado: { label: \"Licenciado\", kind: \"info\"    as const },\n  lead:       { label: \"Lead\",       kind: \"success\" as const },\n};\n\nexport const AGENTS = {\n  you:    { name: \"Você\",         initials: \"VC\", color: \"#0a3a2e\" },\n  aline:  { name: \"Aline Castro\", initials: \"AC\", color: \"#f59e0b\" },\n  carlos: { name: \"Carlos Souza\", initials: \"CS\", color: \"#8754ec\" },\n  maria:  { name: \"Maria Lima\",   initials: \"ML\", color: \"#ef4444\" },\n} as const;\n\n/* ── Mock data (10 rows determinísticas) ───────────────────────────── */\n\nexport type TabelaRow = {\n  id: string;\n  name: string;\n  initials: string;\n  avatarColor: string;\n  email: string;\n  phone: string;\n  statusId: keyof typeof STATUSES;\n  categoryId: keyof typeof CATEGORIES;\n  location: string;\n  value: number;\n  agentId: keyof typeof AGENTS;\n  createdAt: number;\n  lastContact: number;\n};\n\nconst BASE_DATE = new Date(\"2026-04-15T12:00:00Z\").getTime();\nconst DAY_MS = 86400000;\n\nconst ROWS_BASE: TabelaRow[] = [\n  { id: \"CLI-2401\", name: \"Maria Silva\",     initials: \"MS\", avatarColor: \"#f59e0b\", email: \"maria.silva@example.com\",     phone: \"+55 11 91234-5678\", statusId: \"active\",   categoryId: \"royal\",      location: \"São Paulo, SP\",      value: 4800,  agentId: \"you\",    createdAt: BASE_DATE - 65 * DAY_MS, lastContact: BASE_DATE - 2 * DAY_MS  },\n  { id: \"CLI-2402\", name: \"João Santos\",     initials: \"JS\", avatarColor: \"#0a3a2e\", email: \"joao.santos@example.com\",     phone: \"+55 11 92345-6789\", statusId: \"pending\",  categoryId: \"licenciado\", location: \"Rio de Janeiro, RJ\", value: 12300, agentId: \"aline\",  createdAt: BASE_DATE - 58 * DAY_MS, lastContact: BASE_DATE - 5 * DAY_MS  },\n  { id: \"CLI-2403\", name: \"Carlos Oliveira\", initials: \"CO\", avatarColor: \"#8754ec\", email: \"carlos.oliveira@example.com\", phone: \"+55 11 93456-7890\", statusId: \"active\",   categoryId: \"lead\",       location: \"Belo Horizonte, MG\", value: 2150,  agentId: \"carlos\", createdAt: BASE_DATE - 51 * DAY_MS, lastContact: BASE_DATE - 1 * DAY_MS  },\n  { id: \"CLI-2404\", name: \"Ana Costa\",       initials: \"AC\", avatarColor: \"#1cb280\", email: \"ana.costa@example.com\",       phone: \"+55 11 94567-8901\", statusId: \"paused\",   categoryId: \"royal\",      location: \"Porto Alegre, RS\",   value: 8900,  agentId: \"maria\",  createdAt: BASE_DATE - 44 * DAY_MS, lastContact: BASE_DATE - 12 * DAY_MS },\n  { id: \"CLI-2405\", name: \"Pedro Pereira\",   initials: \"PP\", avatarColor: \"#ef4444\", email: \"pedro.pereira@example.com\",   phone: \"+55 11 95678-9012\", statusId: \"inactive\", categoryId: \"lead\",       location: \"Curitiba, PR\",       value: 1100,  agentId: \"you\",    createdAt: BASE_DATE - 37 * DAY_MS, lastContact: BASE_DATE - 30 * DAY_MS },\n  { id: \"CLI-2406\", name: \"Lúcia Almeida\",   initials: \"LA\", avatarColor: \"#f9a47a\", email: \"lucia.almeida@example.com\",   phone: \"+55 11 96789-0123\", statusId: \"active\",   categoryId: \"licenciado\", location: \"Recife, PE\",         value: 6750,  agentId: \"aline\",  createdAt: BASE_DATE - 30 * DAY_MS, lastContact: BASE_DATE - 3 * DAY_MS  },\n  { id: \"CLI-2407\", name: \"Roberto Souza\",   initials: \"RS\", avatarColor: \"#0088cc\", email: \"roberto.souza@example.com\",   phone: \"+55 11 97890-1234\", statusId: \"pending\",  categoryId: \"royal\",      location: \"São Paulo, SP\",      value: 15200, agentId: \"carlos\", createdAt: BASE_DATE - 23 * DAY_MS, lastContact: BASE_DATE - 7 * DAY_MS  },\n  { id: \"CLI-2408\", name: \"Fernanda Lima\",   initials: \"FL\", avatarColor: \"#e1306c\", email: \"fernanda.lima@example.com\",   phone: \"+55 11 98901-2345\", statusId: \"active\",   categoryId: \"lead\",       location: \"Rio de Janeiro, RJ\", value: 3400,  agentId: \"maria\",  createdAt: BASE_DATE - 16 * DAY_MS, lastContact: BASE_DATE - 1 * DAY_MS  },\n  { id: \"CLI-2409\", name: \"Bruno Rodrigues\", initials: \"BR\", avatarColor: \"#70c748\", email: \"bruno.rodrigues@example.com\", phone: \"+55 11 99012-3456\", statusId: \"paused\",   categoryId: \"licenciado\", location: \"Belo Horizonte, MG\", value: 5600,  agentId: \"you\",    createdAt: BASE_DATE - 9 * DAY_MS,  lastContact: BASE_DATE - 6 * DAY_MS  },\n  { id: \"CLI-2410\", name: \"Camila Ribeiro\",  initials: \"CR\", avatarColor: \"#8754ec\", email: \"camila.ribeiro@example.com\",  phone: \"+55 11 90123-4567\", statusId: \"active\",   categoryId: \"royal\",      location: \"Porto Alegre, RS\",   value: 9800,  agentId: \"aline\",  createdAt: BASE_DATE - 2 * DAY_MS,  lastContact: BASE_DATE                },\n];\n\n/** Sufixos pra gerar variações nos clones (mantém aparência de dataset real) */\nconst NAME_SUFFIXES = [\"\", \" Jr\", \" Filho\", \" Neto\", \" II\"];\nconst CITY_OVERRIDES = [\"Salvador, BA\", \"Fortaleza, CE\", \"Manaus, AM\", \"Brasília, DF\", \"Vitória, ES\"];\n\n/**\n * Dataset estendido — 50 rows.\n * 5 ciclos de ROWS_BASE com IDs sequenciais (CLI-2401 → CLI-2450) e pequenas\n * variações em nome/cidade/valor pra dar a sensação de dataset real.\n */\nexport const ROWS_MOCK: TabelaRow[] = Array.from({ length: 50 }, (_, i) => {\n  const base = ROWS_BASE[i % ROWS_BASE.length];\n  const cycle = Math.floor(i / ROWS_BASE.length); // 0..4\n  const seq = 2401 + i;\n  const nameSuffix = NAME_SUFFIXES[cycle];\n  return {\n    ...base,\n    id: `CLI-${seq}`,\n    name: `${base.name}${nameSuffix}`,\n    location: cycle === 0 ? base.location : CITY_OVERRIDES[cycle - 1] ?? base.location,\n    value: base.value + cycle * 175,\n    createdAt: base.createdAt - cycle * 7 * DAY_MS,\n    lastContact: base.lastContact - cycle * 3 * DAY_MS,\n  };\n});\n\n/* ── Formatters ─────────────────────────────────────────────────────── */\n\nexport function formatCurrency(value: number) {\n  return value.toLocaleString(\"pt-BR\", { style: \"currency\", currency: \"BRL\", minimumFractionDigits: 2 });\n}\n\nconst MONTHS_SHORT = [\"jan\", \"fev\", \"mar\", \"abr\", \"mai\", \"jun\", \"jul\", \"ago\", \"set\", \"out\", \"nov\", \"dez\"];\nexport function formatDateShort(value: number) {\n  if (!value) return \"—\";\n  const d = new Date(value);\n  const day = d.getDate().toString().padStart(2, \"0\");\n  return `${day} de ${MONTHS_SHORT[d.getMonth()]}`;\n}\n","import { tv } from \"@/utils/tv\";\n\n/**\n * TabelaTeste — réplica visual da tabela do sandbox /design-and-table-v2.\n *\n * Componente de referência hardcoded: sem props, sem variants, sem flexibility.\n * Serve pra fixar como tokens DS mapeiam pra esse visual específico — outros\n * componentes (Table) podem usar essas classes como guia.\n *\n * Os estilos abaixo são literais — cada key corresponde a uma classe do\n * sandbox. Densidade default = comfortable (56px), cellBorders ON.\n */\n\nexport const tabelaStyles = {\n  /* ── Wrap (container externo) ─────────────────────────────────────── */\n  wrap: tv({\n    base: [\n      \"flex-1 overflow-auto min-h-0\",\n      \"bg-bg-table border border-border-table rounded-radius-xl\",\n      \"scrollbar-default\",\n    ],\n  }),\n\n  /* tbl-table — inner container, min-width: max-content pra scroll horizontal */\n  table: tv({\n    base: \"block min-w-max\",\n  }),\n\n  /* ── Head ─────────────────────────────────────────────────────────── */\n  thead: tv({\n    base: [\n      \"sticky top-0 z-[5]\",\n      \"bg-bg-table-head\",\n      \"border-b border-border-table\",\n    ],\n  }),\n\n  trHead: tv({\n    base: \"flex bg-bg-table-head\",\n  }),\n\n  /* tbl-th base — 42px sempre, padding-right reserva espaço pro menu absoluto */\n  th: tv({\n    base: [\n      \"relative flex items-center gap-gp-sm\",\n      \"py-0 pl-[14px] pr-[38px]\",\n      \"h-[42px] text-[13px] font-semibold leading-none\",\n      \"text-fg-muted cursor-pointer select-none\",\n      \"[flex:1_0_auto]\",\n      \"hover:text-fg-default\",\n      // hover do th faz menu aparecer (ver thMenu)\n      // hover do th faz sort-hint aparecer (ver sortHint)\n    ],\n    variants: {\n      sorted: { true: \"text-fg-default\" },\n    },\n    defaultVariants: { sorted: false },\n  }),\n\n  /* Coluna select — 44px, sem hover, justify-center, sem padding right pro menu */\n  thSelect: tv({\n    base: [\n      \"relative flex items-center justify-center\",\n      \"w-[44px] [flex:0_0_44px] px-[12px] py-0\",\n      \"h-[42px] cursor-default select-none\",\n      \"bg-bg-table-head\",\n    ],\n  }),\n\n  /* Coluna actions — 44px sticky right */\n  thActions: tv({\n    base: [\n      \"relative flex items-center justify-center\",\n      \"w-[44px] [flex:0_0_44px] p-0\",\n      \"h-[42px] cursor-default select-none\",\n      \"sticky right-0 z-[3]\",\n      \"bg-bg-table-head\",\n    ],\n  }),\n\n  /* Label da coluna — elipsa */\n  thLabel: tv({\n    base: \"flex-1 min-w-0 whitespace-nowrap overflow-hidden text-ellipsis text-left\",\n  }),\n\n  /* Ícone de tipo — opacity 0.7 rest, 1 no hover do th OU quando sorted */\n  thTypeIcon: tv({\n    base: [\n      \"shrink-0 size-[13px] text-fg-muted opacity-70\",\n      \"group-hover/th:opacity-100\",\n    ],\n    variants: {\n      sorted: { true: \"opacity-100\" },\n    },\n    defaultVariants: { sorted: false },\n  }),\n\n  /* Sort badge \"1\" (chip brand) + arrow */\n  thSort: tv({\n    base: \"inline-flex items-center gap-[4px] shrink-0 text-fg-default\",\n  }),\n  thSortIndex: tv({\n    base: [\n      \"grid place-items-center\",\n      \"min-w-[18px] h-[18px] px-[5px]\",\n      \"rounded-radius-sm\",\n      \"bg-bg-brand text-fg-on-brand\",\n      \"text-[10.5px] font-bold leading-none\",\n      \"[font-variant-numeric:tabular-nums]\",\n    ],\n  }),\n\n  /* Hint atenuado em hover de col não-sorted (sinaliza clicável) */\n  thSortHint: tv({\n    base: [\n      \"inline-flex items-center shrink-0 text-fg-muted\",\n      \"opacity-0 transition-opacity duration-150\",\n      \"group-hover/th:opacity-50\",\n    ],\n  }),\n\n  /* Menu \"...\" absolute, aparece só no hover */\n  thMenu: tv({\n    base: [\n      \"absolute right-[6px] top-1/2 -translate-y-1/2 z-[1]\",\n      \"grid place-items-center size-[28px]\",\n      \"border-0 bg-transparent text-fg-muted rounded-radius-md cursor-pointer\",\n      \"opacity-0 transition-all duration-150\",\n      \"group-hover/th:opacity-100\",\n      \"hover:bg-bg-muted hover:text-fg-default\",\n    ],\n  }),\n\n  /* Resize handle (6px) — linha que vira brand e projeta pra baixo no hover */\n  thResize: tv({\n    base: [\n      \"absolute right-0 top-0 bottom-0 w-[6px] z-[2]\",\n      \"bg-transparent cursor-col-resize\",\n      // ::before linha vertical dentro do header\n      \"before:content-[''] before:absolute before:left-1/2 before:-translate-x-1/2\",\n      \"before:top-[8px] before:bottom-[8px] before:w-px before:bg-transparent\",\n      \"before:transition-all before:duration-150\",\n      \"group-hover/th:before:bg-fg-muted\",\n      // hover direto no handle → brand 2px + altura total\n      \"hover:before:bg-bg-brand hover:before:w-[2px] hover:before:top-0 hover:before:bottom-0\",\n      // ::after projeção 100vh pra baixo cobrindo body\n      \"after:content-[''] after:absolute after:left-1/2 after:-translate-x-1/2\",\n      \"after:top-full after:w-[2px] after:h-screen after:bg-transparent after:pointer-events-none\",\n      \"after:transition-colors after:duration-150\",\n      \"hover:after:bg-bg-brand\",\n    ],\n  }),\n\n  /* ── Body ─────────────────────────────────────────────────────────── */\n  tbody: tv({\n    base: \"bg-bg-surface\",\n  }),\n\n  /* tbl-tr — flex row, altura por densidade. Default comfortable (56px). */\n  tr: tv({\n    base: [\n      \"relative flex\",\n      \"border-b border-border-table bg-bg-surface\",\n      \"cursor-pointer transition-colors duration-150\",\n      \"hover:bg-bg-table-row-hover\",\n      \"focus-visible:outline-2 focus-visible:outline-bg-brand focus-visible:-outline-offset-2\",\n    ],\n    variants: {\n      density: {\n        compact:     \"h-[40px]\",\n        comfortable: \"h-[56px]\",\n        spacious:    \"h-[64px]\",\n      },\n      // Selected (checkbox) e Open (detail panel) — mesmo visual brand-tinted\n      // + strip lateral 3px brand via ::before\n      selected: {\n        true: [\n          \"bg-bg-table-row-selected hover:bg-bg-table-row-selected-hover\",\n          \"before:content-[''] before:absolute before:left-0 before:top-0 before:bottom-0\",\n          \"before:w-[3px] before:bg-bg-brand before:z-[5] before:pointer-events-none\",\n        ].join(\" \"),\n      },\n    },\n    defaultVariants: { density: \"comfortable\", selected: false },\n  }),\n\n  /* Cells base — height/font-size variam por densidade */\n  td: tv({\n    base: [\n      \"flex items-center px-[14px] py-0\",\n      \"text-fg-default\",\n      \"[flex:1_0_auto] overflow-hidden whitespace-nowrap\",\n    ],\n    variants: {\n      density: {\n        compact:     \"h-[40px] text-[12px]\",\n        comfortable: \"h-[56px] text-[13px]\",\n        spacious:    \"h-[64px] text-[13px]\",\n      },\n    },\n    defaultVariants: { density: \"comfortable\" },\n  }),\n\n  tdSelect: tv({\n    base: [\n      \"flex items-center justify-center\",\n      \"w-[44px] [flex:0_0_44px] px-[12px] py-0\",\n    ],\n    variants: {\n      density: {\n        compact:     \"h-[40px]\",\n        comfortable: \"h-[56px]\",\n        spacious:    \"h-[64px]\",\n      },\n    },\n    defaultVariants: { density: \"comfortable\" },\n  }),\n\n  /* tdActions — sticky right, bg adapta ao estado da row */\n  tdActions: tv({\n    base: [\n      \"flex items-center justify-center\",\n      \"w-[44px] [flex:0_0_44px] p-0\",\n      \"sticky right-0 z-[2]\",\n      \"bg-bg-surface\",\n      // bg adapta ao estado da row pai\n      \"group-hover/tr:bg-bg-table-row-hover\",\n    ],\n    variants: {\n      density: {\n        compact:     \"h-[40px]\",\n        comfortable: \"h-[56px]\",\n        spacious:    \"h-[64px]\",\n      },\n      selected: {\n        true: \"!bg-bg-table-row-selected group-hover/tr:!bg-bg-table-row-selected-hover\",\n      },\n    },\n    defaultVariants: { density: \"comfortable\", selected: false },\n  }),\n\n  /* Botão \"...\" da row — opacity 0 → 1 no hover */\n  rowMenuBtn: tv({\n    base: [\n      \"grid place-items-center size-[28px]\",\n      \"border-0 bg-transparent text-fg-muted rounded-radius-md cursor-pointer\",\n      \"opacity-0 transition-all duration-150\",\n      \"group-hover/tr:opacity-100\",\n      \"hover:bg-bg-muted hover:text-fg-default\",\n    ],\n  }),\n\n  /* ── Cell borders verticais (sempre on neste componente) ──────────── */\n  cellBorderTh: tv({\n    base: \"border-r border-border-table\",\n  }),\n  cellBorderTd: tv({\n    base: \"border-r border-border-table\",\n  }),\n\n  /* ── Cells específicas ────────────────────────────────────────────── */\n  cellId: tv({\n    base: \"text-[13px] text-fg-muted [font-variant-numeric:tabular-nums]\",\n  }),\n  cellCurrency: tv({\n    base: \"[font-variant-numeric:tabular-nums] font-semibold\",\n  }),\n  cellDate: tv({\n    base: \"[font-variant-numeric:tabular-nums] text-fg-muted\",\n  }),\n  cellStatus: tv({\n    base: \"inline-flex items-center gap-gp-md text-[13px] text-fg-default dark:text-fg-muted\",\n  }),\n  dot: tv({\n    base: \"size-[8px] rounded-radius-full shrink-0\",\n  }),\n  cellPerson: tv({\n    base: \"inline-flex items-center gap-gp-md whitespace-nowrap overflow-hidden\",\n  }),\n  cellPersonName: tv({\n    base: \"whitespace-nowrap overflow-hidden text-ellipsis font-medium\",\n  }),\n  cellAgent: tv({\n    base: \"inline-flex items-center gap-gp-md whitespace-nowrap overflow-hidden\",\n  }),\n\n  /* Avatar 28px (sm 22px) — bg via inline style (cor por entidade) */\n  avatar: tv({\n    base: [\n      \"grid place-items-center shrink-0\",\n      \"size-[28px] rounded-radius-full\",\n      \"text-white text-[11px] font-bold\",\n    ],\n  }),\n  avatarSm: tv({\n    base: [\n      \"grid place-items-center shrink-0\",\n      \"size-[22px] rounded-radius-full\",\n      \"text-white text-[10px] font-bold\",\n    ],\n  }),\n\n  cellLink: tv({\n    base: \"text-fg-brand no-underline hover:underline\",\n  }),\n  cellMuted: tv({\n    base: \"text-fg-muted\",\n  }),\n\n  /* ── Checkbox custom (16px com check rotacionado) ─────────────────── */\n  checkbox: tv({\n    base: [\n      \"appearance-none size-[16px] cursor-pointer relative\",\n      \"border-[1.5px] border-border-input bg-bg-input rounded-radius-sm\",\n      \"transition-[background,border-color] duration-100\",\n      \"checked:bg-bg-brand checked:border-border-brand\",\n      \"indeterminate:bg-bg-brand indeterminate:border-border-brand\",\n      // Check mark via ::after — retângulo rotacionado 45deg\n      \"checked:after:content-[''] checked:after:absolute\",\n      \"checked:after:left-1/2 checked:after:top-1/2\",\n      \"checked:after:w-[4px] checked:after:h-[8px]\",\n      \"checked:after:border-solid checked:after:border-fg-on-brand\",\n      \"checked:after:[border-width:0_2px_2px_0]\",\n      \"checked:after:[transform:translate(-50%,-55%)_rotate(45deg)]\",\n      // Barra indeterminate\n      \"indeterminate:after:content-[''] indeterminate:after:absolute\",\n      \"indeterminate:after:left-1/2 indeterminate:after:top-1/2\",\n      \"indeterminate:after:w-[8px] indeterminate:after:h-[2px]\",\n      \"indeterminate:after:bg-fg-on-brand indeterminate:after:rounded-[1px]\",\n      \"indeterminate:after:[transform:translate(-50%,-50%)]\",\n    ],\n  }),\n\n  /* ── Chip de categoria (pílula soft com kind) ─────────────────────── */\n  chip: tv({\n    base: [\n      \"inline-flex items-center gap-[4px]\",\n      \"h-[22px] px-[8px] rounded-radius-full\",\n      \"text-[11px] font-semibold leading-none whitespace-nowrap\",\n    ],\n    variants: {\n      kind: {\n        success: \"bg-bg-success-muted text-fg-success\",\n        warning: \"bg-bg-warning-muted text-fg-warning\",\n        info:    \"bg-bg-info-muted    text-fg-info\",\n        danger:  \"bg-bg-danger-muted  text-fg-danger\",\n      },\n    },\n    defaultVariants: { kind: \"info\" },\n  }),\n};\n","import { useState } from \"react\";\nimport { ArrowUpDown, MoreHorizontal, MoreVertical } from \"lucide-react\";\nimport {\n  COLUMNS,\n  ROWS_MOCK,\n  STATUSES,\n  CATEGORIES,\n  AGENTS,\n  getColCellStyle,\n  formatCurrency,\n  formatDateShort,\n  type TabelaCol,\n  type TabelaRow,\n} from \"./mock-data\";\nimport { tabelaStyles as s } from \"./tabela-teste.styles\";\n\n/**\n * TabelaTeste — réplica visual da tabela do sandbox `/design-and-table-v2`.\n *\n * Hardcoded por design: sem props além do nada. 13 colunas fixas, 10 rows mock,\n * densidade comfortable, cell-borders on. Toggle de seleção e detail panel\n * (state local).\n *\n * Serve como referência visual fixa pra outros componentes Table do DS — o\n * mapeamento de tokens, espaçamentos e estados está aqui de forma literal.\n */\nexport function TabelaTeste() {\n  const [selectedIds, setSelectedIds] = useState<Set<string>>(new Set());\n  const [openRowId, setOpenRowId] = useState<string | null>(null);\n\n  const allSelected = selectedIds.size === ROWS_MOCK.length;\n  const someSelected = selectedIds.size > 0 && !allSelected;\n\n  const toggleSelect = (id: string) => {\n    setSelectedIds((prev) => {\n      const next = new Set(prev);\n      if (next.has(id)) next.delete(id); else next.add(id);\n      return next;\n    });\n  };\n  const toggleAll = () => {\n    if (selectedIds.size > 0) setSelectedIds(new Set());\n    else setSelectedIds(new Set(ROWS_MOCK.map((r) => r.id)));\n  };\n\n  return (\n    <div\n      role=\"region\"\n      aria-label=\"Tabela de clientes (referência)\"\n      className={s.wrap()}\n    >\n      <div className={s.table()}>\n        {/* HEAD */}\n        <div className={s.thead()} role=\"rowgroup\">\n          <div className={s.trHead()} role=\"row\">\n            {COLUMNS.map((col) => renderHeadCell(col, {\n              allSelected,\n              someSelected,\n              onToggleAll: toggleAll,\n            }))}\n          </div>\n        </div>\n\n        {/* BODY */}\n        <div className={s.tbody()} role=\"rowgroup\">\n          {ROWS_MOCK.map((row) => {\n            const isSelected = selectedIds.has(row.id);\n            const isOpen = openRowId === row.id;\n            const isHighlighted = isSelected || isOpen;\n            return (\n              <div\n                key={row.id}\n                role=\"row\"\n                tabIndex={0}\n                onClick={() => setOpenRowId((cur) => (cur === row.id ? null : row.id))}\n                className={`group/tr ${s.tr({ selected: isHighlighted })}`}\n              >\n                {COLUMNS.map((col) =>\n                  renderBodyCell(col, row, {\n                    isSelected,\n                    isHighlighted,\n                    onToggle: () => toggleSelect(row.id),\n                  })\n                )}\n              </div>\n            );\n          })}\n        </div>\n      </div>\n    </div>\n  );\n}\n\n/* ── Head cell renderer ────────────────────────────────────────────── */\n\nfunction renderHeadCell(\n  col: TabelaCol,\n  ctx: { allSelected: boolean; someSelected: boolean; onToggleAll: () => void },\n) {\n  const cellStyle = getColCellStyle(col);\n\n  if (col.type === \"select\") {\n    return (\n      <div\n        key={col.key}\n        role=\"columnheader\"\n        className={`${s.thSelect()} ${s.cellBorderTh()}`}\n        style={cellStyle}\n      >\n        <input\n          type=\"checkbox\"\n          className={s.checkbox()}\n          checked={ctx.allSelected}\n          ref={(el) => { if (el) el.indeterminate = ctx.someSelected; }}\n          onChange={ctx.onToggleAll}\n          aria-label=\"Selecionar todas\"\n        />\n      </div>\n    );\n  }\n\n  if (col.type === \"actions\") {\n    return (\n      <div\n        key={col.key}\n        role=\"columnheader\"\n        aria-label=\"Ações\"\n        className={s.thActions()}\n        style={cellStyle}\n      />\n    );\n  }\n\n  // Coluna IMEDIATAMENTE antes de actions não tem border-right (visual mais limpo)\n  const isBeforeActions = COLUMNS[COLUMNS.indexOf(col) + 1]?.type === \"actions\";\n  const borderCls = isBeforeActions ? \"\" : s.cellBorderTh();\n\n  const TypeIcon = col.icon;\n  const sorted = Boolean(col.sorted);\n\n  return (\n    <div\n      key={col.key}\n      role=\"columnheader\"\n      style={cellStyle}\n      className={`group/th ${s.th({ sorted })} ${borderCls}`}\n    >\n      {TypeIcon && <TypeIcon strokeWidth={1.7} className={s.thTypeIcon({ sorted })} aria-hidden=\"true\" />}\n      <span className={s.thLabel()}>{col.label}</span>\n      {sorted ? (\n        <span className={s.thSort()}>\n          <span className={s.thSortIndex()}>1</span>\n          <ArrowUpDown size={12} strokeWidth={1.8} />\n        </span>\n      ) : (\n        <span className={s.thSortHint()} aria-hidden>\n          <ArrowUpDown size={11} strokeWidth={1.8} />\n        </span>\n      )}\n      <button\n        type=\"button\"\n        className={s.thMenu()}\n        onClick={(e) => e.stopPropagation()}\n        aria-label={`Menu da coluna ${col.label}`}\n      >\n        <MoreVertical size={15} strokeWidth={1.7} />\n      </button>\n      <span className={s.thResize()} aria-hidden=\"true\" />\n    </div>\n  );\n}\n\n/* ── Body cell renderer ────────────────────────────────────────────── */\n\nfunction renderBodyCell(\n  col: TabelaCol,\n  row: TabelaRow,\n  ctx: { isSelected: boolean; isHighlighted: boolean; onToggle: () => void },\n) {\n  const cellStyle = getColCellStyle(col);\n\n  if (col.type === \"select\") {\n    return (\n      <div\n        key={col.key}\n        role=\"cell\"\n        className={`${s.tdSelect()} ${s.cellBorderTd()}`}\n        style={cellStyle}\n        onClick={(e) => e.stopPropagation()}\n      >\n        <input\n          type=\"checkbox\"\n          className={s.checkbox()}\n          checked={ctx.isSelected}\n          onChange={ctx.onToggle}\n          aria-label={`Selecionar ${row.name}`}\n        />\n      </div>\n    );\n  }\n\n  if (col.type === \"actions\") {\n    return (\n      <div\n        key={col.key}\n        role=\"cell\"\n        className={s.tdActions({ selected: ctx.isHighlighted })}\n        style={cellStyle}\n        onClick={(e) => e.stopPropagation()}\n      >\n        <button\n          type=\"button\"\n          className={s.rowMenuBtn()}\n          aria-label=\"Ações da linha\"\n          onClick={(e) => e.stopPropagation()}\n        >\n          <MoreHorizontal size={16} />\n        </button>\n      </div>\n    );\n  }\n\n  const isBeforeActions = COLUMNS[COLUMNS.indexOf(col) + 1]?.type === \"actions\";\n  const borderCls = isBeforeActions ? \"\" : s.cellBorderTd();\n\n  return (\n    <div\n      key={col.key}\n      role=\"cell\"\n      style={cellStyle}\n      className={`${s.td()} ${borderCls}`}\n    >\n      {renderCellContent(col, row)}\n    </div>\n  );\n}\n\n/* ── CellRenderer (switch por tipo) ────────────────────────────────── */\n\nfunction renderCellContent(col: TabelaCol, row: TabelaRow) {\n  switch (col.type) {\n    case \"id\":       return <span className={s.cellId()}>{row.id}</span>;\n    case \"person\":   return <PersonCell row={row} />;\n    case \"email\":    return (\n      <a\n        href={`mailto:${row.email}`}\n        className={s.cellLink()}\n        onClick={(e) => e.stopPropagation()}\n      >\n        {row.email}\n      </a>\n    );\n    case \"phone\":    return <PhoneCell value={row.phone} />;\n    case \"status\":   return <StatusCell statusId={row.statusId} />;\n    case \"category\": return <CategoryCell categoryId={row.categoryId} />;\n    case \"agent\":    return <AgentCell agentId={row.agentId} />;\n    case \"currency\": return <span className={s.cellCurrency()}>{formatCurrency(row.value)}</span>;\n    case \"date\":     return <DateCell value={row[col.key as \"createdAt\" | \"lastContact\"]} />;\n    case \"text\":     return <>{row[col.key as keyof TabelaRow]}</>;\n    default:         return null;\n  }\n}\n\n/* ── Sub-cells ─────────────────────────────────────────────────────── */\n\nfunction PersonCell({ row }: { row: TabelaRow }) {\n  return (\n    <span className={s.cellPerson()} title={row.name}>\n      <span className={s.avatar()} style={{ background: row.avatarColor }}>\n        {row.initials}\n      </span>\n      <span className={s.cellPersonName()}>{row.name}</span>\n    </span>\n  );\n}\n\nfunction StatusCell({ statusId }: { statusId: keyof typeof STATUSES }) {\n  const st = STATUSES[statusId];\n  if (!st) return null;\n  return (\n    <span className={s.cellStatus()}>\n      <span className={s.dot()} style={{ background: st.color }} aria-hidden />\n      {st.label}\n    </span>\n  );\n}\n\nfunction CategoryCell({ categoryId }: { categoryId: keyof typeof CATEGORIES }) {\n  const c = CATEGORIES[categoryId];\n  if (!c) return null;\n  return <span className={s.chip({ kind: c.kind })}>{c.label}</span>;\n}\n\nfunction AgentCell({ agentId }: { agentId: keyof typeof AGENTS }) {\n  const a = AGENTS[agentId];\n  if (!a) return <span className={s.cellMuted()}>—</span>;\n  return (\n    <span className={s.cellAgent()} title={a.name}>\n      <span className={s.avatarSm()} style={{ background: a.color }}>\n        {a.initials}\n      </span>\n      <span>{a.name}</span>\n    </span>\n  );\n}\n\nfunction PhoneCell({ value }: { value: string }) {\n  if (!value) return <span className={s.cellMuted()}>—</span>;\n  return (\n    <a\n      href={`tel:${value.replace(/\\D/g, \"\")}`}\n      className={s.cellLink()}\n      onClick={(e) => e.stopPropagation()}\n    >\n      {value}\n    </a>\n  );\n}\n\nfunction DateCell({ value }: { value: number }) {\n  if (!value) return <span className={s.cellMuted()}>—</span>;\n  return <span className={s.cellDate()}>{formatDateShort(value)}</span>;\n}\n"],"names":["title","f","s","_","i","next","description","X","titleStyles","descStyles","d","r","e","c","a"],"mappings":"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"}
+{"version":3,"file":"index.mjs","sources":["../src/components/ui/TableToolbar/hooks/use-toolbar-filters.ts","../src/components/ui/TableToolbar/hooks/use-toolbar-sort.ts","../src/components/ui/DataTable/builders/column-builders.ts","../src/components/ui/Modal/modal.styles.ts","../src/components/ui/Modal/modal.tsx","../src/components/ui/TabelaTeste/mock-data.ts","../src/components/ui/TabelaTeste/tabela-teste.styles.ts","../src/components/ui/TabelaTeste/tabela-teste.tsx"],"sourcesContent":["import { useCallback, useMemo, useState } from \"react\";\n\n/**\n * Filtro genérico — mantém o shape mínimo necessário pra UI/lógica.\n * O consumer pode estender via generics se precisar de campos custom.\n */\nexport type ToolbarFilterEntry = {\n  id: string;\n  columnKey: string;\n  op: string;\n  value: unknown;\n};\n\nexport type UseToolbarFiltersOptions<T extends ToolbarFilterEntry = ToolbarFilterEntry> = {\n  /** Filtros iniciais */\n  initial?: T[];\n  /** Gerador de ID — default usa crypto.randomUUID() ou timestamp fallback */\n  generateId?: () => string;\n};\n\nfunction defaultId(): string {\n  if (typeof crypto !== \"undefined\" && \"randomUUID\" in crypto) {\n    return crypto.randomUUID();\n  }\n  return `f_${Date.now()}_${Math.random().toString(36).slice(2, 9)}`;\n}\n\n/**\n * useToolbarFilters — helper opcional pra gerenciar estado de filtros.\n *\n * Retorna:\n *   - `list`: array de filtros\n *   - `add(entry)`: adiciona um filtro (gera id automático se omitido)\n *   - `remove(id)`: remove por id\n *   - `update(id, patch)`: atualiza parcialmente\n *   - `clear()`: zera tudo\n *   - `replaceAll(next)`: substitui array completo\n *   - `count`: total de filtros com `value` truthy (válidos pra aplicar)\n *\n * Uso (opcional — vc pode usar useState direto também):\n *\n *   const filters = useToolbarFilters({ initial: [...] });\n *   filters.add({ columnKey: \"status\", op: \"eq\", value: \"active\" });\n *   filters.remove(\"f_abc\");\n */\nexport function useToolbarFilters<T extends ToolbarFilterEntry = ToolbarFilterEntry>(\n  options?: UseToolbarFiltersOptions<T>,\n) {\n  const { initial = [], generateId = defaultId } = options ?? {};\n  const [list, setList] = useState<T[]>(initial as T[]);\n\n  const add = useCallback(\n    (entry: Omit<T, \"id\"> & { id?: string }) => {\n      setList((prev) => [\n        ...prev,\n        { ...entry, id: entry.id ?? generateId() } as T,\n      ]);\n    },\n    [generateId],\n  );\n\n  const remove = useCallback((id: string) => {\n    setList((prev) => prev.filter((f) => f.id !== id));\n  }, []);\n\n  const update = useCallback((id: string, patch: Partial<T>) => {\n    setList((prev) =>\n      prev.map((f) => (f.id === id ? ({ ...f, ...patch } as T) : f)),\n    );\n  }, []);\n\n  const clear = useCallback(() => setList([]), []);\n  const replaceAll = useCallback((next: T[]) => setList(next), []);\n\n  const count = useMemo(\n    () =>\n      list.filter((f) => {\n        if (f.value === null || f.value === undefined) return false;\n        if (typeof f.value === \"string\") return f.value.length > 0;\n        if (Array.isArray(f.value)) return f.value.length > 0;\n        return true;\n      }).length,\n    [list],\n  );\n\n  return { list, add, remove, update, clear, replaceAll, count } as const;\n}\n","import { useCallback, useState } from \"react\";\nimport type { SortDirection } from \"../table-toolbar.types\";\n\n// Re-export pra backward-compat (consumers que importavam daqui).\nexport type { SortDirection };\n\nexport type ToolbarSortEntry = {\n  columnKey: string;\n  direction: SortDirection;\n};\n\nexport type UseToolbarSortOptions = {\n  initial?: ToolbarSortEntry[];\n  /** Limite máximo de colunas ordenadas simultaneamente. Default: Infinity. */\n  maxColumns?: number;\n};\n\n/**\n * useToolbarSort — helper opcional pra ordenação multi-coluna.\n *\n * Retorna:\n *   - `list`: array de { columnKey, direction }\n *   - `toggle(columnKey)`: cicla asc → desc → off (remove)\n *   - `set(columnKey, direction)`: força um valor\n *   - `remove(columnKey)`: remove a ordenação de uma coluna\n *   - `clear()`: zera\n *   - `replaceAll(next)`: substitui\n *   - `count`: tamanho da lista\n *   - `directionOf(columnKey)`: lookup helper\n */\nexport function useToolbarSort(options?: UseToolbarSortOptions) {\n  const { initial = [], maxColumns = Infinity } = options ?? {};\n  const [list, setList] = useState<ToolbarSortEntry[]>(initial);\n\n  const toggle = useCallback(\n    (columnKey: string) => {\n      setList((prev) => {\n        const idx = prev.findIndex((s) => s.columnKey === columnKey);\n        if (idx === -1) {\n          // off → asc; respeita maxColumns\n          const next = [...prev, { columnKey, direction: \"asc\" as const }];\n          if (next.length > maxColumns) next.shift();\n          return next;\n        }\n        const current = prev[idx];\n        if (current.direction === \"asc\") {\n          // asc → desc\n          const next = [...prev];\n          next[idx] = { ...current, direction: \"desc\" };\n          return next;\n        }\n        // desc → off (remove)\n        return prev.filter((_, i) => i !== idx);\n      });\n    },\n    [maxColumns],\n  );\n\n  const set = useCallback(\n    (columnKey: string, direction: SortDirection) => {\n      setList((prev) => {\n        const idx = prev.findIndex((s) => s.columnKey === columnKey);\n        if (idx === -1) {\n          const next = [...prev, { columnKey, direction }];\n          if (next.length > maxColumns) next.shift();\n          return next;\n        }\n        const next = [...prev];\n        next[idx] = { columnKey, direction };\n        return next;\n      });\n    },\n    [maxColumns],\n  );\n\n  const remove = useCallback((columnKey: string) => {\n    setList((prev) => prev.filter((s) => s.columnKey !== columnKey));\n  }, []);\n\n  const clear = useCallback(() => setList([]), []);\n  const replaceAll = useCallback(\n    (next: ToolbarSortEntry[]) => setList(next),\n    [],\n  );\n\n  const directionOf = useCallback(\n    (columnKey: string): SortDirection | undefined =>\n      list.find((s) => s.columnKey === columnKey)?.direction,\n    [list],\n  );\n\n  return {\n    list,\n    toggle,\n    set,\n    remove,\n    clear,\n    replaceAll,\n    count: list.length,\n    directionOf,\n  } as const;\n}\n","import type { ReactNode } from \"react\";\nimport type {\n  DataTableColumnDef,\n  DataTableActionItem,\n} from \"../data-table.types\";\n\n/**\n * Column builders — reduzem boilerplate de `DataTableColumnDef` em casos comuns.\n *\n * Todos retornam um `DataTableColumnDef<T>` válido. Você pode spread extra props:\n *\n *   const cols = [\n *     textColumn<Client>(\"id\", \"ID\", { width: 120 }),\n *     currencyColumn<Client>(\"value\", \"Valor\", { sortable: true }),\n *     actionColumn<Client>({ getActions: ({ row }) => [...] }),\n *   ];\n *\n * Para casos custom, declare `DataTableColumnDef<T>` diretamente — builders são\n * conveniência, não substituem a API completa.\n */\n\ntype CommonOverrides<T> = Partial<DataTableColumnDef<T>>;\n\n/** Coluna de texto simples. `type: \"text\"` ativa render auto via registry. */\nexport function textColumn<T>(\n  field: keyof T | string,\n  headerName: string,\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return { field, headerName, type: \"text\", ...overrides };\n}\n\n/** Coluna numérica. `type: \"number\"` aplica tabular-nums + align right + locale format. */\nexport function numberColumn<T>(\n  field: keyof T | string,\n  headerName: string,\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return { field, headerName, type: \"number\", sortable: true, ...overrides };\n}\n\n/** Coluna de moeda — `typeOptions: { currency, locale }` opcional. */\nexport function currencyColumn<T>(\n  field: keyof T | string,\n  headerName: string,\n  overrides?: CommonOverrides<T> & { currency?: string; locale?: string },\n): DataTableColumnDef<T> {\n  const { currency, locale, ...rest } = overrides ?? {};\n  return {\n    field,\n    headerName,\n    type: \"currency\",\n    sortable: true,\n    ...(currency || locale\n      ? { typeOptions: { currency, locale } }\n      : {}),\n    ...rest,\n  };\n}\n\n/** Coluna de email — mailto link automático via registry. */\nexport function emailColumn<T>(\n  field: keyof T | string,\n  headerName: string = \"Email\",\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return { field, headerName, type: \"email\", ...overrides };\n}\n\n/** Coluna de telefone — tel link + máscara automática. */\nexport function phoneColumn<T>(\n  field: keyof T | string,\n  headerName: string = \"Telefone\",\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return { field, headerName, type: \"phone\", ...overrides };\n}\n\n/** Coluna de data — Calendar picker no filter, formato pt-BR no display. */\nexport function dateColumn<T>(\n  field: keyof T | string,\n  headerName: string,\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return { field, headerName, type: \"date\", sortable: true, ...overrides };\n}\n\n/** Coluna de status — Chip colorido via `filterOptions: [{ value, label, color }]`. */\nexport function statusColumn<T>(\n  field: keyof T | string,\n  headerName: string,\n  options: Array<{ value: string | number; label: string; color?: string }>,\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return {\n    field,\n    headerName,\n    type: \"status\",\n    filterType: \"select\",\n    filterOptions: options,\n    enableColumnFilter: true,\n    ...overrides,\n  };\n}\n\n/** Coluna de actions — pinned right, sem sort/resize, auto-renderiza dropdown. */\nexport function actionColumn<T>(opts: {\n  getActions: (params: { row: T }) => DataTableActionItem<T>[];\n  width?: number;\n}): DataTableColumnDef<T> {\n  return {\n    field: \"_actions\",\n    headerName: \"\",\n    type: \"actions\",\n    width: opts.width ?? 120,\n    pinned: \"right\",\n    getActions: opts.getActions,\n  };\n}\n\n/** Coluna custom — render livre. Atalho pra quando consumer quer override total. */\nexport function customColumn<T>(\n  field: keyof T | string,\n  headerName: string,\n  render: (params: { row: T; value: unknown }) => ReactNode,\n  overrides?: CommonOverrides<T>,\n): DataTableColumnDef<T> {\n  return { field, headerName, render, ...overrides };\n}\n","import { tv } from \"@/utils/tv\";\r\n\r\n/**\r\n * Slots tv() pro <Modal>.\r\n *\r\n * Estrutura visual idêntica ao TblViewsModal do sandbox (/design-and-table-v2):\r\n *   header (icon + title + sub)  →  body livre (children)  →  footer (actions)\r\n *\r\n * Valores fora da escala DS (gaps 14/18/3px, padding 22px, fonts 12.5/13.5/17px)\r\n * são arbitrary literal — calibração visual exata do sandbox. Onde o token\r\n * semantico bate (form-lg=40, form-md=36, radius-lg=10, pad-4xl=24), usar token.\r\n */\r\n\r\n/* ── Dialog container ────────────────────────────────────────────── */\r\n\r\nexport const dialog = tv({\r\n  base: [\r\n    // Override do DialogContent default (grid + p-pad-4xl + rounded-radius-base + shadow-sh-xl)\r\n    \"!gap-0 !p-0\",\r\n    \"border border-border-default\",\r\n    \"!rounded-radius-2xl !shadow-sh-2xl\",\r\n    \"outline-float\",\r\n    \"flex flex-col overflow-hidden\",\r\n    \"w-[calc(100%-32px)]\",\r\n  ],\r\n  variants: {\r\n    size: {\r\n      sm: \"!max-w-[440px]\",\r\n      md: \"!max-w-[540px]\",\r\n      lg: \"!max-w-[720px]\",\r\n    },\r\n  },\r\n  defaultVariants: { size: \"md\" },\r\n});\r\n\r\n/* ── Close button (X) ────────────────────────────────────────────── */\r\n\r\nexport const closeBtn = tv({\r\n  base: [\r\n    \"absolute top-[14px] right-[14px] z-[1]\",\r\n    \"grid place-items-center size-[28px]\",\r\n    \"rounded-radius-md bg-transparent border-0 cursor-pointer\",\r\n    \"text-fg-muted opacity-55\",\r\n    \"transition-[background-color,color,opacity] duration-150\",\r\n    \"hover:bg-bg-muted hover:text-fg-default hover:opacity-100\",\r\n    \"focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring-brand\",\r\n    \"dark:hover:bg-bg-muted-hover\",\r\n  ],\r\n});\r\n\r\n/* ── Header (icon + title + description) ─────────────────────────── */\r\n\r\nexport const head = tv({\r\n  base: [\r\n    \"flex items-center gap-[14px]\",\r\n    \"px-pad-4xl pt-pad-4xl pb-pad-3xl\",   // 24/24/20\r\n    \"border-b border-border-default\",\r\n  ],\r\n  variants: {\r\n    // Sem icon — alinha texto à esquerda direto\r\n    withIcon: { false: \"\", true: \"\" },\r\n  },\r\n});\r\n\r\nexport const headIcon = tv({\r\n  base: [\r\n    \"shrink-0 grid place-items-center size-form-lg\",   // 40×40\r\n    \"bg-bg-muted border border-border-input rounded-radius-lg\",   // radius-lg=10px\r\n    \"text-fg-default\",\r\n    \"dark:bg-bg-accent dark:border-border-subtle\",\r\n  ],\r\n});\r\n\r\nexport const headTitleWrap = tv({\r\n  base: [\r\n    \"flex-1 min-w-0\",\r\n    \"flex flex-col justify-center\",   // centraliza title+description verticalmente vs icon (40px) à esquerda\r\n    \"pr-pad-3xl\",                      // reserva espaço pro X close (right-14 + 28px) — evita overlap\r\n  ],\r\n});\r\n\r\nexport const title = tv({\r\n  base: [\r\n    \"m-0 mb-[2px]\",\r\n    \"text-body-lg font-bold leading-[1.3]\",\r\n    \"text-fg-default\",\r\n    \"tracking-[-0.01em]\",\r\n  ],\r\n});\r\n\r\nexport const description = tv({\r\n  base: \"m-0 text-body-xs font-normal text-fg-muted leading-[1.45]\",\r\n});\r\n\r\n/* ── Body (children livre) ───────────────────────────────────────── */\r\n\r\nexport const body = tv({\r\n  base: \"flex flex-col gap-[18px] px-pad-4xl py-[22px]\",\r\n});\r\n\r\n/* ── Footer ──────────────────────────────────────────────────────── */\r\n/**\r\n * Default: justify-end (todos os botões à direita).\r\n * Com tertiary: justify-between (tertiary à esquerda, secondary+primary à direita).\r\n */\r\nexport const foot = tv({\r\n  base: [\r\n    \"flex items-center gap-gp-lg\",        // gap 10px\r\n    \"px-pad-4xl pt-pad-md pb-[22px]\",     // 24/8/22\r\n  ],\r\n  variants: {\r\n    layout: {\r\n      end:     \"justify-end\",\r\n      between: \"justify-between\",\r\n    },\r\n  },\r\n  defaultVariants: { layout: \"end\" },\r\n});\r\n\r\n/** Grupo da direita do footer (secondary + primary) quando há tertiary à esquerda. */\r\nexport const footRight = tv({\r\n  base: \"flex items-center gap-gp-lg\",\r\n});\r\n","import type { ReactNode } from \"react\";\nimport { X } from \"lucide-react\";\nimport { Dialog, DialogContent, DialogClose } from \"../../shadcn/dialog\";\nimport { Button } from \"../Button/button\";\nimport {\n  dialog,\n  closeBtn,\n  head,\n  headIcon,\n  headTitleWrap,\n  title as titleStyles,\n  description as descStyles,\n  body,\n  foot,\n  footRight,\n} from \"./modal.styles\";\n\n/* ─────────────────────────────────────────────────────────────────\n * Types\n * ───────────────────────────────────────────────────────────────── */\n\nexport type ModalSize = \"sm\" | \"md\" | \"lg\";\n\nexport type ModalAction = {\n  /** Texto do botão. */\n  label: ReactNode;\n  /** Callback do click. */\n  onClick?: () => void;\n  /** Estado disabled. */\n  disabled?: boolean;\n  /** Loading com spinner (usa o do <Button>). */\n  loading?: boolean;\n  /** Quando true, pinta o botão com cor critical (destrutivo). */\n  danger?: boolean;\n};\n\nexport type ModalProps = {\n  /** Controlled open. */\n  open: boolean;\n  /** Callback quando o modal pede pra fechar (X, ESC, overlay click, ou ação). */\n  onClose: () => void;\n\n  /* ── Header (tudo opcional) ───────────────────────────────────── */\n  /**\n   * Ícone do header — renderizado dentro de um container 40×40 à esquerda.\n   * Passe o lucide pronto com `className=\"size-icon-md\"` e `strokeWidth={1.7}`.\n   * Quando ausente, o header não tem icon container (texto começa à esquerda).\n   */\n  icon?: ReactNode;\n  /** Título principal — 17px / 700. */\n  title?: ReactNode;\n  /** Descrição/subtítulo — 12.5px / fg-muted. */\n  description?: ReactNode;\n\n  /* ── Body ─────────────────────────────────────────────────────── */\n  /** Conteúdo do body — flex-col com gap 18px entre filhos. */\n  children?: ReactNode;\n\n  /* ── Footer: modo estruturado ────────────────────────────────── */\n  /**\n   * Ação primária — botão filled (default brand, critical quando `danger`).\n   * Fica sempre na ponta direita do footer.\n   */\n  primaryAction?: ModalAction;\n  /**\n   * Ação secundária — botão outline secondary.\n   * Default label \"Cancelar\". Default onClick = onClose.\n   */\n  secondaryAction?: ModalAction;\n  /**\n   * Ação terciária — opcional. Quando presente, vai pra ESQUERDA do footer\n   * (justify-between). Use pra ações destrutivas (delete) ou neutras (ajuda).\n   * Estilo: ghost critical quando `danger`, ghost secondary caso contrário.\n   */\n  tertiaryAction?: ModalAction;\n\n  /* ── Footer: modo override (escape hatch) ────────────────────── */\n  /**\n   * Se passado, substitui inteiramente as 3 actions estruturadas.\n   * Use quando precisar de layout custom (links, multi-step indicator, etc).\n   */\n  footer?: ReactNode;\n\n  /* ── Visual ───────────────────────────────────────────────────── */\n  /**\n   * Largura máxima do modal:\n   *   - sm: 440px\n   *   - md: 540px (default — match TblViewsModal sandbox)\n   *   - lg: 720px\n   */\n  size?: ModalSize;\n\n  /** Esconde o X de fechar no canto superior direito. */\n  hideClose?: boolean;\n  /** Click no overlay fecha o modal. Default true (comportamento padrão Dialog). */\n  closeOnOverlay?: boolean;\n\n  /** ClassName extra no DialogContent (root). */\n  className?: string;\n};\n\n/* ─────────────────────────────────────────────────────────────────\n * Component\n * ───────────────────────────────────────────────────────────────── */\n\n/**\n * Modal — composto sobre o `<Dialog>` (shadcn) com estrutura de header rico\n * (icon + título + descrição), body livre via children, e footer flexível\n * (até 3 actions estruturadas OU footer custom via slot).\n *\n * Visual alinhado com o `TblViewsModal` do sandbox `/design-and-table-v2`:\n * dialog 540px (md), header com feature-icon 40×40, footer com botões DS.\n *\n * Quando precisar de modal de confirmação destrutiva simples, use `<AlertModal>`.\n */\nexport function Modal({\n  open,\n  onClose,\n  icon,\n  title,\n  description,\n  children,\n  primaryAction,\n  secondaryAction,\n  tertiaryAction,\n  footer,\n  size = \"md\",\n  hideClose = false,\n  closeOnOverlay = true,\n  className,\n}: ModalProps) {\n  const hasHeader = Boolean(icon || title || description);\n  const hasStructuredFooter = Boolean(primaryAction || secondaryAction || tertiaryAction);\n  const showFooter = Boolean(footer) || hasStructuredFooter;\n\n  const handleOpenChange = (next: boolean) => {\n    if (next) return;\n    // Quando closeOnOverlay=false, ignora fechamento por overlay/ESC\n    // (Radix dispara onOpenChange em ambos os casos; aqui simplificamos:\n    // se você quer prevenir, controle externamente).\n    if (!closeOnOverlay) return;\n    onClose();\n  };\n\n  return (\n    <Dialog open={open} onOpenChange={handleOpenChange}>\n      <DialogContent\n        className={dialog({ size, className })}\n        hideClose\n        aria-labelledby={title ? \"modal-title\" : undefined}\n        aria-describedby={description ? \"modal-description\" : undefined}\n      >\n        {!hideClose && (\n          <DialogClose className={closeBtn()} aria-label=\"Fechar\">\n            <X className=\"size-icon-sm\" />\n          </DialogClose>\n        )}\n\n        {hasHeader && (\n          <header className={head()}>\n            {icon && (\n              <span className={headIcon()} aria-hidden=\"true\">\n                {icon}\n              </span>\n            )}\n            {(title || description) && (\n              <div className={headTitleWrap()}>\n                {title && (\n                  <h3 id=\"modal-title\" className={titleStyles()}>\n                    {title}\n                  </h3>\n                )}\n                {description && (\n                  <p id=\"modal-description\" className={descStyles()}>\n                    {description}\n                  </p>\n                )}\n              </div>\n            )}\n          </header>\n        )}\n\n        {children !== undefined && children !== null && (\n          <div className={body()}>{children}</div>\n        )}\n\n        {showFooter && (\n          <footer\n            className={foot({\n              layout: tertiaryAction ? \"between\" : \"end\",\n            })}\n          >\n            {footer ?? <StructuredActions\n              primary={primaryAction}\n              secondary={secondaryAction}\n              tertiary={tertiaryAction}\n              onClose={onClose}\n            />}\n          </footer>\n        )}\n      </DialogContent>\n    </Dialog>\n  );\n}\n\n/* ─────────────────────────────────────────────────────────────────\n * Internal — footer estruturado (a partir das 3 actions)\n * ───────────────────────────────────────────────────────────────── */\n\nfunction StructuredActions({\n  primary,\n  secondary,\n  tertiary,\n  onClose,\n}: {\n  primary?: ModalAction;\n  secondary?: ModalAction;\n  tertiary?: ModalAction;\n  onClose: () => void;\n}) {\n  // Sem tertiary → 1 grupo só (justify-end pelo container).\n  // Com tertiary → 2 grupos (tertiary | secondary+primary), justify-between.\n\n  const renderTertiary = tertiary && (\n    <Button\n      color={tertiary.danger ? \"critical\" : \"secondary\"}\n      variant=\"ghost\"\n      size=\"md\"\n      onClick={tertiary.onClick}\n      disabled={tertiary.disabled}\n      loading={tertiary.loading}\n    >\n      {tertiary.label}\n    </Button>\n  );\n\n  const renderSecondary = secondary && (\n    <Button\n      color=\"secondary\"\n      variant=\"outline\"\n      size=\"md\"\n      onClick={secondary.onClick ?? onClose}\n      disabled={secondary.disabled}\n      loading={secondary.loading}\n    >\n      {secondary.label}\n    </Button>\n  );\n\n  const renderPrimary = primary && (\n    <Button\n      color={primary.danger ? \"critical\" : \"primary\"}\n      variant=\"filled\"\n      size=\"md\"\n      onClick={primary.onClick}\n      disabled={primary.disabled}\n      loading={primary.loading}\n    >\n      {primary.label}\n    </Button>\n  );\n\n  if (tertiary) {\n    return (\n      <>\n        {renderTertiary}\n        <div className={footRight()}>\n          {renderSecondary}\n          {renderPrimary}\n        </div>\n      </>\n    );\n  }\n\n  return (\n    <>\n      {renderSecondary}\n      {renderPrimary}\n    </>\n  );\n}\n","import type { LucideIcon } from \"lucide-react\";\nimport {\n  Hash, User, AtSign, Phone, CheckCircle2, Tag,\n  Users, DollarSign, Calendar, Type,\n} from \"lucide-react\";\n\n/* ── Colunas (idêntico ao sandbox `/design-and-table-v2`) ──────────── */\n\nexport type TabelaCol = {\n  key: string;\n  type: \"select\" | \"id\" | \"person\" | \"email\" | \"phone\" | \"status\" | \"category\" | \"agent\" | \"currency\" | \"date\" | \"text\" | \"actions\";\n  label?: string;\n  icon?: LucideIcon;\n  width?: number;\n  minWidth?: number;\n  sorted?: boolean;\n};\n\nexport const COLUMNS: TabelaCol[] = [\n  { key: \"select\",      width: 44,                              type: \"select\"   },\n  { key: \"id\",          width: 120,    label: \"ID\",             type: \"id\",       icon: Hash },\n  { key: \"name\",        minWidth: 220, label: \"Nome\",           type: \"person\",   icon: User, sorted: true },\n  { key: \"email\",       minWidth: 240, label: \"Email\",          type: \"email\",    icon: AtSign },\n  { key: \"phone\",       minWidth: 170, label: \"Telefone\",       type: \"phone\",    icon: Phone },\n  { key: \"status\",      minWidth: 140, label: \"Status\",         type: \"status\",   icon: CheckCircle2 },\n  { key: \"category\",    minWidth: 130, label: \"Categoria\",      type: \"category\", icon: Tag },\n  { key: \"agent\",       minWidth: 170, label: \"Atribuído\",      type: \"agent\",    icon: Users },\n  { key: \"value\",       width: 130,    label: \"Valor\",          type: \"currency\", icon: DollarSign },\n  { key: \"createdAt\",   width: 130,    label: \"Criado em\",      type: \"date\",     icon: Calendar },\n  { key: \"lastContact\", width: 150,    label: \"Último contato\", type: \"date\",     icon: Calendar },\n  { key: \"location\",    minWidth: 150, label: \"Localização\",    type: \"text\",     icon: Type },\n  { key: \"actions\",     width: 44,                              type: \"actions\"  },\n];\n\nexport function getColCellStyle(col: TabelaCol): React.CSSProperties {\n  if (col.width)    return { width: col.width,       flex: `0 0 ${col.width}px` };\n  if (col.minWidth) return { minWidth: col.minWidth, flex: `1 0 ${col.minWidth}px` };\n  return {};\n}\n\n/* ── Lookups (statuses/categorias/agentes) ─────────────────────────── */\n\nexport const STATUSES = {\n  active:   { label: \"Ativo\",    color: \"var(--color-fg-success)\" },\n  pending:  { label: \"Pendente\", color: \"var(--color-fg-warning)\" },\n  paused:   { label: \"Pausado\",  color: \"var(--color-fg-info)\" },\n  inactive: { label: \"Inativo\",  color: \"var(--color-fg-muted)\" },\n} as const;\n\nexport const CATEGORIES = {\n  royal:      { label: \"Royal\",      kind: \"warning\" as const },\n  licenciado: { label: \"Licenciado\", kind: \"info\"    as const },\n  lead:       { label: \"Lead\",       kind: \"success\" as const },\n};\n\nexport const AGENTS = {\n  you:    { name: \"Você\",         initials: \"VC\", color: \"#0a3a2e\" },\n  aline:  { name: \"Aline Castro\", initials: \"AC\", color: \"#f59e0b\" },\n  carlos: { name: \"Carlos Souza\", initials: \"CS\", color: \"#8754ec\" },\n  maria:  { name: \"Maria Lima\",   initials: \"ML\", color: \"#ef4444\" },\n} as const;\n\n/* ── Mock data (10 rows determinísticas) ───────────────────────────── */\n\nexport type TabelaRow = {\n  id: string;\n  name: string;\n  initials: string;\n  avatarColor: string;\n  email: string;\n  phone: string;\n  statusId: keyof typeof STATUSES;\n  categoryId: keyof typeof CATEGORIES;\n  location: string;\n  value: number;\n  agentId: keyof typeof AGENTS;\n  createdAt: number;\n  lastContact: number;\n};\n\nconst BASE_DATE = new Date(\"2026-04-15T12:00:00Z\").getTime();\nconst DAY_MS = 86400000;\n\nconst ROWS_BASE: TabelaRow[] = [\n  { id: \"CLI-2401\", name: \"Maria Silva\",     initials: \"MS\", avatarColor: \"#f59e0b\", email: \"maria.silva@example.com\",     phone: \"+55 11 91234-5678\", statusId: \"active\",   categoryId: \"royal\",      location: \"São Paulo, SP\",      value: 4800,  agentId: \"you\",    createdAt: BASE_DATE - 65 * DAY_MS, lastContact: BASE_DATE - 2 * DAY_MS  },\n  { id: \"CLI-2402\", name: \"João Santos\",     initials: \"JS\", avatarColor: \"#0a3a2e\", email: \"joao.santos@example.com\",     phone: \"+55 11 92345-6789\", statusId: \"pending\",  categoryId: \"licenciado\", location: \"Rio de Janeiro, RJ\", value: 12300, agentId: \"aline\",  createdAt: BASE_DATE - 58 * DAY_MS, lastContact: BASE_DATE - 5 * DAY_MS  },\n  { id: \"CLI-2403\", name: \"Carlos Oliveira\", initials: \"CO\", avatarColor: \"#8754ec\", email: \"carlos.oliveira@example.com\", phone: \"+55 11 93456-7890\", statusId: \"active\",   categoryId: \"lead\",       location: \"Belo Horizonte, MG\", value: 2150,  agentId: \"carlos\", createdAt: BASE_DATE - 51 * DAY_MS, lastContact: BASE_DATE - 1 * DAY_MS  },\n  { id: \"CLI-2404\", name: \"Ana Costa\",       initials: \"AC\", avatarColor: \"#1cb280\", email: \"ana.costa@example.com\",       phone: \"+55 11 94567-8901\", statusId: \"paused\",   categoryId: \"royal\",      location: \"Porto Alegre, RS\",   value: 8900,  agentId: \"maria\",  createdAt: BASE_DATE - 44 * DAY_MS, lastContact: BASE_DATE - 12 * DAY_MS },\n  { id: \"CLI-2405\", name: \"Pedro Pereira\",   initials: \"PP\", avatarColor: \"#ef4444\", email: \"pedro.pereira@example.com\",   phone: \"+55 11 95678-9012\", statusId: \"inactive\", categoryId: \"lead\",       location: \"Curitiba, PR\",       value: 1100,  agentId: \"you\",    createdAt: BASE_DATE - 37 * DAY_MS, lastContact: BASE_DATE - 30 * DAY_MS },\n  { id: \"CLI-2406\", name: \"Lúcia Almeida\",   initials: \"LA\", avatarColor: \"#f9a47a\", email: \"lucia.almeida@example.com\",   phone: \"+55 11 96789-0123\", statusId: \"active\",   categoryId: \"licenciado\", location: \"Recife, PE\",         value: 6750,  agentId: \"aline\",  createdAt: BASE_DATE - 30 * DAY_MS, lastContact: BASE_DATE - 3 * DAY_MS  },\n  { id: \"CLI-2407\", name: \"Roberto Souza\",   initials: \"RS\", avatarColor: \"#0088cc\", email: \"roberto.souza@example.com\",   phone: \"+55 11 97890-1234\", statusId: \"pending\",  categoryId: \"royal\",      location: \"São Paulo, SP\",      value: 15200, agentId: \"carlos\", createdAt: BASE_DATE - 23 * DAY_MS, lastContact: BASE_DATE - 7 * DAY_MS  },\n  { id: \"CLI-2408\", name: \"Fernanda Lima\",   initials: \"FL\", avatarColor: \"#e1306c\", email: \"fernanda.lima@example.com\",   phone: \"+55 11 98901-2345\", statusId: \"active\",   categoryId: \"lead\",       location: \"Rio de Janeiro, RJ\", value: 3400,  agentId: \"maria\",  createdAt: BASE_DATE - 16 * DAY_MS, lastContact: BASE_DATE - 1 * DAY_MS  },\n  { id: \"CLI-2409\", name: \"Bruno Rodrigues\", initials: \"BR\", avatarColor: \"#70c748\", email: \"bruno.rodrigues@example.com\", phone: \"+55 11 99012-3456\", statusId: \"paused\",   categoryId: \"licenciado\", location: \"Belo Horizonte, MG\", value: 5600,  agentId: \"you\",    createdAt: BASE_DATE - 9 * DAY_MS,  lastContact: BASE_DATE - 6 * DAY_MS  },\n  { id: \"CLI-2410\", name: \"Camila Ribeiro\",  initials: \"CR\", avatarColor: \"#8754ec\", email: \"camila.ribeiro@example.com\",  phone: \"+55 11 90123-4567\", statusId: \"active\",   categoryId: \"royal\",      location: \"Porto Alegre, RS\",   value: 9800,  agentId: \"aline\",  createdAt: BASE_DATE - 2 * DAY_MS,  lastContact: BASE_DATE                },\n];\n\n/** Sufixos pra gerar variações nos clones (mantém aparência de dataset real) */\nconst NAME_SUFFIXES = [\"\", \" Jr\", \" Filho\", \" Neto\", \" II\"];\nconst CITY_OVERRIDES = [\"Salvador, BA\", \"Fortaleza, CE\", \"Manaus, AM\", \"Brasília, DF\", \"Vitória, ES\"];\n\n/**\n * Dataset estendido — 50 rows.\n * 5 ciclos de ROWS_BASE com IDs sequenciais (CLI-2401 → CLI-2450) e pequenas\n * variações em nome/cidade/valor pra dar a sensação de dataset real.\n */\nexport const ROWS_MOCK: TabelaRow[] = Array.from({ length: 50 }, (_, i) => {\n  const base = ROWS_BASE[i % ROWS_BASE.length];\n  const cycle = Math.floor(i / ROWS_BASE.length); // 0..4\n  const seq = 2401 + i;\n  const nameSuffix = NAME_SUFFIXES[cycle];\n  return {\n    ...base,\n    id: `CLI-${seq}`,\n    name: `${base.name}${nameSuffix}`,\n    location: cycle === 0 ? base.location : CITY_OVERRIDES[cycle - 1] ?? base.location,\n    value: base.value + cycle * 175,\n    createdAt: base.createdAt - cycle * 7 * DAY_MS,\n    lastContact: base.lastContact - cycle * 3 * DAY_MS,\n  };\n});\n\n/* ── Formatters ─────────────────────────────────────────────────────── */\n\nexport function formatCurrency(value: number) {\n  return value.toLocaleString(\"pt-BR\", { style: \"currency\", currency: \"BRL\", minimumFractionDigits: 2 });\n}\n\nconst MONTHS_SHORT = [\"jan\", \"fev\", \"mar\", \"abr\", \"mai\", \"jun\", \"jul\", \"ago\", \"set\", \"out\", \"nov\", \"dez\"];\nexport function formatDateShort(value: number) {\n  if (!value) return \"—\";\n  const d = new Date(value);\n  const day = d.getDate().toString().padStart(2, \"0\");\n  return `${day} de ${MONTHS_SHORT[d.getMonth()]}`;\n}\n","import { tv } from \"@/utils/tv\";\r\n\r\n/**\r\n * TabelaTeste — réplica visual da tabela do sandbox /design-and-table-v2.\r\n *\r\n * Componente de referência hardcoded: sem props, sem variants, sem flexibility.\r\n * Serve pra fixar como tokens DS mapeiam pra esse visual específico — outros\r\n * componentes (Table) podem usar essas classes como guia.\r\n *\r\n * Os estilos abaixo são literais — cada key corresponde a uma classe do\r\n * sandbox. Densidade default = comfortable (56px), cellBorders ON.\r\n */\r\n\r\nexport const tabelaStyles = {\r\n  /* ── Wrap (container externo) ─────────────────────────────────────── */\r\n  wrap: tv({\r\n    base: [\r\n      \"flex-1 overflow-auto min-h-0\",\r\n      \"bg-bg-table border border-border-table rounded-radius-xl\",\r\n      \"scrollbar-default\",\r\n    ],\r\n  }),\r\n\r\n  /* tbl-table — inner container, min-width: max-content pra scroll horizontal */\r\n  table: tv({\r\n    base: \"block min-w-max\",\r\n  }),\r\n\r\n  /* ── Head ─────────────────────────────────────────────────────────── */\r\n  thead: tv({\r\n    base: [\r\n      \"sticky top-0 z-[5]\",\r\n      \"bg-bg-table-head\",\r\n      \"border-b border-border-table\",\r\n    ],\r\n  }),\r\n\r\n  trHead: tv({\r\n    base: \"flex bg-bg-table-head\",\r\n  }),\r\n\r\n  /* tbl-th base — 42px sempre, padding-right reserva espaço pro menu absoluto */\r\n  th: tv({\r\n    base: [\r\n      \"relative flex items-center gap-gp-sm\",\r\n      \"py-0 pl-[14px] pr-[38px]\",\r\n      \"h-[42px] text-body-sm font-semibold leading-none\",\r\n      \"text-fg-muted cursor-pointer select-none\",\r\n      \"[flex:1_0_auto]\",\r\n      \"hover:text-fg-default\",\r\n      // hover do th faz menu aparecer (ver thMenu)\r\n      // hover do th faz sort-hint aparecer (ver sortHint)\r\n    ],\r\n    variants: {\r\n      sorted: { true: \"text-fg-default\" },\r\n    },\r\n    defaultVariants: { sorted: false },\r\n  }),\r\n\r\n  /* Coluna select — 44px, sem hover, justify-center, sem padding right pro menu */\r\n  thSelect: tv({\r\n    base: [\r\n      \"relative flex items-center justify-center\",\r\n      \"w-[44px] [flex:0_0_44px] px-[12px] py-0\",\r\n      \"h-[42px] cursor-default select-none\",\r\n      \"bg-bg-table-head\",\r\n    ],\r\n  }),\r\n\r\n  /* Coluna actions — 44px sticky right */\r\n  thActions: tv({\r\n    base: [\r\n      \"relative flex items-center justify-center\",\r\n      \"w-[44px] [flex:0_0_44px] p-0\",\r\n      \"h-[42px] cursor-default select-none\",\r\n      \"sticky right-0 z-[3]\",\r\n      \"bg-bg-table-head\",\r\n    ],\r\n  }),\r\n\r\n  /* Label da coluna — elipsa */\r\n  thLabel: tv({\r\n    base: \"flex-1 min-w-0 whitespace-nowrap overflow-hidden text-ellipsis text-left\",\r\n  }),\r\n\r\n  /* Ícone de tipo — opacity 0.7 rest, 1 no hover do th OU quando sorted */\r\n  thTypeIcon: tv({\r\n    base: [\r\n      \"shrink-0 size-[13px] text-fg-muted opacity-70\",\r\n      \"group-hover/th:opacity-100\",\r\n    ],\r\n    variants: {\r\n      sorted: { true: \"opacity-100\" },\r\n    },\r\n    defaultVariants: { sorted: false },\r\n  }),\r\n\r\n  /* Sort badge \"1\" (chip brand) + arrow */\r\n  thSort: tv({\r\n    base: \"inline-flex items-center gap-[4px] shrink-0 text-fg-default\",\r\n  }),\r\n  thSortIndex: tv({\r\n    base: [\r\n      \"grid place-items-center\",\r\n      \"min-w-[18px] h-[18px] px-[5px]\",\r\n      \"rounded-radius-sm\",\r\n      \"bg-bg-brand text-fg-on-brand\",\r\n      \"text-caption-xs font-bold leading-none\",\r\n      \"[font-variant-numeric:tabular-nums]\",\r\n    ],\r\n  }),\r\n\r\n  /* Hint atenuado em hover de col não-sorted (sinaliza clicável) */\r\n  thSortHint: tv({\r\n    base: [\r\n      \"inline-flex items-center shrink-0 text-fg-muted\",\r\n      \"opacity-0 transition-opacity duration-150\",\r\n      \"group-hover/th:opacity-50\",\r\n    ],\r\n  }),\r\n\r\n  /* Menu \"...\" absolute, aparece só no hover */\r\n  thMenu: tv({\r\n    base: [\r\n      \"absolute right-[6px] top-1/2 -translate-y-1/2 z-[1]\",\r\n      \"grid place-items-center size-[28px]\",\r\n      \"border-0 bg-transparent text-fg-muted rounded-radius-md cursor-pointer\",\r\n      \"opacity-0 transition-all duration-150\",\r\n      \"group-hover/th:opacity-100\",\r\n      \"hover:bg-bg-muted hover:text-fg-default\",\r\n    ],\r\n  }),\r\n\r\n  /* Resize handle (6px) — linha que vira brand e projeta pra baixo no hover */\r\n  thResize: tv({\r\n    base: [\r\n      \"absolute right-0 top-0 bottom-0 w-[6px] z-[2]\",\r\n      \"bg-transparent cursor-col-resize\",\r\n      // ::before linha vertical dentro do header\r\n      \"before:content-[''] before:absolute before:left-1/2 before:-translate-x-1/2\",\r\n      \"before:top-[8px] before:bottom-[8px] before:w-px before:bg-transparent\",\r\n      \"before:transition-all before:duration-150\",\r\n      \"group-hover/th:before:bg-fg-muted\",\r\n      // hover direto no handle → brand 2px + altura total\r\n      \"hover:before:bg-bg-brand hover:before:w-[2px] hover:before:top-0 hover:before:bottom-0\",\r\n      // ::after projeção 100vh pra baixo cobrindo body\r\n      \"after:content-[''] after:absolute after:left-1/2 after:-translate-x-1/2\",\r\n      \"after:top-full after:w-[2px] after:h-screen after:bg-transparent after:pointer-events-none\",\r\n      \"after:transition-colors after:duration-150\",\r\n      \"hover:after:bg-bg-brand\",\r\n    ],\r\n  }),\r\n\r\n  /* ── Body ─────────────────────────────────────────────────────────── */\r\n  tbody: tv({\r\n    base: \"bg-bg-surface\",\r\n  }),\r\n\r\n  /* tbl-tr — flex row, altura por densidade. Default comfortable (56px). */\r\n  tr: tv({\r\n    base: [\r\n      \"relative flex\",\r\n      \"border-b border-border-table bg-bg-surface\",\r\n      \"cursor-pointer transition-colors duration-150\",\r\n      \"hover:bg-bg-table-row-hover\",\r\n      \"focus-visible:outline-2 focus-visible:outline-bg-brand focus-visible:-outline-offset-2\",\r\n    ],\r\n    variants: {\r\n      density: {\r\n        compact:     \"h-[40px]\",\r\n        comfortable: \"h-[56px]\",\r\n        spacious:    \"h-[64px]\",\r\n      },\r\n      // Selected (checkbox) e Open (detail panel) — mesmo visual brand-tinted\r\n      // + strip lateral 3px brand via ::before\r\n      selected: {\r\n        true: [\r\n          \"bg-bg-table-row-selected hover:bg-bg-table-row-selected-hover\",\r\n          \"before:content-[''] before:absolute before:left-0 before:top-0 before:bottom-0\",\r\n          \"before:w-[3px] before:bg-bg-brand before:z-[5] before:pointer-events-none\",\r\n        ].join(\" \"),\r\n      },\r\n    },\r\n    defaultVariants: { density: \"comfortable\", selected: false },\r\n  }),\r\n\r\n  /* Cells base — height/font-size variam por densidade */\r\n  td: tv({\r\n    base: [\r\n      \"flex items-center px-[14px] py-0\",\r\n      \"text-fg-default\",\r\n      \"[flex:1_0_auto] overflow-hidden whitespace-nowrap\",\r\n    ],\r\n    variants: {\r\n      density: {\r\n        compact:     \"h-[40px] text-body-xs font-normal\",\r\n        comfortable: \"h-[56px] text-body-sm font-normal\",\r\n        spacious:    \"h-[64px] text-body-sm font-normal\",\r\n      },\r\n    },\r\n    defaultVariants: { density: \"comfortable\" },\r\n  }),\r\n\r\n  tdSelect: tv({\r\n    base: [\r\n      \"flex items-center justify-center\",\r\n      \"w-[44px] [flex:0_0_44px] px-[12px] py-0\",\r\n    ],\r\n    variants: {\r\n      density: {\r\n        compact:     \"h-[40px]\",\r\n        comfortable: \"h-[56px]\",\r\n        spacious:    \"h-[64px]\",\r\n      },\r\n    },\r\n    defaultVariants: { density: \"comfortable\" },\r\n  }),\r\n\r\n  /* tdActions — sticky right, bg adapta ao estado da row */\r\n  tdActions: tv({\r\n    base: [\r\n      \"flex items-center justify-center\",\r\n      \"w-[44px] [flex:0_0_44px] p-0\",\r\n      \"sticky right-0 z-[2]\",\r\n      \"bg-bg-surface\",\r\n      // bg adapta ao estado da row pai\r\n      \"group-hover/tr:bg-bg-table-row-hover\",\r\n    ],\r\n    variants: {\r\n      density: {\r\n        compact:     \"h-[40px]\",\r\n        comfortable: \"h-[56px]\",\r\n        spacious:    \"h-[64px]\",\r\n      },\r\n      selected: {\r\n        true: \"!bg-bg-table-row-selected group-hover/tr:!bg-bg-table-row-selected-hover\",\r\n      },\r\n    },\r\n    defaultVariants: { density: \"comfortable\", selected: false },\r\n  }),\r\n\r\n  /* Botão \"...\" da row — opacity 0 → 1 no hover */\r\n  rowMenuBtn: tv({\r\n    base: [\r\n      \"grid place-items-center size-[28px]\",\r\n      \"border-0 bg-transparent text-fg-muted rounded-radius-md cursor-pointer\",\r\n      \"opacity-0 transition-all duration-150\",\r\n      \"group-hover/tr:opacity-100\",\r\n      \"hover:bg-bg-muted hover:text-fg-default\",\r\n    ],\r\n  }),\r\n\r\n  /* ── Cell borders verticais (sempre on neste componente) ──────────── */\r\n  cellBorderTh: tv({\r\n    base: \"border-r border-border-table\",\r\n  }),\r\n  cellBorderTd: tv({\r\n    base: \"border-r border-border-table\",\r\n  }),\r\n\r\n  /* ── Cells específicas ────────────────────────────────────────────── */\r\n  cellId: tv({\r\n    base: \"text-body-sm font-normal text-fg-muted [font-variant-numeric:tabular-nums]\",\r\n  }),\r\n  cellCurrency: tv({\r\n    base: \"[font-variant-numeric:tabular-nums] font-semibold\",\r\n  }),\r\n  cellDate: tv({\r\n    base: \"[font-variant-numeric:tabular-nums] text-fg-muted\",\r\n  }),\r\n  cellStatus: tv({\r\n    base: \"inline-flex items-center gap-gp-md text-body-sm font-normal text-fg-default dark:text-fg-muted\",\r\n  }),\r\n  dot: tv({\r\n    base: \"size-[8px] rounded-radius-full shrink-0\",\r\n  }),\r\n  cellPerson: tv({\r\n    base: \"inline-flex items-center gap-gp-md whitespace-nowrap overflow-hidden\",\r\n  }),\r\n  cellPersonName: tv({\r\n    base: \"whitespace-nowrap overflow-hidden text-ellipsis font-medium\",\r\n  }),\r\n  cellAgent: tv({\r\n    base: \"inline-flex items-center gap-gp-md whitespace-nowrap overflow-hidden\",\r\n  }),\r\n\r\n  /* Avatar 28px (sm 22px) — bg via inline style (cor por entidade) */\r\n  avatar: tv({\r\n    base: [\r\n      \"grid place-items-center shrink-0\",\r\n      \"size-[28px] rounded-radius-full\",\r\n      \"text-white text-caption-sm font-bold\",\r\n    ],\r\n  }),\r\n  avatarSm: tv({\r\n    base: [\r\n      \"grid place-items-center shrink-0\",\r\n      \"size-[22px] rounded-radius-full\",\r\n      \"text-white text-caption-xs font-bold\",\r\n    ],\r\n  }),\r\n\r\n  cellLink: tv({\r\n    base: \"text-fg-brand no-underline hover:underline\",\r\n  }),\r\n  cellMuted: tv({\r\n    base: \"text-fg-muted\",\r\n  }),\r\n\r\n  /* ── Checkbox custom (16px com check rotacionado) ─────────────────── */\r\n  checkbox: tv({\r\n    base: [\r\n      \"appearance-none size-[16px] cursor-pointer relative\",\r\n      \"border-[1.5px] border-border-input bg-bg-input rounded-radius-sm\",\r\n      \"transition-[background,border-color] duration-100\",\r\n      \"checked:bg-bg-brand checked:border-border-brand\",\r\n      \"indeterminate:bg-bg-brand indeterminate:border-border-brand\",\r\n      // Check mark via ::after — retângulo rotacionado 45deg\r\n      \"checked:after:content-[''] checked:after:absolute\",\r\n      \"checked:after:left-1/2 checked:after:top-1/2\",\r\n      \"checked:after:w-[4px] checked:after:h-[8px]\",\r\n      \"checked:after:border-solid checked:after:border-fg-on-brand\",\r\n      \"checked:after:[border-width:0_2px_2px_0]\",\r\n      \"checked:after:[transform:translate(-50%,-55%)_rotate(45deg)]\",\r\n      // Barra indeterminate\r\n      \"indeterminate:after:content-[''] indeterminate:after:absolute\",\r\n      \"indeterminate:after:left-1/2 indeterminate:after:top-1/2\",\r\n      \"indeterminate:after:w-[8px] indeterminate:after:h-[2px]\",\r\n      \"indeterminate:after:bg-fg-on-brand indeterminate:after:rounded-[1px]\",\r\n      \"indeterminate:after:[transform:translate(-50%,-50%)]\",\r\n    ],\r\n  }),\r\n\r\n  /* ── Chip de categoria (pílula soft com kind) ─────────────────────── */\r\n  chip: tv({\r\n    base: [\r\n      \"inline-flex items-center gap-[4px]\",\r\n      \"h-[22px] px-[8px] rounded-radius-full\",\r\n      \"text-caption-sm font-semibold leading-none whitespace-nowrap\",\r\n    ],\r\n    variants: {\r\n      kind: {\r\n        success: \"bg-bg-success-muted text-fg-success\",\r\n        warning: \"bg-bg-warning-muted text-fg-warning\",\r\n        info:    \"bg-bg-info-muted    text-fg-info\",\r\n        danger:  \"bg-bg-danger-muted  text-fg-danger\",\r\n      },\r\n    },\r\n    defaultVariants: { kind: \"info\" },\r\n  }),\r\n};\r\n","import { useState } from \"react\";\nimport { ArrowUpDown, MoreHorizontal, MoreVertical } from \"lucide-react\";\nimport {\n  COLUMNS,\n  ROWS_MOCK,\n  STATUSES,\n  CATEGORIES,\n  AGENTS,\n  getColCellStyle,\n  formatCurrency,\n  formatDateShort,\n  type TabelaCol,\n  type TabelaRow,\n} from \"./mock-data\";\nimport { tabelaStyles as s } from \"./tabela-teste.styles\";\n\n/**\n * TabelaTeste — réplica visual da tabela do sandbox `/design-and-table-v2`.\n *\n * Hardcoded por design: sem props além do nada. 13 colunas fixas, 10 rows mock,\n * densidade comfortable, cell-borders on. Toggle de seleção e detail panel\n * (state local).\n *\n * Serve como referência visual fixa pra outros componentes Table do DS — o\n * mapeamento de tokens, espaçamentos e estados está aqui de forma literal.\n */\nexport function TabelaTeste() {\n  const [selectedIds, setSelectedIds] = useState<Set<string>>(new Set());\n  const [openRowId, setOpenRowId] = useState<string | null>(null);\n\n  const allSelected = selectedIds.size === ROWS_MOCK.length;\n  const someSelected = selectedIds.size > 0 && !allSelected;\n\n  const toggleSelect = (id: string) => {\n    setSelectedIds((prev) => {\n      const next = new Set(prev);\n      if (next.has(id)) next.delete(id); else next.add(id);\n      return next;\n    });\n  };\n  const toggleAll = () => {\n    if (selectedIds.size > 0) setSelectedIds(new Set());\n    else setSelectedIds(new Set(ROWS_MOCK.map((r) => r.id)));\n  };\n\n  return (\n    <div\n      role=\"region\"\n      aria-label=\"Tabela de clientes (referência)\"\n      className={s.wrap()}\n    >\n      <div className={s.table()}>\n        {/* HEAD */}\n        <div className={s.thead()} role=\"rowgroup\">\n          <div className={s.trHead()} role=\"row\">\n            {COLUMNS.map((col) => renderHeadCell(col, {\n              allSelected,\n              someSelected,\n              onToggleAll: toggleAll,\n            }))}\n          </div>\n        </div>\n\n        {/* BODY */}\n        <div className={s.tbody()} role=\"rowgroup\">\n          {ROWS_MOCK.map((row) => {\n            const isSelected = selectedIds.has(row.id);\n            const isOpen = openRowId === row.id;\n            const isHighlighted = isSelected || isOpen;\n            return (\n              <div\n                key={row.id}\n                role=\"row\"\n                tabIndex={0}\n                onClick={() => setOpenRowId((cur) => (cur === row.id ? null : row.id))}\n                className={`group/tr ${s.tr({ selected: isHighlighted })}`}\n              >\n                {COLUMNS.map((col) =>\n                  renderBodyCell(col, row, {\n                    isSelected,\n                    isHighlighted,\n                    onToggle: () => toggleSelect(row.id),\n                  })\n                )}\n              </div>\n            );\n          })}\n        </div>\n      </div>\n    </div>\n  );\n}\n\n/* ── Head cell renderer ────────────────────────────────────────────── */\n\nfunction renderHeadCell(\n  col: TabelaCol,\n  ctx: { allSelected: boolean; someSelected: boolean; onToggleAll: () => void },\n) {\n  const cellStyle = getColCellStyle(col);\n\n  if (col.type === \"select\") {\n    return (\n      <div\n        key={col.key}\n        role=\"columnheader\"\n        className={`${s.thSelect()} ${s.cellBorderTh()}`}\n        style={cellStyle}\n      >\n        <input\n          type=\"checkbox\"\n          className={s.checkbox()}\n          checked={ctx.allSelected}\n          ref={(el) => { if (el) el.indeterminate = ctx.someSelected; }}\n          onChange={ctx.onToggleAll}\n          aria-label=\"Selecionar todas\"\n        />\n      </div>\n    );\n  }\n\n  if (col.type === \"actions\") {\n    return (\n      <div\n        key={col.key}\n        role=\"columnheader\"\n        aria-label=\"Ações\"\n        className={s.thActions()}\n        style={cellStyle}\n      />\n    );\n  }\n\n  // Coluna IMEDIATAMENTE antes de actions não tem border-right (visual mais limpo)\n  const isBeforeActions = COLUMNS[COLUMNS.indexOf(col) + 1]?.type === \"actions\";\n  const borderCls = isBeforeActions ? \"\" : s.cellBorderTh();\n\n  const TypeIcon = col.icon;\n  const sorted = Boolean(col.sorted);\n\n  return (\n    <div\n      key={col.key}\n      role=\"columnheader\"\n      style={cellStyle}\n      className={`group/th ${s.th({ sorted })} ${borderCls}`}\n    >\n      {TypeIcon && <TypeIcon strokeWidth={1.7} className={s.thTypeIcon({ sorted })} aria-hidden=\"true\" />}\n      <span className={s.thLabel()}>{col.label}</span>\n      {sorted ? (\n        <span className={s.thSort()}>\n          <span className={s.thSortIndex()}>1</span>\n          <ArrowUpDown size={12} strokeWidth={1.8} />\n        </span>\n      ) : (\n        <span className={s.thSortHint()} aria-hidden>\n          <ArrowUpDown size={11} strokeWidth={1.8} />\n        </span>\n      )}\n      <button\n        type=\"button\"\n        className={s.thMenu()}\n        onClick={(e) => e.stopPropagation()}\n        aria-label={`Menu da coluna ${col.label}`}\n      >\n        <MoreVertical size={15} strokeWidth={1.7} />\n      </button>\n      <span className={s.thResize()} aria-hidden=\"true\" />\n    </div>\n  );\n}\n\n/* ── Body cell renderer ────────────────────────────────────────────── */\n\nfunction renderBodyCell(\n  col: TabelaCol,\n  row: TabelaRow,\n  ctx: { isSelected: boolean; isHighlighted: boolean; onToggle: () => void },\n) {\n  const cellStyle = getColCellStyle(col);\n\n  if (col.type === \"select\") {\n    return (\n      <div\n        key={col.key}\n        role=\"cell\"\n        className={`${s.tdSelect()} ${s.cellBorderTd()}`}\n        style={cellStyle}\n        onClick={(e) => e.stopPropagation()}\n      >\n        <input\n          type=\"checkbox\"\n          className={s.checkbox()}\n          checked={ctx.isSelected}\n          onChange={ctx.onToggle}\n          aria-label={`Selecionar ${row.name}`}\n        />\n      </div>\n    );\n  }\n\n  if (col.type === \"actions\") {\n    return (\n      <div\n        key={col.key}\n        role=\"cell\"\n        className={s.tdActions({ selected: ctx.isHighlighted })}\n        style={cellStyle}\n        onClick={(e) => e.stopPropagation()}\n      >\n        <button\n          type=\"button\"\n          className={s.rowMenuBtn()}\n          aria-label=\"Ações da linha\"\n          onClick={(e) => e.stopPropagation()}\n        >\n          <MoreHorizontal size={16} />\n        </button>\n      </div>\n    );\n  }\n\n  const isBeforeActions = COLUMNS[COLUMNS.indexOf(col) + 1]?.type === \"actions\";\n  const borderCls = isBeforeActions ? \"\" : s.cellBorderTd();\n\n  return (\n    <div\n      key={col.key}\n      role=\"cell\"\n      style={cellStyle}\n      className={`${s.td()} ${borderCls}`}\n    >\n      {renderCellContent(col, row)}\n    </div>\n  );\n}\n\n/* ── CellRenderer (switch por tipo) ────────────────────────────────── */\n\nfunction renderCellContent(col: TabelaCol, row: TabelaRow) {\n  switch (col.type) {\n    case \"id\":       return <span className={s.cellId()}>{row.id}</span>;\n    case \"person\":   return <PersonCell row={row} />;\n    case \"email\":    return (\n      <a\n        href={`mailto:${row.email}`}\n        className={s.cellLink()}\n        onClick={(e) => e.stopPropagation()}\n      >\n        {row.email}\n      </a>\n    );\n    case \"phone\":    return <PhoneCell value={row.phone} />;\n    case \"status\":   return <StatusCell statusId={row.statusId} />;\n    case \"category\": return <CategoryCell categoryId={row.categoryId} />;\n    case \"agent\":    return <AgentCell agentId={row.agentId} />;\n    case \"currency\": return <span className={s.cellCurrency()}>{formatCurrency(row.value)}</span>;\n    case \"date\":     return <DateCell value={row[col.key as \"createdAt\" | \"lastContact\"]} />;\n    case \"text\":     return <>{row[col.key as keyof TabelaRow]}</>;\n    default:         return null;\n  }\n}\n\n/* ── Sub-cells ─────────────────────────────────────────────────────── */\n\nfunction PersonCell({ row }: { row: TabelaRow }) {\n  return (\n    <span className={s.cellPerson()} title={row.name}>\n      <span className={s.avatar()} style={{ background: row.avatarColor }}>\n        {row.initials}\n      </span>\n      <span className={s.cellPersonName()}>{row.name}</span>\n    </span>\n  );\n}\n\nfunction StatusCell({ statusId }: { statusId: keyof typeof STATUSES }) {\n  const st = STATUSES[statusId];\n  if (!st) return null;\n  return (\n    <span className={s.cellStatus()}>\n      <span className={s.dot()} style={{ background: st.color }} aria-hidden />\n      {st.label}\n    </span>\n  );\n}\n\nfunction CategoryCell({ categoryId }: { categoryId: keyof typeof CATEGORIES }) {\n  const c = CATEGORIES[categoryId];\n  if (!c) return null;\n  return <span className={s.chip({ kind: c.kind })}>{c.label}</span>;\n}\n\nfunction AgentCell({ agentId }: { agentId: keyof typeof AGENTS }) {\n  const a = AGENTS[agentId];\n  if (!a) return <span className={s.cellMuted()}>—</span>;\n  return (\n    <span className={s.cellAgent()} title={a.name}>\n      <span className={s.avatarSm()} style={{ background: a.color }}>\n        {a.initials}\n      </span>\n      <span>{a.name}</span>\n    </span>\n  );\n}\n\nfunction PhoneCell({ value }: { value: string }) {\n  if (!value) return <span className={s.cellMuted()}>—</span>;\n  return (\n    <a\n      href={`tel:${value.replace(/\\D/g, \"\")}`}\n      className={s.cellLink()}\n      onClick={(e) => e.stopPropagation()}\n    >\n      {value}\n    </a>\n  );\n}\n\nfunction DateCell({ value }: { value: number }) {\n  if (!value) return <span className={s.cellMuted()}>—</span>;\n  return <span className={s.cellDate()}>{formatDateShort(value)}</span>;\n}\n"],"names":["f","s","_","i","next","title","description","X","titleStyles","descStyles","d","r","e","c","a"],"mappings":"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"}

package/dist-lib/preview/chat.cjs

@@ -2,13 +2,13 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
-const chipGroup = require("../chunks/chip-group-CsKBBHW2.cjs");
+const chipGroup = require("../chunks/chip-group-2-f_Yo7Y.cjs");
 const useTheme = require("../chunks/useTheme-Dee4mo-A.cjs");
-const appShell = require("../chunks/app-shell-llilp6pT.cjs");
+const appShell = require("../chunks/app-shell-BdVam01i.cjs");
 const lucideReact = require("lucide-react");
 const appShellMocks = require("../chunks/app-shell-mocks-oO_IV3Gw.cjs");
 const chatV2Mocks = require("../chunks/chat-v2-mocks-BV9Wha_Z.cjs");
-const input = require("../chunks/input-BAZKFbZQ.cjs");
+const input = require("../chunks/input-BWevV7up.cjs");
 const chatV2Styles = chipGroup.tv({
   slots: {
     /** Body do AppShell — flex row com gap entre colunas. `relative` pra mobile overlays. */
@@ -75,7 +75,7 @@ function ChannelDot({ channel, dotOnly = false }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "span",
     {
-      className: "inline-flex items-center gap-[4px] text-[11px] text-fg-muted",
+      className: "inline-flex items-center gap-[4px] text-caption-sm text-fg-muted",
       title: chatV2Mocks.CHANNEL_LABEL[channel],
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -144,7 +144,7 @@ function ConversationActionsMenu({
   ] });
 }
 function DateSeparator({ label }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center my-pad-md", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "px-pad-lg py-pad-2xs rounded-radius-full bg-bg-muted text-[11px] text-fg-muted [font-variant-numeric:tabular-nums]", children: label }) });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center my-pad-md", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "px-pad-lg py-pad-2xs rounded-radius-full bg-bg-muted text-caption-sm text-fg-muted [font-variant-numeric:tabular-nums]", children: label }) });
 }
 const messageBubbleStyles = chipGroup.tv({
   slots: {
@@ -153,9 +153,9 @@ const messageBubbleStyles = chipGroup.tv({
     /** Balão em si — variants definem cor + corner pointer. */
     bubble: "max-w-[70%] px-pad-xl py-pad-md rounded-radius-xl shadow-sh-sm",
     /** Texto da mensagem. */
-    text: "text-[13.5px] leading-[1.45] whitespace-pre-wrap break-words",
+    text: "text-body-md leading-[1.45] whitespace-pre-wrap break-words",
     /** Footer com horário + status icon. */
-    meta: "flex items-center justify-end gap-[4px] mt-[2px] text-[10.5px]",
+    meta: "flex items-center justify-end gap-[4px] mt-[2px] text-caption-xs",
     /** Span do horário (tabular-nums pra alinhar). */
     time: "[font-variant-numeric:tabular-nums]"
   },
@@ -189,9 +189,9 @@ function MessageBubble({ msg }) {
   ] }) });
 }
 const SIZE_CLASSES = {
-  sm: "size-[28px] text-[11px]",
-  md: "size-[36px] text-[13px]",
-  lg: "size-[40px] text-[14px]"
+  sm: "size-[28px] text-caption-sm",
+  md: "size-[36px] text-body-sm font-normal",
+  lg: "size-[40px] text-body-md"
 };
 function PersonAvatar({ initials, hex, size = "md" }) {
   return /* @__PURE__ */ jsxRuntime.jsx(appShell.Avatar, { className: SIZE_CLASSES[size], style: { background: hex }, children: /* @__PURE__ */ jsxRuntime.jsx(appShell.AvatarFallback, { className: "bg-transparent text-white font-bold", children: initials }) });
@@ -203,7 +203,7 @@ const conversationColumnStyles = chipGroup.tv({
     headerInfo: "flex-1 min-w-0 flex flex-col gap-[2px]",
     headerTitleRow: "flex items-center gap-gp-sm",
     headerName: "text-title-md text-fg-default whitespace-nowrap overflow-hidden text-ellipsis",
-    headerMetaRow: "flex flex-wrap items-center gap-x-gp-sm gap-y-[2px] text-[11.5px] text-fg-muted min-w-0",
+    headerMetaRow: "flex flex-wrap items-center gap-x-gp-sm gap-y-[2px] text-caption-sm text-fg-muted min-w-0",
     headerActions: "flex items-center gap-gp-sm shrink-0",
     statusInner: "inline-flex items-center gap-[4px]",
     statusDot: "size-[6px] rounded-radius-full shrink-0",
@@ -386,8 +386,8 @@ function ConversationColumn({
 }
 function DetailField({ label, value }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline justify-between gap-gp-md py-pad-2xs", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[12px] text-fg-muted shrink-0", children: label }),
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[12.5px] text-fg-default text-right break-words min-w-0", children: value || "—" })
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-body-xs font-normal text-fg-muted shrink-0", children: label }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-body-xs font-normal text-fg-default text-right break-words min-w-0", children: value || "—" })
   ] });
 }
 function DetailSection({
@@ -405,7 +405,7 @@ function DetailSection({
         "aria-expanded": open,
         className: "flex items-center justify-between w-full px-pad-sm py-pad-sm -mx-pad-sm rounded-radius-md cursor-pointer text-left transition-colors duration-150 hover:bg-bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring-brand",
         children: [
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] font-semibold text-fg-default", children: title }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-body-sm font-semibold text-fg-default", children: title }),
           /* @__PURE__ */ jsxRuntime.jsx(
             lucideReact.ChevronDown,
             {
@@ -431,18 +431,18 @@ const detailsColumnStyles = chipGroup.tv({
     title: "m-0 text-title-md text-fg-default flex-1",
     body: "flex-1 min-h-0 overflow-y-auto px-pad-2xl py-pad-md flex flex-col gap-gp-2xl",
     contactHead: "flex flex-col items-center gap-gp-md pb-pad-md",
-    contactName: "text-[14px] font-semibold text-fg-default text-center",
+    contactName: "text-body-md font-semibold text-fg-default text-center",
     tagsRow: "flex flex-col gap-gp-sm pt-pad-xs",
-    tagsLabel: "text-[12px] text-fg-muted",
+    tagsLabel: "text-body-xs font-normal text-fg-muted",
     tagsChips: "flex items-center gap-gp-xs flex-wrap",
-    tagAddBtn: "inline-flex items-center gap-[3px] px-pad-md h-[22px] rounded-radius-full border border-dashed border-border-input text-[11px] font-medium text-fg-muted hover:bg-bg-muted hover:text-fg-default transition-colors",
-    historyEmpty: "text-[12px] text-fg-subtle text-center py-pad-md",
+    tagAddBtn: "inline-flex items-center gap-[3px] px-pad-md h-[22px] rounded-radius-full border border-dashed border-border-input text-caption-sm font-medium text-fg-muted hover:bg-bg-muted hover:text-fg-default transition-colors",
+    historyEmpty: "text-body-xs font-normal text-fg-subtle text-center py-pad-md",
     historyList: "m-0 p-0 list-none flex flex-col gap-gp-sm",
     historyItem: "flex gap-gp-md p-pad-md rounded-radius-md bg-bg-muted border border-border-subtle",
-    historyId: "text-[11px] text-fg-muted shrink-0 [font-variant-numeric:tabular-nums] pt-[1px]",
+    historyId: "text-caption-sm text-fg-muted shrink-0 [font-variant-numeric:tabular-nums] pt-[1px]",
     historyBody: "flex-1 min-w-0 flex flex-col gap-[1px]",
-    historySubject: "text-[12.5px] font-medium text-fg-default",
-    historyMeta: "text-[11px] text-fg-muted"
+    historySubject: "text-body-xs text-fg-default",
+    historyMeta: "text-caption-sm text-fg-muted"
   }
 });
 function DetailsColumn({
@@ -584,11 +584,11 @@ const filterRowStyles = chipGroup.tv({
     /** Leading slot (icon ou dot fallback). */
     leading: "shrink-0 inline-flex items-center justify-center size-[18px]",
     /** Label do filtro (ellipsis). */
-    label: "flex-1 min-w-0 text-[12.5px] font-medium whitespace-nowrap overflow-hidden text-ellipsis",
+    label: "flex-1 min-w-0 text-body-xs whitespace-nowrap overflow-hidden text-ellipsis",
     /** Dot brand 6px pra "tem novidades". */
     unreadDot: "size-[6px] rounded-radius-full bg-bg-brand shrink-0",
     /** Contador à direita. */
-    count: "text-[11px] text-fg-muted shrink-0 [font-variant-numeric:tabular-nums]",
+    count: "text-caption-sm text-fg-muted shrink-0 [font-variant-numeric:tabular-nums]",
     /** Dot fallback (quando item não tem icon). */
     fallbackDot: "size-[8px] rounded-radius-full"
   },
@@ -651,9 +651,9 @@ const filtersColumnStyles = chipGroup.tv({
     railScroll: "flex-1 min-h-0 overflow-y-auto py-pad-md flex flex-col items-center gap-gp-sm",
     /** Section wrapper (expandida). */
     section: "flex flex-col gap-gp-2xs",
-    /** Header de section (título all-caps). Usa `subheading-strong-sm` —
-        token DS criado especificamente pra este caso (10px/700/+0.06em). */
-    sectionTitle: "px-pad-md pt-pad-2xs pb-pad-2xs text-[10px] font-bold tracking-[0.06em] text-fg-subtle uppercase",
+    /** Header de section (título all-caps). Combo: `caption-xs` (10/400)
+        + override `font-bold uppercase tracking-[0.06em]` pra pattern strong. */
+    sectionTitle: "px-pad-md pt-pad-2xs pb-pad-2xs text-caption-xs font-bold tracking-[0.06em] text-fg-subtle uppercase",
     /** Group wrapper (rail) — divider entre grupos. */
     railGroup: "w-full flex flex-col items-center gap-gp-xs px-pad-md",
     /** Modifier de divisor pros grupos não-primeiros (rail). */
@@ -796,22 +796,21 @@ const conversationListItemStyles = chipGroup.tv({
     /** Row 1 — nome + horário. */
     rowTop: "flex items-center gap-gp-sm",
     /** Nome (ellipsis). */
-    name: "text-[13px] font-semibold text-fg-default whitespace-nowrap overflow-hidden text-ellipsis flex-1 min-w-0",
+    name: "text-body-sm font-semibold text-fg-default whitespace-nowrap overflow-hidden text-ellipsis flex-1 min-w-0",
     /** Horário. */
-    time: "text-[11px] text-fg-muted shrink-0 [font-variant-numeric:tabular-nums]",
+    time: "text-caption-sm text-fg-muted shrink-0 [font-variant-numeric:tabular-nums]",
     /** Row 2 — preview + badge unread. */
     rowMid: "flex items-center gap-gp-sm",
     /** Preview da última mensagem (ellipsis). */
-    preview: "text-[12px] text-fg-muted whitespace-nowrap overflow-hidden text-ellipsis flex-1 min-w-0",
-    /** Badge contador de não lidas — usa `subheading-strong-md` (11px/700) como
-        base e força `font-bold` + `leading-none` inline pra preservar o weight
-        e a centralização vertical do número dentro do círculo (preset DS sozinho
-        usa lineHeight 0.875rem, que descentraliza o conteúdo). */
-    unread: "inline-flex items-center justify-center min-w-[18px] h-[18px] px-[5px] rounded-radius-full bg-bg-brand text-fg-on-brand text-[10.5px] font-bold leading-none shrink-0 [font-variant-numeric:tabular-nums]",
+    preview: "text-body-xs font-normal text-fg-muted whitespace-nowrap overflow-hidden text-ellipsis flex-1 min-w-0",
+    /** Badge contador de não lidas — `caption-xs` (10/400) + override
+        `font-bold leading-none` pra centralizar o número dentro do círculo.
+        Tabular-nums alinha dígitos verticalmente em badges com counters dinâmicos. */
+    unread: "inline-flex items-center justify-center min-w-[18px] h-[18px] px-[5px] rounded-radius-full bg-bg-brand text-fg-on-brand text-caption-xs font-bold leading-none shrink-0 [font-variant-numeric:tabular-nums]",
     /** Row 3 — canal + tag + ID. */
     rowBot: "flex items-center gap-gp-sm",
     /** ID da conversa (canto inferior direito). */
-    id: "ml-auto text-[10.5px] text-fg-subtle shrink-0 [font-variant-numeric:tabular-nums]"
+    id: "ml-auto text-caption-xs text-fg-subtle shrink-0 [font-variant-numeric:tabular-nums]"
   },
   variants: {
     isActive: {
@@ -877,7 +876,7 @@ const queueColumnStyles = chipGroup.tv({
     searchClear: "absolute right-pad-md top-1/2 -translate-y-1/2 grid place-items-center size-[20px] rounded-radius-md text-fg-muted hover:bg-bg-muted hover:text-fg-default transition-colors",
     chipsWrap: "px-pad-md pb-pad-2xl",
     list: "flex-1 min-h-0 overflow-y-auto px-pad-md pb-pad-md flex flex-col gap-gp-xs",
-    empty: "py-pad-4xl px-pad-xl text-center text-[12px] text-fg-subtle"
+    empty: "py-pad-4xl px-pad-xl text-center text-body-xs font-normal text-fg-subtle"
   }
 });
 function QueueColumn({