@aspprev/versi-ds 0.4.9 → 0.5.3

package/dist/{chunk-RMWSF4YF.js → chunk-7GTKG537.js}

@@ -289,11 +289,12 @@ var Divider = ({
   height = "h-[1px]",
   children,
   bgColor = "black",
+  className,
   ...rest
 }) => {
   const colorClass = colorClassMap[bgColor];
   const barClass = classNames(children ? "w-1/3" : "w-1/2", height, colorClass);
-  return /* @__PURE__ */ jsxs3("div", { className: classNames(width, "flex items-center justify-center"), children: [
+  return /* @__PURE__ */ jsxs3("div", { ...rest, className: classNames(width, "flex items-center justify-center", className), children: [
     /* @__PURE__ */ jsx4("div", { className: barClass }),
     children && /* @__PURE__ */ jsxs3("div", { className: "px-3", children: [
       children,
@@ -621,7 +622,7 @@ var avatarSizeMap = {
 };
 function Inicials(name) {
   const nome = name;
-  if (!!nome) {
+  if (nome) {
     const array = nome.split(" ");
     const primeiraLetra = nome.charAt(0);
     const posicaoUltimoEspaco = nome.lastIndexOf(" ");
@@ -645,7 +646,7 @@ var Avatar = ({
   ...rest
 }) => {
   const avatarSizeClass = avatarSizeMap[size];
-  const avatarComponent = image ? /* @__PURE__ */ jsx11(AvatarImage_default, { src: image, altDescription: description }) : !!name ? /* @__PURE__ */ jsx11(
+  const avatarComponent = image ? /* @__PURE__ */ jsx11(AvatarImage_default, { src: image, altDescription: description }) : name ? /* @__PURE__ */ jsx11(
     "span",
     {
       className: classNames5(
@@ -888,10 +889,10 @@ function PageButtons(props) {
   const { currentPage, totalResults, perPage, onClick, size } = props;
   const pages = Math.max(1, Math.ceil(totalResults / perPage));
   const sizeClasses = PAGINATION_SIZE_CLASSES[size];
-  let pagesAfter = pages - currentPage > 2 ? 2 : pages - currentPage;
-  let pagesBefore = currentPage > 2 ? 2 : currentPage === 2 ? 1 : 0;
+  const pagesAfter = pages - currentPage > 2 ? 2 : pages - currentPage;
+  const pagesBefore = currentPage > 2 ? 2 : currentPage === 2 ? 1 : 0;
   let buttonsBefore = [];
-  let buttonsAfter = [];
+  const buttonsAfter = [];
   for (let i = 1; i <= pagesBefore; i++) {
     const page = currentPage - i;
     buttonsBefore = [
@@ -1070,7 +1071,7 @@ function Checkbox({
   layout = "row",
   ...props
 }) {
-  let containerClass = "";
+  let containerClass;
   if (layout === "col") {
     containerClass = "flex flex-col gap-y-3 mt-3";
   } else if (layout === "grid-2") {
@@ -1402,15 +1403,12 @@ var InputSlider = ({
   prefix,
   suffix,
   sufix,
-  marks,
-  valueLabelDisplay = "auto",
   showLabel = false,
   disabled = false,
   inputDisabled = false,
   valueFormmated,
   showInput = false,
-  ariaLabel,
-  ...rest
+  ariaLabel
 }) => {
   const [value, setValue] = useState2(initialValue);
   const resolvedSuffix = suffix ?? sufix;
@@ -1421,7 +1419,7 @@ var InputSlider = ({
       const parsedValue = Number(newValue);
       setValue(parsedValue);
     },
-    [functionChange]
+    []
   );
   const handleInputChange = useCallback2(
     (event) => {
@@ -1696,18 +1694,18 @@ function resolveOptionalValue(value, options = {}) {
 // src/components/info-grid/InfoGrid.tsx
 import { jsx as jsx25, jsxs as jsxs15 } from "react/jsx-runtime";
 var COLUMN_STYLES2 = {
-  1: "grid-cols-1",
-  2: "grid-cols-1 mobile:grid-cols-2",
-  3: "grid-cols-1 mobile:grid-cols-2 tablet:grid-cols-3",
-  4: "grid-cols-1 mobile:grid-cols-2 desktop:grid-cols-4",
-  6: "grid-cols-1 mobile:grid-cols-2 tablet:grid-cols-3 desktop:grid-cols-6"
+  1: "versi-info-grid--1",
+  2: "versi-info-grid--2",
+  3: "versi-info-grid--3",
+  4: "versi-info-grid--4",
+  6: "versi-info-grid--6"
 };
 function InfoGrid({ columns = 3, className, ...rest }) {
   return /* @__PURE__ */ jsx25(
     "dl",
     {
       className: classNames10(
-        "grid gap-x-8 gap-y-5",
+        "versi-info-grid grid gap-x-8 gap-y-5",
         COLUMN_STYLES2[columns],
         className
       ),
@@ -1774,150 +1772,84 @@ function FilterBar({
 }
 
 // src/utils/resolve-status-appearance.ts
-var NORMALIZED_STATUS = {
-  infoOutline: /* @__PURE__ */ new Set(["ABERTO", "PAGO", "EM PAGAMENTO"]),
-  infoSolid: /* @__PURE__ */ new Set([
-    "EM ANDAMENTO",
-    "SOLICITADO",
-    "NAO ASSINADO",
-    "AGUARDANDO ASSINATURA"
-  ]),
-  warning: /* @__PURE__ */ new Set([
-    "EM ANALISE",
-    "PENDENTE",
-    "SUSPENSO",
-    "AGUARDANDO PARTICIPANTE"
-  ]),
-  success: /* @__PURE__ */ new Set([
-    "DEFERIDO",
-    "QUITADO",
-    "LIBERADO",
-    "ATIVO",
-    "VIGENTE",
-    "RESPONDIDO",
-    "ASSINADO"
-  ]),
-  danger: /* @__PURE__ */ new Set(["INDEFERIDO", "VENCIDO", "CANCELADO", "ERRO"]),
-  neutral: /* @__PURE__ */ new Set([
-    "CONCLUIDO",
-    "ENCERRADO",
-    "FINALIZADO",
-    "RENEGOCIADO",
-    "INATIVO"
-  ])
+var TONE_TO_COLOR = {
+  info: "blue",
+  warning: "yellow",
+  success: "green",
+  danger: "red",
+  neutral: "slate"
 };
 var normalizeStatus = (status) => String(status ?? "").normalize("NFD").replace(/[\u0300-\u036f]/g, "").replace(/\s+/g, " ").trim().toUpperCase();
-var resolveGenericStatus = (status) => {
-  if (NORMALIZED_STATUS.infoOutline.has(status)) {
-    return { tone: "info", appearance: "outline" };
-  }
-  if (NORMALIZED_STATUS.infoSolid.has(status)) {
-    return { tone: "info", appearance: "solid" };
-  }
-  if (NORMALIZED_STATUS.warning.has(status)) {
-    return { tone: "warning", appearance: "soft" };
-  }
-  if (NORMALIZED_STATUS.success.has(status)) {
-    return { tone: "success", appearance: "solid" };
-  }
-  if (NORMALIZED_STATUS.danger.has(status)) {
-    return { tone: "danger", appearance: "solid" };
-  }
-  if (NORMALIZED_STATUS.neutral.has(status)) {
-    return { tone: "neutral", appearance: "solid" };
-  }
-  return { tone: "neutral", appearance: "outline" };
-};
+var isLegacyConfig = (config) => "tone" in config;
+var normalizeConfig = (config) => isLegacyConfig(config) ? { color: TONE_TO_COLOR[config.tone], appearance: config.appearance } : config;
 var resolveStatusAppearance = (status, domain = "generic", options) => {
+  void domain;
   const normalized = normalizeStatus(status);
-  if (!normalized) {
-    return options?.fallback ?? { tone: "neutral", appearance: "outline" };
-  }
-  const mappedAppearance = options?.map ? Object.entries(options.map).find(
-    ([key]) => normalizeStatus(key) === normalized
-  )?.[1] : void 0;
-  if (mappedAppearance) return mappedAppearance;
-  if (domain === "beneficiary") {
-    if (normalized === "VIGENTE") return { tone: "success", appearance: "solid" };
-    if (normalized === "ENCERRADO") return { tone: "neutral", appearance: "solid" };
-  }
-  if (domain === "document") {
-    if (["ANEXADO", "ASSINADO", "CONCLUIDO"].includes(normalized)) {
-      return { tone: "success", appearance: "solid" };
-    }
-    if (normalized.includes("AGUARDANDO") || normalized === "PENDENTE") {
-      return { tone: "warning", appearance: "soft" };
-    }
-    if (normalized === "BLOQUEADO") return { tone: "neutral", appearance: "solid" };
-  }
-  if (domain === "signature") {
-    if (normalized === "ASSINADO") return { tone: "success", appearance: "solid" };
-    if (normalized.includes("AGUARDANDO")) return { tone: "warning", appearance: "soft" };
-    if (normalized === "NAO ASSINADO") return { tone: "info", appearance: "solid" };
-  }
-  if (domain === "benefit") {
-    if (normalized === "EM PAGAMENTO") return { tone: "info", appearance: "outline" };
-    if (normalized === "SUSPENSO") return { tone: "warning", appearance: "soft" };
+  if (normalized && options?.map) {
+    const mappedAppearance = Object.entries(options.map).find(
+      ([key]) => normalizeStatus(key) === normalized
+    )?.[1];
+    if (mappedAppearance) return normalizeConfig(mappedAppearance);
   }
-  if (domain === "participation") {
-    return { tone: "neutral", appearance: "solid" };
-  }
-  if (domain === "payment") {
-    if (["PAGO", "QUITADO", "LIBERADO"].includes(normalized)) {
-      return { tone: "success", appearance: "solid" };
-    }
-    if (["EM PAGAMENTO", "AGUARDANDO PAGAMENTO"].includes(normalized)) {
-      return { tone: "info", appearance: "outline" };
-    }
-    if (["VENCIDO", "ESTORNADO", "FALHOU"].includes(normalized)) {
-      return { tone: "danger", appearance: "solid" };
-    }
+  if (options?.color) {
+    return {
+      color: options.color,
+      appearance: options.appearance ?? "outline"
+    };
   }
-  if (domain === "claim" || domain === "request" || domain === "protocol") {
-    if (["RECEBIDO", "PROTOCOLADO", "EMITIDO"].includes(normalized)) {
-      return { tone: "info", appearance: "outline" };
-    }
-    if (["EM ANALISE", "AGUARDANDO DOCUMENTACAO", "AGUARDANDO ANALISE"].includes(normalized)) {
-      return { tone: "warning", appearance: "soft" };
-    }
-    if (["APROVADO", "CONCEDIDO", "ATENDIDO"].includes(normalized)) {
-      return { tone: "success", appearance: "solid" };
-    }
-    if (["NEGADO", "ARQUIVADO", "RECUSADO"].includes(normalized)) {
-      return { tone: "danger", appearance: "solid" };
-    }
+  if (options?.tone) {
+    return {
+      color: TONE_TO_COLOR[options.tone],
+      appearance: options.appearance ?? "outline"
+    };
   }
-  return options?.fallback ?? resolveGenericStatus(normalized);
+  return options?.fallback ?? { color: "slate", appearance: "outline" };
 };
+var getStatusBadgeColorFromTone = (tone) => TONE_TO_COLOR[tone];
 
 // src/components/status-badge/StatusBadge.tsx
 import classNames12 from "classnames";
 import { jsx as jsx27 } from "react/jsx-runtime";
-var TONE_STYLES2 = {
-  info: {
-    outline: "border-feedback-info-border text-feedback-info-content",
-    soft: "border-feedback-info-border bg-feedback-info-soft text-feedback-info-content",
-    solid: "border-feedback-info-strong bg-feedback-info-strong text-surface-subtle"
+var COLOR_STYLES = {
+  primary: {
+    outline: "border-primary-1 text-primary-1",
+    soft: "border-primary-1 bg-primary-5 text-primary-2",
+    solid: "border-action-primary bg-action-primary text-action-primary-content"
+  },
+  blue: {
+    outline: "border-status-blue-outline-border text-status-blue-outline-foreground",
+    soft: "border-status-blue-outline-border bg-status-blue-soft-background text-status-blue-soft-foreground",
+    solid: "border-status-blue-solid-background bg-status-blue-solid-background text-status-blue-solid-foreground"
+  },
+  green: {
+    outline: "border-status-green-outline-border text-status-green-outline-foreground",
+    soft: "border-status-green-outline-border bg-status-green-soft-background text-status-green-soft-foreground",
+    solid: "border-status-green-solid-background bg-status-green-solid-background text-status-green-solid-foreground"
   },
-  warning: {
-    outline: "border-feedback-warning-border text-feedback-warning-content",
-    soft: "border-feedback-warning-border bg-feedback-warning-soft text-feedback-warning-content",
-    solid: "border-feedback-warning-strong bg-feedback-warning-strong text-surface-subtle"
+  orange: {
+    outline: "border-status-orange-outline-border text-status-orange-outline-foreground",
+    soft: "border-status-orange-outline-border bg-status-orange-soft-background text-status-orange-soft-foreground",
+    solid: "border-status-orange-solid-background bg-status-orange-solid-background text-status-orange-solid-foreground"
   },
-  success: {
-    outline: "border-feedback-success-border text-feedback-success-content",
-    soft: "border-feedback-success-border bg-feedback-success-soft text-feedback-success-content",
-    solid: "border-feedback-success-strong bg-feedback-success-strong text-surface-subtle"
+  yellow: {
+    outline: "border-status-yellow-outline-border text-status-yellow-outline-foreground",
+    soft: "border-status-yellow-outline-border bg-status-yellow-soft-background text-status-yellow-soft-foreground",
+    solid: "border-status-yellow-solid-background bg-status-yellow-solid-background text-status-yellow-solid-foreground"
   },
-  danger: {
-    outline: "border-feedback-danger-border text-feedback-danger-content",
-    soft: "border-feedback-danger-border bg-feedback-danger-soft text-feedback-danger-content",
-    solid: "border-feedback-danger-strong bg-feedback-danger-strong text-surface-subtle"
+  red: {
+    outline: "border-status-red-outline-border text-status-red-outline-foreground",
+    soft: "border-status-red-outline-border bg-status-red-soft-background text-status-red-soft-foreground",
+    solid: "border-status-red-solid-background bg-status-red-solid-background text-status-red-solid-foreground"
   },
-  neutral: {
-    outline: "border-border-strong text-content-secondary",
-    soft: "border-border-default bg-surface-subtle text-content-secondary",
-    solid: "border-surface-action-neutral bg-surface-action-neutral text-surface-subtle"
+  slate: {
+    outline: "border-status-slate-outline-border text-status-slate-outline-foreground",
+    soft: "border-status-slate-outline-border bg-status-slate-soft-background text-status-slate-soft-foreground",
+    solid: "border-status-slate-solid-background bg-status-slate-solid-background text-status-slate-solid-foreground"
+  },
+  black: {
+    outline: "border-status-black-outline-border text-status-black-outline-foreground",
+    soft: "border-status-black-outline-border bg-status-black-soft-background text-status-black-soft-foreground",
+    solid: "border-status-black-solid-background bg-status-black-solid-background text-status-black-solid-foreground"
   }
 };
 var SIZE_STYLES = {
@@ -1926,7 +1858,8 @@ var SIZE_STYLES = {
 };
 function StatusBadge({
   children,
-  tone = "neutral",
+  color,
+  tone,
   appearance = "outline",
   size = "md",
   overflow = "wrap",
@@ -1941,7 +1874,7 @@ function StatusBadge({
       className: classNames12(
         "inline-flex w-fit max-w-full items-center justify-center rounded-sm border-2 text-center font-bold uppercase tracking-wide",
         SIZE_STYLES[size],
-        TONE_STYLES2[tone][appearance],
+        COLOR_STYLES[color ?? getStatusBadgeColorFromTone(tone ?? "neutral")][appearance],
         overflow === "truncate" ? "overflow-hidden text-ellipsis whitespace-nowrap" : "whitespace-normal break-words",
         className
       ),
@@ -1952,7 +1885,10 @@ function StatusBadge({
     }
   );
 }
-var getStatusBadgeClassName = (tone, appearance) => TONE_STYLES2[tone][appearance];
+var getStatusBadgeClassName = (colorOrTone, appearance) => {
+  const color = colorOrTone in COLOR_STYLES ? colorOrTone : getStatusBadgeColorFromTone(colorOrTone);
+  return COLOR_STYLES[color][appearance];
+};
 
 // src/components/status-badge/DomainStatusBadge.tsx
 import { jsx as jsx28 } from "react/jsx-runtime";
@@ -1962,15 +1898,25 @@ function DomainStatusBadge({
   empty = "hide",
   placeholder = "-",
   statusMap,
+  fallback,
+  color,
+  tone,
+  appearance,
   ...rest
 }) {
   const label = status?.trim();
   if (!label && empty === "hide") return null;
-  const resolved = resolveStatusAppearance(label, domain, { map: statusMap });
+  const resolved = resolveStatusAppearance(label, domain, {
+    map: statusMap,
+    color,
+    tone,
+    appearance,
+    fallback
+  });
   return /* @__PURE__ */ jsx28(
     StatusBadge,
     {
-      tone: resolved.tone,
+      color: resolved.color,
       appearance: resolved.appearance,
       ...rest,
       children: label || placeholder
@@ -2074,7 +2020,6 @@ function FormErrorNavigation() {
       cleanupPendingNavigation?.();
       const form = event.target;
       let handled = false;
-      let observer;
       const timers = [];
       const cleanup = () => {
         observer?.disconnect();
@@ -2088,7 +2033,7 @@ function FormErrorNavigation() {
         cleanup();
         navigateToInvalidField(field);
       };
-      observer = new MutationObserver(tryNavigate);
+      const observer = new MutationObserver(tryNavigate);
       observer.observe(form, {
         attributeFilter: ["aria-invalid"],
         attributes: true,
@@ -3266,15 +3211,13 @@ function resolveContainerBreakpoint(width, breakpoints = defaultContainerBreakpo
   );
 }
 function getBreakpointMapKey(breakpoints) {
-  return Object.entries(breakpoints).sort(([first], [second]) => first.localeCompare(second)).map(([name, threshold]) => `${name}:${threshold}`).join("|");
+  return JSON.stringify(Object.entries(breakpoints).sort(([, first], [, second]) => first - second));
 }
 function useContainerBreakpoint(ref, options = {}) {
   const thresholds = options.breakpoints ?? defaultContainerBreakpoints;
   const thresholdsKey = getBreakpointMapKey(thresholds);
   const sortedThresholds = useMemo4(
-    () => Object.entries(thresholds).sort(
-      ([, first], [, second]) => first === second ? 0 : first - second
-    ),
+    () => JSON.parse(thresholdsKey),
     [thresholdsKey]
   );
   const [current, setCurrent] = useState6();
@@ -3339,4 +3282,4 @@ export {
   resolveContainerBreakpoint,
   useContainerBreakpoint
 };
-//# sourceMappingURL=chunk-RMWSF4YF.js.map
+//# sourceMappingURL=chunk-7GTKG537.js.map