npm - @snksergio/design-system - Versions diffs - 0.1.0 → 0.4.0 - Mend

@snksergio/design-system 0.1.0 → 0.4.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 (73) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"dashboard.cjs","sources":["../../src/preview/pages/DashboardShowcase.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { useTheme, type Theme } from \"@/hooks/useTheme\";\nimport type { LucideIcon } from \"lucide-react\";\nimport {\n ArrowRight,\n ArrowUpRight,\n ArrowDownRight,\n Bot,\n Calendar,\n CheckCircle2,\n ChevronDown,\n Clock,\n Headphones,\n Mail,\n MessageSquare,\n MoreVertical,\n Phone,\n Search,\n Send,\n Star,\n Sun,\n Timer,\n TrendingUp,\n UserPlus,\n} from \"lucide-react\";\nimport {\n Bar,\n BarChart,\n CartesianGrid,\n Cell,\n Pie,\n PieChart,\n ResponsiveContainer,\n Tooltip,\n XAxis,\n YAxis,\n} from \"recharts\";\nimport { cn } from \"@/lib/utils\";\nimport { AppShell } from \"@/components/ui/AppShell\";\nimport { Button } from \"@/components/ui/Button/button\";\nimport { Chip } from \"@/components/ui/Chip\";\nimport { PageHeader } from \"@/components/ui/PageHeader\";\nimport { Avatar, AvatarFallback } from \"@/components/shadcn/avatar\";\nimport {\n APP_SHELL_CONTEXTS,\n APP_SHELL_COMMANDS,\n APP_SHELL_NOTIFICATIONS,\n APP_SHELL_MESSAGES,\n APP_SHELL_THEME_OPTIONS,\n} from \"../mocks/app-shell-mocks\";\n\n/* ─────────────────────────────────────────────────────────────\n * Tipos + mock data — call center + analytics\n * ───────────────────────────────────────────────────────────── /\n\ntype KpiTone = \"brand\" \| \"success\" \| \"warning\" \| \"info\" \| \"danger\" \| \"neutral\";\n\ntype KpiCardData = {\n id: string;\n title: string;\n value: string;\n delta?: { value: string; direction: \"up\" \| \"down\"; positive: boolean; label: string };\n icon: LucideIcon;\n tone: KpiTone;\n};\n\nconst KPIS_PRIMARY: KpiCardData[] = [\n { id: \"in-conv\", title: \"Em atendimento\", value: \"12\",\n delta: { value: \"+3\", direction: \"up\", positive: true, label: \"vs ontem\" },\n icon: Phone, tone: \"success\" },\n { id: \"waiting\", title: \"Em espera\", value: \"4\",\n delta: { value: \"+1\", direction: \"up\", positive: false, label: \"vs ontem\" },\n icon: Timer, tone: \"warning\" },\n { id: \"finished\", title: \"Resolvidos hoje\", value: \"87\",\n delta: { value: \"+12%\", direction: \"up\", positive: true, label: \"vs semana\" },\n icon: CheckCircle2, tone: \"info\" },\n { id: \"new\", title: \"Novos contatos\", value: \"260\",\n delta: { value: \"+24\", direction: \"up\", positive: true, label: \"vs ontem\" },\n icon: UserPlus, tone: \"brand\" },\n { id: \"talk\", title: \"Tempo médio atend.\", value: \"4m 32s\",\n delta: { value: \"-12s\", direction: \"down\", positive: true, label: \"melhorou\" },\n icon: Clock, tone: \"neutral\" },\n { id: \"wait\", title: \"Tempo médio espera\", value: \"1m 18s\",\n delta: { value: \"-8s\", direction: \"down\", positive: true, label: \"melhorou\" },\n icon: Timer, tone: \"neutral\" },\n];\n\nconst KPIS_QUALITY: KpiCardData[] = [\n { id: \"frt\", title: \"First Response Time\", value: \"42s\",\n delta: { value: \"-5s\", direction: \"down\", positive: true, label: \"melhorou\" },\n icon: TrendingUp, tone: \"info\" },\n { id: \"csat\", title: \"CSAT\", value: \"4.7\",\n delta: { value: \"+0.2\", direction: \"up\", positive: true, label: \"vs semana\" },\n icon: Star, tone: \"warning\" },\n { id: \"nps\", title: \"NPS\", value: \"68\",\n delta: { value: \"+5\", direction: \"up\", positive: true, label: \"vs mês\" },\n icon: Headphones, tone: \"success\" },\n { id: \"ai\", title: \"Resolvido por IA\", value: \"32%\",\n delta: { value: \"+4%\", direction: \"up\", positive: true, label: \"vs semana\" },\n icon: Bot, tone: \"brand\" },\n];\n\n/ Volume — stacked bars (2 séries: humano + IA) /\nconst VOLUME_BY_MONTH = [\n { m: \"Jan\", human: 2400, ai: 1200 },\n { m: \"Feb\", human: 4000, ai: 2800 },\n { m: \"Mar\", human: 3500, ai: 2200 },\n { m: \"Apr\", human: 3800, ai: 2900 },\n { m: \"May\", human: 2700, ai: 2300 },\n { m: \"Jun\", human: 3200, ai: 2700 },\n { m: \"Jul\", human: 2600, ai: 2700 },\n { m: \"Aug\", human: 4500, ai: 3200 },\n { m: \"Sep\", human: 2800, ai: 2700 },\n { m: \"Oct\", human: 4200, ai: 2300 },\n { m: \"Nov\", human: 2600, ai: 2700 },\n { m: \"Dec\", human: 3000, ai: 4000 },\n];\n\n/ Current Visits — origem dos atendimentos (regiões/cidades) /\nconst REGIONS = [\n { name: \"São Paulo\", value: 1650, color: \"var(--color-fg-brand)\", delta: \"+4.7%\", positive: true },\n { name: \"Rio de Janeiro\", value: 350, color: \"var(--color-fg-warning)\", delta: \"+2.1%\", positive: true },\n { name: \"Belo Horizonte\", value: 498, color: \"var(--color-fg-info)\", delta: \"-1.7%\", positive: false },\n];\n\n/ Channels — lista estilo Campaign Performance /\ntype ChannelKind = \"whatsapp\" \| \"telegram\" \| \"instagram\" \| \"email\" \| \"webchat\";\n\nconst CHANNELS: { id: ChannelKind; name: string; volume: string; color: string; icon: LucideIcon; status: \"active\" \| \"paused\" \| \"off\" }[] = [\n { id: \"whatsapp\", name: \"WhatsApp\", volume: \"8.49k\", color: \"#25d366\", icon: MessageSquare, status: \"active\" },\n { id: \"instagram\", name: \"Instagram\", volume: \"6.98k\", color: \"#e1306c\", icon: MessageSquare, status: \"active\" },\n { id: \"telegram\", name: \"Telegram\", volume: \"3.21k\", color: \"#0088cc\", icon: Send, status: \"paused\" },\n { id: \"email\", name: \"Email\", volume: \"2.14k\", color: \"#8754ec\", icon: Mail, status: \"active\" },\n { id: \"webchat\", name: \"Web Chat\", volume: \"1.50k\", color: \"#0a3a2e\", icon: MessageSquare, status: \"off\" },\n];\n\nconst CHANNEL_STATUS_LABEL: Record<\"active\" \| \"paused\" \| \"off\", string> = {\n active: \"Ativo\",\n paused: \"Pausado\",\n off: \"Desligado\",\n};\n\nconst CHANNEL_STATUS_TONE: Record<\"active\" \| \"paused\" \| \"off\", \"success\" \| \"warning\" \| \"neutral\"> = {\n active: \"success\",\n paused: \"warning\",\n off: \"neutral\",\n};\n\n/ Open conversations — atendimentos ativos /\ntype OpenConv = {\n id: string;\n name: string;\n initials: string;\n hex: string;\n channel: ChannelKind;\n status: \"attending\" \| \"waiting\" \| \"ai\";\n waitTime: string;\n agent?: { initials: string; name: string; hex: string };\n};\n\nconst OPEN_CONVS: OpenConv[] = [\n { id: \"#A-2453\", name: \"Maria Hernandez\", initials: \"MH\", hex: \"#f59e0b\", channel: \"whatsapp\", status: \"attending\", waitTime: \"2m\", agent: { initials: \"AC\", name: \"Aline Castro\", hex: \"#f59e0b\" } },\n { id: \"#A-2455\", name: \"James Johnson\", initials: \"JJ\", hex: \"#0a3a2e\", channel: \"telegram\", status: \"waiting\", waitTime: \"8m\" },\n { id: \"#A-2458\", name: \"Camila Ribeiro\", initials: \"CR\", hex: \"#8754ec\", channel: \"instagram\", status: \"attending\", waitTime: \"1m\", agent: { initials: \"VC\", name: \"Você\", hex: \"#0a3a2e\" } },\n { id: \"#A-2461\", name: \"Roberto Souza\", initials: \"RS\", hex: \"#0088cc\", channel: \"whatsapp\", status: \"ai\", waitTime: \"3m\" },\n { id: \"#A-2466\", name: \"Ana Costa\", initials: \"AC\", hex: \"#1cb280\", channel: \"email\", status: \"waiting\", waitTime: \"14m\" },\n];\n\nconst STATUS_LABEL: Record<OpenConv[\"status\"], string> = {\n attending: \"Em atendimento\",\n waiting: \"Em espera\",\n ai: \"IA\",\n};\n\nconst STATUS_TONE: Record<OpenConv[\"status\"], \"success\" \| \"warning\" \| \"info\"> = {\n attending: \"success\",\n waiting: \"warning\",\n ai: \"info\",\n};\n\n/ Agents /\ntype AgentRow = {\n id: string;\n name: string;\n initials: string;\n hex: string;\n active: boolean;\n resolved: number;\n avgTime: string;\n csat: number;\n};\n\nconst AGENTS: AgentRow[] = [\n { id: \"aline\", name: \"Aline Castro\", initials: \"AC\", hex: \"#f59e0b\", active: true, resolved: 24, avgTime: \"3m 12s\", csat: 4.9 },\n { id: \"carlos\", name: \"Carlos Souza\", initials: \"CS\", hex: \"#8754ec\", active: true, resolved: 19, avgTime: \"4m 45s\", csat: 4.7 },\n { id: \"maria\", name: \"Maria Lima\", initials: \"ML\", hex: \"#ef4444\", active: false, resolved: 17, avgTime: \"5m 03s\", csat: 4.5 },\n { id: \"joao\", name: \"João Pereira\", initials: \"JP\", hex: \"#1cb280\", active: true, resolved: 15, avgTime: \"3m 58s\", csat: 4.8 },\n { id: \"you\", name: \"Você\", initials: \"VC\", hex: \"#0a3a2e\", active: true, resolved: 12, avgTime: \"4m 11s\", csat: 4.6 },\n];\n\n/ Traffic Data — origem das conversas (tabela) /\ntype TrafficRow = {\n source: string;\n visits: string;\n bounce: string;\n goal: number;\n goalColor: string;\n};\n\nconst TRAFFIC_ROWS: TrafficRow[] = [\n { source: \"Direct\", visits: \"1.300\", bounce: \"30%\", goal: 80, goalColor: \"var(--color-fg-warning)\" },\n { source: \"Email Campaign\", visits: \"5.000\", bounce: \"45%\", goal: 40, goalColor: \"var(--color-fg-success)\" },\n { source: \"Organic\", visits: \"3.000\", bounce: \"10%\", goal: 55, goalColor: \"var(--color-fg-warning)\" },\n { source: \"Paid Search\", visits: \"2.450\", bounce: \"22%\", goal: 68, goalColor: \"var(--color-fg-success)\" },\n { source: \"Social\", visits: \"1.870\", bounce: \"55%\", goal: 25, goalColor: \"var(--color-fg-danger)\" },\n { source: \"Referral\", visits: \"940\", bounce: \"18%\", goal: 72, goalColor: \"var(--color-fg-success)\" },\n];\n\n/ ─────────────────────────────────────────────────────────────\n * Atoms\n * ───────────────────────────────────────────────────────────── /\n\nconst TONE_CLASSES: Record<KpiTone, { bg: string; fg: string }> = {\n brand: { bg: \"bg-bg-brand-subtle\", fg: \"text-fg-brand\" },\n success: { bg: \"bg-bg-success-muted\", fg: \"text-fg-success\" },\n warning: { bg: \"bg-bg-warning-muted\", fg: \"text-fg-warning\" },\n info: { bg: \"bg-bg-info-muted\", fg: \"text-fg-info\" },\n danger: { bg: \"bg-bg-danger-muted\", fg: \"text-fg-danger\" },\n neutral: { bg: \"bg-bg-muted\", fg: \"text-fg-muted\" },\n};\n\n/* KpiCard — title no topo + icon container + value + Chip delta (padronizado). /\nfunction KpiCard({ kpi }: { kpi: KpiCardData }) {\n const Icon = kpi.icon;\n const cls = TONE_CLASSES[kpi.tone];\n return (\n <article className=\"flex flex-col gap-gp-lg p-pad-3xl bg-bg-surface border border-border-subtle rounded-radius-xl shadow-sh-sm\">\n <header className=\"flex items-start justify-between gap-gp-md\">\n <h3 className=\"m-0 text-paragraph-sm font-semibold text-fg-default\">{kpi.title}</h3>\n <span\n className={cn(\n \"grid place-items-center size-form-lg rounded-radius-lg shrink-0\",\n cls.bg, cls.fg,\n )}\n aria-hidden\n >\n <Icon className=\"size-icon-md\" strokeWidth={1.8} />\n </span>\n </header>\n <div className=\"flex flex-col gap-gp-xs\">\n <div className=\"flex items-center gap-gp-md flex-wrap\">\n <span className=\"text-[26px] font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]\">\n {kpi.value}\n </span>\n {kpi.delta && (\n <Chip\n color={kpi.delta.positive ? \"success\" : \"danger\"}\n variant=\"soft\"\n size=\"sm\"\n shape=\"pill\"\n >\n {kpi.delta.value}\n </Chip>\n )}\n </div>\n {kpi.delta && (\n <span className=\"text-[11px] text-fg-subtle\">{kpi.delta.label}</span>\n )}\n </div>\n </article>\n );\n}\n\n/* Welcome banner — brand gradient, ilustração SVG, CTA. /\nfunction WelcomeBanner() {\n return (\n <article className=\"relative overflow-hidden bg-bg-brand rounded-radius-xl p-pad-4xl flex items-center gap-gp-2xl flex-1 w-full\">\n {/ Texto à esquerda /}\n <div className=\"flex flex-col gap-gp-md flex-1 min-w-0 z-[1]\">\n <h2 className=\"m-0 flex items-center gap-gp-md text-[22px] font-bold text-fg-on-brand\">\n Boa tarde, Sergio\n <Sun className=\"size-icon-md text-fg-warning\" fill=\"currentColor\" />\n </h2>\n <p className=\"m-0 text-paragraph-sm text-fg-on-brand opacity-80 max-w-[480px]\">\n Acompanhe a performance da sua equipe hoje.<br />\n Snapshot rápido das principais métricas do atendimento.\n </p>\n <div>\n <Button\n color=\"secondary\"\n variant=\"filled\"\n size=\"md\"\n iconRight={<ArrowRight />}\n className=\"bg-bg-surface text-fg-default hover:bg-bg-muted\"\n >\n Ver relatório completo\n </Button>\n </div>\n </div>\n\n </article>\n );\n}\n\n/* Key Insights — all-time revenue + stacked bar + legend (legend no footer via mt-auto). /\nfunction KeyInsightsCard() {\n return (\n <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\">\n <header className=\"flex items-center justify-between gap-gp-md\">\n <h3 className=\"m-0 text-[15px] font-bold text-fg-default\">Key Insights</h3>\n <Button color=\"secondary\" variant=\"ghost\" size=\"icon-sm\" aria-label=\"Mais opções\">\n <MoreVertical />\n </Button>\n </header>\n <p className=\"m-0 text-[12px] text-fg-muted\">Receita acumulada (anual)</p>\n <div className=\"flex items-center gap-gp-md flex-wrap\">\n <span className=\"text-[26px] font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]\">\n R$ 395.7k\n </span>\n <Chip color=\"success\" variant=\"soft\" size=\"sm\" shape=\"pill\">\n +2.7%\n </Chip>\n </div>\n {/ Spacer empurra bar + legend pro bottom do card /}\n <div className=\"mt-auto flex flex-col gap-gp-md\">\n {/ Stacked bar 3 segmentos /}\n <div className=\"flex h-[8px] gap-[2px] rounded-radius-full overflow-hidden\">\n <span className=\"bg-bg-brand\" style={{ flex: 4 }} aria-hidden />\n <span className=\"bg-bg-warning\" style={{ flex: 3 }} aria-hidden />\n <span className=\"bg-bg-info\" style={{ flex: 4 }} aria-hidden />\n </div>\n <div className=\"flex items-center gap-gp-lg flex-wrap text-[11px] text-fg-muted\">\n <span className=\"inline-flex items-center gap-[5px]\">\n <span className=\"size-[8px] rounded-radius-full bg-bg-brand\" aria-hidden />\n São Paulo\n </span>\n <span className=\"inline-flex items-center gap-[5px]\">\n <span className=\"size-[8px] rounded-radius-full bg-bg-warning\" aria-hidden />\n Rio\n </span>\n <span className=\"inline-flex items-center gap-[5px]\">\n <span className=\"size-[8px] rounded-radius-full bg-bg-info\" aria-hidden />\n MG\n </span>\n </div>\n </div>\n </article>\n );\n}\n\nfunction SectionCard({\n title,\n subtitle,\n action,\n children,\n className,\n}: {\n title: string;\n subtitle?: string;\n action?: React.ReactNode;\n children: React.ReactNode;\n className?: string;\n}) {\n return (\n <section\n className={cn(\n \"flex flex-col gap-gp-2xl p-pad-3xl bg-bg-surface border border-border-subtle rounded-radius-xl shadow-sh-sm\",\n className,\n )}\n >\n <header className=\"flex items-center justify-between gap-gp-md\">\n <div className=\"flex flex-col gap-[2px] min-w-0\">\n <h3 className=\"m-0 text-[15px] font-bold text-fg-default\">{title}</h3>\n {subtitle && (\n <p className=\"m-0 text-[12px] text-fg-muted\">{subtitle}</p>\n )}\n </div>\n {action ?? (\n <Button color=\"secondary\" variant=\"ghost\" size=\"icon-sm\" aria-label=\"Mais opções\">\n <MoreVertical />\n </Button>\n )}\n </header>\n {children}\n </section>\n );\n}\n\n/* Tooltip estilizado pros charts — consome tokens DS. /\nconst CHART_TOOLTIP_STYLE: React.CSSProperties = {\n borderRadius: 10,\n border: \"1px solid var(--color-border-default)\",\n background: \"var(--color-bg-surface-elevated)\",\n color: \"var(--color-fg-default)\",\n fontSize: 12,\n boxShadow: \"rgba(0,0,0,0.18) 0 12px 24px -4px\",\n padding: \"8px 12px\",\n};\n\nconst CHART_TOOLTIP_LABEL_STYLE: React.CSSProperties = {\n color: \"var(--color-fg-muted)\",\n fontSize: 11,\n marginBottom: 4,\n};\n\n/* Stacked bar chart (humano + IA) com Recharts — tooltip + hover + responsivo. /\nfunction VolumeStackedChart() {\n return (\n <div className=\"flex flex-col gap-gp-lg\">\n {/ Header com valor + chip delta + legend + selector ano /}\n <div className=\"flex items-center gap-gp-md flex-wrap\">\n <div className=\"flex items-baseline gap-gp-md flex-wrap\">\n <span className=\"text-[26px] font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]\">\n R$ 395.7k\n </span>\n <Chip color=\"success\" variant=\"soft\" size=\"sm\" shape=\"pill\">\n +18%\n </Chip>\n <span className=\"text-[12px] text-fg-muted\">vs ano passado</span>\n </div>\n <div className=\"ml-auto flex items-center gap-gp-md\">\n <span className=\"inline-flex items-center gap-[4px] text-[11px] text-fg-muted\">\n <span className=\"size-[8px] rounded-radius-full bg-bg-brand\" aria-hidden /> Humano\n </span>\n <span className=\"inline-flex items-center gap-[4px] text-[11px] text-fg-muted\">\n <span className=\"size-[8px] rounded-radius-full bg-bg-brand-subtle\" aria-hidden /> IA\n </span>\n <Button color=\"secondary\" variant=\"outline\" size=\"sm\" iconRight={<ChevronDown />}>\n 2026\n </Button>\n </div>\n </div>\n\n {/ Recharts: ResponsiveContainer + BarChart stacked + Tooltip + grid dashed /}\n <div style={{ width: \"100%\", height: 280 }}>\n <ResponsiveContainer>\n <BarChart\n data={VOLUME_BY_MONTH}\n margin={{ top: 8, right: 8, left: -16, bottom: 0 }}\n barCategoryGap={18}\n >\n <CartesianGrid\n stroke=\"var(--color-border-subtle)\"\n strokeDasharray=\"4 4\"\n vertical={false}\n />\n <XAxis\n dataKey=\"m\"\n tickLine={false}\n axisLine={false}\n fontSize={11}\n stroke=\"var(--color-fg-subtle)\"\n />\n <YAxis\n tickLine={false}\n axisLine={false}\n fontSize={11}\n stroke=\"var(--color-fg-subtle)\"\n tickFormatter={(v) => (v === 0 ? \"0k\" : `${v / 1000}k`)}\n ticks={[0, 2000, 4000, 6000, 8000, 10000]}\n domain={[0, 10000]}\n />\n <Tooltip\n cursor={{ fill: \"var(--color-bg-muted)\", opacity: 0.5 }}\n contentStyle={CHART_TOOLTIP_STYLE}\n labelStyle={CHART_TOOLTIP_LABEL_STYLE}\n formatter={(value, name) => {\n const label = name === \"human\" ? \"Humano\" : \"IA\";\n return [Number(value).toLocaleString(\"pt-BR\"), label];\n }}\n />\n <Bar dataKey=\"human\" stackId=\"x\" fill=\"var(--color-bg-brand)\" radius={[0, 0, 0, 0]} />\n <Bar dataKey=\"ai\" stackId=\"x\" fill=\"var(--color-bg-brand-subtle)\" radius={[6, 6, 0, 0]} />\n </BarChart>\n </ResponsiveContainer>\n </div>\n </div>\n );\n}\n\n/* Donut com Recharts PieChart — tooltip + hover + total no centro. /\nfunction CurrentVisitsCard() {\n const total = REGIONS.reduce((s, r) => s + r.value, 0);\n return (\n <SectionCard title=\"Origem dos atendimentos\" subtitle=\"Por região\" className=\"h-full\">\n {/ Donut — wrapper relativo ancora o center dentro do círculo /}\n <div className=\"relative flex items-center justify-center\" style={{ height: 210 }}>\n <ResponsiveContainer width=\"100%\" height={210}>\n <PieChart margin={{ top: 0, right: 0, bottom: 0, left: 0 }}>\n <Pie\n data={REGIONS}\n dataKey=\"value\"\n nameKey=\"name\"\n cx=\"50%\"\n cy=\"50%\"\n innerRadius={70}\n outerRadius={92}\n paddingAngle={3}\n startAngle={90}\n endAngle={-270}\n stroke=\"none\"\n isAnimationActive\n >\n {REGIONS.map((r) => (\n <Cell key={r.name} fill={r.color} />\n ))}\n </Pie>\n <Tooltip\n contentStyle={CHART_TOOLTIP_STYLE}\n labelStyle={CHART_TOOLTIP_LABEL_STYLE}\n formatter={(value) => Number(value).toLocaleString(\"pt-BR\")}\n />\n </PieChart>\n </ResponsiveContainer>\n {/ Total absolute no centro do donut /}\n <div className=\"absolute inset-0 flex flex-col items-center justify-center pointer-events-none\">\n <span className=\"text-[11px] text-fg-muted\">Total</span>\n <span className=\"text-[24px] font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]\">\n {total.toLocaleString(\"pt-BR\")}\n </span>\n </div>\n </div>\n {/ Lista de regiões — mt-auto empurra pro bottom do card /}\n <div className=\"mt-auto flex flex-col gap-gp-md\">\n {REGIONS.map((r) => (\n <div key={r.name} className=\"flex items-center gap-gp-md\">\n <span\n className=\"size-[10px] rounded-radius-full shrink-0\"\n style={{ background: r.color }}\n aria-hidden\n />\n <span className=\"flex-1 text-[12.5px] text-fg-default font-medium\">{r.name}</span>\n <span className=\"text-[12px] text-fg-default [font-variant-numeric:tabular-nums]\">\n {r.value.toLocaleString(\"pt-BR\")}\n </span>\n <Chip\n color={r.positive ? \"success\" : \"danger\"}\n variant=\"soft\"\n size=\"sm\"\n shape=\"pill\"\n >\n {r.delta}\n </Chip>\n </div>\n ))}\n </div>\n </SectionCard>\n );\n}\n\nfunction PersonAvatar({ initials, hex, size = \"md\" }: { initials: string; hex: string; size?: \"sm\" \| \"md\" }) {\n const cls = size === \"sm\" ? \"size-[24px] text-[10px]\" : \"size-[32px] text-[12px]\";\n return (\n <Avatar className={cls} style={{ background: hex }}>\n <AvatarFallback className=\"bg-transparent text-white font-bold\">{initials}</AvatarFallback>\n </Avatar>\n );\n}\n\nfunction OpenConversationsList() {\n return (\n <ul className=\"m-0 p-0 list-none flex flex-col\">\n {OPEN_CONVS.map((c) => {\n const ChIcon = CHANNELS.find((ch) => ch.id === c.channel)?.icon ?? MessageSquare;\n return (\n <li\n key={c.id}\n className=\"flex items-center gap-gp-md py-pad-lg border-b border-border-subtle last:border-b-0 cursor-pointer hover:[&>]:opacity-90 transition-opacity\"\n >\n <PersonAvatar initials={c.initials} hex={c.hex} size=\"md\" />\n <div className=\"flex-1 min-w-0 flex flex-col gap-[2px]\">\n <div className=\"flex items-center gap-gp-sm\">\n <span className=\"text-[13px] font-semibold text-fg-default whitespace-nowrap overflow-hidden text-ellipsis\">\n {c.name}\n </span>\n <span className=\"text-[11px] text-fg-subtle [font-variant-numeric:tabular-nums] shrink-0\">\n {c.id}\n </span>\n </div>\n <div className=\"flex items-center gap-gp-sm flex-wrap text-[11px] text-fg-muted\">\n <span className=\"inline-flex items-center gap-[3px]\">\n <ChIcon size={11} strokeWidth={1.8} aria-hidden />\n {CHANNELS.find((ch) => ch.id === c.channel)?.name ?? c.channel}\n </span>\n {c.agent && (\n <>\n <span aria-hidden>·</span>\n <span>{c.agent.name}</span>\n </>\n )}\n </div>\n </div>\n <div className=\"flex flex-col items-end gap-[4px] shrink-0\">\n <Chip color={STATUS_TONE[c.status]} variant=\"soft\" size=\"sm\" shape=\"pill\">\n {STATUS_LABEL[c.status]}\n </Chip>\n <span className=\"inline-flex items-center gap-[3px] text-[11px] text-fg-muted [font-variant-numeric:tabular-nums]\">\n <Clock size={10} strokeWidth={1.8} aria-hidden />\n {c.waitTime}\n </span>\n </div>\n </li>\n );\n })}\n </ul>\n );\n}\n\nfunction AgentPerformanceList() {\n return (\n <ul className=\"m-0 p-0 list-none flex flex-col\">\n {AGENTS.map((a, i) => (\n <li\n key={a.id}\n className=\"flex items-center gap-gp-md py-pad-lg border-b border-border-subtle last:border-b-0\"\n >\n <span className=\"grid place-items-center size-[20px] rounded-radius-full bg-bg-muted text-[11px] font-bold text-fg-muted shrink-0 [font-variant-numeric:tabular-nums]\">\n {i + 1}\n </span>\n <div className=\"relative shrink-0\">\n <PersonAvatar initials={a.initials} hex={a.hex} size=\"md\" />\n <span\n className={cn(\n \"absolute -bottom-[1px] -right-[1px] size-[8px] rounded-radius-full border border-bg-surface\",\n a.active ? \"bg-bg-success\" : \"bg-bg-muted\",\n )}\n aria-label={a.active ? \"online\" : \"offline\"}\n />\n </div>\n <div className=\"flex-1 min-w-0 flex flex-col gap-[2px]\">\n <span className=\"text-[13px] font-semibold text-fg-default whitespace-nowrap overflow-hidden text-ellipsis\">\n {a.name}\n </span>\n <span className=\"text-[11px] text-fg-muted\">\n {a.resolved} resolvidos · {a.avgTime} médio\n </span>\n </div>\n <div className=\"flex items-center gap-[3px] shrink-0 text-[12px] font-semibold text-fg-default\">\n <Star size={11} strokeWidth={2} className=\"text-fg-warning fill-current\" aria-hidden />\n <span className=\"[font-variant-numeric:tabular-nums]\">{a.csat.toFixed(1)}</span>\n </div>\n </li>\n ))}\n </ul>\n );\n}\n\n/** Canais com volume + status — estilo Campaign Performance. /\nfunction ChannelPerformanceList() {\n return (\n <ul className=\"m-0 p-0 list-none flex flex-col\">\n {CHANNELS.map((c) => {\n const Icon = c.icon;\n return (\n <li\n key={c.id}\n className=\"flex items-center gap-gp-lg py-pad-lg border-b border-border-subtle last:border-b-0\"\n >\n <span\n className=\"grid place-items-center size-[36px] rounded-radius-full shrink-0 text-white\"\n style={{ background: c.color }}\n aria-hidden\n >\n <Icon size={16} strokeWidth={1.8} />\n </span>\n <div className=\"flex-1 min-w-0 flex flex-col gap-[2px]\">\n <span className=\"text-[13px] font-semibold text-fg-default\">{c.name}</span>\n <span className=\"text-[11px] text-fg-muted\">\n {c.volume} mensagens\n </span>\n </div>\n <Chip color={CHANNEL_STATUS_TONE[c.status]} variant=\"soft\" size=\"sm\" shape=\"pill\">\n {CHANNEL_STATUS_LABEL[c.status]}\n </Chip>\n </li>\n );\n })}\n </ul>\n );\n}\n\n/* Traffic Data — tabela com source/visits/bounce/goal. /\nfunction TrafficDataTable() {\n return (\n <SectionCard\n title=\"Origem do tráfego\"\n subtitle=\"Fontes de aquisição\"\n className=\"flex-1 h-full\"\n action={\n <div className=\"relative max-w-[200px]\">\n <Search\n size={14}\n strokeWidth={1.8}\n className=\"absolute left-pad-lg top-1/2 -translate-y-1/2 text-fg-muted pointer-events-none\"\n />\n <input\n type=\"search\"\n placeholder=\"Buscar...\"\n className=\"h-form-md pl-[34px] pr-pad-md w-full rounded-radius-md bg-bg-muted border border-border-input text-paragraph-sm text-fg-default placeholder:text-fg-muted focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring-brand focus-visible:border-border-brand\"\n />\n </div>\n }\n >\n <div className=\"overflow-x-auto -mx-pad-2xl px-pad-2xl\">\n <table className=\"w-full text-paragraph-sm border-separate border-spacing-0\">\n <thead>\n <tr className=\"text-[11px] font-bold tracking-[0.04em] text-fg-subtle uppercase\">\n <th className=\"text-left pb-pad-md border-b border-border-subtle font-bold\">Fonte</th>\n <th className=\"text-right pb-pad-md border-b border-border-subtle font-bold\">Visitas</th>\n <th className=\"text-left pb-pad-md pl-pad-2xl border-b border-border-subtle font-bold\">Bounce</th>\n <th className=\"text-left pb-pad-md pl-pad-2xl border-b border-border-subtle font-bold\">Meta (%)</th>\n </tr>\n </thead>\n <tbody>\n {TRAFFIC_ROWS.map((r) => (\n <tr key={r.source} className=\"text-[12.5px]\">\n <td className=\"py-pad-lg border-b border-border-subtle text-fg-default font-medium\">\n {r.source}\n </td>\n <td className=\"py-pad-lg border-b border-border-subtle text-right text-fg-default [font-variant-numeric:tabular-nums]\">\n {r.visits}\n </td>\n <td className=\"py-pad-sm pl-pad-2xl border-b border-border-subtle text-fg-muted [font-variant-numeric:tabular-nums]\">\n {r.bounce}\n </td>\n <td className=\"py-pad-sm pl-pad-2xl border-b border-border-subtle\">\n <div className=\"flex items-center gap-gp-md\">\n <div className=\"flex-1 h-[6px] bg-bg-muted rounded-radius-full overflow-hidden min-w-[80px]\">\n <div\n className=\"h-full rounded-radius-full\"\n style={{ width: `${r.goal}%`, background: r.goalColor }}\n />\n </div>\n <span className=\"text-[11px] font-semibold text-fg-default [font-variant-numeric:tabular-nums] shrink-0 min-w-[32px] text-right\">\n {r.goal}%\n </span>\n </div>\n </td>\n </tr>\n ))}\n </tbody>\n </table>\n </div>\n </SectionCard>\n );\n}\n\n/ ─────────────────────────────────────────────────────────────\n * Page\n * ───────────────────────────────────────────────────────────── /\n\nexport default function DashboardShowcase() {\n const { theme, setTheme } = useTheme();\n const [period, setPeriod] = useState<string>(\"Últimos 7 dias\");\n\n return (\n <AppShell\n contexts={APP_SHELL_CONTEXTS}\n defaultActiveContextId=\"inbox\"\n defaultActiveItemHref=\"#dashboard\"\n breadcrumb={[{ label: \"Dashboard\" }]}\n commandGroups={APP_SHELL_COMMANDS}\n notifications={{\n items: APP_SHELL_NOTIFICATIONS,\n onMarkAllRead: () => alert(\"Marcar todas como lidas\"),\n onMoreActions: () => alert(\"Mais ações\"),\n onViewAll: () => alert(\"Ver todas\"),\n }}\n messages={{\n items: APP_SHELL_MESSAGES,\n onNewMessage: () => alert(\"Nova mensagem\"),\n onExpand: () => alert(\"Expandir\"),\n onViewAll: () => alert(\"Ver todas\"),\n }}\n theme={theme}\n onThemeChange={(id) => setTheme(id as Theme)}\n themeOptions={APP_SHELL_THEME_OPTIONS}\n >\n <PageHeader\n title=\"Dashboard\"\n description=\"Visão geral do atendimento em tempo real — KPIs, volume, canais e performance da equipe.\"\n badge={\n <Chip color=\"primary\" variant=\"soft\" size=\"sm\" shape=\"pill\">\n Hoje\n </Chip>\n }\n actions={\n <>\n <Button\n color=\"secondary\"\n variant=\"outline\"\n size=\"icon-md\"\n aria-label=\"Mais ações\"\n >\n <MoreVertical />\n </Button>\n <Button\n color=\"secondary\"\n variant=\"outline\"\n size=\"md\"\n iconLeft={<Calendar />}\n iconRight={<ChevronDown />}\n onClick={() => {\n const next = period === \"Últimos 7 dias\" ? \"Últimos 30 dias\" : \"Últimos 7 dias\";\n setPeriod(next);\n }}\n >\n {period}\n </Button>\n </>\n }\n />\n\n {/ Row 1 — Welcome (2/3) + KeyInsights (1/3) — alturas iguais /}\n <section className=\"grid grid-cols-1 lg:grid-cols-3 gap-gp-2xl items-stretch\">\n <div className=\"lg:col-span-2 flex\">\n <WelcomeBanner />\n </div>\n <KeyInsightsCard />\n </section>\n\n {/ Row 2 — KPIs primários (6) /}\n <section\n aria-label=\"KPIs principais\"\n className=\"grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-gp-2xl\"\n >\n {KPIS_PRIMARY.map((kpi) => (\n <KpiCard key={kpi.id} kpi={kpi} />\n ))}\n </section>\n\n {/ Row 3 — Volume stacked (2/3) + Current visits donut (1/3) — alturas iguais /}\n <section className=\"grid grid-cols-1 lg:grid-cols-3 gap-gp-2xl items-stretch\">\n <SectionCard\n title=\"Volume de atendimentos\"\n subtitle=\"Humano vs IA — ano corrente\"\n className=\"lg:col-span-2 h-full\"\n >\n <VolumeStackedChart />\n </SectionCard>\n <CurrentVisitsCard />\n </section>\n\n {/ Row 4 — KPIs qualidade (4) — APÓS os charts /}\n <section\n aria-label=\"Qualidade do atendimento\"\n className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-gp-2xl\"\n >\n {KPIS_QUALITY.map((kpi) => (\n <KpiCard key={kpi.id} kpi={kpi} />\n ))}\n </section>\n\n {/ Row 5 — Open + Agents /}\n <section className=\"grid grid-cols-1 lg:grid-cols-2 gap-gp-2xl\">\n <SectionCard\n title=\"Atendimentos em aberto\"\n subtitle=\"5 ativos agora\"\n action={\n <Button color=\"secondary\" variant=\"ghost\" size=\"sm\">\n Ver todos\n </Button>\n }\n >\n <OpenConversationsList />\n </SectionCard>\n <SectionCard\n title=\"Performance da equipe\"\n subtitle=\"Ranking de hoje\"\n action={\n <Button color=\"secondary\" variant=\"ghost\" size=\"sm\">\n Ver equipe\n </Button>\n }\n >\n <AgentPerformanceList />\n </SectionCard>\n </section>\n\n {/ Row 6 — Channels (1/3) + Traffic Data (2/3). Ambos h-full pra\n alturas se igualarem dentro da row do grid. */}\n <section className=\"grid grid-cols-1 lg:grid-cols-3 gap-gp-2xl items-stretch\">\n <SectionCard title=\"Canais\" subtitle=\"Volume e status\" className=\"h-full\">\n <ChannelPerformanceList />\n </SectionCard>\n <div className=\"lg:col-span-2 flex\">\n <TrafficDataTable />\n </div>\n </section>\n </AppShell>\n );\n}\n"],"names":["Phone","Timer","CheckCircle2","UserPlus","Clock","TrendingUp","Star","Headphones","Bot","MessageSquare","Send","Mail","jsxs","jsx","cn","Chip","Sun","Button","ArrowRight","MoreVertical","ChevronDown","ResponsiveContainer","BarChart","CartesianGrid","XAxis","YAxis","Tooltip","Bar","PieChart","Pie","Cell","Avatar","AvatarFallback","Fragment","Search","useTheme","useState","AppShell","APP_SHELL_CONTEXTS","APP_SHELL_COMMANDS","APP_SHELL_NOTIFICATIONS","APP_SHELL_MESSAGES","APP_SHELL_THEME_OPTIONS","PageHeader","Calendar"],"mappings":"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"}
1	+ {"version":3,"file":"dashboard.cjs","sources":["../../src/preview/pages/DashboardShowcase.tsx"],"sourcesContent":["import { useState } from \"react\";\r\nimport { useTheme, type Theme } from \"@/hooks/useTheme\";\r\nimport type { LucideIcon } from \"lucide-react\";\r\nimport {\r\n ArrowRight,\r\n ArrowUpRight,\r\n ArrowDownRight,\r\n Bot,\r\n Calendar,\r\n CheckCircle2,\r\n ChevronDown,\r\n Clock,\r\n Headphones,\r\n Mail,\r\n MessageSquare,\r\n MoreVertical,\r\n Phone,\r\n Search,\r\n Send,\r\n Star,\r\n Sun,\r\n Timer,\r\n TrendingUp,\r\n UserPlus,\r\n} from \"lucide-react\";\r\nimport {\r\n Bar,\r\n BarChart,\r\n CartesianGrid,\r\n Cell,\r\n Pie,\r\n PieChart,\r\n ResponsiveContainer,\r\n Tooltip,\r\n XAxis,\r\n YAxis,\r\n} from \"recharts\";\r\nimport { cn } from \"@/lib/utils\";\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 { 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} from \"../mocks/app-shell-mocks\";\r\n\r\n/* ─────────────────────────────────────────────────────────────\r\n * Tipos + mock data — call center + analytics\r\n * ───────────────────────────────────────────────────────────── /\r\n\r\ntype KpiTone = \"brand\" \| \"success\" \| \"warning\" \| \"info\" \| \"danger\" \| \"neutral\";\r\n\r\ntype KpiCardData = {\r\n id: string;\r\n title: string;\r\n value: string;\r\n delta?: { value: string; direction: \"up\" \| \"down\"; positive: boolean; label: string };\r\n icon: LucideIcon;\r\n tone: KpiTone;\r\n};\r\n\r\nconst KPIS_PRIMARY: KpiCardData[] = [\r\n { id: \"in-conv\", title: \"Em atendimento\", value: \"12\",\r\n delta: { value: \"+3\", direction: \"up\", positive: true, label: \"vs ontem\" },\r\n icon: Phone, tone: \"success\" },\r\n { id: \"waiting\", title: \"Em espera\", value: \"4\",\r\n delta: { value: \"+1\", direction: \"up\", positive: false, label: \"vs ontem\" },\r\n icon: Timer, tone: \"warning\" },\r\n { id: \"finished\", title: \"Resolvidos hoje\", value: \"87\",\r\n delta: { value: \"+12%\", direction: \"up\", positive: true, label: \"vs semana\" },\r\n icon: CheckCircle2, tone: \"info\" },\r\n { id: \"new\", title: \"Novos contatos\", value: \"260\",\r\n delta: { value: \"+24\", direction: \"up\", positive: true, label: \"vs ontem\" },\r\n icon: UserPlus, tone: \"brand\" },\r\n { id: \"talk\", title: \"Tempo médio atend.\", value: \"4m 32s\",\r\n delta: { value: \"-12s\", direction: \"down\", positive: true, label: \"melhorou\" },\r\n icon: Clock, tone: \"neutral\" },\r\n { id: \"wait\", title: \"Tempo médio espera\", value: \"1m 18s\",\r\n delta: { value: \"-8s\", direction: \"down\", positive: true, label: \"melhorou\" },\r\n icon: Timer, tone: \"neutral\" },\r\n];\r\n\r\nconst KPIS_QUALITY: KpiCardData[] = [\r\n { id: \"frt\", title: \"First Response Time\", value: \"42s\",\r\n delta: { value: \"-5s\", direction: \"down\", positive: true, label: \"melhorou\" },\r\n icon: TrendingUp, tone: \"info\" },\r\n { id: \"csat\", title: \"CSAT\", value: \"4.7\",\r\n delta: { value: \"+0.2\", direction: \"up\", positive: true, label: \"vs semana\" },\r\n icon: Star, tone: \"warning\" },\r\n { id: \"nps\", title: \"NPS\", value: \"68\",\r\n delta: { value: \"+5\", direction: \"up\", positive: true, label: \"vs mês\" },\r\n icon: Headphones, tone: \"success\" },\r\n { id: \"ai\", title: \"Resolvido por IA\", value: \"32%\",\r\n delta: { value: \"+4%\", direction: \"up\", positive: true, label: \"vs semana\" },\r\n icon: Bot, tone: \"brand\" },\r\n];\r\n\r\n/ Volume — stacked bars (2 séries: humano + IA) /\r\nconst VOLUME_BY_MONTH = [\r\n { m: \"Jan\", human: 2400, ai: 1200 },\r\n { m: \"Feb\", human: 4000, ai: 2800 },\r\n { m: \"Mar\", human: 3500, ai: 2200 },\r\n { m: \"Apr\", human: 3800, ai: 2900 },\r\n { m: \"May\", human: 2700, ai: 2300 },\r\n { m: \"Jun\", human: 3200, ai: 2700 },\r\n { m: \"Jul\", human: 2600, ai: 2700 },\r\n { m: \"Aug\", human: 4500, ai: 3200 },\r\n { m: \"Sep\", human: 2800, ai: 2700 },\r\n { m: \"Oct\", human: 4200, ai: 2300 },\r\n { m: \"Nov\", human: 2600, ai: 2700 },\r\n { m: \"Dec\", human: 3000, ai: 4000 },\r\n];\r\n\r\n/ Current Visits — origem dos atendimentos (regiões/cidades) /\r\nconst REGIONS = [\r\n { name: \"São Paulo\", value: 1650, color: \"var(--color-fg-brand)\", delta: \"+4.7%\", positive: true },\r\n { name: \"Rio de Janeiro\", value: 350, color: \"var(--color-fg-warning)\", delta: \"+2.1%\", positive: true },\r\n { name: \"Belo Horizonte\", value: 498, color: \"var(--color-fg-info)\", delta: \"-1.7%\", positive: false },\r\n];\r\n\r\n/ Channels — lista estilo Campaign Performance /\r\ntype ChannelKind = \"whatsapp\" \| \"telegram\" \| \"instagram\" \| \"email\" \| \"webchat\";\r\n\r\nconst CHANNELS: { id: ChannelKind; name: string; volume: string; color: string; icon: LucideIcon; status: \"active\" \| \"paused\" \| \"off\" }[] = [\r\n { id: \"whatsapp\", name: \"WhatsApp\", volume: \"8.49k\", color: \"#25d366\", icon: MessageSquare, status: \"active\" },\r\n { id: \"instagram\", name: \"Instagram\", volume: \"6.98k\", color: \"#e1306c\", icon: MessageSquare, status: \"active\" },\r\n { id: \"telegram\", name: \"Telegram\", volume: \"3.21k\", color: \"#0088cc\", icon: Send, status: \"paused\" },\r\n { id: \"email\", name: \"Email\", volume: \"2.14k\", color: \"#8754ec\", icon: Mail, status: \"active\" },\r\n { id: \"webchat\", name: \"Web Chat\", volume: \"1.50k\", color: \"#0a3a2e\", icon: MessageSquare, status: \"off\" },\r\n];\r\n\r\nconst CHANNEL_STATUS_LABEL: Record<\"active\" \| \"paused\" \| \"off\", string> = {\r\n active: \"Ativo\",\r\n paused: \"Pausado\",\r\n off: \"Desligado\",\r\n};\r\n\r\nconst CHANNEL_STATUS_TONE: Record<\"active\" \| \"paused\" \| \"off\", \"success\" \| \"warning\" \| \"neutral\"> = {\r\n active: \"success\",\r\n paused: \"warning\",\r\n off: \"neutral\",\r\n};\r\n\r\n/ Open conversations — atendimentos ativos /\r\ntype OpenConv = {\r\n id: string;\r\n name: string;\r\n initials: string;\r\n hex: string;\r\n channel: ChannelKind;\r\n status: \"attending\" \| \"waiting\" \| \"ai\";\r\n waitTime: string;\r\n agent?: { initials: string; name: string; hex: string };\r\n};\r\n\r\nconst OPEN_CONVS: OpenConv[] = [\r\n { id: \"#A-2453\", name: \"Maria Hernandez\", initials: \"MH\", hex: \"#f59e0b\", channel: \"whatsapp\", status: \"attending\", waitTime: \"2m\", agent: { initials: \"AC\", name: \"Aline Castro\", hex: \"#f59e0b\" } },\r\n { id: \"#A-2455\", name: \"James Johnson\", initials: \"JJ\", hex: \"#0a3a2e\", channel: \"telegram\", status: \"waiting\", waitTime: \"8m\" },\r\n { id: \"#A-2458\", name: \"Camila Ribeiro\", initials: \"CR\", hex: \"#8754ec\", channel: \"instagram\", status: \"attending\", waitTime: \"1m\", agent: { initials: \"VC\", name: \"Você\", hex: \"#0a3a2e\" } },\r\n { id: \"#A-2461\", name: \"Roberto Souza\", initials: \"RS\", hex: \"#0088cc\", channel: \"whatsapp\", status: \"ai\", waitTime: \"3m\" },\r\n { id: \"#A-2466\", name: \"Ana Costa\", initials: \"AC\", hex: \"#1cb280\", channel: \"email\", status: \"waiting\", waitTime: \"14m\" },\r\n];\r\n\r\nconst STATUS_LABEL: Record<OpenConv[\"status\"], string> = {\r\n attending: \"Em atendimento\",\r\n waiting: \"Em espera\",\r\n ai: \"IA\",\r\n};\r\n\r\nconst STATUS_TONE: Record<OpenConv[\"status\"], \"success\" \| \"warning\" \| \"info\"> = {\r\n attending: \"success\",\r\n waiting: \"warning\",\r\n ai: \"info\",\r\n};\r\n\r\n/ Agents /\r\ntype AgentRow = {\r\n id: string;\r\n name: string;\r\n initials: string;\r\n hex: string;\r\n active: boolean;\r\n resolved: number;\r\n avgTime: string;\r\n csat: number;\r\n};\r\n\r\nconst AGENTS: AgentRow[] = [\r\n { id: \"aline\", name: \"Aline Castro\", initials: \"AC\", hex: \"#f59e0b\", active: true, resolved: 24, avgTime: \"3m 12s\", csat: 4.9 },\r\n { id: \"carlos\", name: \"Carlos Souza\", initials: \"CS\", hex: \"#8754ec\", active: true, resolved: 19, avgTime: \"4m 45s\", csat: 4.7 },\r\n { id: \"maria\", name: \"Maria Lima\", initials: \"ML\", hex: \"#ef4444\", active: false, resolved: 17, avgTime: \"5m 03s\", csat: 4.5 },\r\n { id: \"joao\", name: \"João Pereira\", initials: \"JP\", hex: \"#1cb280\", active: true, resolved: 15, avgTime: \"3m 58s\", csat: 4.8 },\r\n { id: \"you\", name: \"Você\", initials: \"VC\", hex: \"#0a3a2e\", active: true, resolved: 12, avgTime: \"4m 11s\", csat: 4.6 },\r\n];\r\n\r\n/ Traffic Data — origem das conversas (tabela) /\r\ntype TrafficRow = {\r\n source: string;\r\n visits: string;\r\n bounce: string;\r\n goal: number;\r\n goalColor: string;\r\n};\r\n\r\nconst TRAFFIC_ROWS: TrafficRow[] = [\r\n { source: \"Direct\", visits: \"1.300\", bounce: \"30%\", goal: 80, goalColor: \"var(--color-fg-warning)\" },\r\n { source: \"Email Campaign\", visits: \"5.000\", bounce: \"45%\", goal: 40, goalColor: \"var(--color-fg-success)\" },\r\n { source: \"Organic\", visits: \"3.000\", bounce: \"10%\", goal: 55, goalColor: \"var(--color-fg-warning)\" },\r\n { source: \"Paid Search\", visits: \"2.450\", bounce: \"22%\", goal: 68, goalColor: \"var(--color-fg-success)\" },\r\n { source: \"Social\", visits: \"1.870\", bounce: \"55%\", goal: 25, goalColor: \"var(--color-fg-danger)\" },\r\n { source: \"Referral\", visits: \"940\", bounce: \"18%\", goal: 72, goalColor: \"var(--color-fg-success)\" },\r\n];\r\n\r\n/ ─────────────────────────────────────────────────────────────\r\n * Atoms\r\n * ───────────────────────────────────────────────────────────── /\r\n\r\nconst TONE_CLASSES: Record<KpiTone, { bg: string; fg: string }> = {\r\n brand: { bg: \"bg-bg-brand-subtle\", fg: \"text-fg-brand\" },\r\n success: { bg: \"bg-bg-success-muted\", fg: \"text-fg-success\" },\r\n warning: { bg: \"bg-bg-warning-muted\", fg: \"text-fg-warning\" },\r\n info: { bg: \"bg-bg-info-muted\", fg: \"text-fg-info\" },\r\n danger: { bg: \"bg-bg-danger-muted\", fg: \"text-fg-danger\" },\r\n neutral: { bg: \"bg-bg-muted\", fg: \"text-fg-muted\" },\r\n};\r\n\r\n/* KpiCard — title no topo + icon container + value + Chip delta (padronizado). /\r\nfunction KpiCard({ kpi }: { kpi: KpiCardData }) {\r\n const Icon = kpi.icon;\r\n const cls = TONE_CLASSES[kpi.tone];\r\n return (\r\n <article className=\"flex flex-col gap-gp-lg p-pad-3xl bg-bg-surface border border-border-subtle rounded-radius-xl shadow-sh-sm\">\r\n <header className=\"flex items-start justify-between gap-gp-md\">\r\n <h3 className=\"m-0 text-body-md font-semibold text-fg-default\">{kpi.title}</h3>\r\n <span\r\n className={cn(\r\n \"grid place-items-center size-form-lg rounded-radius-lg shrink-0\",\r\n cls.bg, cls.fg,\r\n )}\r\n aria-hidden\r\n >\r\n <Icon className=\"size-icon-md\" strokeWidth={1.8} />\r\n </span>\r\n </header>\r\n <div className=\"flex flex-col gap-gp-xs\">\r\n <div className=\"flex items-center gap-gp-md flex-wrap\">\r\n <span className=\"text-body-2xl font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]\">\r\n {kpi.value}\r\n </span>\r\n {kpi.delta && (\r\n <Chip\r\n color={kpi.delta.positive ? \"success\" : \"danger\"}\r\n variant=\"soft\"\r\n size=\"sm\"\r\n shape=\"pill\"\r\n >\r\n {kpi.delta.value}\r\n </Chip>\r\n )}\r\n </div>\r\n {kpi.delta && (\r\n <span className=\"text-caption-sm text-fg-subtle\">{kpi.delta.label}</span>\r\n )}\r\n </div>\r\n </article>\r\n );\r\n}\r\n\r\n/* Welcome banner — brand gradient, ilustração SVG, CTA. /\r\nfunction WelcomeBanner() {\r\n return (\r\n <article className=\"relative overflow-hidden bg-bg-brand rounded-radius-xl p-pad-4xl flex items-center gap-gp-2xl flex-1 w-full\">\r\n {/ Texto à esquerda /}\r\n <div className=\"flex flex-col gap-gp-md flex-1 min-w-0 z-[1]\">\r\n <h2 className=\"m-0 flex items-center gap-gp-md text-body-2xl font-bold text-fg-on-brand\">\r\n Boa tarde, Sergio\r\n <Sun className=\"size-icon-md text-fg-warning\" fill=\"currentColor\" />\r\n </h2>\r\n <p className=\"m-0 text-body-md text-fg-on-brand opacity-80 max-w-[480px]\">\r\n Acompanhe a performance da sua equipe hoje.<br />\r\n Snapshot rápido das principais métricas do atendimento.\r\n </p>\r\n <div>\r\n <Button\r\n color=\"secondary\"\r\n variant=\"filled\"\r\n size=\"md\"\r\n iconRight={<ArrowRight />}\r\n className=\"bg-bg-surface text-fg-default hover:bg-bg-muted\"\r\n >\r\n Ver relatório completo\r\n </Button>\r\n </div>\r\n </div>\r\n\r\n </article>\r\n );\r\n}\r\n\r\n/* Key Insights — all-time revenue + stacked bar + legend (legend no footer via mt-auto). /\r\nfunction KeyInsightsCard() {\r\n return (\r\n <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\">\r\n <header className=\"flex items-center justify-between gap-gp-md\">\r\n <h3 className=\"m-0 text-body-md font-medium font-bold text-fg-default\">Key Insights</h3>\r\n <Button color=\"secondary\" variant=\"ghost\" size=\"icon-sm\" aria-label=\"Mais opções\">\r\n <MoreVertical />\r\n </Button>\r\n </header>\r\n <p className=\"m-0 text-body-xs font-normal text-fg-muted\">Receita acumulada (anual)</p>\r\n <div className=\"flex items-center gap-gp-md flex-wrap\">\r\n <span className=\"text-body-2xl font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]\">\r\n R$ 395.7k\r\n </span>\r\n <Chip color=\"success\" variant=\"soft\" size=\"sm\" shape=\"pill\">\r\n +2.7%\r\n </Chip>\r\n </div>\r\n {/ Spacer empurra bar + legend pro bottom do card /}\r\n <div className=\"mt-auto flex flex-col gap-gp-md\">\r\n {/ Stacked bar 3 segmentos /}\r\n <div className=\"flex h-[8px] gap-[2px] rounded-radius-full overflow-hidden\">\r\n <span className=\"bg-bg-brand\" style={{ flex: 4 }} aria-hidden />\r\n <span className=\"bg-bg-warning\" style={{ flex: 3 }} aria-hidden />\r\n <span className=\"bg-bg-info\" style={{ flex: 4 }} aria-hidden />\r\n </div>\r\n <div className=\"flex items-center gap-gp-lg flex-wrap text-caption-sm text-fg-muted\">\r\n <span className=\"inline-flex items-center gap-[5px]\">\r\n <span className=\"size-[8px] rounded-radius-full bg-bg-brand\" aria-hidden />\r\n São Paulo\r\n </span>\r\n <span className=\"inline-flex items-center gap-[5px]\">\r\n <span className=\"size-[8px] rounded-radius-full bg-bg-warning\" aria-hidden />\r\n Rio\r\n </span>\r\n <span className=\"inline-flex items-center gap-[5px]\">\r\n <span className=\"size-[8px] rounded-radius-full bg-bg-info\" aria-hidden />\r\n MG\r\n </span>\r\n </div>\r\n </div>\r\n </article>\r\n );\r\n}\r\n\r\nfunction SectionCard({\r\n title,\r\n subtitle,\r\n action,\r\n children,\r\n className,\r\n}: {\r\n title: string;\r\n subtitle?: string;\r\n action?: React.ReactNode;\r\n children: React.ReactNode;\r\n className?: string;\r\n}) {\r\n return (\r\n <section\r\n className={cn(\r\n \"flex flex-col gap-gp-2xl p-pad-3xl bg-bg-surface border border-border-subtle rounded-radius-xl shadow-sh-sm\",\r\n className,\r\n )}\r\n >\r\n <header className=\"flex items-center justify-between gap-gp-md\">\r\n <div className=\"flex flex-col gap-[2px] min-w-0\">\r\n <h3 className=\"m-0 text-body-md font-medium font-bold text-fg-default\">{title}</h3>\r\n {subtitle && (\r\n <p className=\"m-0 text-body-xs font-normal text-fg-muted\">{subtitle}</p>\r\n )}\r\n </div>\r\n {action ?? (\r\n <Button color=\"secondary\" variant=\"ghost\" size=\"icon-sm\" aria-label=\"Mais opções\">\r\n <MoreVertical />\r\n </Button>\r\n )}\r\n </header>\r\n {children}\r\n </section>\r\n );\r\n}\r\n\r\n/* Tooltip estilizado pros charts — consome tokens DS. /\r\nconst CHART_TOOLTIP_STYLE: React.CSSProperties = {\r\n borderRadius: 10,\r\n border: \"1px solid var(--color-border-default)\",\r\n background: \"var(--color-bg-surface-elevated)\",\r\n color: \"var(--color-fg-default)\",\r\n fontSize: 12,\r\n boxShadow: \"rgba(0,0,0,0.18) 0 12px 24px -4px\",\r\n padding: \"8px 12px\",\r\n};\r\n\r\nconst CHART_TOOLTIP_LABEL_STYLE: React.CSSProperties = {\r\n color: \"var(--color-fg-muted)\",\r\n fontSize: 11,\r\n marginBottom: 4,\r\n};\r\n\r\n/* Stacked bar chart (humano + IA) com Recharts — tooltip + hover + responsivo. /\r\nfunction VolumeStackedChart() {\r\n return (\r\n <div className=\"flex flex-col gap-gp-lg\">\r\n {/ Header com valor + chip delta + legend + selector ano /}\r\n <div className=\"flex items-center gap-gp-md flex-wrap\">\r\n <div className=\"flex items-baseline gap-gp-md flex-wrap\">\r\n <span className=\"text-body-2xl font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]\">\r\n R$ 395.7k\r\n </span>\r\n <Chip color=\"success\" variant=\"soft\" size=\"sm\" shape=\"pill\">\r\n +18%\r\n </Chip>\r\n <span className=\"text-body-xs font-normal text-fg-muted\">vs ano passado</span>\r\n </div>\r\n <div className=\"ml-auto flex items-center gap-gp-md\">\r\n <span className=\"inline-flex items-center gap-[4px] text-caption-sm text-fg-muted\">\r\n <span className=\"size-[8px] rounded-radius-full bg-bg-brand\" aria-hidden /> Humano\r\n </span>\r\n <span className=\"inline-flex items-center gap-[4px] text-caption-sm text-fg-muted\">\r\n <span className=\"size-[8px] rounded-radius-full bg-bg-brand-subtle\" aria-hidden /> IA\r\n </span>\r\n <Button color=\"secondary\" variant=\"outline\" size=\"sm\" iconRight={<ChevronDown />}>\r\n 2026\r\n </Button>\r\n </div>\r\n </div>\r\n\r\n {/ Recharts: ResponsiveContainer + BarChart stacked + Tooltip + grid dashed /}\r\n <div style={{ width: \"100%\", height: 280 }}>\r\n <ResponsiveContainer>\r\n <BarChart\r\n data={VOLUME_BY_MONTH}\r\n margin={{ top: 8, right: 8, left: -16, bottom: 0 }}\r\n barCategoryGap={18}\r\n >\r\n <CartesianGrid\r\n stroke=\"var(--color-border-subtle)\"\r\n strokeDasharray=\"4 4\"\r\n vertical={false}\r\n />\r\n <XAxis\r\n dataKey=\"m\"\r\n tickLine={false}\r\n axisLine={false}\r\n fontSize={11}\r\n stroke=\"var(--color-fg-subtle)\"\r\n />\r\n <YAxis\r\n tickLine={false}\r\n axisLine={false}\r\n fontSize={11}\r\n stroke=\"var(--color-fg-subtle)\"\r\n tickFormatter={(v) => (v === 0 ? \"0k\" : `${v / 1000}k`)}\r\n ticks={[0, 2000, 4000, 6000, 8000, 10000]}\r\n domain={[0, 10000]}\r\n />\r\n <Tooltip\r\n cursor={{ fill: \"var(--color-bg-muted)\", opacity: 0.5 }}\r\n contentStyle={CHART_TOOLTIP_STYLE}\r\n labelStyle={CHART_TOOLTIP_LABEL_STYLE}\r\n formatter={(value, name) => {\r\n const label = name === \"human\" ? \"Humano\" : \"IA\";\r\n return [Number(value).toLocaleString(\"pt-BR\"), label];\r\n }}\r\n />\r\n <Bar dataKey=\"human\" stackId=\"x\" fill=\"var(--color-bg-brand)\" radius={[0, 0, 0, 0]} />\r\n <Bar dataKey=\"ai\" stackId=\"x\" fill=\"var(--color-bg-brand-subtle)\" radius={[6, 6, 0, 0]} />\r\n </BarChart>\r\n </ResponsiveContainer>\r\n </div>\r\n </div>\r\n );\r\n}\r\n\r\n/* Donut com Recharts PieChart — tooltip + hover + total no centro. /\r\nfunction CurrentVisitsCard() {\r\n const total = REGIONS.reduce((s, r) => s + r.value, 0);\r\n return (\r\n <SectionCard title=\"Origem dos atendimentos\" subtitle=\"Por região\" className=\"h-full\">\r\n {/ Donut — wrapper relativo ancora o center dentro do círculo /}\r\n <div className=\"relative flex items-center justify-center\" style={{ height: 210 }}>\r\n <ResponsiveContainer width=\"100%\" height={210}>\r\n <PieChart margin={{ top: 0, right: 0, bottom: 0, left: 0 }}>\r\n <Pie\r\n data={REGIONS}\r\n dataKey=\"value\"\r\n nameKey=\"name\"\r\n cx=\"50%\"\r\n cy=\"50%\"\r\n innerRadius={70}\r\n outerRadius={92}\r\n paddingAngle={3}\r\n startAngle={90}\r\n endAngle={-270}\r\n stroke=\"none\"\r\n isAnimationActive\r\n >\r\n {REGIONS.map((r) => (\r\n <Cell key={r.name} fill={r.color} />\r\n ))}\r\n </Pie>\r\n <Tooltip\r\n contentStyle={CHART_TOOLTIP_STYLE}\r\n labelStyle={CHART_TOOLTIP_LABEL_STYLE}\r\n formatter={(value) => Number(value).toLocaleString(\"pt-BR\")}\r\n />\r\n </PieChart>\r\n </ResponsiveContainer>\r\n {/ Total absolute no centro do donut /}\r\n <div className=\"absolute inset-0 flex flex-col items-center justify-center pointer-events-none\">\r\n <span className=\"text-caption-sm text-fg-muted\">Total</span>\r\n <span className=\"text-body-2xl font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]\">\r\n {total.toLocaleString(\"pt-BR\")}\r\n </span>\r\n </div>\r\n </div>\r\n {/ Lista de regiões — mt-auto empurra pro bottom do card /}\r\n <div className=\"mt-auto flex flex-col gap-gp-md\">\r\n {REGIONS.map((r) => (\r\n <div key={r.name} className=\"flex items-center gap-gp-md\">\r\n <span\r\n className=\"size-[10px] rounded-radius-full shrink-0\"\r\n style={{ background: r.color }}\r\n aria-hidden\r\n />\r\n <span className=\"flex-1 text-body-xs text-fg-default\">{r.name}</span>\r\n <span className=\"text-body-xs font-normal text-fg-default [font-variant-numeric:tabular-nums]\">\r\n {r.value.toLocaleString(\"pt-BR\")}\r\n </span>\r\n <Chip\r\n color={r.positive ? \"success\" : \"danger\"}\r\n variant=\"soft\"\r\n size=\"sm\"\r\n shape=\"pill\"\r\n >\r\n {r.delta}\r\n </Chip>\r\n </div>\r\n ))}\r\n </div>\r\n </SectionCard>\r\n );\r\n}\r\n\r\nfunction PersonAvatar({ initials, hex, size = \"md\" }: { initials: string; hex: string; size?: \"sm\" \| \"md\" }) {\r\n const cls = size === \"sm\" ? \"size-[24px] text-caption-xs\" : \"size-[32px] text-body-xs font-normal\";\r\n return (\r\n <Avatar className={cls} style={{ background: hex }}>\r\n <AvatarFallback className=\"bg-transparent text-white font-bold\">{initials}</AvatarFallback>\r\n </Avatar>\r\n );\r\n}\r\n\r\nfunction OpenConversationsList() {\r\n return (\r\n <ul className=\"m-0 p-0 list-none flex flex-col\">\r\n {OPEN_CONVS.map((c) => {\r\n const ChIcon = CHANNELS.find((ch) => ch.id === c.channel)?.icon ?? MessageSquare;\r\n return (\r\n <li\r\n key={c.id}\r\n className=\"flex items-center gap-gp-md py-pad-lg border-b border-border-subtle last:border-b-0 cursor-pointer hover:[&>]:opacity-90 transition-opacity\"\r\n >\r\n <PersonAvatar initials={c.initials} hex={c.hex} size=\"md\" />\r\n <div className=\"flex-1 min-w-0 flex flex-col gap-[2px]\">\r\n <div className=\"flex items-center gap-gp-sm\">\r\n <span className=\"text-body-sm font-semibold text-fg-default whitespace-nowrap overflow-hidden text-ellipsis\">\r\n {c.name}\r\n </span>\r\n <span className=\"text-caption-sm text-fg-subtle [font-variant-numeric:tabular-nums] shrink-0\">\r\n {c.id}\r\n </span>\r\n </div>\r\n <div className=\"flex items-center gap-gp-sm flex-wrap text-caption-sm text-fg-muted\">\r\n <span className=\"inline-flex items-center gap-[3px]\">\r\n <ChIcon size={11} strokeWidth={1.8} aria-hidden />\r\n {CHANNELS.find((ch) => ch.id === c.channel)?.name ?? c.channel}\r\n </span>\r\n {c.agent && (\r\n <>\r\n <span aria-hidden>·</span>\r\n <span>{c.agent.name}</span>\r\n </>\r\n )}\r\n </div>\r\n </div>\r\n <div className=\"flex flex-col items-end gap-[4px] shrink-0\">\r\n <Chip color={STATUS_TONE[c.status]} variant=\"soft\" size=\"sm\" shape=\"pill\">\r\n {STATUS_LABEL[c.status]}\r\n </Chip>\r\n <span className=\"inline-flex items-center gap-[3px] text-caption-sm text-fg-muted [font-variant-numeric:tabular-nums]\">\r\n <Clock size={10} strokeWidth={1.8} aria-hidden />\r\n {c.waitTime}\r\n </span>\r\n </div>\r\n </li>\r\n );\r\n })}\r\n </ul>\r\n );\r\n}\r\n\r\nfunction AgentPerformanceList() {\r\n return (\r\n <ul className=\"m-0 p-0 list-none flex flex-col\">\r\n {AGENTS.map((a, i) => (\r\n <li\r\n key={a.id}\r\n className=\"flex items-center gap-gp-md py-pad-lg border-b border-border-subtle last:border-b-0\"\r\n >\r\n <span className=\"grid place-items-center size-[20px] rounded-radius-full bg-bg-muted text-caption-sm font-bold text-fg-muted shrink-0 [font-variant-numeric:tabular-nums]\">\r\n {i + 1}\r\n </span>\r\n <div className=\"relative shrink-0\">\r\n <PersonAvatar initials={a.initials} hex={a.hex} size=\"md\" />\r\n <span\r\n className={cn(\r\n \"absolute -bottom-[1px] -right-[1px] size-[8px] rounded-radius-full border border-bg-surface\",\r\n a.active ? \"bg-bg-success\" : \"bg-bg-muted\",\r\n )}\r\n aria-label={a.active ? \"online\" : \"offline\"}\r\n />\r\n </div>\r\n <div className=\"flex-1 min-w-0 flex flex-col gap-[2px]\">\r\n <span className=\"text-body-sm font-semibold text-fg-default whitespace-nowrap overflow-hidden text-ellipsis\">\r\n {a.name}\r\n </span>\r\n <span className=\"text-caption-sm text-fg-muted\">\r\n {a.resolved} resolvidos · {a.avgTime} médio\r\n </span>\r\n </div>\r\n <div className=\"flex items-center gap-[3px] shrink-0 text-body-xs font-semibold text-fg-default\">\r\n <Star size={11} strokeWidth={2} className=\"text-fg-warning fill-current\" aria-hidden />\r\n <span className=\"[font-variant-numeric:tabular-nums]\">{a.csat.toFixed(1)}</span>\r\n </div>\r\n </li>\r\n ))}\r\n </ul>\r\n );\r\n}\r\n\r\n/** Canais com volume + status — estilo Campaign Performance. /\r\nfunction ChannelPerformanceList() {\r\n return (\r\n <ul className=\"m-0 p-0 list-none flex flex-col\">\r\n {CHANNELS.map((c) => {\r\n const Icon = c.icon;\r\n return (\r\n <li\r\n key={c.id}\r\n className=\"flex items-center gap-gp-lg py-pad-lg border-b border-border-subtle last:border-b-0\"\r\n >\r\n <span\r\n className=\"grid place-items-center size-[36px] rounded-radius-full shrink-0 text-white\"\r\n style={{ background: c.color }}\r\n aria-hidden\r\n >\r\n <Icon size={16} strokeWidth={1.8} />\r\n </span>\r\n <div className=\"flex-1 min-w-0 flex flex-col gap-[2px]\">\r\n <span className=\"text-body-sm font-semibold text-fg-default\">{c.name}</span>\r\n <span className=\"text-caption-sm text-fg-muted\">\r\n {c.volume} mensagens\r\n </span>\r\n </div>\r\n <Chip color={CHANNEL_STATUS_TONE[c.status]} variant=\"soft\" size=\"sm\" shape=\"pill\">\r\n {CHANNEL_STATUS_LABEL[c.status]}\r\n </Chip>\r\n </li>\r\n );\r\n })}\r\n </ul>\r\n );\r\n}\r\n\r\n/* Traffic Data — tabela com source/visits/bounce/goal. /\r\nfunction TrafficDataTable() {\r\n return (\r\n <SectionCard\r\n title=\"Origem do tráfego\"\r\n subtitle=\"Fontes de aquisição\"\r\n className=\"flex-1 h-full\"\r\n action={\r\n <div className=\"relative max-w-[200px]\">\r\n <Search\r\n size={14}\r\n strokeWidth={1.8}\r\n className=\"absolute left-pad-lg top-1/2 -translate-y-1/2 text-fg-muted pointer-events-none\"\r\n />\r\n <input\r\n type=\"search\"\r\n placeholder=\"Buscar...\"\r\n className=\"h-form-md pl-[34px] pr-pad-md w-full rounded-radius-md bg-bg-muted border border-border-input text-body-md text-fg-default placeholder:text-fg-muted focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring-brand focus-visible:border-border-brand\"\r\n />\r\n </div>\r\n }\r\n >\r\n <div className=\"overflow-x-auto -mx-pad-2xl px-pad-2xl\">\r\n <table className=\"w-full text-body-md border-separate border-spacing-0\">\r\n <thead>\r\n <tr className=\"text-caption-sm font-bold tracking-[0.04em] text-fg-subtle uppercase\">\r\n <th className=\"text-left pb-pad-md border-b border-border-subtle font-bold\">Fonte</th>\r\n <th className=\"text-right pb-pad-md border-b border-border-subtle font-bold\">Visitas</th>\r\n <th className=\"text-left pb-pad-md pl-pad-2xl border-b border-border-subtle font-bold\">Bounce</th>\r\n <th className=\"text-left pb-pad-md pl-pad-2xl border-b border-border-subtle font-bold\">Meta (%)</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n {TRAFFIC_ROWS.map((r) => (\r\n <tr key={r.source} className=\"text-body-xs font-normal\">\r\n <td className=\"py-pad-lg border-b border-border-subtle text-fg-default font-medium\">\r\n {r.source}\r\n </td>\r\n <td className=\"py-pad-lg border-b border-border-subtle text-right text-fg-default [font-variant-numeric:tabular-nums]\">\r\n {r.visits}\r\n </td>\r\n <td className=\"py-pad-sm pl-pad-2xl border-b border-border-subtle text-fg-muted [font-variant-numeric:tabular-nums]\">\r\n {r.bounce}\r\n </td>\r\n <td className=\"py-pad-sm pl-pad-2xl border-b border-border-subtle\">\r\n <div className=\"flex items-center gap-gp-md\">\r\n <div className=\"flex-1 h-[6px] bg-bg-muted rounded-radius-full overflow-hidden min-w-[80px]\">\r\n <div\r\n className=\"h-full rounded-radius-full\"\r\n style={{ width: `${r.goal}%`, background: r.goalColor }}\r\n />\r\n </div>\r\n <span className=\"text-caption-sm font-semibold text-fg-default [font-variant-numeric:tabular-nums] shrink-0 min-w-[32px] text-right\">\r\n {r.goal}%\r\n </span>\r\n </div>\r\n </td>\r\n </tr>\r\n ))}\r\n </tbody>\r\n </table>\r\n </div>\r\n </SectionCard>\r\n );\r\n}\r\n\r\n/ ─────────────────────────────────────────────────────────────\r\n * Page\r\n * ───────────────────────────────────────────────────────────── /\r\n\r\nexport default function DashboardShowcase() {\r\n const { theme, setTheme } = useTheme();\r\n const [period, setPeriod] = useState<string>(\"Últimos 7 dias\");\r\n\r\n return (\r\n <AppShell\r\n contexts={APP_SHELL_CONTEXTS}\r\n defaultActiveContextId=\"inbox\"\r\n defaultActiveItemHref=\"#dashboard\"\r\n breadcrumb={[{ label: \"Dashboard\" }]}\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 >\r\n <PageHeader\r\n title=\"Dashboard\"\r\n description=\"Visão geral do atendimento em tempo real — KPIs, volume, canais e performance da equipe.\"\r\n badge={\r\n <Chip color=\"primary\" variant=\"soft\" size=\"sm\" shape=\"pill\">\r\n Hoje\r\n </Chip>\r\n }\r\n actions={\r\n <>\r\n <Button\r\n color=\"secondary\"\r\n variant=\"outline\"\r\n size=\"icon-md\"\r\n aria-label=\"Mais ações\"\r\n >\r\n <MoreVertical />\r\n </Button>\r\n <Button\r\n color=\"secondary\"\r\n variant=\"outline\"\r\n size=\"md\"\r\n iconLeft={<Calendar />}\r\n iconRight={<ChevronDown />}\r\n onClick={() => {\r\n const next = period === \"Últimos 7 dias\" ? \"Últimos 30 dias\" : \"Últimos 7 dias\";\r\n setPeriod(next);\r\n }}\r\n >\r\n {period}\r\n </Button>\r\n </>\r\n }\r\n />\r\n\r\n {/ Row 1 — Welcome (2/3) + KeyInsights (1/3) — alturas iguais /}\r\n <section className=\"grid grid-cols-1 lg:grid-cols-3 gap-gp-2xl items-stretch\">\r\n <div className=\"lg:col-span-2 flex\">\r\n <WelcomeBanner />\r\n </div>\r\n <KeyInsightsCard />\r\n </section>\r\n\r\n {/ Row 2 — KPIs primários (6) /}\r\n <section\r\n aria-label=\"KPIs principais\"\r\n className=\"grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-gp-2xl\"\r\n >\r\n {KPIS_PRIMARY.map((kpi) => (\r\n <KpiCard key={kpi.id} kpi={kpi} />\r\n ))}\r\n </section>\r\n\r\n {/ Row 3 — Volume stacked (2/3) + Current visits donut (1/3) — alturas iguais /}\r\n <section className=\"grid grid-cols-1 lg:grid-cols-3 gap-gp-2xl items-stretch\">\r\n <SectionCard\r\n title=\"Volume de atendimentos\"\r\n subtitle=\"Humano vs IA — ano corrente\"\r\n className=\"lg:col-span-2 h-full\"\r\n >\r\n <VolumeStackedChart />\r\n </SectionCard>\r\n <CurrentVisitsCard />\r\n </section>\r\n\r\n {/ Row 4 — KPIs qualidade (4) — APÓS os charts /}\r\n <section\r\n aria-label=\"Qualidade do atendimento\"\r\n className=\"grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-gp-2xl\"\r\n >\r\n {KPIS_QUALITY.map((kpi) => (\r\n <KpiCard key={kpi.id} kpi={kpi} />\r\n ))}\r\n </section>\r\n\r\n {/ Row 5 — Open + Agents /}\r\n <section className=\"grid grid-cols-1 lg:grid-cols-2 gap-gp-2xl\">\r\n <SectionCard\r\n title=\"Atendimentos em aberto\"\r\n subtitle=\"5 ativos agora\"\r\n action={\r\n <Button color=\"secondary\" variant=\"ghost\" size=\"sm\">\r\n Ver todos\r\n </Button>\r\n }\r\n >\r\n <OpenConversationsList />\r\n </SectionCard>\r\n <SectionCard\r\n title=\"Performance da equipe\"\r\n subtitle=\"Ranking de hoje\"\r\n action={\r\n <Button color=\"secondary\" variant=\"ghost\" size=\"sm\">\r\n Ver equipe\r\n </Button>\r\n }\r\n >\r\n <AgentPerformanceList />\r\n </SectionCard>\r\n </section>\r\n\r\n {/ Row 6 — Channels (1/3) + Traffic Data (2/3). Ambos h-full pra\r\n alturas se igualarem dentro da row do grid. */}\r\n <section className=\"grid grid-cols-1 lg:grid-cols-3 gap-gp-2xl items-stretch\">\r\n <SectionCard title=\"Canais\" subtitle=\"Volume e status\" className=\"h-full\">\r\n <ChannelPerformanceList />\r\n </SectionCard>\r\n <div className=\"lg:col-span-2 flex\">\r\n <TrafficDataTable />\r\n </div>\r\n </section>\r\n </AppShell>\r\n );\r\n}\r\n"],"names":["Phone","Timer","CheckCircle2","UserPlus","Clock","TrendingUp","Star","Headphones","Bot","MessageSquare","Send","Mail","jsxs","jsx","cn","Chip","Sun","Button","ArrowRight","MoreVertical","ChevronDown","ResponsiveContainer","BarChart","CartesianGrid","XAxis","YAxis","Tooltip","Bar","PieChart","Pie","Cell","Avatar","AvatarFallback","Fragment","Search","useTheme","useState","AppShell","APP_SHELL_CONTEXTS","APP_SHELL_COMMANDS","APP_SHELL_NOTIFICATIONS","APP_SHELL_MESSAGES","APP_SHELL_THEME_OPTIONS","PageHeader","Calendar"],"mappings":"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"}

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

