@plenustech/design-system 0.2.1 → 0.2.2

package/dist/components/charts/ChartTooltip/ChartTooltip.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltip.cjs","sources":["../../../../src/components/charts/ChartTooltip/ChartTooltip.tsx"],"sourcesContent":["import {\n  Fragment,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n  useState,\n  type PointerEvent,\n  type ReactNode,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { formatarNumero, formatarPercentual } from '../../../utils/formatters';\nimport styles from './ChartTooltip.module.css';\n\nexport interface ChartTooltipRow {\n  color?: string;\n  /** Realca a linha, como a serie sob o ponteiro entre as demais. */\n  emphasis?: boolean;\n  label: string;\n  values: readonly number[];\n}\n\n/** Como a linha de total resume uma coluna. A soma raramente serve a todas. */\nexport type ChartTooltipTotal = 'sum' | 'average' | 'none' | ((values: readonly number[]) => number);\n\nexport interface ChartTooltipColumn {\n  format?: (value: number) => string;\n  total?: ChartTooltipTotal;\n}\n\nexport interface ChartTooltipComputed {\n  /** Coluna que serve de base. A ultima por padrao, que e a de valor. */\n  column?: number;\n  /** Valor da linha, a partir do valor dela e do total da coluna base. */\n  compute?: (value: number, total: number) => number;\n  format?: (value: number) => string;\n}\n\nexport interface ChartTooltipProps {\n  children: ReactNode;\n  columns?: readonly ChartTooltipColumn[];\n  /** Coluna ao fim. Percentual sobre a base por padrao; `none` a dispensa. */\n  computed?: ChartTooltipComputed | 'none';\n  rows: readonly ChartTooltipRow[];\n  showTotal?: boolean;\n  subtitle?: string;\n  title?: string;\n  totalLabel?: string;\n}\n\ninterface Ponto {\n  x: number;\n  y: number;\n}\n\n/** Distancia entre o ponteiro e o balao, para o cursor nao cobrir o texto. */\nconst AFASTAMENTO = 16;\n\n/** Folga minima ate a borda da janela. */\nconst MARGEM = 8;\n\nfunction somar(valores: readonly number[]) {\n  return valores.reduce((total, valor) => total + valor, 0);\n}\n\nfunction totalizar(operador: ChartTooltipTotal, valores: readonly number[]) {\n  if (typeof operador === 'function') {\n    return operador(valores);\n  }\n\n  if (operador === 'average') {\n    return valores.length === 0 ? 0 : somar(valores) / valores.length;\n  }\n\n  return somar(valores);\n}\n\n/**\n * Canto do balao a partir do ponteiro. Ele abre para baixo e para a direita\n * enquanto couber, e vira para o lado oposto ao encostar na borda.\n */\nfunction encaixar({ x, y }: Ponto, largura: number, altura: number): Ponto {\n  const cabeADireita = x + AFASTAMENTO + largura <= window.innerWidth - MARGEM;\n  const cabeAbaixo = y + AFASTAMENTO + altura <= window.innerHeight - MARGEM;\n\n  return {\n    x: cabeADireita ? x + AFASTAMENTO : Math.max(x - AFASTAMENTO - largura, MARGEM),\n    y: cabeAbaixo ? y + AFASTAMENTO : Math.max(y - AFASTAMENTO - altura, MARGEM),\n  };\n}\n\n/**\n * Leitura das medidas sob o ponteiro, em portal sobre a pagina. Ele acompanha o\n * cursor enquanto este percorre a area e sai a qualquer outra interacao.\n *\n * Nao conhece grafico algum: recebe linhas e colunas, e quem as monta e quem o\n * usa. E decorativo para leitor de tela: o desenho e `role=\"img\"`, apresentado\n * como imagem unica, e a leitura medida a medida cabe a visao em tabela.\n */\nexport function ChartTooltip({\n  children,\n  columns,\n  computed,\n  rows,\n  showTotal = false,\n  subtitle,\n  title,\n  totalLabel = 'Total',\n}: ChartTooltipProps) {\n  const [ponteiro, setPonteiro] = useState<Ponto | null>(null);\n  const visivel = ponteiro !== null && rows.length > 0;\n\n  // Sai por qualquer motivo que nao seja o ponteiro andando pela area: rolagem,\n  // tecla ou a janela mudando de tamanho deixam o balao preso a um lugar que o\n  // desenho ja nao ocupa.\n  useEffect(() => {\n    if (!visivel) {\n      return;\n    }\n\n    const esconder = () => setPonteiro(null);\n\n    window.addEventListener('scroll', esconder, true);\n    window.addEventListener('resize', esconder);\n    window.addEventListener('keydown', esconder);\n\n    return () => {\n      window.removeEventListener('scroll', esconder, true);\n      window.removeEventListener('resize', esconder);\n      window.removeEventListener('keydown', esconder);\n    };\n  }, [visivel]);\n\n  const acompanhar = (evento: PointerEvent<HTMLDivElement>) =>\n    setPonteiro({ x: evento.clientX, y: evento.clientY });\n\n  return (\n    <div\n      className={styles.area}\n      onPointerLeave={() => setPonteiro(null)}\n      onPointerMove={acompanhar}\n    >\n      {children}\n\n      {visivel &&\n        createPortal(\n          <Balao\n            columns={columns}\n            computed={computed}\n            ponteiro={ponteiro}\n            rows={rows}\n            showTotal={showTotal}\n            subtitle={subtitle}\n            title={title}\n            totalLabel={totalLabel}\n          />,\n          document.body,\n        )}\n    </div>\n  );\n}\n\ntype BalaoProps = Omit<ChartTooltipProps, 'children'> & { ponteiro: Ponto };\n\nfunction Balao({\n  columns,\n  computed,\n  ponteiro,\n  rows,\n  showTotal,\n  subtitle,\n  title,\n  totalLabel,\n}: BalaoProps) {\n  const ref = useRef<HTMLDivElement>(null);\n  const [medida, setMedida] = useState({ altura: 0, largura: 0 });\n\n  // A medida entra antes da pintura, entao o balao ja nasce no lugar certo.\n  useLayoutEffect(() => {\n    const no = ref.current;\n\n    if (!no) {\n      return;\n    }\n\n    const { height, width } = no.getBoundingClientRect();\n\n    if (height !== medida.altura || width !== medida.largura) {\n      setMedida({ altura: height, largura: width });\n    }\n  });\n\n  const quantidadeDeColunas = rows.reduce((maior, linha) => Math.max(maior, linha.values.length), 0);\n  const colunas: readonly ChartTooltipColumn[] =\n    columns ?? Array.from({ length: quantidadeDeColunas }, () => ({}));\n\n  // Sem coluna de onde derivar, nao ha o que calcular: linhas so com rotulo\n  // renderizariam um percentual tirado do nada.\n  const calculada = computed === 'none' || colunas.length === 0 ? undefined : computed ?? {};\n  const colunaBase = calculada?.column ?? colunas.length - 1;\n  const baseDoTotal = somar(rows.map((linha) => linha.values[colunaBase] ?? 0));\n  const calcular = calculada?.compute ?? ((valor: number, total: number) => (total === 0 ? 0 : valor / total));\n  const formatarCalculada = calculada?.format ?? ((valor: number) => formatarPercentual(valor, { casasDecimais: 2 }));\n\n  const { x, y } = encaixar(ponteiro, medida.largura, medida.altura);\n  const celulas = `1fr ${'auto '.repeat(colunas.length + (calculada ? 1 : 0))}`.trim();\n\n  return (\n    <div aria-hidden=\"true\" className={styles.tooltip} ref={ref} style={{ left: x, top: y }}>\n      {title !== undefined && <p className={styles.title}>{title}</p>}\n      {subtitle !== undefined && <p className={styles.subtitle}>{subtitle}</p>}\n\n      <div className={styles.grid} style={{ gridTemplateColumns: celulas }}>\n        {rows.map((linha, indiceDaLinha) => (\n          <Fragment key={indiceDaLinha}>\n            <span className={`${styles.label} ${linha.emphasis ? styles.emphasis : ''}`}>\n              {linha.color !== undefined && (\n                <span className={styles.swatch} style={{ background: linha.color }} />\n              )}\n              {linha.label}\n            </span>\n\n            {colunas.map((coluna, indice) => (\n              <span className={`${styles.value} ${linha.emphasis ? styles.emphasis : ''}`} key={indice}>\n                {(coluna.format ?? formatarNumero)(linha.values[indice] ?? 0)}\n              </span>\n            ))}\n\n            {calculada && (\n              <span className={`${styles.computed} ${linha.emphasis ? styles.emphasis : ''}`}>\n                {formatarCalculada(calcular(linha.values[colunaBase] ?? 0, baseDoTotal))}\n              </span>\n            )}\n          </Fragment>\n        ))}\n\n        {showTotal && (\n          <>\n            <span className={styles.rule} />\n            <span className={`${styles.label} ${styles.totalLabel}`}>{totalLabel}</span>\n\n            {colunas.map((coluna, indice) => (\n              <span className={`${styles.value} ${styles.totalValue}`} key={indice}>\n                {coluna.total === 'none'\n                  ? ''\n                  : (coluna.format ?? formatarNumero)(\n                      totalizar(coluna.total ?? 'sum', rows.map((linha) => linha.values[indice] ?? 0)),\n                    )}\n              </span>\n            ))}\n\n            {calculada && (\n              <span className={`${styles.computed} ${styles.totalValue}`}>\n                {formatarCalculada(calcular(baseDoTotal, baseDoTotal))}\n              </span>\n            )}\n          </>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["AFASTAMENTO","MARGEM","somar","valores","total","valor","totalizar","operador","encaixar","x","y","largura","altura","cabeADireita","cabeAbaixo","ChartTooltip","children","columns","computed","rows","showTotal","subtitle","title","totalLabel","ponteiro","setPonteiro","useState","visivel","useEffect","esconder","acompanhar","evento","jsxs","styles","createPortal","jsx","Balao","ref","useRef","medida","setMedida","useLayoutEffect","no","height","width","quantidadeDeColunas","maior","linha","colunas","calculada","colunaBase","baseDoTotal","calcular","formatarCalculada","formatarPercentual","celulas","indiceDaLinha","Fragment","coluna","indice","formatarNumero"],"mappings":"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"}

package/dist/components/charts/ChartTooltip/ChartTooltip.js

@@ -0,0 +1,113 @@
+import { jsxs as f, jsx as i, Fragment as k } from "react/jsx-runtime";
+import { useState as C, useEffect as z, useRef as B, useLayoutEffect as R, Fragment as j } from "react";
+import { createPortal as S } from "react-dom";
+import t from "./ChartTooltip.module.css.js";
+import { formatarPercentual as V, formatarNumero as T } from "../../../utils/formatters/formatarNumero.js";
+const p = 16, N = 8;
+function E(r) {
+  return r.reduce((n, c) => n + c, 0);
+}
+function q(r, n) {
+  return typeof r == "function" ? r(n) : r === "average" ? n.length === 0 ? 0 : E(n) / n.length : E(n);
+}
+function G({ x: r, y: n }, c, l) {
+  const h = r + p + c <= window.innerWidth - N, u = n + p + l <= window.innerHeight - N;
+  return {
+    x: h ? r + p : Math.max(r - p - c, N),
+    y: u ? n + p : Math.max(n - p - l, N)
+  };
+}
+function J({
+  children: r,
+  columns: n,
+  computed: c,
+  rows: l,
+  showTotal: h = !1,
+  subtitle: u,
+  title: w,
+  totalLabel: $ = "Total"
+}) {
+  const [v, m] = C(null), g = v !== null && l.length > 0;
+  z(() => {
+    if (!g)
+      return;
+    const a = () => m(null);
+    return window.addEventListener("scroll", a, !0), window.addEventListener("resize", a), window.addEventListener("keydown", a), () => {
+      window.removeEventListener("scroll", a, !0), window.removeEventListener("resize", a), window.removeEventListener("keydown", a);
+    };
+  }, [g]);
+  const y = (a) => m({ x: a.clientX, y: a.clientY });
+  return /* @__PURE__ */ f(
+    "div",
+    {
+      className: t.area,
+      onPointerLeave: () => m(null),
+      onPointerMove: y,
+      children: [
+        r,
+        g && S(
+          /* @__PURE__ */ i(
+            H,
+            {
+              columns: n,
+              computed: c,
+              ponteiro: v,
+              rows: l,
+              showTotal: h,
+              subtitle: u,
+              title: w,
+              totalLabel: $
+            }
+          ),
+          document.body
+        )
+      ]
+    }
+  );
+}
+function H({
+  columns: r,
+  computed: n,
+  ponteiro: c,
+  rows: l,
+  showTotal: h,
+  subtitle: u,
+  title: w,
+  totalLabel: $
+}) {
+  const v = B(null), [m, g] = C({ altura: 0, largura: 0 });
+  R(() => {
+    const e = v.current;
+    if (!e)
+      return;
+    const { height: o, width: d } = e.getBoundingClientRect();
+    (o !== m.altura || d !== m.largura) && g({ altura: o, largura: d });
+  });
+  const y = l.reduce((e, o) => Math.max(e, o.values.length), 0), a = r ?? Array.from({ length: y }, () => ({})), s = n === "none" || a.length === 0 ? void 0 : n ?? {}, x = (s == null ? void 0 : s.column) ?? a.length - 1, b = E(l.map((e) => e.values[x] ?? 0)), L = (s == null ? void 0 : s.compute) ?? ((e, o) => o === 0 ? 0 : e / o), M = (s == null ? void 0 : s.format) ?? ((e) => V(e, { casasDecimais: 2 })), { x: P, y: D } = G(c, m.largura, m.altura), F = `1fr ${"auto ".repeat(a.length + (s ? 1 : 0))}`.trim();
+  return /* @__PURE__ */ f("div", { "aria-hidden": "true", className: t.tooltip, ref: v, style: { left: P, top: D }, children: [
+    w !== void 0 && /* @__PURE__ */ i("p", { className: t.title, children: w }),
+    u !== void 0 && /* @__PURE__ */ i("p", { className: t.subtitle, children: u }),
+    /* @__PURE__ */ f("div", { className: t.grid, style: { gridTemplateColumns: F }, children: [
+      l.map((e, o) => /* @__PURE__ */ f(j, { children: [
+        /* @__PURE__ */ f("span", { className: `${t.label} ${e.emphasis ? t.emphasis : ""}`, children: [
+          e.color !== void 0 && /* @__PURE__ */ i("span", { className: t.swatch, style: { background: e.color } }),
+          e.label
+        ] }),
+        a.map((d, A) => /* @__PURE__ */ i("span", { className: `${t.value} ${e.emphasis ? t.emphasis : ""}`, children: (d.format ?? T)(e.values[A] ?? 0) }, A)),
+        s && /* @__PURE__ */ i("span", { className: `${t.computed} ${e.emphasis ? t.emphasis : ""}`, children: M(L(e.values[x] ?? 0, b)) })
+      ] }, o)),
+      h && /* @__PURE__ */ f(k, { children: [
+        /* @__PURE__ */ i("span", { className: t.rule }),
+        /* @__PURE__ */ i("span", { className: `${t.label} ${t.totalLabel}`, children: $ }),
+        a.map((e, o) => /* @__PURE__ */ i("span", { className: `${t.value} ${t.totalValue}`, children: e.total === "none" ? "" : (e.format ?? T)(
+          q(e.total ?? "sum", l.map((d) => d.values[o] ?? 0))
+        ) }, o)),
+        s && /* @__PURE__ */ i("span", { className: `${t.computed} ${t.totalValue}`, children: M(L(b, b)) })
+      ] })
+    ] })
+  ] });
+}
+export {
+  J as ChartTooltip
+};
+//# sourceMappingURL=ChartTooltip.js.map

package/dist/components/charts/ChartTooltip/ChartTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltip.js","sources":["../../../../src/components/charts/ChartTooltip/ChartTooltip.tsx"],"sourcesContent":["import {\n  Fragment,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n  useState,\n  type PointerEvent,\n  type ReactNode,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { formatarNumero, formatarPercentual } from '../../../utils/formatters';\nimport styles from './ChartTooltip.module.css';\n\nexport interface ChartTooltipRow {\n  color?: string;\n  /** Realca a linha, como a serie sob o ponteiro entre as demais. */\n  emphasis?: boolean;\n  label: string;\n  values: readonly number[];\n}\n\n/** Como a linha de total resume uma coluna. A soma raramente serve a todas. */\nexport type ChartTooltipTotal = 'sum' | 'average' | 'none' | ((values: readonly number[]) => number);\n\nexport interface ChartTooltipColumn {\n  format?: (value: number) => string;\n  total?: ChartTooltipTotal;\n}\n\nexport interface ChartTooltipComputed {\n  /** Coluna que serve de base. A ultima por padrao, que e a de valor. */\n  column?: number;\n  /** Valor da linha, a partir do valor dela e do total da coluna base. */\n  compute?: (value: number, total: number) => number;\n  format?: (value: number) => string;\n}\n\nexport interface ChartTooltipProps {\n  children: ReactNode;\n  columns?: readonly ChartTooltipColumn[];\n  /** Coluna ao fim. Percentual sobre a base por padrao; `none` a dispensa. */\n  computed?: ChartTooltipComputed | 'none';\n  rows: readonly ChartTooltipRow[];\n  showTotal?: boolean;\n  subtitle?: string;\n  title?: string;\n  totalLabel?: string;\n}\n\ninterface Ponto {\n  x: number;\n  y: number;\n}\n\n/** Distancia entre o ponteiro e o balao, para o cursor nao cobrir o texto. */\nconst AFASTAMENTO = 16;\n\n/** Folga minima ate a borda da janela. */\nconst MARGEM = 8;\n\nfunction somar(valores: readonly number[]) {\n  return valores.reduce((total, valor) => total + valor, 0);\n}\n\nfunction totalizar(operador: ChartTooltipTotal, valores: readonly number[]) {\n  if (typeof operador === 'function') {\n    return operador(valores);\n  }\n\n  if (operador === 'average') {\n    return valores.length === 0 ? 0 : somar(valores) / valores.length;\n  }\n\n  return somar(valores);\n}\n\n/**\n * Canto do balao a partir do ponteiro. Ele abre para baixo e para a direita\n * enquanto couber, e vira para o lado oposto ao encostar na borda.\n */\nfunction encaixar({ x, y }: Ponto, largura: number, altura: number): Ponto {\n  const cabeADireita = x + AFASTAMENTO + largura <= window.innerWidth - MARGEM;\n  const cabeAbaixo = y + AFASTAMENTO + altura <= window.innerHeight - MARGEM;\n\n  return {\n    x: cabeADireita ? x + AFASTAMENTO : Math.max(x - AFASTAMENTO - largura, MARGEM),\n    y: cabeAbaixo ? y + AFASTAMENTO : Math.max(y - AFASTAMENTO - altura, MARGEM),\n  };\n}\n\n/**\n * Leitura das medidas sob o ponteiro, em portal sobre a pagina. Ele acompanha o\n * cursor enquanto este percorre a area e sai a qualquer outra interacao.\n *\n * Nao conhece grafico algum: recebe linhas e colunas, e quem as monta e quem o\n * usa. E decorativo para leitor de tela: o desenho e `role=\"img\"`, apresentado\n * como imagem unica, e a leitura medida a medida cabe a visao em tabela.\n */\nexport function ChartTooltip({\n  children,\n  columns,\n  computed,\n  rows,\n  showTotal = false,\n  subtitle,\n  title,\n  totalLabel = 'Total',\n}: ChartTooltipProps) {\n  const [ponteiro, setPonteiro] = useState<Ponto | null>(null);\n  const visivel = ponteiro !== null && rows.length > 0;\n\n  // Sai por qualquer motivo que nao seja o ponteiro andando pela area: rolagem,\n  // tecla ou a janela mudando de tamanho deixam o balao preso a um lugar que o\n  // desenho ja nao ocupa.\n  useEffect(() => {\n    if (!visivel) {\n      return;\n    }\n\n    const esconder = () => setPonteiro(null);\n\n    window.addEventListener('scroll', esconder, true);\n    window.addEventListener('resize', esconder);\n    window.addEventListener('keydown', esconder);\n\n    return () => {\n      window.removeEventListener('scroll', esconder, true);\n      window.removeEventListener('resize', esconder);\n      window.removeEventListener('keydown', esconder);\n    };\n  }, [visivel]);\n\n  const acompanhar = (evento: PointerEvent<HTMLDivElement>) =>\n    setPonteiro({ x: evento.clientX, y: evento.clientY });\n\n  return (\n    <div\n      className={styles.area}\n      onPointerLeave={() => setPonteiro(null)}\n      onPointerMove={acompanhar}\n    >\n      {children}\n\n      {visivel &&\n        createPortal(\n          <Balao\n            columns={columns}\n            computed={computed}\n            ponteiro={ponteiro}\n            rows={rows}\n            showTotal={showTotal}\n            subtitle={subtitle}\n            title={title}\n            totalLabel={totalLabel}\n          />,\n          document.body,\n        )}\n    </div>\n  );\n}\n\ntype BalaoProps = Omit<ChartTooltipProps, 'children'> & { ponteiro: Ponto };\n\nfunction Balao({\n  columns,\n  computed,\n  ponteiro,\n  rows,\n  showTotal,\n  subtitle,\n  title,\n  totalLabel,\n}: BalaoProps) {\n  const ref = useRef<HTMLDivElement>(null);\n  const [medida, setMedida] = useState({ altura: 0, largura: 0 });\n\n  // A medida entra antes da pintura, entao o balao ja nasce no lugar certo.\n  useLayoutEffect(() => {\n    const no = ref.current;\n\n    if (!no) {\n      return;\n    }\n\n    const { height, width } = no.getBoundingClientRect();\n\n    if (height !== medida.altura || width !== medida.largura) {\n      setMedida({ altura: height, largura: width });\n    }\n  });\n\n  const quantidadeDeColunas = rows.reduce((maior, linha) => Math.max(maior, linha.values.length), 0);\n  const colunas: readonly ChartTooltipColumn[] =\n    columns ?? Array.from({ length: quantidadeDeColunas }, () => ({}));\n\n  // Sem coluna de onde derivar, nao ha o que calcular: linhas so com rotulo\n  // renderizariam um percentual tirado do nada.\n  const calculada = computed === 'none' || colunas.length === 0 ? undefined : computed ?? {};\n  const colunaBase = calculada?.column ?? colunas.length - 1;\n  const baseDoTotal = somar(rows.map((linha) => linha.values[colunaBase] ?? 0));\n  const calcular = calculada?.compute ?? ((valor: number, total: number) => (total === 0 ? 0 : valor / total));\n  const formatarCalculada = calculada?.format ?? ((valor: number) => formatarPercentual(valor, { casasDecimais: 2 }));\n\n  const { x, y } = encaixar(ponteiro, medida.largura, medida.altura);\n  const celulas = `1fr ${'auto '.repeat(colunas.length + (calculada ? 1 : 0))}`.trim();\n\n  return (\n    <div aria-hidden=\"true\" className={styles.tooltip} ref={ref} style={{ left: x, top: y }}>\n      {title !== undefined && <p className={styles.title}>{title}</p>}\n      {subtitle !== undefined && <p className={styles.subtitle}>{subtitle}</p>}\n\n      <div className={styles.grid} style={{ gridTemplateColumns: celulas }}>\n        {rows.map((linha, indiceDaLinha) => (\n          <Fragment key={indiceDaLinha}>\n            <span className={`${styles.label} ${linha.emphasis ? styles.emphasis : ''}`}>\n              {linha.color !== undefined && (\n                <span className={styles.swatch} style={{ background: linha.color }} />\n              )}\n              {linha.label}\n            </span>\n\n            {colunas.map((coluna, indice) => (\n              <span className={`${styles.value} ${linha.emphasis ? styles.emphasis : ''}`} key={indice}>\n                {(coluna.format ?? formatarNumero)(linha.values[indice] ?? 0)}\n              </span>\n            ))}\n\n            {calculada && (\n              <span className={`${styles.computed} ${linha.emphasis ? styles.emphasis : ''}`}>\n                {formatarCalculada(calcular(linha.values[colunaBase] ?? 0, baseDoTotal))}\n              </span>\n            )}\n          </Fragment>\n        ))}\n\n        {showTotal && (\n          <>\n            <span className={styles.rule} />\n            <span className={`${styles.label} ${styles.totalLabel}`}>{totalLabel}</span>\n\n            {colunas.map((coluna, indice) => (\n              <span className={`${styles.value} ${styles.totalValue}`} key={indice}>\n                {coluna.total === 'none'\n                  ? ''\n                  : (coluna.format ?? formatarNumero)(\n                      totalizar(coluna.total ?? 'sum', rows.map((linha) => linha.values[indice] ?? 0)),\n                    )}\n              </span>\n            ))}\n\n            {calculada && (\n              <span className={`${styles.computed} ${styles.totalValue}`}>\n                {formatarCalculada(calcular(baseDoTotal, baseDoTotal))}\n              </span>\n            )}\n          </>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"names":["AFASTAMENTO","MARGEM","somar","valores","total","valor","totalizar","operador","encaixar","x","y","largura","altura","cabeADireita","cabeAbaixo","ChartTooltip","children","columns","computed","rows","showTotal","subtitle","title","totalLabel","ponteiro","setPonteiro","useState","visivel","useEffect","esconder","acompanhar","evento","jsxs","styles","createPortal","jsx","Balao","ref","useRef","medida","setMedida","useLayoutEffect","no","height","width","quantidadeDeColunas","maior","linha","colunas","calculada","colunaBase","baseDoTotal","calcular","formatarCalculada","formatarPercentual","celulas","indiceDaLinha","Fragment","coluna","indice","formatarNumero"],"mappings":"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"}

package/dist/components/charts/ChartTooltip/ChartTooltip.module.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t="_area_8ibkx_3",e="_tooltip_8ibkx_8",l="_title_8ibkx_20",a="_subtitle_8ibkx_29",_="_grid_8ibkx_38",o="_label_8ibkx_45",i="_swatch_8ibkx_59",s="_value_8ibkx_68",b="_computed_8ibkx_80 _value_8ibkx_68",u="_emphasis_8ibkx_87",c="_rule_8ibkx_96",r="_totalLabel_8ibkx_102",n="_totalValue_8ibkx_107",k={area:t,tooltip:e,title:l,subtitle:a,grid:_,label:o,swatch:i,value:s,computed:b,emphasis:u,rule:c,totalLabel:r,totalValue:n};exports.area=t;exports.computed=b;exports.default=k;exports.emphasis=u;exports.grid=_;exports.label=o;exports.rule=c;exports.subtitle=a;exports.swatch=i;exports.title=l;exports.tooltip=e;exports.totalLabel=r;exports.totalValue=n;exports.value=s;
+//# sourceMappingURL=ChartTooltip.module.css.cjs.map

package/dist/components/charts/ChartTooltip/ChartTooltip.module.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltip.module.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/charts/ChartTooltip/ChartTooltip.module.css.js

@@ -0,0 +1,32 @@
+const t = "_area_8ibkx_3", _ = "_tooltip_8ibkx_8", l = "_title_8ibkx_20", e = "_subtitle_8ibkx_29", a = "_grid_8ibkx_38", o = "_label_8ibkx_45", i = "_swatch_8ibkx_59", s = "_value_8ibkx_68", b = "_computed_8ibkx_80 _value_8ibkx_68", c = "_emphasis_8ibkx_87", u = "_rule_8ibkx_96", x = "_totalLabel_8ibkx_102", k = "_totalValue_8ibkx_107", n = {
+  area: t,
+  tooltip: _,
+  title: l,
+  subtitle: e,
+  grid: a,
+  label: o,
+  swatch: i,
+  value: s,
+  computed: b,
+  emphasis: c,
+  rule: u,
+  totalLabel: x,
+  totalValue: k
+};
+export {
+  t as area,
+  b as computed,
+  n as default,
+  c as emphasis,
+  a as grid,
+  o as label,
+  u as rule,
+  e as subtitle,
+  i as swatch,
+  l as title,
+  _ as tooltip,
+  x as totalLabel,
+  k as totalValue,
+  s as value
+};
+//# sourceMappingURL=ChartTooltip.module.css.js.map

package/dist/components/charts/ChartTooltip/ChartTooltip.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTooltip.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;"}

package/dist/components/charts/ChartTreemap/ChartTreemap.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("react/jsx-runtime"),E=require("react"),S=require("d3-hierarchy"),m=require("./ChartTreemap.module.css.cjs"),W=require("../core/useChartMetrics.cjs"),z=require("../core/useSeriesToggle.cjs"),c=require("../palette/seriesColor.cjs"),G=require("../core/ChartFrame.cjs"),s=require("../core/spacing.cjs"),V=require("../../../utils/formatters/formatarNumero.cjs"),v=require("../core/measureText.cjs"),k=require("../core/cartesianLayout.cjs");function F(u){return Number.isFinite(u.value)?Math.max(u.value??0,0):0}function J({accent:u,defaultHiddenGroups:H,emptyMessage:y="Sem dados no período",formatValue:b=V.formatarNumero,gap:C=5,height:N=280,hiddenGroups:O,intentLabels:g,legend:A="bottom",legendAlign:L,nodes:i,onHiddenGroupsChange:q,showDataLabels:R=!0,title:j}){const{font:l,height:M,ref:B,width:d}=W.useChartMetrics(),{fillHeight:f,value:T}=k.chartHeight(N,M),{isHidden:h,toggle:D}=z.useSeriesToggle({defaultHiddenSeries:H,hiddenSeries:O,onHiddenSeriesChange:q}),_=E.useMemo(()=>c.resolveSeriesColors(i,{accent:u}),[u,i]),I=E.useMemo(()=>!((S.hierarchy({children:i,label:""}).sum(F).value??0)>0),[i]),$=E.useMemo(()=>{const e=i.filter(t=>!h(t.label));if(d===0||T===0||e.length===0)return[];const r=S.hierarchy({children:e,label:""}).sum(F).sort((t,n)=>(n.value??0)-(t.value??0));return S.treemap().size([d,T]).paddingInner(C).round(!0)(r).leaves()},[T,C,h,i,d]);function K(e){var t;const r=e.data;if(r.color)return r.color;if(r.intent)return c.INTENT_TOKENS[r.intent];const a=(t=e.ancestors().find(n=>n.depth===1))==null?void 0:t.data;return _[i.findIndex(n=>n.label===(a==null?void 0:a.label))]??c.INTENT_TOKENS.neutral}const w=g?Object.entries(g).map(([e,r])=>({color:c.INTENT_TOKENS[e],label:r})):i.map((e,r)=>({color:_[r],hidden:h(e.label),label:e.label}));return o.jsx(G.ChartFrame,{containerRef:B,empty:i.length===0||I,emptyMessage:y,fillHeight:f,height:T,legend:w,legendAlign:L,legendPosition:A,onToggleSeries:g?void 0:D,title:j,width:d,children:$.map(e=>{const r=e.x1-e.x0,a=e.y1-e.y0,t=r-s.CHART_LABEL_OFFSET*2,n=R&&t>0&&a>=l.lineHeight+s.CHART_LABEL_OFFSET,P=n&&a>=l.lineHeight*2+s.CHART_LABEL_OFFSET,p=`${e.data.label}: ${b(e.value??0)}`,x=K(e);return o.jsxs("g",{className:m.default.cell,children:[o.jsx("rect",{"aria-label":p,className:m.default.tile,fill:x,height:a,width:r,x:e.x0,y:e.y0,children:o.jsx("title",{children:p})}),n&&o.jsx("text",{className:m.default.label,fill:c.textColorOn(x),x:e.x0+s.CHART_LABEL_OFFSET,y:e.y0+s.CHART_LABEL_OFFSET+l.lineHeight*.6,children:v.truncateToWidth(e.data.label,l,t)}),P&&o.jsx("text",{className:m.default.value,fill:c.textColorOn(x),x:e.x0+s.CHART_LABEL_OFFSET,y:e.y0+s.CHART_LABEL_OFFSET+l.lineHeight*1.6,children:v.truncateToWidth(b(e.value??0),l,t)})]},`${e.data.label}-${e.x0}-${e.y0}`)})})}exports.ChartTreemap=J;
+//# sourceMappingURL=ChartTreemap.cjs.map

package/dist/components/charts/ChartTreemap/ChartTreemap.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTreemap.cjs","sources":["../../../../src/components/charts/ChartTreemap/ChartTreemap.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { hierarchy, treemap } from 'd3-hierarchy';\nimport {\n  CHART_LABEL_OFFSET,\n  ChartFrame,\n  chartHeight,\n  truncateToWidth,\n  useChartMetrics,\n  useSeriesToggle,\n  type ChartHeight,\n  type ChartLegendAlign,\n  type ChartLegendPosition,\n} from '../core';\nimport {\n  INTENT_TOKENS,\n  resolveSeriesColors,\n  textColorOn,\n  type SeriesAppearance,\n  type SeriesIntent,\n} from '../palette';\nimport { formatarNumero } from '../../../utils/formatters';\nimport styles from './ChartTreemap.module.css';\n\nexport interface ChartTreemapNode extends SeriesAppearance {\n  children?: readonly ChartTreemapNode[];\n  label: string;\n  value?: number;\n}\n\nexport interface ChartTreemapProps {\n  accent?: string;\n  defaultHiddenGroups?: readonly string[];\n  emptyMessage?: string;\n  formatValue?: (value: number) => string;\n  /** Folga entre dois retangulos vizinhos. */\n  gap?: number;\n  height?: ChartHeight;\n  hiddenGroups?: readonly string[];\n  /**\n   * Nome de cada intencao na legenda. Informado, a legenda deixa de listar os\n   * grupos e passa a nomear as cores: e o caso do mapa colorido por status,\n   * onde o que a legenda explica e o significado da cor, nao a categoria.\n   */\n  intentLabels?: Partial<Record<SeriesIntent, string>>;\n  legend?: ChartLegendPosition;\n  legendAlign?: ChartLegendAlign;\n  nodes: readonly ChartTreemapNode[];\n  onHiddenGroupsChange?: (hidden: readonly string[]) => void;\n  showDataLabels?: boolean;\n  title: string;\n}\n\n\n/** Area que o no ocupa. Invalido ou negativo nao ocupa nada. */\nfunction ocupacao(no: ChartTreemapNode) {\n  return Number.isFinite(no.value) ? Math.max(no.value ?? 0, 0) : 0;\n}\n\nexport function ChartTreemap({\n  accent,\n  defaultHiddenGroups,\n  emptyMessage = 'Sem dados no período',\n  formatValue = formatarNumero,\n  gap = 5,\n  height = 280,\n  hiddenGroups,\n  intentLabels,\n  legend = 'bottom',\n  legendAlign,\n  nodes,\n  onHiddenGroupsChange,\n  showDataLabels = true,\n  title,\n}: ChartTreemapProps) {\n  const { font, height: alturaMedida, ref, width } = useChartMetrics();\n  const { fillHeight, value: alturaDoDesenho } = chartHeight(height, alturaMedida);\n  const { isHidden, toggle } = useSeriesToggle({\n    defaultHiddenSeries: defaultHiddenGroups,\n    hiddenSeries: hiddenGroups,\n    onHiddenSeriesChange: onHiddenGroupsChange,\n  });\n\n  // A cor sai da lista inteira, e nao das visiveis: desligar um grupo nao pode\n  // repintar os demais.\n  const coresDeGrupo = useMemo(() => resolveSeriesColors(nodes, { accent }), [accent, nodes]);\n\n  // Sem valor positivo nao ha area a repartir: anuncia vazio. Desligar todos os grupos, nao: a legenda e a volta.\n  const semValor = useMemo(\n    () => !((hierarchy<ChartTreemapNode>({ children: nodes, label: '' }).sum(ocupacao).value ?? 0) > 0),\n    [nodes],\n  );\n\n  const retangulos = useMemo(() => {\n    const visiveis = nodes.filter((grupo) => !isHidden(grupo.label));\n\n    if (width === 0 || alturaDoDesenho === 0 || visiveis.length === 0) {\n      return [];\n    }\n\n    const arvore = hierarchy<ChartTreemapNode>({ children: visiveis, label: '' })\n      .sum(ocupacao)\n      .sort((a, b) => (b.value ?? 0) - (a.value ?? 0));\n\n    const posicionar = treemap<ChartTreemapNode>()\n      .size([width, alturaDoDesenho])\n      .paddingInner(gap)\n      .round(true);\n\n    return posicionar(arvore).leaves();\n  }, [alturaDoDesenho, gap, isHidden, nodes, width]);\n\n  /** A folha herda a cor do grupo, e a intencao propria vence a herdada. */\n  function corDa(folha: (typeof retangulos)[number]) {\n    const proprio = folha.data;\n\n    if (proprio.color) {\n      return proprio.color;\n    }\n\n    if (proprio.intent) {\n      return INTENT_TOKENS[proprio.intent];\n    }\n\n    const grupo = folha.ancestors().find((ancestral) => ancestral.depth === 1)?.data;\n\n    return coresDeGrupo[nodes.findIndex((no) => no.label === grupo?.label)] ?? INTENT_TOKENS.neutral;\n  }\n\n  const entradasDaLegenda = intentLabels\n    ? (Object.entries(intentLabels) as [SeriesIntent, string][]).map(([intencao, rotulo]) => ({\n        color: INTENT_TOKENS[intencao],\n        label: rotulo,\n      }))\n    : nodes.map((grupo, indice) => ({\n        color: coresDeGrupo[indice],\n        hidden: isHidden(grupo.label),\n        label: grupo.label,\n      }));\n\n  return (\n    <ChartFrame\n      containerRef={ref}\n      empty={nodes.length === 0 || semValor}\n      emptyMessage={emptyMessage}\n      fillHeight={fillHeight}\n      height={alturaDoDesenho}\n      legend={entradasDaLegenda}\n      legendAlign={legendAlign}\n      legendPosition={legend}\n      onToggleSeries={intentLabels ? undefined : toggle}\n      title={title}\n      width={width}\n    >\n      {retangulos.map((folha) => {\n        const largura = folha.x1 - folha.x0;\n        const altura = folha.y1 - folha.y0;\n        const disponivel = largura - CHART_LABEL_OFFSET * 2;\n        const cabeORotulo = showDataLabels && disponivel > 0 && altura >= font.lineHeight + CHART_LABEL_OFFSET;\n        const cabeOValor = cabeORotulo && altura >= font.lineHeight * 2 + CHART_LABEL_OFFSET;\n        const descricao = `${folha.data.label}: ${formatValue(folha.value ?? 0)}`;\n        const cor = corDa(folha);\n\n        return (\n          <g className={styles.cell} key={`${folha.data.label}-${folha.x0}-${folha.y0}`}>\n            <rect\n              aria-label={descricao}\n              className={styles.tile}\n              fill={cor}\n              height={altura}\n              width={largura}\n              x={folha.x0}\n              y={folha.y0}\n            >\n              <title>{descricao}</title>\n            </rect>\n\n            {cabeORotulo && (\n              <text\n                className={styles.label}\n                fill={textColorOn(cor)}\n                x={folha.x0 + CHART_LABEL_OFFSET}\n                y={folha.y0 + CHART_LABEL_OFFSET + font.lineHeight * 0.6}\n              >\n                {truncateToWidth(folha.data.label, font, disponivel)}\n              </text>\n            )}\n\n            {cabeOValor && (\n              <text\n                className={styles.value}\n                fill={textColorOn(cor)}\n                x={folha.x0 + CHART_LABEL_OFFSET}\n                y={folha.y0 + CHART_LABEL_OFFSET + font.lineHeight * 1.6}\n              >\n                {truncateToWidth(formatValue(folha.value ?? 0), font, disponivel)}\n              </text>\n            )}\n          </g>\n        );\n      })}\n    </ChartFrame>\n  );\n}\n"],"names":["ocupacao","no","ChartTreemap","accent","defaultHiddenGroups","emptyMessage","formatValue","formatarNumero","gap","height","hiddenGroups","intentLabels","legend","legendAlign","nodes","onHiddenGroupsChange","showDataLabels","title","font","alturaMedida","ref","width","useChartMetrics","fillHeight","alturaDoDesenho","chartHeight","isHidden","toggle","useSeriesToggle","coresDeGrupo","useMemo","resolveSeriesColors","semValor","hierarchy","retangulos","visiveis","grupo","arvore","a","b","treemap","corDa","folha","proprio","INTENT_TOKENS","_a","ancestral","entradasDaLegenda","intencao","rotulo","indice","jsx","ChartFrame","largura","altura","disponivel","CHART_LABEL_OFFSET","cabeORotulo","cabeOValor","descricao","cor","jsxs","styles","textColorOn","truncateToWidth"],"mappings":"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"}

package/dist/components/charts/ChartTreemap/ChartTreemap.js

@@ -0,0 +1,122 @@
+import { jsx as c, jsxs as V } from "react/jsx-runtime";
+import { useMemo as b } from "react";
+import { hierarchy as N, treemap as W } from "d3-hierarchy";
+import u from "./ChartTreemap.module.css.js";
+import { useChartMetrics as k } from "../core/useChartMetrics.js";
+import { useSeriesToggle as q } from "../core/useSeriesToggle.js";
+import { resolveSeriesColors as J, INTENT_TOKENS as x, textColorOn as S } from "../palette/seriesColor.js";
+import { ChartFrame as Q } from "../core/ChartFrame.js";
+import { CHART_LABEL_OFFSET as n } from "../core/spacing.js";
+import { formatarNumero as U } from "../../../utils/formatters/formatarNumero.js";
+import { truncateToWidth as T } from "../core/measureText.js";
+import { chartHeight as X } from "../core/cartesianLayout.js";
+function C(s) {
+  return Number.isFinite(s.value) ? Math.max(s.value ?? 0, 0) : 0;
+}
+function me({
+  accent: s,
+  defaultHiddenGroups: O,
+  emptyMessage: D = "Sem dados no período",
+  formatValue: v = U,
+  gap: y = 5,
+  height: $ = 280,
+  hiddenGroups: E,
+  intentLabels: p,
+  legend: F = "bottom",
+  legendAlign: M,
+  nodes: i,
+  onHiddenGroupsChange: j,
+  showDataLabels: I = !0,
+  title: R
+}) {
+  const { font: a, height: _, ref: w, width: m } = k(), { fillHeight: A, value: d } = X($, _), { isHidden: g, toggle: z } = q({
+    defaultHiddenSeries: O,
+    hiddenSeries: E,
+    onHiddenSeriesChange: j
+  }), f = b(() => J(i, { accent: s }), [s, i]), B = b(
+    () => !((N({ children: i, label: "" }).sum(C).value ?? 0) > 0),
+    [i]
+  ), G = b(() => {
+    const e = i.filter((t) => !g(t.label));
+    if (m === 0 || d === 0 || e.length === 0)
+      return [];
+    const r = N({ children: e, label: "" }).sum(C).sort((t, l) => (l.value ?? 0) - (t.value ?? 0));
+    return W().size([m, d]).paddingInner(y).round(!0)(r).leaves();
+  }, [d, y, g, i, m]);
+  function K(e) {
+    var t;
+    const r = e.data;
+    if (r.color)
+      return r.color;
+    if (r.intent)
+      return x[r.intent];
+    const o = (t = e.ancestors().find((l) => l.depth === 1)) == null ? void 0 : t.data;
+    return f[i.findIndex((l) => l.label === (o == null ? void 0 : o.label))] ?? x.neutral;
+  }
+  const L = p ? Object.entries(p).map(([e, r]) => ({
+    color: x[e],
+    label: r
+  })) : i.map((e, r) => ({
+    color: f[r],
+    hidden: g(e.label),
+    label: e.label
+  }));
+  return /* @__PURE__ */ c(
+    Q,
+    {
+      containerRef: w,
+      empty: i.length === 0 || B,
+      emptyMessage: D,
+      fillHeight: A,
+      height: d,
+      legend: L,
+      legendAlign: M,
+      legendPosition: F,
+      onToggleSeries: p ? void 0 : z,
+      title: R,
+      width: m,
+      children: G.map((e) => {
+        const r = e.x1 - e.x0, o = e.y1 - e.y0, t = r - n * 2, l = I && t > 0 && o >= a.lineHeight + n, P = l && o >= a.lineHeight * 2 + n, H = `${e.data.label}: ${v(e.value ?? 0)}`, h = K(e);
+        return /* @__PURE__ */ V("g", { className: u.cell, children: [
+          /* @__PURE__ */ c(
+            "rect",
+            {
+              "aria-label": H,
+              className: u.tile,
+              fill: h,
+              height: o,
+              width: r,
+              x: e.x0,
+              y: e.y0,
+              children: /* @__PURE__ */ c("title", { children: H })
+            }
+          ),
+          l && /* @__PURE__ */ c(
+            "text",
+            {
+              className: u.label,
+              fill: S(h),
+              x: e.x0 + n,
+              y: e.y0 + n + a.lineHeight * 0.6,
+              children: T(e.data.label, a, t)
+            }
+          ),
+          P && /* @__PURE__ */ c(
+            "text",
+            {
+              className: u.value,
+              fill: S(h),
+              x: e.x0 + n,
+              y: e.y0 + n + a.lineHeight * 1.6,
+              children: T(v(e.value ?? 0), a, t)
+            }
+          )
+        ] }, `${e.data.label}-${e.x0}-${e.y0}`);
+      })
+    }
+  );
+}
+export {
+  me as ChartTreemap
+};
+//# sourceMappingURL=ChartTreemap.js.map

package/dist/components/charts/ChartTreemap/ChartTreemap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTreemap.js","sources":["../../../../src/components/charts/ChartTreemap/ChartTreemap.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport { hierarchy, treemap } from 'd3-hierarchy';\nimport {\n  CHART_LABEL_OFFSET,\n  ChartFrame,\n  chartHeight,\n  truncateToWidth,\n  useChartMetrics,\n  useSeriesToggle,\n  type ChartHeight,\n  type ChartLegendAlign,\n  type ChartLegendPosition,\n} from '../core';\nimport {\n  INTENT_TOKENS,\n  resolveSeriesColors,\n  textColorOn,\n  type SeriesAppearance,\n  type SeriesIntent,\n} from '../palette';\nimport { formatarNumero } from '../../../utils/formatters';\nimport styles from './ChartTreemap.module.css';\n\nexport interface ChartTreemapNode extends SeriesAppearance {\n  children?: readonly ChartTreemapNode[];\n  label: string;\n  value?: number;\n}\n\nexport interface ChartTreemapProps {\n  accent?: string;\n  defaultHiddenGroups?: readonly string[];\n  emptyMessage?: string;\n  formatValue?: (value: number) => string;\n  /** Folga entre dois retangulos vizinhos. */\n  gap?: number;\n  height?: ChartHeight;\n  hiddenGroups?: readonly string[];\n  /**\n   * Nome de cada intencao na legenda. Informado, a legenda deixa de listar os\n   * grupos e passa a nomear as cores: e o caso do mapa colorido por status,\n   * onde o que a legenda explica e o significado da cor, nao a categoria.\n   */\n  intentLabels?: Partial<Record<SeriesIntent, string>>;\n  legend?: ChartLegendPosition;\n  legendAlign?: ChartLegendAlign;\n  nodes: readonly ChartTreemapNode[];\n  onHiddenGroupsChange?: (hidden: readonly string[]) => void;\n  showDataLabels?: boolean;\n  title: string;\n}\n\n\n/** Area que o no ocupa. Invalido ou negativo nao ocupa nada. */\nfunction ocupacao(no: ChartTreemapNode) {\n  return Number.isFinite(no.value) ? Math.max(no.value ?? 0, 0) : 0;\n}\n\nexport function ChartTreemap({\n  accent,\n  defaultHiddenGroups,\n  emptyMessage = 'Sem dados no período',\n  formatValue = formatarNumero,\n  gap = 5,\n  height = 280,\n  hiddenGroups,\n  intentLabels,\n  legend = 'bottom',\n  legendAlign,\n  nodes,\n  onHiddenGroupsChange,\n  showDataLabels = true,\n  title,\n}: ChartTreemapProps) {\n  const { font, height: alturaMedida, ref, width } = useChartMetrics();\n  const { fillHeight, value: alturaDoDesenho } = chartHeight(height, alturaMedida);\n  const { isHidden, toggle } = useSeriesToggle({\n    defaultHiddenSeries: defaultHiddenGroups,\n    hiddenSeries: hiddenGroups,\n    onHiddenSeriesChange: onHiddenGroupsChange,\n  });\n\n  // A cor sai da lista inteira, e nao das visiveis: desligar um grupo nao pode\n  // repintar os demais.\n  const coresDeGrupo = useMemo(() => resolveSeriesColors(nodes, { accent }), [accent, nodes]);\n\n  // Sem valor positivo nao ha area a repartir: anuncia vazio. Desligar todos os grupos, nao: a legenda e a volta.\n  const semValor = useMemo(\n    () => !((hierarchy<ChartTreemapNode>({ children: nodes, label: '' }).sum(ocupacao).value ?? 0) > 0),\n    [nodes],\n  );\n\n  const retangulos = useMemo(() => {\n    const visiveis = nodes.filter((grupo) => !isHidden(grupo.label));\n\n    if (width === 0 || alturaDoDesenho === 0 || visiveis.length === 0) {\n      return [];\n    }\n\n    const arvore = hierarchy<ChartTreemapNode>({ children: visiveis, label: '' })\n      .sum(ocupacao)\n      .sort((a, b) => (b.value ?? 0) - (a.value ?? 0));\n\n    const posicionar = treemap<ChartTreemapNode>()\n      .size([width, alturaDoDesenho])\n      .paddingInner(gap)\n      .round(true);\n\n    return posicionar(arvore).leaves();\n  }, [alturaDoDesenho, gap, isHidden, nodes, width]);\n\n  /** A folha herda a cor do grupo, e a intencao propria vence a herdada. */\n  function corDa(folha: (typeof retangulos)[number]) {\n    const proprio = folha.data;\n\n    if (proprio.color) {\n      return proprio.color;\n    }\n\n    if (proprio.intent) {\n      return INTENT_TOKENS[proprio.intent];\n    }\n\n    const grupo = folha.ancestors().find((ancestral) => ancestral.depth === 1)?.data;\n\n    return coresDeGrupo[nodes.findIndex((no) => no.label === grupo?.label)] ?? INTENT_TOKENS.neutral;\n  }\n\n  const entradasDaLegenda = intentLabels\n    ? (Object.entries(intentLabels) as [SeriesIntent, string][]).map(([intencao, rotulo]) => ({\n        color: INTENT_TOKENS[intencao],\n        label: rotulo,\n      }))\n    : nodes.map((grupo, indice) => ({\n        color: coresDeGrupo[indice],\n        hidden: isHidden(grupo.label),\n        label: grupo.label,\n      }));\n\n  return (\n    <ChartFrame\n      containerRef={ref}\n      empty={nodes.length === 0 || semValor}\n      emptyMessage={emptyMessage}\n      fillHeight={fillHeight}\n      height={alturaDoDesenho}\n      legend={entradasDaLegenda}\n      legendAlign={legendAlign}\n      legendPosition={legend}\n      onToggleSeries={intentLabels ? undefined : toggle}\n      title={title}\n      width={width}\n    >\n      {retangulos.map((folha) => {\n        const largura = folha.x1 - folha.x0;\n        const altura = folha.y1 - folha.y0;\n        const disponivel = largura - CHART_LABEL_OFFSET * 2;\n        const cabeORotulo = showDataLabels && disponivel > 0 && altura >= font.lineHeight + CHART_LABEL_OFFSET;\n        const cabeOValor = cabeORotulo && altura >= font.lineHeight * 2 + CHART_LABEL_OFFSET;\n        const descricao = `${folha.data.label}: ${formatValue(folha.value ?? 0)}`;\n        const cor = corDa(folha);\n\n        return (\n          <g className={styles.cell} key={`${folha.data.label}-${folha.x0}-${folha.y0}`}>\n            <rect\n              aria-label={descricao}\n              className={styles.tile}\n              fill={cor}\n              height={altura}\n              width={largura}\n              x={folha.x0}\n              y={folha.y0}\n            >\n              <title>{descricao}</title>\n            </rect>\n\n            {cabeORotulo && (\n              <text\n                className={styles.label}\n                fill={textColorOn(cor)}\n                x={folha.x0 + CHART_LABEL_OFFSET}\n                y={folha.y0 + CHART_LABEL_OFFSET + font.lineHeight * 0.6}\n              >\n                {truncateToWidth(folha.data.label, font, disponivel)}\n              </text>\n            )}\n\n            {cabeOValor && (\n              <text\n                className={styles.value}\n                fill={textColorOn(cor)}\n                x={folha.x0 + CHART_LABEL_OFFSET}\n                y={folha.y0 + CHART_LABEL_OFFSET + font.lineHeight * 1.6}\n              >\n                {truncateToWidth(formatValue(folha.value ?? 0), font, disponivel)}\n              </text>\n            )}\n          </g>\n        );\n      })}\n    </ChartFrame>\n  );\n}\n"],"names":["ocupacao","no","ChartTreemap","accent","defaultHiddenGroups","emptyMessage","formatValue","formatarNumero","gap","height","hiddenGroups","intentLabels","legend","legendAlign","nodes","onHiddenGroupsChange","showDataLabels","title","font","alturaMedida","ref","width","useChartMetrics","fillHeight","alturaDoDesenho","chartHeight","isHidden","toggle","useSeriesToggle","coresDeGrupo","useMemo","resolveSeriesColors","semValor","hierarchy","retangulos","visiveis","grupo","arvore","a","b","treemap","corDa","folha","proprio","INTENT_TOKENS","_a","ancestral","entradasDaLegenda","intencao","rotulo","indice","jsx","ChartFrame","largura","altura","disponivel","CHART_LABEL_OFFSET","cabeORotulo","cabeOValor","descricao","cor","jsxs","styles","textColorOn","truncateToWidth"],"mappings":"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"}

package/dist/components/charts/ChartTreemap/ChartTreemap.module.css.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l="_cell_5uvni_1",e="_tile_5uvni_5",t="_label_5uvni_14",u="_value_5uvni_21",_={cell:l,tile:e,label:t,value:u};exports.cell=l;exports.default=_;exports.label=t;exports.tile=e;exports.value=u;
+//# sourceMappingURL=ChartTreemap.module.css.cjs.map

package/dist/components/charts/ChartTreemap/ChartTreemap.module.css.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTreemap.module.css.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/components/charts/ChartTreemap/ChartTreemap.module.css.js

@@ -0,0 +1,14 @@
+const l = "_cell_5uvni_1", e = "_tile_5uvni_5", _ = "_label_5uvni_14", t = "_value_5uvni_21", n = {
+  cell: l,
+  tile: e,
+  label: _,
+  value: t
+};
+export {
+  l as cell,
+  n as default,
+  _ as label,
+  e as tile,
+  t as value
+};
+//# sourceMappingURL=ChartTreemap.module.css.js.map

package/dist/components/charts/ChartTreemap/ChartTreemap.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTreemap.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/components/charts/ChartWaterfall/ChartWaterfall.cjs

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("react/jsx-runtime"),h=require("react"),C=require("./ChartWaterfall.module.css.cjs"),K=require("../core/useChartMetrics.cjs"),Q=require("../core/useHoveredBand.cjs"),U=require("../palette/seriesColor.cjs"),f=require("../scales/scales.cjs"),y=require("../core/cartesianLayout.cjs"),V=require("../core/spacing.cjs"),X=require("../core/useTweenedNumbers.cjs"),Y=require("../../../utils/formatters/formatarNumero.cjs"),Z=require("../core/CartesianFrame.cjs"),ee=require("../core/BandCursor.cjs"),te=require("../core/shapes.cjs");function ne(n){let a=0;return n.map(d=>{if(!Number.isFinite(d.value))return null;const b=d.total?0:a,g=b+d.value;return a=g,{inicio:b,fim:g}})}function oe(n){return n.intent?n.intent:n.total?"neutral":n.value<0?"negative":"positive"}function re(n,a){return n===0?a(0):`${n<0?"-":"+"}${a(Math.abs(n))}`}function ae({emptyMessage:n="Sem dados no período",formatValue:a=Y.formatarNumero,height:d=280,labelAngle:b="auto",onHoverStep:g,showDataLabels:L=!0,steps:r,title:W,xAxis:S="visible",yAxis:w="visible",yAxisRight:j="hidden"}){const{font:D,height:z,radius:v,ref:A,width:N}=K.useChartMetrics(),{fillHeight:E,value:M}=y.chartHeight(d,z),{hover:p,hovered:F}=Q.useHoveredBand(g),s=h.useMemo(()=>ne(r),[r]),O=h.useMemo(()=>U.resolveSeriesColors(r.map(e=>({color:e.color,intent:oe(e)}))),[r]),x=h.useMemo(()=>f.domainOf(s.flatMap(e=>e?[e.inicio,e.fim]:[])),[s]),P=y.valueLabelsFor(x,M,a),{margins:_,plot:l,rotation:G}=y.cartesianLayout({bottomLabels:r.map(e=>e.label),font:D,height:M,labelAngle:b,leftLabels:P,rightLabels:P,topRoom:L?V.valueLabelRoom(D):0,width:N,xAxis:S,yAxis:w,yAxisRight:j}),u=h.useMemo(()=>f.bandScale({domain:r.map((e,t)=>String(t)),range:[0,l.width]}),[l.width,r]),c=e=>u(String(e))??0,B=h.useMemo(()=>f.linearScale({domain:x,range:[l.height,0]}),[x,l.height]),[R,k]=X.useTweenedNumbers(B.domain()),i=h.useMemo(()=>f.linearScale({domain:{min:R,max:k},nice:!1,range:[l.height,0]}),[k,R,l.height]),H=f.ticksFor(B,l.height),I=r.map((e,t)=>({label:e.label,position:c(t)+u.bandwidth()/2})),$=H.map(e=>({label:a(e),position:i(e)}));function T(e){return e.total?a(e.value):re(e.value,a)}return m.jsxs(Z.CartesianFrame,{containerRef:A,empty:r.length===0,emptyMessage:n,grid:[{baseline:i(0),lines:H.map(e=>i(e)),orientation:"horizontal"}],fillHeight:E,height:M,legendPosition:"none",margins:_,plot:l,title:W,width:N,xAxis:{labelRotation:G,ticks:I,visibility:S},yAxis:{hideLine:!0,ticks:$,visibility:w},yAxisRight:{hideLine:!0,ticks:$,visibility:j},children:[F!==null&&m.jsx(ee.BandCursor,{offset:c(F),plot:l,size:u.bandwidth()}),m.jsx("g",{"aria-hidden":"true",children:s.slice(0,-1).map((e,t)=>{if(!e||!s[t+1])return null;const o=i(e.fim);return m.jsx("line",{className:C.default.connector,x1:c(t)+u.bandwidth(),x2:c(t+1),y1:o,y2:o},t)})}),r.map((e,t)=>{const o=s[t];if(!o)return null;const q=Math.min(i(o.inicio),i(o.fim)),J=Math.abs(i(o.fim)-i(o.inicio));return m.jsx("path",{"aria-label":`${e.label}: ${T(e)}`,className:C.default.bar,d:te.roundedBarPath(c(t),q,u.bandwidth(),J,[v,v,v,v]),fill:O[t],onMouseEnter:()=>p(t),onMouseLeave:()=>p(null)},t)}),L&&r.map((e,t)=>{const o=s[t];if(!o)return null;const q=Math.min(i(o.inicio),i(o.fim));return m.jsx("text",{className:C.default.valueLabel,textAnchor:"middle",x:c(t)+u.bandwidth()/2,y:q-6,children:T(e)},t)})]})}exports.ChartWaterfall=ae;
+//# sourceMappingURL=ChartWaterfall.cjs.map

package/dist/components/charts/ChartWaterfall/ChartWaterfall.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartWaterfall.cjs","sources":["../../../../src/components/charts/ChartWaterfall/ChartWaterfall.tsx"],"sourcesContent":["import { useMemo } from 'react';\nimport {\n  BandCursor,\n  CartesianFrame,\n  cartesianLayout,\n  chartHeight,\n  roundedBarPath,\n  useChartMetrics,\n  useHoveredBand,\n  useTweenedNumbers,\n  valueLabelRoom,\n  valueLabelsFor,\n  type AxisLabelAngle,\n  type AxisTick,\n  type AxisVisibility,\n  type ChartHeight,\n} from '../core';\nimport { resolveSeriesColors, type SeriesIntent } from '../palette';\nimport { bandScale, domainOf, linearScale, ticksFor } from '../scales';\nimport { formatarNumero } from '../../../utils/formatters';\nimport styles from './ChartWaterfall.module.css';\n\nexport interface ChartWaterfallStep {\n  color?: string;\n  intent?: SeriesIntent;\n  label: string;\n  total?: boolean;\n  value: number;\n}\n\nexport interface ChartWaterfallProps {\n  emptyMessage?: string;\n  formatValue?: (value: number) => string;\n  height?: ChartHeight;\n  labelAngle?: AxisLabelAngle;\n  /** Indice do passo sob o ponteiro, ou `null` ao sair dele. */\n  onHoverStep?: (index: number | null) => void;\n  showDataLabels?: boolean;\n  steps: readonly ChartWaterfallStep[];\n  title: string;\n  xAxis?: AxisVisibility;\n  yAxis?: AxisVisibility;\n  yAxisRight?: AxisVisibility;\n}\n\ninterface Trecho {\n  fim: number;\n  inicio: number;\n}\n\n/**\n * Cada passo ocupa a faixa entre o acumulado anterior e o novo acumulado; o total parte do zero, porque\n * fecha a conta. Passo invalido e ausente: nao se desenha nem move o acumulado.\n */\nfunction trechosDe(steps: readonly ChartWaterfallStep[]): (Trecho | null)[] {\n  let acumulado = 0;\n\n  return steps.map((passo) => {\n    if (!Number.isFinite(passo.value)) {\n      return null;\n    }\n\n    const inicio = passo.total ? 0 : acumulado;\n    const fim = inicio + passo.value;\n    acumulado = fim;\n\n    return { inicio, fim };\n  });\n}\n\n/** Passo sem intencao declarada recebe a do seu sinal. Total e fechamento, nao aporte. */\nfunction intencaoDe(step: ChartWaterfallStep): SeriesIntent {\n  if (step.intent) {\n    return step.intent;\n  }\n\n  if (step.total) {\n    return 'neutral';\n  }\n\n  return step.value < 0 ? 'negative' : 'positive';\n}\n\n/**\n * O sinal e do grafico, nao do formatador: ele formata a magnitude. Delegar o\n * sinal perderia a variacao com qualquer formatador que exiba apenas o valor.\n */\nfunction comSinal(value: number, formatValue: (value: number) => string) {\n  if (value === 0) {\n    return formatValue(0);\n  }\n\n  return `${value < 0 ? '-' : '+'}${formatValue(Math.abs(value))}`;\n}\n\nexport function ChartWaterfall({\n  emptyMessage = 'Sem dados no período',\n  formatValue = formatarNumero,\n  height = 280,\n  labelAngle = 'auto',\n  onHoverStep,\n  showDataLabels = true,\n  steps,\n  title,\n  xAxis = 'visible',\n  yAxis = 'visible',\n  yAxisRight = 'hidden',\n}: ChartWaterfallProps) {\n  const { font, height: alturaMedida, radius: raioDoCanto, ref, width } = useChartMetrics();\n  const { fillHeight, value: alturaDoDesenho } = chartHeight(height, alturaMedida);\n  const { hover: focarPasso, hovered: passoEmFoco } = useHoveredBand(onHoverStep);\n\n  const trechos = useMemo(() => trechosDe(steps), [steps]);\n\n  const cores = useMemo(\n    () => resolveSeriesColors(steps.map((passo) => ({ color: passo.color, intent: intencaoDe(passo) }))),\n    [steps],\n  );\n\n  const dominio = useMemo(\n    () => domainOf(trechos.flatMap((trecho) => (trecho ? [trecho.inicio, trecho.fim] : []))),\n    [trechos],\n  );\n\n  const rotulosDeValor = valueLabelsFor(dominio, alturaDoDesenho, formatValue);\n\n  const { margins, plot, rotation } = cartesianLayout({\n    bottomLabels: steps.map((passo) => passo.label),\n    font,\n    height: alturaDoDesenho,\n    labelAngle,\n    leftLabels: rotulosDeValor,\n    rightLabels: rotulosDeValor,\n    topRoom: showDataLabels ? valueLabelRoom(font) : 0,\n    width,\n    xAxis,\n    yAxis,\n    yAxisRight,\n  });\n\n  // A faixa e indexada pela posicao, nao pelo rotulo: numa sequencia de passos o\n  // mesmo rotulo pode repetir, e a escala categorica funde dominios iguais.\n  const escalaPassos = useMemo(\n    () => bandScale({ domain: steps.map((_, indice) => String(indice)), range: [0, plot.width] }),\n    [plot.width, steps],\n  );\n\n  const faixaDe = (indice: number) => escalaPassos(String(indice)) ?? 0;\n\n  // A escala alvo fixa as marcas; a animada posiciona o desenho. Sem separar as\n  // duas, as marcas exibiriam valores quebrados durante a transicao.\n  const escalaAlvo = useMemo(\n    () => linearScale({ domain: dominio, range: [plot.height, 0] }),\n    [dominio, plot.height],\n  );\n\n  const [minimo, maximo] = useTweenedNumbers(escalaAlvo.domain());\n\n  const escalaValores = useMemo(\n    () => linearScale({ domain: { min: minimo, max: maximo }, nice: false, range: [plot.height, 0] }),\n    [maximo, minimo, plot.height],\n  );\n\n  const marcasDeValor = ticksFor(escalaAlvo, plot.height);\n\n  const marcasPassos: AxisTick[] = steps.map((passo, indice) => ({\n    label: passo.label,\n    position: faixaDe(indice) + escalaPassos.bandwidth() / 2,\n  }));\n\n  const marcasValor: AxisTick[] = marcasDeValor.map((valor) => ({\n    label: formatValue(valor),\n    position: escalaValores(valor),\n  }));\n\n  function rotuloDe(passo: ChartWaterfallStep) {\n    return passo.total ? formatValue(passo.value) : comSinal(passo.value, formatValue);\n  }\n\n  return (\n    <CartesianFrame\n      containerRef={ref}\n      empty={steps.length === 0}\n      emptyMessage={emptyMessage}\n      grid={[\n        {\n          baseline: escalaValores(0),\n          lines: marcasDeValor.map((valor) => escalaValores(valor)),\n          orientation: 'horizontal',\n        },\n      ]}\n      fillHeight={fillHeight}\n      height={alturaDoDesenho}\n      legendPosition=\"none\"\n      margins={margins}\n      plot={plot}\n      title={title}\n      width={width}\n      xAxis={{ labelRotation: rotation, ticks: marcasPassos, visibility: xAxis }}\n      yAxis={{ hideLine: true, ticks: marcasValor, visibility: yAxis }}\n      yAxisRight={{ hideLine: true, ticks: marcasValor, visibility: yAxisRight }}\n    >\n      {passoEmFoco !== null && (\n        <BandCursor offset={faixaDe(passoEmFoco)} plot={plot} size={escalaPassos.bandwidth()} />\n      )}\n\n      <g aria-hidden=\"true\">\n        {trechos.slice(0, -1).map((trecho, indice) => {\n          if (!trecho || !trechos[indice + 1]) {\n            return null;\n          }\n\n          const nivel = escalaValores(trecho.fim);\n\n          return (\n            <line\n              className={styles.connector}\n              key={indice}\n              x1={faixaDe(indice) + escalaPassos.bandwidth()}\n              x2={faixaDe(indice + 1)}\n              y1={nivel}\n              y2={nivel}\n            />\n          );\n        })}\n      </g>\n\n      {steps.map((passo, indice) => {\n        const trecho = trechos[indice];\n\n        if (!trecho) {\n          return null;\n        }\n\n        const topo = Math.min(escalaValores(trecho.inicio), escalaValores(trecho.fim));\n        const altura = Math.abs(escalaValores(trecho.fim) - escalaValores(trecho.inicio));\n\n        return (\n          <path\n            aria-label={`${passo.label}: ${rotuloDe(passo)}`}\n            className={styles.bar}\n            d={roundedBarPath(faixaDe(indice), topo, escalaPassos.bandwidth(), altura, [\n              raioDoCanto,\n              raioDoCanto,\n              raioDoCanto,\n              raioDoCanto,\n            ])}\n            fill={cores[indice]}\n            key={indice}\n            onMouseEnter={() => focarPasso(indice)}\n            onMouseLeave={() => focarPasso(null)}\n          />\n        );\n      })}\n\n      {showDataLabels &&\n        steps.map((passo, indice) => {\n          const trecho = trechos[indice];\n\n          if (!trecho) {\n            return null;\n          }\n\n          const topo = Math.min(escalaValores(trecho.inicio), escalaValores(trecho.fim));\n\n          return (\n            <text\n              className={styles.valueLabel}\n              key={indice}\n              textAnchor=\"middle\"\n              x={faixaDe(indice) + escalaPassos.bandwidth() / 2}\n              y={topo - 6}\n            >\n              {rotuloDe(passo)}\n            </text>\n          );\n        })}\n    </CartesianFrame>\n  );\n}\n"],"names":["trechosDe","steps","acumulado","passo","inicio","fim","intencaoDe","step","comSinal","value","formatValue","ChartWaterfall","emptyMessage","formatarNumero","height","labelAngle","onHoverStep","showDataLabels","title","xAxis","yAxis","yAxisRight","font","alturaMedida","raioDoCanto","ref","width","useChartMetrics","fillHeight","alturaDoDesenho","chartHeight","focarPasso","passoEmFoco","useHoveredBand","trechos","useMemo","cores","resolveSeriesColors","dominio","domainOf","trecho","rotulosDeValor","valueLabelsFor","margins","plot","rotation","cartesianLayout","valueLabelRoom","escalaPassos","bandScale","_","indice","faixaDe","escalaAlvo","linearScale","minimo","maximo","useTweenedNumbers","escalaValores","marcasDeValor","ticksFor","marcasPassos","marcasValor","valor","rotuloDe","jsxs","CartesianFrame","jsx","BandCursor","nivel","styles","topo","altura","roundedBarPath"],"mappings":"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"}