@nextelco/common-ui 2.1.97 → 2.1.99

package/dist/esm/legacy/components/organisms/PainelFiltros/PainelFiltros.js

@@ -0,0 +1,206 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useMemo } from "react";
+const LABELS = {
+  titulo: "Filtros",
+  limpar: "Limpar",
+  pesquisar: "Filtrar opções…",
+  semOpcoes: "Sem opções",
+  ocultar: "Ocultar filtros",
+  mostrar: "Mostrar filtros",
+  verTodas: "Ver todas ({n})",
+  verMenos: "Ver menos"
+};
+const VISIVEIS = 8;
+function PainelFiltros({
+  seccoes,
+  valores,
+  onChange,
+  onLimpar,
+  labels,
+  className
+}) {
+  const txt = { ...LABELS, ...labels };
+  const [fechado, setFechado] = useState(false);
+  const [abertas, setAbertas] = useState(
+    () => Object.fromEntries(seccoes.map((s) => [s.chave, s.aberta ?? true]))
+  );
+  const activos = useMemo(
+    () => Object.values(valores).reduce((n, v) => n + (v?.length ?? 0), 0),
+    [valores]
+  );
+  if (fechado) {
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: () => setFechado(false),
+        title: txt.mostrar,
+        className: "h-full px-2 border-r border-slate-200 bg-white text-slate-500 hover:text-proef-navy dark:bg-slate-900 dark:border-slate-700 dark:text-slate-400 dark:hover:text-white",
+        children: /* @__PURE__ */ jsxs("span", { className: "[writing-mode:vertical-rl] text-xs font-semibold tracking-wide", children: [
+          txt.titulo,
+          activos ? ` · ${activos}` : ""
+        ] })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs("div", { className: `bg-white border-r border-slate-200 dark:bg-slate-900 dark:border-slate-700 flex flex-col ${className ?? ""}`, children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-3 py-2 border-b border-slate-200 dark:border-slate-700", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-sm font-black uppercase tracking-tight text-proef-navy dark:text-slate-100", children: txt.titulo }),
+      !!activos && /* @__PURE__ */ jsx("span", { className: "text-[10px] font-bold bg-proef-navy text-white rounded-full px-1.5 py-0.5", children: activos }),
+      /* @__PURE__ */ jsxs("div", { className: "ml-auto flex items-center gap-1", children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: onLimpar,
+            disabled: !activos,
+            className: "text-xs text-slate-500 hover:text-proef-navy dark:text-slate-400 dark:hover:text-white disabled:opacity-40",
+            children: txt.limpar
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: () => setFechado(true),
+            title: txt.ocultar,
+            className: "text-slate-400 hover:text-proef-navy dark:hover:text-white px-1",
+            children: "‹"
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "overflow-auto flex-1 divide-y divide-slate-100", children: seccoes.map((seccao) => {
+      const nesta = seccao.campos.reduce((n, c) => n + (valores[c.chave]?.length ?? 0), 0);
+      const aberta = abertas[seccao.chave] ?? true;
+      return /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: () => setAbertas((a) => ({ ...a, [seccao.chave]: !aberta })),
+            className: "w-full flex items-center gap-2 px-3 py-2 text-left text-xs font-bold uppercase tracking-wide text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-800",
+            children: [
+              /* @__PURE__ */ jsx("span", { className: "text-slate-400 w-3", children: aberta ? "−" : "+" }),
+              seccao.titulo,
+              !!nesta && /* @__PURE__ */ jsx("span", { className: "text-[10px] font-bold bg-proef-navy text-white rounded-full px-1.5", children: nesta })
+            ]
+          }
+        ),
+        aberta && /* @__PURE__ */ jsx("div", { className: "px-3 pb-3 space-y-3", children: seccao.campos.map((campo) => /* @__PURE__ */ jsx(
+          Campo,
+          {
+            campo,
+            escolhidos: valores[campo.chave] ?? [],
+            onChange: (v) => onChange(campo.chave, v),
+            txt
+          },
+          campo.chave
+        )) })
+      ] }, seccao.chave);
+    }) })
+  ] });
+}
+function Campo({
+  campo,
+  escolhidos,
+  onChange,
+  txt
+}) {
+  const [pesquisa, setPesquisa] = useState("");
+  const [todas, setTodas] = useState(false);
+  if (campo.tipo === "livre") {
+    return /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("div", { className: "text-[11px] font-semibold text-slate-500 dark:text-slate-400 mb-1", children: campo.rotulo }),
+      campo.conteudo
+    ] });
+  }
+  const opcoes = campo.opcoes ?? [];
+  const limiar = campo.pesquisarACimaDe ?? 12;
+  const filtradas = pesquisa ? opcoes.filter((o) => semAcentos(o.rotulo).includes(semAcentos(pesquisa))) : opcoes;
+  const visiveis = todas ? filtradas : [
+    ...filtradas.slice(0, VISIVEIS),
+    ...filtradas.slice(VISIVEIS).filter((o) => escolhidos.includes(o.valor))
+  ];
+  const alternar = (valor) => {
+    if (campo.unico) {
+      onChange(escolhidos[0] === valor ? [] : [valor]);
+      return;
+    }
+    onChange(
+      escolhidos.includes(valor) ? escolhidos.filter((v) => v !== valor) : [...escolhidos, valor]
+    );
+  };
+  if (campo.tipo === "atalhos") {
+    return /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx("div", { className: "text-[11px] font-semibold text-slate-500 dark:text-slate-400 mb-1", children: campo.rotulo }),
+      /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 gap-1", children: opcoes.map((o) => {
+        const activo = escolhidos.includes(o.valor);
+        return /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: () => alternar(o.valor),
+            className: `flex items-center justify-between gap-1 px-2 py-1 rounded border text-[11px] ${activo ? "border-proef-navy bg-sky-50 text-proef-navy font-semibold dark:border-sky-400 dark:bg-sky-500/15 dark:text-sky-300" : "border-slate-200 text-slate-600 hover:bg-slate-50 dark:border-slate-700 dark:text-slate-300 dark:hover:bg-slate-800"}`,
+            children: [
+              /* @__PURE__ */ jsx("span", { className: "truncate", children: o.rotulo }),
+              o.total != null && /* @__PURE__ */ jsx("b", { className: "tabular-nums", children: o.total.toLocaleString("pt-PT") })
+            ]
+          },
+          o.valor
+        );
+      }) })
+    ] });
+  }
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsx("div", { className: "text-[11px] font-semibold text-slate-500 dark:text-slate-400 mb-1", children: campo.rotulo }),
+    opcoes.length > limiar && /* @__PURE__ */ jsx(
+      "input",
+      {
+        type: "search",
+        value: pesquisa,
+        onChange: (e) => setPesquisa(e.target.value),
+        placeholder: txt.pesquisar,
+        className: "w-full mb-1 border border-slate-300 rounded px-2 py-1 text-xs bg-white dark:bg-slate-800 dark:border-slate-600 dark:text-slate-100"
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "space-y-0.5", children: [
+      !visiveis.length && /* @__PURE__ */ jsx("div", { className: "text-xs text-slate-400", children: txt.semOpcoes }),
+      visiveis.map((o) => {
+        const activo = escolhidos.includes(o.valor);
+        return /* @__PURE__ */ jsxs(
+          "label",
+          {
+            className: `flex items-center gap-2 text-xs cursor-pointer px-1 py-0.5 rounded hover:bg-slate-50 dark:hover:bg-slate-800 ${o.total === 0 ? "opacity-45" : ""}`,
+            children: [
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  type: campo.unico ? "radio" : "checkbox",
+                  checked: activo,
+                  onClick: () => alternar(o.valor),
+                  onChange: () => {
+                  },
+                  className: "accent-proef-navy"
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { className: "flex-1 truncate", title: o.rotulo, children: o.rotulo }),
+              o.total != null && /* @__PURE__ */ jsx("span", { className: "tabular-nums text-slate-400", children: o.total.toLocaleString("pt-PT") })
+            ]
+          },
+          o.valor
+        );
+      })
+    ] }),
+    filtradas.length > VISIVEIS && /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: () => setTodas((v) => !v),
+        className: "mt-1 text-[11px] text-proef-navy dark:text-sky-300 hover:underline",
+        children: todas ? txt.verMenos : txt.verTodas.replace("{n}", String(filtradas.length))
+      }
+    )
+  ] });
+}
+function semAcentos(texto) {
+  return texto.normalize("NFD").replace(/[̀-ͯ]/g, "").toLowerCase();
+}
+export {
+  PainelFiltros as default
+};
+//# sourceMappingURL=PainelFiltros.js.map

