@snksergio/design-system 0.57.0 → 0.60.0

package/dist-lib/chunks/{kpi-delta-Bfs_oVpq.mjs → kpi-delta-Df6C70_5.mjs}

@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { createContext, useContext } from "react";
 import { af as tv, c as cn } from "./avatar-CZRLkTxt.mjs";
 import { TrendingUp } from "lucide-react";
-import { C as Chip } from "./useTheme-caPM-I73.mjs";
+import { C as Chip } from "./useTheme-BwxTDdqf.mjs";
 const kpi = tv({
   slots: {
     root: "flex flex-col gap-gp-lg",
@@ -147,4 +147,4 @@ export {
   Kpi as a,
   KpiDelta as b
 };
-//# sourceMappingURL=kpi-delta-Bfs_oVpq.mjs.map
+//# sourceMappingURL=kpi-delta-Df6C70_5.mjs.map

package/dist-lib/chunks/{kpi-delta-Bfs_oVpq.mjs.map → kpi-delta-Df6C70_5.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"kpi-delta-Bfs_oVpq.mjs","sources":["../../src/components/ui/Kpi/kpi.styles.ts","../../src/components/ui/Kpi/kpi-group.tsx","../../src/components/ui/Kpi/kpi.tsx","../../src/components/ui/Kpi/kpi-delta.tsx"],"sourcesContent":["import { tv } from \"@/utils/tv\";\r\n\r\n/* ══════════════════════════════════════════════════════════════════════════\r\n   Kpi — estilos (tv). 100% sobre tokens do DS, theme-aware.\r\n   ══════════════════════════════════════════════════════════════════════════ */\r\n\r\nexport const kpi = tv({\r\n  slots: {\r\n    root: \"flex flex-col gap-gp-lg\",\r\n    header: \"flex items-start justify-between gap-gp-md\",\r\n    label: \"m-0 text-body-md font-semibold text-fg-default\",\r\n    iconBox:\r\n      \"grid size-form-lg shrink-0 place-items-center rounded-radius-lg [&>svg]:size-icon-md\",\r\n    main: \"flex flex-col gap-gp-xs\",\r\n    valueRow: \"flex flex-wrap items-center gap-gp-md\",\r\n    value:\r\n      \"leading-none text-fg-default [font-variant-numeric:tabular-nums]\",\r\n    hint: \"text-caption-sm text-fg-subtle\",\r\n    chart: \"mt-gp-xs\",\r\n    footnote:\r\n      \"mt-pad-md border-t border-border-subtle pt-pad-lg text-caption-md text-fg-muted\",\r\n  },\r\n  variants: {\r\n    // Tamanho do valor de destaque — presets `stat-*` (número de métrica).\r\n    // Default `md` (24px) = idêntico ao antigo `body-2xl`. Weight/leading tight\r\n    // vêm do preset + slot; pareado com tabular-nums.\r\n    size: {\r\n      sm: { value: \"text-stat-sm\" },\r\n      md: { value: \"text-stat-md\" },\r\n      lg: { value: \"text-stat-lg\" },\r\n      xl: { value: \"text-stat-xl\" },\r\n    },\r\n    surface: {\r\n      card: {\r\n        root: \"rounded-radius-xl border border-border-subtle bg-bg-surface p-pad-3xl shadow-sh-sm\",\r\n      },\r\n      plain: { root: \"p-pad-3xl\" },\r\n    },\r\n    tone: {\r\n      brand: { iconBox: \"bg-bg-brand-subtle text-fg-brand\" },\r\n      success: { iconBox: \"bg-bg-success-muted text-fg-success\" },\r\n      warning: { iconBox: \"bg-bg-warning-muted text-fg-warning\" },\r\n      info: { iconBox: \"bg-bg-info-muted text-fg-info\" },\r\n      danger: { iconBox: \"bg-bg-danger-muted text-fg-danger\" },\r\n      neutral: { iconBox: \"bg-bg-muted text-fg-muted\" },\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    size: \"md\",\r\n    surface: \"card\",\r\n    tone: \"neutral\",\r\n  },\r\n});\r\n\r\nexport const kpiGroup = tv({\r\n  base: \"grid w-full\",\r\n  variants: {\r\n    columns: {\r\n      2: \"grid-cols-1 sm:grid-cols-2\",\r\n      3: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-3\",\r\n      4: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-4\",\r\n      5: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-5\",\r\n      6: \"grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-6\",\r\n    },\r\n    divided: {\r\n      // 1 card único com divisórias (linha no mobile, coluna no sm+)\r\n      true: \"overflow-hidden rounded-radius-xl border border-border-subtle bg-bg-surface shadow-sh-sm divide-y divide-border-subtle sm:divide-y-0 sm:divide-x\",\r\n      false: \"gap-gp-2xl\",\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    columns: 4,\r\n    divided: false,\r\n  },\r\n});\r\n","\"use client\";\r\n\r\nimport { createContext } from \"react\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { kpiGroup } from \"./kpi.styles\";\r\nimport type { KpiGroupProps } from \"./kpi.types\";\r\n\r\n/** Superfície herdada pelos `Kpi` filhos (card normal vs plain dentro de divided). */\r\nexport const KpiSurfaceContext = createContext<\"card\" | \"plain\">(\"card\");\r\n\r\n/**\r\n * KpiGroup — layout de composição pros `Kpi`. `columns` (responsivo) e\r\n * `divided` (vira 1 card único com divisórias entre os KPIs).\r\n */\r\nexport function KpiGroup({\r\n  columns = 4,\r\n  divided = false,\r\n  children,\r\n  className,\r\n}: KpiGroupProps) {\r\n  return (\r\n    <KpiSurfaceContext.Provider value={divided ? \"plain\" : \"card\"}>\r\n      <div className={cn(kpiGroup({ columns, divided }), className)}>\r\n        {children}\r\n      </div>\r\n    </KpiSurfaceContext.Provider>\r\n  );\r\n}\r\n\r\nKpiGroup.displayName = \"KpiGroup\";\r\n","\"use client\";\r\n\r\nimport { useContext } from \"react\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { kpi } from \"./kpi.styles\";\r\nimport { KpiSurfaceContext } from \"./kpi-group\";\r\nimport type { KpiProps } from \"./kpi.types\";\r\n\r\n/**\r\n * Kpi — card de KPI composável: header (label + ícone por tone), valor +\r\n * delta, hint, slot livre (sparkline/chart) e footnote. Use dentro de\r\n * `KpiGroup` pra rows/grids; dentro de `KpiGroup divided` ele vira \"plain\".\r\n */\r\nexport function Kpi({\r\n  label,\r\n  value,\r\n  delta,\r\n  hint,\r\n  icon,\r\n  tone = \"neutral\",\r\n  size = \"md\",\r\n  footnote,\r\n  children,\r\n  surface,\r\n  className,\r\n}: KpiProps) {\r\n  const inherited = useContext(KpiSurfaceContext);\r\n  const s = kpi({ size, surface: surface ?? inherited, tone });\r\n\r\n  return (\r\n    <article className={cn(s.root(), className)}>\r\n      <header className={s.header()}>\r\n        <h3 className={s.label()}>{label}</h3>\r\n        {icon && (\r\n          <span className={s.iconBox()} aria-hidden>\r\n            {icon}\r\n          </span>\r\n        )}\r\n      </header>\r\n      <div className={s.main()}>\r\n        <div className={s.valueRow()}>\r\n          <span className={s.value()}>{value}</span>\r\n          {delta}\r\n        </div>\r\n        {hint && <span className={s.hint()}>{hint}</span>}\r\n      </div>\r\n      {children && <div className={s.chart()}>{children}</div>}\r\n      {footnote && <div className={s.footnote()}>{footnote}</div>}\r\n    </article>\r\n  );\r\n}\r\n\r\nKpi.displayName = \"Kpi\";\r\n","\"use client\";\r\n\r\nimport { TrendingUp } from \"lucide-react\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { Chip } from \"@/components/ui/Chip\";\r\nimport type { KpiDeltaProps } from \"./kpi.types\";\r\n\r\n/**\r\n * KpiDelta — pílula de variação (sobre o Chip). Tom semântico explícito\r\n * (success/danger/neutral) + seta opcional. O tom é decisão do consumidor —\r\n * \"subir\" nem sempre é positivo (ex.: tempo de espera).\r\n *\r\n * `signed` deriva tom+seta do sinal do `value` (\"-\" → danger/down; senão\r\n * success/up). `tone`/`direction` explícitos sempre vencem.\r\n */\r\nexport function KpiDelta({\r\n  value,\r\n  tone,\r\n  direction,\r\n  signed = false,\r\n  className,\r\n}: KpiDeltaProps) {\r\n  const isNegative =\r\n    signed && typeof value === \"string\" && value.trim().startsWith(\"-\");\r\n  const resolvedTone = tone ?? (signed ? (isNegative ? \"danger\" : \"success\") : \"success\");\r\n  const resolvedDirection = direction ?? (signed ? (isNegative ? \"down\" : \"up\") : undefined);\r\n\r\n  return (\r\n    <Chip\r\n      color={resolvedTone}\r\n      variant=\"soft\"\r\n      size=\"sm\"\r\n      shape=\"pill\"\r\n      className={className}\r\n    >\r\n      {resolvedDirection && (\r\n        <TrendingUp\r\n          className={cn(\"size-[12px]\", resolvedDirection === \"down\" && \"rotate-180\")}\r\n          aria-hidden\r\n        />\r\n      )}\r\n      {value}\r\n    </Chip>\r\n  );\r\n}\r\n\r\nKpiDelta.displayName = \"KpiDelta\";\r\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"kpi-delta-Df6C70_5.mjs","sources":["../../src/components/ui/Kpi/kpi.styles.ts","../../src/components/ui/Kpi/kpi-group.tsx","../../src/components/ui/Kpi/kpi.tsx","../../src/components/ui/Kpi/kpi-delta.tsx"],"sourcesContent":["import { tv } from \"@/utils/tv\";\r\n\r\n/* ══════════════════════════════════════════════════════════════════════════\r\n   Kpi — estilos (tv). 100% sobre tokens do DS, theme-aware.\r\n   ══════════════════════════════════════════════════════════════════════════ */\r\n\r\nexport const kpi = tv({\r\n  slots: {\r\n    root: \"flex flex-col gap-gp-lg\",\r\n    header: \"flex items-start justify-between gap-gp-md\",\r\n    label: \"m-0 text-body-md font-semibold text-fg-default\",\r\n    iconBox:\r\n      \"grid size-form-lg shrink-0 place-items-center rounded-radius-lg [&>svg]:size-icon-md\",\r\n    main: \"flex flex-col gap-gp-xs\",\r\n    valueRow: \"flex flex-wrap items-center gap-gp-md\",\r\n    value:\r\n      \"leading-none text-fg-default [font-variant-numeric:tabular-nums]\",\r\n    hint: \"text-caption-sm text-fg-subtle\",\r\n    chart: \"mt-gp-xs\",\r\n    footnote:\r\n      \"mt-pad-md border-t border-border-subtle pt-pad-lg text-caption-md text-fg-muted\",\r\n  },\r\n  variants: {\r\n    // Tamanho do valor de destaque — presets `stat-*` (número de métrica).\r\n    // Default `md` (24px) = idêntico ao antigo `body-2xl`. Weight/leading tight\r\n    // vêm do preset + slot; pareado com tabular-nums.\r\n    size: {\r\n      sm: { value: \"text-stat-sm\" },\r\n      md: { value: \"text-stat-md\" },\r\n      lg: { value: \"text-stat-lg\" },\r\n      xl: { value: \"text-stat-xl\" },\r\n    },\r\n    surface: {\r\n      card: {\r\n        root: \"rounded-radius-xl border border-border-subtle bg-bg-surface p-pad-3xl shadow-sh-sm\",\r\n      },\r\n      plain: { root: \"p-pad-3xl\" },\r\n    },\r\n    tone: {\r\n      brand: { iconBox: \"bg-bg-brand-subtle text-fg-brand\" },\r\n      success: { iconBox: \"bg-bg-success-muted text-fg-success\" },\r\n      warning: { iconBox: \"bg-bg-warning-muted text-fg-warning\" },\r\n      info: { iconBox: \"bg-bg-info-muted text-fg-info\" },\r\n      danger: { iconBox: \"bg-bg-danger-muted text-fg-danger\" },\r\n      neutral: { iconBox: \"bg-bg-muted text-fg-muted\" },\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    size: \"md\",\r\n    surface: \"card\",\r\n    tone: \"neutral\",\r\n  },\r\n});\r\n\r\nexport const kpiGroup = tv({\r\n  base: \"grid w-full\",\r\n  variants: {\r\n    columns: {\r\n      2: \"grid-cols-1 sm:grid-cols-2\",\r\n      3: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-3\",\r\n      4: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-4\",\r\n      5: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-5\",\r\n      6: \"grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-6\",\r\n    },\r\n    divided: {\r\n      // 1 card único com divisórias (linha no mobile, coluna no sm+)\r\n      true: \"overflow-hidden rounded-radius-xl border border-border-subtle bg-bg-surface shadow-sh-sm divide-y divide-border-subtle sm:divide-y-0 sm:divide-x\",\r\n      false: \"gap-gp-2xl\",\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    columns: 4,\r\n    divided: false,\r\n  },\r\n});\r\n","\"use client\";\r\n\r\nimport { createContext } from \"react\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { kpiGroup } from \"./kpi.styles\";\r\nimport type { KpiGroupProps } from \"./kpi.types\";\r\n\r\n/** Superfície herdada pelos `Kpi` filhos (card normal vs plain dentro de divided). */\r\nexport const KpiSurfaceContext = createContext<\"card\" | \"plain\">(\"card\");\r\n\r\n/**\r\n * KpiGroup — layout de composição pros `Kpi`. `columns` (responsivo) e\r\n * `divided` (vira 1 card único com divisórias entre os KPIs).\r\n */\r\nexport function KpiGroup({\r\n  columns = 4,\r\n  divided = false,\r\n  children,\r\n  className,\r\n}: KpiGroupProps) {\r\n  return (\r\n    <KpiSurfaceContext.Provider value={divided ? \"plain\" : \"card\"}>\r\n      <div className={cn(kpiGroup({ columns, divided }), className)}>\r\n        {children}\r\n      </div>\r\n    </KpiSurfaceContext.Provider>\r\n  );\r\n}\r\n\r\nKpiGroup.displayName = \"KpiGroup\";\r\n","\"use client\";\r\n\r\nimport { useContext } from \"react\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { kpi } from \"./kpi.styles\";\r\nimport { KpiSurfaceContext } from \"./kpi-group\";\r\nimport type { KpiProps } from \"./kpi.types\";\r\n\r\n/**\r\n * Kpi — card de KPI composável: header (label + ícone por tone), valor +\r\n * delta, hint, slot livre (sparkline/chart) e footnote. Use dentro de\r\n * `KpiGroup` pra rows/grids; dentro de `KpiGroup divided` ele vira \"plain\".\r\n */\r\nexport function Kpi({\r\n  label,\r\n  value,\r\n  delta,\r\n  hint,\r\n  icon,\r\n  tone = \"neutral\",\r\n  size = \"md\",\r\n  footnote,\r\n  children,\r\n  surface,\r\n  className,\r\n}: KpiProps) {\r\n  const inherited = useContext(KpiSurfaceContext);\r\n  const s = kpi({ size, surface: surface ?? inherited, tone });\r\n\r\n  return (\r\n    <article className={cn(s.root(), className)}>\r\n      <header className={s.header()}>\r\n        <h3 className={s.label()}>{label}</h3>\r\n        {icon && (\r\n          <span className={s.iconBox()} aria-hidden>\r\n            {icon}\r\n          </span>\r\n        )}\r\n      </header>\r\n      <div className={s.main()}>\r\n        <div className={s.valueRow()}>\r\n          <span className={s.value()}>{value}</span>\r\n          {delta}\r\n        </div>\r\n        {hint && <span className={s.hint()}>{hint}</span>}\r\n      </div>\r\n      {children && <div className={s.chart()}>{children}</div>}\r\n      {footnote && <div className={s.footnote()}>{footnote}</div>}\r\n    </article>\r\n  );\r\n}\r\n\r\nKpi.displayName = \"Kpi\";\r\n","\"use client\";\r\n\r\nimport { TrendingUp } from \"lucide-react\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { Chip } from \"@/components/ui/Chip\";\r\nimport type { KpiDeltaProps } from \"./kpi.types\";\r\n\r\n/**\r\n * KpiDelta — pílula de variação (sobre o Chip). Tom semântico explícito\r\n * (success/danger/neutral) + seta opcional. O tom é decisão do consumidor —\r\n * \"subir\" nem sempre é positivo (ex.: tempo de espera).\r\n *\r\n * `signed` deriva tom+seta do sinal do `value` (\"-\" → danger/down; senão\r\n * success/up). `tone`/`direction` explícitos sempre vencem.\r\n */\r\nexport function KpiDelta({\r\n  value,\r\n  tone,\r\n  direction,\r\n  signed = false,\r\n  className,\r\n}: KpiDeltaProps) {\r\n  const isNegative =\r\n    signed && typeof value === \"string\" && value.trim().startsWith(\"-\");\r\n  const resolvedTone = tone ?? (signed ? (isNegative ? \"danger\" : \"success\") : \"success\");\r\n  const resolvedDirection = direction ?? (signed ? (isNegative ? \"down\" : \"up\") : undefined);\r\n\r\n  return (\r\n    <Chip\r\n      color={resolvedTone}\r\n      variant=\"soft\"\r\n      size=\"sm\"\r\n      shape=\"pill\"\r\n      className={className}\r\n    >\r\n      {resolvedDirection && (\r\n        <TrendingUp\r\n          className={cn(\"size-[12px]\", resolvedDirection === \"down\" && \"rotate-180\")}\r\n          aria-hidden\r\n        />\r\n      )}\r\n      {value}\r\n    </Chip>\r\n  );\r\n}\r\n\r\nKpiDelta.displayName = \"KpiDelta\";\r\n"],"names":[],"mappings":"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"}

package/dist-lib/chunks/{kpi-delta-wEzw5zSu.cjs → kpi-delta-DyJRQjWb.cjs}

@@ -3,7 +3,7 @@ const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const avatar = require("./avatar-CMWPg3A3.cjs");
 const lucideReact = require("lucide-react");
-const useTheme = require("./useTheme-BTjHuaT2.cjs");
+const useTheme = require("./useTheme-DUupiWzC.cjs");
 const kpi = avatar.tv({
   slots: {
     root: "flex flex-col gap-gp-lg",
@@ -146,4 +146,4 @@ KpiDelta.displayName = "KpiDelta";
 exports.Kpi = Kpi;
 exports.KpiDelta = KpiDelta;
 exports.KpiGroup = KpiGroup;
-//# sourceMappingURL=kpi-delta-wEzw5zSu.cjs.map
+//# sourceMappingURL=kpi-delta-DyJRQjWb.cjs.map

package/dist-lib/chunks/{kpi-delta-wEzw5zSu.cjs.map → kpi-delta-DyJRQjWb.cjs.map}

@@ -1 +1 @@
-{"version":3,"file":"kpi-delta-wEzw5zSu.cjs","sources":["../../src/components/ui/Kpi/kpi.styles.ts","../../src/components/ui/Kpi/kpi-group.tsx","../../src/components/ui/Kpi/kpi.tsx","../../src/components/ui/Kpi/kpi-delta.tsx"],"sourcesContent":["import { tv } from \"@/utils/tv\";\r\n\r\n/* ══════════════════════════════════════════════════════════════════════════\r\n   Kpi — estilos (tv). 100% sobre tokens do DS, theme-aware.\r\n   ══════════════════════════════════════════════════════════════════════════ */\r\n\r\nexport const kpi = tv({\r\n  slots: {\r\n    root: \"flex flex-col gap-gp-lg\",\r\n    header: \"flex items-start justify-between gap-gp-md\",\r\n    label: \"m-0 text-body-md font-semibold text-fg-default\",\r\n    iconBox:\r\n      \"grid size-form-lg shrink-0 place-items-center rounded-radius-lg [&>svg]:size-icon-md\",\r\n    main: \"flex flex-col gap-gp-xs\",\r\n    valueRow: \"flex flex-wrap items-center gap-gp-md\",\r\n    value:\r\n      \"leading-none text-fg-default [font-variant-numeric:tabular-nums]\",\r\n    hint: \"text-caption-sm text-fg-subtle\",\r\n    chart: \"mt-gp-xs\",\r\n    footnote:\r\n      \"mt-pad-md border-t border-border-subtle pt-pad-lg text-caption-md text-fg-muted\",\r\n  },\r\n  variants: {\r\n    // Tamanho do valor de destaque — presets `stat-*` (número de métrica).\r\n    // Default `md` (24px) = idêntico ao antigo `body-2xl`. Weight/leading tight\r\n    // vêm do preset + slot; pareado com tabular-nums.\r\n    size: {\r\n      sm: { value: \"text-stat-sm\" },\r\n      md: { value: \"text-stat-md\" },\r\n      lg: { value: \"text-stat-lg\" },\r\n      xl: { value: \"text-stat-xl\" },\r\n    },\r\n    surface: {\r\n      card: {\r\n        root: \"rounded-radius-xl border border-border-subtle bg-bg-surface p-pad-3xl shadow-sh-sm\",\r\n      },\r\n      plain: { root: \"p-pad-3xl\" },\r\n    },\r\n    tone: {\r\n      brand: { iconBox: \"bg-bg-brand-subtle text-fg-brand\" },\r\n      success: { iconBox: \"bg-bg-success-muted text-fg-success\" },\r\n      warning: { iconBox: \"bg-bg-warning-muted text-fg-warning\" },\r\n      info: { iconBox: \"bg-bg-info-muted text-fg-info\" },\r\n      danger: { iconBox: \"bg-bg-danger-muted text-fg-danger\" },\r\n      neutral: { iconBox: \"bg-bg-muted text-fg-muted\" },\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    size: \"md\",\r\n    surface: \"card\",\r\n    tone: \"neutral\",\r\n  },\r\n});\r\n\r\nexport const kpiGroup = tv({\r\n  base: \"grid w-full\",\r\n  variants: {\r\n    columns: {\r\n      2: \"grid-cols-1 sm:grid-cols-2\",\r\n      3: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-3\",\r\n      4: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-4\",\r\n      5: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-5\",\r\n      6: \"grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-6\",\r\n    },\r\n    divided: {\r\n      // 1 card único com divisórias (linha no mobile, coluna no sm+)\r\n      true: \"overflow-hidden rounded-radius-xl border border-border-subtle bg-bg-surface shadow-sh-sm divide-y divide-border-subtle sm:divide-y-0 sm:divide-x\",\r\n      false: \"gap-gp-2xl\",\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    columns: 4,\r\n    divided: false,\r\n  },\r\n});\r\n","\"use client\";\r\n\r\nimport { createContext } from \"react\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { kpiGroup } from \"./kpi.styles\";\r\nimport type { KpiGroupProps } from \"./kpi.types\";\r\n\r\n/** Superfície herdada pelos `Kpi` filhos (card normal vs plain dentro de divided). */\r\nexport const KpiSurfaceContext = createContext<\"card\" | \"plain\">(\"card\");\r\n\r\n/**\r\n * KpiGroup — layout de composição pros `Kpi`. `columns` (responsivo) e\r\n * `divided` (vira 1 card único com divisórias entre os KPIs).\r\n */\r\nexport function KpiGroup({\r\n  columns = 4,\r\n  divided = false,\r\n  children,\r\n  className,\r\n}: KpiGroupProps) {\r\n  return (\r\n    <KpiSurfaceContext.Provider value={divided ? \"plain\" : \"card\"}>\r\n      <div className={cn(kpiGroup({ columns, divided }), className)}>\r\n        {children}\r\n      </div>\r\n    </KpiSurfaceContext.Provider>\r\n  );\r\n}\r\n\r\nKpiGroup.displayName = \"KpiGroup\";\r\n","\"use client\";\r\n\r\nimport { useContext } from \"react\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { kpi } from \"./kpi.styles\";\r\nimport { KpiSurfaceContext } from \"./kpi-group\";\r\nimport type { KpiProps } from \"./kpi.types\";\r\n\r\n/**\r\n * Kpi — card de KPI composável: header (label + ícone por tone), valor +\r\n * delta, hint, slot livre (sparkline/chart) e footnote. Use dentro de\r\n * `KpiGroup` pra rows/grids; dentro de `KpiGroup divided` ele vira \"plain\".\r\n */\r\nexport function Kpi({\r\n  label,\r\n  value,\r\n  delta,\r\n  hint,\r\n  icon,\r\n  tone = \"neutral\",\r\n  size = \"md\",\r\n  footnote,\r\n  children,\r\n  surface,\r\n  className,\r\n}: KpiProps) {\r\n  const inherited = useContext(KpiSurfaceContext);\r\n  const s = kpi({ size, surface: surface ?? inherited, tone });\r\n\r\n  return (\r\n    <article className={cn(s.root(), className)}>\r\n      <header className={s.header()}>\r\n        <h3 className={s.label()}>{label}</h3>\r\n        {icon && (\r\n          <span className={s.iconBox()} aria-hidden>\r\n            {icon}\r\n          </span>\r\n        )}\r\n      </header>\r\n      <div className={s.main()}>\r\n        <div className={s.valueRow()}>\r\n          <span className={s.value()}>{value}</span>\r\n          {delta}\r\n        </div>\r\n        {hint && <span className={s.hint()}>{hint}</span>}\r\n      </div>\r\n      {children && <div className={s.chart()}>{children}</div>}\r\n      {footnote && <div className={s.footnote()}>{footnote}</div>}\r\n    </article>\r\n  );\r\n}\r\n\r\nKpi.displayName = \"Kpi\";\r\n","\"use client\";\r\n\r\nimport { TrendingUp } from \"lucide-react\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { Chip } from \"@/components/ui/Chip\";\r\nimport type { KpiDeltaProps } from \"./kpi.types\";\r\n\r\n/**\r\n * KpiDelta — pílula de variação (sobre o Chip). Tom semântico explícito\r\n * (success/danger/neutral) + seta opcional. O tom é decisão do consumidor —\r\n * \"subir\" nem sempre é positivo (ex.: tempo de espera).\r\n *\r\n * `signed` deriva tom+seta do sinal do `value` (\"-\" → danger/down; senão\r\n * success/up). `tone`/`direction` explícitos sempre vencem.\r\n */\r\nexport function KpiDelta({\r\n  value,\r\n  tone,\r\n  direction,\r\n  signed = false,\r\n  className,\r\n}: KpiDeltaProps) {\r\n  const isNegative =\r\n    signed && typeof value === \"string\" && value.trim().startsWith(\"-\");\r\n  const resolvedTone = tone ?? (signed ? (isNegative ? \"danger\" : \"success\") : \"success\");\r\n  const resolvedDirection = direction ?? (signed ? (isNegative ? \"down\" : \"up\") : undefined);\r\n\r\n  return (\r\n    <Chip\r\n      color={resolvedTone}\r\n      variant=\"soft\"\r\n      size=\"sm\"\r\n      shape=\"pill\"\r\n      className={className}\r\n    >\r\n      {resolvedDirection && (\r\n        <TrendingUp\r\n          className={cn(\"size-[12px]\", resolvedDirection === \"down\" && \"rotate-180\")}\r\n          aria-hidden\r\n        />\r\n      )}\r\n      {value}\r\n    </Chip>\r\n  );\r\n}\r\n\r\nKpiDelta.displayName = \"KpiDelta\";\r\n"],"names":["tv","createContext","jsx","cn","useContext","jsxs","Chip","TrendingUp"],"mappings":"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"}
+{"version":3,"file":"kpi-delta-DyJRQjWb.cjs","sources":["../../src/components/ui/Kpi/kpi.styles.ts","../../src/components/ui/Kpi/kpi-group.tsx","../../src/components/ui/Kpi/kpi.tsx","../../src/components/ui/Kpi/kpi-delta.tsx"],"sourcesContent":["import { tv } from \"@/utils/tv\";\r\n\r\n/* ══════════════════════════════════════════════════════════════════════════\r\n   Kpi — estilos (tv). 100% sobre tokens do DS, theme-aware.\r\n   ══════════════════════════════════════════════════════════════════════════ */\r\n\r\nexport const kpi = tv({\r\n  slots: {\r\n    root: \"flex flex-col gap-gp-lg\",\r\n    header: \"flex items-start justify-between gap-gp-md\",\r\n    label: \"m-0 text-body-md font-semibold text-fg-default\",\r\n    iconBox:\r\n      \"grid size-form-lg shrink-0 place-items-center rounded-radius-lg [&>svg]:size-icon-md\",\r\n    main: \"flex flex-col gap-gp-xs\",\r\n    valueRow: \"flex flex-wrap items-center gap-gp-md\",\r\n    value:\r\n      \"leading-none text-fg-default [font-variant-numeric:tabular-nums]\",\r\n    hint: \"text-caption-sm text-fg-subtle\",\r\n    chart: \"mt-gp-xs\",\r\n    footnote:\r\n      \"mt-pad-md border-t border-border-subtle pt-pad-lg text-caption-md text-fg-muted\",\r\n  },\r\n  variants: {\r\n    // Tamanho do valor de destaque — presets `stat-*` (número de métrica).\r\n    // Default `md` (24px) = idêntico ao antigo `body-2xl`. Weight/leading tight\r\n    // vêm do preset + slot; pareado com tabular-nums.\r\n    size: {\r\n      sm: { value: \"text-stat-sm\" },\r\n      md: { value: \"text-stat-md\" },\r\n      lg: { value: \"text-stat-lg\" },\r\n      xl: { value: \"text-stat-xl\" },\r\n    },\r\n    surface: {\r\n      card: {\r\n        root: \"rounded-radius-xl border border-border-subtle bg-bg-surface p-pad-3xl shadow-sh-sm\",\r\n      },\r\n      plain: { root: \"p-pad-3xl\" },\r\n    },\r\n    tone: {\r\n      brand: { iconBox: \"bg-bg-brand-subtle text-fg-brand\" },\r\n      success: { iconBox: \"bg-bg-success-muted text-fg-success\" },\r\n      warning: { iconBox: \"bg-bg-warning-muted text-fg-warning\" },\r\n      info: { iconBox: \"bg-bg-info-muted text-fg-info\" },\r\n      danger: { iconBox: \"bg-bg-danger-muted text-fg-danger\" },\r\n      neutral: { iconBox: \"bg-bg-muted text-fg-muted\" },\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    size: \"md\",\r\n    surface: \"card\",\r\n    tone: \"neutral\",\r\n  },\r\n});\r\n\r\nexport const kpiGroup = tv({\r\n  base: \"grid w-full\",\r\n  variants: {\r\n    columns: {\r\n      2: \"grid-cols-1 sm:grid-cols-2\",\r\n      3: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-3\",\r\n      4: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-4\",\r\n      5: \"grid-cols-1 sm:grid-cols-2 lg:grid-cols-5\",\r\n      6: \"grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-6\",\r\n    },\r\n    divided: {\r\n      // 1 card único com divisórias (linha no mobile, coluna no sm+)\r\n      true: \"overflow-hidden rounded-radius-xl border border-border-subtle bg-bg-surface shadow-sh-sm divide-y divide-border-subtle sm:divide-y-0 sm:divide-x\",\r\n      false: \"gap-gp-2xl\",\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    columns: 4,\r\n    divided: false,\r\n  },\r\n});\r\n","\"use client\";\r\n\r\nimport { createContext } from \"react\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { kpiGroup } from \"./kpi.styles\";\r\nimport type { KpiGroupProps } from \"./kpi.types\";\r\n\r\n/** Superfície herdada pelos `Kpi` filhos (card normal vs plain dentro de divided). */\r\nexport const KpiSurfaceContext = createContext<\"card\" | \"plain\">(\"card\");\r\n\r\n/**\r\n * KpiGroup — layout de composição pros `Kpi`. `columns` (responsivo) e\r\n * `divided` (vira 1 card único com divisórias entre os KPIs).\r\n */\r\nexport function KpiGroup({\r\n  columns = 4,\r\n  divided = false,\r\n  children,\r\n  className,\r\n}: KpiGroupProps) {\r\n  return (\r\n    <KpiSurfaceContext.Provider value={divided ? \"plain\" : \"card\"}>\r\n      <div className={cn(kpiGroup({ columns, divided }), className)}>\r\n        {children}\r\n      </div>\r\n    </KpiSurfaceContext.Provider>\r\n  );\r\n}\r\n\r\nKpiGroup.displayName = \"KpiGroup\";\r\n","\"use client\";\r\n\r\nimport { useContext } from \"react\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { kpi } from \"./kpi.styles\";\r\nimport { KpiSurfaceContext } from \"./kpi-group\";\r\nimport type { KpiProps } from \"./kpi.types\";\r\n\r\n/**\r\n * Kpi — card de KPI composável: header (label + ícone por tone), valor +\r\n * delta, hint, slot livre (sparkline/chart) e footnote. Use dentro de\r\n * `KpiGroup` pra rows/grids; dentro de `KpiGroup divided` ele vira \"plain\".\r\n */\r\nexport function Kpi({\r\n  label,\r\n  value,\r\n  delta,\r\n  hint,\r\n  icon,\r\n  tone = \"neutral\",\r\n  size = \"md\",\r\n  footnote,\r\n  children,\r\n  surface,\r\n  className,\r\n}: KpiProps) {\r\n  const inherited = useContext(KpiSurfaceContext);\r\n  const s = kpi({ size, surface: surface ?? inherited, tone });\r\n\r\n  return (\r\n    <article className={cn(s.root(), className)}>\r\n      <header className={s.header()}>\r\n        <h3 className={s.label()}>{label}</h3>\r\n        {icon && (\r\n          <span className={s.iconBox()} aria-hidden>\r\n            {icon}\r\n          </span>\r\n        )}\r\n      </header>\r\n      <div className={s.main()}>\r\n        <div className={s.valueRow()}>\r\n          <span className={s.value()}>{value}</span>\r\n          {delta}\r\n        </div>\r\n        {hint && <span className={s.hint()}>{hint}</span>}\r\n      </div>\r\n      {children && <div className={s.chart()}>{children}</div>}\r\n      {footnote && <div className={s.footnote()}>{footnote}</div>}\r\n    </article>\r\n  );\r\n}\r\n\r\nKpi.displayName = \"Kpi\";\r\n","\"use client\";\r\n\r\nimport { TrendingUp } from \"lucide-react\";\r\nimport { cn } from \"@/lib/utils\";\r\nimport { Chip } from \"@/components/ui/Chip\";\r\nimport type { KpiDeltaProps } from \"./kpi.types\";\r\n\r\n/**\r\n * KpiDelta — pílula de variação (sobre o Chip). Tom semântico explícito\r\n * (success/danger/neutral) + seta opcional. O tom é decisão do consumidor —\r\n * \"subir\" nem sempre é positivo (ex.: tempo de espera).\r\n *\r\n * `signed` deriva tom+seta do sinal do `value` (\"-\" → danger/down; senão\r\n * success/up). `tone`/`direction` explícitos sempre vencem.\r\n */\r\nexport function KpiDelta({\r\n  value,\r\n  tone,\r\n  direction,\r\n  signed = false,\r\n  className,\r\n}: KpiDeltaProps) {\r\n  const isNegative =\r\n    signed && typeof value === \"string\" && value.trim().startsWith(\"-\");\r\n  const resolvedTone = tone ?? (signed ? (isNegative ? \"danger\" : \"success\") : \"success\");\r\n  const resolvedDirection = direction ?? (signed ? (isNegative ? \"down\" : \"up\") : undefined);\r\n\r\n  return (\r\n    <Chip\r\n      color={resolvedTone}\r\n      variant=\"soft\"\r\n      size=\"sm\"\r\n      shape=\"pill\"\r\n      className={className}\r\n    >\r\n      {resolvedDirection && (\r\n        <TrendingUp\r\n          className={cn(\"size-[12px]\", resolvedDirection === \"down\" && \"rotate-180\")}\r\n          aria-hidden\r\n        />\r\n      )}\r\n      {value}\r\n    </Chip>\r\n  );\r\n}\r\n\r\nKpiDelta.displayName = \"KpiDelta\";\r\n"],"names":["tv","createContext","jsx","cn","useContext","jsxs","Chip","TrendingUp"],"mappings":"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"}

package/dist-lib/chunks/{panel-C3puLY_V.mjs → panel-B-liPlxr.mjs}

@@ -9,7 +9,7 @@ import { useSortable, sortableKeyboardCoordinates, SortableContext, horizontalLi
 import { useVirtualizer } from "@tanstack/react-virtual";
 import { af as tv, ae as Button, c as cn, W as InputGroup, Z as InputGroupInput, X as InputGroupAddon, _ as InputGroupText, a0 as Popover, a4 as PopoverTrigger, a3 as PopoverContent, l as Command, p as CommandInput, r as CommandList, n as CommandEmpty, o as CommandGroup, q as CommandItem, H as DropdownMenu, V as DropdownMenuTrigger, J as DropdownMenuContent, M as DropdownMenuLabel, Q as DropdownMenuSeparator, L as DropdownMenuItem, D as Dialog, v as DialogContent, u as DialogClose, F as DialogTitle, w as DialogDescription, a1 as PopoverAnchor } from "./avatar-CZRLkTxt.mjs";
 import { X, CheckCircle2, AlertCircle, AlertTriangle, Info, ChevronDown, Check, ArrowUp, ArrowDown, ArrowUpDown, Search, CircleX, MoreHorizontal, Filter, ChevronLeft, GripVertical, Pin, PinOff, Plus, Trash2, Eye, Users, ChevronRight, Columns, SlidersHorizontal, Minimize2, Maximize2, Type, Hash, Calendar, ToggleLeft, DollarSign, Percent, AtSign, Phone, Link, ExternalLink, User, Tag, Tags, CalendarClock, Inbox, SearchX, FilterX, PinIcon, EyeOff, Loader2, Copy, Rows3, LayoutGrid, Settings2, RefreshCw, Table as Table$1, FileText, List as List$1, Rows4, Rows2 } from "lucide-react";
-import { C as Chip, z as useMediaQuery } from "./useTheme-caPM-I73.mjs";
+import { C as Chip, z as useMediaQuery } from "./useTheme-BwxTDdqf.mjs";
 import { I as Input } from "./input-BQABJR2N.mjs";
 import { createPortal } from "react-dom";
 import { Draggable, Droppable, DragDropContext } from "@hello-pangea/dnd";
@@ -13167,4 +13167,4 @@ export {
   DEFAULT_FILTER_OPERATORS as y,
   DataTableActionsCell as z
 };
-//# sourceMappingURL=panel-C3puLY_V.mjs.map
+//# sourceMappingURL=panel-B-liPlxr.mjs.map