@nextelco/common-ui 2.1.105 → 2.1.107

package/dist/esm/legacy/components/charts/Charts.js

@@ -2,6 +2,7 @@ import { jsx } from "react/jsx-runtime";
 import { Chart, registerables } from "chart.js";
 import ChartDataLabels from "chartjs-plugin-datalabels";
 import { Doughnut, Bar, Bubble, Line } from "react-chartjs-2";
+import { useIsDark } from "../../../v1/capabilities/theme/useIsDark.js";
 function euros(v) {
   if (v == null) return "—";
   const negativo = v < 0;
@@ -36,63 +37,122 @@ const PALETA = [
 function cor(i) {
   return PALETA[i % PALETA.length];
 }
-const legendaBaixo = {
-  position: "bottom",
-  labels: { boxWidth: 10, font: { size: 11 }, color: "#182238", usePointStyle: true, pointStyle: "circle" }
-};
-function BarrasEmpilhadas({ serie, altura = 280 }) {
-  return /* @__PURE__ */ jsx("div", { style: { height: altura }, children: /* @__PURE__ */ jsx(
+function useTema() {
+  const escuro = useIsDark();
+  return escuro ? { texto: "#CBD5E1", forte: "#E2E8F0", grelha: "#1E293B" } : { texto: "#5B6577", forte: "#182238", grelha: "#EEF1F5" };
+}
+function legendaBaixo(tema) {
+  return {
+    position: "bottom",
+    labels: { boxWidth: 10, font: { size: 11 }, color: tema.forte, usePointStyle: true, pointStyle: "circle" }
+  };
+}
+function clique(labels, series, onClick) {
+  if (!onClick) return {};
+  return {
+    onClick: (_e, els) => {
+      const el = els[0];
+      if (!el) return;
+      onClick(labels[el.index], el.index, series?.[el.datasetIndex]?.nome);
+    },
+    onHover: (e, els) => {
+      const alvo = e.native?.target;
+      if (alvo) alvo.style.cursor = els.length ? "pointer" : "default";
+    }
+  };
+}
+function Barras({
+  labels: todas,
+  series: todasSeries,
+  horizontal = false,
+  empilhado = false,
+  altura,
+  limite,
+  cores,
+  formatar = (v) => String(v),
+  valores = true,
+  percentagem = false,
+  legenda,
+  formatarEtiqueta = labelBucket,
+  onClick
+}) {
+  const tema = useTema();
+  const labels = limite ? todas.slice(0, limite) : todas;
+  const series = todasSeries.map((s) => ({ ...s, valores: limite ? s.valores.slice(0, limite) : s.valores }));
+  const uma = series.length === 1;
+  const total = uma ? todasSeries[0].valores.reduce((a, b) => a + (b || 0), 0) : 0;
+  const etiqueta = (v) => percentagem && uma && total > 0 ? `${formatar(v)} (${Math.round(v / total * 100)}%)` : formatar(v);
+  const alturaFinal = altura ?? (horizontal ? Math.max(200, labels.length * 30 + 40) : 260);
+  const eixoValor = { beginAtZero: true, stacked: empilhado, grid: { color: tema.grelha }, ticks: { color: tema.texto, callback: (v) => formatar(Number(v)) } };
+  const eixoEtiqueta = { stacked: empilhado, grid: { display: false }, ticks: { color: tema.texto } };
+  return /* @__PURE__ */ jsx("div", { style: { height: alturaFinal }, children: /* @__PURE__ */ jsx(
     Bar,
     {
       data: {
-        labels: serie.labels.map(labelBucket),
-        datasets: serie.series.map((s, i) => ({
+        labels: labels.map(formatarEtiqueta),
+        datasets: series.map((s, i) => ({
           label: s.nome,
           data: s.valores,
-          backgroundColor: cor(i),
-          borderRadius: 3
+          backgroundColor: uma && cores ? labels.map((_, j) => cores[j % cores.length]) : s.cor ?? cor(i),
+          borderRadius: 4,
+          maxBarThickness: 40
         }))
       },
       options: {
+        indexAxis: horizontal ? "y" : "x",
         maintainAspectRatio: false,
         responsive: true,
-        plugins: { legend: legendaBaixo },
-        scales: {
-          x: { stacked: true, grid: { display: false } },
-          y: { stacked: true, beginAtZero: true, grid: { color: "#EEF1F5" } }
-        }
+        ...clique(labels, series, onClick),
+        plugins: {
+          legend: legenda ?? !uma ? legendaBaixo(tema) : { display: false },
+          tooltip: { callbacks: { label: (c) => `${c.dataset.label ? `${c.dataset.label}: ` : ""}${etiqueta(Number(c.parsed[horizontal ? "x" : "y"]))}` } },
+          datalabels: {
+            display: (c) => valores && !empilhado && Number(c.dataset.data[c.dataIndex]) > 0,
+            anchor: "end",
+            align: "end",
+            color: tema.forte,
+            font: { size: 10, weight: 600 },
+            formatter: (v) => etiqueta(v)
+          }
+        },
+        scales: horizontal ? { x: eixoValor, y: eixoEtiqueta } : { x: eixoEtiqueta, y: eixoValor },
+        layout: { padding: horizontal ? { right: valores ? percentagem ? 56 : 32 : 8 } : { top: valores ? 18 : 4 } }
       }
     }
   ) });
 }
-function BarrasHorizontais({ dados, altura = 280, limite = 12 }) {
-  const labels = dados.labels.slice(0, limite);
-  const valores = dados.valores.slice(0, limite);
-  return /* @__PURE__ */ jsx("div", { style: { height: altura }, children: /* @__PURE__ */ jsx(
-    Bar,
+function BarrasEmpilhadas({ serie, altura = 280, onClick }) {
+  return /* @__PURE__ */ jsx(Barras, { labels: serie.labels, series: serie.series, empilhado: true, altura, onClick, legenda: true });
+}
+function BarrasHorizontais({
+  dados,
+  altura = 280,
+  limite = 12,
+  onClick
+}) {
+  const n = Math.min(limite, dados.labels.length);
+  return /* @__PURE__ */ jsx(
+    Barras,
     {
-      data: {
-        labels,
-        datasets: [{ label: "", data: valores, backgroundColor: labels.map((_, i) => cor(i)), borderRadius: 3 }]
-      },
-      options: {
-        indexAxis: "y",
-        maintainAspectRatio: false,
-        responsive: true,
-        plugins: {
-          legend: { display: false },
-          datalabels: { display: (c) => c.dataset.data[c.dataIndex] != null, anchor: "end", align: "end", color: "#182238", font: { size: 11, weight: 600 } }
-        },
-        scales: {
-          x: { beginAtZero: true, grid: { color: "#EEF1F5" } },
-          y: { grid: { display: false } }
-        },
-        layout: { padding: { right: 28 } }
-      }
+      horizontal: true,
+      labels: dados.labels,
+      series: [{ nome: "", valores: dados.valores }],
+      cores: Array.from({ length: n }, (_, i) => cor(i)),
+      limite,
+      altura,
+      onClick
     }
-  ) });
+  );
 }
-function Anel({ dados, altura = 260, cores }) {
+function Anel({
+  dados,
+  altura = 260,
+  cores,
+  formatar = (v) => String(v),
+  onClick
+}) {
+  const tema = useTema();
+  const total = dados.valores.reduce((a, b) => a + (b || 0), 0);
   return /* @__PURE__ */ jsx("div", { style: { height: altura }, children: /* @__PURE__ */ jsx(
     Doughnut,
     {
@@ -110,19 +170,36 @@ function Anel({ dados, altura = 260, cores }) {
         maintainAspectRatio: false,
         responsive: true,
         cutout: "58%",
+        ...clique(dados.labels, void 0, onClick),
         plugins: {
-          legend: legendaBaixo,
+          legend: legendaBaixo(tema),
+          tooltip: {
+            callbacks: {
+              label: (c) => {
+                const v = Number(c.parsed);
+                return ` ${c.label}: ${formatar(v)}${total > 0 ? ` (${Math.round(v / total * 100)}%)` : ""}`;
+              }
+            }
+          },
           datalabels: {
-            display: (c) => Number(c.dataset.data[c.dataIndex]) > 0,
-            color: "#182238",
-            font: { size: 11, weight: 600 }
+            // Só nas fatias que têm espaço para o número.
+            display: (c) => total > 0 && Number(c.dataset.data[c.dataIndex]) / total >= 0.05,
+            color: "#FFFFFF",
+            font: { size: 11, weight: 700 },
+            formatter: (v) => formatar(v)
           }
         }
       }
     }
   ) });
 }
-function Linha({ dados, altura = 260, euros: emEuros = false }) {
+function Linha({
+  dados,
+  altura = 260,
+  euros: emEuros = false,
+  onClick
+}) {
+  const tema = useTema();
   return /* @__PURE__ */ jsx("div", { style: { height: altura }, children: /* @__PURE__ */ jsx(
     Line,
     {
@@ -143,6 +220,7 @@ function Linha({ dados, altura = 260, euros: emEuros = false }) {
       options: {
         maintainAspectRatio: false,
         responsive: true,
+        ...clique(dados.labels, void 0, onClick),
         plugins: {
           legend: { display: false },
           tooltip: {
@@ -152,11 +230,11 @@ function Linha({ dados, altura = 260, euros: emEuros = false }) {
           }
         },
         scales: {
-          x: { grid: { display: false } },
+          x: { grid: { display: false }, ticks: { color: tema.texto } },
           y: {
             beginAtZero: true,
-            grid: { color: "#EEF1F5" },
-            ticks: { callback: (v) => emEuros ? euros(Number(v)) : String(v) }
+            grid: { color: tema.grelha },
+            ticks: { color: tema.texto, callback: (v) => emEuros ? euros(Number(v)) : String(v) }
           }
         }
       }
@@ -166,18 +244,24 @@ function Linha({ dados, altura = 260, euros: emEuros = false }) {
 function Linhas({
   serie,
   altura = 280,
-  area = false
+  area = false,
+  cores,
+  formatar = (v) => String(v),
+  formatarEtiqueta = labelBucket,
+  onClick
 }) {
+  const tema = useTema();
+  const corDe = (i) => cores?.[i] ?? cor(i);
   return /* @__PURE__ */ jsx("div", { style: { height: altura }, children: /* @__PURE__ */ jsx(
     Line,
     {
       data: {
-        labels: serie.labels.map(labelBucket),
+        labels: serie.labels.map(formatarEtiqueta),
         datasets: serie.series.map((s, i) => ({
           label: s.nome,
           data: s.valores,
-          borderColor: cor(i),
-          backgroundColor: area ? `${cor(i)}22` : cor(i),
+          borderColor: corDe(i),
+          backgroundColor: area ? `${corDe(i)}22` : corDe(i),
           fill: area,
           tension: 0.25,
           pointRadius: serie.labels.length > 24 ? 0 : 3,
@@ -188,10 +272,14 @@ function Linhas({
         maintainAspectRatio: false,
         responsive: true,
         interaction: { mode: "index", intersect: false },
-        plugins: { legend: legendaBaixo },
+        ...clique(serie.labels, serie.series, onClick),
+        plugins: {
+          legend: legendaBaixo(tema),
+          tooltip: { callbacks: { label: (c) => `${c.dataset.label}: ${formatar(Number(c.parsed.y))}` } }
+        },
         scales: {
-          x: { grid: { display: false } },
-          y: { beginAtZero: true, grid: { color: "#EEF1F5" } }
+          x: { grid: { display: false }, ticks: { color: tema.texto, autoSkip: true, maxRotation: 0 } },
+          y: { beginAtZero: true, grid: { color: tema.grelha }, ticks: { color: tema.texto, callback: (v) => formatar(Number(v)) } }
         }
       }
     }
@@ -205,6 +293,7 @@ function Bolhas({
   yTitle = "% overdue",
   tooltipLabel = (p) => `${p.responsavel}: ${p.otsAtivas} active, ${p.percentagemForaPrazo}% overdue, ${euros(p.valorPenalizado)}`
 }) {
+  const tema = useTema();
   const maxValor = Math.max(1, ...pontos.map((p) => p.valorPenalizado));
   return /* @__PURE__ */ jsx("div", { style: { height: altura }, children: /* @__PURE__ */ jsx(
     Bubble,
@@ -239,8 +328,8 @@ function Bolhas({
           }
         },
         scales: {
-          x: { beginAtZero: true, title: { display: true, text: xTitle }, grid: { color: "#EEF1F5" } },
-          y: { beginAtZero: true, title: { display: true, text: yTitle }, grid: { color: "#EEF1F5" } }
+          x: { beginAtZero: true, title: { display: true, text: xTitle, color: tema.texto }, grid: { color: tema.grelha }, ticks: { color: tema.texto } },
+          y: { beginAtZero: true, title: { display: true, text: yTitle, color: tema.texto }, grid: { color: tema.grelha }, ticks: { color: tema.texto } }
         }
       }
     }
@@ -248,6 +337,7 @@ function Bolhas({
 }
 export {
   Anel,
+  Barras,
   BarrasEmpilhadas,
   BarrasHorizontais,
   Bolhas,

package/dist/esm/legacy/components/charts/Charts.js.map

@@ -1 +1 @@
-{"version":3,"file":"Charts.js","sources":["../../../../../src/legacy/components/charts/Charts.tsx"],"sourcesContent":["import React from 'react'\r\nimport { Chart as ChartJS, registerables } from 'chart.js'\r\nimport ChartDataLabels from 'chartjs-plugin-datalabels'\r\nimport { Bar, Doughnut, Line, Bubble } from 'react-chartjs-2'\r\n\r\n// ---------------------------------------------------------------------------\r\n// Local types (inlined — originally imported from CRE `../types`).\r\n// ---------------------------------------------------------------------------\r\n\r\n/**\r\n * Stacked series over a set of shared labels (e.g. a dimension over time).\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport interface SerieEmpilhada {\r\n  labels: string[]\r\n  series: { nome: string; valores: number[] }[]\r\n}\r\n\r\n/**\r\n * A simple distribution: parallel arrays of labels and values.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport interface Distribuicao {\r\n  labels: string[]\r\n  valores: number[]\r\n}\r\n\r\n// ---------------------------------------------------------------------------\r\n// Local formatting helpers (inlined — originally imported from CRE `../lib/format`).\r\n// Behavior kept close to the originals; the library stays self-contained.\r\n// ---------------------------------------------------------------------------\r\n\r\n/**\r\n * Currency formatter. Thousands separated by '.', decimals by ',', suffixed ' €'.\r\n * Independent of Intl/ICU so the thousands separator is stable across browsers.\r\n */\r\nfunction euros(v: number | null | undefined): string {\r\n  if (v == null) return '—'\r\n  const negativo = v < 0\r\n  const [inteiro, decimal] = Math.abs(v).toFixed(2).split('.')\r\n  const comMilhares = inteiro.replace(/\\B(?=(\\d{3})+(?!\\d))/g, '.')\r\n  return `${negativo ? '-' : ''}${comMilhares},${decimal} €`\r\n}\r\n\r\n/** 'YYYY-Sxx' / 'YYYY-MM' / 'YYYY-MM-DD' → short axis label. */\r\nfunction labelBucket(b: string): string {\r\n  if (/^\\d{4}-S\\d{2}$/.test(b)) return `S${b.slice(6)}/${b.slice(2, 4)}`\r\n  if (/^\\d{4}-\\d{2}$/.test(b)) return `${b.slice(5)}/${b.slice(0, 4)}`\r\n  if (/^\\d{4}-\\d{2}-\\d{2}$/.test(b)) return `${b.slice(8)}/${b.slice(5, 7)}`\r\n  return b\r\n}\r\n\r\n// ---------------------------------------------------------------------------\r\n// Chart.js registration (once, at module load).\r\n// ---------------------------------------------------------------------------\r\n\r\n// Regista TUDO (registerables inclui Filler, controllers, scales) + o plugin de\r\n// datalabels. O registo parcial degenerava a geometria (doughnut colapsado) e o\r\n// aviso \"fill sem Filler\". registerables = equivalente a chart.js/auto.\r\nChartJS.register(...registerables, ChartDataLabels)\r\n// Datalabels off by default — enabled only where it improves readability.\r\nChartJS.defaults.set('plugins.datalabels', { display: false })\r\nChartJS.defaults.font.family = \"'Montserrat', sans-serif\"\r\nChartJS.defaults.color = '#5B6577'\r\n\r\n/**\r\n * Categorical palette. Stable order so the same dimension always maps to the same color.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport const PALETA = [\r\n  '#1868B0',\r\n  '#1F8A55',\r\n  '#B96E00',\r\n  '#C23B34',\r\n  '#7C3AED',\r\n  '#0891B2',\r\n  '#DB2777',\r\n  '#65A30D',\r\n  '#4B5563',\r\n  '#D97706',\r\n  '#2563EB',\r\n  '#059669',\r\n]\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport function cor(i: number): string {\r\n  return PALETA[i % PALETA.length]!\r\n}\r\n\r\nconst legendaBaixo = {\r\n  position: 'bottom' as const,\r\n  labels: { boxWidth: 10, font: { size: 11 }, color: '#182238', usePointStyle: true, pointStyle: 'circle' as const },\r\n}\r\n\r\n/**\r\n * Stacked bars for a dimension over time.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport function BarrasEmpilhadas({ serie, altura = 280 }: { serie: SerieEmpilhada; altura?: number }) {\r\n  return (\r\n    <div style={{ height: altura }}>\r\n      <Bar\r\n        data={{\r\n          labels: serie.labels.map(labelBucket),\r\n          datasets: serie.series.map((s, i) => ({\r\n            label: s.nome,\r\n            data: s.valores,\r\n            backgroundColor: cor(i),\r\n            borderRadius: 3,\r\n          })),\r\n        }}\r\n        options={{\r\n          maintainAspectRatio: false,\r\n          responsive: true,\r\n          plugins: { legend: legendaBaixo },\r\n          scales: {\r\n            x: { stacked: true, grid: { display: false } },\r\n            y: { stacked: true, beginAtZero: true, grid: { color: '#EEF1F5' } },\r\n          },\r\n        }}\r\n      />\r\n    </div>\r\n  )\r\n}\r\n\r\n/**\r\n * Horizontal bars of a distribution (top N).\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport function BarrasHorizontais({ dados, altura = 280, limite = 12 }: { dados: Distribuicao; altura?: number; limite?: number }) {\r\n  const labels = dados.labels.slice(0, limite)\r\n  const valores = dados.valores.slice(0, limite)\r\n  return (\r\n    <div style={{ height: altura }}>\r\n      <Bar\r\n        data={{\r\n          labels,\r\n          datasets: [{ label: '', data: valores, backgroundColor: labels.map((_, i) => cor(i)), borderRadius: 3 }],\r\n        }}\r\n        options={{\r\n          indexAxis: 'y',\r\n          maintainAspectRatio: false,\r\n          responsive: true,\r\n          plugins: {\r\n            legend: { display: false },\r\n            datalabels: { display: (c) => c.dataset.data[c.dataIndex] != null, anchor: 'end', align: 'end', color: '#182238', font: { size: 11, weight: 600 } },\r\n          },\r\n          scales: {\r\n            x: { beginAtZero: true, grid: { color: '#EEF1F5' } },\r\n            y: { grid: { display: false } },\r\n          },\r\n          layout: { padding: { right: 28 } },\r\n        }}\r\n      />\r\n    </div>\r\n  )\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport function Anel({ dados, altura = 260, cores }: { dados: Distribuicao; altura?: number; cores?: string[] }) {\r\n  return (\r\n    <div style={{ height: altura }}>\r\n      <Doughnut\r\n        data={{\r\n          labels: dados.labels,\r\n          datasets: [\r\n            {\r\n              data: dados.valores,\r\n              backgroundColor: cores ?? dados.labels.map((_, i) => cor(i)),\r\n              borderWidth: 0,\r\n            },\r\n          ],\r\n        }}\r\n        options={{\r\n          maintainAspectRatio: false,\r\n          responsive: true,\r\n          cutout: '58%',\r\n          plugins: {\r\n            legend: legendaBaixo,\r\n            datalabels: {\r\n              display: (c) => Number(c.dataset.data[c.dataIndex]) > 0,\r\n              color: '#182238',\r\n              font: { size: 11, weight: 600 },\r\n            },\r\n          },\r\n        }}\r\n      />\r\n    </div>\r\n  )\r\n}\r\n\r\n/**\r\n * Simple line chart — optionally formats values as currency.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport function Linha({ dados, altura = 260, euros: emEuros = false }: { dados: Distribuicao; altura?: number; euros?: boolean }) {\r\n  return (\r\n    <div style={{ height: altura }}>\r\n      <Line\r\n        data={{\r\n          labels: dados.labels.map(labelBucket),\r\n          datasets: [\r\n            {\r\n              label: '',\r\n              data: dados.valores,\r\n              borderColor: '#C23B34',\r\n              backgroundColor: 'rgba(194,59,52,0.12)',\r\n              fill: true,\r\n              tension: 0.25,\r\n              pointRadius: 3,\r\n            },\r\n          ],\r\n        }}\r\n        options={{\r\n          maintainAspectRatio: false,\r\n          responsive: true,\r\n          plugins: {\r\n            legend: { display: false },\r\n            tooltip: {\r\n              callbacks: {\r\n                label: (c) => (emEuros ? euros(Number(c.parsed.y)) : String(c.parsed.y)),\r\n              },\r\n            },\r\n          },\r\n          scales: {\r\n            x: { grid: { display: false } },\r\n            y: {\r\n              beginAtZero: true,\r\n              grid: { color: '#EEF1F5' },\r\n              ticks: { callback: (v) => (emEuros ? euros(Number(v)) : String(v)) },\r\n            },\r\n          },\r\n        }}\r\n      />\r\n    </div>\r\n  )\r\n}\r\n\r\n/**\r\n * Several lines over the same labels — NOT stacked.\r\n *\r\n * Separate from `BarrasEmpilhadas` on purpose: two series that measure the same\r\n * thing at two moments (created vs closed) must be read against each other, and\r\n * stacking them would draw their sum, which means nothing.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport function Linhas({\r\n  serie,\r\n  altura = 280,\r\n  area = false,\r\n}: {\r\n  serie: SerieEmpilhada\r\n  altura?: number\r\n  /// Fill under each line. Only legible with one or two series.\r\n  area?: boolean\r\n}) {\r\n  return (\r\n    <div style={{ height: altura }}>\r\n      <Line\r\n        data={{\r\n          labels: serie.labels.map(labelBucket),\r\n          datasets: serie.series.map((s, i) => ({\r\n            label: s.nome,\r\n            data: s.valores,\r\n            borderColor: cor(i),\r\n            backgroundColor: area ? `${cor(i)}22` : cor(i),\r\n            fill: area,\r\n            tension: 0.25,\r\n            pointRadius: serie.labels.length > 24 ? 0 : 3,\r\n            pointHoverRadius: 4,\r\n          })),\r\n        }}\r\n        options={{\r\n          maintainAspectRatio: false,\r\n          responsive: true,\r\n          interaction: { mode: 'index', intersect: false },\r\n          plugins: { legend: legendaBaixo },\r\n          scales: {\r\n            x: { grid: { display: false } },\r\n            y: { beginAtZero: true, grid: { color: '#EEF1F5' } },\r\n          },\r\n        }}\r\n      />\r\n    </div>\r\n  )\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport interface PontoRisco {\r\n  responsavel: string\r\n  otsAtivas: number\r\n  percentagemForaPrazo: number\r\n  valorPenalizado: number\r\n}\r\n\r\n/**\r\n * Risk-map bubbles: x = active OTs, y = % overdue, r = penalized value.\r\n * The radius is normalized against the max so bubbles stay readable at any scale.\r\n *\r\n * Axis titles and the tooltip formatter are exposed as optional props with\r\n * neutral English defaults (previously hardcoded Portuguese) so the component\r\n * carries no locale of its own.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport function Bolhas({\r\n  pontos,\r\n  altura = 280,\r\n  onClick,\r\n  xTitle = 'Active OTs',\r\n  yTitle = '% overdue',\r\n  tooltipLabel = (p) => `${p.responsavel}: ${p.otsAtivas} active, ${p.percentagemForaPrazo}% overdue, ${euros(p.valorPenalizado)}`,\r\n}: {\r\n  pontos: PontoRisco[]\r\n  altura?: number\r\n  onClick?: (p: PontoRisco) => void\r\n  xTitle?: string\r\n  yTitle?: string\r\n  tooltipLabel?: (p: PontoRisco) => string\r\n}) {\r\n  const maxValor = Math.max(1, ...pontos.map((p) => p.valorPenalizado))\r\n  return (\r\n    <div style={{ height: altura }}>\r\n      <Bubble\r\n        data={{\r\n          datasets: pontos.map((p, i) => ({\r\n            label: p.responsavel,\r\n            data: [\r\n              {\r\n                x: p.otsAtivas,\r\n                y: p.percentagemForaPrazo,\r\n                r: 6 + (p.valorPenalizado / maxValor) * 18,\r\n              },\r\n            ],\r\n            backgroundColor: `${cor(i)}CC`,\r\n            borderColor: cor(i),\r\n          })),\r\n        }}\r\n        options={{\r\n          maintainAspectRatio: false,\r\n          responsive: true,\r\n          onClick: (_e, elements) => {\r\n            const idx = elements[0]?.datasetIndex\r\n            if (idx != null && onClick) onClick(pontos[idx]!)\r\n          },\r\n          plugins: {\r\n            legend: { display: false },\r\n            tooltip: {\r\n              callbacks: {\r\n                label: (c) => tooltipLabel(pontos[c.datasetIndex]!),\r\n              },\r\n            },\r\n          },\r\n          scales: {\r\n            x: { beginAtZero: true, title: { display: true, text: xTitle }, grid: { color: '#EEF1F5' } },\r\n            y: { beginAtZero: true, title: { display: true, text: yTitle }, grid: { color: '#EEF1F5' } },\r\n          },\r\n        }}\r\n      />\r\n    </div>\r\n  )\r\n}\r\n"],"names":["ChartJS"],"mappings":"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"}
+{"version":3,"file":"Charts.js","sources":["../../../../../src/legacy/components/charts/Charts.tsx"],"sourcesContent":["import React from 'react'\r\nimport { Chart as ChartJS, registerables, type ActiveElement, type ChartEvent } from 'chart.js'\r\nimport ChartDataLabels from 'chartjs-plugin-datalabels'\r\nimport { Bar, Doughnut, Line, Bubble } from 'react-chartjs-2'\r\nimport { useIsDark } from '../../../v1/capabilities/theme/useIsDark'\r\n\r\n// ---------------------------------------------------------------------------\r\n// Local types (inlined — originally imported from CRE `../types`).\r\n// ---------------------------------------------------------------------------\r\n\r\n/**\r\n * Stacked series over a set of shared labels (e.g. a dimension over time).\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport interface SerieEmpilhada {\r\n  labels: string[]\r\n  series: { nome: string; valores: number[] }[]\r\n}\r\n\r\n/**\r\n * A simple distribution: parallel arrays of labels and values.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport interface Distribuicao {\r\n  labels: string[]\r\n  valores: number[]\r\n}\r\n\r\n/**\r\n * Clique num elemento do gráfico: a etiqueta (ex: \"Incidente\"), a posição dela\r\n * e o nome da série (quando há várias). Serve para filtrar ao clicar.\r\n */\r\nexport type CliqueGrafico = (label: string, indice: number, serie?: string) => void\r\n\r\n// ---------------------------------------------------------------------------\r\n// Local formatting helpers (inlined — originally imported from CRE `../lib/format`).\r\n// Behavior kept close to the originals; the library stays self-contained.\r\n// ---------------------------------------------------------------------------\r\n\r\n/**\r\n * Currency formatter. Thousands separated by '.', decimals by ',', suffixed ' €'.\r\n * Independent of Intl/ICU so the thousands separator is stable across browsers.\r\n */\r\nfunction euros(v: number | null | undefined): string {\r\n  if (v == null) return '—'\r\n  const negativo = v < 0\r\n  const [inteiro, decimal] = Math.abs(v).toFixed(2).split('.')\r\n  const comMilhares = inteiro.replace(/\\B(?=(\\d{3})+(?!\\d))/g, '.')\r\n  return `${negativo ? '-' : ''}${comMilhares},${decimal} €`\r\n}\r\n\r\n/** 'YYYY-Sxx' / 'YYYY-MM' / 'YYYY-MM-DD' → short axis label. */\r\nfunction labelBucket(b: string): string {\r\n  if (/^\\d{4}-S\\d{2}$/.test(b)) return `S${b.slice(6)}/${b.slice(2, 4)}`\r\n  if (/^\\d{4}-\\d{2}$/.test(b)) return `${b.slice(5)}/${b.slice(0, 4)}`\r\n  if (/^\\d{4}-\\d{2}-\\d{2}$/.test(b)) return `${b.slice(8)}/${b.slice(5, 7)}`\r\n  return b\r\n}\r\n\r\n// ---------------------------------------------------------------------------\r\n// Chart.js registration (once, at module load).\r\n// ---------------------------------------------------------------------------\r\n\r\n// Regista TUDO (registerables inclui Filler, controllers, scales) + o plugin de\r\n// datalabels. O registo parcial degenerava a geometria (doughnut colapsado) e o\r\n// aviso \"fill sem Filler\". registerables = equivalente a chart.js/auto.\r\nChartJS.register(...registerables, ChartDataLabels)\r\n// Datalabels off by default — enabled only where it improves readability.\r\nChartJS.defaults.set('plugins.datalabels', { display: false })\r\nChartJS.defaults.font.family = \"'Montserrat', sans-serif\"\r\nChartJS.defaults.color = '#5B6577'\r\n\r\n/**\r\n * Categorical palette. Stable order so the same dimension always maps to the same color.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport const PALETA = [\r\n  '#1868B0',\r\n  '#1F8A55',\r\n  '#B96E00',\r\n  '#C23B34',\r\n  '#7C3AED',\r\n  '#0891B2',\r\n  '#DB2777',\r\n  '#65A30D',\r\n  '#4B5563',\r\n  '#D97706',\r\n  '#2563EB',\r\n  '#059669',\r\n]\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport function cor(i: number): string {\r\n  return PALETA[i % PALETA.length]!\r\n}\r\n\r\n/**\r\n * Cores do texto e da grelha conforme o tema: as do claro sobre o fundo escuro\r\n * deixavam os eixos e os valores ilegíveis.\r\n */\r\nfunction useTema() {\r\n  const escuro = useIsDark()\r\n  return escuro\r\n    ? { texto: '#CBD5E1', forte: '#E2E8F0', grelha: '#1E293B' }\r\n    : { texto: '#5B6577', forte: '#182238', grelha: '#EEF1F5' }\r\n}\r\n\r\nfunction legendaBaixo(tema: ReturnType<typeof useTema>) {\r\n  return {\r\n    position: 'bottom' as const,\r\n    labels: { boxWidth: 10, font: { size: 11 }, color: tema.forte, usePointStyle: true, pointStyle: 'circle' as const },\r\n  }\r\n}\r\n\r\n/** Liga o clique do Chart.js ao `onClick` da biblioteca, com a mão por cima dos elementos. */\r\nfunction clique(labels: string[], series: { nome: string }[] | undefined, onClick?: CliqueGrafico) {\r\n  if (!onClick) return {}\r\n  return {\r\n    onClick: (_e: ChartEvent, els: ActiveElement[]) => {\r\n      const el = els[0]\r\n      if (!el) return\r\n      onClick(labels[el.index]!, el.index, series?.[el.datasetIndex]?.nome)\r\n    },\r\n    onHover: (e: ChartEvent, els: ActiveElement[]) => {\r\n      const alvo = e.native?.target as HTMLElement | undefined\r\n      if (alvo) alvo.style.cursor = els.length ? 'pointer' : 'default'\r\n    },\r\n  }\r\n}\r\n\r\n// ---------------------------------------------------------------------------\r\n// Barras — o componente geral; BarrasEmpilhadas e BarrasHorizontais são atalhos.\r\n// ---------------------------------------------------------------------------\r\n\r\nexport interface BarrasProps {\r\n  labels: string[]\r\n  /** Uma ou várias séries (ex: \"Atribuídos\" e \"Resolvidos\"), lado a lado ou empilhadas. */\r\n  series: { nome: string; valores: number[]; cor?: string }[]\r\n  /** Barras deitadas, com as etiquetas à esquerda (bom para nomes compridos e rankings). */\r\n  horizontal?: boolean\r\n  /** Séries empilhadas em vez de lado a lado. */\r\n  empilhado?: boolean\r\n  /** Altura em px. Nas horizontais, por omissão cresce com o número de barras. */\r\n  altura?: number\r\n  /** Só as primeiras N (ex: top 10). */\r\n  limite?: number\r\n  /** Cor de cada barra, quando há uma só série (ex: a cor de cada estado). */\r\n  cores?: string[]\r\n  /** Formato dos valores no tooltip, nas etiquetas e no eixo (ex: minutos → \"7h30\"). */\r\n  formatar?: (v: number) => string\r\n  /** Mostra o valor na ponta de cada barra. */\r\n  valores?: boolean\r\n  /** Junta a percentagem do total ao valor (ex: \"12 (34%)\"); só com uma série. */\r\n  percentagem?: boolean\r\n  /** Legenda das séries. Por omissão, só quando há mais do que uma. */\r\n  legenda?: boolean\r\n  /** Formato das etiquetas do eixo (ex: datas). Por omissão, datas ISO ficam curtas. */\r\n  formatarEtiqueta?: (label: string) => string\r\n  /** Clique numa barra: devolve a etiqueta, a posição e a série. */\r\n  onClick?: CliqueGrafico\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport function Barras({\r\n  labels: todas,\r\n  series: todasSeries,\r\n  horizontal = false,\r\n  empilhado = false,\r\n  altura,\r\n  limite,\r\n  cores,\r\n  formatar = (v) => String(v),\r\n  valores = true,\r\n  percentagem = false,\r\n  legenda,\r\n  formatarEtiqueta = labelBucket,\r\n  onClick,\r\n}: BarrasProps) {\r\n  const tema = useTema()\r\n  const labels = limite ? todas.slice(0, limite) : todas\r\n  const series = todasSeries.map((s) => ({ ...s, valores: limite ? s.valores.slice(0, limite) : s.valores }))\r\n  const uma = series.length === 1\r\n  // A percentagem é do total, não só das barras mostradas (com `limite` seria das top N).\r\n  const total = uma ? todasSeries[0]!.valores.reduce((a, b) => a + (b || 0), 0) : 0\r\n  const etiqueta = (v: number) => (percentagem && uma && total > 0 ? `${formatar(v)} (${Math.round((v / total) * 100)}%)` : formatar(v))\r\n  const alturaFinal = altura ?? (horizontal ? Math.max(200, labels.length * 30 + 40) : 260)\r\n  const eixoValor = { beginAtZero: true, stacked: empilhado, grid: { color: tema.grelha }, ticks: { color: tema.texto, callback: (v: string | number) => formatar(Number(v)) } }\r\n  const eixoEtiqueta = { stacked: empilhado, grid: { display: false }, ticks: { color: tema.texto } }\r\n\r\n  return (\r\n    <div style={{ height: alturaFinal }}>\r\n      <Bar\r\n        data={{\r\n          labels: labels.map(formatarEtiqueta),\r\n          datasets: series.map((s, i) => ({\r\n            label: s.nome,\r\n            data: s.valores,\r\n            backgroundColor: uma && cores ? labels.map((_, j) => cores[j % cores.length]!) : (s.cor ?? cor(i)),\r\n            borderRadius: 4,\r\n            maxBarThickness: 40,\r\n          })),\r\n        }}\r\n        options={{\r\n          indexAxis: horizontal ? 'y' : 'x',\r\n          maintainAspectRatio: false,\r\n          responsive: true,\r\n          ...clique(labels, series, onClick),\r\n          plugins: {\r\n            legend: legenda ?? !uma ? legendaBaixo(tema) : { display: false },\r\n            tooltip: { callbacks: { label: (c) => `${c.dataset.label ? `${c.dataset.label}: ` : ''}${etiqueta(Number(c.parsed[horizontal ? 'x' : 'y']))}` } },\r\n            datalabels: {\r\n              display: (c) => valores && !empilhado && Number(c.dataset.data[c.dataIndex]) > 0,\r\n              anchor: 'end',\r\n              align: 'end',\r\n              color: tema.forte,\r\n              font: { size: 10, weight: 600 },\r\n              formatter: (v: number) => etiqueta(v),\r\n            },\r\n          },\r\n          scales: horizontal ? { x: eixoValor, y: eixoEtiqueta } : { x: eixoEtiqueta, y: eixoValor },\r\n          layout: { padding: horizontal ? { right: valores ? (percentagem ? 56 : 32) : 8 } : { top: valores ? 18 : 4 } },\r\n        }}\r\n      />\r\n    </div>\r\n  )\r\n}\r\n\r\n/**\r\n * Stacked bars for a dimension over time.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport function BarrasEmpilhadas({ serie, altura = 280, onClick }: { serie: SerieEmpilhada; altura?: number; onClick?: CliqueGrafico }) {\r\n  return <Barras labels={serie.labels} series={serie.series} empilhado altura={altura} onClick={onClick} legenda />\r\n}\r\n\r\n/**\r\n * Horizontal bars of a distribution (top N).\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport function BarrasHorizontais({\r\n  dados,\r\n  altura = 280,\r\n  limite = 12,\r\n  onClick,\r\n}: {\r\n  dados: Distribuicao\r\n  altura?: number\r\n  limite?: number\r\n  onClick?: CliqueGrafico\r\n}) {\r\n  const n = Math.min(limite, dados.labels.length)\r\n  return (\r\n    <Barras\r\n      horizontal\r\n      labels={dados.labels}\r\n      series={[{ nome: '', valores: dados.valores }]}\r\n      cores={Array.from({ length: n }, (_, i) => cor(i))}\r\n      limite={limite}\r\n      altura={altura}\r\n      onClick={onClick}\r\n    />\r\n  )\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport function Anel({\r\n  dados,\r\n  altura = 260,\r\n  cores,\r\n  formatar = (v) => String(v),\r\n  onClick,\r\n}: {\r\n  dados: Distribuicao\r\n  altura?: number\r\n  cores?: string[]\r\n  /** Formato dos valores no tooltip. */\r\n  formatar?: (v: number) => string\r\n  /** Clique numa fatia: devolve a etiqueta e a posição. */\r\n  onClick?: CliqueGrafico\r\n}) {\r\n  const tema = useTema()\r\n  const total = dados.valores.reduce((a, b) => a + (b || 0), 0)\r\n  return (\r\n    <div style={{ height: altura }}>\r\n      <Doughnut\r\n        data={{\r\n          labels: dados.labels,\r\n          datasets: [\r\n            {\r\n              data: dados.valores,\r\n              backgroundColor: cores ?? dados.labels.map((_, i) => cor(i)),\r\n              borderWidth: 0,\r\n            },\r\n          ],\r\n        }}\r\n        options={{\r\n          maintainAspectRatio: false,\r\n          responsive: true,\r\n          cutout: '58%',\r\n          ...clique(dados.labels, undefined, onClick),\r\n          plugins: {\r\n            legend: legendaBaixo(tema),\r\n            tooltip: {\r\n              callbacks: {\r\n                label: (c) => {\r\n                  const v = Number(c.parsed)\r\n                  return ` ${c.label}: ${formatar(v)}${total > 0 ? ` (${Math.round((v / total) * 100)}%)` : ''}`\r\n                },\r\n              },\r\n            },\r\n            datalabels: {\r\n              // Só nas fatias que têm espaço para o número.\r\n              display: (c) => total > 0 && Number(c.dataset.data[c.dataIndex]) / total >= 0.05,\r\n              color: '#FFFFFF',\r\n              font: { size: 11, weight: 700 },\r\n              formatter: (v: number) => formatar(v),\r\n            },\r\n          },\r\n        }}\r\n      />\r\n    </div>\r\n  )\r\n}\r\n\r\n/**\r\n * Simple line chart — optionally formats values as currency.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport function Linha({\r\n  dados,\r\n  altura = 260,\r\n  euros: emEuros = false,\r\n  onClick,\r\n}: {\r\n  dados: Distribuicao\r\n  altura?: number\r\n  euros?: boolean\r\n  onClick?: CliqueGrafico\r\n}) {\r\n  const tema = useTema()\r\n  return (\r\n    <div style={{ height: altura }}>\r\n      <Line\r\n        data={{\r\n          labels: dados.labels.map(labelBucket),\r\n          datasets: [\r\n            {\r\n              label: '',\r\n              data: dados.valores,\r\n              borderColor: '#C23B34',\r\n              backgroundColor: 'rgba(194,59,52,0.12)',\r\n              fill: true,\r\n              tension: 0.25,\r\n              pointRadius: 3,\r\n            },\r\n          ],\r\n        }}\r\n        options={{\r\n          maintainAspectRatio: false,\r\n          responsive: true,\r\n          ...clique(dados.labels, undefined, onClick),\r\n          plugins: {\r\n            legend: { display: false },\r\n            tooltip: {\r\n              callbacks: {\r\n                label: (c) => (emEuros ? euros(Number(c.parsed.y)) : String(c.parsed.y)),\r\n              },\r\n            },\r\n          },\r\n          scales: {\r\n            x: { grid: { display: false }, ticks: { color: tema.texto } },\r\n            y: {\r\n              beginAtZero: true,\r\n              grid: { color: tema.grelha },\r\n              ticks: { color: tema.texto, callback: (v) => (emEuros ? euros(Number(v)) : String(v)) },\r\n            },\r\n          },\r\n        }}\r\n      />\r\n    </div>\r\n  )\r\n}\r\n\r\n/**\r\n * Several lines over the same labels — NOT stacked.\r\n *\r\n * Separate from `BarrasEmpilhadas` on purpose: two series that measure the same\r\n * thing at two moments (created vs closed) must be read against each other, and\r\n * stacking them would draw their sum, which means nothing.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport function Linhas({\r\n  serie,\r\n  altura = 280,\r\n  area = false,\r\n  cores,\r\n  formatar = (v) => String(v),\r\n  formatarEtiqueta = labelBucket,\r\n  onClick,\r\n}: {\r\n  serie: SerieEmpilhada\r\n  altura?: number\r\n  /// Fill under each line. Only legible with one or two series.\r\n  area?: boolean\r\n  /** Cor de cada série, pela ordem. */\r\n  cores?: string[]\r\n  /** Formato dos valores no tooltip e no eixo. */\r\n  formatar?: (v: number) => string\r\n  /** Formato das etiquetas do eixo (ex: datas). */\r\n  formatarEtiqueta?: (label: string) => string\r\n  /** Clique num ponto: devolve a etiqueta (ex: o dia) e a série. */\r\n  onClick?: CliqueGrafico\r\n}) {\r\n  const tema = useTema()\r\n  const corDe = (i: number) => cores?.[i] ?? cor(i)\r\n  return (\r\n    <div style={{ height: altura }}>\r\n      <Line\r\n        data={{\r\n          labels: serie.labels.map(formatarEtiqueta),\r\n          datasets: serie.series.map((s, i) => ({\r\n            label: s.nome,\r\n            data: s.valores,\r\n            borderColor: corDe(i),\r\n            backgroundColor: area ? `${corDe(i)}22` : corDe(i),\r\n            fill: area,\r\n            tension: 0.25,\r\n            pointRadius: serie.labels.length > 24 ? 0 : 3,\r\n            pointHoverRadius: 4,\r\n          })),\r\n        }}\r\n        options={{\r\n          maintainAspectRatio: false,\r\n          responsive: true,\r\n          interaction: { mode: 'index', intersect: false },\r\n          ...clique(serie.labels, serie.series, onClick),\r\n          plugins: {\r\n            legend: legendaBaixo(tema),\r\n            tooltip: { callbacks: { label: (c) => `${c.dataset.label}: ${formatar(Number(c.parsed.y))}` } },\r\n          },\r\n          scales: {\r\n            x: { grid: { display: false }, ticks: { color: tema.texto, autoSkip: true, maxRotation: 0 } },\r\n            y: { beginAtZero: true, grid: { color: tema.grelha }, ticks: { color: tema.texto, callback: (v) => formatar(Number(v)) } },\r\n          },\r\n        }}\r\n      />\r\n    </div>\r\n  )\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport interface PontoRisco {\r\n  responsavel: string\r\n  otsAtivas: number\r\n  percentagemForaPrazo: number\r\n  valorPenalizado: number\r\n}\r\n\r\n/**\r\n * Risk-map bubbles: x = active OTs, y = % overdue, r = penalized value.\r\n * The radius is normalized against the max so bubbles stay readable at any scale.\r\n *\r\n * Axis titles and the tooltip formatter are exposed as optional props with\r\n * neutral English defaults (previously hardcoded Portuguese) so the component\r\n * carries no locale of its own.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport function Bolhas({\r\n  pontos,\r\n  altura = 280,\r\n  onClick,\r\n  xTitle = 'Active OTs',\r\n  yTitle = '% overdue',\r\n  tooltipLabel = (p) => `${p.responsavel}: ${p.otsAtivas} active, ${p.percentagemForaPrazo}% overdue, ${euros(p.valorPenalizado)}`,\r\n}: {\r\n  pontos: PontoRisco[]\r\n  altura?: number\r\n  onClick?: (p: PontoRisco) => void\r\n  xTitle?: string\r\n  yTitle?: string\r\n  tooltipLabel?: (p: PontoRisco) => string\r\n}) {\r\n  const tema = useTema()\r\n  const maxValor = Math.max(1, ...pontos.map((p) => p.valorPenalizado))\r\n  return (\r\n    <div style={{ height: altura }}>\r\n      <Bubble\r\n        data={{\r\n          datasets: pontos.map((p, i) => ({\r\n            label: p.responsavel,\r\n            data: [\r\n              {\r\n                x: p.otsAtivas,\r\n                y: p.percentagemForaPrazo,\r\n                r: 6 + (p.valorPenalizado / maxValor) * 18,\r\n              },\r\n            ],\r\n            backgroundColor: `${cor(i)}CC`,\r\n            borderColor: cor(i),\r\n          })),\r\n        }}\r\n        options={{\r\n          maintainAspectRatio: false,\r\n          responsive: true,\r\n          onClick: (_e, elements) => {\r\n            const idx = elements[0]?.datasetIndex\r\n            if (idx != null && onClick) onClick(pontos[idx]!)\r\n          },\r\n          plugins: {\r\n            legend: { display: false },\r\n            tooltip: {\r\n              callbacks: {\r\n                label: (c) => tooltipLabel(pontos[c.datasetIndex]!),\r\n              },\r\n            },\r\n          },\r\n          scales: {\r\n            x: { beginAtZero: true, title: { display: true, text: xTitle, color: tema.texto }, grid: { color: tema.grelha }, ticks: { color: tema.texto } },\r\n            y: { beginAtZero: true, title: { display: true, text: yTitle, color: tema.texto }, grid: { color: tema.grelha }, ticks: { color: tema.texto } },\r\n          },\r\n        }}\r\n      />\r\n    </div>\r\n  )\r\n}\r\n"],"names":["ChartJS"],"mappings":"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"}

package/dist/esm/legacy/components/layout/Layout/Layout.js

@@ -1,91 +1,30 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useState, useEffect } from "react";
-import Sidebar from "../Sidebar/Sidebar.js";
-const Menu = ({ size = 24, className }) => /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className, children: [
-  /* @__PURE__ */ jsx("line", { x1: "4", x2: "20", y1: "12", y2: "12" }),
-  /* @__PURE__ */ jsx("line", { x1: "4", x2: "20", y1: "6", y2: "6" }),
-  /* @__PURE__ */ jsx("line", { x1: "4", x2: "20", y1: "18", y2: "18" })
-] });
+import { jsx } from "react/jsx-runtime";
+import AppShell from "../../../../v1/components/layout/AppShell/AppShell.js";
+import { labelsV1, menuV1 } from "../Sidebar/Sidebar.js";
 const Layout = ({
   children,
   menus,
-  groupLabels,
-  appTitle,
-  topBar,
-  avatar,
-  onLogout,
-  logoutLabel,
-  languages,
   currentLang,
-  onLanguageChange,
-  theme,
-  onThemeChange,
+  logoutLabel,
   themeLabels,
-  footer,
-  deployedAt,
   deployedAtLabel,
-  sidebarOpen: sidebarOpenProp,
-  onSidebarOpenChange
-}) => {
-  const [sidebarOpen, setSidebarOpenState] = useState(sidebarOpenProp ?? window.innerWidth > 640);
-  const [isMobile, setIsMobile] = useState(window.innerWidth <= 640);
-  const setSidebarOpen = (open) => {
-    setSidebarOpenState(open);
-    onSidebarOpenChange?.(open);
-  };
-  useEffect(() => {
-    const handleResize = () => {
-      setIsMobile(window.innerWidth <= 640);
-      setSidebarOpenState(window.innerWidth > 640);
-    };
-    window.addEventListener("resize", handleResize);
-    return () => window.removeEventListener("resize", handleResize);
-  }, []);
-  const contentMarginLeft = isMobile ? 0 : sidebarOpen ? 256 : 80;
-  return /* @__PURE__ */ jsxs("div", { className: "min-h-screen bg-slate-50/30 dark:bg-slate-950 flex", children: [
-    /* @__PURE__ */ jsx(
-      Sidebar,
-      {
-        isOpen: sidebarOpen,
-        setIsOpen: setSidebarOpen,
-        menus,
-        groupLabels,
-        appTitle,
-        avatar,
-        onLogout,
-        logoutLabel,
-        languages,
-        currentLang,
-        onLanguageChange,
-        theme,
-        onThemeChange,
-        themeLabels,
-        footer,
-        deployedAt,
-        deployedAtLabel
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { className: "flex-1 flex flex-col min-w-0 transition-all duration-300", children: [
-      !sidebarOpen && /* @__PURE__ */ jsx(
-        "button",
-        {
-          onClick: () => setSidebarOpen(true),
-          className: "fixed top-6 left-6 z-50 p-2.5 bg-white shadow-md border border-slate-200 rounded-lg text-slate-500 hover:text-proef-blue dark:bg-slate-900 dark:border-slate-700 dark:text-slate-400 transition-colors sm:hidden",
-          children: /* @__PURE__ */ jsx(Menu, { size: 20 })
-        }
-      ),
-      topBar && /* @__PURE__ */ jsx("div", { style: { marginLeft: contentMarginLeft }, className: "sticky top-0 z-30 transition-all duration-300", children: topBar }),
-      /* @__PURE__ */ jsx(
-        "main",
-        {
-          style: { marginLeft: contentMarginLeft },
-          className: `pb-16 px-4 sm:px-12 transition-all duration-300 ${topBar ? "pt-6 sm:pt-6" : "pt-24 sm:pt-8"}`,
-          children: /* @__PURE__ */ jsx("div", { className: "mx-auto animate-in fade-in slide-in-from-bottom-2 duration-700", children })
-        }
-      )
-    ] })
-  ] });
-};
+  footer,
+  sidebarOpen,
+  onSidebarOpenChange,
+  ...rest
+}) => /* @__PURE__ */ jsx(
+  AppShell,
+  {
+    ...rest,
+    menu: menuV1(menus),
+    currentLanguage: currentLang,
+    labels: labelsV1({ logoutLabel, themeLabels, deployedAtLabel }),
+    sidebarFooter: footer,
+    defaultOpen: sidebarOpen,
+    onOpenChange: onSidebarOpenChange,
+    children
+  }
+);
 export {
   Layout as default
 };

package/dist/esm/legacy/components/layout/Layout/Layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"Layout.js","sources":["../../../../../../src/legacy/components/layout/Layout/Layout.tsx"],"sourcesContent":["import React, { useState, useEffect } from 'react'\r\nimport Sidebar, { SidebarMenuItem, SidebarLanguage, SidebarTheme } from '../Sidebar/Sidebar'\r\n\r\n// ── Inline icon (no lucide-react dependency in common-ui) ─────────────────\r\ntype IconProps = { size?: number; className?: string }\r\n\r\nconst Menu = ({ size = 24, className }: IconProps) => (\r\n    <svg xmlns=\"http://www.w3.org/2000/svg\" width={size} height={size} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" className={className}>\r\n        <line x1=\"4\" x2=\"20\" y1=\"12\" y2=\"12\" />\r\n        <line x1=\"4\" x2=\"20\" y1=\"6\" y2=\"6\" />\r\n        <line x1=\"4\" x2=\"20\" y1=\"18\" y2=\"18\" />\r\n    </svg>\r\n)\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport interface LayoutProps {\r\n    children: React.ReactNode\r\n    menus: SidebarMenuItem[]\r\n    groupLabels?: Record<string, string>\r\n    appTitle?: string\r\n    /** Barra superior opcional (título/alertas). Fica sticky acima do conteúdo,\r\n     * alinhada à direita da sidebar. Traz o seu próprio fundo/padding. */\r\n    topBar?: React.ReactNode\r\n    avatar?: React.ReactNode\r\n    onLogout?: () => void\r\n    logoutLabel?: string\r\n    languages?: SidebarLanguage[]\r\n    currentLang?: string\r\n    onLanguageChange?: (code: string) => void\r\n    theme?: SidebarTheme\r\n    onThemeChange?: (theme: SidebarTheme) => void\r\n    themeLabels?: { label?: string; light?: string; dark?: string; system?: string }\r\n    /** Slot extra no rodapé da sidebar (ex: filtro global). Ver Sidebar.footer. */\r\n    footer?: (isExpanded: boolean) => React.ReactNode\r\n    /** Quando este build foi feito, por baixo do logout. Ver Sidebar.deployedAt. */\r\n    deployedAt?: string | number | Date\r\n    deployedAtLabel?: string\r\n    /**\r\n     * Estado inicial da sidebar (aberta/fechada). Sem isto mantém-se o comportamento de\r\n     * sempre: aberta no desktop, fechada em mobile. Passar isto serve para a app repor o\r\n     * que a pessoa tinha antes de recarregar a página (ex.: lido do seu próprio\r\n     * localStorage) — o Layout não persiste nada sozinho, tal como já acontece com `theme`.\r\n     */\r\n    sidebarOpen?: boolean\r\n    /**\r\n     * Chamado sempre que a sidebar abre/fecha por uma ação da pessoa (o atalho da própria\r\n     * Sidebar, ou o botão de expandir em mobile) — nunca pelo ajuste automático ao\r\n     * redimensionar a janela, que não é uma escolha dela. Mesmo padrão de\r\n     * `onThemeChange`: o Layout só avisa, quem usa decide se e como guardar.\r\n     */\r\n    onSidebarOpenChange?: (open: boolean) => void\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nconst Layout = ({\r\n    children,\r\n    menus,\r\n    groupLabels,\r\n    appTitle,\r\n    topBar,\r\n    avatar,\r\n    onLogout,\r\n    logoutLabel,\r\n    languages,\r\n    currentLang,\r\n    onLanguageChange,\r\n    theme,\r\n    onThemeChange,\r\n    themeLabels,\r\n    footer,\r\n    deployedAt,\r\n    deployedAtLabel,\r\n    sidebarOpen: sidebarOpenProp,\r\n    onSidebarOpenChange,\r\n}: LayoutProps) => {\r\n    // Expandida por defeito no desktop; colapsa em mobile (< 640) — a não ser que a app\r\n    // passe `sidebarOpen` (ex.: o que tinha guardado antes de recarregar a página).\r\n    const [sidebarOpen, setSidebarOpenState] = useState(sidebarOpenProp ?? window.innerWidth > 640)\r\n    const [isMobile, setIsMobile] = useState(window.innerWidth <= 640)\r\n\r\n    // Toggle deliberado (Sidebar passa isto como o seu `setIsOpen`, e o botão de expandir\r\n    // em mobile também) — avisa a app para poder persistir a escolha.\r\n    const setSidebarOpen = (open: boolean) => {\r\n        setSidebarOpenState(open)\r\n        onSidebarOpenChange?.(open)\r\n    }\r\n\r\n    useEffect(() => {\r\n        const handleResize = () => {\r\n            setIsMobile(window.innerWidth <= 640)\r\n            // Direto ao estado, não ao wrapper: isto é o viewport a mudar, não a pessoa a\r\n            // escolher — não faz sentido a app gravar isto como preferência.\r\n            setSidebarOpenState(window.innerWidth > 640)\r\n        }\r\n        window.addEventListener('resize', handleResize)\r\n        return () => window.removeEventListener('resize', handleResize)\r\n    }, [])\r\n\r\n    // Margem do conteúdo = largura da sidebar fixa (px, inline). NÃO usar classes\r\n    // sm:ml-* aqui: o Tailwind do consumidor scaneia o bundle minificado do\r\n    // common-ui e nem sempre gera as responsive utilities → conteúdo ficava\r\n    // por baixo do rail. Inline style é imune a isso.\r\n    // Mobile (< 640): sidebar esconde (translate) → sem margem.\r\n    const contentMarginLeft = isMobile ? 0 : sidebarOpen ? 256 : 80\r\n\r\n    return (\r\n        <div className=\"min-h-screen bg-slate-50/30 dark:bg-slate-950 flex\">\r\n            <Sidebar\r\n                isOpen={sidebarOpen}\r\n                setIsOpen={setSidebarOpen}\r\n                menus={menus}\r\n                groupLabels={groupLabels}\r\n                appTitle={appTitle}\r\n                avatar={avatar}\r\n                onLogout={onLogout}\r\n                logoutLabel={logoutLabel}\r\n                languages={languages}\r\n                currentLang={currentLang}\r\n                onLanguageChange={onLanguageChange}\r\n                theme={theme}\r\n                onThemeChange={onThemeChange}\r\n                themeLabels={themeLabels}\r\n                footer={footer}\r\n                deployedAt={deployedAt}\r\n                deployedAtLabel={deployedAtLabel}\r\n            />\r\n            <div className=\"flex-1 flex flex-col min-w-0 transition-all duration-300\">\r\n                {!sidebarOpen && (\r\n                    <button\r\n                        onClick={() => setSidebarOpen(true)}\r\n                        className=\"fixed top-6 left-6 z-50 p-2.5 bg-white shadow-md border border-slate-200 rounded-lg text-slate-500 hover:text-proef-blue dark:bg-slate-900 dark:border-slate-700 dark:text-slate-400 transition-colors sm:hidden\"\r\n                    >\r\n                        <Menu size={20} />\r\n                    </button>\r\n                )}\r\n                {topBar && (\r\n                    <div style={{ marginLeft: contentMarginLeft }} className=\"sticky top-0 z-30 transition-all duration-300\">\r\n                        {topBar}\r\n                    </div>\r\n                )}\r\n                <main\r\n                    style={{ marginLeft: contentMarginLeft }}\r\n                    className={`pb-16 px-4 sm:px-12 transition-all duration-300 ${topBar ? 'pt-6 sm:pt-6' : 'pt-24 sm:pt-8'}`}\r\n                >\r\n                    <div className=\"mx-auto animate-in fade-in slide-in-from-bottom-2 duration-700\">\r\n                        {children}\r\n                    </div>\r\n                </main>\r\n            </div>\r\n        </div>\r\n    )\r\n}\r\n\r\nexport default Layout\r\n"],"names":[],"mappings":";;;AAMA,MAAM,OAAO,CAAC,EAAE,OAAO,IAAI,UAAA,MACvB,qBAAC,OAAA,EAAI,OAAM,8BAA6B,OAAO,MAAM,QAAQ,MAAM,SAAQ,aAAY,MAAK,QAAO,QAAO,gBAAe,aAAY,KAAI,eAAc,SAAQ,gBAAe,SAAQ,WAClL,UAAA;AAAA,EAAA,oBAAC,QAAA,EAAK,IAAG,KAAI,IAAG,MAAK,IAAG,MAAK,IAAG,KAAA,CAAK;AAAA,EACrC,oBAAC,UAAK,IAAG,KAAI,IAAG,MAAK,IAAG,KAAI,IAAG,IAAA,CAAI;AAAA,EACnC,oBAAC,UAAK,IAAG,KAAI,IAAG,MAAK,IAAG,MAAK,IAAG,KAAA,CAAK;AAAA,GACzC;AA2CJ,MAAM,SAAS,CAAC;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AACJ,MAAmB;AAGf,QAAM,CAAC,aAAa,mBAAmB,IAAI,SAAS,mBAAmB,OAAO,aAAa,GAAG;AAC9F,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,OAAO,cAAc,GAAG;AAIjE,QAAM,iBAAiB,CAAC,SAAkB;AACtC,wBAAoB,IAAI;AACxB,0BAAsB,IAAI;AAAA,EAC9B;AAEA,YAAU,MAAM;AACZ,UAAM,eAAe,MAAM;AACvB,kBAAY,OAAO,cAAc,GAAG;AAGpC,0BAAoB,OAAO,aAAa,GAAG;AAAA,IAC/C;AACA,WAAO,iBAAiB,UAAU,YAAY;AAC9C,WAAO,MAAM,OAAO,oBAAoB,UAAU,YAAY;AAAA,EAClE,GAAG,CAAA,CAAE;AAOL,QAAM,oBAAoB,WAAW,IAAI,cAAc,MAAM;AAE7D,SACI,qBAAC,OAAA,EAAI,WAAU,sDACX,UAAA;AAAA,IAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,QAAQ;AAAA,QACR,WAAW;AAAA,QACX;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IAAA;AAAA,IAEJ,qBAAC,OAAA,EAAI,WAAU,4DACV,UAAA;AAAA,MAAA,CAAC,eACE;AAAA,QAAC;AAAA,QAAA;AAAA,UACG,SAAS,MAAM,eAAe,IAAI;AAAA,UAClC,WAAU;AAAA,UAEV,UAAA,oBAAC,MAAA,EAAK,MAAM,GAAA,CAAI;AAAA,QAAA;AAAA,MAAA;AAAA,MAGvB,UACG,oBAAC,OAAA,EAAI,OAAO,EAAE,YAAY,kBAAA,GAAqB,WAAU,iDACpD,UAAA,OAAA,CACL;AAAA,MAEJ;AAAA,QAAC;AAAA,QAAA;AAAA,UACG,OAAO,EAAE,YAAY,kBAAA;AAAA,UACrB,WAAW,mDAAmD,SAAS,iBAAiB,eAAe;AAAA,UAEvG,UAAA,oBAAC,OAAA,EAAI,WAAU,kEACV,SAAA,CACL;AAAA,QAAA;AAAA,MAAA;AAAA,IACJ,EAAA,CACJ;AAAA,EAAA,GACJ;AAER;"}
+{"version":3,"file":"Layout.js","sources":["../../../../../../src/legacy/components/layout/Layout/Layout.tsx"],"sourcesContent":["import React from 'react'\r\nimport AppShell from '../../../../v1/components/layout/AppShell/AppShell'\r\nimport { labelsV1, menuV1, type SidebarMenuItem, type SidebarLanguage, type SidebarTheme } from '../Sidebar/Sidebar'\r\n\r\n/*\r\n * Migrado para o V1: a moldura da app é o `AppShell` do V1. Este ficheiro só\r\n * mantém a API antiga, e os seus textos por omissão, para as apps que ainda a\r\n * usam.\r\n */\r\n\r\n/** @deprecated Legacy — usar `AppShellProps` do V1. */\r\nexport interface LayoutProps {\r\n  children: React.ReactNode\r\n  menus: SidebarMenuItem[]\r\n  groupLabels?: Record<string, string>\r\n  appTitle?: string\r\n  /** Barra superior opcional (título/alertas), sticky acima do conteúdo. */\r\n  topBar?: React.ReactNode\r\n  avatar?: React.ReactNode\r\n  onLogout?: () => void\r\n  logoutLabel?: string\r\n  languages?: SidebarLanguage[]\r\n  currentLang?: string\r\n  onLanguageChange?: (code: string) => void\r\n  theme?: SidebarTheme\r\n  onThemeChange?: (theme: SidebarTheme) => void\r\n  themeLabels?: { label?: string; light?: string; dark?: string; system?: string }\r\n  footer?: (isExpanded: boolean) => React.ReactNode\r\n  deployedAt?: string | number | Date\r\n  deployedAtLabel?: string\r\n  /** Estado inicial da sidebar (aberta/fechada). */\r\n  sidebarOpen?: boolean\r\n  /** Chamado quando a pessoa abre/fecha a sidebar. */\r\n  onSidebarOpenChange?: (open: boolean) => void\r\n}\r\n\r\n/** @deprecated Legacy — usar `AppShell` do V1. */\r\nconst Layout = ({\r\n  children,\r\n  menus,\r\n  currentLang,\r\n  logoutLabel,\r\n  themeLabels,\r\n  deployedAtLabel,\r\n  footer,\r\n  sidebarOpen,\r\n  onSidebarOpenChange,\r\n  ...rest\r\n}: LayoutProps) => (\r\n  <AppShell\r\n    {...rest}\r\n    menu={menuV1(menus)}\r\n    currentLanguage={currentLang}\r\n    labels={labelsV1({ logoutLabel, themeLabels, deployedAtLabel })}\r\n    sidebarFooter={footer}\r\n    defaultOpen={sidebarOpen}\r\n    onOpenChange={onSidebarOpenChange}\r\n  >\r\n    {children}\r\n  </AppShell>\r\n)\r\n\r\nexport default Layout\r\n"],"names":[],"mappings":";;;AAqCA,MAAM,SAAS,CAAC;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACE;AAAA,EAAC;AAAA,EAAA;AAAA,IACE,GAAG;AAAA,IACJ,MAAM,OAAO,KAAK;AAAA,IAClB,iBAAiB;AAAA,IACjB,QAAQ,SAAS,EAAE,aAAa,aAAa,iBAAiB;AAAA,IAC9D,eAAe;AAAA,IACf,aAAa;AAAA,IACb,cAAc;AAAA,IAEb;AAAA,EAAA;AACH;"}