package/dist/esm/legacy/components/organisms/PainelFiltros/PainelFiltros.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PainelFiltros.js","sources":["../../../../../../src/legacy/components/organisms/PainelFiltros/PainelFiltros.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react'\r\n\r\n/**\r\n * Painel lateral de filtros facetados.\r\n *\r\n * O que o torna útil é a CONTAGEM ao lado de cada opção: diz quantos registos\r\n * ficariam se a opção fosse escolhida, com os restantes filtros mantidos. Quem\r\n * monta o painel é que calcula essas contagens — o componente não sabe o que\r\n * está a contar, e tem de ser assim: a conta certa exige tirar a própria\r\n * dimensão do filtro, e isso só o servidor sabe fazer.\r\n *\r\n * Genérico de propósito: recebe secções e opções, devolve escolhas.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\n\r\nexport interface OpcaoFiltro {\r\n  valor: string\r\n  rotulo: string\r\n  /** Quantos registos esta opção daria. `undefined` não desenha contagem. */\r\n  total?: number\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport type TipoCampoFiltro = 'opcoes' | 'atalhos' | 'livre'\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport interface CampoFiltro {\r\n  /** Identifica o campo nos valores devolvidos. */\r\n  chave: string\r\n  rotulo: string\r\n  tipo?: TipoCampoFiltro\r\n  opcoes?: OpcaoFiltro[]\r\n  /**\r\n   * Escolha única. Por omissão o campo é múltiplo — é o que a maioria das\r\n   * dimensões quer, e forçar única obrigaria a limpar antes de trocar.\r\n   */\r\n  unico?: boolean\r\n  /** A partir de quantas opções aparece a caixa de pesquisa. */\r\n  pesquisarACimaDe?: number\r\n  /** Conteúdo próprio (datas, interruptores…), quando `tipo` é `livre`. */\r\n  conteudo?: React.ReactNode\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport interface SeccaoFiltros {\r\n  chave: string\r\n  titulo: string\r\n  campos: CampoFiltro[]\r\n  /** Aberta na primeira vez. Depois manda o que o utilizador fizer. */\r\n  aberta?: boolean\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport interface PainelFiltrosLabels {\r\n  titulo: string\r\n  limpar: string\r\n  pesquisar: string\r\n  semOpcoes: string\r\n  ocultar: string\r\n  mostrar: string\r\n  verTodas: string\r\n  verMenos: string\r\n}\r\n\r\nconst LABELS: PainelFiltrosLabels = {\r\n  titulo: 'Filtros',\r\n  limpar: 'Limpar',\r\n  pesquisar: 'Filtrar opções…',\r\n  semOpcoes: 'Sem opções',\r\n  ocultar: 'Ocultar filtros',\r\n  mostrar: 'Mostrar filtros',\r\n  verTodas: 'Ver todas ({n})',\r\n  verMenos: 'Ver menos',\r\n}\r\n\r\n/** Quantas opções se mostram antes do \"ver todas\". */\r\nconst VISIVEIS = 8\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport interface PainelFiltrosProps {\r\n  seccoes: SeccaoFiltros[]\r\n  /** Valores actuais: chave do campo → valores escolhidos. */\r\n  valores: Record<string, string[]>\r\n  onChange: (chave: string, valores: string[]) => void\r\n  onLimpar?: () => void\r\n  labels?: Partial<PainelFiltrosLabels>\r\n  className?: string\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport default function PainelFiltros({\r\n  seccoes,\r\n  valores,\r\n  onChange,\r\n  onLimpar,\r\n  labels,\r\n  className,\r\n}: PainelFiltrosProps) {\r\n  const txt = { ...LABELS, ...labels }\r\n  const [fechado, setFechado] = useState(false)\r\n  const [abertas, setAbertas] = useState<Record<string, boolean>>(() =>\r\n    Object.fromEntries(seccoes.map((s) => [s.chave, s.aberta ?? true]))\r\n  )\r\n\r\n  const activos = useMemo(\r\n    () => Object.values(valores).reduce((n, v) => n + (v?.length ?? 0), 0),\r\n    [valores]\r\n  )\r\n\r\n  if (fechado) {\r\n    return (\r\n      <button\r\n        onClick={() => setFechado(false)}\r\n        title={txt.mostrar}\r\n        className=\"h-full px-2 border-r border-slate-200 bg-white text-slate-500 hover:text-proef-navy dark:bg-slate-900 dark:border-slate-700 dark:text-slate-400 dark:hover:text-white\"\r\n      >\r\n        <span className=\"[writing-mode:vertical-rl] text-xs font-semibold tracking-wide\">\r\n          {txt.titulo}\r\n          {activos ? ` · ${activos}` : ''}\r\n        </span>\r\n      </button>\r\n    )\r\n  }\r\n\r\n  return (\r\n    <div className={`bg-white border-r border-slate-200 dark:bg-slate-900 dark:border-slate-700 flex flex-col ${className ?? ''}`}>\r\n      <div className=\"flex items-center gap-2 px-3 py-2 border-b border-slate-200 dark:border-slate-700\">\r\n        <h2 className=\"text-sm font-black uppercase tracking-tight text-proef-navy dark:text-slate-100\">{txt.titulo}</h2>\r\n        {!!activos && (\r\n          <span className=\"text-[10px] font-bold bg-proef-navy text-white rounded-full px-1.5 py-0.5\">\r\n            {activos}\r\n          </span>\r\n        )}\r\n        <div className=\"ml-auto flex items-center gap-1\">\r\n          <button\r\n            onClick={onLimpar}\r\n            disabled={!activos}\r\n            className=\"text-xs text-slate-500 hover:text-proef-navy dark:text-slate-400 dark:hover:text-white disabled:opacity-40\"\r\n          >\r\n            {txt.limpar}\r\n          </button>\r\n          <button\r\n            onClick={() => setFechado(true)}\r\n            title={txt.ocultar}\r\n            className=\"text-slate-400 hover:text-proef-navy dark:hover:text-white px-1\"\r\n          >\r\n            ‹\r\n          </button>\r\n        </div>\r\n      </div>\r\n\r\n      <div className=\"overflow-auto flex-1 divide-y divide-slate-100\">\r\n        {seccoes.map((seccao) => {\r\n          const nesta = seccao.campos.reduce((n, c) => n + (valores[c.chave]?.length ?? 0), 0)\r\n          const aberta = abertas[seccao.chave] ?? true\r\n          return (\r\n            <div key={seccao.chave}>\r\n              <button\r\n                onClick={() => setAbertas((a) => ({ ...a, [seccao.chave]: !aberta }))}\r\n                className=\"w-full flex items-center gap-2 px-3 py-2 text-left text-xs font-bold uppercase tracking-wide text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-800\"\r\n              >\r\n                <span className=\"text-slate-400 w-3\">{aberta ? '−' : '+'}</span>\r\n                {seccao.titulo}\r\n                {!!nesta && (\r\n                  <span className=\"text-[10px] font-bold bg-proef-navy text-white rounded-full px-1.5\">\r\n                    {nesta}\r\n                  </span>\r\n                )}\r\n              </button>\r\n              {aberta && (\r\n                <div className=\"px-3 pb-3 space-y-3\">\r\n                  {seccao.campos.map((campo) => (\r\n                    <Campo\r\n                      key={campo.chave}\r\n                      campo={campo}\r\n                      escolhidos={valores[campo.chave] ?? []}\r\n                      onChange={(v) => onChange(campo.chave, v)}\r\n                      txt={txt}\r\n                    />\r\n                  ))}\r\n                </div>\r\n              )}\r\n            </div>\r\n          )\r\n        })}\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nfunction Campo({\r\n  campo,\r\n  escolhidos,\r\n  onChange,\r\n  txt,\r\n}: {\r\n  campo: CampoFiltro\r\n  escolhidos: string[]\r\n  onChange: (valores: string[]) => void\r\n  txt: PainelFiltrosLabels\r\n}) {\r\n  const [pesquisa, setPesquisa] = useState('')\r\n  const [todas, setTodas] = useState(false)\r\n\r\n  if (campo.tipo === 'livre') {\r\n    return (\r\n      <div>\r\n        <div className=\"text-[11px] font-semibold text-slate-500 dark:text-slate-400 mb-1\">{campo.rotulo}</div>\r\n        {campo.conteudo}\r\n      </div>\r\n    )\r\n  }\r\n\r\n  const opcoes = campo.opcoes ?? []\r\n  const limiar = campo.pesquisarACimaDe ?? 12\r\n  const filtradas = pesquisa\r\n    ? opcoes.filter((o) => semAcentos(o.rotulo).includes(semAcentos(pesquisa)))\r\n    : opcoes\r\n  // As escolhidas ficam sempre visíveis, mesmo quando a lista está cortada:\r\n  // esconder um filtro activo é a maneira mais rápida de alguém não perceber\r\n  // porque é que a lista está pequena.\r\n  const visiveis = todas\r\n    ? filtradas\r\n    : [\r\n        ...filtradas.slice(0, VISIVEIS),\r\n        ...filtradas.slice(VISIVEIS).filter((o) => escolhidos.includes(o.valor)),\r\n      ]\r\n\r\n  const alternar = (valor: string): void => {\r\n    if (campo.unico) {\r\n      onChange(escolhidos[0] === valor ? [] : [valor])\r\n      return\r\n    }\r\n    onChange(\r\n      escolhidos.includes(valor) ? escolhidos.filter((v) => v !== valor) : [...escolhidos, valor]\r\n    )\r\n  }\r\n\r\n  if (campo.tipo === 'atalhos') {\r\n    return (\r\n      <div>\r\n        <div className=\"text-[11px] font-semibold text-slate-500 dark:text-slate-400 mb-1\">{campo.rotulo}</div>\r\n        <div className=\"grid grid-cols-2 gap-1\">\r\n          {opcoes.map((o) => {\r\n            const activo = escolhidos.includes(o.valor)\r\n            return (\r\n              <button\r\n                key={o.valor}\r\n                onClick={() => alternar(o.valor)}\r\n                className={`flex items-center justify-between gap-1 px-2 py-1 rounded border text-[11px] ${\r\n                  activo\r\n                    ? 'border-proef-navy bg-sky-50 text-proef-navy font-semibold dark:border-sky-400 dark:bg-sky-500/15 dark:text-sky-300'\r\n                    : 'border-slate-200 text-slate-600 hover:bg-slate-50 dark:border-slate-700 dark:text-slate-300 dark:hover:bg-slate-800'\r\n                }`}\r\n              >\r\n                <span className=\"truncate\">{o.rotulo}</span>\r\n                {o.total != null && <b className=\"tabular-nums\">{o.total.toLocaleString('pt-PT')}</b>}\r\n              </button>\r\n            )\r\n          })}\r\n        </div>\r\n      </div>\r\n    )\r\n  }\r\n\r\n  return (\r\n    <div>\r\n      <div className=\"text-[11px] font-semibold text-slate-500 dark:text-slate-400 mb-1\">{campo.rotulo}</div>\r\n      {opcoes.length > limiar && (\r\n        <input\r\n          type=\"search\"\r\n          value={pesquisa}\r\n          onChange={(e) => setPesquisa(e.target.value)}\r\n          placeholder={txt.pesquisar}\r\n          className=\"w-full mb-1 border border-slate-300 rounded px-2 py-1 text-xs bg-white dark:bg-slate-800 dark:border-slate-600 dark:text-slate-100\"\r\n        />\r\n      )}\r\n      <div className=\"space-y-0.5\">\r\n        {!visiveis.length && <div className=\"text-xs text-slate-400\">{txt.semOpcoes}</div>}\r\n        {visiveis.map((o) => {\r\n          const activo = escolhidos.includes(o.valor)\r\n          return (\r\n            <label\r\n              key={o.valor}\r\n              className={`flex items-center gap-2 text-xs cursor-pointer px-1 py-0.5 rounded hover:bg-slate-50 dark:hover:bg-slate-800 ${\r\n                o.total === 0 ? 'opacity-45' : ''\r\n              }`}\r\n            >\r\n              {/*\r\n                `onClick` e não `onChange`.\r\n\r\n                Um radio já marcado não dispara `onChange` ao ser clicado outra\r\n                vez — o estado não muda, logo não há evento — e a lógica de\r\n                desmarcar que o `alternar` tem nunca chegava a correr. Só se\r\n                notava nos campos de escolha única: escolhia-se uma prioridade\r\n                e a única saída era limpar o painel todo.\r\n\r\n                `onClick` dispara sempre. O `onChange` vazio existe porque o\r\n                React avisa quando um input é `checked` sem ele.\r\n              */}\r\n              <input\r\n                type={campo.unico ? 'radio' : 'checkbox'}\r\n                checked={activo}\r\n                onClick={() => alternar(o.valor)}\r\n                onChange={() => { /* o clique é tratado em onClick */ }}\r\n                className=\"accent-proef-navy\"\r\n              />\r\n              <span className=\"flex-1 truncate\" title={o.rotulo}>{o.rotulo}</span>\r\n              {o.total != null && (\r\n                <span className=\"tabular-nums text-slate-400\">{o.total.toLocaleString('pt-PT')}</span>\r\n              )}\r\n            </label>\r\n          )\r\n        })}\r\n      </div>\r\n      {filtradas.length > VISIVEIS && (\r\n        <button\r\n          onClick={() => setTodas((v) => !v)}\r\n          className=\"mt-1 text-[11px] text-proef-navy dark:text-sky-300 hover:underline\"\r\n        >\r\n          {todas ? txt.verMenos : txt.verTodas.replace('{n}', String(filtradas.length))}\r\n        </button>\r\n      )}\r\n    </div>\r\n  )\r\n}\r\n\r\n/** Comparação sem acentos nem maiúsculas: \"Guimarães\" tem de encontrar-se por \"guimaraes\". */\r\nfunction semAcentos(texto: string): string {\r\n  return texto.normalize('NFD').replace(/[̀-ͯ]/g, '').toLowerCase()\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/esm/legacy/components/organisms/PesquisaRapida/PesquisaRapida.js

