@kapiuara/ui 0.0.0-stage → 0.1.1

package/dist/components/data/KapiTableFilter.d.ts

@@ -0,0 +1,48 @@
+import { type HTMLAttributes, type ReactNode } from "react";
+import { type KapiInputSize } from "../inputs/KapiInput";
+import { type KapiTableFilterState } from "./tableLogic";
+import "./KapiTableFilter.css";
+import type { KapiLabelsOverride } from "../labelsLogic";
+/** Textos de la barra de filtro (los mismos nombres que en `KapiTableLabels`). */
+export type KapiTableFilterLabels = {
+    filter: string;
+    filterPlaceholder: string;
+    filterColumn: string;
+    filterAll: string;
+    /** Separador del contador "N de M". */
+    of: string;
+};
+export declare const DEFAULT_TABLE_FILTER_LABELS: KapiTableFilterLabels;
+/** Atributos nativos (`id`, `style`, `data-*`…) van a la región `role="search"` (el rol es propio). */
+export type KapiTableFilterProps = Omit<HTMLAttributes<HTMLDivElement>, "children" | "onChange" | "role"> & {
+    /** Filtro actual (`column: null` = todas las columnas). Controlado. */
+    value: KapiTableFilterState;
+    /** Se llama al tipear (con `debounce`, si hay) y al elegir columna (al instante). */
+    onChange: (filter: KapiTableFilterState) => void;
+    /** Columnas para el selector: entran las que no tienen `filterable: false`. */
+    columns: ReadonlyArray<{
+        key: string;
+        label: ReactNode;
+        filterable?: boolean;
+    }>;
+    /** Con filtro activo muestra "N de M" (filas mostradas / total). Sin esto no hay contador. */
+    count?: {
+        shown: number;
+        total: number;
+    } | undefined;
+    /** Debounce (ms) del texto; `0` emite en cada tecla. Default `0`. */
+    debounce?: number | undefined;
+    /** Etiqueta visible del campo de texto (lo envuelve en un `KapiField`). Sin ella usa `aria-label`. */
+    label?: ReactNode | undefined;
+    /** Tamaño de los controles (`sm` · `md` · `lg`). */
+    size?: KapiInputSize | undefined;
+    /** Textos fijos (clave `tableFilter`). */
+    labels?: KapiLabelsOverride<KapiTableFilterLabels> | undefined;
+};
+/**
+ * Barra de filtro de tabla: un `KapiInputGroup` con el selector de columna compacto adelante ("Todas"
+ * por defecto) y el texto con lupa y botón de limpiar. Es opcional: `KapiTable` la muestra con `filterable`, pero se puede poner en cualquier
+ * lugar de la pantalla y conectarla al `filter`/`onFilterChange` de la tabla, o reemplazarla por una
+ * UI propia. Con `debounce` el campo va adelante del valor emitido.
+ */
+export declare function KapiTableFilter({ value, onChange, columns, count, debounce, label, size, labels, className, ...rest }: KapiTableFilterProps): import("react").JSX.Element;

package/dist/components/data/KapiTableFilter.js