@@ -3,9 +3,9 @@ import { useState } from "react";
 import { u as useTheme } from "../chunks/useTheme-BUPLZBMs.mjs";
 import { MoreVertical, ChevronDown, Calendar, Phone, Timer, CheckCircle2, UserPlus, Clock, TrendingUp, Star, Headphones, Bot, Sun, ArrowRight, MessageSquare, Send, Mail, Search } from "lucide-react";
 import { ResponsiveContainer, BarChart, CartesianGrid, XAxis, YAxis, Tooltip, Bar, PieChart, Pie, Cell } from "recharts";
-import { B as Button, C as Chip, c as cn } from "../chunks/chip-group-D3D0i72q.mjs";
-import { A as AppShell, a as Avatar, b as AvatarFallback } from "../chunks/app-shell-CDy42aNI.mjs";
-import { P as PageHeader } from "../chunks/page-header-mC1gGtOI.mjs";
+import { B as Button, C as Chip, c as cn } from "../chunks/chip-group-_e-yh1Zq.mjs";
+import { A as AppShell, a as Avatar, b as AvatarFallback } from "../chunks/app-shell-C_enrPD8.mjs";
+import { P as PageHeader } from "../chunks/page-header-DM2G1mdi.mjs";
 import { e as APP_SHELL_THEME_OPTIONS, c as APP_SHELL_MESSAGES, d as APP_SHELL_NOTIFICATIONS, A as APP_SHELL_COMMANDS, a as APP_SHELL_CONTEXTS } from "../chunks/app-shell-mocks-kWIVSzLs.mjs";
 const KPIS_PRIMARY = [
   {
@@ -172,7 +172,7 @@ function KpiCard({ kpi }) {
   const cls = TONE_CLASSES[kpi.tone];
   return /* @__PURE__ */ jsxs("article", { className: "flex flex-col gap-gp-lg p-pad-3xl bg-bg-surface border border-border-subtle rounded-radius-xl shadow-sh-sm", children: [
     /* @__PURE__ */ jsxs("header", { className: "flex items-start justify-between gap-gp-md", children: [
-      /* @__PURE__ */ jsx("h3", { className: "m-0 text-paragraph-sm font-semibold text-fg-default", children: kpi.title }),
+      /* @__PURE__ */ jsx("h3", { className: "m-0 text-body-md font-semibold text-fg-default", children: kpi.title }),
       /* @__PURE__ */ jsx(
         "span",
         {
@@ -188,7 +188,7 @@ function KpiCard({ kpi }) {
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-gp-xs", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-gp-md flex-wrap", children: [
-        /* @__PURE__ */ jsx("span", { className: "text-[26px] font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]", children: kpi.value }),
+        /* @__PURE__ */ jsx("span", { className: "text-body-2xl font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]", children: kpi.value }),
         kpi.delta && /* @__PURE__ */ jsx(
           Chip,
           {
@@ -200,17 +200,17 @@ function KpiCard({ kpi }) {
           }
         )
       ] }),
-      kpi.delta && /* @__PURE__ */ jsx("span", { className: "text-[11px] text-fg-subtle", children: kpi.delta.label })
+      kpi.delta && /* @__PURE__ */ jsx("span", { className: "text-caption-sm text-fg-subtle", children: kpi.delta.label })
     ] })
   ] });
 }
 function WelcomeBanner() {
   return /* @__PURE__ */ jsx("article", { className: "relative overflow-hidden bg-bg-brand rounded-radius-xl p-pad-4xl flex items-center gap-gp-2xl flex-1 w-full", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-gp-md flex-1 min-w-0 z-[1]", children: [
-    /* @__PURE__ */ jsxs("h2", { className: "m-0 flex items-center gap-gp-md text-[22px] font-bold text-fg-on-brand", children: [
+    /* @__PURE__ */ jsxs("h2", { className: "m-0 flex items-center gap-gp-md text-body-2xl font-bold text-fg-on-brand", children: [
       "Boa tarde, Sergio",
       /* @__PURE__ */ jsx(Sun, { className: "size-icon-md text-fg-warning", fill: "currentColor" })
     ] }),
-    /* @__PURE__ */ jsxs("p", { className: "m-0 text-paragraph-sm text-fg-on-brand opacity-80 max-w-[480px]", children: [
+    /* @__PURE__ */ jsxs("p", { className: "m-0 text-body-md text-fg-on-brand opacity-80 max-w-[480px]", children: [
       "Acompanhe a performance da sua equipe hoje.",
       /* @__PURE__ */ jsx("br", {}),
       "Snapshot rápido das principais métricas do atendimento."
@@ -231,12 +231,12 @@ function WelcomeBanner() {
 function KeyInsightsCard() {
   return /* @__PURE__ */ 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__ */ jsxs("header", { className: "flex items-center justify-between gap-gp-md", children: [
-      /* @__PURE__ */ jsx("h3", { className: "m-0 text-[15px] font-bold text-fg-default", children: "Key Insights" }),
+      /* @__PURE__ */ jsx("h3", { className: "m-0 text-body-md font-medium font-bold text-fg-default", children: "Key Insights" }),
       /* @__PURE__ */ jsx(Button, { color: "secondary", variant: "ghost", size: "icon-sm", "aria-label": "Mais opções", children: /* @__PURE__ */ jsx(MoreVertical, {}) })
     ] }),
-    /* @__PURE__ */ jsx("p", { className: "m-0 text-[12px] text-fg-muted", children: "Receita acumulada (anual)" }),
+    /* @__PURE__ */ jsx("p", { className: "m-0 text-body-xs font-normal text-fg-muted", children: "Receita acumulada (anual)" }),
     /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-gp-md flex-wrap", children: [
-      /* @__PURE__ */ jsx("span", { className: "text-[26px] font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]", children: "R$ 395.7k" }),
+      /* @__PURE__ */ jsx("span", { className: "text-body-2xl font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]", children: "R$ 395.7k" }),
       /* @__PURE__ */ jsx(Chip, { color: "success", variant: "soft", size: "sm", shape: "pill", children: "+2.7%" })
     ] }),
     /* @__PURE__ */ jsxs("div", { className: "mt-auto flex flex-col gap-gp-md", children: [
@@ -245,7 +245,7 @@ function KeyInsightsCard() {
         /* @__PURE__ */ jsx("span", { className: "bg-bg-warning", style: { flex: 3 }, "aria-hidden": true }),
         /* @__PURE__ */ jsx("span", { className: "bg-bg-info", style: { flex: 4 }, "aria-hidden": true })
       ] }),
-      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-gp-lg flex-wrap text-[11px] text-fg-muted", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-gp-lg flex-wrap text-caption-sm text-fg-muted", children: [
         /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-[5px]", children: [
           /* @__PURE__ */ jsx("span", { className: "size-[8px] rounded-radius-full bg-bg-brand", "aria-hidden": true }),
           "São Paulo"
@@ -279,8 +279,8 @@ function SectionCard({
       children: [
         /* @__PURE__ */ jsxs("header", { className: "flex items-center justify-between gap-gp-md", children: [
           /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-[2px] min-w-0", children: [
-            /* @__PURE__ */ jsx("h3", { className: "m-0 text-[15px] font-bold text-fg-default", children: title }),
-            subtitle && /* @__PURE__ */ jsx("p", { className: "m-0 text-[12px] text-fg-muted", children: subtitle })
+            /* @__PURE__ */ jsx("h3", { className: "m-0 text-body-md font-medium font-bold text-fg-default", children: title }),
+            subtitle && /* @__PURE__ */ jsx("p", { className: "m-0 text-body-xs font-normal text-fg-muted", children: subtitle })
           ] }),
           action ?? /* @__PURE__ */ jsx(Button, { color: "secondary", variant: "ghost", size: "icon-sm", "aria-label": "Mais opções", children: /* @__PURE__ */ jsx(MoreVertical, {}) })
         ] }),
@@ -307,16 +307,16 @@ function VolumeStackedChart() {
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-gp-lg", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-gp-md flex-wrap", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-gp-md flex-wrap", children: [
-        /* @__PURE__ */ jsx("span", { className: "text-[26px] font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]", children: "R$ 395.7k" }),
+        /* @__PURE__ */ jsx("span", { className: "text-body-2xl font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]", children: "R$ 395.7k" }),
         /* @__PURE__ */ jsx(Chip, { color: "success", variant: "soft", size: "sm", shape: "pill", children: "+18%" }),
-        /* @__PURE__ */ jsx("span", { className: "text-[12px] text-fg-muted", children: "vs ano passado" })
+        /* @__PURE__ */ jsx("span", { className: "text-body-xs font-normal text-fg-muted", children: "vs ano passado" })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "ml-auto flex items-center gap-gp-md", children: [
-        /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-[4px] text-[11px] text-fg-muted", children: [
+        /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-[4px] text-caption-sm text-fg-muted", children: [
           /* @__PURE__ */ jsx("span", { className: "size-[8px] rounded-radius-full bg-bg-brand", "aria-hidden": true }),
           " Humano"
         ] }),
-        /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-[4px] text-[11px] text-fg-muted", children: [
+        /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-[4px] text-caption-sm text-fg-muted", children: [
           /* @__PURE__ */ jsx("span", { className: "size-[8px] rounded-radius-full bg-bg-brand-subtle", "aria-hidden": true }),
           " IA"
         ] }),
@@ -412,8 +412,8 @@ function CurrentVisitsCard() {
         )
       ] }) }),
       /* @__PURE__ */ jsxs("div", { className: "absolute inset-0 flex flex-col items-center justify-center pointer-events-none", children: [
-        /* @__PURE__ */ jsx("span", { className: "text-[11px] text-fg-muted", children: "Total" }),
-        /* @__PURE__ */ jsx("span", { className: "text-[24px] font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]", children: total.toLocaleString("pt-BR") })
+        /* @__PURE__ */ jsx("span", { className: "text-caption-sm text-fg-muted", children: "Total" }),
+        /* @__PURE__ */ jsx("span", { className: "text-body-2xl font-bold text-fg-default leading-none [font-variant-numeric:tabular-nums]", children: total.toLocaleString("pt-BR") })
       ] })
     ] }),
     /* @__PURE__ */ jsx("div", { className: "mt-auto flex flex-col gap-gp-md", children: REGIONS.map((r) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-gp-md", children: [
@@ -425,8 +425,8 @@ function CurrentVisitsCard() {
           "aria-hidden": true
         }
       ),
-      /* @__PURE__ */ jsx("span", { className: "flex-1 text-[12.5px] text-fg-default font-medium", children: r.name }),
-      /* @__PURE__ */ jsx("span", { className: "text-[12px] text-fg-default [font-variant-numeric:tabular-nums]", children: r.value.toLocaleString("pt-BR") }),
+      /* @__PURE__ */ jsx("span", { className: "flex-1 text-body-xs text-fg-default", children: r.name }),
+      /* @__PURE__ */ jsx("span", { className: "text-body-xs font-normal text-fg-default [font-variant-numeric:tabular-nums]", children: r.value.toLocaleString("pt-BR") }),
       /* @__PURE__ */ jsx(
         Chip,
         {
@@ -441,7 +441,7 @@ function CurrentVisitsCard() {
   ] });
 }
 function PersonAvatar({ initials, hex, size = "md" }) {
-  const cls = size === "sm" ? "size-[24px] text-[10px]" : "size-[32px] text-[12px]";
+  const cls = size === "sm" ? "size-[24px] text-caption-xs" : "size-[32px] text-body-xs font-normal";
   return /* @__PURE__ */ jsx(Avatar, { className: cls, style: { background: hex }, children: /* @__PURE__ */ jsx(AvatarFallback, { className: "bg-transparent text-white font-bold", children: initials }) });
 }
 function OpenConversationsList() {
@@ -455,10 +455,10 @@ function OpenConversationsList() {
           /* @__PURE__ */ jsx(PersonAvatar, { initials: c.initials, hex: c.hex, size: "md" }),
           /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0 flex flex-col gap-[2px]", children: [
             /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-gp-sm", children: [
-              /* @__PURE__ */ jsx("span", { className: "text-[13px] font-semibold text-fg-default whitespace-nowrap overflow-hidden text-ellipsis", children: c.name }),
-              /* @__PURE__ */ jsx("span", { className: "text-[11px] text-fg-subtle [font-variant-numeric:tabular-nums] shrink-0", children: c.id })
+              /* @__PURE__ */ jsx("span", { className: "text-body-sm font-semibold text-fg-default whitespace-nowrap overflow-hidden text-ellipsis", children: c.name }),
+              /* @__PURE__ */ jsx("span", { className: "text-caption-sm text-fg-subtle [font-variant-numeric:tabular-nums] shrink-0", children: c.id })
             ] }),
-            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-gp-sm flex-wrap text-[11px] text-fg-muted", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-gp-sm flex-wrap text-caption-sm text-fg-muted", children: [
               /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-[3px]", children: [
                 /* @__PURE__ */ jsx(ChIcon, { size: 11, strokeWidth: 1.8, "aria-hidden": true }),
                 CHANNELS.find((ch) => ch.id === c.channel)?.name ?? c.channel
@@ -471,7 +471,7 @@ function OpenConversationsList() {
           ] }),
           /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-end gap-[4px] shrink-0", children: [
             /* @__PURE__ */ jsx(Chip, { color: STATUS_TONE[c.status], variant: "soft", size: "sm", shape: "pill", children: STATUS_LABEL[c.status] }),
-            /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-[3px] text-[11px] text-fg-muted [font-variant-numeric:tabular-nums]", children: [
+            /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-[3px] text-caption-sm text-fg-muted [font-variant-numeric:tabular-nums]", children: [
               /* @__PURE__ */ jsx(Clock, { size: 10, strokeWidth: 1.8, "aria-hidden": true }),
               c.waitTime
             ] })
@@ -488,7 +488,7 @@ function AgentPerformanceList() {
     {
       className: "flex items-center gap-gp-md py-pad-lg border-b border-border-subtle last:border-b-0",
       children: [
-        /* @__PURE__ */ jsx("span", { className: "grid place-items-center size-[20px] rounded-radius-full bg-bg-muted text-[11px] font-bold text-fg-muted shrink-0 [font-variant-numeric:tabular-nums]", children: i + 1 }),
+        /* @__PURE__ */ jsx("span", { className: "grid place-items-center size-[20px] rounded-radius-full bg-bg-muted text-caption-sm font-bold text-fg-muted shrink-0 [font-variant-numeric:tabular-nums]", children: i + 1 }),
         /* @__PURE__ */ jsxs("div", { className: "relative shrink-0", children: [
           /* @__PURE__ */ jsx(PersonAvatar, { initials: a.initials, hex: a.hex, size: "md" }),
           /* @__PURE__ */ jsx(
@@ -503,15 +503,15 @@ function AgentPerformanceList() {
           )
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0 flex flex-col gap-[2px]", children: [
-          /* @__PURE__ */ jsx("span", { className: "text-[13px] font-semibold text-fg-default whitespace-nowrap overflow-hidden text-ellipsis", children: a.name }),
-          /* @__PURE__ */ jsxs("span", { className: "text-[11px] text-fg-muted", children: [
+          /* @__PURE__ */ jsx("span", { className: "text-body-sm font-semibold text-fg-default whitespace-nowrap overflow-hidden text-ellipsis", children: a.name }),
+          /* @__PURE__ */ jsxs("span", { className: "text-caption-sm text-fg-muted", children: [
             a.resolved,
             " resolvidos · ",
             a.avgTime,
             " médio"
           ] })
         ] }),
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[3px] shrink-0 text-[12px] font-semibold text-fg-default", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[3px] shrink-0 text-body-xs font-semibold text-fg-default", children: [
           /* @__PURE__ */ jsx(Star, { size: 11, strokeWidth: 2, className: "text-fg-warning fill-current", "aria-hidden": true }),
           /* @__PURE__ */ jsx("span", { className: "[font-variant-numeric:tabular-nums]", children: a.csat.toFixed(1) })
         ] })
@@ -538,8 +538,8 @@ function ChannelPerformanceList() {
             }
           ),
           /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0 flex flex-col gap-[2px]", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-[13px] font-semibold text-fg-default", children: c.name }),
-            /* @__PURE__ */ jsxs("span", { className: "text-[11px] text-fg-muted", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-body-sm font-semibold text-fg-default", children: c.name }),
+            /* @__PURE__ */ jsxs("span", { className: "text-caption-sm text-fg-muted", children: [
               c.volume,
               " mensagens"
             ] })
@@ -572,18 +572,18 @@ function TrafficDataTable() {
           {
             type: "search",
             placeholder: "Buscar...",
-            className: "h-form-md pl-[34px] pr-pad-md w-full rounded-radius-md bg-bg-muted border border-border-input text-paragraph-sm text-fg-default placeholder:text-fg-muted focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring-brand focus-visible:border-border-brand"
+            className: "h-form-md pl-[34px] pr-pad-md w-full rounded-radius-md bg-bg-muted border border-border-input text-body-md text-fg-default placeholder:text-fg-muted focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring-brand focus-visible:border-border-brand"
           }
         )
       ] }),
-      children: /* @__PURE__ */ jsx("div", { className: "overflow-x-auto -mx-pad-2xl px-pad-2xl", children: /* @__PURE__ */ jsxs("table", { className: "w-full text-paragraph-sm border-separate border-spacing-0", children: [
-        /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: "text-[11px] font-bold tracking-[0.04em] text-fg-subtle uppercase", children: [
+      children: /* @__PURE__ */ jsx("div", { className: "overflow-x-auto -mx-pad-2xl px-pad-2xl", children: /* @__PURE__ */ jsxs("table", { className: "w-full text-body-md border-separate border-spacing-0", children: [
+        /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: "text-caption-sm font-bold tracking-[0.04em] text-fg-subtle uppercase", children: [
           /* @__PURE__ */ jsx("th", { className: "text-left pb-pad-md border-b border-border-subtle font-bold", children: "Fonte" }),
           /* @__PURE__ */ jsx("th", { className: "text-right pb-pad-md border-b border-border-subtle font-bold", children: "Visitas" }),
           /* @__PURE__ */ jsx("th", { className: "text-left pb-pad-md pl-pad-2xl border-b border-border-subtle font-bold", children: "Bounce" }),
           /* @__PURE__ */ jsx("th", { className: "text-left pb-pad-md pl-pad-2xl border-b border-border-subtle font-bold", children: "Meta (%)" })
         ] }) }),
-        /* @__PURE__ */ jsx("tbody", { children: TRAFFIC_ROWS.map((r) => /* @__PURE__ */ jsxs("tr", { className: "text-[12.5px]", children: [
+        /* @__PURE__ */ jsx("tbody", { children: TRAFFIC_ROWS.map((r) => /* @__PURE__ */ jsxs("tr", { className: "text-body-xs font-normal", children: [
           /* @__PURE__ */ jsx("td", { className: "py-pad-lg border-b border-border-subtle text-fg-default font-medium", children: r.source }),
           /* @__PURE__ */ jsx("td", { className: "py-pad-lg border-b border-border-subtle text-right text-fg-default [font-variant-numeric:tabular-nums]", children: r.visits }),
           /* @__PURE__ */ jsx("td", { className: "py-pad-sm pl-pad-2xl border-b border-border-subtle text-fg-muted [font-variant-numeric:tabular-nums]", children: r.bounce }),
@@ -595,7 +595,7 @@ function TrafficDataTable() {
                 style: { width: `${r.goal}%`, background: r.goalColor }
               }
             ) }),
-            /* @__PURE__ */ jsxs("span", { className: "text-[11px] font-semibold text-fg-default [font-variant-numeric:tabular-nums] shrink-0 min-w-[32px] text-right", children: [
+            /* @__PURE__ */ jsxs("span", { className: "text-caption-sm font-semibold text-fg-default [font-variant-numeric:tabular-nums] shrink-0 min-w-[32px] text-right", children: [
               r.goal,
               "%"
             ] })