@@ -0,0 +1,147 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from "react";
+const LABELS = {
+  titulo: "Pesquisa",
+  placeholder: "Pesquisar…",
+  semResultados: "Sem resultados.",
+  aEscrever: "Escreva para procurar.",
+  dica: "↑↓ para navegar · Enter para abrir · Esc para fechar"
+};
+const ESPERA_MS = 250;
+function PesquisaRapida({
+  aberta,
+  onFechar,
+  procurar,
+  onEscolher,
+  minimo = 2,
+  labels
+}) {
+  const txt = { ...LABELS, ...labels };
+  const [termo, setTermo] = useState("");
+  const [resultados, setResultados] = useState([]);
+  const [activo, setActivo] = useState(0);
+  const [aProcurar, setAProcurar] = useState(false);
+  const campoRef = useRef(null);
+  useEffect(() => {
+    if (aberta) {
+      setTermo("");
+      setResultados([]);
+      setActivo(0);
+      setTimeout(() => campoRef.current?.focus(), 0);
+    }
+  }, [aberta]);
+  useEffect(() => {
+    if (!aberta || termo.trim().length < minimo) {
+      setResultados([]);
+      return;
+    }
+    let cancelado = false;
+    setAProcurar(true);
+    const id = setTimeout(async () => {
+      try {
+        const r = await procurar(termo.trim());
+        if (!cancelado) {
+          setResultados(r);
+          setActivo(0);
+        }
+      } finally {
+        if (!cancelado) setAProcurar(false);
+      }
+    }, ESPERA_MS);
+    return () => {
+      cancelado = true;
+      clearTimeout(id);
+    };
+  }, [termo, aberta, minimo, procurar]);
+  if (!aberta) return null;
+  const aoTeclar = (e) => {
+    if (e.key === "Escape") return onFechar();
+    if (e.key === "ArrowDown") {
+      e.preventDefault();
+      setActivo((i) => Math.min(i + 1, resultados.length - 1));
+    }
+    if (e.key === "ArrowUp") {
+      e.preventDefault();
+      setActivo((i) => Math.max(i - 1, 0));
+    }
+    if (e.key === "Enter" && resultados[activo]) {
+      onEscolher(resultados[activo]);
+      onFechar();
+    }
+  };
+  let grupoAnterior;
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: "fixed inset-0 z-[2000] bg-slate-900/40 flex items-start justify-center pt-24 px-4",
+      onClick: onFechar,
+      children: /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "bg-white rounded-lg shadow-2xl w-full max-w-xl overflow-hidden",
+          onClick: (e) => e.stopPropagation(),
+          children: [
+            /* @__PURE__ */ jsx(
+              "input",
+              {
+                ref: campoRef,
+                value: termo,
+                onChange: (e) => setTermo(e.target.value),
+                onKeyDown: aoTeclar,
+                placeholder: txt.placeholder,
+                className: "w-full px-4 py-3 text-sm border-b border-slate-200 outline-none",
+                "aria-label": txt.titulo
+              }
+            ),
+            /* @__PURE__ */ jsxs("div", { className: "max-h-80 overflow-auto", children: [
+              termo.trim().length < minimo && /* @__PURE__ */ jsx("p", { className: "px-4 py-6 text-xs text-slate-400 text-center", children: txt.aEscrever }),
+              termo.trim().length >= minimo && !aProcurar && !resultados.length && /* @__PURE__ */ jsx("p", { className: "px-4 py-6 text-xs text-slate-400 text-center", children: txt.semResultados }),
+              resultados.map((r, i) => {
+                const cabecalho = r.grupo && r.grupo !== grupoAnterior ? r.grupo : null;
+                grupoAnterior = r.grupo;
+                return /* @__PURE__ */ jsxs("div", { children: [
+                  cabecalho && /* @__PURE__ */ jsx("div", { className: "px-4 pt-2 pb-1 text-[10px] font-bold uppercase tracking-wide text-slate-400", children: cabecalho }),
+                  /* @__PURE__ */ jsxs(
+                    "button",
+                    {
+                      onMouseEnter: () => setActivo(i),
+                      onClick: () => {
+                        onEscolher(r);
+                        onFechar();
+                      },
+                      className: `w-full text-left px-4 py-2 ${i === activo ? "bg-sky-50" : "hover:bg-slate-50"}`,
+                      children: [
+                        /* @__PURE__ */ jsx("div", { className: "text-sm text-proef-navy font-medium", children: r.titulo }),
+                        r.detalhe && /* @__PURE__ */ jsx("div", { className: "text-xs text-slate-500 truncate", children: r.detalhe })
+                      ]
+                    }
+                  )
+                ] }, r.id);
+              })
+            ] }),
+            /* @__PURE__ */ jsx("div", { className: "px-4 py-1.5 border-t border-slate-100 text-[10px] text-slate-400", children: txt.dica })
+          ]
+        }
+      )
+    }
+  );
+}
+function usarAtalhoPesquisa() {
+  const [aberta, setAberta] = useState(false);
+  useEffect(() => {
+    const aoTeclar = (e) => {
+      if ((e.ctrlKey || e.metaKey) && e.key.toLowerCase() === "k") {
+        e.preventDefault();
+        setAberta((v) => !v);
+      }
+    };
+    window.addEventListener("keydown", aoTeclar);
+    return () => window.removeEventListener("keydown", aoTeclar);
+  }, []);
+  return { aberta, abrir: () => setAberta(true), fechar: () => setAberta(false) };
+}
+export {
+  PesquisaRapida as default,
+  usarAtalhoPesquisa
+};
+//# sourceMappingURL=PesquisaRapida.js.map