@@ -0,0 +1,81 @@
+"use client";
+import { KapiField as e } from "../inputs/KapiField.js";
+import { KapiInputGroup as t } from "../inputs/KapiInputGroup.js";
+import { useLabels as n } from "../locale/KapiLocaleProvider.js";
+import { KapiInput as r } from "../inputs/KapiInput.js";
+import { KapiSelect as i } from "../inputs/KapiSelect.js";
+import { joinClasses as a } from "../rootProps.js";
+import { filterColumnOptions as o, isFilterActive as s } from "./tableLogic.js";
+/* empty css                    */
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { useEffect as u, useId as d, useMemo as f, useRef as p, useState as m } from "react";
+import { Search as h } from "lucide-react";
+//#region src/components/data/KapiTableFilter.tsx
+var g = {
+	filter: "Filtrar tabla",
+	filterPlaceholder: "Filtrar…",
+	filterColumn: "Columna del filtro",
+	filterAll: "Todas",
+	of: "de"
+}, _ = "\0all", v = (e, t) => e.text === t.text && e.column === t.column;
+function y({ value: y, onChange: b, columns: x, count: S, debounce: C = 0, label: w, size: T = "sm", labels: E, className: D, ...O }) {
+	let k = n("tableFilter", g, E), A = f(() => o(x), [x]), [j, M] = m(y), N = p(y), [P, F] = m(y);
+	v(P, y) || (F(y), v(N.current, y) || M(y));
+	let I = p(void 0);
+	u(() => () => clearTimeout(I.current), []);
+	let L = (e) => {
+		clearTimeout(I.current), N.current = e, b(e);
+	}, R = (e, t) => {
+		M(e), clearTimeout(I.current), !t && C > 0 ? I.current = setTimeout(() => L(e), C) : L(e);
+	}, z = d(), B = /* @__PURE__ */ l(t, {
+		size: T,
+		className: "kapi-tablefilter__group",
+		children: [/* @__PURE__ */ c(i, {
+			id: `${z}-col`,
+			searchable: !1,
+			"aria-label": k.filterColumn,
+			className: "kapi-tablefilter__col",
+			options: [{
+				value: _,
+				label: k.filterAll
+			}, ...A],
+			value: j.column ?? _,
+			onChange: (e) => {
+				e !== null && R({
+					...j,
+					column: e === _ ? null : e
+				}, !0);
+			}
+		}), /* @__PURE__ */ c(r, {
+			id: z,
+			type: "search",
+			"aria-label": w == null ? k.filter : void 0,
+			placeholder: k.filterPlaceholder,
+			spellCheck: !1,
+			startIcon: /* @__PURE__ */ c(h, {}),
+			clearable: !0,
+			value: j.text,
+			onChange: (e) => R({
+				...j,
+				text: e.target.value
+			}, !1)
+		})]
+	});
+	return /* @__PURE__ */ l("div", {
+		...O,
+		className: a("kapi-tablefilter", D),
+		role: "search",
+		children: [w == null ? B : /* @__PURE__ */ c(e, {
+			label: w,
+			htmlFor: z,
+			className: "kapi-tablefilter__field",
+			children: B
+		}), /* @__PURE__ */ c("span", {
+			className: "kapi-tablefilter__count",
+			"aria-live": "polite",
+			children: S && s(y) ? `${S.shown} ${k.of} ${S.total}` : ""
+		})]
+	});
+}
+//#endregion
+export { g as DEFAULT_TABLE_FILTER_LABELS, y as KapiTableFilter };

package/dist/components/data/index.d.ts

@@ -0,0 +1,10 @@
+export { KapiTable, DEFAULT_TABLE_LABELS } from "./KapiTable";
+export type { KapiTableColumn, KapiTableCellValue, KapiTableSortDirection, KapiTableSortState, KapiTableSortValue, KapiTableCsvOptions, KapiTableLabels, KapiTableProps } from "./KapiTable";
+export { KapiTableFilter, DEFAULT_TABLE_FILTER_LABELS } from "./KapiTableFilter";
+export type { KapiTableFilterProps, KapiTableFilterLabels } from "./KapiTableFilter";
+export { KapiPagination } from "./KapiPagination";
+export type { KapiPaginationLabels, KapiPaginationProps } from "./KapiPagination";
+export { computePagination, paginateRows, sortRows, sortRowsByColumn, compareSortValues, nextSortState } from "./tableLogic";
+export type { KapiPaginationInfo, KapiPaginationInput, KapiTableSortColumn } from "./tableLogic";
+export { visibleColumnsOf, toggleColumnVisibility, clampColumnWidth, effectiveColumnWidth, resizeColumn, filterRows, filterSearchColumns, filterColumnOptions, isFilterActive, rowMatchesFilter, filterTerms, normalizeFilterText, buildCsv, csvCell } from "./tableLogic";
+export type { KapiTableColumnVisibility, KapiTableColumnWidths, KapiTableFilterState } from "./tableLogic";

package/dist/components/data/tableLogic.d.ts

