@eifi1/ui-kit 0.4.1 → 0.5.0

package/dist/components/data-table-pagination.js

@@ -1,8 +1,10 @@
+"use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { ChevronLeft, ChevronRight } from "lucide-react";
 import { cn } from "../lib/cn.js";
 import { DEFAULT_DATA_TABLE_LABELS } from "./data-table-labels.js";
+import { useKitLocale } from "../i18n/kit-labels.js";
 const PAGE_SIZE_OPTIONS = [10, 25, 50, 100, 200];
 function Pagination({
   page,
@@ -11,8 +13,11 @@ function Pagination({
   total,
   onPage,
   onPageSize,
-  labels = DEFAULT_DATA_TABLE_LABELS
+  labels = DEFAULT_DATA_TABLE_LABELS,
+  locale: localeProp
 }) {
+  const locale = useKitLocale(localeProp);
+  const num = useMemo(() => new Intl.NumberFormat(locale), [locale]);
   const visible = useMemo(() => {
     if (totalPages <= 7) return Array.from({ length: totalPages }, (_, i) => i);
     const set = /* @__PURE__ */ new Set([0, totalPages - 1, page]);
@@ -27,18 +32,18 @@ function Pagination({
     if (idx > 0 && p - visible[idx - 1] > 1) items.push("ellipsis");
     items.push(p);
   });
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2 border-t border-slate-100 dark:border-slate-800 px-3 py-2 text-xs text-slate-600 dark:text-slate-400", children: [
+  return /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2 border-t border-[var(--border)] px-3 py-2 text-xs text-[var(--text-secondary)]", children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsx("span", { children: pageSize === Infinity ? `${total}` : `${page * pageSize + 1}\u2013${Math.min(total, (page + 1) * pageSize)} / ${total}` }),
+      /* @__PURE__ */ jsx("span", { children: pageSize === Infinity ? labels.rowCount(total) : labels.pageRange(page * pageSize + 1, Math.min(total, (page + 1) * pageSize), total) }),
       /* @__PURE__ */ jsxs(
         "select",
         {
           value: pageSize === Infinity ? "all" : pageSize,
           onChange: (e) => onPageSize(e.target.value === "all" ? Infinity : Number(e.target.value)),
-          className: "rounded border border-slate-200 bg-white px-1 py-0.5 text-xs dark:border-slate-700 dark:bg-slate-900",
+          className: "rounded border border-[var(--border)] bg-[var(--bg-surface)] px-1 py-0.5 text-xs",
           "aria-label": labels.pageSize,
           children: [
-            PAGE_SIZE_OPTIONS.map((n) => /* @__PURE__ */ jsx("option", { value: n, children: n }, n)),
+            PAGE_SIZE_OPTIONS.map((n) => /* @__PURE__ */ jsx("option", { value: n, children: num.format(n) }, n)),
             /* @__PURE__ */ jsx("option", { value: "all", children: labels.pageSizeAll })
           ]
         }
@@ -51,22 +56,23 @@ function Pagination({
           type: "button",
           onClick: () => onPage(Math.max(0, page - 1)),
           disabled: page === 0,
-          className: "rounded p-1 hover:bg-slate-100 disabled:opacity-40 dark:hover:bg-slate-800",
+          className: "rounded p-1 hover:bg-[var(--bg-hover)] disabled:opacity-40",
           "aria-label": labels.prevPage,
           children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-4" })
         }
       ),
       items.map(
-        (it, i) => it === "ellipsis" ? /* @__PURE__ */ jsx("span", { className: "px-1 text-slate-400 dark:text-slate-500", children: "\u2026" }, `e${i}`) : /* @__PURE__ */ jsx(
+        (it, i) => it === "ellipsis" ? /* @__PURE__ */ jsx("span", { className: "px-1 text-[var(--text-placeholder)]", children: "\u2026" }, `e${i}`) : /* @__PURE__ */ jsx(
           "button",
           {
             type: "button",
             onClick: () => onPage(it),
+            "aria-current": it === page ? "page" : void 0,
             className: cn(
               "min-w-7 rounded px-2 py-0.5",
-              it === page ? "bg-slate-900 text-white dark:bg-slate-100 dark:text-slate-900" : "hover:bg-slate-100 dark:hover:bg-slate-800"
+              it === page ? "bg-[var(--bg-inverse)] text-[var(--text-inverse)]" : "hover:bg-[var(--bg-hover)]"
             ),
-            children: it + 1
+            children: num.format(it + 1)
           },
           it
         )
@@ -77,7 +83,7 @@ function Pagination({
           type: "button",
           onClick: () => onPage(Math.min(totalPages - 1, page + 1)),
           disabled: page >= totalPages - 1,
-          className: "rounded p-1 hover:bg-slate-100 disabled:opacity-40 dark:hover:bg-slate-800",
+          className: "rounded p-1 hover:bg-[var(--bg-hover)] disabled:opacity-40",
           "aria-label": labels.nextPage,
           children: /* @__PURE__ */ jsx(ChevronRight, { className: "size-4" })
         }

package/dist/components/data-table-pagination.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/data-table-pagination.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { DEFAULT_DATA_TABLE_LABELS, type DataTableLabels } from \"./data-table-labels\";\n\nexport const PAGE_SIZE_OPTIONS = [10, 25, 50, 100, 200] as const;\n\ninterface PaginationProps {\n  page: number;\n  totalPages: number;\n  pageSize: number;\n  total: number;\n  onPage: (p: number) => void;\n  onPageSize: (n: number) => void;\n  labels?: DataTableLabels;\n}\n\n/** Footer for {@link DataTable}: range summary, page-size select, and a\n *  windowed page-number strip (first/last + ±2 around the current page). */\nexport function Pagination({\n  page,\n  totalPages,\n  pageSize,\n  total,\n  onPage,\n  onPageSize,\n  labels = DEFAULT_DATA_TABLE_LABELS,\n}: PaginationProps) {\n  const visible = useMemo(() => {\n    if (totalPages <= 7) return Array.from({ length: totalPages }, (_, i) => i);\n    const set = new Set<number>([0, totalPages - 1, page]);\n    for (let d = 1; d <= 2; d++) {\n      if (page - d >= 0) set.add(page - d);\n      if (page + d <= totalPages - 1) set.add(page + d);\n    }\n    return Array.from(set).sort((a, b) => a - b);\n  }, [page, totalPages]);\n\n  const items: (number | \"ellipsis\")[] = [];\n  visible.forEach((p, idx) => {\n    if (idx > 0 && p - visible[idx - 1] > 1) items.push(\"ellipsis\");\n    items.push(p);\n  });\n\n  return (\n    <div className=\"flex flex-wrap items-center justify-between gap-2 border-t border-slate-100 dark:border-slate-800 px-3 py-2 text-xs text-slate-600 dark:text-slate-400\">\n      <div className=\"flex items-center gap-2\">\n        <span>\n          {pageSize === Infinity\n            ? `${total}`\n            : `${page * pageSize + 1}–${Math.min(total, (page + 1) * pageSize)} / ${total}`}\n        </span>\n        <select\n          value={pageSize === Infinity ? \"all\" : pageSize}\n          onChange={(e) => onPageSize(e.target.value === \"all\" ? Infinity : Number(e.target.value))}\n          className=\"rounded border border-slate-200 bg-white px-1 py-0.5 text-xs dark:border-slate-700 dark:bg-slate-900\"\n          aria-label={labels.pageSize}\n        >\n          {PAGE_SIZE_OPTIONS.map((n) => (\n            <option key={n} value={n}>\n              {n}\n            </option>\n          ))}\n          <option value=\"all\">{labels.pageSizeAll}</option>\n        </select>\n      </div>\n      {pageSize !== Infinity && totalPages > 1 && (\n        <div className=\"flex items-center gap-1\">\n          <button\n            type=\"button\"\n            onClick={() => onPage(Math.max(0, page - 1))}\n            disabled={page === 0}\n            className=\"rounded p-1 hover:bg-slate-100 disabled:opacity-40 dark:hover:bg-slate-800\"\n            aria-label={labels.prevPage}\n          >\n            <ChevronLeft className=\"size-4\" />\n          </button>\n          {items.map((it, i) =>\n            it === \"ellipsis\" ? (\n              <span key={`e${i}`} className=\"px-1 text-slate-400 dark:text-slate-500\">\n                …\n              </span>\n            ) : (\n              <button\n                key={it}\n                type=\"button\"\n                onClick={() => onPage(it)}\n                className={cn(\n                  \"min-w-7 rounded px-2 py-0.5\",\n                  it === page\n                    ? \"bg-slate-900 text-white dark:bg-slate-100 dark:text-slate-900\"\n                    : \"hover:bg-slate-100 dark:hover:bg-slate-800\",\n                )}\n              >\n                {it + 1}\n              </button>\n            ),\n          )}\n          <button\n            type=\"button\"\n            onClick={() => onPage(Math.min(totalPages - 1, page + 1))}\n            disabled={page >= totalPages - 1}\n            className=\"rounded p-1 hover:bg-slate-100 disabled:opacity-40 dark:hover:bg-slate-800\"\n            aria-label={labels.nextPage}\n          >\n            <ChevronRight className=\"size-4\" />\n          </button>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/data-table-pagination.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { DEFAULT_DATA_TABLE_LABELS, type DataTableLabels } from \"./data-table-labels\";\nimport { useKitLocale } from \"../i18n/kit-labels\";\n\nexport const PAGE_SIZE_OPTIONS = [10, 25, 50, 100, 200] as const;\n\ninterface PaginationProps {\n  page: number;\n  totalPages: number;\n  pageSize: number;\n  total: number;\n  onPage: (p: number) => void;\n  onPageSize: (n: number) => void;\n  labels?: DataTableLabels;\n  /** For the page numbers and page-size options; falls back to the provider's. */\n  locale?: string;\n}\n\n/** Footer for {@link DataTable}: range summary, page-size select, and a\n *  windowed page-number strip (first/last + ±2 around the current page). */\nexport function Pagination({\n  page,\n  totalPages,\n  pageSize,\n  total,\n  onPage,\n  onPageSize,\n  labels = DEFAULT_DATA_TABLE_LABELS,\n  locale: localeProp,\n}: PaginationProps) {\n  const locale = useKitLocale(localeProp);\n  // The bare numbers on the strip and in the select are text too: `String(n)` is\n  // always ASCII digits, which is wrong for a locale that writes its own. The range\n  // summary is not formatted here — `pageRange` / `rowCount` take NUMBERS so the\n  // translation can format them itself, alongside the words around them.\n  const num = useMemo(() => new Intl.NumberFormat(locale), [locale]);\n  const visible = useMemo(() => {\n    if (totalPages <= 7) return Array.from({ length: totalPages }, (_, i) => i);\n    const set = new Set<number>([0, totalPages - 1, page]);\n    for (let d = 1; d <= 2; d++) {\n      if (page - d >= 0) set.add(page - d);\n      if (page + d <= totalPages - 1) set.add(page + d);\n    }\n    return Array.from(set).sort((a, b) => a - b);\n  }, [page, totalPages]);\n\n  const items: (number | \"ellipsis\")[] = [];\n  visible.forEach((p, idx) => {\n    if (idx > 0 && p - visible[idx - 1] > 1) items.push(\"ellipsis\");\n    items.push(p);\n  });\n\n  return (\n    <div className=\"flex flex-wrap items-center justify-between gap-2 border-t border-[var(--border)] px-3 py-2 text-xs text-[var(--text-secondary)]\">\n      <div className=\"flex items-center gap-2\">\n        <span>\n          {pageSize === Infinity\n            ? labels.rowCount(total)\n            : labels.pageRange(page * pageSize + 1, Math.min(total, (page + 1) * pageSize), total)}\n        </span>\n        <select\n          value={pageSize === Infinity ? \"all\" : pageSize}\n          onChange={(e) => onPageSize(e.target.value === \"all\" ? Infinity : Number(e.target.value))}\n          className=\"rounded border border-[var(--border)] bg-[var(--bg-surface)] px-1 py-0.5 text-xs\"\n          aria-label={labels.pageSize}\n        >\n          {PAGE_SIZE_OPTIONS.map((n) => (\n            <option key={n} value={n}>\n              {num.format(n)}\n            </option>\n          ))}\n          <option value=\"all\">{labels.pageSizeAll}</option>\n        </select>\n      </div>\n      {pageSize !== Infinity && totalPages > 1 && (\n        <div className=\"flex items-center gap-1\">\n          <button\n            type=\"button\"\n            onClick={() => onPage(Math.max(0, page - 1))}\n            disabled={page === 0}\n            className=\"rounded p-1 hover:bg-[var(--bg-hover)] disabled:opacity-40\"\n            aria-label={labels.prevPage}\n          >\n            <ChevronLeft className=\"size-4\" />\n          </button>\n          {items.map((it, i) =>\n            it === \"ellipsis\" ? (\n              <span key={`e${i}`} className=\"px-1 text-[var(--text-placeholder)]\">\n                …\n              </span>\n            ) : (\n              <button\n                key={it}\n                type=\"button\"\n                onClick={() => onPage(it)}\n                // Which page you are on is carried only by a background colour\n                // otherwise, and the strip is a row of bare numbers with nothing\n                // else to tell them apart.\n                aria-current={it === page ? \"page\" : undefined}\n                className={cn(\n                  \"min-w-7 rounded px-2 py-0.5\",\n                  it === page\n                    ? \"bg-[var(--bg-inverse)] text-[var(--text-inverse)]\"\n                    : \"hover:bg-[var(--bg-hover)]\",\n                )}\n              >\n                {num.format(it + 1)}\n              </button>\n            ),\n          )}\n          <button\n            type=\"button\"\n            onClick={() => onPage(Math.min(totalPages - 1, page + 1))}\n            disabled={page >= totalPages - 1}\n            className=\"rounded p-1 hover:bg-[var(--bg-hover)] disabled:opacity-40\"\n            aria-label={labels.nextPage}\n          >\n            <ChevronRight className=\"size-4\" />\n          </button>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/data-table-sort.js

@@ -1,3 +1,4 @@
+"use client";
 function normalizeSorts(raw) {
   const one = (v) => {
     if (!v || typeof v !== "object") return null;

package/dist/components/data-table-sort.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/data-table-sort.ts"],"sourcesContent":["/** Multi-column sort state for DataTable: ordered by priority (index 0 is the\n *  primary sort). Encoded as `sort=date.desc,amount` in URLs and the server's\n *  transactions `sort` param — the pre-multi-sort single-value format\n *  (`sort=date.desc`) decodes as a one-element list. */\n\nexport type SortDir = \"asc\" | \"desc\";\nexport interface SortState {\n  key: string;\n  dir: SortDir;\n}\n\n/** Coerce any persisted/URL-derived shape into a `SortState[]`. The\n *  pre-multi-sort localStorage format stored one `{key, dir}` object (or\n *  null); arrays pass through with junk entries dropped. */\nexport function normalizeSorts(raw: unknown): SortState[] {\n  const one = (v: unknown): SortState | null => {\n    if (!v || typeof v !== \"object\") return null;\n    const { key, dir } = v as { key?: unknown; dir?: unknown };\n    if (typeof key !== \"string\" || !key) return null;\n    return { key, dir: dir === \"desc\" ? \"desc\" : \"asc\" };\n  };\n  if (Array.isArray(raw)) {\n    const out: SortState[] = [];\n    for (const entry of raw) {\n      const s = one(entry);\n      if (s && !out.some((e) => e.key === s.key)) out.push(s);\n    }\n    return out;\n  }\n  const single = one(raw);\n  return single ? [single] : [];\n}\n\nexport function encodeSorts(sorts: SortState[]): string | null {\n  if (!sorts.length) return null;\n  return sorts.map((s) => (s.dir === \"desc\" ? `${s.key}.desc` : s.key)).join(\",\");\n}\n\n/** Decode a `sort` URL param, dropping unknown and duplicated keys. */\nexport function decodeSorts(raw: string | null, validKeys: ReadonlySet<string>): SortState[] {\n  if (!raw) return [];\n  const out: SortState[] = [];\n  for (const part of raw.split(\",\")) {\n    const desc = part.endsWith(\".desc\");\n    const asc = part.endsWith(\".asc\");\n    const key = desc ? part.slice(0, -\".desc\".length) : asc ? part.slice(0, -\".asc\".length) : part;\n    if (!validKeys.has(key) || out.some((s) => s.key === key)) continue;\n    out.push({ key, dir: desc ? \"desc\" : \"asc\" });\n  }\n  return out;\n}\n\n/** Header-click semantics. Plain click: make `key` the only sort — cycling\n *  asc → desc → none when it already is the sole criterion. Shift-click\n *  (`additive`): append `key` as the next-priority sort, or cycle an existing\n *  entry's direction in place (asc → desc → removed). */\nexport function nextSorts(prev: SortState[], key: string, additive: boolean): SortState[] {\n  const idx = prev.findIndex((s) => s.key === key);\n  if (!additive) {\n    if (prev.length === 1 && idx === 0) {\n      return prev[0].dir === \"asc\" ? [{ key, dir: \"desc\" }] : [];\n    }\n    return [{ key, dir: \"asc\" }];\n  }\n  if (idx === -1) return [...prev, { key, dir: \"asc\" }];\n  if (prev[idx].dir === \"asc\") {\n    return prev.map((s, i) => (i === idx ? { key, dir: \"desc\" as SortDir } : s));\n  }\n  return prev.filter((_, i) => i !== idx);\n}\n"],"mappings":"AAcO,SAAS,eAAe,KAA2B;AACxD,QAAM,MAAM,CAAC,MAAiC;AAC5C,QAAI,CAAC,KAAK,OAAO,MAAM,SAAU,QAAO;AACxC,UAAM,EAAE,KAAK,IAAI,IAAI;AACrB,QAAI,OAAO,QAAQ,YAAY,CAAC,IAAK,QAAO;AAC5C,WAAO,EAAE,KAAK,KAAK,QAAQ,SAAS,SAAS,MAAM;AAAA,EACrD;AACA,MAAI,MAAM,QAAQ,GAAG,GAAG;AACtB,UAAM,MAAmB,CAAC;AAC1B,eAAW,SAAS,KAAK;AACvB,YAAM,IAAI,IAAI,KAAK;AACnB,UAAI,KAAK,CAAC,IAAI,KAAK,CAAC,MAAM,EAAE,QAAQ,EAAE,GAAG,EAAG,KAAI,KAAK,CAAC;AAAA,IACxD;AACA,WAAO;AAAA,EACT;AACA,QAAM,SAAS,IAAI,GAAG;AACtB,SAAO,SAAS,CAAC,MAAM,IAAI,CAAC;AAC9B;AAEO,SAAS,YAAY,OAAmC;AAC7D,MAAI,CAAC,MAAM,OAAQ,QAAO;AAC1B,SAAO,MAAM,IAAI,CAAC,MAAO,EAAE,QAAQ,SAAS,GAAG,EAAE,GAAG,UAAU,EAAE,GAAI,EAAE,KAAK,GAAG;AAChF;AAGO,SAAS,YAAY,KAAoB,WAA6C;AAC3F,MAAI,CAAC,IAAK,QAAO,CAAC;AAClB,QAAM,MAAmB,CAAC;AAC1B,aAAW,QAAQ,IAAI,MAAM,GAAG,GAAG;AACjC,UAAM,OAAO,KAAK,SAAS,OAAO;AAClC,UAAM,MAAM,KAAK,SAAS,MAAM;AAChC,UAAM,MAAM,OAAO,KAAK,MAAM,GAAG,CAAC,QAAQ,MAAM,IAAI,MAAM,KAAK,MAAM,GAAG,CAAC,OAAO,MAAM,IAAI;AAC1F,QAAI,CAAC,UAAU,IAAI,GAAG,KAAK,IAAI,KAAK,CAAC,MAAM,EAAE,QAAQ,GAAG,EAAG;AAC3D,QAAI,KAAK,EAAE,KAAK,KAAK,OAAO,SAAS,MAAM,CAAC;AAAA,EAC9C;AACA,SAAO;AACT;AAMO,SAAS,UAAU,MAAmB,KAAa,UAAgC;AACxF,QAAM,MAAM,KAAK,UAAU,CAAC,MAAM,EAAE,QAAQ,GAAG;AAC/C,MAAI,CAAC,UAAU;AACb,QAAI,KAAK,WAAW,KAAK,QAAQ,GAAG;AAClC,aAAO,KAAK,CAAC,EAAE,QAAQ,QAAQ,CAAC,EAAE,KAAK,KAAK,OAAO,CAAC,IAAI,CAAC;AAAA,IAC3D;AACA,WAAO,CAAC,EAAE,KAAK,KAAK,MAAM,CAAC;AAAA,EAC7B;AACA,MAAI,QAAQ,GAAI,QAAO,CAAC,GAAG,MAAM,EAAE,KAAK,KAAK,MAAM,CAAC;AACpD,MAAI,KAAK,GAAG,EAAE,QAAQ,OAAO;AAC3B,WAAO,KAAK,IAAI,CAAC,GAAG,MAAO,MAAM,MAAM,EAAE,KAAK,KAAK,OAAkB,IAAI,CAAE;AAAA,EAC7E;AACA,SAAO,KAAK,OAAO,CAAC,GAAG,MAAM,MAAM,GAAG;AACxC;","names":[]}
+{"version":3,"sources":["../../src/components/data-table-sort.ts"],"sourcesContent":["/** Multi-column sort state for DataTable: ordered by priority (index 0 is the\n *  primary sort). Encoded as `sort=date.desc,amount` in URLs and the server's\n *  transactions `sort` param — the pre-multi-sort single-value format\n *  (`sort=date.desc`) decodes as a one-element list. */\n\nexport type SortDir = \"asc\" | \"desc\";\nexport interface SortState {\n  key: string;\n  dir: SortDir;\n}\n\n/** Coerce any persisted/URL-derived shape into a `SortState[]`. The\n *  pre-multi-sort localStorage format stored one `{key, dir}` object (or\n *  null); arrays pass through with junk entries dropped. */\nexport function normalizeSorts(raw: unknown): SortState[] {\n  const one = (v: unknown): SortState | null => {\n    if (!v || typeof v !== \"object\") return null;\n    const { key, dir } = v as { key?: unknown; dir?: unknown };\n    if (typeof key !== \"string\" || !key) return null;\n    return { key, dir: dir === \"desc\" ? \"desc\" : \"asc\" };\n  };\n  if (Array.isArray(raw)) {\n    const out: SortState[] = [];\n    for (const entry of raw) {\n      const s = one(entry);\n      if (s && !out.some((e) => e.key === s.key)) out.push(s);\n    }\n    return out;\n  }\n  const single = one(raw);\n  return single ? [single] : [];\n}\n\nexport function encodeSorts(sorts: SortState[]): string | null {\n  if (!sorts.length) return null;\n  return sorts.map((s) => (s.dir === \"desc\" ? `${s.key}.desc` : s.key)).join(\",\");\n}\n\n/** Decode a `sort` URL param, dropping unknown and duplicated keys. */\nexport function decodeSorts(raw: string | null, validKeys: ReadonlySet<string>): SortState[] {\n  if (!raw) return [];\n  const out: SortState[] = [];\n  for (const part of raw.split(\",\")) {\n    const desc = part.endsWith(\".desc\");\n    const asc = part.endsWith(\".asc\");\n    const key = desc ? part.slice(0, -\".desc\".length) : asc ? part.slice(0, -\".asc\".length) : part;\n    if (!validKeys.has(key) || out.some((s) => s.key === key)) continue;\n    out.push({ key, dir: desc ? \"desc\" : \"asc\" });\n  }\n  return out;\n}\n\n/** Header-click semantics. Plain click: make `key` the only sort — cycling\n *  asc → desc → none when it already is the sole criterion. Shift-click\n *  (`additive`): append `key` as the next-priority sort, or cycle an existing\n *  entry's direction in place (asc → desc → removed). */\nexport function nextSorts(prev: SortState[], key: string, additive: boolean): SortState[] {\n  const idx = prev.findIndex((s) => s.key === key);\n  if (!additive) {\n    if (prev.length === 1 && idx === 0) {\n      return prev[0].dir === \"asc\" ? [{ key, dir: \"desc\" }] : [];\n    }\n    return [{ key, dir: \"asc\" }];\n  }\n  if (idx === -1) return [...prev, { key, dir: \"asc\" }];\n  if (prev[idx].dir === \"asc\") {\n    return prev.map((s, i) => (i === idx ? { key, dir: \"desc\" as SortDir } : s));\n  }\n  return prev.filter((_, i) => i !== idx);\n}\n"],"mappings":";AAcO,SAAS,eAAe,KAA2B;AACxD,QAAM,MAAM,CAAC,MAAiC;AAC5C,QAAI,CAAC,KAAK,OAAO,MAAM,SAAU,QAAO;AACxC,UAAM,EAAE,KAAK,IAAI,IAAI;AACrB,QAAI,OAAO,QAAQ,YAAY,CAAC,IAAK,QAAO;AAC5C,WAAO,EAAE,KAAK,KAAK,QAAQ,SAAS,SAAS,MAAM;AAAA,EACrD;AACA,MAAI,MAAM,QAAQ,GAAG,GAAG;AACtB,UAAM,MAAmB,CAAC;AAC1B,eAAW,SAAS,KAAK;AACvB,YAAM,IAAI,IAAI,KAAK;AACnB,UAAI,KAAK,CAAC,IAAI,KAAK,CAAC,MAAM,EAAE,QAAQ,EAAE,GAAG,EAAG,KAAI,KAAK,CAAC;AAAA,IACxD;AACA,WAAO;AAAA,EACT;AACA,QAAM,SAAS,IAAI,GAAG;AACtB,SAAO,SAAS,CAAC,MAAM,IAAI,CAAC;AAC9B;AAEO,SAAS,YAAY,OAAmC;AAC7D,MAAI,CAAC,MAAM,OAAQ,QAAO;AAC1B,SAAO,MAAM,IAAI,CAAC,MAAO,EAAE,QAAQ,SAAS,GAAG,EAAE,GAAG,UAAU,EAAE,GAAI,EAAE,KAAK,GAAG;AAChF;AAGO,SAAS,YAAY,KAAoB,WAA6C;AAC3F,MAAI,CAAC,IAAK,QAAO,CAAC;AAClB,QAAM,MAAmB,CAAC;AAC1B,aAAW,QAAQ,IAAI,MAAM,GAAG,GAAG;AACjC,UAAM,OAAO,KAAK,SAAS,OAAO;AAClC,UAAM,MAAM,KAAK,SAAS,MAAM;AAChC,UAAM,MAAM,OAAO,KAAK,MAAM,GAAG,CAAC,QAAQ,MAAM,IAAI,MAAM,KAAK,MAAM,GAAG,CAAC,OAAO,MAAM,IAAI;AAC1F,QAAI,CAAC,UAAU,IAAI,GAAG,KAAK,IAAI,KAAK,CAAC,MAAM,EAAE,QAAQ,GAAG,EAAG;AAC3D,QAAI,KAAK,EAAE,KAAK,KAAK,OAAO,SAAS,MAAM,CAAC;AAAA,EAC9C;AACA,SAAO;AACT;AAMO,SAAS,UAAU,MAAmB,KAAa,UAAgC;AACxF,QAAM,MAAM,KAAK,UAAU,CAAC,MAAM,EAAE,QAAQ,GAAG;AAC/C,MAAI,CAAC,UAAU;AACb,QAAI,KAAK,WAAW,KAAK,QAAQ,GAAG;AAClC,aAAO,KAAK,CAAC,EAAE,QAAQ,QAAQ,CAAC,EAAE,KAAK,KAAK,OAAO,CAAC,IAAI,CAAC;AAAA,IAC3D;AACA,WAAO,CAAC,EAAE,KAAK,KAAK,MAAM,CAAC;AAAA,EAC7B;AACA,MAAI,QAAQ,GAAI,QAAO,CAAC,GAAG,MAAM,EAAE,KAAK,KAAK,MAAM,CAAC;AACpD,MAAI,KAAK,GAAG,EAAE,QAAQ,OAAO;AAC3B,WAAO,KAAK,IAAI,CAAC,GAAG,MAAO,MAAM,MAAM,EAAE,KAAK,KAAK,OAAkB,IAAI,CAAE;AAAA,EAC7E;AACA,SAAO,KAAK,OAAO,CAAC,GAAG,MAAM,MAAM,GAAG;AACxC;","names":[]}

package/dist/components/data-table.d.ts

@@ -1,5 +1,5 @@
 import 'react';
-export { D as DataTable, a as DataTableColumn, b as DataTableProps, F as FilterState, S as ServerPagination } from '../data-table-filters-aXyf0Xub.js';
+export { D as DataTable, a as DataTableColumn, b as DataTableProps, F as FilterState, S as ServerPagination } from '../data-table-filters-DM1auUfH.js';
 export { SortState } from './data-table-sort.js';
 import './swipeable-row.js';
 import './data-table-labels.js';