package/dist/esm/legacy/components/organisms/PesquisaRapida/PesquisaRapida.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PesquisaRapida.js","sources":["../../../../../../src/legacy/components/organisms/PesquisaRapida/PesquisaRapida.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react'\r\n\r\n/**\r\n * Pesquisa rápida — a paleta que abre com Ctrl/Cmd + K.\r\n *\r\n * Genérica: recebe uma função de procura e devolve o que foi escolhido. Não\r\n * sabe o que procura nem onde — quem a monta é que sabe.\r\n *\r\n * O atalho é registado em `window` e não num campo: a utilidade disto é poder\r\n * ser chamada de qualquer sítio da aplicação sem ter de lá chegar com o rato.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\n\r\nexport interface ResultadoPesquisa {\r\n  id: string\r\n  titulo: string\r\n  /** Segunda linha: o que distingue dois resultados com o mesmo título. */\r\n  detalhe?: string\r\n  /** Agrupador opcional, mostrado como cabeçalho. */\r\n  grupo?: string\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport interface PesquisaRapidaLabels {\r\n  titulo: string\r\n  placeholder: string\r\n  semResultados: string\r\n  aEscrever: string\r\n  dica: string\r\n}\r\n\r\nconst LABELS: PesquisaRapidaLabels = {\r\n  titulo: 'Pesquisa',\r\n  placeholder: 'Pesquisar…',\r\n  semResultados: 'Sem resultados.',\r\n  aEscrever: 'Escreva para procurar.',\r\n  dica: '↑↓ para navegar · Enter para abrir · Esc para fechar',\r\n}\r\n\r\n/** Espera antes de procurar. Procurar a cada tecla seria um pedido por letra. */\r\nconst ESPERA_MS = 250\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport interface PesquisaRapidaProps {\r\n  aberta: boolean\r\n  onFechar: () => void\r\n  /** Procura. Pode devolver poucos resultados — a lista não é paginada. */\r\n  procurar: (termo: string) => Promise<ResultadoPesquisa[]>\r\n  onEscolher: (resultado: ResultadoPesquisa) => void\r\n  /** Mínimo de caracteres antes de procurar. */\r\n  minimo?: number\r\n  labels?: Partial<PesquisaRapidaLabels>\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport default function PesquisaRapida({\r\n  aberta,\r\n  onFechar,\r\n  procurar,\r\n  onEscolher,\r\n  minimo = 2,\r\n  labels,\r\n}: PesquisaRapidaProps) {\r\n  const txt = { ...LABELS, ...labels }\r\n  const [termo, setTermo] = useState('')\r\n  const [resultados, setResultados] = useState<ResultadoPesquisa[]>([])\r\n  const [activo, setActivo] = useState(0)\r\n  const [aProcurar, setAProcurar] = useState(false)\r\n  const campoRef = useRef<HTMLInputElement>(null)\r\n\r\n  useEffect(() => {\r\n    if (aberta) {\r\n      setTermo('')\r\n      setResultados([])\r\n      setActivo(0)\r\n      // O foco tem de esperar pela pintura: o campo ainda não está no DOM.\r\n      setTimeout(() => campoRef.current?.focus(), 0)\r\n    }\r\n  }, [aberta])\r\n\r\n  useEffect(() => {\r\n    if (!aberta || termo.trim().length < minimo) {\r\n      setResultados([])\r\n      return\r\n    }\r\n    let cancelado = false\r\n    setAProcurar(true)\r\n    const id = setTimeout(async () => {\r\n      try {\r\n        const r = await procurar(termo.trim())\r\n        // A resposta de uma pesquisa anterior pode chegar depois desta: sem o\r\n        // cancelamento, a lista mostraria o resultado do termo errado.\r\n        if (!cancelado) {\r\n          setResultados(r)\r\n          setActivo(0)\r\n        }\r\n      } finally {\r\n        if (!cancelado) setAProcurar(false)\r\n      }\r\n    }, ESPERA_MS)\r\n    return () => {\r\n      cancelado = true\r\n      clearTimeout(id)\r\n    }\r\n  }, [termo, aberta, minimo, procurar])\r\n\r\n  if (!aberta) return null\r\n\r\n  const aoTeclar = (e: React.KeyboardEvent): void => {\r\n    if (e.key === 'Escape') return onFechar()\r\n    if (e.key === 'ArrowDown') {\r\n      e.preventDefault()\r\n      setActivo((i) => Math.min(i + 1, resultados.length - 1))\r\n    }\r\n    if (e.key === 'ArrowUp') {\r\n      e.preventDefault()\r\n      setActivo((i) => Math.max(i - 1, 0))\r\n    }\r\n    if (e.key === 'Enter' && resultados[activo]) {\r\n      onEscolher(resultados[activo])\r\n      onFechar()\r\n    }\r\n  }\r\n\r\n  let grupoAnterior: string | undefined\r\n\r\n  return (\r\n    <div\r\n      className=\"fixed inset-0 z-[2000] bg-slate-900/40 flex items-start justify-center pt-24 px-4\"\r\n      onClick={onFechar}\r\n    >\r\n      <div\r\n        className=\"bg-white rounded-lg shadow-2xl w-full max-w-xl overflow-hidden\"\r\n        onClick={(e) => e.stopPropagation()}\r\n      >\r\n        <input\r\n          ref={campoRef}\r\n          value={termo}\r\n          onChange={(e) => setTermo(e.target.value)}\r\n          onKeyDown={aoTeclar}\r\n          placeholder={txt.placeholder}\r\n          className=\"w-full px-4 py-3 text-sm border-b border-slate-200 outline-none\"\r\n          aria-label={txt.titulo}\r\n        />\r\n\r\n        <div className=\"max-h-80 overflow-auto\">\r\n          {termo.trim().length < minimo && (\r\n            <p className=\"px-4 py-6 text-xs text-slate-400 text-center\">{txt.aEscrever}</p>\r\n          )}\r\n          {termo.trim().length >= minimo && !aProcurar && !resultados.length && (\r\n            <p className=\"px-4 py-6 text-xs text-slate-400 text-center\">{txt.semResultados}</p>\r\n          )}\r\n          {resultados.map((r, i) => {\r\n            const cabecalho = r.grupo && r.grupo !== grupoAnterior ? r.grupo : null\r\n            grupoAnterior = r.grupo\r\n            return (\r\n              <div key={r.id}>\r\n                {cabecalho && (\r\n                  <div className=\"px-4 pt-2 pb-1 text-[10px] font-bold uppercase tracking-wide text-slate-400\">\r\n                    {cabecalho}\r\n                  </div>\r\n                )}\r\n                <button\r\n                  onMouseEnter={() => setActivo(i)}\r\n                  onClick={() => {\r\n                    onEscolher(r)\r\n                    onFechar()\r\n                  }}\r\n                  className={`w-full text-left px-4 py-2 ${i === activo ? 'bg-sky-50' : 'hover:bg-slate-50'}`}\r\n                >\r\n                  <div className=\"text-sm text-proef-navy font-medium\">{r.titulo}</div>\r\n                  {r.detalhe && <div className=\"text-xs text-slate-500 truncate\">{r.detalhe}</div>}\r\n                </button>\r\n              </div>\r\n            )\r\n          })}\r\n        </div>\r\n\r\n        <div className=\"px-4 py-1.5 border-t border-slate-100 text-[10px] text-slate-400\">{txt.dica}</div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\n/**\r\n * Regista Ctrl/Cmd + K e devolve o estado de abertura.\r\n *\r\n * Em hook para quem usa a paleta não ter de repetir a escuta do teclado — e\r\n * porque o atalho tem de ser removido ao desmontar, que é o passo que se\r\n * esquece.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport function usarAtalhoPesquisa(): { aberta: boolean; abrir: () => void; fechar: () => void } {\r\n  const [aberta, setAberta] = useState(false)\r\n\r\n  useEffect(() => {\r\n    const aoTeclar = (e: KeyboardEvent): void => {\r\n      if ((e.ctrlKey || e.metaKey) && e.key.toLowerCase() === 'k') {\r\n        e.preventDefault()\r\n        setAberta((v) => !v)\r\n      }\r\n    }\r\n    window.addEventListener('keydown', aoTeclar)\r\n    return () => window.removeEventListener('keydown', aoTeclar)\r\n  }, [])\r\n\r\n  return { aberta, abrir: () => setAberta(true), fechar: () => setAberta(false) }\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/esm/legacy/components/organisms/Profile/Profile.css