@@ -0,0 +1,197 @@
+/** Ancho de la columna de checkboxes (px). Las columnas sticky arrancan después de ésta. */
+export declare const CHECKBOX_COL_WIDTH = 46;
+/** Ancho de la columna del expansor de fila (px). Las columnas sticky arrancan después de ésta. */
+export declare const EXPANDER_COL_WIDTH = 44;
+/** Ancho asumido para una columna sticky sin `width`. */
+export declare const DEFAULT_STICKY_WIDTH = 170;
+/** Filas extra renderizadas arriba/abajo del viewport al virtualizar. */
+export declare const VIRTUAL_BUFFER = 6;
+export type StickyColumnInfo = {
+    sticky?: boolean | undefined;
+    width?: number | undefined;
+};
+/**
+ * `left` acumulado de cada columna sticky (las no-sticky devuelven `undefined`).
+ * Arranca en `startOffset` (46 si hay columna de checkboxes, 0 si no).
+ */
+export declare const computeStickyOffsets: (columns: ReadonlyArray<StickyColumnInfo>, startOffset?: number, defaultWidth?: number) => Array<number | undefined>;
+/**
+ * Índice de la última columna sticky en orden visible (o -1 si no hay ninguna). Sólo esa columna
+ * dibuja la sombra del borde sticky↔scroll: las fijas del medio no, así no se apilan sombras.
+ */
+export declare const lastStickyIndex: (columns: ReadonlyArray<{
+    sticky?: boolean;
+}>) => number;
+export type VisibleRangeInput = {
+    total: number;
+    rowHeight: number;
+    scrollTop: number;
+    viewHeight: number;
+    buffer?: number | undefined;
+};
+export type VisibleRange = {
+    start: number;
+    end: number;
+    padTop: number;
+    padBottom: number;
+};
+/** Rango de filas a renderizar (altura fija) + el relleno que conserva el alto total. */
+export declare const computeVisibleRange: ({ total, rowHeight, scrollTop, viewHeight, buffer }: VisibleRangeInput) => VisibleRange;
+/** Lo que la tabla virtual guarda del scroll: posición y alto visible. */
+export type ScrollWindow = {
+    scrollTop: number;
+    viewHeight: number;
+};
+/**
+ * Próximo estado de scroll de la tabla virtual: devuelve `prev` (misma referencia) mientras el rango
+ * de filas no cambie, así el `setState` funcional se saltea y el scroll dentro de una fila no
+ * re-renderiza. Sólo cuando entra o sale una fila devuelve `next`.
+ */
+export declare const nextScrollWindow: (prev: ScrollWindow, next: ScrollWindow, { total, rowHeight, buffer }: {
+    total: number;
+    rowHeight: number;
+    buffer?: number;
+}) => ScrollWindow;
+export type KapiPaginationInput = {
+    page: number;
+    pageSize: number;
+    total: number;
+};
+export type KapiPaginationInfo = {
+    totalPages: number;
+    from: number;
+    to: number;
+    canPrev: boolean;
+    canNext: boolean;
+    page: number;
+};
+/** Datos del footer de paginación (páginas desde 1). La página se acota al rango válido. */
+export declare const computePagination: ({ page, pageSize, total }: KapiPaginationInput) => KapiPaginationInfo;
+export type KapiTableSortDirection = "asc" | "desc";
+export type KapiTableSortState = {
+    key: string;
+    direction: KapiTableSortDirection;
+};
+export type KapiTableSortValue = string | number | boolean | Date | null | undefined;
+export declare const safeLocale: (locale?: string) => string | undefined;
+export declare const compareSortValues: (a: KapiTableSortValue, b: KapiTableSortValue, direction?: KapiTableSortDirection, locale?: string) => number;
+/** Ordena sin mutar y de forma estable (empates conservan el orden original). */
+export declare const sortRows: <R>(rows: ReadonlyArray<R>, getValue: (row: R) => KapiTableSortValue, direction: KapiTableSortDirection, locale?: string) => R[];
+/** Lo que `sortRowsByColumn` necesita de una columna (subconjunto de `KapiTableColumn`). */
+export type KapiTableSortColumn<R> = {
+    key: string;
+    sortable?: boolean | undefined;
+    sortValue?: ((row: R) => KapiTableSortValue) | undefined;
+};
+/**
+ * Ordena las filas como lo hace la tabla: por `sortValue` de la columna activa o, sin él, por el valor
+ * de la celda (`row[key]`). Sin orden, o si la columna no existe o no es `sortable`, devuelve las mismas
+ * filas (misma referencia). Para paginar del lado del cliente con `manualSort`:
+ * `paginateRows(sortRowsByColumn(rows, columns, sort), page, pageSize)`.
+ */
+/** Valor crudo de una celda (`row[key]`). Una sola fuente para el orden, el CSV y el render de KapiTable. */
+export declare const readCell: (row: unknown, key: string) => unknown;
+export declare const sortRowsByColumn: <R>(rows: ReadonlyArray<R>, columns: ReadonlyArray<KapiTableSortColumn<R>>, sort: KapiTableSortState | null | undefined, locale?: string) => ReadonlyArray<R>;
+/** Filas de una página (desde 1). Acota la página y el tamaño igual que `computePagination`. */
+export declare const paginateRows: <R>(rows: ReadonlyArray<R>, page: number, pageSize: number) => R[];
+/** Ciclo del click en un header: sin orden → asc → desc → sin orden. Otra columna arranca en asc. */
+export declare const nextSortState: (current: KapiTableSortState | null | undefined, key: string) => KapiTableSortState | null;
+export type SelectionState = "none" | "some" | "all";
+/** Estado del checkbox de header según cuántas de las filas visibles están elegidas. */
+export declare const selectionState: <K>(rowIds: ReadonlyArray<K>, selected: ReadonlySet<K>) => SelectionState;
+/** Alterna un id sin mutar. */
+export declare const toggleId: <K>(selected: ReadonlySet<K>, id: K) => Set<K>;
+/**
+ * "Seleccionar todo": si ya están todas, las quita; si no (ninguna o parcial), las suma.
+ * Los ids elegidos que no están en `rowIds` se conservan.
+ */
+export declare const toggleAllIds: <K>(selected: ReadonlySet<K>, rowIds: ReadonlyArray<K>) => Set<K>;
+/**
+ * Tramo inclusivo de `ids` entre `anchorId` y `targetId` (sin importar el orden).
+ * Devuelve `[]` si alguno de los dos no está en `ids`.
+ */
+export declare const rangeBetween: <K>(ids: ReadonlyArray<K>, anchorId: K, targetId: K) => K[];
+/** Suma (`select`) o quita el tramo `rangeIds` de la selección, sin mutar. Respeta los ids fuera del tramo. */
+export declare const applyRangeSelection: <K>(selected: ReadonlySet<K>, rangeIds: ReadonlyArray<K>, select: boolean) => Set<K>;
+/** Mapa `key → mostrada`. Una clave ausente cuenta como visible. */
+export type KapiTableColumnVisibility = Record<string, boolean>;
+/** Columnas que se muestran: todas salvo las marcadas explícitamente con `false`. */
+export declare const visibleColumnsOf: <C extends {
+    key: string;
+}>(columns: ReadonlyArray<C>, visibility: Readonly<KapiTableColumnVisibility> | undefined) => C[];
+/** Invierte la visibilidad de una columna sin mutar (ausente = visible → pasa a oculta). */
+export declare const toggleColumnVisibility: (visibility: Readonly<KapiTableColumnVisibility> | undefined, key: string) => KapiTableColumnVisibility;
+/** Ancho mínimo por defecto al redimensionar (px). */
+export declare const DEFAULT_MIN_COLUMN_WIDTH = 60;
+/** Paso de las flechas del handle de redimensionado (px). */
+export declare const RESIZE_KEY_STEP = 16;
+export type KapiTableColumnWidths = Record<string, number>;
+/** Acota un ancho al mínimo (redondeado a px enteros). */
+export declare const clampColumnWidth: (width: number, min?: number) => number;
+/** Ancho efectivo: el override del usuario gana sobre el `width` declarado. */
+export declare const effectiveColumnWidth: (column: {
+    key: string;
+    width?: number;
+}, widths: Readonly<KapiTableColumnWidths> | undefined) => number | undefined;
+/** Mapa de anchos resultante de arrastrar `deltaPx` desde `startWidth`. No muta. */
+export declare const resizeColumn: (widths: Readonly<KapiTableColumnWidths> | undefined, key: string, startWidth: number, deltaPx: number, min?: number) => KapiTableColumnWidths;
+/** Texto comparable: minúsculas, sin acentos (á → a, ñ → n) y sin espacios en los bordes. */
+export declare const normalizeFilterText: (text: string) => string;
+/** Términos del filtro (separados por espacios), normalizados. Texto vacío → `[]`. */
+export declare const filterTerms: (query: string) => string[];
+/**
+ * La fila coincide si CADA término aparece dentro del valor de ALGUNA columna (Y entre términos,
+ * O entre columnas). Sin términos, todo coincide. Los vacíos no coinciden con nada.
+ */
+export declare const rowMatchesFilter: (values: ReadonlyArray<unknown>, terms: ReadonlyArray<string>) => boolean;
+/** Filtra sin mutar y conservando el orden. Sin texto devuelve `rows` (misma referencia). */
+export declare const filterRows: <R>(rows: ReadonlyArray<R>, getValues: (row: R) => ReadonlyArray<unknown>, query: string) => ReadonlyArray<R>;
+/** Filtro de la tabla: texto y columna donde buscar (`null` = todas). */
+export type KapiTableFilterState = {
+    text: string;
+    column: string | null;
+};
+/** Hay filtro si el texto tiene al menos un término. */
+export declare const isFilterActive: (filter: KapiTableFilterState) => boolean;
+/**
+ * Columnas donde busca el filtro: la elegida si existe y es filtrable; si no (o con `null`), todas
+ * las que no se excluyen con `filterable: false`.
+ */
+export declare const filterSearchColumns: <C extends {
+    key: string;
+    filterable?: boolean;
+}>(columns: ReadonlyArray<C>, column: string | null) => C[];
+/**
+ * Una celda CSV (RFC 4180): vacíos → "", fechas en ISO; cita si tiene comillas, el separador o
+ * saltos de línea. Los textos que empiezan como fórmula (= + - @ tab) llevan un apóstrofo delante.
+ */
+export declare const csvCell: (value: unknown, separator?: string) => string;
+/** CSV completo: header + filas, líneas separadas por CRLF. */
+export declare const buildCsv: (header: ReadonlyArray<string>, rows: ReadonlyArray<ReadonlyArray<unknown>>, separator?: string) => string;
+/** Título de la columna en el CSV: el label si es texto o número, si no la key. */
+export declare const csvHeaderOf: (column: {
+    key: string;
+    label: unknown;
+}) => string;
+/** Nombre del archivo: default "tabla.csv"; agrega ".csv" si falta. */
+export declare const csvFileName: (name: string | undefined) => string;
+/** Opciones del selector de columna del filtro: las columnas filtrables con su título. */
+export declare const filterColumnOptions: (columns: ReadonlyArray<{
+    key: string;
+    label: unknown;
+    filterable?: boolean;
+}>) => Array<{
+    value: string;
+    label: string;
+}>;
+/**
+ * Nombre accesible del checkbox de una fila: `"{selectRowNamed} {etiqueta}"` con la etiqueta de
+ * `rowLabel` o, por defecto, el valor primitivo (texto/número no vacío) de la primera columna visible;
+ * si no hay, `"{selectRow} {posición}"` (posición desde 1). Pura.
+ */
+export declare const rowSelectLabel: <T>(row: T, columns: ReadonlyArray<{
+    key: string;
+}>, position: number, texts: {
+    selectRow: string;
+    selectRowNamed: string;
+}, rowLabel?: (row: T) => string) => string;

