npm - @snksergio/design-system - Versions diffs - 0.32.1 → 0.34.0 - Mend

@snksergio/design-system 0.32.1 → 0.34.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (58) hide show

package/dist-lib/preview/clientes.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"clientes.mjs","sources":["../../src/preview/pages/ClientesShowcase/clientes-showcase.styles.ts","../../src/preview/pages/ClientesShowcase/components/NovoClienteDrawer/novo-cliente-drawer.tsx","../../src/preview/pages/ClientesShowcase/components/DetailDrawer/detail-drawer.styles.ts","../../src/preview/pages/ClientesShowcase/components/DetailDrawer/detail-drawer.tsx","../../src/preview/pages/ClientesShowcase/ClientesShowcase.tsx"],"sourcesContent":["import { tv } from \"@/utils/tv\";\r\n\r\n/*\r\n Layout em grid de 2 colunas usado dentro do drawer pra pares de campos\r\n * (Email + WhatsApp, Cidade + Valor).\r\n * `gap-form-gap` (20px) = token DS pra spacing entre FormField units (L-024).\r\n /\r\nexport const drawerFormStyles = tv({\r\n slots: {\r\n twoCols: \"grid grid-cols-2 gap-form-gap\",\r\n statusDot: \"inline-block size-[8px] rounded-radius-full mr-gp-xs shrink-0\",\r\n },\r\n});\r\n","import { useEffect, useState } from \"react\";\r\nimport { Panel } from \"@/components/ui/Panel\";\r\nimport { Button } from \"@/components/ui/Button/button\";\r\nimport {\r\n FormField,\r\n FormFieldInput,\r\n FormFieldSelect,\r\n FormFieldTextarea,\r\n} from \"@/components/ui/FormField\";\r\nimport { ChipGroup, ChipGroupItem } from \"@/components/ui/Chip\";\r\nimport { STATUSES, CATEGORIES } from \"../../../_table-data\";\r\nimport { CITIES, STATUS_DOT } from \"../../clientes-showcase-mocks\";\r\nimport { drawerFormStyles } from \"../../clientes-showcase.styles\";\r\nimport type { NovoClienteFormData } from \"../../clientes-showcase.types\";\r\n\r\nconst INITIAL_FORM: NovoClienteFormData = {\r\n name: \"\",\r\n email: \"\",\r\n whatsapp: \"\",\r\n statusId: \"active\",\r\n categoryId: \"lead\",\r\n city: \"\",\r\n value: 0,\r\n notes: \"\",\r\n};\r\n\r\nexport type NovoClienteDrawerProps = {\r\n open: boolean;\r\n onOpenChange: (open: boolean) => void;\r\n /* Disparado ao confirmar — drawer fecha automaticamente após o submit. /\r\n onSubmit?: (data: NovoClienteFormData) => void;\r\n};\r\n\r\n/\r\n Drawer \"Novo cliente\" — replica visual do TblClientFormDrawer\r\n * (sandbox /design-and-table-v2), recompilado em cima dos componentes do DS:\r\n * Panel + FormField (Input / Select / Textarea) + ChipGroup + Button.\r\n \r\n Layout (top → bottom):\r\n * 1. Nome* — full width\r\n * 2. Email + WhatsApp — 2 cols\r\n * 3. Status — ChipGroup com dot colorido\r\n * 4. Categoria — ChipGroup\r\n * 5. Cidade + Valor R$ — 2 cols\r\n * 6. Notas — textarea full width\r\n /\r\nexport function NovoClienteDrawer({\r\n open,\r\n onOpenChange,\r\n onSubmit,\r\n}: NovoClienteDrawerProps) {\r\n const s = drawerFormStyles();\r\n const [form, setForm] = useState<NovoClienteFormData>(INITIAL_FORM);\r\n\r\n // Reseta form sempre que abrir\r\n useEffect(() => {\r\n if (open) setForm(INITIAL_FORM);\r\n }, [open]);\r\n\r\n const canSubmit = form.name.trim().length > 0;\r\n\r\n const handleSubmit = () => {\r\n if (!canSubmit) return;\r\n onSubmit?.(form);\r\n onOpenChange(false);\r\n };\r\n\r\n return (\r\n <Panel\r\n open={open}\r\n onOpenChange={onOpenChange}\r\n title=\"Novo cliente\"\r\n side=\"right\"\r\n size=\"md\"\r\n footer={\r\n <>\r\n <Button\r\n variant=\"outline\"\r\n color=\"secondary\"\r\n size=\"md\"\r\n onClick={() => onOpenChange(false)}\r\n >\r\n Cancelar\r\n </Button>\r\n <Button\r\n variant=\"filled\"\r\n color=\"primary\"\r\n size=\"md\"\r\n disabled={!canSubmit}\r\n onClick={handleSubmit}\r\n >\r\n Criar cliente\r\n </Button>\r\n </>\r\n }\r\n >\r\n <FormFieldInput\r\n label=\"Nome\"\r\n required\r\n placeholder=\"Maria Silva\"\r\n value={form.name}\r\n onChange={(e) => setForm((f) => ({ ...f, name: e.target.value }))}\r\n />\r\n\r\n <div className={s.twoCols()}>\r\n <FormFieldInput\r\n label=\"Email\"\r\n type=\"email\"\r\n placeholder=\"cliente@exemplo.com\"\r\n value={form.email}\r\n onChange={(e) => setForm((f) => ({ ...f, email: e.target.value }))}\r\n />\r\n <FormFieldInput\r\n label=\"WhatsApp\"\r\n type=\"tel\"\r\n placeholder=\"55 11 99999-9999\"\r\n value={form.whatsapp}\r\n onChange={(e) => setForm((f) => ({ ...f, whatsapp: e.target.value }))}\r\n />\r\n </div>\r\n\r\n <FormField label=\"Status\">\r\n {() => (\r\n <ChipGroup\r\n type=\"single\"\r\n value={form.statusId}\r\n onValueChange={(v) =>\r\n v &&\r\n setForm((f) => ({\r\n ...f,\r\n statusId: v as keyof typeof STATUSES,\r\n }))\r\n }\r\n size=\"md\"\r\n shape=\"pill\"\r\n ariaLabel=\"Status do cliente\"\r\n >\r\n {Object.entries(STATUSES).map(([id, st]) => (\r\n <ChipGroupItem key={id} value={id}>\r\n <span\r\n className={s.statusDot()}\r\n style={{ background: STATUS_DOT[id] ?? st.color }}\r\n aria-hidden\r\n />\r\n {st.label}\r\n </ChipGroupItem>\r\n ))}\r\n </ChipGroup>\r\n )}\r\n </FormField>\r\n\r\n <FormField label=\"Categoria\">\r\n {() => (\r\n <ChipGroup\r\n type=\"single\"\r\n value={form.categoryId}\r\n onValueChange={(v) =>\r\n v &&\r\n setForm((f) => ({\r\n ...f,\r\n categoryId: v as keyof typeof CATEGORIES,\r\n }))\r\n }\r\n size=\"md\"\r\n shape=\"pill\"\r\n ariaLabel=\"Categoria do cliente\"\r\n >\r\n {Object.entries(CATEGORIES).map(([id, cat]) => (\r\n <ChipGroupItem key={id} value={id}>\r\n {cat.label}\r\n </ChipGroupItem>\r\n ))}\r\n </ChipGroup>\r\n )}\r\n </FormField>\r\n\r\n <div className={s.twoCols()}>\r\n <FormFieldSelect\r\n label=\"Cidade\"\r\n placeholder=\"Selecionar...\"\r\n value={form.city \|\| undefined}\r\n onValueChange={(v) => setForm((f) => ({ ...f, city: v }))}\r\n options={CITIES.map((c) => ({ value: c, label: c }))}\r\n />\r\n <FormFieldInput\r\n label=\"Valor (R$)\"\r\n type=\"number\"\r\n startAddon=\"R$\"\r\n value={String(form.value)}\r\n onChange={(e) =>\r\n setForm((f) => ({ ...f, value: Number(e.target.value) }))\r\n }\r\n min={0}\r\n step={0.01}\r\n />\r\n </div>\r\n\r\n <FormFieldTextarea\r\n label=\"Notas\"\r\n placeholder=\"Observações sobre o cliente...\"\r\n rows={4}\r\n value={form.notes}\r\n onChange={(e) => setForm((f) => ({ ...f, notes: e.target.value }))}\r\n />\r\n </Panel>\r\n );\r\n}\r\n","import { tv } from \"@/utils/tv\";\r\n\r\n/\r\n Styles do DetailDrawer — apenas as partes internas (sections collapsibles\r\n * + DetailField). O shell flutuante (aside, header com avatar+meta, footer\r\n * com botões) é delegado ao `<FloatingPanel>` do DS.\r\n /\r\nexport const detailDrawerStyles = tv({\r\n slots: {\r\n section: \"border-b border-border-default last:border-b-0\",\r\n sectionHead: [\r\n \"flex items-center justify-between w-full\",\r\n \"px-[18px] py-[14px]\",\r\n \"bg-transparent border-0 cursor-pointer text-left\",\r\n \"text-body-sm font-semibold text-fg-default\",\r\n \"transition-colors duration-150\",\r\n \"hover:bg-bg-muted\",\r\n \"focus-visible:outline-none focus-visible:bg-bg-muted\",\r\n ],\r\n sectionChev: \"size-[14px] text-fg-muted transition-transform duration-200\",\r\n sectionChevOpen: \"rotate-180\",\r\n sectionBody: \"flex flex-col gap-gp-md px-[18px] pb-pad-2xl\",\r\n\r\n field: \"flex items-baseline justify-between gap-gp-md text-body-sm font-normal\",\r\n fieldLabel: \"text-body-xs font-normal text-fg-muted shrink-0\",\r\n fieldValue: \"text-fg-default text-right break-words min-w-0\",\r\n },\r\n});\r\n","import { useState, type ReactNode } from \"react\";\r\nimport { ChevronDown, Pencil, Trash2 } from \"lucide-react\";\r\nimport { Avatar, AvatarFallback } from \"@/components/shadcn/avatar\";\r\nimport { Button } from \"@/components/ui/Button/button\";\r\nimport { Chip } from \"@/components/ui/Chip\";\r\nimport { FloatingPanel } from \"@/components/ui/FloatingPanel\";\r\nimport { STATUSES, CATEGORIES, AGENTS } from \"../../../_table-data\";\r\nimport {\r\n CATEGORY_KIND,\r\n STATUS_DOT,\r\n formatBRL,\r\n formatShortDate,\r\n} from \"../../clientes-showcase-mocks\";\r\nimport { detailDrawerStyles } from \"./detail-drawer.styles\";\r\nimport type { DetailDrawerProps } from \"./detail-drawer.types\";\r\n\r\n/ ── Helpers internos ────────────────────────────────────────────── /\r\n\r\nfunction formatLongDate(ms: number): string {\r\n if (!ms) return \"—\";\r\n const d = new Date(ms);\r\n return d.toLocaleDateString(\"pt-BR\", {\r\n day: \"numeric\",\r\n month: \"long\",\r\n year: \"numeric\",\r\n });\r\n}\r\n\r\ntype SectionId = \"contact\" \| \"meta\" \| \"notes\";\r\n\r\n/ ── DetailField (label : value) ────────────────────────────────── /\r\n\r\ntype DetailFieldProps = {\r\n label: string;\r\n value: ReactNode;\r\n s: ReturnType<typeof detailDrawerStyles>;\r\n};\r\n\r\nfunction DetailField({ label, value, s }: DetailFieldProps) {\r\n return (\r\n <div className={s.field()}>\r\n <span className={s.fieldLabel()}>{label}</span>\r\n <span className={s.fieldValue()}>{value \|\| \"—\"}</span>\r\n </div>\r\n );\r\n}\r\n\r\n/ ── DetailSection (collapsible) ─────────────────────────────────── /\r\n\r\ntype DetailSectionProps = {\r\n id: SectionId;\r\n title: string;\r\n open: boolean;\r\n onToggle: (id: SectionId) => void;\r\n children: ReactNode;\r\n s: ReturnType<typeof detailDrawerStyles>;\r\n};\r\n\r\nfunction DetailSection({\r\n id,\r\n title,\r\n open,\r\n onToggle,\r\n children,\r\n s,\r\n}: DetailSectionProps) {\r\n return (\r\n <section className={s.section()}>\r\n <button\r\n type=\"button\"\r\n className={s.sectionHead()}\r\n onClick={() => onToggle(id)}\r\n aria-expanded={open}\r\n >\r\n <span>{title}</span>\r\n <ChevronDown\r\n className={[s.sectionChev(), open ? s.sectionChevOpen() : \"\"].join(\" \")}\r\n />\r\n </button>\r\n {open && <div className={s.sectionBody()}>{children}</div>}\r\n </section>\r\n );\r\n}\r\n\r\n/ ── DetailDrawer ────────────────────────────────────────────────── /\r\n\r\n/\r\n Drawer \"Detalhes do cliente\" — usa `<FloatingPanel>` do DS (non-modal,\r\n * resizable, maximizable, responsive). Replica visual do `TblDetailsPanel`\r\n * do sandbox /design-and-table-v2.\r\n /\r\nexport function DetailDrawer({\r\n row,\r\n onClose,\r\n onEdit,\r\n onDelete,\r\n onSave,\r\n}: DetailDrawerProps) {\r\n const s = detailDrawerStyles();\r\n const [openSections, setOpenSections] = useState<Set<SectionId>>(\r\n () => new Set([\"contact\", \"meta\", \"notes\"]),\r\n );\r\n\r\n const toggle = (id: SectionId) => {\r\n setOpenSections((prev) => {\r\n const next = new Set(prev);\r\n if (next.has(id)) next.delete(id);\r\n else next.add(id);\r\n return next;\r\n });\r\n };\r\n\r\n // Mantém ordem dos hooks estável independente de `row` — depois do toggle.\r\n if (!row) return null;\r\n\r\n const status = STATUSES[row.statusId];\r\n const cat = CATEGORIES[row.categoryId as keyof typeof CATEGORIES];\r\n const agent = AGENTS[row.agentId as keyof typeof AGENTS];\r\n const agentInitials =\r\n agent?.name.split(\" \").map((p) => p[0]).join(\"\").slice(0, 2) ?? \"?\";\r\n\r\n return (\r\n <FloatingPanel\r\n open={row !== null}\r\n onOpenChange={(open) => {\r\n if (!open) onClose();\r\n }}\r\n side=\"right\"\r\n size=\"md\"\r\n resizable\r\n maximizable\r\n // Sections internas (DetailSection) gerenciam o próprio padding edge-to-edge.\r\n bodyPadded={false}\r\n resizableStorageKey=\"clientes-showcase.detail-drawer.width\"\r\n titleSlot={\r\n <div className=\"flex items-center gap-gp-md min-w-0\">\r\n <Avatar\r\n className=\"size-[40px] shrink-0\"\r\n style={{ background: row.avatarColor }}\r\n >\r\n <AvatarFallback className=\"bg-transparent text-white text-body-md font-bold\">\r\n {row.initials}\r\n </AvatarFallback>\r\n </Avatar>\r\n <div className=\"flex flex-col min-w-0 flex-1\">\r\n <div className=\"text-body-md font-semibold text-fg-default whitespace-nowrap overflow-hidden text-ellipsis\">\r\n {row.name}\r\n </div>\r\n <div className=\"flex items-center gap-[6px] mt-[2px] text-body-xs font-normal text-fg-muted\">\r\n <span>{row.id}</span>\r\n <span className=\"opacity-50\">·</span>\r\n <span className=\"inline-flex items-center gap-[6px]\">\r\n <span\r\n className=\"inline-block size-[8px] rounded-radius-full shrink-0\"\r\n style={{ background: STATUS_DOT[row.statusId] ?? status?.color }}\r\n aria-hidden\r\n />\r\n {status?.label}\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n headerActions={\r\n <>\r\n <Button\r\n variant=\"soft\"\r\n color=\"secondary\"\r\n size=\"icon-sm\"\r\n aria-label=\"Editar\"\r\n onClick={() => onEdit?.(row)}\r\n >\r\n <Pencil />\r\n </Button>\r\n <Button\r\n variant=\"soft\"\r\n color=\"critical\"\r\n size=\"icon-sm\"\r\n aria-label=\"Excluir\"\r\n onClick={() => onDelete?.(row)}\r\n >\r\n <Trash2 />\r\n </Button>\r\n </>\r\n }\r\n footer={\r\n <>\r\n <Button variant=\"outline\" color=\"secondary\" size=\"sm\" onClick={onClose}>\r\n Cancelar\r\n </Button>\r\n <Button\r\n variant=\"filled\"\r\n color=\"primary\"\r\n size=\"sm\"\r\n onClick={() => onSave?.(row)}\r\n >\r\n Salvar alterações\r\n </Button>\r\n </>\r\n }\r\n >\r\n <DetailSection\r\n id=\"contact\"\r\n title=\"Contato\"\r\n open={openSections.has(\"contact\")}\r\n onToggle={toggle}\r\n s={s}\r\n >\r\n <DetailField\r\n label=\"Email\"\r\n value={\r\n <a\r\n href={`mailto:${row.email}`}\r\n className=\"text-fg-brand hover:underline\"\r\n >\r\n {row.email}\r\n </a>\r\n }\r\n s={s}\r\n />\r\n <DetailField\r\n label=\"Telefone\"\r\n value={\r\n <a\r\n href={`tel:${row.phone.replace(/\\D/g, \"\")}`}\r\n className=\"text-fg-brand hover:underline\"\r\n >\r\n {row.phone}\r\n </a>\r\n }\r\n s={s}\r\n />\r\n <DetailField label=\"Localização\" value={row.location} s={s} />\r\n </DetailSection>\r\n\r\n <DetailSection\r\n id=\"meta\"\r\n title=\"Atendimento\"\r\n open={openSections.has(\"meta\")}\r\n onToggle={toggle}\r\n s={s}\r\n >\r\n <DetailField label=\"ID\" value={row.id} s={s} />\r\n <DetailField\r\n label=\"Categoria\"\r\n value={\r\n cat ? (\r\n <Chip\r\n color={CATEGORY_KIND[row.categoryId] ?? \"info\"}\r\n variant=\"soft\"\r\n size=\"sm\"\r\n shape=\"pill\"\r\n >\r\n {cat.label}\r\n </Chip>\r\n ) : (\r\n \"—\"\r\n )\r\n }\r\n s={s}\r\n />\r\n <DetailField\r\n label=\"Atribuído a\"\r\n value={\r\n agent ? (\r\n <span className=\"inline-flex items-center gap-gp-sm\">\r\n <Avatar\r\n className=\"size-[22px]\"\r\n style={{ background: agent.color }}\r\n >\r\n <AvatarFallback className=\"bg-transparent text-white text-caption-xs font-bold\">\r\n {agentInitials}\r\n </AvatarFallback>\r\n </Avatar>\r\n {agent.name}\r\n </span>\r\n ) : (\r\n \"—\"\r\n )\r\n }\r\n s={s}\r\n />\r\n <DetailField label=\"Valor\" value={formatBRL(row.value)} s={s} />\r\n <DetailField label=\"Criado em\" value={formatLongDate(row.createdAt)} s={s} />\r\n <DetailField\r\n label=\"Último contato\"\r\n value={formatShortDate(row.lastContact)}\r\n s={s}\r\n />\r\n </DetailSection>\r\n\r\n <DetailSection\r\n id=\"notes\"\r\n title=\"Anotações\"\r\n open={openSections.has(\"notes\")}\r\n onToggle={toggle}\r\n s={s}\r\n >\r\n <p className=\"text-body-xs font-normal text-fg-muted\">Sem anotações.</p>\r\n </DetailSection>\r\n </FloatingPanel>\r\n );\r\n}\r\n","import { useCallback, useMemo, useRef, useState } from \"react\";\r\nimport { useTheme, type Theme } from \"@/hooks/useTheme\";\r\nimport {\r\n Archive,\r\n Clock,\r\n Copy,\r\n Download,\r\n Maximize2,\r\n MessageSquare,\r\n MoreHorizontal,\r\n Pencil,\r\n Plus,\r\n RotateCcw,\r\n Trash2,\r\n Upload,\r\n} from \"lucide-react\";\r\nimport {\r\n CATEGORIES,\r\n AGENTS,\r\n type ClientRow,\r\n} from \"../_table-data\";\r\nimport {\r\n DataTable,\r\n presetView,\r\n type DataTableColumnDef,\r\n type DataTableKanbanConfig,\r\n type DataTablePresetView,\r\n type DataTableRef,\r\n type DataTableViewMode,\r\n type FilterModel,\r\n} from \"@/components/ui/DataTable\";\r\nimport { AppShell } from \"@/components/ui/AppShell\";\r\nimport { Button } from \"@/components/ui/Button/button\";\r\nimport { Chip } from \"@/components/ui/Chip\";\r\nimport { PageHeader } from \"@/components/ui/PageHeader\";\r\nimport { BulkActionButton } from \"@/components/ui/TableToolbar\";\r\nimport { Avatar, AvatarFallback } from \"@/components/shadcn/avatar\";\r\nimport {\r\n APP_SHELL_CONTEXTS,\r\n APP_SHELL_COMMANDS,\r\n APP_SHELL_NOTIFICATIONS,\r\n APP_SHELL_MESSAGES,\r\n APP_SHELL_THEME_OPTIONS,\r\n APP_SHELL_LAYOUT_OPTIONS,\r\n APP_SHELL_USER,\r\n} from \"../../mocks/app-shell-mocks\";\r\nimport {\r\n CLIENTS_87,\r\n STATUS_OPTIONS,\r\n CATEGORY_OPTIONS,\r\n AGENT_OPTIONS,\r\n AGENTS_LOOKUP,\r\n KANBAN_COLUMNS,\r\n CATEGORY_KIND,\r\n formatBRL,\r\n formatShortDate,\r\n} from \"./clientes-showcase-mocks\";\r\nimport { NovoClienteDrawer } from \"./components/NovoClienteDrawer\";\r\nimport { DetailDrawer } from \"./components/DetailDrawer\";\r\nimport { AlertModal } from \"@/components/ui/AlertModal\";\r\n\r\n/ ── Columns declarativas (type-based) ─────────────────────────── /\r\n\r\ntype ColumnHandlers = {\r\n /* Pede confirmação de exclusão (abre o AlertModal). /\r\n onAskDelete: (row: ClientRow) => void;\r\n};\r\n\r\nfunction buildColumns(handlers: ColumnHandlers): DataTableColumnDef<ClientRow>[] {\r\n return [\r\n { field: \"id\", headerName: \"ID\", type: \"text\", width: 130 },\r\n {\r\n field: \"name\",\r\n headerName: \"Nome\",\r\n type: \"user\",\r\n sortable: true,\r\n width: 220,\r\n typeOptions: {\r\n users: Object.fromEntries(\r\n CLIENTS_87.map((c) => [\r\n c.name,\r\n {\r\n name: c.name,\r\n initials: c.initials,\r\n color: c.avatarColor,\r\n },\r\n ]),\r\n ),\r\n },\r\n valueGetter: (row) => row.name,\r\n },\r\n {\r\n field: \"email\",\r\n headerName: \"Email\",\r\n type: \"email\",\r\n enableColumnFilter: true,\r\n filterType: \"text\",\r\n },\r\n {\r\n field: \"phone\",\r\n headerName: \"Telefone\",\r\n type: \"phone\",\r\n },\r\n {\r\n field: \"statusId\",\r\n headerName: \"Status\",\r\n type: \"status\",\r\n enableColumnFilter: true,\r\n filterType: \"multiSelect\",\r\n filterOptions: STATUS_OPTIONS,\r\n },\r\n {\r\n field: \"categoryId\",\r\n headerName: \"Categoria\",\r\n type: \"badge\",\r\n enableColumnFilter: true,\r\n filterType: \"multiSelect\",\r\n filterOptions: CATEGORY_OPTIONS,\r\n },\r\n {\r\n field: \"agentId\",\r\n headerName: \"Atribuído\",\r\n type: \"user\",\r\n enableColumnFilter: true,\r\n filterType: \"select\",\r\n filterOptions: AGENT_OPTIONS,\r\n typeOptions: { users: AGENTS_LOOKUP },\r\n },\r\n {\r\n field: \"value\",\r\n headerName: \"Valor\",\r\n type: \"currency\",\r\n sortable: true,\r\n enableColumnFilter: true,\r\n filterType: \"number\",\r\n aggregate: \"sum\",\r\n aggregateFormatter: (v) =>\r\n new Intl.NumberFormat(\"pt-BR\", { style: \"currency\", currency: \"BRL\" }).format(v),\r\n },\r\n {\r\n field: \"createdAt\",\r\n headerName: \"Criado em\",\r\n type: \"date\",\r\n sortable: true,\r\n enableColumnFilter: true,\r\n filterType: \"date\",\r\n width: 130,\r\n },\r\n {\r\n field: \"lastContact\",\r\n headerName: \"Último contato\",\r\n type: \"date\",\r\n sortable: true,\r\n width: 150,\r\n },\r\n {\r\n field: \"location\",\r\n headerName: \"Localização\",\r\n type: \"text\",\r\n minWidth: 150,\r\n },\r\n {\r\n field: \"_actions\",\r\n headerName: \"\",\r\n type: \"actions\",\r\n width: 64,\r\n pinned: \"right\",\r\n getActions: ({ row }) => [\r\n {\r\n id: \"edit\",\r\n label: \"Editar\",\r\n icon: <Pencil />,\r\n showInMenu: true,\r\n onClick: () => console.log(\"Editar\", row.id),\r\n },\r\n {\r\n id: \"whatsapp\",\r\n label: \"Abrir atendimento (WhatsApp)\",\r\n icon: <MessageSquare />,\r\n showInMenu: true,\r\n onClick: () => console.log(\"Atendimento\", row.id),\r\n },\r\n {\r\n id: \"archive\",\r\n label: \"Arquivar\",\r\n icon: <Archive />,\r\n showInMenu: true,\r\n onClick: () => console.log(\"Arquivar\", row.id),\r\n },\r\n {\r\n id: \"delete\",\r\n label: \"Excluir cliente\",\r\n icon: <Trash2 />,\r\n showInMenu: true,\r\n destructive: true,\r\n onClick: () => handlers.onAskDelete(row),\r\n },\r\n ],\r\n },\r\n ];\r\n}\r\n\r\n/ ── Saved views / Presets — tabs do toolbar ───────────────────── /\r\n\r\nconst DEFAULT_VIEWS: DataTablePresetView[] = [\r\n presetView({\r\n id: \"preset:meus\",\r\n name: \"Meus\",\r\n filters: [{ field: \"agentId\", value: \"you\" }],\r\n }),\r\n presetView({\r\n id: \"preset:ativos\",\r\n name: \"Ativos\",\r\n filters: [{ field: \"statusId\", value: \"active\" }],\r\n }),\r\n presetView({\r\n id: \"preset:royals\",\r\n name: \"Royals\",\r\n filters: [{ field: \"categoryId\", value: \"royal\" }],\r\n }),\r\n presetView({\r\n id: \"preset:ultimos-7-dias\",\r\n name: \"Últimos 7 dias\",\r\n sort: [{ field: \"createdAt\", direction: \"desc\" }],\r\n }),\r\n];\r\n\r\n/ ── Filtros iniciais (Status=Ativo + Categoria=Royal — print) ─── /\r\n\r\n// statusId e categoryId são filterType=\"multiSelect\" — operator correto é \"isAnyOf\"\r\n// (not \"equals\"). Sem isso, o popover Filtros mostrava o Select de operador VAZIO\r\n// porque \"equals\" não está nos operators de MultiSelectColumnType.\r\nconst INITIAL_FILTERS: FilterModel = {\r\n items: [\r\n { id: \"filter-status-ativo\", field: \"statusId\", operator: \"isAnyOf\", value: \"active\" },\r\n { id: \"filter-categoria-royal\", field: \"categoryId\", operator: \"isAnyOf\", value: \"royal\" },\r\n ],\r\n logicOperator: \"AND\",\r\n};\r\n\r\n/ ── Kanban config (renderCard com JSX) ────────────────────────── /\r\n\r\nconst KANBAN_CONFIG: DataTableKanbanConfig<ClientRow> = {\r\n groupByField: \"statusId\",\r\n columns: KANBAN_COLUMNS,\r\n renderCard: ({ row }) => {\r\n const cat = CATEGORIES[row.categoryId as keyof typeof CATEGORIES];\r\n const agent = AGENTS[row.agentId as keyof typeof AGENTS];\r\n const agentInitials = agent?.name.split(\" \").map((s) => s[0]).join(\"\").slice(0, 2) ?? \"?\";\r\n return {\r\n title: row.name,\r\n subtitle: row.id,\r\n avatar: (\r\n <Avatar className=\"size-[28px]\" style={{ background: row.avatarColor }}>\r\n <AvatarFallback className=\"bg-transparent text-white text-caption-sm font-bold\">\r\n {row.initials}\r\n </AvatarFallback>\r\n </Avatar>\r\n ),\r\n chip: cat ? (\r\n <Chip\r\n color={CATEGORY_KIND[row.categoryId] ?? \"info\"}\r\n variant=\"soft\"\r\n size=\"sm\"\r\n shape=\"pill\"\r\n >\r\n {cat.label}\r\n </Chip>\r\n ) : null,\r\n value: formatBRL(row.value),\r\n footerLeft: agent ? (\r\n <span className=\"inline-flex items-center gap-gp-sm min-w-0 flex-1\">\r\n <Avatar className=\"size-[22px]\" style={{ background: agent.color }}>\r\n <AvatarFallback className=\"bg-transparent text-white text-caption-xs font-bold\">\r\n {agentInitials}\r\n </AvatarFallback>\r\n </Avatar>\r\n <span className=\"text-body-xs font-normal text-fg-muted whitespace-nowrap overflow-hidden text-ellipsis\">\r\n {agent.name}\r\n </span>\r\n </span>\r\n ) : null,\r\n footerRight: (\r\n <span className=\"inline-flex items-center gap-[4px] text-caption-sm text-fg-muted [font-variant-numeric:tabular-nums] shrink-0\">\r\n <Clock size={11} strokeWidth={1.8} aria-hidden />\r\n {formatShortDate(row.lastContact)}\r\n </span>\r\n ),\r\n };\r\n },\r\n};\r\n\r\n/ ═══════════════════════════════════════════════════════════════════════════\r\n Page — Clientes (showcase usando AppShell + DataTable real)\r\n ═══════════════════════════════════════════════════════════════════════════ /\r\n\r\ntype ConfirmDeleteState = {\r\n ids: string[];\r\n label: string;\r\n /* Callback opcional após confirmar — usado pelo bulk pra limpar seleção. /\r\n onAfter?: () => void;\r\n} \| null;\r\n\r\nexport default function ClientesShowcase() {\r\n const { theme, setTheme } = useTheme();\r\n const [rows, setRows] = useState<ClientRow[]>(() => CLIENTS_87);\r\n const [layout, setLayout] = useState<string>(\"fluid\");\r\n const [filterModel, setFilterModel] = useState<FilterModel>(INITIAL_FILTERS);\r\n const [viewMode, setViewMode] = useState<DataTableViewMode>(\"table\");\r\n const [novoClienteOpen, setNovoClienteOpen] = useState(false);\r\n const [detailRowId, setDetailRowId] = useState<string \| null>(null);\r\n const [confirmDelete, setConfirmDelete] = useState<ConfirmDeleteState>(null);\r\n const detailRow = detailRowId ? rows.find((r) => r.id === detailRowId) ?? null : null;\r\n const tableRef = useRef<DataTableRef>(null);\r\n\r\n const askDelete = useCallback(\r\n (row: ClientRow) =>\r\n setConfirmDelete({ ids: [row.id], label: row.name }),\r\n [],\r\n );\r\n\r\n const askBulkDelete = useCallback(\r\n (ids: string[], onAfter: () => void) =>\r\n setConfirmDelete({\r\n ids,\r\n label: `${ids.length} cliente${ids.length === 1 ? \"\" : \"s\"}`,\r\n onAfter,\r\n }),\r\n [],\r\n );\r\n\r\n const handleConfirmDelete = useCallback(() => {\r\n if (!confirmDelete) return;\r\n const ids = new Set(confirmDelete.ids);\r\n setRows((prev) => prev.filter((r) => !ids.has(r.id)));\r\n if (detailRowId && ids.has(detailRowId)) setDetailRowId(null);\r\n confirmDelete.onAfter?.();\r\n setConfirmDelete(null);\r\n }, [confirmDelete, detailRowId]);\r\n\r\n const columns = useMemo(\r\n () => buildColumns({ onAskDelete: askDelete }),\r\n [askDelete],\r\n );\r\n\r\n return (\r\n <AppShell\r\n contexts={APP_SHELL_CONTEXTS}\r\n defaultActiveContextId=\"inbox\"\r\n defaultActiveItemHref=\"#atendimentos\"\r\n breadcrumb={[{ label: \"Atendimentos\" }]}\r\n commandGroups={APP_SHELL_COMMANDS}\r\n notifications={{\r\n items: APP_SHELL_NOTIFICATIONS,\r\n onMarkAllRead: () => alert(\"Marcar todas como lidas\"),\r\n onMoreActions: () => alert(\"Mais ações\"),\r\n onViewAll: () => alert(\"Ver todas\"),\r\n }}\r\n messages={{\r\n items: APP_SHELL_MESSAGES,\r\n onNewMessage: () => alert(\"Nova mensagem\"),\r\n onExpand: () => alert(\"Expandir\"),\r\n onViewAll: () => alert(\"Ver todas\"),\r\n }}\r\n theme={theme}\r\n onThemeChange={(id) => setTheme(id as Theme)}\r\n themeOptions={APP_SHELL_THEME_OPTIONS}\r\n user={APP_SHELL_USER}\r\n layout={layout}\r\n onLayoutChange={setLayout}\r\n layoutOptions={APP_SHELL_LAYOUT_OPTIONS}\r\n onSettings={() => alert(\"Abrir Configurações\")}\r\n onLogout={() => alert(\"Sair (mock)\")}\r\n >\r\n <PageHeader\r\n title=\"Clientes\"\r\n description=\"Gerencie sua base de clientes, acompanhe status de cadastro e abra atendimentos diretos pelo WhatsApp.\"\r\n badge={\r\n <Chip color=\"primary\" variant=\"soft\" size=\"sm\" shape=\"rounded\">\r\n {rows.length.toLocaleString(\"pt-BR\")} registros\r\n </Chip>\r\n }\r\n actions={\r\n <>\r\n <Button\r\n variant=\"outline\"\r\n color=\"secondary\"\r\n size=\"icon-md\"\r\n aria-label=\"Mais ações\"\r\n onClick={() => alert(\"Mais ações\")}\r\n >\r\n <MoreHorizontal />\r\n </Button>\r\n <Button\r\n variant=\"filled\"\r\n color=\"primary\"\r\n size=\"md\"\r\n iconLeft={<Plus />}\r\n onClick={() => setNovoClienteOpen(true)}\r\n >\r\n Novo cliente\r\n </Button>\r\n </>\r\n }\r\n />\r\n\r\n {/ DataTable — ocupa o resto do body ──────────────────────── /}\r\n <DataTable<ClientRow>\r\n ref={tableRef}\r\n rows={rows}\r\n columns={columns}\r\n getRowId={(r) => r.id}\r\n persistId=\"showcase-clientes-crud\"\r\n defaultViews={DEFAULT_VIEWS}\r\n / Chips de filtro VAZIOS já visíveis no load (\"Atribuído\") — a afordância\r\n aparece sem abrir o menu; o usuário clica e preenche. Filtro é recurso\r\n da tabela (nativo), nunca form/select acima dela. /\r\n showEmptyFilterChips={[\"agentId\"]}\r\n filterModel={filterModel}\r\n onFilterModelChange={setFilterModel}\r\n viewMode={viewMode}\r\n onViewModeChange={setViewMode}\r\n kanbanConfig={KANBAN_CONFIG}\r\n toolbar={{\r\n enableSearch: true,\r\n enableFilters: true,\r\n enableColumns: true,\r\n enableDensity: true,\r\n enableExport: true,\r\n moreMenu: {\r\n items: [\r\n {\r\n id: \"fullscreen\",\r\n label: \"Tela cheia\",\r\n icon: <Maximize2 />,\r\n onSelect: () => alert(\"Tela cheia\"),\r\n },\r\n {\r\n id: \"duplicate\",\r\n label: \"Duplicar visualização\",\r\n icon: <Copy />,\r\n onSelect: () => alert(\"Duplicar visualização\"),\r\n },\r\n {\r\n id: \"import\",\r\n label: \"Importar CSV\",\r\n icon: <Upload />,\r\n onSelect: () => alert(\"Importar CSV\"),\r\n },\r\n {\r\n id: \"reset\",\r\n label: \"Resetar visualização\",\r\n icon: <RotateCcw />,\r\n destructive: true,\r\n onSelect: () => tableRef.current?.resetPersistedState(),\r\n },\r\n ],\r\n },\r\n }}\r\n paginationConfig={{\r\n enabled: true,\r\n initialPageSize: 10,\r\n pageSizeOptions: [10, 25, 50, 100],\r\n }}\r\n selectionConfig={{\r\n enabled: true,\r\n enableGlobal: true,\r\n actions: (selectedIds, clearSelection) => (\r\n <>\r\n <BulkActionButton\r\n icon={<Download />}\r\n onClick={() => tableRef.current?.exportCsv(\"selected\")}\r\n >\r\n Exportar\r\n </BulkActionButton>\r\n <BulkActionButton\r\n icon={<Trash2 />}\r\n variant=\"danger\"\r\n onClick={() => askBulkDelete(selectedIds.map(String), clearSelection)}\r\n >\r\n Excluir\r\n </BulkActionButton>\r\n </>\r\n ),\r\n }}\r\n onCellEditCommit={async ({ id, field, value }) => {\r\n await new Promise((res) => setTimeout(res, 400));\r\n setRows((prev) =>\r\n prev.map((r) => (r.id === id ? { ...r, [field]: value } : r)),\r\n );\r\n }}\r\n onRowClick={(row) => setDetailRowId(row.id)}\r\n className=\"flex-1 min-h-0\"\r\n />\r\n\r\n {/ Drawer \"Novo cliente\" — controlado pelo botão do header /}\r\n <NovoClienteDrawer\r\n open={novoClienteOpen}\r\n onOpenChange={setNovoClienteOpen}\r\n onSubmit={(data) => {\r\n console.log(\"Novo cliente:\", data);\r\n alert(`Cliente \"${data.name}\" criado (mock)`);\r\n }}\r\n />\r\n\r\n {/ DetailDrawer — abre ao clicar numa row, slide-in da direita SEM\r\n backdrop modal (tabela continua interativa atrás). /}\r\n <DetailDrawer\r\n row={detailRow}\r\n onClose={() => setDetailRowId(null)}\r\n onEdit={(r) => console.log(\"Editar\", r.id)}\r\n onDelete={(r) => askDelete(r)}\r\n onSave={(r) => alert(`Salvar alterações em ${r.name} (mock)`)}\r\n />\r\n\r\n {/ AlertModal de confirmação de exclusão — compartilhado entre\r\n row action menu, bulk action e DetailDrawer.onDelete. */}\r\n <AlertModal\r\n open={confirmDelete !== null}\r\n onOpenChange={(open) => {\r\n if (!open) setConfirmDelete(null);\r\n }}\r\n tone=\"danger\"\r\n title={\r\n confirmDelete && confirmDelete.ids.length > 1\r\n ? `Excluir ${confirmDelete.label}?`\r\n : \"Excluir cliente?\"\r\n }\r\n description={\r\n confirmDelete\r\n ? confirmDelete.ids.length > 1\r\n ? `Esta ação não pode ser desfeita. ${confirmDelete.label} serão removidos permanentemente.`\r\n : `Esta ação não pode ser desfeita. \"${confirmDelete.label}\" será removido permanentemente.`\r\n : null\r\n }\r\n confirmLabel=\"Excluir\"\r\n cancelLabel=\"Cancelar\"\r\n onConfirm={handleConfirmDelete}\r\n />\r\n </AppShell>\r\n );\r\n}\r\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"clientes.mjs","sources":["../../src/preview/pages/ClientesShowcase/clientes-showcase.styles.ts","../../src/preview/pages/ClientesShowcase/components/NovoClienteDrawer/novo-cliente-drawer.tsx","../../src/preview/pages/ClientesShowcase/components/DetailDrawer/detail-drawer.styles.ts","../../src/preview/pages/ClientesShowcase/components/DetailDrawer/detail-drawer.tsx","../../src/preview/pages/ClientesShowcase/ClientesShowcase.tsx"],"sourcesContent":["import { tv } from \"@/utils/tv\";\r\n\r\n/*\r\n Layout em grid de 2 colunas usado dentro do drawer pra pares de campos\r\n * (Email + WhatsApp, Cidade + Valor).\r\n * `gap-form-gap` (20px) = token DS pra spacing entre FormField units (L-024).\r\n /\r\nexport const drawerFormStyles = tv({\r\n slots: {\r\n twoCols: \"grid grid-cols-2 gap-form-gap\",\r\n statusDot: \"inline-block size-[8px] rounded-radius-full mr-gp-xs shrink-0\",\r\n },\r\n});\r\n","import { useEffect, useState } from \"react\";\r\nimport { Panel } from \"@/components/ui/Panel\";\r\nimport { Button } from \"@/components/ui/Button/button\";\r\nimport {\r\n FormField,\r\n FormFieldInput,\r\n FormFieldSelect,\r\n FormFieldTextarea,\r\n} from \"@/components/ui/FormField\";\r\nimport { ChipGroup, ChipGroupItem } from \"@/components/ui/Chip\";\r\nimport { STATUSES, CATEGORIES } from \"../../../_table-data\";\r\nimport { CITIES, STATUS_DOT } from \"../../clientes-showcase-mocks\";\r\nimport { drawerFormStyles } from \"../../clientes-showcase.styles\";\r\nimport type { NovoClienteFormData } from \"../../clientes-showcase.types\";\r\n\r\nconst INITIAL_FORM: NovoClienteFormData = {\r\n name: \"\",\r\n email: \"\",\r\n whatsapp: \"\",\r\n statusId: \"active\",\r\n categoryId: \"lead\",\r\n city: \"\",\r\n value: 0,\r\n notes: \"\",\r\n};\r\n\r\nexport type NovoClienteDrawerProps = {\r\n open: boolean;\r\n onOpenChange: (open: boolean) => void;\r\n /* Disparado ao confirmar — drawer fecha automaticamente após o submit. /\r\n onSubmit?: (data: NovoClienteFormData) => void;\r\n};\r\n\r\n/\r\n Drawer \"Novo cliente\" — replica visual do TblClientFormDrawer\r\n * (sandbox /design-and-table-v2), recompilado em cima dos componentes do DS:\r\n * Panel + FormField (Input / Select / Textarea) + ChipGroup + Button.\r\n \r\n Layout (top → bottom):\r\n * 1. Nome* — full width\r\n * 2. Email + WhatsApp — 2 cols\r\n * 3. Status — ChipGroup com dot colorido\r\n * 4. Categoria — ChipGroup\r\n * 5. Cidade + Valor R$ — 2 cols\r\n * 6. Notas — textarea full width\r\n /\r\nexport function NovoClienteDrawer({\r\n open,\r\n onOpenChange,\r\n onSubmit,\r\n}: NovoClienteDrawerProps) {\r\n const s = drawerFormStyles();\r\n const [form, setForm] = useState<NovoClienteFormData>(INITIAL_FORM);\r\n\r\n // Reseta form sempre que abrir\r\n useEffect(() => {\r\n if (open) setForm(INITIAL_FORM);\r\n }, [open]);\r\n\r\n const canSubmit = form.name.trim().length > 0;\r\n\r\n const handleSubmit = () => {\r\n if (!canSubmit) return;\r\n onSubmit?.(form);\r\n onOpenChange(false);\r\n };\r\n\r\n return (\r\n <Panel\r\n open={open}\r\n onOpenChange={onOpenChange}\r\n title=\"Novo cliente\"\r\n side=\"right\"\r\n size=\"md\"\r\n footer={\r\n <>\r\n <Button\r\n variant=\"outline\"\r\n color=\"secondary\"\r\n size=\"md\"\r\n onClick={() => onOpenChange(false)}\r\n >\r\n Cancelar\r\n </Button>\r\n <Button\r\n variant=\"filled\"\r\n color=\"primary\"\r\n size=\"md\"\r\n disabled={!canSubmit}\r\n onClick={handleSubmit}\r\n >\r\n Criar cliente\r\n </Button>\r\n </>\r\n }\r\n >\r\n <FormFieldInput\r\n label=\"Nome\"\r\n required\r\n placeholder=\"Maria Silva\"\r\n value={form.name}\r\n onChange={(e) => setForm((f) => ({ ...f, name: e.target.value }))}\r\n />\r\n\r\n <div className={s.twoCols()}>\r\n <FormFieldInput\r\n label=\"Email\"\r\n type=\"email\"\r\n placeholder=\"cliente@exemplo.com\"\r\n value={form.email}\r\n onChange={(e) => setForm((f) => ({ ...f, email: e.target.value }))}\r\n />\r\n <FormFieldInput\r\n label=\"WhatsApp\"\r\n type=\"tel\"\r\n placeholder=\"55 11 99999-9999\"\r\n value={form.whatsapp}\r\n onChange={(e) => setForm((f) => ({ ...f, whatsapp: e.target.value }))}\r\n />\r\n </div>\r\n\r\n <FormField label=\"Status\">\r\n {() => (\r\n <ChipGroup\r\n type=\"single\"\r\n value={form.statusId}\r\n onValueChange={(v) =>\r\n v &&\r\n setForm((f) => ({\r\n ...f,\r\n statusId: v as keyof typeof STATUSES,\r\n }))\r\n }\r\n size=\"md\"\r\n shape=\"pill\"\r\n ariaLabel=\"Status do cliente\"\r\n >\r\n {Object.entries(STATUSES).map(([id, st]) => (\r\n <ChipGroupItem key={id} value={id}>\r\n <span\r\n className={s.statusDot()}\r\n style={{ background: STATUS_DOT[id] ?? st.color }}\r\n aria-hidden\r\n />\r\n {st.label}\r\n </ChipGroupItem>\r\n ))}\r\n </ChipGroup>\r\n )}\r\n </FormField>\r\n\r\n <FormField label=\"Categoria\">\r\n {() => (\r\n <ChipGroup\r\n type=\"single\"\r\n value={form.categoryId}\r\n onValueChange={(v) =>\r\n v &&\r\n setForm((f) => ({\r\n ...f,\r\n categoryId: v as keyof typeof CATEGORIES,\r\n }))\r\n }\r\n size=\"md\"\r\n shape=\"pill\"\r\n ariaLabel=\"Categoria do cliente\"\r\n >\r\n {Object.entries(CATEGORIES).map(([id, cat]) => (\r\n <ChipGroupItem key={id} value={id}>\r\n {cat.label}\r\n </ChipGroupItem>\r\n ))}\r\n </ChipGroup>\r\n )}\r\n </FormField>\r\n\r\n <div className={s.twoCols()}>\r\n <FormFieldSelect\r\n label=\"Cidade\"\r\n placeholder=\"Selecionar...\"\r\n value={form.city \|\| undefined}\r\n onValueChange={(v) => setForm((f) => ({ ...f, city: v }))}\r\n options={CITIES.map((c) => ({ value: c, label: c }))}\r\n />\r\n <FormFieldInput\r\n label=\"Valor (R$)\"\r\n type=\"number\"\r\n startAddon=\"R$\"\r\n value={String(form.value)}\r\n onChange={(e) =>\r\n setForm((f) => ({ ...f, value: Number(e.target.value) }))\r\n }\r\n min={0}\r\n step={0.01}\r\n />\r\n </div>\r\n\r\n <FormFieldTextarea\r\n label=\"Notas\"\r\n placeholder=\"Observações sobre o cliente...\"\r\n rows={4}\r\n value={form.notes}\r\n onChange={(e) => setForm((f) => ({ ...f, notes: e.target.value }))}\r\n />\r\n </Panel>\r\n );\r\n}\r\n","import { tv } from \"@/utils/tv\";\r\n\r\n/\r\n Styles do DetailDrawer — apenas as partes internas (sections collapsibles\r\n * + DetailField). O shell flutuante (aside, header com avatar+meta, footer\r\n * com botões) é delegado ao `<FloatingPanel>` do DS.\r\n /\r\nexport const detailDrawerStyles = tv({\r\n slots: {\r\n section: \"border-b border-border-default last:border-b-0\",\r\n sectionHead: [\r\n \"flex items-center justify-between w-full\",\r\n \"px-[18px] py-[14px]\",\r\n \"bg-transparent border-0 cursor-pointer text-left\",\r\n \"text-body-sm font-semibold text-fg-default\",\r\n \"transition-colors duration-150\",\r\n \"hover:bg-bg-muted\",\r\n \"focus-visible:outline-none focus-visible:bg-bg-muted\",\r\n ],\r\n sectionChev: \"size-[14px] text-fg-muted transition-transform duration-200\",\r\n sectionChevOpen: \"rotate-180\",\r\n sectionBody: \"flex flex-col gap-gp-md px-[18px] pb-pad-2xl\",\r\n\r\n field: \"flex items-baseline justify-between gap-gp-md text-body-sm font-normal\",\r\n fieldLabel: \"text-body-xs font-normal text-fg-muted shrink-0\",\r\n fieldValue: \"text-fg-default text-right break-words min-w-0\",\r\n },\r\n});\r\n","import { useState, type ReactNode } from \"react\";\r\nimport { ChevronDown, Pencil, Trash2 } from \"lucide-react\";\r\nimport { Avatar, AvatarFallback } from \"@/components/shadcn/avatar\";\r\nimport { Button } from \"@/components/ui/Button/button\";\r\nimport { Chip } from \"@/components/ui/Chip\";\r\nimport { FloatingPanel } from \"@/components/ui/FloatingPanel\";\r\nimport { STATUSES, CATEGORIES, AGENTS } from \"../../../_table-data\";\r\nimport {\r\n CATEGORY_KIND,\r\n STATUS_DOT,\r\n formatBRL,\r\n formatShortDate,\r\n} from \"../../clientes-showcase-mocks\";\r\nimport { detailDrawerStyles } from \"./detail-drawer.styles\";\r\nimport type { DetailDrawerProps } from \"./detail-drawer.types\";\r\n\r\n/ ── Helpers internos ────────────────────────────────────────────── /\r\n\r\nfunction formatLongDate(ms: number): string {\r\n if (!ms) return \"—\";\r\n const d = new Date(ms);\r\n return d.toLocaleDateString(\"pt-BR\", {\r\n day: \"numeric\",\r\n month: \"long\",\r\n year: \"numeric\",\r\n });\r\n}\r\n\r\ntype SectionId = \"contact\" \| \"meta\" \| \"notes\";\r\n\r\n/ ── DetailField (label : value) ────────────────────────────────── /\r\n\r\ntype DetailFieldProps = {\r\n label: string;\r\n value: ReactNode;\r\n s: ReturnType<typeof detailDrawerStyles>;\r\n};\r\n\r\nfunction DetailField({ label, value, s }: DetailFieldProps) {\r\n return (\r\n <div className={s.field()}>\r\n <span className={s.fieldLabel()}>{label}</span>\r\n <span className={s.fieldValue()}>{value \|\| \"—\"}</span>\r\n </div>\r\n );\r\n}\r\n\r\n/ ── DetailSection (collapsible) ─────────────────────────────────── /\r\n\r\ntype DetailSectionProps = {\r\n id: SectionId;\r\n title: string;\r\n open: boolean;\r\n onToggle: (id: SectionId) => void;\r\n children: ReactNode;\r\n s: ReturnType<typeof detailDrawerStyles>;\r\n};\r\n\r\nfunction DetailSection({\r\n id,\r\n title,\r\n open,\r\n onToggle,\r\n children,\r\n s,\r\n}: DetailSectionProps) {\r\n return (\r\n <section className={s.section()}>\r\n <button\r\n type=\"button\"\r\n className={s.sectionHead()}\r\n onClick={() => onToggle(id)}\r\n aria-expanded={open}\r\n >\r\n <span>{title}</span>\r\n <ChevronDown\r\n className={[s.sectionChev(), open ? s.sectionChevOpen() : \"\"].join(\" \")}\r\n />\r\n </button>\r\n {open && <div className={s.sectionBody()}>{children}</div>}\r\n </section>\r\n );\r\n}\r\n\r\n/ ── DetailDrawer ────────────────────────────────────────────────── /\r\n\r\n/\r\n Drawer \"Detalhes do cliente\" — usa `<FloatingPanel>` do DS (non-modal,\r\n * resizable, maximizable, responsive). Replica visual do `TblDetailsPanel`\r\n * do sandbox /design-and-table-v2.\r\n /\r\nexport function DetailDrawer({\r\n row,\r\n onClose,\r\n onEdit,\r\n onDelete,\r\n onSave,\r\n}: DetailDrawerProps) {\r\n const s = detailDrawerStyles();\r\n const [openSections, setOpenSections] = useState<Set<SectionId>>(\r\n () => new Set([\"contact\", \"meta\", \"notes\"]),\r\n );\r\n\r\n const toggle = (id: SectionId) => {\r\n setOpenSections((prev) => {\r\n const next = new Set(prev);\r\n if (next.has(id)) next.delete(id);\r\n else next.add(id);\r\n return next;\r\n });\r\n };\r\n\r\n // Mantém ordem dos hooks estável independente de `row` — depois do toggle.\r\n if (!row) return null;\r\n\r\n const status = STATUSES[row.statusId];\r\n const cat = CATEGORIES[row.categoryId as keyof typeof CATEGORIES];\r\n const agent = AGENTS[row.agentId as keyof typeof AGENTS];\r\n const agentInitials =\r\n agent?.name.split(\" \").map((p) => p[0]).join(\"\").slice(0, 2) ?? \"?\";\r\n\r\n return (\r\n <FloatingPanel\r\n open={row !== null}\r\n onOpenChange={(open) => {\r\n if (!open) onClose();\r\n }}\r\n side=\"right\"\r\n size=\"md\"\r\n resizable\r\n maximizable\r\n // Sections internas (DetailSection) gerenciam o próprio padding edge-to-edge.\r\n bodyPadded={false}\r\n resizableStorageKey=\"clientes-showcase.detail-drawer.width\"\r\n titleSlot={\r\n <div className=\"flex items-center gap-gp-md min-w-0\">\r\n <Avatar\r\n className=\"size-[40px] shrink-0\"\r\n style={{ background: row.avatarColor }}\r\n >\r\n <AvatarFallback className=\"bg-transparent text-white text-body-md font-bold\">\r\n {row.initials}\r\n </AvatarFallback>\r\n </Avatar>\r\n <div className=\"flex flex-col min-w-0 flex-1\">\r\n <div className=\"text-body-md font-semibold text-fg-default whitespace-nowrap overflow-hidden text-ellipsis\">\r\n {row.name}\r\n </div>\r\n <div className=\"flex items-center gap-[6px] mt-[2px] text-body-xs font-normal text-fg-muted\">\r\n <span>{row.id}</span>\r\n <span className=\"opacity-50\">·</span>\r\n <span className=\"inline-flex items-center gap-[6px]\">\r\n <span\r\n className=\"inline-block size-[8px] rounded-radius-full shrink-0\"\r\n style={{ background: STATUS_DOT[row.statusId] ?? status?.color }}\r\n aria-hidden\r\n />\r\n {status?.label}\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n headerActions={\r\n <>\r\n <Button\r\n variant=\"soft\"\r\n color=\"secondary\"\r\n size=\"icon-sm\"\r\n aria-label=\"Editar\"\r\n onClick={() => onEdit?.(row)}\r\n >\r\n <Pencil />\r\n </Button>\r\n <Button\r\n variant=\"soft\"\r\n color=\"critical\"\r\n size=\"icon-sm\"\r\n aria-label=\"Excluir\"\r\n onClick={() => onDelete?.(row)}\r\n >\r\n <Trash2 />\r\n </Button>\r\n </>\r\n }\r\n footer={\r\n <>\r\n <Button variant=\"outline\" color=\"secondary\" size=\"sm\" onClick={onClose}>\r\n Cancelar\r\n </Button>\r\n <Button\r\n variant=\"filled\"\r\n color=\"primary\"\r\n size=\"sm\"\r\n onClick={() => onSave?.(row)}\r\n >\r\n Salvar alterações\r\n </Button>\r\n </>\r\n }\r\n >\r\n <DetailSection\r\n id=\"contact\"\r\n title=\"Contato\"\r\n open={openSections.has(\"contact\")}\r\n onToggle={toggle}\r\n s={s}\r\n >\r\n <DetailField\r\n label=\"Email\"\r\n value={\r\n <a\r\n href={`mailto:${row.email}`}\r\n className=\"text-fg-brand hover:underline\"\r\n >\r\n {row.email}\r\n </a>\r\n }\r\n s={s}\r\n />\r\n <DetailField\r\n label=\"Telefone\"\r\n value={\r\n <a\r\n href={`tel:${row.phone.replace(/\\D/g, \"\")}`}\r\n className=\"text-fg-brand hover:underline\"\r\n >\r\n {row.phone}\r\n </a>\r\n }\r\n s={s}\r\n />\r\n <DetailField label=\"Localização\" value={row.location} s={s} />\r\n </DetailSection>\r\n\r\n <DetailSection\r\n id=\"meta\"\r\n title=\"Atendimento\"\r\n open={openSections.has(\"meta\")}\r\n onToggle={toggle}\r\n s={s}\r\n >\r\n <DetailField label=\"ID\" value={row.id} s={s} />\r\n <DetailField\r\n label=\"Categoria\"\r\n value={\r\n cat ? (\r\n <Chip\r\n color={CATEGORY_KIND[row.categoryId] ?? \"info\"}\r\n variant=\"soft\"\r\n size=\"sm\"\r\n shape=\"pill\"\r\n >\r\n {cat.label}\r\n </Chip>\r\n ) : (\r\n \"—\"\r\n )\r\n }\r\n s={s}\r\n />\r\n <DetailField\r\n label=\"Atribuído a\"\r\n value={\r\n agent ? (\r\n <span className=\"inline-flex items-center gap-gp-sm\">\r\n <Avatar\r\n className=\"size-[22px]\"\r\n style={{ background: agent.color }}\r\n >\r\n <AvatarFallback className=\"bg-transparent text-white text-caption-xs font-bold\">\r\n {agentInitials}\r\n </AvatarFallback>\r\n </Avatar>\r\n {agent.name}\r\n </span>\r\n ) : (\r\n \"—\"\r\n )\r\n }\r\n s={s}\r\n />\r\n <DetailField label=\"Valor\" value={formatBRL(row.value)} s={s} />\r\n <DetailField label=\"Criado em\" value={formatLongDate(row.createdAt)} s={s} />\r\n <DetailField\r\n label=\"Último contato\"\r\n value={formatShortDate(row.lastContact)}\r\n s={s}\r\n />\r\n </DetailSection>\r\n\r\n <DetailSection\r\n id=\"notes\"\r\n title=\"Anotações\"\r\n open={openSections.has(\"notes\")}\r\n onToggle={toggle}\r\n s={s}\r\n >\r\n <p className=\"text-body-xs font-normal text-fg-muted\">Sem anotações.</p>\r\n </DetailSection>\r\n </FloatingPanel>\r\n );\r\n}\r\n","import { useCallback, useMemo, useRef, useState } from \"react\";\r\nimport { useTheme, type Theme } from \"@/hooks/useTheme\";\r\nimport {\r\n Archive,\r\n Clock,\r\n Copy,\r\n Download,\r\n Maximize2,\r\n MessageSquare,\r\n MoreHorizontal,\r\n Pencil,\r\n Plus,\r\n RotateCcw,\r\n Trash2,\r\n Upload,\r\n} from \"lucide-react\";\r\nimport {\r\n CATEGORIES,\r\n AGENTS,\r\n type ClientRow,\r\n} from \"../_table-data\";\r\nimport {\r\n DataTable,\r\n presetView,\r\n type DataTableColumnDef,\r\n type DataTableKanbanConfig,\r\n type DataTablePresetView,\r\n type DataTableRef,\r\n type DataTableViewMode,\r\n type FilterModel,\r\n} from \"@/components/ui/DataTable\";\r\nimport { AppShell } from \"@/components/ui/AppShell\";\r\nimport { Button } from \"@/components/ui/Button/button\";\r\nimport { Chip } from \"@/components/ui/Chip\";\r\nimport { PageHeader } from \"@/components/ui/PageHeader\";\r\nimport { BulkActionButton } from \"@/components/ui/TableToolbar\";\r\nimport { Avatar, AvatarFallback } from \"@/components/shadcn/avatar\";\r\nimport {\r\n APP_SHELL_CONTEXTS,\r\n APP_SHELL_COMMANDS,\r\n APP_SHELL_NOTIFICATIONS,\r\n APP_SHELL_MESSAGES,\r\n APP_SHELL_THEME_OPTIONS,\r\n APP_SHELL_LAYOUT_OPTIONS,\r\n APP_SHELL_USER,\r\n} from \"../../mocks/app-shell-mocks\";\r\nimport {\r\n CLIENTS_87,\r\n STATUS_OPTIONS,\r\n CATEGORY_OPTIONS,\r\n AGENT_OPTIONS,\r\n AGENTS_LOOKUP,\r\n KANBAN_COLUMNS,\r\n CATEGORY_KIND,\r\n formatBRL,\r\n formatShortDate,\r\n} from \"./clientes-showcase-mocks\";\r\nimport { NovoClienteDrawer } from \"./components/NovoClienteDrawer\";\r\nimport { DetailDrawer } from \"./components/DetailDrawer\";\r\nimport { AlertModal } from \"@/components/ui/AlertModal\";\r\n\r\n/ ── Columns declarativas (type-based) ─────────────────────────── /\r\n\r\ntype ColumnHandlers = {\r\n /* Pede confirmação de exclusão (abre o AlertModal). /\r\n onAskDelete: (row: ClientRow) => void;\r\n};\r\n\r\nfunction buildColumns(handlers: ColumnHandlers): DataTableColumnDef<ClientRow>[] {\r\n return [\r\n { field: \"id\", headerName: \"ID\", type: \"text\", width: 130 },\r\n {\r\n field: \"name\",\r\n headerName: \"Nome\",\r\n type: \"user\",\r\n sortable: true,\r\n width: 220,\r\n typeOptions: {\r\n users: Object.fromEntries(\r\n CLIENTS_87.map((c) => [\r\n c.name,\r\n {\r\n name: c.name,\r\n initials: c.initials,\r\n color: c.avatarColor,\r\n },\r\n ]),\r\n ),\r\n },\r\n valueGetter: (row) => row.name,\r\n },\r\n {\r\n field: \"email\",\r\n headerName: \"Email\",\r\n type: \"email\",\r\n enableColumnFilter: true,\r\n filterType: \"text\",\r\n },\r\n {\r\n field: \"phone\",\r\n headerName: \"Telefone\",\r\n type: \"phone\",\r\n },\r\n {\r\n field: \"statusId\",\r\n headerName: \"Status\",\r\n type: \"status\",\r\n enableColumnFilter: true,\r\n filterType: \"multiSelect\",\r\n filterOptions: STATUS_OPTIONS,\r\n },\r\n {\r\n field: \"categoryId\",\r\n headerName: \"Categoria\",\r\n type: \"badge\",\r\n enableColumnFilter: true,\r\n filterType: \"multiSelect\",\r\n filterOptions: CATEGORY_OPTIONS,\r\n },\r\n {\r\n field: \"agentId\",\r\n headerName: \"Atribuído\",\r\n type: \"user\",\r\n enableColumnFilter: true,\r\n filterType: \"select\",\r\n filterOptions: AGENT_OPTIONS,\r\n typeOptions: { users: AGENTS_LOOKUP },\r\n },\r\n {\r\n field: \"value\",\r\n headerName: \"Valor\",\r\n type: \"currency\",\r\n sortable: true,\r\n enableColumnFilter: true,\r\n filterType: \"number\",\r\n aggregate: \"sum\",\r\n aggregateFormatter: (v) =>\r\n new Intl.NumberFormat(\"pt-BR\", { style: \"currency\", currency: \"BRL\" }).format(v),\r\n },\r\n {\r\n field: \"createdAt\",\r\n headerName: \"Criado em\",\r\n type: \"date\",\r\n sortable: true,\r\n enableColumnFilter: true,\r\n filterType: \"date\",\r\n width: 130,\r\n },\r\n {\r\n field: \"lastContact\",\r\n headerName: \"Último contato\",\r\n type: \"date\",\r\n sortable: true,\r\n width: 150,\r\n },\r\n {\r\n field: \"location\",\r\n headerName: \"Localização\",\r\n type: \"text\",\r\n minWidth: 150,\r\n },\r\n {\r\n field: \"_actions\",\r\n headerName: \"\",\r\n type: \"actions\",\r\n width: 64,\r\n pinned: \"right\",\r\n getActions: ({ row }) => [\r\n {\r\n id: \"edit\",\r\n label: \"Editar\",\r\n icon: <Pencil />,\r\n showInMenu: true,\r\n onClick: () => console.log(\"Editar\", row.id),\r\n },\r\n {\r\n id: \"whatsapp\",\r\n label: \"Abrir atendimento (WhatsApp)\",\r\n icon: <MessageSquare />,\r\n showInMenu: true,\r\n onClick: () => console.log(\"Atendimento\", row.id),\r\n },\r\n {\r\n id: \"archive\",\r\n label: \"Arquivar\",\r\n icon: <Archive />,\r\n showInMenu: true,\r\n onClick: () => console.log(\"Arquivar\", row.id),\r\n },\r\n {\r\n id: \"delete\",\r\n label: \"Excluir cliente\",\r\n icon: <Trash2 />,\r\n showInMenu: true,\r\n destructive: true,\r\n onClick: () => handlers.onAskDelete(row),\r\n },\r\n ],\r\n },\r\n ];\r\n}\r\n\r\n/ ── Saved views / Presets — tabs do toolbar ───────────────────── /\r\n\r\nconst DEFAULT_VIEWS: DataTablePresetView[] = [\r\n presetView({\r\n id: \"preset:meus\",\r\n name: \"Meus\",\r\n filters: [{ field: \"agentId\", value: \"you\" }],\r\n }),\r\n presetView({\r\n id: \"preset:ativos\",\r\n name: \"Ativos\",\r\n filters: [{ field: \"statusId\", value: \"active\" }],\r\n }),\r\n presetView({\r\n id: \"preset:royals\",\r\n name: \"Royals\",\r\n filters: [{ field: \"categoryId\", value: \"royal\" }],\r\n }),\r\n presetView({\r\n id: \"preset:ultimos-7-dias\",\r\n name: \"Últimos 7 dias\",\r\n sort: [{ field: \"createdAt\", direction: \"desc\" }],\r\n }),\r\n];\r\n\r\n/ ── Filtros iniciais (Status=Ativo + Categoria=Royal — print) ─── /\r\n\r\n// statusId e categoryId são filterType=\"multiSelect\" — operator correto é \"isAnyOf\"\r\n// (not \"equals\"). Sem isso, o popover Filtros mostrava o Select de operador VAZIO\r\n// porque \"equals\" não está nos operators de MultiSelectColumnType.\r\nconst INITIAL_FILTERS: FilterModel = {\r\n items: [\r\n { id: \"filter-status-ativo\", field: \"statusId\", operator: \"isAnyOf\", value: \"active\" },\r\n { id: \"filter-categoria-royal\", field: \"categoryId\", operator: \"isAnyOf\", value: \"royal\" },\r\n ],\r\n logicOperator: \"AND\",\r\n};\r\n\r\n/ ── Kanban config (renderCard com JSX) ────────────────────────── /\r\n\r\nconst KANBAN_CONFIG: DataTableKanbanConfig<ClientRow> = {\r\n groupByField: \"statusId\",\r\n columns: KANBAN_COLUMNS,\r\n renderCard: ({ row }) => {\r\n const cat = CATEGORIES[row.categoryId as keyof typeof CATEGORIES];\r\n const agent = AGENTS[row.agentId as keyof typeof AGENTS];\r\n const agentInitials = agent?.name.split(\" \").map((s) => s[0]).join(\"\").slice(0, 2) ?? \"?\";\r\n return {\r\n title: row.name,\r\n subtitle: row.id,\r\n avatar: (\r\n <Avatar className=\"size-[28px]\" style={{ background: row.avatarColor }}>\r\n <AvatarFallback className=\"bg-transparent text-white text-caption-sm font-bold\">\r\n {row.initials}\r\n </AvatarFallback>\r\n </Avatar>\r\n ),\r\n chip: cat ? (\r\n <Chip\r\n color={CATEGORY_KIND[row.categoryId] ?? \"info\"}\r\n variant=\"soft\"\r\n size=\"sm\"\r\n shape=\"pill\"\r\n >\r\n {cat.label}\r\n </Chip>\r\n ) : null,\r\n value: formatBRL(row.value),\r\n footerLeft: agent ? (\r\n <span className=\"inline-flex items-center gap-gp-sm min-w-0 flex-1\">\r\n <Avatar className=\"size-[22px]\" style={{ background: agent.color }}>\r\n <AvatarFallback className=\"bg-transparent text-white text-caption-xs font-bold\">\r\n {agentInitials}\r\n </AvatarFallback>\r\n </Avatar>\r\n <span className=\"text-body-xs font-normal text-fg-muted whitespace-nowrap overflow-hidden text-ellipsis\">\r\n {agent.name}\r\n </span>\r\n </span>\r\n ) : null,\r\n footerRight: (\r\n <span className=\"inline-flex items-center gap-[4px] text-caption-sm text-fg-muted [font-variant-numeric:tabular-nums] shrink-0\">\r\n <Clock size={11} strokeWidth={1.8} aria-hidden />\r\n {formatShortDate(row.lastContact)}\r\n </span>\r\n ),\r\n };\r\n },\r\n};\r\n\r\n/ ═══════════════════════════════════════════════════════════════════════════\r\n Page — Clientes (showcase usando AppShell + DataTable real)\r\n ═══════════════════════════════════════════════════════════════════════════ /\r\n\r\ntype ConfirmDeleteState = {\r\n ids: string[];\r\n label: string;\r\n /* Callback opcional após confirmar — usado pelo bulk pra limpar seleção. /\r\n onAfter?: () => void;\r\n} \| null;\r\n\r\nexport default function ClientesShowcase() {\r\n const { theme, setTheme } = useTheme();\r\n const [rows, setRows] = useState<ClientRow[]>(() => CLIENTS_87);\r\n const [layout, setLayout] = useState<string>(\"fluid\");\r\n const [filterModel, setFilterModel] = useState<FilterModel>(INITIAL_FILTERS);\r\n const [viewMode, setViewMode] = useState<DataTableViewMode>(\"table\");\r\n const [novoClienteOpen, setNovoClienteOpen] = useState(false);\r\n const [detailRowId, setDetailRowId] = useState<string \| null>(null);\r\n const [confirmDelete, setConfirmDelete] = useState<ConfirmDeleteState>(null);\r\n const detailRow = detailRowId ? rows.find((r) => r.id === detailRowId) ?? null : null;\r\n const tableRef = useRef<DataTableRef>(null);\r\n\r\n const askDelete = useCallback(\r\n (row: ClientRow) =>\r\n setConfirmDelete({ ids: [row.id], label: row.name }),\r\n [],\r\n );\r\n\r\n const askBulkDelete = useCallback(\r\n (ids: string[], onAfter: () => void) =>\r\n setConfirmDelete({\r\n ids,\r\n label: `${ids.length} cliente${ids.length === 1 ? \"\" : \"s\"}`,\r\n onAfter,\r\n }),\r\n [],\r\n );\r\n\r\n const handleConfirmDelete = useCallback(() => {\r\n if (!confirmDelete) return;\r\n const ids = new Set(confirmDelete.ids);\r\n setRows((prev) => prev.filter((r) => !ids.has(r.id)));\r\n if (detailRowId && ids.has(detailRowId)) setDetailRowId(null);\r\n confirmDelete.onAfter?.();\r\n setConfirmDelete(null);\r\n }, [confirmDelete, detailRowId]);\r\n\r\n const columns = useMemo(\r\n () => buildColumns({ onAskDelete: askDelete }),\r\n [askDelete],\r\n );\r\n\r\n return (\r\n <AppShell\r\n contexts={APP_SHELL_CONTEXTS}\r\n defaultActiveContextId=\"inbox\"\r\n defaultActiveItemHref=\"#atendimentos\"\r\n breadcrumb={[{ label: \"Atendimentos\" }]}\r\n commandGroups={APP_SHELL_COMMANDS}\r\n notifications={{\r\n items: APP_SHELL_NOTIFICATIONS,\r\n onMarkAllRead: () => alert(\"Marcar todas como lidas\"),\r\n onMoreActions: () => alert(\"Mais ações\"),\r\n onViewAll: () => alert(\"Ver todas\"),\r\n }}\r\n messages={{\r\n items: APP_SHELL_MESSAGES,\r\n onNewMessage: () => alert(\"Nova mensagem\"),\r\n onExpand: () => alert(\"Expandir\"),\r\n onViewAll: () => alert(\"Ver todas\"),\r\n }}\r\n theme={theme}\r\n onThemeChange={(id) => setTheme(id as Theme)}\r\n themeOptions={APP_SHELL_THEME_OPTIONS}\r\n user={APP_SHELL_USER}\r\n layout={layout}\r\n onLayoutChange={setLayout}\r\n layoutOptions={APP_SHELL_LAYOUT_OPTIONS}\r\n onSettings={() => alert(\"Abrir Configurações\")}\r\n onLogout={() => alert(\"Sair (mock)\")}\r\n >\r\n <PageHeader\r\n title=\"Clientes\"\r\n description=\"Gerencie sua base de clientes, acompanhe status de cadastro e abra atendimentos diretos pelo WhatsApp.\"\r\n badge={\r\n <Chip color=\"primary\" variant=\"soft\" size=\"sm\" shape=\"rounded\">\r\n {rows.length.toLocaleString(\"pt-BR\")} registros\r\n </Chip>\r\n }\r\n actions={\r\n <>\r\n <Button\r\n variant=\"outline\"\r\n color=\"secondary\"\r\n size=\"icon-md\"\r\n aria-label=\"Mais ações\"\r\n onClick={() => alert(\"Mais ações\")}\r\n >\r\n <MoreHorizontal />\r\n </Button>\r\n <Button\r\n variant=\"filled\"\r\n color=\"primary\"\r\n size=\"md\"\r\n iconLeft={<Plus />}\r\n onClick={() => setNovoClienteOpen(true)}\r\n >\r\n Novo cliente\r\n </Button>\r\n </>\r\n }\r\n />\r\n\r\n {/ DataTable — ocupa o resto do body ──────────────────────── /}\r\n <DataTable<ClientRow>\r\n ref={tableRef}\r\n rows={rows}\r\n columns={columns}\r\n getRowId={(r) => r.id}\r\n persistId=\"showcase-clientes-crud\"\r\n defaultViews={DEFAULT_VIEWS}\r\n / Chips de filtro VAZIOS já visíveis no load (\"Atribuído\") — a afordância\r\n aparece sem abrir o menu; o usuário clica e preenche. Filtro é recurso\r\n da tabela (nativo), nunca form/select acima dela. /\r\n showEmptyFilterChips={[\"agentId\"]}\r\n filterModel={filterModel}\r\n onFilterModelChange={setFilterModel}\r\n viewMode={viewMode}\r\n onViewModeChange={setViewMode}\r\n kanbanConfig={KANBAN_CONFIG}\r\n toolbar={{\r\n enableSearch: true,\r\n enableFilters: true,\r\n enableColumns: true,\r\n enableDensity: true,\r\n enableExport: true,\r\n moreMenu: {\r\n items: [\r\n {\r\n id: \"fullscreen\",\r\n label: \"Tela cheia\",\r\n icon: <Maximize2 />,\r\n onSelect: () => alert(\"Tela cheia\"),\r\n },\r\n {\r\n id: \"duplicate\",\r\n label: \"Duplicar visualização\",\r\n icon: <Copy />,\r\n onSelect: () => alert(\"Duplicar visualização\"),\r\n },\r\n {\r\n id: \"import\",\r\n label: \"Importar CSV\",\r\n icon: <Upload />,\r\n onSelect: () => alert(\"Importar CSV\"),\r\n },\r\n {\r\n id: \"reset\",\r\n label: \"Resetar visualização\",\r\n icon: <RotateCcw />,\r\n destructive: true,\r\n onSelect: () => tableRef.current?.resetPersistedState(),\r\n },\r\n ],\r\n },\r\n }}\r\n paginationConfig={{\r\n enabled: true,\r\n initialPageSize: 10,\r\n pageSizeOptions: [10, 25, 50, 100],\r\n }}\r\n selectionConfig={{\r\n enabled: true,\r\n enableGlobal: true,\r\n actions: (selectedIds, clearSelection) => (\r\n <>\r\n <BulkActionButton\r\n icon={<Download />}\r\n onClick={() => tableRef.current?.exportCsv(\"selected\")}\r\n >\r\n Exportar\r\n </BulkActionButton>\r\n <BulkActionButton\r\n icon={<Trash2 />}\r\n variant=\"danger\"\r\n onClick={() => askBulkDelete(selectedIds.map(String), clearSelection)}\r\n >\r\n Excluir\r\n </BulkActionButton>\r\n </>\r\n ),\r\n }}\r\n onCellEditCommit={async ({ id, field, value }) => {\r\n await new Promise((res) => setTimeout(res, 400));\r\n setRows((prev) =>\r\n prev.map((r) => (r.id === id ? { ...r, [field]: value } : r)),\r\n );\r\n }}\r\n onRowClick={(row) => setDetailRowId(row.id)}\r\n className=\"flex-1 min-h-0\"\r\n />\r\n\r\n {/ Drawer \"Novo cliente\" — controlado pelo botão do header /}\r\n <NovoClienteDrawer\r\n open={novoClienteOpen}\r\n onOpenChange={setNovoClienteOpen}\r\n onSubmit={(data) => {\r\n console.log(\"Novo cliente:\", data);\r\n alert(`Cliente \"${data.name}\" criado (mock)`);\r\n }}\r\n />\r\n\r\n {/ DetailDrawer — abre ao clicar numa row, slide-in da direita SEM\r\n backdrop modal (tabela continua interativa atrás). /}\r\n <DetailDrawer\r\n row={detailRow}\r\n onClose={() => setDetailRowId(null)}\r\n onEdit={(r) => console.log(\"Editar\", r.id)}\r\n onDelete={(r) => askDelete(r)}\r\n onSave={(r) => alert(`Salvar alterações em ${r.name} (mock)`)}\r\n />\r\n\r\n {/ AlertModal de confirmação de exclusão — compartilhado entre\r\n row action menu, bulk action e DetailDrawer.onDelete. */}\r\n <AlertModal\r\n open={confirmDelete !== null}\r\n onOpenChange={(open) => {\r\n if (!open) setConfirmDelete(null);\r\n }}\r\n tone=\"danger\"\r\n title={\r\n confirmDelete && confirmDelete.ids.length > 1\r\n ? `Excluir ${confirmDelete.label}?`\r\n : \"Excluir cliente?\"\r\n }\r\n description={\r\n confirmDelete\r\n ? confirmDelete.ids.length > 1\r\n ? `Esta ação não pode ser desfeita. ${confirmDelete.label} serão removidos permanentemente.`\r\n : `Esta ação não pode ser desfeita. \"${confirmDelete.label}\" será removido permanentemente.`\r\n : null\r\n }\r\n confirmLabel=\"Excluir\"\r\n cancelLabel=\"Cancelar\"\r\n onConfirm={handleConfirmDelete}\r\n />\r\n </AppShell>\r\n );\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist-lib/preview/dashboard.cjs CHANGED Viewed

@@ -2,12 +2,11 @@
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
-const useTheme = require("../chunks/useTheme-Dee4mo-A.cjs");
+const useTheme = require("../chunks/useTheme-D4alxxGV.cjs");
 const lucideReact = require("lucide-react");
 const recharts = require("recharts");
-const appShell = require("../chunks/app-shell-Cyh8AUJT.cjs");
-const pageHeader = require("../chunks/page-header-D0rpU0yn.cjs");
-const kpiDelta = require("../chunks/kpi-delta-C_3V6uG6.cjs");
+const pageHeader = require("../chunks/page-header-BMzUloFi.cjs");
+const kpiDelta = require("../chunks/kpi-delta-DrSJPMCY.cjs");
 const appShellMocks = require("../chunks/app-shell-mocks-oO_IV3Gw.cjs");
 const BRAZIL_VIEWBOX = "0 0 1000 912";
 const BRAZIL_PATHS = [
@@ -208,7 +207,7 @@ function KpiCard({ kpi }) {
       /* @__PURE__ */ jsxRuntime.jsx(
         "span",
         {
-          className: appShell.cn(
+          className: useTheme.cn(
             "grid place-items-center size-form-lg rounded-radius-lg shrink-0",
             cls.bg,
             cls.fg
@@ -222,7 +221,7 @@ function KpiCard({ kpi }) {
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-gp-md flex-wrap", children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-body-2xl font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]", children: kpi.value }),
         kpi.delta && /* @__PURE__ */ jsxRuntime.jsx(
-          appShell.Chip,
+          useTheme.Chip,
           {
             color: kpi.delta.positive ? "success" : "danger",
             variant: "soft",
@@ -248,7 +247,7 @@ function WelcomeBanner() {
       "Snapshot rápido das principais métricas do atendimento."
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(
-      appShell.Button,
+      useTheme.Button,
       {
         color: "secondary",
         variant: "filled",
@@ -264,12 +263,12 @@ function KeyInsightsCard() {
   return /* @__PURE__ */ jsxRuntime.jsxs("article", { className: "flex flex-col gap-gp-md p-pad-3xl bg-bg-surface border border-border-subtle rounded-radius-xl shadow-sh-sm h-full", children: [
     /* @__PURE__ */ jsxRuntime.jsxs("header", { className: "flex items-center justify-between gap-gp-md", children: [
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "m-0 text-body-md font-medium text-fg-default", children: "Key Insights" }),
-      /* @__PURE__ */ jsxRuntime.jsx(appShell.Button, { color: "secondary", variant: "ghost", size: "icon-sm", "aria-label": "Mais opções", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreVertical, {}) })
+      /* @__PURE__ */ jsxRuntime.jsx(useTheme.Button, { color: "secondary", variant: "ghost", size: "icon-sm", "aria-label": "Mais opções", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreVertical, {}) })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx("p", { className: "m-0 text-body-xs font-normal text-fg-muted", children: "Receita acumulada (anual)" }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-gp-md flex-wrap", children: [
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-body-2xl font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]", children: "R$ 395.7k" }),
-      /* @__PURE__ */ jsxRuntime.jsx(appShell.Chip, { color: "success", variant: "soft", size: "sm", shape: "pill", children: "+2.7%" })
+      /* @__PURE__ */ jsxRuntime.jsx(useTheme.Chip, { color: "success", variant: "soft", size: "sm", shape: "pill", children: "+2.7%" })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-auto flex flex-col gap-gp-md", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-[8px] gap-[2px] rounded-radius-full overflow-hidden", children: [
@@ -304,7 +303,7 @@ function SectionCard({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "section",
     {
-      className: appShell.cn(
+      className: useTheme.cn(
         "flex flex-col gap-gp-2xl p-pad-3xl bg-bg-surface border border-border-subtle rounded-radius-xl shadow-sh-sm",
         className
       ),
@@ -314,7 +313,7 @@ function SectionCard({
             /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "m-0 text-body-md font-medium text-fg-default", children: title }),
             subtitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "m-0 text-body-xs font-normal text-fg-muted", children: subtitle })
           ] }),
-          action ?? /* @__PURE__ */ jsxRuntime.jsx(appShell.Button, { color: "secondary", variant: "ghost", size: "icon-sm", "aria-label": "Mais opções", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreVertical, {}) })
+          action ?? /* @__PURE__ */ jsxRuntime.jsx(useTheme.Button, { color: "secondary", variant: "ghost", size: "icon-sm", "aria-label": "Mais opções", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreVertical, {}) })
         ] }),
         children
       ]
@@ -340,7 +339,7 @@ function VolumeStackedChart() {
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-gp-md flex-wrap", children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline gap-gp-md flex-wrap", children: [
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-body-2xl font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]", children: "R$ 395.7k" }),
-        /* @__PURE__ */ jsxRuntime.jsx(appShell.Chip, { color: "success", variant: "soft", size: "sm", shape: "pill", children: "+18%" }),
+        /* @__PURE__ */ jsxRuntime.jsx(useTheme.Chip, { color: "success", variant: "soft", size: "sm", shape: "pill", children: "+18%" }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-body-xs font-normal text-fg-muted", children: "vs ano passado" })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-auto flex items-center gap-gp-md", children: [
@@ -352,7 +351,7 @@ function VolumeStackedChart() {
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "size-[8px] rounded-radius-full bg-bg-brand-subtle", "aria-hidden": true }),
           " IA"
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(appShell.Button, { color: "secondary", variant: "outline", size: "sm", iconRight: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, {}), children: "2026" })
+        /* @__PURE__ */ jsxRuntime.jsx(useTheme.Button, { color: "secondary", variant: "outline", size: "sm", iconRight: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, {}), children: "2026" })
       ] })
     ] }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: "100%", height: 280 }, children: /* @__PURE__ */ jsxRuntime.jsx(recharts.ResponsiveContainer, { children: /* @__PURE__ */ jsxRuntime.jsxs(
@@ -460,7 +459,7 @@ function CurrentVisitsCard() {
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 text-body-xs text-fg-default", children: r.name }),
       /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-body-xs font-normal text-fg-default [font-variant-numeric:tabular-nums]", children: r.value.toLocaleString("pt-BR") }),
       /* @__PURE__ */ jsxRuntime.jsx(
-        appShell.Chip,
+        useTheme.Chip,
         {
           color: r.positive ? "success" : "danger",
           variant: "soft",
@@ -474,7 +473,7 @@ function CurrentVisitsCard() {
 }
 function PersonAvatar({ initials, hex, size = "md" }) {
   const cls = size === "sm" ? "size-[24px] text-caption-xs" : "size-[32px] text-body-xs font-normal";
-  return /* @__PURE__ */ jsxRuntime.jsx(appShell.Avatar, { className: cls, style: { background: hex }, children: /* @__PURE__ */ jsxRuntime.jsx(appShell.AvatarFallback, { className: "bg-transparent text-white font-bold", children: initials }) });
+  return /* @__PURE__ */ jsxRuntime.jsx(useTheme.Avatar, { className: cls, style: { background: hex }, children: /* @__PURE__ */ jsxRuntime.jsx(useTheme.AvatarFallback, { className: "bg-transparent text-white font-bold", children: initials }) });
 }
 function OpenConversationsList() {
   return /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "m-0 p-0 list-none flex flex-col", children: OPEN_CONVS.map((c) => {
@@ -502,7 +501,7 @@ function OpenConversationsList() {
             ] })
           ] }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-end gap-[4px] shrink-0", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(appShell.Chip, { color: STATUS_TONE[c.status], variant: "soft", size: "sm", shape: "pill", children: STATUS_LABEL[c.status] }),
+            /* @__PURE__ */ jsxRuntime.jsx(useTheme.Chip, { color: STATUS_TONE[c.status], variant: "soft", size: "sm", shape: "pill", children: STATUS_LABEL[c.status] }),
             /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center gap-[3px] text-caption-sm text-fg-muted [font-variant-numeric:tabular-nums]", children: [
               /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, { size: 10, strokeWidth: 1.8, "aria-hidden": true }),
               c.waitTime
@@ -526,7 +525,7 @@ function AgentPerformanceList() {
           /* @__PURE__ */ jsxRuntime.jsx(
             "span",
             {
-              className: appShell.cn(
+              className: useTheme.cn(
                 "absolute -bottom-[1px] -right-[1px] size-[8px] rounded-radius-full border border-bg-surface",
                 a.active ? "bg-bg-success" : "bg-bg-muted"
               ),
@@ -576,7 +575,7 @@ function ChannelPerformanceList() {
               " mensagens"
             ] })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx(appShell.Chip, { color: CHANNEL_STATUS_TONE[c.status], variant: "soft", size: "sm", shape: "pill", children: CHANNEL_STATUS_LABEL[c.status] })
+          /* @__PURE__ */ jsxRuntime.jsx(useTheme.Chip, { color: CHANNEL_STATUS_TONE[c.status], variant: "soft", size: "sm", shape: "pill", children: CHANNEL_STATUS_LABEL[c.status] })
         ]
       },
       c.id
@@ -745,7 +744,7 @@ function MetricKpi({ label, value, sub, tone = "neutral" }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-radius-lg border border-border-subtle bg-bg-muted px-pad-xl py-pad-lg", children: [
     /* @__PURE__ */ jsxRuntime.jsx("p", { className: "truncate text-caption-md text-fg-muted", children: label }),
     /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-gp-2xs text-[22px] font-bold leading-tight tabular-nums text-fg-default", children: value }),
-    sub && /* @__PURE__ */ jsxRuntime.jsx("p", { className: appShell.cn(
+    sub && /* @__PURE__ */ jsxRuntime.jsx("p", { className: useTheme.cn(
       "mt-gp-2xs text-caption-sm font-medium",
       tone === "up" ? "text-fg-success" : tone === "warn" ? "text-fg-warning" : "text-fg-muted"
     ), children: sub })
@@ -796,7 +795,7 @@ function DashboardShowcase() {
   const { theme, setTheme } = useTheme.useTheme();
   const [period, setPeriod] = React.useState("Últimos 7 dias");
   return /* @__PURE__ */ jsxRuntime.jsxs(
-    appShell.AppShell,
+    useTheme.AppShell,
     {
       contexts: appShellMocks.APP_SHELL_CONTEXTS,
       defaultActiveContextId: "inbox",
@@ -824,10 +823,10 @@ function DashboardShowcase() {
           {
             title: "Dashboard",
             description: "Visão geral do atendimento em tempo real — KPIs, volume, canais e performance da equipe.",
-            badge: /* @__PURE__ */ jsxRuntime.jsx(appShell.Chip, { color: "primary", variant: "soft", size: "sm", shape: "pill", children: "Hoje" }),
+            badge: /* @__PURE__ */ jsxRuntime.jsx(useTheme.Chip, { color: "primary", variant: "soft", size: "sm", shape: "pill", children: "Hoje" }),
             actions: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
               /* @__PURE__ */ jsxRuntime.jsx(
-                appShell.Button,
+                useTheme.Button,
                 {
                   color: "secondary",
                   variant: "outline",
@@ -837,7 +836,7 @@ function DashboardShowcase() {
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsx(
-                appShell.Button,
+                useTheme.Button,
                 {
                   color: "secondary",
                   variant: "outline",
@@ -911,7 +910,7 @@ function DashboardShowcase() {
             {
               title: "Atendimentos em aberto",
               subtitle: "5 ativos agora",
-              action: /* @__PURE__ */ jsxRuntime.jsx(appShell.Button, { color: "secondary", variant: "ghost", size: "sm", children: "Ver todos" }),
+              action: /* @__PURE__ */ jsxRuntime.jsx(useTheme.Button, { color: "secondary", variant: "ghost", size: "sm", children: "Ver todos" }),
               children: /* @__PURE__ */ jsxRuntime.jsx(OpenConversationsList, {})
             }
           ),
@@ -920,7 +919,7 @@ function DashboardShowcase() {
             {
               title: "Performance da equipe",
               subtitle: "Ranking de hoje",
-              action: /* @__PURE__ */ jsxRuntime.jsx(appShell.Button, { color: "secondary", variant: "ghost", size: "sm", children: "Ver equipe" }),
+              action: /* @__PURE__ */ jsxRuntime.jsx(useTheme.Button, { color: "secondary", variant: "ghost", size: "sm", children: "Ver equipe" }),
               children: /* @__PURE__ */ jsxRuntime.jsx(AgentPerformanceList, {})
             }
           )