@@ -0,0 +1,26 @@
+@charset "UTF-8";
+/* Intencionalmente VAZIO.
+ *
+ * As atoms antigas faziam `@import url('.../styles/index.scss')`, e este ficheiro
+ * injetava no CONSUMIDOR (via style-loader do bundle) um reset global agressivo
+ * (`* { margin:0; padding:0 }`), `@font-face` Urbanist (.ttf → 404 sob subpaths),
+ * `canvas { height:auto }` (partia o sizing dos charts) e `body { font-family;
+ * background }`. Uma LIB não pode impor nada disto — nukeava o spacing/fonte/fundo
+ * de qualquer app que importasse o common-ui (visível sobretudo em apps com
+ * utilities layered, que perdem ao `*` injetado).
+ *
+ * Cada app define o seu próprio reset/fonte/fundo. Mantido como no-op p/ os
+ * imports existentes não partirem. */
+.cui-profile__container {
+  display: flex;
+  gap: 1rem;
+}
+.cui-profile__infos {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+}
+.cui-profile__options {
+  display: flex;
+  align-items: center;
+}

package/dist/esm/legacy/components/organisms/Profile/Profile.js

@@ -0,0 +1,26 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import Acronym from "../../atoms/Acronym/Acronym.js";
+import { faSignOut } from "@fortawesome/free-solid-svg-icons";
+import './Profile.css';/* empty css             */
+import ActionButton from "../../atoms/Button/variants/ActionButton.js";
+import { ActionButtonThemeStyled } from "../../../styles/themes/ButtonThemes.js";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+const Profile = ({ user, handleLogout, notifications, logoutLabel = "Terminar Sessão" }) => {
+  return /* @__PURE__ */ jsx("div", { className: "cui-profile", children: /* @__PURE__ */ jsxs("div", { className: "cui-profile__container", children: [
+    /* @__PURE__ */ jsx("div", { className: "cui-profile__infos", children: /* @__PURE__ */ jsx(Acronym, { name: user.name, theme: { mode: "dark" } }) }),
+    /* @__PURE__ */ jsx("div", { className: "cui-profile__notifications", children: notifications }),
+    /* @__PURE__ */ jsx("div", { className: "cui-profile__options", children: /* @__PURE__ */ jsx(
+      ActionButton,
+      {
+        icon: /* @__PURE__ */ jsx(FontAwesomeIcon, { icon: faSignOut }),
+        onClick: handleLogout,
+        title: logoutLabel,
+        theme: { ...ActionButtonThemeStyled, size: "compact" }
+      }
+    ) })
+  ] }) });
+};
+export {
+  Profile as default
+};
+//# sourceMappingURL=Profile.js.map