package/dist/components/data/tableLogic.js

@@ -0,0 +1,145 @@
+var e = (e, t = 0, n = 170) => {
+	let r = t;
+	return e.map((e) => {
+		if (!e.sticky) return;
+		let t = r;
+		return r += e.width || n, t;
+	});
+}, t = (e) => {
+	let t = -1;
+	return e.forEach((e, n) => {
+		e.sticky && (t = n);
+	}), t;
+}, n = ({ total: e, rowHeight: t, scrollTop: n, viewHeight: r, buffer: i = 6 }) => {
+	if (e <= 0 || t <= 0) return {
+		start: 0,
+		end: Math.max(0, e),
+		padTop: 0,
+		padBottom: 0
+	};
+	let a = Math.min(e, Math.max(0, Math.floor(n / t) - i)), o = Math.ceil(r / t) + i * 2, s = Math.min(e, a + o);
+	return {
+		start: a,
+		end: s,
+		padTop: a * t,
+		padBottom: (e - s) * t
+	};
+}, r = (e, t, { total: r, rowHeight: i, buffer: a }) => {
+	let o = n({
+		total: r,
+		rowHeight: i,
+		buffer: a,
+		...e
+	}), s = n({
+		total: r,
+		rowHeight: i,
+		buffer: a,
+		...t
+	});
+	return o.start === s.start && o.end === s.end ? e : t;
+}, i = ({ page: e, pageSize: t, total: n }) => {
+	let r = Math.max(1, t), i = Math.max(1, Math.ceil(n / r)), a = Math.min(Math.max(1, e), i);
+	return {
+		totalPages: i,
+		from: n === 0 ? 0 : (a - 1) * r + 1,
+		to: Math.min(n, a * r),
+		canPrev: a > 1,
+		canNext: a < i,
+		page: a
+	};
+}, a = (e) => e == null || typeof e == "number" && Number.isNaN(e) || e instanceof Date && Number.isNaN(e.getTime()), o = (e) => e instanceof Date ? e.getTime() : typeof e == "boolean" ? +!!e : e, s = /* @__PURE__ */ new Map(), c = (e) => {
+	if (!e) return;
+	if (s.has(e)) return s.get(e);
+	let t;
+	try {
+		t = Intl.getCanonicalLocales(e)[0];
+	} catch {
+		t = void 0;
+	}
+	return s.set(e, t), t;
+}, l = (e, t, n = "asc", r) => {
+	let i = a(e), s = a(t);
+	if (i || s) return i && s ? 0 : i ? 1 : -1;
+	let l = o(e), u = o(t), d;
+	return d = typeof l == "number" && typeof u == "number" ? l - u : String(l).localeCompare(String(u), c(r), {
+		numeric: !0,
+		sensitivity: "base"
+	}), n === "desc" ? -d : d;
+}, u = (e, t, n, r) => {
+	let i = c(r);
+	return e.map((e, n) => ({
+		row: e,
+		index: n,
+		value: t(e)
+	})).sort((e, t) => l(e.value, t.value, n, i) || e.index - t.index).map((e) => e.row);
+}, d = (e, t) => e[t], f = (e, t, n, r) => {
+	if (!n) return e;
+	let i = t.find((e) => e.key === n.key);
+	return !i || !i.sortable ? e : u(e, (e) => i.sortValue ? i.sortValue(e) : d(e, i.key), n.direction, r);
+}, p = (e, t, n) => {
+	let { from: r, to: a } = i({
+		page: t,
+		pageSize: n,
+		total: e.length
+	});
+	return r === 0 ? [] : e.slice(r - 1, a);
+}, m = (e, t) => !e || e.key !== t ? {
+	key: t,
+	direction: "asc"
+} : e.direction === "asc" ? {
+	key: t,
+	direction: "desc"
+} : null, h = (e, t) => {
+	if (e.length === 0) return "none";
+	let n = 0;
+	for (let r of e) t.has(r) && (n += 1);
+	return n === 0 ? "none" : n === e.length ? "all" : "some";
+}, g = (e, t) => {
+	let n = new Set(e);
+	return n.has(t) ? n.delete(t) : n.add(t), n;
+}, _ = (e, t) => {
+	let n = new Set(e);
+	return h(t, e) === "all" ? t.forEach((e) => n.delete(e)) : t.forEach((e) => n.add(e)), n;
+}, v = (e, t, n) => {
+	let r = e.indexOf(t), i = e.indexOf(n);
+	return r === -1 || i === -1 ? [] : e.slice(Math.min(r, i), Math.max(r, i) + 1);
+}, y = (e, t, n) => {
+	let r = new Set(e);
+	return t.forEach((e) => n ? r.add(e) : r.delete(e)), r;
+}, b = (e, t) => e.filter((e) => t?.[e.key] !== !1), x = (e, t) => ({
+	...e,
+	[t]: e?.[t] === !1
+}), S = (e, t = 60) => Math.max(t, Math.round(e)), C = (e, t) => t?.[e.key] ?? e.width, w = (e, t, n, r, i = 60) => ({
+	...e,
+	[t]: S(n + r, i)
+}), T = (e) => e.normalize("NFD").replace(/\p{M}/gu, "").toLowerCase().trim(), E = (e) => T(e).split(/\s+/).filter(Boolean), D = (e) => e == null ? "" : e instanceof Date ? Number.isNaN(e.getTime()) ? "" : e.toISOString() : T(String(e)), O = (e, t) => {
+	if (t.length === 0) return !0;
+	let n = e.map(D);
+	return t.every((e) => n.some((t) => t.includes(e)));
+}, k = (e, t, n) => {
+	let r = E(n);
+	return r.length === 0 ? e : e.filter((e) => O(t(e), r));
+}, A = (e) => E(e.text).length > 0, j = (e, t) => {
+	let n = e.filter((e) => e.filterable !== !1), r = t === null ? void 0 : n.find((e) => e.key === t);
+	return r ? [r] : n;
+}, M = /^[+-]?\d+([.,]\d+)?$/, N = /^[=+\-@\t\r]/, P = (e, t = ",") => {
+	if (e == null) return "";
+	let n;
+	return n = e instanceof Date ? Number.isNaN(e.getTime()) ? "" : e.toISOString() : String(e), typeof e == "string" && N.test(n) && !M.test(n) && (n = `'${n}`), n.includes("\"") || n.includes(t) || /[\r\n]/.test(n) ? `"${n.replace(/"/g, "\"\"")}"` : n;
+}, F = (e, t, n = ",") => [e, ...t].map((e) => e.map((e) => P(e, n)).join(n)).join("\r\n"), I = (e) => typeof e.label == "string" || typeof e.label == "number" ? String(e.label) : e.key, L = (e) => {
+	let t = e?.trim() || "tabla";
+	return /\.csv$/i.test(t) ? t : `${t}.csv`;
+}, R = (e) => j(e, null).map((e) => ({
+	value: e.key,
+	label: I(e)
+})), z = (e, t, n, r, i) => {
+	let a;
+	if (i) a = i(e);
+	else {
+		let n = t[0], r = n ? e[n.key] : void 0;
+		(typeof r == "string" || typeof r == "number") && (a = String(r));
+	}
+	return a?.trim() ? `${r.selectRowNamed} ${a.trim()}` : `${r.selectRow} ${n}`;
+};
+//#endregion
+export { y as applyRangeSelection, F as buildCsv, S as clampColumnWidth, l as compareSortValues, i as computePagination, e as computeStickyOffsets, n as computeVisibleRange, P as csvCell, L as csvFileName, I as csvHeaderOf, C as effectiveColumnWidth, R as filterColumnOptions, k as filterRows, j as filterSearchColumns, E as filterTerms, A as isFilterActive, t as lastStickyIndex, r as nextScrollWindow, m as nextSortState, T as normalizeFilterText, p as paginateRows, v as rangeBetween, d as readCell, w as resizeColumn, O as rowMatchesFilter, z as rowSelectLabel, c as safeLocale, h as selectionState, u as sortRows, f as sortRowsByColumn, _ as toggleAllIds, x as toggleColumnVisibility, g as toggleId, b as visibleColumnsOf };

