@nextelco/common-ui 2.1.98 → 2.1.99

package/dist/esm/legacy/components/molecules/DataTable/DataTable.js

@@ -0,0 +1,1145 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useEffect, useRef, useLayoutEffect, useMemo, Fragment } from "react";
+import Escolha from "../../ui/Escolha.js";
+import { createPortal } from "react-dom";
+const DEFAULT_LABELS = {
+  total: "Total",
+  results: "{count} results",
+  resizeColumn: "Drag to resize · double-click to reset",
+  export: "Export",
+  loading: "Loading…",
+  empty: "No data",
+  error: "Failed to load",
+  search: "Search…",
+  clear: "Clear",
+  clearAll: "Clear all",
+  noOptions: "No options",
+  selected: "{count} sel.",
+  moreOptions: "Showing {shown} of {total} — refine your search",
+  loadingOptions: "Loading options from all pages…",
+  min: "From",
+  max: "To",
+  page: "Page {page}/{pages}",
+  prev: "Prev",
+  next: "Next",
+  sortAsc: "Sort ascending",
+  sortDesc: "Sort descending",
+  groupBy: "Group by {label}",
+  ungroup: "Remove grouping by {label}",
+  clearGroups: "Clear grouping",
+  perPage: "Per page",
+  selectAll: "(Select all)",
+  selectAllResults: "(Select results)"
+};
+const Funnel = ({ size = 12, className }) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", className, children: /* @__PURE__ */ jsx("path", { d: "M22 3H2l8 9.46V19l4 2v-8.54L22 3z" }) });
+const Layers = ({ size = 11, 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.5", strokeLinecap: "round", strokeLinejoin: "round", className, children: [
+  /* @__PURE__ */ jsx("path", { d: "m12 2 9 5-9 5-9-5 9-5z" }),
+  /* @__PURE__ */ jsx("path", { d: "m3 17 9 5 9-5M3 12l9 5 9-5" })
+] });
+const Caret = ({ size = 11, className }) => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "3", strokeLinecap: "round", strokeLinejoin: "round", className, children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" }) });
+const EMPTY = "—";
+const MAX_OPCOES_FILTRO = 50;
+const DEFAULT_STICKY_WIDTH = 160;
+const COLLATOR = new Intl.Collator(void 0, { numeric: true });
+function rawValue(row, col) {
+  if (col.value) {
+    const v2 = col.value(row);
+    return v2 == null ? null : v2;
+  }
+  const v = row[col.key];
+  if (v == null) return null;
+  if (typeof v === "number" || typeof v === "string") return v;
+  return String(v);
+}
+function filterKey(row, col) {
+  const v = rawValue(row, col);
+  return v == null || v === "" ? EMPTY : String(v);
+}
+function timestampDeData(v) {
+  if (v == null || v === "") return NaN;
+  if (v instanceof Date) return v.getTime();
+  const s = String(v).trim();
+  const m = /^(\d{1,2})[/-](\d{1,2})[/-](\d{4})/.exec(s);
+  if (m) return Date.UTC(Number(m[3]), Number(m[2]) - 1, Number(m[1]));
+  const t = new Date(s).getTime();
+  return Number.isNaN(t) ? NaN : t;
+}
+function compare(a, b, type) {
+  if (a == null && b == null) return 0;
+  if (a == null) return 1;
+  if (b == null) return -1;
+  if (type === "number") return Number(a) - Number(b);
+  if (type === "date") return timestampDeData(a) - timestampDeData(b);
+  return COLLATOR.compare(String(a), String(b));
+}
+function valorParaIntervalo(row, col) {
+  const v = rawValue(row, col);
+  return col.sortType === "date" ? timestampDeData(v) : Number(v);
+}
+function toCsv(columns, rows) {
+  const esc = (v) => {
+    const s = v == null ? "" : String(v);
+    return /[",\n]/.test(s) ? `"${s.replace(/"/g, '""')}"` : s;
+  };
+  const head = columns.map((c) => esc(c.label)).join(",");
+  const body = rows.map((r) => columns.map((c) => esc(rawValue(r, c))).join(",")).join("\n");
+  return `${head}
+${body}`;
+}
+const ordenarRotulos = (a, b) => a === EMPTY ? 1 : b === EMPTY ? -1 : COLLATOR.compare(a, b);
+const SEM_CRUZAMENTO = [];
+const escaparRegex = (s) => s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+function pesquisaCuringa(q) {
+  let fonte = "";
+  let literal = "";
+  let temCuringa = false;
+  for (let i = 0; i < q.length; i++) {
+    const c = q[i];
+    const seguinte = q[i + 1];
+    if (c === "~" && (seguinte === "*" || seguinte === "?" || seguinte === "~")) {
+      fonte += escaparRegex(seguinte);
+      literal += seguinte;
+      i++;
+      continue;
+    }
+    if (c === "*" || c === "?") {
+      fonte += c === "*" ? ".*" : ".";
+      literal += c;
+      temCuringa = true;
+      continue;
+    }
+    fonte += escaparRegex(c);
+    literal += c;
+  }
+  if (!temCuringa) return (v) => v.includes(literal);
+  const rx = new RegExp(`^${fonte}$`);
+  return (v) => rx.test(v);
+}
+function DataTable({
+  columns,
+  data,
+  allData,
+  onDataNeeded,
+  isAllDataLoading,
+  alwaysClient,
+  onClientModeChange,
+  rowKey,
+  onRowClick,
+  onRowDoubleClick,
+  rowClassName,
+  isLoading,
+  isError,
+  maxHeight = "70vh",
+  pageSize,
+  pageSizeOptions,
+  selectable,
+  onSelectionChange,
+  clearSelectionTrigger,
+  storageKey,
+  defaultMaxColumnWidth = 360,
+  resizableColumns = true,
+  sortFromFilter = true,
+  filterMode = "excel",
+  defaultSortKey,
+  defaultSortDir,
+  viewRef,
+  exportFileName,
+  onExport,
+  extraToolbar,
+  emptySubLabel,
+  emptyIcon,
+  labels,
+  totalRow = false,
+  defaultGroupBy
+}) {
+  const L = { ...DEFAULT_LABELS, ...labels };
+  const [larguras, setLarguras] = useState(() => {
+    if (!storageKey) return {};
+    try {
+      return JSON.parse(localStorage.getItem(`dt_widths_${storageKey}`) ?? "{}");
+    } catch {
+      return {};
+    }
+  });
+  useEffect(() => {
+    if (!storageKey) return;
+    try {
+      localStorage.setItem(`dt_widths_${storageKey}`, JSON.stringify(larguras));
+    } catch {
+    }
+  }, [larguras, storageKey]);
+  const larguraMax = (c) => larguras[c.key] ?? c.maxWidth ?? (defaultMaxColumnWidth > 0 ? defaultMaxColumnWidth : void 0);
+  const iniciarResize = (e, key) => {
+    e.preventDefault();
+    e.stopPropagation();
+    const th = e.currentTarget.parentElement;
+    const x0 = e.clientX;
+    const w0 = th?.getBoundingClientRect().width ?? 120;
+    const mover = (ev) => setLarguras((l) => ({ ...l, [key]: Math.max(60, Math.round(w0 + ev.clientX - x0)) }));
+    const parar = () => {
+      window.removeEventListener("mousemove", mover);
+      window.removeEventListener("mouseup", parar);
+      document.body.style.cursor = "";
+    };
+    document.body.style.cursor = "col-resize";
+    window.addEventListener("mousemove", mover);
+    window.addEventListener("mouseup", parar);
+  };
+  const reporLargura = (key) => setLarguras((l) => {
+    const n = { ...l };
+    delete n[key];
+    return n;
+  });
+  const lerSessao = (sufixo) => {
+    if (!storageKey) return void 0;
+    try {
+      const raw = sessionStorage.getItem(`dt_${sufixo}_${storageKey}`);
+      return raw === null ? void 0 : JSON.parse(raw);
+    } catch {
+      return void 0;
+    }
+  };
+  const [sort, setSort] = useState(() => {
+    const guardada = lerSessao("sort");
+    if (guardada !== void 0) return guardada && columns.some((c) => c.key === guardada.key) ? guardada : null;
+    return defaultSortKey ? { key: defaultSortKey, dir: defaultSortDir === "desc" ? -1 : 1 } : null;
+  });
+  const [columnFilters, setColumnFilters] = useState(() => {
+    if (!storageKey) return {};
+    try {
+      const raw = sessionStorage.getItem(`dt_filters_${storageKey}`);
+      if (!raw) return {};
+      const parsed = JSON.parse(raw);
+      return Object.fromEntries(Object.entries(parsed).map(([k, v]) => [k, new Set(v)]));
+    } catch {
+      return {};
+    }
+  });
+  const [rangeFilters, setRangeFilters] = useState(() => {
+    if (!storageKey) return {};
+    try {
+      const raw = sessionStorage.getItem(`dt_ranges_${storageKey}`);
+      return raw ? JSON.parse(raw) : {};
+    } catch {
+      return {};
+    }
+  });
+  const [groupByKeys, setGroupByKeys] = useState(
+    () => (lerSessao("group") ?? defaultGroupBy ?? []).filter((k) => columns.some((c) => c.key === k))
+  );
+  const [collapsedGroups, setCollapsedGroups] = useState(/* @__PURE__ */ new Set());
+  const [selectedKeys, setSelectedKeys] = useState(/* @__PURE__ */ new Set());
+  const [openFilter, setOpenFilter] = useState(null);
+  const [filterSearch, setFilterSearch] = useState("");
+  const filterRefs = useRef(/* @__PURE__ */ new Map());
+  const popupRef = useRef(null);
+  const [popupPos, setPopupPos] = useState(null);
+  const isGrouped = groupByKeys.length > 0;
+  useEffect(() => {
+    if (!storageKey) return;
+    const serializavel = Object.fromEntries(Object.entries(columnFilters).map(([k, v]) => [k, Array.from(v)]));
+    try {
+      sessionStorage.setItem(`dt_filters_${storageKey}`, JSON.stringify(serializavel));
+      sessionStorage.setItem(`dt_ranges_${storageKey}`, JSON.stringify(rangeFilters));
+      sessionStorage.setItem(`dt_sort_${storageKey}`, JSON.stringify(sort));
+      sessionStorage.setItem(`dt_group_${storageKey}`, JSON.stringify(groupByKeys));
+    } catch {
+    }
+  }, [columnFilters, rangeFilters, sort, groupByKeys, storageKey]);
+  useLayoutEffect(() => {
+    if (!openFilter) {
+      setPopupPos(null);
+      return;
+    }
+    const recalcular = () => {
+      const el = filterRefs.current.get(openFilter);
+      if (!el) return;
+      const r = el.getBoundingClientRect();
+      const largura = Math.min(288, window.innerWidth * 0.8);
+      const left = Math.max(8, Math.min(r.left, window.innerWidth - largura - 8));
+      setPopupPos({ top: r.bottom + 6, left });
+    };
+    recalcular();
+    window.addEventListener("scroll", recalcular, true);
+    window.addEventListener("resize", recalcular);
+    return () => {
+      window.removeEventListener("scroll", recalcular, true);
+      window.removeEventListener("resize", recalcular);
+    };
+  }, [openFilter]);
+  useEffect(() => {
+    const onDown = (e) => {
+      if (!openFilter) return;
+      const alvo = e.target;
+      const botao = filterRefs.current.get(openFilter);
+      if (botao?.contains(alvo) || popupRef.current?.contains(alvo)) return;
+      setOpenFilter(null);
+      setFilterSearch("");
+    };
+    document.addEventListener("mousedown", onDown);
+    return () => document.removeEventListener("mousedown", onDown);
+  }, [openFilter]);
+  const resolverValor = (key) => {
+    const col = columns.find((c) => c.key === key);
+    if (col) return (row) => rawValue(row, col);
+    for (const c of columns) {
+      const ef = c.extraFilters?.find((f) => f.key === key);
+      if (ef) return ef.value;
+    }
+    return void 0;
+  };
+  const rotuloDe = (fn, row) => {
+    const v = fn(row);
+    return v == null || v === "" ? EMPTY : String(v);
+  };
+  const modoExcel = filterMode === "excel";
+  const activeFilters = useMemo(
+    () => Object.entries(columnFilters).filter(([, s]) => s && (modoExcel || s.size > 0)),
+    [columnFilters, modoExcel]
+  );
+  const activeRanges = useMemo(
+    () => Object.entries(rangeFilters).filter(([, r]) => r && (r.min != null || r.max != null)),
+    [rangeFilters]
+  );
+  const hasActiveFilters = activeFilters.length > 0 || activeRanges.length > 0;
+  const isClientMode = !!allData && (!!alwaysClient || hasActiveFilters || !!sort || isGrouped);
+  const effectiveData = isClientMode ? allData : data;
+  useEffect(() => {
+    if (!allData && (hasActiveFilters || sort || isGrouped)) onDataNeeded?.();
+  }, [allData, hasActiveFilters, sort, isGrouped]);
+  useEffect(() => {
+    onClientModeChange?.(isClientMode);
+  }, [isClientMode]);
+  useEffect(() => {
+    if (clearSelectionTrigger === void 0) return;
+    setSelectedKeys(/* @__PURE__ */ new Set());
+  }, [clearSelectionTrigger]);
+  const chaveFiltrosCol = JSON.stringify(
+    Object.entries(columnFilters).map(([k, v]) => [k, [...v].sort()]).sort()
+  );
+  useEffect(() => {
+    if (!selectable) return;
+    setSelectedKeys(/* @__PURE__ */ new Set());
+    onSelectionChange?.(/* @__PURE__ */ new Set());
+  }, [chaveFiltrosCol]);
+  const cruzFiltros = modoExcel ? SEM_CRUZAMENTO : activeFilters;
+  const cruzRanges = modoExcel ? SEM_CRUZAMENTO : activeRanges;
+  const distinctValues = (key) => {
+    const valueFn = resolverValor(key);
+    if (!valueFn) return [];
+    let fonte = allData ?? data;
+    for (const [outraKey, escolhidos] of cruzFiltros) {
+      if (outraKey === key) continue;
+      const outraFn = resolverValor(outraKey);
+      if (!outraFn) continue;
+      fonte = fonte.filter((row) => escolhidos.has(rotuloDe(outraFn, row)));
+    }
+    for (const [outraKey, r] of cruzRanges) {
+      if (outraKey === key) continue;
+      const col = columns.find((c) => c.key === outraKey);
+      if (!col) continue;
+      fonte = fonte.filter((row) => {
+        const n = valorParaIntervalo(row, col);
+        if (!Number.isFinite(n)) return false;
+        if (r.min != null && n < r.min) return false;
+        if (r.max != null && n > r.max) return false;
+        return true;
+      });
+    }
+    const set = /* @__PURE__ */ new Set();
+    fonte.forEach((row) => set.add(rotuloDe(valueFn, row)));
+    return Array.from(set).sort(ordenarRotulos);
+  };
+  const openFilterOptions = useMemo(() => {
+    if (!openFilter) return [];
+    return distinctValues(openFilter);
+  }, [openFilter, data, allData, columns, cruzFiltros, cruzRanges]);
+  const openFilterOptionsLower = useMemo(() => openFilterOptions.map((v) => v.toLowerCase()), [openFilterOptions]);
+  const opcoesVisiveis = useMemo(() => {
+    const q = filterSearch.toLowerCase();
+    const corresponde = q ? modoExcel ? pesquisaCuringa(q) : (v) => v.includes(q) : null;
+    const opts = [];
+    const correspondentes = [];
+    for (let i = 0; i < openFilterOptions.length; i++) {
+      if (corresponde && !corresponde(openFilterOptionsLower[i])) continue;
+      correspondentes.push(openFilterOptions[i]);
+      if (opts.length < MAX_OPCOES_FILTRO) opts.push(openFilterOptions[i]);
+    }
+    return { opts, total: correspondentes.length, correspondentes };
+  }, [openFilterOptions, openFilterOptionsLower, filterSearch, modoExcel]);
+  const filtrar = (rows) => {
+    if (activeFilters.length === 0 && activeRanges.length === 0) return rows;
+    return rows.filter(
+      (row) => activeFilters.every(([key, sel]) => {
+        const fn = resolverValor(key);
+        return fn ? sel.has(rotuloDe(fn, row)) : true;
+      }) && activeRanges.every(([key, r]) => {
+        const col = columns.find((c) => c.key === key);
+        if (!col) return true;
+        const n = valorParaIntervalo(row, col);
+        if (!Number.isFinite(n)) return false;
+        if (r.min != null && n < r.min) return false;
+        if (r.max != null && n > r.max) return false;
+        return true;
+      })
+    );
+  };
+  const ordenar = (rows) => {
+    if (!sort) return rows;
+    const col = columns.find((c) => c.key === sort.key);
+    if (!col) return rows;
+    return [...rows].sort((a, b) => compare(rawValue(a, col), rawValue(b, col), col.sortType) * sort.dir);
+  };
+  const filtered = useMemo(
+    () => filtrar(effectiveData),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [effectiveData, activeFilters, activeRanges, columns]
+  );
+  const sorted = useMemo(
+    () => ordenar(filtered),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [filtered, sort, columns]
+  );
+  const alternarGrupo = (key) => {
+    if (!allData) onDataNeeded?.();
+    setGroupByKeys((prev) => prev.includes(key) ? prev.filter((k) => k !== key) : [...prev, key]);
+    setCollapsedGroups(/* @__PURE__ */ new Set());
+  };
+  const removerGrupo = (key) => {
+    setGroupByKeys((prev) => prev.filter((k) => k !== key));
+    setCollapsedGroups(/* @__PURE__ */ new Set());
+  };
+  const limparGrupos = () => {
+    setGroupByKeys([]);
+    setCollapsedGroups(/* @__PURE__ */ new Set());
+  };
+  const alternarColapso = (path) => setCollapsedGroups((prev) => {
+    const n = new Set(prev);
+    if (n.has(path)) n.delete(path);
+    else n.add(path);
+    return n;
+  });
+  const construirGrupos = (items, keys, nivel, pathPai) => {
+    if (nivel >= keys.length) return [];
+    const key = keys[nivel];
+    const col = columns.find((c) => c.key === key);
+    if (!col) return [];
+    const ordemFn = col.groupSortKey;
+    const mapa = /* @__PURE__ */ new Map();
+    items.forEach((item) => {
+      const rotulo = filterKey(item, col);
+      const ordem = ordemFn ? String(ordemFn(item) ?? "") : rotulo;
+      const atual = mapa.get(rotulo);
+      if (atual) atual.items.push(item);
+      else mapa.set(rotulo, { ordem, items: [item] });
+    });
+    return Array.from(mapa.entries()).sort(([ra, a], [rb, b]) => ordemFn ? COLLATOR.compare(a.ordem, b.ordem) : ordenarRotulos(ra, rb)).map(([val, { ordem, items: itensGrupo }]) => {
+      const path = pathPai ? `${pathPai}\0${val}` : val;
+      return { val, ordem, path, items: itensGrupo, filhos: construirGrupos(itensGrupo, keys, nivel + 1, path) };
+    });
+  };
+  const grupos = useMemo(
+    () => isGrouped ? construirGrupos(sorted, groupByKeys, 0, "") : [],
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [sorted, groupByKeys, isGrouped, columns]
+  );
+  const [page, setPage] = useState(1);
+  const [pageSizeAtual, setPageSizeAtual] = useState(pageSize);
+  useEffect(() => setPageSizeAtual(pageSize), [pageSize]);
+  useEffect(() => {
+    setPage(1);
+  }, [columnFilters, rangeFilters, sort, groupByKeys, pageSizeAtual]);
+  const paginando = !!pageSizeAtual && !isGrouped;
+  const totalPages = paginando ? Math.max(1, Math.ceil(sorted.length / pageSizeAtual)) : 1;
+  const currentPage = Math.min(page, totalPages);
+  const pageData = paginando ? sorted.slice((currentPage - 1) * pageSizeAtual, currentPage * pageSizeAtual) : sorted;
+  const chaveDe = (row, i) => String(rowKey ? rowKey(row, i) : i);
+  const indicePorLinha = useMemo(() => {
+    const m = /* @__PURE__ */ new Map();
+    sorted.forEach((r, i) => m.set(r, i));
+    return m;
+  }, [sorted]);
+  const visibleKeys = useMemo(
+    () => pageData.map((row, i) => chaveDe(row, i)),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [pageData, rowKey]
+  );
+  const alternarLinha = (key) => setSelectedKeys((prev) => {
+    const next = new Set(prev);
+    if (next.has(key)) next.delete(key);
+    else next.add(key);
+    onSelectionChange?.(next);
+    return next;
+  });
+  const alternarTodas = () => setSelectedKeys((prev) => {
+    const todasMarcadas = visibleKeys.length > 0 && visibleKeys.every((k) => prev.has(k));
+    const next = new Set(prev);
+    if (todasMarcadas) visibleKeys.forEach((k) => next.delete(k));
+    else visibleKeys.forEach((k) => next.add(k));
+    onSelectionChange?.(next);
+    return next;
+  });
+  const todasVisiveisMarcadas = visibleKeys.length > 0 && visibleKeys.every((k) => selectedKeys.has(k));
+  const algumaVisivelMarcada = visibleKeys.some((k) => selectedKeys.has(k)) && !todasVisiveisMarcadas;
+  useEffect(() => {
+    if (!viewRef) return;
+    viewRef.current = {
+      apply: (rows) => ordenar(filtrar(rows)),
+      rows: sorted,
+      hasFilters: hasActiveFilters,
+      precisaDataset: hasActiveFilters || !!sort || isGrouped,
+      estado: () => ({
+        columnFilters: Object.fromEntries(activeFilters.map(([k, v]) => [k, [...v]])),
+        rangeFilters: Object.fromEntries(activeRanges),
+        sortKey: sort?.key ?? null,
+        sortDir: sort ? sort.dir === 1 ? "asc" : "desc" : "asc",
+        groupBy: groupByKeys
+      }),
+      repor: (e) => {
+        setColumnFilters(Object.fromEntries(Object.entries(e?.columnFilters ?? {}).map(([k, v]) => [k, new Set(v)])));
+        setRangeFilters(e?.rangeFilters ?? {});
+        setSort(e?.sortKey ? { key: e.sortKey, dir: e.sortDir === "desc" ? -1 : 1 } : null);
+        setGroupByKeys(e?.groupBy ?? []);
+        setCollapsedGroups(/* @__PURE__ */ new Set());
+        const precisaTudo = !!e?.sortKey || !!e?.groupBy?.length || Object.keys(e?.columnFilters ?? {}).length > 0 || Object.keys(e?.rangeFilters ?? {}).length > 0;
+        if (precisaTudo && !allData) onDataNeeded?.();
+      }
+    };
+  });
+  const toggleSort = (key) => {
+    if (!allData) onDataNeeded?.();
+    setSort((s) => s?.key === key ? s.dir === 1 ? { key, dir: -1 } : null : { key, dir: 1 });
+  };
+  const selecaoDaColuna = (key) => new Set(columnFilters[key] ?? (modoExcel ? openFilterOptions : []));
+  const aplicarSelecao = (key, sel) => setColumnFilters((prev) => {
+    const proximo = { ...prev };
+    if (modoExcel && sel.size === openFilterOptions.length) delete proximo[key];
+    else proximo[key] = sel;
+    return proximo;
+  });
+  const toggleFilterValue = (key, val) => {
+    if (!allData) onDataNeeded?.();
+    const sel = selecaoDaColuna(key);
+    if (sel.has(val)) sel.delete(val);
+    else sel.add(val);
+    aplicarSelecao(key, sel);
+  };
+  const alternarTodos = (key, marcar) => {
+    if (!allData) onDataNeeded?.();
+    const sel = selecaoDaColuna(key);
+    for (const v of opcoesVisiveis.correspondentes) {
+      if (marcar) sel.add(v);
+      else sel.delete(v);
+    }
+    aplicarSelecao(key, sel);
+  };
+  const setRange = (key, campo, valor, tipo) => {
+    if (!allData) onDataNeeded?.();
+    setRangeFilters((prev) => {
+      const atual = { ...prev[key] ?? {} };
+      const n = tipo === "date" ? timestampDeData(valor) + (campo === "max" ? 86399999 : 0) : Number(valor);
+      if (valor === "" || !Number.isFinite(n)) delete atual[campo];
+      else atual[campo] = n;
+      const next = { ...prev };
+      if (atual.min == null && atual.max == null) delete next[key];
+      else next[key] = atual;
+      return next;
+    });
+  };
+  const clearColumnFilter = (key) => {
+    setColumnFilters((prev) => {
+      const n = { ...prev };
+      delete n[key];
+      return n;
+    });
+    setRangeFilters((prev) => {
+      const n = { ...prev };
+      delete n[key];
+      return n;
+    });
+  };
+  const clearAllFilters = () => {
+    setColumnFilters({});
+    setRangeFilters({});
+  };
+  const temIntervalo = (key) => {
+    const r = rangeFilters[key];
+    return !!r && (r.min != null || r.max != null);
+  };
+  const temFiltro = (key) => (modoExcel ? columnFilters[key] !== void 0 : (columnFilters[key]?.size ?? 0) > 0) || temIntervalo(key);
+  const handleExport = () => {
+    if (onExport) return onExport(sorted);
+    const csv = toCsv(columns, sorted);
+    const blob = new Blob([`\uFEFF${csv}`], { type: "text/csv;charset=utf-8;" });
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = `${exportFileName}.csv`;
+    a.click();
+    URL.revokeObjectURL(url);
+  };
+  const alignClass = (a) => a === "right" ? "text-right" : a === "center" ? "text-center" : "text-left";
+  const ePresaAEsquerda = (c) => c.sticky === true || c.sticky === "left";
+  const stickyLeft = useMemo(() => {
+    const offsets = {};
+    let acc = selectable ? 40 : 0;
+    for (const c of columns) {
+      if (!ePresaAEsquerda(c)) continue;
+      offsets[c.key] = acc;
+      acc += c.width ?? DEFAULT_STICKY_WIDTH;
+    }
+    return offsets;
+  }, [columns, selectable]);
+  const stickyRight = useMemo(() => {
+    const offsets = {};
+    let acc = 0;
+    for (let i = columns.length - 1; i >= 0; i--) {
+      const c = columns[i];
+      if (c.sticky !== "right") continue;
+      offsets[c.key] = acc;
+      acc += c.width ?? DEFAULT_STICKY_WIDTH;
+    }
+    return offsets;
+  }, [columns]);
+  const estiloPreso = (c) => {
+    if (ePresaAEsquerda(c)) return { left: stickyLeft[c.key] };
+    if (c.sticky === "right") return { right: stickyRight[c.key] };
+    return void 0;
+  };
+  const nColunas = columns.length + (selectable ? 1 : 0);
+  const aEsperarDataset = !allData && !!isAllDataLoading && (hasActiveFilters || !!sort || isGrouped);
+  const linhasBase = allData ?? data;
+  const semDados = useMemo(
+    () => new Set(columns.filter((c) => !linhasBase.some((r) => rawValue(r, c) !== null)).map((c) => c.key)),
+    [columns, linhasBase]
+  );
+  const filtravel = (c) => c.filterable ?? !semDados.has(c.key);
+  const agrupavel = (c) => c.groupable ?? (!semDados.has(c.key) && !c.groupAggregate && (!c.sortType || c.sortType === "text"));
+  if (isLoading) {
+    return /* @__PURE__ */ jsx("div", { className: "py-16 text-center text-sm font-bold uppercase tracking-widest text-slate-400", children: L.loading });
+  }
+  if (isError) {
+    return /* @__PURE__ */ jsx("div", { className: "py-16 text-center text-sm font-bold uppercase tracking-widest text-red-400", children: L.error });
+  }
+  const renderPopup = (key, col, tituloExtra) => {
+    const { opts, total: totalOpcoes } = opcoesVisiveis;
+    const sel = columnFilters[key];
+    const isFiltered = temFiltro(key);
+    const podeOrdenar = !!sortFromFilter && !!col && col.sortable !== false;
+    const temRange = !!col && (col.sortType === "number" || col.sortType === "date");
+    return createPortal(
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          ref: popupRef,
+          style: { position: "fixed", top: popupPos.top, left: popupPos.left },
+          className: "z-[100] w-72 max-w-[80vw] bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-700 shadow-2xl rounded-xl overflow-hidden",
+          children: [
+            tituloExtra && /* @__PURE__ */ jsx("div", { className: "px-3 pt-2.5 pb-2 border-b border-slate-100 dark:border-slate-800", children: /* @__PURE__ */ jsx("span", { className: "text-[9px] font-black uppercase tracking-widest text-proef-blue dark:text-proef-turquoise", children: tituloExtra }) }),
+            !allData && isAllDataLoading && // As opções à vista ainda são só as de `data`. Dizê-lo é melhor do que deixar
+            // escolher de uma lista incompleta.
+            /* @__PURE__ */ jsx("div", { className: "px-2 py-1.5 bg-amber-50 dark:bg-amber-500/10 border-b border-amber-100 dark:border-amber-500/20 text-[10px] text-amber-700 dark:text-amber-300", children: L.loadingOptions }),
+            podeOrdenar && /* @__PURE__ */ jsxs("div", { className: "border-b border-slate-100 dark:border-slate-800 p-1.5 space-y-0.5", children: [
+              /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  onClick: () => {
+                    if (!allData) onDataNeeded?.();
+                    setSort({ key, dir: 1 });
+                  },
+                  className: `appearance-none bg-transparent border-0 cursor-pointer w-full flex items-center gap-2 px-2.5 py-1.5 text-[11px] font-semibold text-left hover:bg-slate-50 dark:hover:bg-slate-800 ${sort?.key === key && sort.dir === 1 ? "text-proef-blue dark:text-proef-turquoise bg-slate-50 dark:bg-slate-800" : "text-slate-600 dark:text-slate-300"}`,
+                  children: [
+                    "▲ ",
+                    L.sortAsc
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs(
+                "button",
+                {
+                  onClick: () => {
+                    if (!allData) onDataNeeded?.();
+                    setSort({ key, dir: -1 });
+                  },
+                  className: `appearance-none bg-transparent border-0 cursor-pointer w-full flex items-center gap-2 px-2.5 py-1.5 text-[11px] font-semibold text-left hover:bg-slate-50 dark:hover:bg-slate-800 ${sort?.key === key && sort.dir === -1 ? "text-proef-blue dark:text-proef-turquoise bg-slate-50 dark:bg-slate-800" : "text-slate-600 dark:text-slate-300"}`,
+                  children: [
+                    "▼ ",
+                    L.sortDesc
+                  ]
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "p-2", children: [
+              temRange && // Intervalo antes da lista: numa coluna numérica ou de datas é o que se procura
+              // ("acima de 30 dias", "a partir de julho"), não um valor exato numa lista de dezenas.
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 mb-2", children: [
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: col.sortType === "date" ? "date" : "number",
+                    defaultValue: "",
+                    onChange: (e) => setRange(key, "min", e.target.value, col.sortType),
+                    placeholder: L.min,
+                    title: L.min,
+                    className: "w-1/2 bg-slate-50 dark:bg-slate-800 dark:text-slate-100 dark:[color-scheme:dark] border border-slate-200 dark:border-slate-700 rounded-lg px-2 py-1.5 text-xs outline-none focus:border-proef-blue dark:focus:border-proef-turquoise"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  "input",
+                  {
+                    type: col.sortType === "date" ? "date" : "number",
+                    defaultValue: "",
+                    onChange: (e) => setRange(key, "max", e.target.value, col.sortType),
+                    placeholder: L.max,
+                    title: L.max,
+                    className: "w-1/2 bg-slate-50 dark:bg-slate-800 dark:text-slate-100 dark:[color-scheme:dark] border border-slate-200 dark:border-slate-700 rounded-lg px-2 py-1.5 text-xs outline-none focus:border-proef-blue dark:focus:border-proef-turquoise"
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ jsx(
+                "input",
+                {
+                  autoFocus: true,
+                  value: filterSearch,
+                  onChange: (e) => setFilterSearch(e.target.value),
+                  placeholder: L.search,
+                  className: "w-full bg-slate-50 dark:bg-slate-800 dark:text-slate-100 border border-slate-200 dark:border-slate-700 rounded-lg px-2 py-1.5 text-xs outline-none focus:border-proef-blue dark:focus:border-proef-turquoise mb-2"
+                }
+              ),
+              /* @__PURE__ */ jsxs("div", { className: "max-h-64 overflow-y-auto overflow-x-hidden space-y-0.5", children: [
+                modoExcel && opts.length > 0 && (() => {
+                  const marcados = opcoesVisiveis.correspondentes.filter((v) => sel ? sel.has(v) : true).length;
+                  const todos = marcados === opcoesVisiveis.correspondentes.length;
+                  const alguns = marcados > 0 && !todos;
+                  return /* @__PURE__ */ jsxs(
+                    "button",
+                    {
+                      onClick: () => alternarTodos(key, !todos),
+                      className: "appearance-none bg-transparent border-0 border-b border-slate-100 dark:border-slate-800 cursor-pointer w-full flex items-center gap-2 px-1.5 py-1 mb-0.5 hover:bg-slate-50 dark:hover:bg-slate-800 text-left normal-case tracking-normal",
+                      children: [
+                        /* @__PURE__ */ jsxs(
+                          "span",
+                          {
+                            className: `w-3.5 h-3.5 flex items-center justify-center border shrink-0 rounded ${todos || alguns ? "bg-proef-navy dark:bg-proef-turquoise border-proef-navy dark:border-proef-turquoise text-white dark:text-proef-navy" : "border-slate-300 dark:border-slate-600"}`,
+                            children: [
+                              todos && /* @__PURE__ */ jsx("span", { className: "text-[9px] leading-none", children: "✓" }),
+                              alguns && /* @__PURE__ */ jsx("span", { className: "text-[9px] leading-none", children: "–" })
+                            ]
+                          }
+                        ),
+                        /* @__PURE__ */ jsx("span", { className: "text-xs text-slate-700 dark:text-slate-200 font-semibold break-words", children: filterSearch ? L.selectAllResults : L.selectAll })
+                      ]
+                    }
+                  );
+                })(),
+                opts.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-[11px] text-slate-400 text-center py-3", children: L.noOptions }) : opts.map((v) => {
+                  const checked = sel ? sel.has(v) : modoExcel;
+                  return /* @__PURE__ */ jsxs(
+                    "button",
+                    {
+                      onClick: () => toggleFilterValue(key, v),
+                      className: "appearance-none bg-transparent border-0 cursor-pointer w-full flex items-center gap-2 px-1.5 py-1 hover:bg-slate-50 dark:hover:bg-slate-800 text-left normal-case tracking-normal",
+                      children: [
+                        /* @__PURE__ */ jsx(
+                          "span",
+                          {
+                            className: `w-3.5 h-3.5 flex items-center justify-center border shrink-0 rounded ${checked ? "bg-proef-navy dark:bg-proef-turquoise border-proef-navy dark:border-proef-turquoise text-white dark:text-proef-navy" : "border-slate-300 dark:border-slate-600"}`,
+                            children: checked && /* @__PURE__ */ jsx("span", { className: "text-[9px] leading-none", children: "✓" })
+                          }
+                        ),
+                        /* @__PURE__ */ jsx("span", { className: "text-xs text-slate-700 dark:text-slate-200 font-normal break-words", children: v })
+                      ]
+                    },
+                    v
+                  );
+                })
+              ] }),
+              totalOpcoes > opts.length && /* @__PURE__ */ jsx("p", { className: "text-[10.5px] text-slate-400 text-center pt-2", children: L.moreOptions.replace("{shown}", String(opts.length)).replace("{total}", String(totalOpcoes)) }),
+              isFiltered && /* @__PURE__ */ jsx(
+                "button",
+                {
+                  onClick: () => clearColumnFilter(key),
+                  className: "appearance-none bg-transparent border-0 border-t border-slate-100 dark:border-slate-800 cursor-pointer w-full mt-2 pt-2 text-[10px] font-black uppercase tracking-wider text-red-400 hover:text-red-500",
+                  children: L.clear
+                }
+              )
+            ] })
+          ]
+        }
+      ),
+      document.body
+    );
+  };
+  const botaoFunil = (key, col, extra) => {
+    const isOpen = openFilter === key;
+    const isFiltered = temFiltro(key);
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "relative",
+        ref: (el) => {
+          if (el) filterRefs.current.set(key, el);
+          else filterRefs.current.delete(key);
+        },
+        children: [
+          /* @__PURE__ */ jsx(
+            "button",
+            {
+              onClick: () => {
+                if (!isOpen && !allData) onDataNeeded?.();
+                setOpenFilter(isOpen ? null : key);
+                setFilterSearch("");
+              },
+              className: `appearance-none border-0 bg-transparent cursor-pointer p-0.5 transition-colors ${extra ? isFiltered || isOpen ? "text-violet-600 dark:text-violet-300" : "text-slate-300 dark:text-slate-600 hover:text-slate-500 dark:hover:text-slate-300" : isFiltered || isOpen ? "text-proef-turquoise" : "text-slate-300 dark:text-slate-600 hover:text-slate-500 dark:hover:text-slate-300"}`,
+              title: extra?.label ?? col?.label,
+              children: /* @__PURE__ */ jsx(Funnel, { size: extra ? 10 : 11, className: isFiltered ? "fill-current" : "" })
+            }
+          ),
+          isOpen && popupPos && renderPopup(key, col, extra?.label)
+        ]
+      },
+      key
+    );
+  };
+  const renderLinha = (row, i) => {
+    const k = chaveDe(row, i);
+    const marcada = selectable && selectedKeys.has(k);
+    return /* @__PURE__ */ jsxs(
+      "tr",
+      {
+        onClick: () => onRowClick?.(row),
+        onDoubleClick: () => onRowDoubleClick?.(row),
+        className: `group even:bg-slate-50/50 dark:even:bg-slate-800/40 hover:bg-slate-100/70 dark:hover:bg-slate-800/70 transition-colors ${onRowClick || onRowDoubleClick ? "cursor-pointer" : ""} ${marcada ? "bg-proef-turquoise/5" : ""} ${rowClassName?.(row) ?? ""}`,
+        children: [
+          selectable && /* @__PURE__ */ jsx(
+            "td",
+            {
+              className: "px-3 py-2.5 border-b border-slate-100 dark:border-slate-800 w-10",
+              onClick: (e) => {
+                e.stopPropagation();
+                alternarLinha(k);
+              },
+              children: /* @__PURE__ */ jsx(
+                "span",
+                {
+                  className: `w-4 h-4 flex items-center justify-center border transition-colors rounded ${marcada ? "bg-proef-navy dark:bg-proef-turquoise border-proef-navy dark:border-proef-turquoise text-white dark:text-proef-navy" : "border-slate-300 dark:border-slate-600 hover:border-slate-400 dark:hover:border-slate-500"}`,
+                  children: marcada && /* @__PURE__ */ jsx("span", { className: "text-[9px] leading-none", children: "✓" })
+                }
+              )
+            }
+          ),
+          columns.map((c) => /* @__PURE__ */ jsx(
+            "td",
+            {
+              style: estiloPreso(c),
+              className: `px-3 py-2.5 border-b border-slate-100 dark:border-slate-800 whitespace-nowrap ${alignClass(c.align)} ${c.sticky ? `sticky z-[1] ${c.sticky === "right" ? "border-l border-slate-200 dark:border-slate-700" : ""} ${i % 2 === 1 ? "bg-slate-50 dark:bg-slate-800" : "bg-white dark:bg-slate-900"} group-hover:bg-slate-100 dark:group-hover:bg-slate-800` : ""} ${c.cellClassName ?? ""}`,
+              children: (() => {
+                const conteudo = c.render ? c.render(row) : rawValue(row, c) ?? /* @__PURE__ */ jsx("span", { className: "text-slate-400", children: EMPTY });
+                const max = larguraMax(c);
+                if (!max) return conteudo;
+                const v = rawValue(row, c);
+                return /* @__PURE__ */ jsx("div", { className: "overflow-hidden text-ellipsis", style: { maxWidth: max, width: larguras[c.key] }, title: v !== null && v !== void 0 ? String(v) : void 0, children: conteudo });
+              })()
+            },
+            c.key
+          ))
+        ]
+      },
+      k
+    );
+  };
+  const primeiraComValor = columns.findIndex((c) => !!c.groupAggregate);
+  const colunasComValor = primeiraComValor >= 0 ? columns.slice(primeiraComValor) : [];
+  const colunasRotuloGrupo = primeiraComValor >= 0 ? primeiraComValor + (selectable ? 1 : 0) : nColunas;
+  const renderGrupos = (nos, nivel) => nos.map((no) => {
+    const recolhido = collapsedGroups.has(no.path);
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs("tr", { className: "bg-slate-50/80 dark:bg-slate-800/60 cursor-pointer select-none", onClick: () => alternarColapso(no.path), children: [
+        /* @__PURE__ */ jsx("td", { colSpan: colunasRotuloGrupo, className: "px-3 py-1.5 border-b border-t border-slate-100 dark:border-slate-800", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", style: { paddingLeft: nivel * 16 }, children: [
+          /* @__PURE__ */ jsx(
+            Caret,
+            {
+              size: 11,
+              className: `text-proef-blue/60 dark:text-proef-turquoise/70 transition-transform shrink-0 ${recolhido ? "" : "rotate-90"}`
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: "text-[10px] font-black uppercase tracking-[0.15em] text-proef-blue/70 dark:text-proef-turquoise/80", children: no.val }),
+          /* @__PURE__ */ jsxs("span", { className: "text-[10px] text-slate-400 ml-1", children: [
+            "(",
+            no.items.length,
+            ")"
+          ] })
+        ] }) }),
+        colunasComValor.map((c) => /* @__PURE__ */ jsx("td", { className: `px-3 py-1.5 border-b border-t border-slate-100 dark:border-slate-800 whitespace-nowrap text-xs font-bold text-slate-700 dark:text-slate-200 ${alignClass(c.align)}`, children: c.groupAggregate?.(no.items) }, c.key))
+      ] }),
+      !recolhido && (no.filhos.length > 0 ? renderGrupos(no.filhos, nivel + 1) : no.items.map((row) => renderLinha(row, indicePorLinha.get(row) ?? 0)))
+    ] }, no.path);
+  });
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-2.5", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-xs text-slate-500 dark:text-slate-400", children: L.results.replace("{count}", String(sorted.length)) }),
+      /* @__PURE__ */ jsxs("div", { className: "ml-auto flex items-center gap-2", children: [
+        extraToolbar,
+        exportFileName && sorted.length > 0 && /* @__PURE__ */ jsxs(
+          "button",
+          {
+            onClick: handleExport,
+            className: "appearance-none cursor-pointer inline-flex items-center gap-1.5 h-8 px-3.5 rounded-lg border border-proef-navy dark:border-proef-turquoise bg-proef-navy dark:bg-proef-turquoise text-white dark:text-proef-navy hover:bg-proef-blue dark:hover:bg-proef-turquoise/80 text-[11px] font-black uppercase tracking-widest transition-colors",
+            children: [
+              "⭳ ",
+              L.export
+            ]
+          }
+        )
+      ] })
+    ] }),
+    isGrouped && /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center gap-2 flex-wrap", children: [
+      groupByKeys.map((key) => {
+        const col = columns.find((c) => c.key === key);
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex items-center gap-1.5 bg-violet-100 dark:bg-violet-500/20 text-violet-800 dark:text-violet-200 px-2.5 py-1 text-[10px] font-black uppercase tracking-wider",
+            children: [
+              /* @__PURE__ */ jsx(Layers, { size: 9 }),
+              /* @__PURE__ */ jsx("span", { children: col?.label ?? key }),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  onClick: () => removerGrupo(key),
+                  className: "appearance-none bg-transparent border-0 cursor-pointer ml-0.5 hover:text-violet-600",
+                  children: "✕"
+                }
+              )
+            ]
+          },
+          key
+        );
+      }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: limparGrupos,
+          className: "appearance-none bg-transparent border-0 cursor-pointer text-[10px] font-black uppercase tracking-wider text-slate-400 hover:text-red-500 transition-colors",
+          children: L.clearGroups
+        }
+      )
+    ] }),
+    (activeFilters.length > 0 || activeRanges.length > 0) && /* @__PURE__ */ jsxs("div", { className: "mb-2 flex items-center gap-2 flex-wrap", children: [
+      activeRanges.map(([key, r]) => {
+        const col = columns.find((c) => c.key === key);
+        const fmt = (v) => v == null ? "" : col?.sortType === "date" ? new Date(v).toLocaleDateString() : String(v);
+        const txt = r.min != null && r.max != null ? `${fmt(r.min)} – ${fmt(r.max)}` : r.min != null ? `≥ ${fmt(r.min)}` : `≤ ${fmt(r.max)}`;
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "flex items-center gap-1.5 bg-proef-turquoise/15 text-proef-navy dark:text-proef-turquoise px-2.5 py-1 text-[10px] font-black uppercase tracking-wider",
+            children: [
+              /* @__PURE__ */ jsxs("span", { children: [
+                col?.label ?? key,
+                ": ",
+                txt
+              ] }),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  onClick: () => clearColumnFilter(key),
+                  className: "appearance-none bg-transparent border-0 cursor-pointer ml-0.5 hover:text-proef-blue dark:hover:text-proef-turquoise",
+                  children: "✕"
+                }
+              )
+            ]
+          },
+          `r-${key}`
+        );
+      }),
+      activeFilters.flatMap(([key, sel]) => {
+        const col = columns.find((c) => c.key === key);
+        const extra = !col ? columns.flatMap((c) => c.extraFilters ?? []).find((f) => f.key === key) : void 0;
+        const chipLabel = col?.label ?? extra?.label ?? key;
+        const arr = Array.from(sel);
+        if (col?.valueChipColors) {
+          const cores = col.valueChipColors;
+          return arr.map((v) => /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: `flex items-center gap-1.5 px-2.5 py-1 text-[10px] font-black uppercase tracking-wider ${cores[v] ?? "bg-proef-turquoise/15 text-proef-navy dark:text-proef-turquoise"}`,
+              children: [
+                /* @__PURE__ */ jsxs("span", { children: [
+                  chipLabel,
+                  ": ",
+                  v
+                ] }),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    onClick: () => toggleFilterValue(key, v),
+                    className: "appearance-none bg-transparent border-0 cursor-pointer ml-0.5 hover:opacity-70",
+                    children: "✕"
+                  }
+                )
+              ]
+            },
+            `${key}:${v}`
+          ));
+        }
+        const txt = arr.length > 2 || arr.length === 0 ? L.selected.replace("{count}", String(arr.length)) : arr.join(", ");
+        return [
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: "flex items-center gap-1.5 bg-proef-turquoise/15 text-proef-navy dark:text-proef-turquoise px-2.5 py-1 text-[10px] font-black uppercase tracking-wider",
+              children: [
+                /* @__PURE__ */ jsxs("span", { children: [
+                  chipLabel,
+                  ": ",
+                  txt
+                ] }),
+                /* @__PURE__ */ jsx(
+                  "button",
+                  {
+                    onClick: () => clearColumnFilter(key),
+                    className: "appearance-none bg-transparent border-0 cursor-pointer ml-0.5 hover:text-proef-blue dark:hover:text-proef-turquoise",
+                    children: "✕"
+                  }
+                )
+              ]
+            },
+            key
+          )
+        ];
+      }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: clearAllFilters,
+          className: "appearance-none bg-transparent border-0 cursor-pointer text-[10px] font-black uppercase tracking-wider text-slate-400 hover:text-red-500 transition-colors",
+          children: L.clearAll
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "overflow-auto rounded-xl border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-900", style: { maxHeight }, children: /* @__PURE__ */ jsxs("table", { className: "w-full text-[13px] border-collapse dark:text-slate-200", children: [
+      /* @__PURE__ */ jsx("thead", { className: "sticky top-0 z-[2]", children: /* @__PURE__ */ jsxs("tr", { children: [
+        selectable && /* @__PURE__ */ jsx("th", { className: "bg-slate-50 dark:bg-slate-800 px-3 py-2.5 border-b border-slate-200 dark:border-slate-700 w-10 sticky left-0 z-[3]", children: /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: alternarTodas,
+            className: `appearance-none cursor-pointer w-4 h-4 flex items-center justify-center border transition-colors rounded ${todasVisiveisMarcadas ? "bg-proef-navy dark:bg-proef-turquoise border-proef-navy dark:border-proef-turquoise text-white dark:text-proef-navy" : algumaVisivelMarcada ? "bg-slate-300 dark:bg-slate-600 border-slate-300 dark:border-slate-600 text-white" : "bg-white dark:bg-slate-900 border-slate-300 dark:border-slate-600 hover:border-slate-400 dark:hover:border-slate-500"}`,
+            children: (todasVisiveisMarcadas || algumaVisivelMarcada) && /* @__PURE__ */ jsx("span", { className: "text-[9px] leading-none", children: "✓" })
+          }
+        ) }),
+        columns.map((c) => {
+          temFiltro(c.key);
+          const podeOrdenar = c.sortable !== false;
+          const podeAgrupar = agrupavel(c);
+          const agrupada = groupByKeys.includes(c.key);
+          return /* @__PURE__ */ jsxs(
+            "th",
+            {
+              style: {
+                ...c.width ? { minWidth: c.width } : {},
+                ...larguras[c.key] ? { width: larguras[c.key], minWidth: larguras[c.key], maxWidth: larguras[c.key] } : {},
+                ...estiloPreso(c) ?? {}
+              },
+              className: `group/th relative bg-slate-50 dark:bg-slate-800 text-[11.5px] uppercase tracking-wide text-slate-500 dark:text-slate-400 font-semibold px-3 py-2.5 border-b border-slate-200 dark:border-slate-700 whitespace-nowrap select-none ${alignClass(
+                c.align
+              )} ${c.sticky ? `sticky z-[3] bg-slate-50 dark:bg-slate-800 ${c.sticky === "right" ? "border-l border-slate-200 dark:border-slate-700" : ""}` : ""} ${c.headerClassName ?? ""}`,
+              children: [
+                resizableColumns && // Pega no limite direito: arrastar redimensiona; duplo clique repõe a largura automática
+                /* @__PURE__ */ jsx(
+                  "span",
+                  {
+                    role: "separator",
+                    "aria-orientation": "vertical",
+                    title: L.resizeColumn,
+                    onMouseDown: (e) => iniciarResize(e, c.key),
+                    onDoubleClick: () => reporLargura(c.key),
+                    onClick: (e) => e.stopPropagation(),
+                    className: "absolute right-0 top-0 z-[4] h-full w-1.5 cursor-col-resize bg-transparent hover:bg-proef-blue/40 group-hover/th:bg-slate-300/60 dark:group-hover/th:bg-slate-600/60"
+                  }
+                ),
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+                  podeOrdenar ? /* @__PURE__ */ jsxs(
+                    "button",
+                    {
+                      onClick: () => toggleSort(c.key),
+                      className: "appearance-none bg-transparent border-0 cursor-pointer p-0 uppercase tracking-wide text-slate-500 dark:text-slate-400 hover:text-proef-blue dark:hover:text-proef-turquoise font-semibold",
+                      children: [
+                        c.label,
+                        sort?.key === c.key && /* @__PURE__ */ jsx("span", { className: "ml-1", children: sort.dir === 1 ? "▲" : "▼" })
+                      ]
+                    }
+                  ) : /* @__PURE__ */ jsx("span", { children: c.label }),
+                  podeAgrupar && /* @__PURE__ */ jsx(
+                    "button",
+                    {
+                      onClick: () => alternarGrupo(c.key),
+                      title: (agrupada ? L.ungroup : L.groupBy).replace("{label}", c.label),
+                      className: `appearance-none bg-transparent border-0 cursor-pointer p-0.5 transition-colors ${agrupada ? "text-violet-600 dark:text-violet-300" : "text-slate-300 dark:text-slate-600 hover:text-slate-500 dark:hover:text-slate-300"}`,
+                      children: /* @__PURE__ */ jsx(Layers, { size: 10 })
+                    }
+                  ),
+                  filtravel(c) && botaoFunil(c.key, c),
+                  c.extraFilters?.map((ef) => botaoFunil(ef.key, void 0, { label: ef.label }))
+                ] }),
+                c.headerExtra && /* @__PURE__ */ jsx("div", { className: "mt-0.5 normal-case font-normal tracking-normal", children: c.headerExtra(filtered) })
+              ]
+            },
+            c.key
+          );
+        })
+      ] }) }),
+      /* @__PURE__ */ jsx("tbody", { children: aEsperarDataset ? /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsx("td", { colSpan: nColunas, className: "py-16 text-center text-sm font-bold uppercase tracking-widest text-slate-400", children: L.loading }) }) : isGrouped ? grupos.length === 0 ? /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsx("td", { colSpan: nColunas, className: "py-16 text-center text-sm text-slate-400", children: L.empty }) }) : renderGrupos(grupos, 0) : sorted.length === 0 ? /* @__PURE__ */ jsx("tr", { children: /* @__PURE__ */ jsxs("td", { colSpan: nColunas, className: "py-16 text-center", children: [
+        emptyIcon && /* @__PURE__ */ jsx("div", { className: "flex justify-center mb-2", children: emptyIcon }),
+        /* @__PURE__ */ jsx("p", { className: "text-sm text-slate-400", children: L.empty }),
+        emptySubLabel && /* @__PURE__ */ jsx("p", { className: "text-xs text-slate-400 mt-1", children: emptySubLabel })
+      ] }) }) : pageData.map((row, i) => renderLinha(row, i)) }),
+      totalRow && !aEsperarDataset && sorted.length > 0 && /* @__PURE__ */ jsx("tfoot", { className: "sticky bottom-0 z-[2]", children: /* @__PURE__ */ jsxs("tr", { className: "bg-slate-100 dark:bg-slate-800 font-black text-slate-800 dark:text-slate-100", children: [
+        /* @__PURE__ */ jsx("td", { colSpan: colunasRotuloGrupo, className: "px-3 py-2 border-t-2 border-slate-200 dark:border-slate-700 text-[10px] uppercase tracking-widest", children: L.total }),
+        colunasComValor.map((c) => /* @__PURE__ */ jsx("td", { className: `px-3 py-2 border-t-2 border-slate-200 dark:border-slate-700 whitespace-nowrap text-xs ${alignClass(c.align)}`, children: c.groupAggregate?.(sorted) }, c.key))
+      ] }) })
+    ] }) }),
+    paginando && (totalPages > 1 || (pageSizeOptions?.length ?? 0) > 0) && /* @__PURE__ */ jsxs("div", { className: "mt-2.5 flex items-center justify-between gap-2", children: [
+      /* @__PURE__ */ jsx("span", { className: "text-[10px] font-black uppercase tracking-widest text-slate-400", children: L.page.replace("{page}", String(currentPage)).replace("{pages}", String(totalPages)) }),
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+        (pageSizeOptions?.length ?? 0) > 0 && /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1.5 mr-2 text-[10px] font-black uppercase tracking-widest text-slate-400", children: [
+          L.perPage,
+          /* @__PURE__ */ jsx(
+            Escolha,
+            {
+              rotulo: L.perPage,
+              valor: String(pageSizeAtual),
+              onMudar: (v) => setPageSizeAtual(Number(v)),
+              className: "w-20 normal-case tracking-normal font-normal",
+              opcoes: [.../* @__PURE__ */ new Set([...pageSizeOptions ?? [], pageSizeAtual])].sort((a, b) => a - b).map(String)
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            disabled: currentPage <= 1,
+            onClick: () => setPage((p) => Math.max(1, p - 1)),
+            className: "appearance-none cursor-pointer bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-700 text-[10px] font-black uppercase rounded-lg tracking-widest px-3 py-1.5 text-slate-500 dark:text-slate-400 hover:enabled:border-proef-navy dark:hover:enabled:border-proef-turquoise hover:enabled:text-proef-navy dark:hover:enabled:text-proef-turquoise disabled:opacity-30 disabled:cursor-not-allowed transition-colors",
+            children: L.prev
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            disabled: currentPage >= totalPages,
+            onClick: () => setPage((p) => Math.min(totalPages, p + 1)),
+            className: "appearance-none cursor-pointer bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-700 text-[10px] font-black uppercase rounded-lg tracking-widest px-3 py-1.5 text-slate-500 dark:text-slate-400 hover:enabled:border-proef-navy dark:hover:enabled:border-proef-turquoise hover:enabled:text-proef-navy dark:hover:enabled:text-proef-turquoise disabled:opacity-30 disabled:cursor-not-allowed transition-colors",
+            children: L.next
+          }
+        )
+      ] })
+    ] })
+  ] });
+}
+export {
+  DataTable as default,
+  pesquisaCuringa,
+  timestampDeData
+};
+//# sourceMappingURL=DataTable.js.map