package/dist/esm/legacy/components/organisms/Profile/Profile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Profile.js","sources":["../../../../../../src/legacy/components/organisms/Profile/Profile.tsx"],"sourcesContent":["import React, { ReactNode } from 'react'\r\nimport { LoggedUser } from '../../../types/LoggedUser'\r\nimport Acronym from '../../atoms/Acronym/Acronym'\r\nimport { faSignOut } from '@fortawesome/free-solid-svg-icons'\r\n\r\nimport './Profile.scss'\r\nimport ActionButton from '../../atoms/Button/variants/ActionButton'\r\nimport { ActionButtonThemeStyled } from '../../../styles/themes/ButtonThemes'\r\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome'\r\n\r\ntype Props = {\r\n  user: LoggedUser\r\n  handleLogout: () => void\r\n  notifications?: ReactNode\r\n  logoutLabel?: string\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nconst Profile = ({ user, handleLogout, notifications, logoutLabel = 'Terminar Sessão' }: Props) => {\r\n  return (\r\n    <div className=\"cui-profile\">\r\n      <div className=\"cui-profile__container\">\r\n        <div className=\"cui-profile__infos\">\r\n          <Acronym name={user.name} theme={{ mode: 'dark' }} />\r\n        </div>\r\n        <div className=\"cui-profile__notifications\">{notifications}</div>\r\n        <div className=\"cui-profile__options\">\r\n          <ActionButton\r\n            icon={<FontAwesomeIcon icon={faSignOut} />}\r\n            onClick={handleLogout}\r\n            title={logoutLabel}\r\n            theme={{ ...ActionButtonThemeStyled, size: 'compact' }}\r\n          />\r\n        </div>\r\n      </div>\r\n    </div>\r\n  )\r\n}\r\n\r\nexport default Profile\r\n"],"names":[],"mappings":";;;;;;;AAkBA,MAAM,UAAU,CAAC,EAAE,MAAM,cAAc,eAAe,cAAc,wBAA+B;AACjG,6BACG,OAAA,EAAI,WAAU,eACb,UAAA,qBAAC,OAAA,EAAI,WAAU,0BACb,UAAA;AAAA,IAAA,oBAAC,OAAA,EAAI,WAAU,sBACb,UAAA,oBAAC,SAAA,EAAQ,MAAM,KAAK,MAAM,OAAO,EAAE,MAAM,OAAA,GAAU,GACrD;AAAA,IACA,oBAAC,OAAA,EAAI,WAAU,8BAA8B,UAAA,eAAc;AAAA,IAC3D,oBAAC,OAAA,EAAI,WAAU,wBACb,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAM,oBAAC,iBAAA,EAAgB,MAAM,UAAA,CAAW;AAAA,QACxC,SAAS;AAAA,QACT,OAAO;AAAA,QACP,OAAO,EAAE,GAAG,yBAAyB,MAAM,UAAA;AAAA,MAAU;AAAA,IAAA,EACvD,CACF;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;"}