package/dist/components/data/tableResizeLogic.d.ts

@@ -0,0 +1,28 @@
+import { type KapiTableColumnWidths } from "./tableLogic";
+/** Arrastre en curso: dónde empezó y el ancho borrador actual (px enteros, ya acotado). */
+export type ResizeDrag = {
+    key: string;
+    startX: number;
+    startWidth: number;
+    min: number;
+    width: number;
+};
+export declare const startResizeDrag: (key: string, startX: number, startWidth: number, min: number) => ResizeDrag;
+/** Nuevo borrador para la posición del puntero, o `null` si el ancho no cambió (no hay que pintar). */
+export declare const moveResizeDrag: (drag: ResizeDrag, clientX: number) => ResizeDrag | null;
+/**
+ * Qué confirmar al terminar: el mapa de anchos con el ancho final al soltar, o `null` si no hay
+ * nada que confirmar (se canceló, o se soltó sin cambiar el ancho de partida).
+ */
+export declare const endResizeDrag: (drag: ResizeDrag, widths: Readonly<KapiTableColumnWidths>, reason: "commit" | "cancel") => KapiTableColumnWidths | null;
+/**
+ * ¿Hay que repintar el `left` borrador de una columna? Se compara contra lo que está
+ * en pantalla: el último `left` pintado en este arrastre o, si no se pintó, el confirmado.
+ */
+export declare const needsDraftLeftPaint: (draftLeft: number | undefined, committedLeft: number | undefined, paintedLeft: number | undefined) => boolean;
+/** `left` de las columnas sticky con el ancho borrador de la columna arrastrada. */
+export declare const draftStickyLefts: (columns: ReadonlyArray<{
+    key: string;
+    sticky?: boolean;
+    width?: number;
+}>, widths: Readonly<KapiTableColumnWidths>, key: string, width: number, startOffset: number) => Array<number | undefined>;