package/dist/esm/legacy/components/organisms/RoleGuard/RoleGuard.js

@@ -0,0 +1,68 @@
+import { jsx, Fragment } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from "react";
+function lerRolesDoToken(accessToken) {
+  try {
+    const corpo = accessToken.split(".")[1];
+    if (!corpo) return [];
+    const json = atob(corpo.replace(/-/g, "+").replace(/_/g, "/"));
+    const payload = JSON.parse(json);
+    return payload.roles ?? [];
+  } catch {
+    return [];
+  }
+}
+function RoleGuard({
+  rolesPermitidas,
+  temSessao,
+  aAutenticar = false,
+  obterToken,
+  onPrecisaInteracao,
+  semSessao,
+  aCarregar,
+  semPermissao,
+  children
+}) {
+  const [decisao, setDecisao] = useState("aResolver");
+  const jaCorreu = useRef(false);
+  const refRoles = useRef(rolesPermitidas);
+  const refObterToken = useRef(obterToken);
+  const refPrecisaInteracao = useRef(onPrecisaInteracao);
+  refRoles.current = rolesPermitidas;
+  refObterToken.current = obterToken;
+  refPrecisaInteracao.current = onPrecisaInteracao;
+  useEffect(() => {
+    if (!temSessao || aAutenticar || jaCorreu.current) return;
+    jaCorreu.current = true;
+    let cancelado = false;
+    void (async () => {
+      if (!refRoles.current.length) {
+        if (!cancelado) setDecisao("permitido");
+        return;
+      }
+      try {
+        const temAlguma = (t) => lerRolesDoToken(t).some((r) => refRoles.current.includes(r));
+        let ok = temAlguma(await refObterToken.current());
+        if (!ok) ok = temAlguma(await refObterToken.current(true));
+        if (!cancelado) setDecisao(ok ? "permitido" : "negado");
+      } catch {
+        if (refPrecisaInteracao.current) {
+          refPrecisaInteracao.current();
+          return;
+        }
+        if (!cancelado) setDecisao("negado");
+      }
+    })();
+    return () => {
+      cancelado = true;
+    };
+  }, [temSessao, aAutenticar]);
+  if (!temSessao) return /* @__PURE__ */ jsx(Fragment, { children: semSessao });
+  if (decisao === "aResolver") return /* @__PURE__ */ jsx(Fragment, { children: aCarregar });
+  if (decisao === "negado") return /* @__PURE__ */ jsx(Fragment, { children: semPermissao });
+  return /* @__PURE__ */ jsx(Fragment, { children });
+}
+export {
+  RoleGuard as default,
+  lerRolesDoToken
+};
+//# sourceMappingURL=RoleGuard.js.map

package/dist/esm/legacy/components/organisms/RoleGuard/RoleGuard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RoleGuard.js","sources":["../../../../../../src/legacy/components/organisms/RoleGuard/RoleGuard.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState, type ReactNode } from 'react'\r\n\r\n/**\r\n * Restringe o acesso ao portal a um conjunto de app roles.\r\n *\r\n * Não conhece o MSAL da aplicação: recebe funções para obter o token. É\r\n * deliberado — quando o bundler duplica o `@azure/msal-react`, um `useMsal`\r\n * dentro da biblioteca lê um contexto diferente do da app, a conta vem a null e\r\n * o acesso é negado a quem tem a role certa. Passando o token por fora, isso\r\n * não pode acontecer.\r\n *\r\n * As roles vêm no ACCESS token da API, não no id token — é o erro mais comum\r\n * nesta integração, e a razão de `obterToken` dever pedir o scope da API.\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\n\r\nexport interface RoleGuardProps {\r\n  /** Roles com acesso. Lista vazia = qualquer autenticado entra. */\r\n  rolesPermitidas: string[]\r\n  /** Há sessão iniciada? Enquanto false, mostra-se `semSessao`. */\r\n  temSessao: boolean\r\n  /** Ainda a resolver a autenticação — evita decidir cedo de mais. */\r\n  aAutenticar?: boolean\r\n  /** Token de acesso da API. `forcarRenovacao` ignora a cache. */\r\n  obterToken: (forcarRenovacao?: boolean) => Promise<string>\r\n  /** Chamado quando falta consentimento e é preciso um redirect interactivo. */\r\n  onPrecisaInteracao?: () => void\r\n\r\n  semSessao: ReactNode\r\n  aCarregar: ReactNode\r\n  semPermissao: ReactNode\r\n  children: ReactNode\r\n}\r\n\r\ntype Decisao = 'aResolver' | 'permitido' | 'negado'\r\n\r\n/**\r\n * Lê a claim `roles` de um JWT, sem validar a assinatura (quem valida é a API).\r\n * @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy.\r\n */\r\nexport function lerRolesDoToken(accessToken: string): string[] {\r\n  try {\r\n    const corpo = accessToken.split('.')[1]\r\n    if (!corpo) return []\r\n    const json = atob(corpo.replace(/-/g, '+').replace(/_/g, '/'))\r\n    const payload = JSON.parse(json) as { roles?: string[] }\r\n    return payload.roles ?? []\r\n  } catch {\r\n    return []\r\n  }\r\n}\r\n\r\n/** @deprecated Legacy — não usar em código novo. Ver Storybook › Legacy. */\r\nexport default function RoleGuard({\r\n  rolesPermitidas,\r\n  temSessao,\r\n  aAutenticar = false,\r\n  obterToken,\r\n  onPrecisaInteracao,\r\n  semSessao,\r\n  aCarregar,\r\n  semPermissao,\r\n  children,\r\n}: RoleGuardProps) {\r\n  const [decisao, setDecisao] = useState<Decisao>('aResolver')\r\n\r\n  /**\r\n   * Decidir uma só vez. Em `useState` isto era um bug: a marca entrava nas\r\n   * dependências do efeito, o efeito voltava a correr, a limpeza cancelava a\r\n   * tentativa em curso e a segunda passagem saía logo — a decisão nunca chegava\r\n   * e o portal ficava eternamente em `aCarregar`. Só não dava quando o token\r\n   * estava em cache (um F5), porque aí resolve antes da limpeza.\r\n   */\r\n  const jaCorreu = useRef(false)\r\n\r\n  /**\r\n   * As três funções/arrays abaixo chegam quase sempre inline de quem usa o\r\n   * componente, ou seja com identidade nova a cada render. Em dependências,\r\n   * faziam o efeito re-correr e cancelar o pedido em voo. Ficam em refs: o\r\n   * efeito usa sempre a última versão sem reagir a ela.\r\n   */\r\n  const refRoles = useRef(rolesPermitidas)\r\n  const refObterToken = useRef(obterToken)\r\n  const refPrecisaInteracao = useRef(onPrecisaInteracao)\r\n  refRoles.current = rolesPermitidas\r\n  refObterToken.current = obterToken\r\n  refPrecisaInteracao.current = onPrecisaInteracao\r\n\r\n  useEffect(() => {\r\n    if (!temSessao || aAutenticar || jaCorreu.current) return\r\n    jaCorreu.current = true\r\n\r\n    let cancelado = false\r\n    void (async () => {\r\n      if (!refRoles.current.length) {\r\n        if (!cancelado) setDecisao('permitido')\r\n        return\r\n      }\r\n      try {\r\n        const temAlguma = (t: string): boolean =>\r\n          lerRolesDoToken(t).some((r) => refRoles.current.includes(r))\r\n\r\n        let ok = temAlguma(await refObterToken.current())\r\n\r\n        // Sem correspondência, uma segunda tentativa sem cache: uma role\r\n        // atribuída há pouco ainda não está no token guardado, e negar o acesso\r\n        // a quem acabou de a receber é o pior desfecho possível.\r\n        if (!ok) ok = temAlguma(await refObterToken.current(true))\r\n\r\n        if (!cancelado) setDecisao(ok ? 'permitido' : 'negado')\r\n      } catch {\r\n        // Falta de consentimento resolve-se com um redirect, uma única vez.\r\n        if (refPrecisaInteracao.current) {\r\n          refPrecisaInteracao.current()\r\n          return\r\n        }\r\n        if (!cancelado) setDecisao('negado')\r\n      }\r\n    })()\r\n\r\n    return () => {\r\n      cancelado = true\r\n    }\r\n  }, [temSessao, aAutenticar])\r\n\r\n  if (!temSessao) return <>{semSessao}</>\r\n  if (decisao === 'aResolver') return <>{aCarregar}</>\r\n  if (decisao === 'negado') return <>{semPermissao}</>\r\n  return <>{children}</>\r\n}\r\n"],"names":[],"mappings":";;AAwCO,SAAS,gBAAgB,aAA+B;AAC7D,MAAI;AACF,UAAM,QAAQ,YAAY,MAAM,GAAG,EAAE,CAAC;AACtC,QAAI,CAAC,MAAO,QAAO,CAAA;AACnB,UAAM,OAAO,KAAK,MAAM,QAAQ,MAAM,GAAG,EAAE,QAAQ,MAAM,GAAG,CAAC;AAC7D,UAAM,UAAU,KAAK,MAAM,IAAI;AAC/B,WAAO,QAAQ,SAAS,CAAA;AAAA,EAC1B,QAAQ;AACN,WAAO,CAAA;AAAA,EACT;AACF;AAGA,SAAwB,UAAU;AAAA,EAChC;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAmB;AACjB,QAAM,CAAC,SAAS,UAAU,IAAI,SAAkB,WAAW;AAS3D,QAAM,WAAW,OAAO,KAAK;AAQ7B,QAAM,WAAW,OAAO,eAAe;AACvC,QAAM,gBAAgB,OAAO,UAAU;AACvC,QAAM,sBAAsB,OAAO,kBAAkB;AACrD,WAAS,UAAU;AACnB,gBAAc,UAAU;AACxB,sBAAoB,UAAU;AAE9B,YAAU,MAAM;AACd,QAAI,CAAC,aAAa,eAAe,SAAS,QAAS;AACnD,aAAS,UAAU;AAEnB,QAAI,YAAY;AAChB,UAAM,YAAY;AAChB,UAAI,CAAC,SAAS,QAAQ,QAAQ;AAC5B,YAAI,CAAC,UAAW,YAAW,WAAW;AACtC;AAAA,MACF;AACA,UAAI;AACF,cAAM,YAAY,CAAC,MACjB,gBAAgB,CAAC,EAAE,KAAK,CAAC,MAAM,SAAS,QAAQ,SAAS,CAAC,CAAC;AAE7D,YAAI,KAAK,UAAU,MAAM,cAAc,SAAS;AAKhD,YAAI,CAAC,GAAI,MAAK,UAAU,MAAM,cAAc,QAAQ,IAAI,CAAC;AAEzD,YAAI,CAAC,UAAW,YAAW,KAAK,cAAc,QAAQ;AAAA,MACxD,QAAQ;AAEN,YAAI,oBAAoB,SAAS;AAC/B,8BAAoB,QAAA;AACpB;AAAA,QACF;AACA,YAAI,CAAC,UAAW,YAAW,QAAQ;AAAA,MACrC;AAAA,IACF,GAAA;AAEA,WAAO,MAAM;AACX,kBAAY;AAAA,IACd;AAAA,EACF,GAAG,CAAC,WAAW,WAAW,CAAC;AAE3B,MAAI,CAAC,UAAW,QAAO,oBAAA,UAAA,EAAG,UAAA,WAAU;AACpC,MAAI,YAAY,YAAa,QAAO,oBAAA,UAAA,EAAG,UAAA,WAAU;AACjD,MAAI,YAAY,SAAU,QAAO,oBAAA,UAAA,EAAG,UAAA,cAAa;AACjD,yCAAU,UAAS;AACrB;"}

package/dist/esm/legacy/components/organisms/Selector/Selector.css

@@ -0,0 +1,87 @@
+.cui-selector {
+  max-width: 45vw;
+}
+.cui-selector__search {
+  border-radius: 25px;
+  padding: 10px;
+}
+.cui-selector__selected {
+  margin: 4vh 0;
+  border: 2px solid var(--dark-blue);
+  border-radius: 25px;
+}
+.cui-selector__selected-list {
+  padding: 10px;
+  display: flex;
+  justify-content: left;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 10px;
+  max-height: 17vh;
+  overflow-y: auto;
+}
+.cui-selector__selected-list-item {
+  font-size: 13px;
+  display: flex;
+  padding: 10px;
+  background: var(--dark-blue);
+  color: white;
+  border-radius: 25px;
+}
+.cui-selector__selected-list-info {
+  display: flex;
+  align-items: center;
+}
+.cui-selector__selected-list-option {
+  margin: 0 0 0 7px;
+}
+.cui-selector__elements {
+  margin: 5vh 0;
+  height: 30vh;
+  overflow: auto;
+}
+.cui-selector__elements-list {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  padding-right: 10px;
+  cursor: pointer;
+}
+.cui-selector__elements-list-item {
+  display: flex;
+  justify-content: space-between;
+  padding: 10px;
+  border-radius: 25px;
+}
+.cui-selector__elements-list-item-selected {
+  color: white;
+  background: var(--dark-blue);
+}
+.cui-selector__elements-list-item-not-selected {
+  background: var(--light-gray-01);
+  color: var(--dark-blue);
+}
+.cui-selector__elements-list-item-description {
+  display: flex;
+  justify-content: left;
+  align-items: center;
+}
+.cui-selector__elements-list-item-option {
+  display: flex;
+  justify-content: right;
+  align-items: center;
+}
+.cui-selector__elements-list-item-option label {
+  margin: 0 10px;
+}
+.cui-selector__elements-empty {
+  padding: 1rem;
+}
+.cui-selector__selected-empty {
+  padding: 1rem;
+}
+.cui-selector__confirmation {
+  display: flex;
+  justify-content: center;
+  margin: 1vh 0;
+}