package/dist/components/data/tableResizeLogic.js

@@ -0,0 +1,20 @@
+import { clampColumnWidth as e, computeStickyOffsets as t, effectiveColumnWidth as n, resizeColumn as r } from "./tableLogic.js";
+//#region src/components/data/tableResizeLogic.ts
+var i = (t, n, r, i) => ({
+	key: t,
+	startX: n,
+	startWidth: r,
+	min: i,
+	width: e(r, i)
+}), a = (t, n) => {
+	let r = e(t.startWidth + n - t.startX, t.min);
+	return r === t.width ? null : {
+		...t,
+		width: r
+	};
+}, o = (t, n, i) => i === "cancel" || t.width === e(t.startWidth, t.min) ? null : r(n, t.key, t.width, 0, t.min), s = (e, t, n) => e !== (n ?? t), c = (e, r, i, a, o) => t(e.map((e) => ({
+	sticky: e.sticky,
+	width: e.key === i ? a : n(e, r)
+})), o);
+//#endregion
+export { c as draftStickyLefts, o as endResizeDrag, a as moveResizeDrag, s as needsDraftLeftPaint, i as startResizeDrag };

package/dist/components/display/KapiAnnotation.d.ts

@@ -0,0 +1,32 @@
+import { type HTMLAttributes, type ReactNode } from "react";
+import { type KapiAnnotationTone, type KapiAnnotationUnderline } from "./annotationLogic";
+import "./KapiAnnotation.css";
+/**
+ * Atributos nativos (`id`, `style`, `data-*`, handlers de mouse…) van al término resaltado (el `<span>`/`<button>`
+ * que lleva `className`); el foco, el teclado, `onClick` y el nombre (`aria-label`) van al término. Un `aria-describedby`
+ * propio se suma al del popover.
+ */
+export type KapiAnnotationProps = Omit<HTMLAttributes<HTMLElement>, "children" | "onClick" | "onKeyDown" | "onFocus" | "onBlur" | "tabIndex" | "popover"> & {
+    /** El término resaltado (inline). */
+    children: ReactNode;
+    /** Texto corto que se muestra al pasar el mouse / enfocar. */
+    info: ReactNode;
+    /** Variante visual del subrayado. Default "dotted". */
+    underline?: KapiAnnotationUnderline;
+    /** Tono del resaltado (reusa tokens --kapi-*). Default "primary". */
+    tone?: KapiAnnotationTone;
+    /** Si se pasa, el término es clickeable (cursor pointer + onClick); útil para "ver más". */
+    onClick?: () => void;
+    /** Contenido rico opcional para un popover (título + cuerpo) en vez del tooltip simple. */
+    popover?: {
+        title?: ReactNode;
+        body: ReactNode;
+    };
+    /**
+     * Popover interactivo: el contenido se puede seleccionar/copiar y el mouse puede pasar del término al popover.
+     * Cierra con click afuera, Escape o al salir de ambos. Default false (hint efímero, sin eventos de mouse).
+     */
+    interactive?: boolean;
+};
+/** Término anotado: texto resaltado que revela info al hover/foco y, opcionalmente, es clickeable. */
+export declare function KapiAnnotation({ children, info, underline, tone, onClick, popover, interactive, className, "aria-label": ariaLabel, ...rest }: KapiAnnotationProps): import("react").JSX.Element;