@eifi1/ui-kit 0.10.0 → 0.12.0

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

@@ -0,0 +1,64 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Check, Minus, X } from "lucide-react";
+import { cn } from "../lib/cn.js";
+import { useKitLabels } from "../i18n/kit-labels.js";
+import { DEFAULT_DATA_TABLE_LABELS } from "./data-table-labels.js";
+function BooleanMark({ value, falseAs = "cross", labels: labelsProp, className }) {
+  const labels = useKitLabels("dataTable", DEFAULT_DATA_TABLE_LABELS, labelsProp);
+  const state = value === true ? "true" : value === false ? "false" : "unset";
+  const text = state === "true" ? labels.booleanTrue : state === "false" ? labels.booleanFalse : labels.booleanUnset;
+  const Icon = state === "true" ? Check : state === "false" && falseAs === "cross" ? X : Minus;
+  return /* @__PURE__ */ jsxs("span", { "data-value": state, className: cn("inline-flex items-center align-middle", className), children: [
+    /* @__PURE__ */ jsx(
+      Icon,
+      {
+        "aria-hidden": true,
+        className: cn(
+          "size-4",
+          state === "true" ? "text-[var(--success)]" : state === "false" && falseAs === "cross" ? "text-[var(--text-muted)]" : "text-[var(--text-placeholder)]"
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { className: "sr-only", children: text })
+  ] });
+}
+function booleanColumn({
+  key,
+  header,
+  value,
+  falseAs,
+  sortable = true,
+  filterOptions,
+  column
+}) {
+  const asKey = (row) => {
+    const v = value(row);
+    return v === true ? "true" : v === false ? "false" : "unset";
+  };
+  return {
+    key,
+    header,
+    cell: (row) => /* @__PURE__ */ jsx(BooleanMark, { value: value(row), falseAs }),
+    // 0 for yes, 1 for no, null for unset (which the table sorts last either way).
+    sortBy: sortable ? (row) => {
+      const v = value(row);
+      return v == null ? null : v ? 0 : 1;
+    } : void 0,
+    filter: filterOptions ? {
+      type: "select",
+      getValue: asKey,
+      options: [
+        { value: "true", label: filterOptions.true },
+        { value: "false", label: filterOptions.false },
+        ...filterOptions.unset !== void 0 ? [{ value: "unset", label: filterOptions.unset }] : []
+      ]
+    } : void 0,
+    ...column
+  };
+}
+export {
+  BooleanMark,
+  booleanColumn
+};
+//# sourceMappingURL=data-table-cells.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/data-table-cells.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Check, Minus, X } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { useKitLabels } from \"../i18n/kit-labels\";\nimport { DEFAULT_DATA_TABLE_LABELS, type DataTableLabels } from \"./data-table-labels\";\nimport type { DataTableColumn } from \"./data-table\";\n\nexport interface BooleanMarkProps {\n  /** `true` → a check, `false` → a cross (or a dash, see `falseAs`), `null` /\n   *  `undefined` → a dash. */\n  value: boolean | null | undefined;\n  /**\n   * How `false` is drawn. `\"cross\"` (default) when \"no\" is news worth seeing — a\n   * failed check, a missing document. `\"dash\"` for a column that is mostly `false` and\n   * reads as a list of the `true` ones (kastlan's BoolCell): a column of crosses is\n   * noise. The screen-reader text says \"No\" either way.\n   */\n  falseAs?: \"cross\" | \"dash\";\n  /** The spoken words, over `dataTable.booleanTrue` / `booleanFalse` / `booleanUnset`\n   *  from `<UiKitProvider labels>`. */\n  labels?: Partial<Pick<DataTableLabels, \"booleanTrue\" | \"booleanFalse\" | \"booleanUnset\">>;\n  className?: string;\n}\n\n/**\n * A yes/no value in a table cell: a green check, a muted cross, or a faint dash for\n * \"not set\" — with the word for a screen reader, since a glyph alone is announced as\n * nothing at all (or as \"image\").\n *\n * kastlan's `BoolCell` (shared/components/data-table/bool-cell.tsx) drew the icons with\n * no text, so a reader walking the table heard an empty cell for every row; the apps'\n * Yes/No chips were the other answer, and too loud for a column of them.\n */\nexport function BooleanMark({ value, falseAs = \"cross\", labels: labelsProp, className }: BooleanMarkProps) {\n  const labels = useKitLabels(\"dataTable\", DEFAULT_DATA_TABLE_LABELS, labelsProp);\n  const state = value === true ? \"true\" : value === false ? \"false\" : \"unset\";\n  const text =\n    state === \"true\" ? labels.booleanTrue : state === \"false\" ? labels.booleanFalse : labels.booleanUnset;\n  const Icon = state === \"true\" ? Check : state === \"false\" && falseAs === \"cross\" ? X : Minus;\n  return (\n    <span data-value={state} className={cn(\"inline-flex items-center align-middle\", className)}>\n      <Icon\n        aria-hidden\n        className={cn(\n          \"size-4\",\n          state === \"true\"\n            ? \"text-[var(--success)]\"\n            : state === \"false\" && falseAs === \"cross\"\n              ? \"text-[var(--text-muted)]\"\n              : \"text-[var(--text-placeholder)]\",\n        )}\n      />\n      <span className=\"sr-only\">{text}</span>\n    </span>\n  );\n}\n\nexport interface BooleanColumnOptions<T> {\n  key: string;\n  header: ReactNode;\n  /** The value of this row. */\n  value: (row: T) => boolean | null | undefined;\n  /** See {@link BooleanMarkProps.falseAs}. */\n  falseAs?: \"cross\" | \"dash\";\n  /** Sortable, `true` first on the first click (a column is sorted to find the yes\n   *  rows). Default true. */\n  sortable?: boolean;\n  /**\n   * A select filter over the column, with these option labels — pass them translated.\n   * Omitted: no filter. The option values are `\"true\"` / `\"false\"` (and `\"unset\"` when\n   * `unset` is given), which is also what `filterHref` takes for this column.\n   */\n  filterOptions?: { true: string; false: string; unset?: string };\n  /** Further column settings (`mobileHidden`, `headClassName`, …), merged over. */\n  column?: Partial<DataTableColumn<T>>;\n}\n\n/**\n * A {@link DataTableColumn} for a yes/no field: {@link BooleanMark} cells,\n * sortable with `true` first, and optionally a Yes/No select filter.\n */\nexport function booleanColumn<T>({\n  key,\n  header,\n  value,\n  falseAs,\n  sortable = true,\n  filterOptions,\n  column,\n}: BooleanColumnOptions<T>): DataTableColumn<T> {\n  const asKey = (row: T) => {\n    const v = value(row);\n    return v === true ? \"true\" : v === false ? \"false\" : \"unset\";\n  };\n  return {\n    key,\n    header,\n    cell: (row) => <BooleanMark value={value(row)} falseAs={falseAs} />,\n    // 0 for yes, 1 for no, null for unset (which the table sorts last either way).\n    sortBy: sortable\n      ? (row) => {\n          const v = value(row);\n          return v == null ? null : v ? 0 : 1;\n        }\n      : undefined,\n    filter: filterOptions\n      ? {\n          type: \"select\",\n          getValue: asKey,\n          options: [\n            { value: \"true\", label: filterOptions.true },\n            { value: \"false\", label: filterOptions.false },\n            ...(filterOptions.unset !== undefined ? [{ value: \"unset\", label: filterOptions.unset }] : []),\n          ],\n        }\n      : undefined,\n    ...column,\n  };\n}\n"],"mappings":";AAwCI,SACE,KADF;AAvCJ,SAAS,OAAO,OAAO,SAAS;AAChC,SAAS,UAAU;AACnB,SAAS,oBAAoB;AAC7B,SAAS,iCAAuD;AA6BzD,SAAS,YAAY,EAAE,OAAO,UAAU,SAAS,QAAQ,YAAY,UAAU,GAAqB;AACzG,QAAM,SAAS,aAAa,aAAa,2BAA2B,UAAU;AAC9E,QAAM,QAAQ,UAAU,OAAO,SAAS,UAAU,QAAQ,UAAU;AACpE,QAAM,OACJ,UAAU,SAAS,OAAO,cAAc,UAAU,UAAU,OAAO,eAAe,OAAO;AAC3F,QAAM,OAAO,UAAU,SAAS,QAAQ,UAAU,WAAW,YAAY,UAAU,IAAI;AACvF,SACE,qBAAC,UAAK,cAAY,OAAO,WAAW,GAAG,yCAAyC,SAAS,GACvF;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,eAAW;AAAA,QACX,WAAW;AAAA,UACT;AAAA,UACA,UAAU,SACN,0BACA,UAAU,WAAW,YAAY,UAC/B,6BACA;AAAA,QACR;AAAA;AAAA,IACF;AAAA,IACA,oBAAC,UAAK,WAAU,WAAW,gBAAK;AAAA,KAClC;AAEJ;AA0BO,SAAS,cAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AACF,GAAgD;AAC9C,QAAM,QAAQ,CAAC,QAAW;AACxB,UAAM,IAAI,MAAM,GAAG;AACnB,WAAO,MAAM,OAAO,SAAS,MAAM,QAAQ,UAAU;AAAA,EACvD;AACA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,MAAM,CAAC,QAAQ,oBAAC,eAAY,OAAO,MAAM,GAAG,GAAG,SAAkB;AAAA;AAAA,IAEjE,QAAQ,WACJ,CAAC,QAAQ;AACP,YAAM,IAAI,MAAM,GAAG;AACnB,aAAO,KAAK,OAAO,OAAO,IAAI,IAAI;AAAA,IACpC,IACA;AAAA,IACJ,QAAQ,gBACJ;AAAA,MACE,MAAM;AAAA,MACN,UAAU;AAAA,MACV,SAAS;AAAA,QACP,EAAE,OAAO,QAAQ,OAAO,cAAc,KAAK;AAAA,QAC3C,EAAE,OAAO,SAAS,OAAO,cAAc,MAAM;AAAA,QAC7C,GAAI,cAAc,UAAU,SAAY,CAAC,EAAE,OAAO,SAAS,OAAO,cAAc,MAAM,CAAC,IAAI,CAAC;AAAA,MAC9F;AAAA,IACF,IACA;AAAA,IACJ,GAAG;AAAA,EACL;AACF;","names":[]}

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

@@ -1,5 +1,5 @@
 import * as react from 'react';
-import { b as DataTableColumn, e as FilterValue } from '../data-table-filters-Dh9uF_S-.js';
+import { b as DataTableColumn, f as FilterValue } from '../data-table-Drun8Fk9.js';
 import { DataTableLabels } from './data-table-labels.js';
 import './data-table-sort.js';
 import './swipeable-row.js';

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

@@ -1,4 +1,4 @@
-export { C as ColumnFilter, e as FilterValue, f as decodeFilterValue, g as decodeFilterValueOfType, h as defaultFilterState, i as encodeFilterValue, j as isFilterActive, r as resolveFilter, k as rowMatches } from '../data-table-filters-Dh9uF_S-.js';
+export { C as ColumnFilter, f as FilterValue, j as dateFilter, k as decodeFilterValue, l as decodeFilterValueOfType, m as defaultFilterState, n as encodeFilterValue, o as filterHref, p as isFilterActive, q as numberFilter, s as resolveFilter, t as rowMatches, u as selectFilter, v as textFilter } from '../data-table-Drun8Fk9.js';
 import 'react';
 import './data-table-sort.js';
 import './swipeable-row.js';

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

@@ -107,13 +107,43 @@ function decodeFilterValueOfType(type, raw) {
 function decodeFilterValue(filter, raw) {
   return decodeFilterValueOfType(filter.type, raw);
 }
+function textFilter(getValue) {
+  return { type: "text", getValue };
+}
+function selectFilter(getValue, options) {
+  const opts = Array.isArray(options) ? options : options ? Object.entries(options).map(([value, label]) => ({ value, label })) : void 0;
+  return { type: "select", getValue, options: opts };
+}
+function dateFilter(getValue) {
+  return { type: "date", getValue };
+}
+function numberFilter(getValue) {
+  return { type: "number", getValue };
+}
+function filterHref(path, column, value, options) {
+  const state = typeof value === "string" ? { type: "text", q: value } : Array.isArray(value) ? { type: "select", values: value } : value;
+  const encoded = encodeFilterValue(state);
+  if (encoded == null) return path;
+  const hashAt = path.indexOf("#");
+  const base = hashAt >= 0 ? path.slice(0, hashAt) : path;
+  const hash = hashAt >= 0 ? path.slice(hashAt) : "";
+  const queryAt = base.indexOf("?");
+  const params = new URLSearchParams(queryAt >= 0 ? base.slice(queryAt + 1) : "");
+  params.set(`${options?.prefix ?? ""}f.${column}`, encoded);
+  return `${queryAt >= 0 ? base.slice(0, queryAt) : base}?${params.toString()}${hash}`;
+}
 export {
+  dateFilter,
   decodeFilterValue,
   decodeFilterValueOfType,
   defaultFilterState,
   encodeFilterValue,
+  filterHref,
   isFilterActive,
+  numberFilter,
   resolveFilter,
-  rowMatches
+  rowMatches,
+  selectFilter,
+  textFilter
 };
 //# sourceMappingURL=data-table-filters.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/data-table-filters.ts"],"sourcesContent":["import type { DataTableColumn } from \"./data-table\";\n\n/** How a column is filtered. `text`/`select`/`date`/`number` each read a value\n *  off the row and compare it against the user's {@link FilterValue}. */\nexport type ColumnFilter<T> =\n  | { type: \"text\"; getValue: (row: T) => string }\n  | { type: \"select\"; getValue: (row: T) => string; options?: { value: string; label?: string }[] }\n  | { type: \"date\"; getValue: (row: T) => string | null | undefined }\n  | { type: \"number\"; getValue: (row: T) => number | null | undefined };\n\n/** The current state of a column's filter (what the user has entered). */\nexport type FilterValue =\n  | { type: \"text\"; q: string }\n  | { type: \"select\"; values: string[] }\n  | { type: \"date\"; from: string; to: string }\n  | { type: \"number\"; min: string; max: string; abs: boolean };\n\n/** A column's filter config, falling back to a plain text filter over `filterBy`. */\nexport function resolveFilter<T>(col: DataTableColumn<T>): ColumnFilter<T> | null {\n  if (col.filter) return col.filter;\n  if (col.filterBy) return { type: \"text\", getValue: col.filterBy };\n  return null;\n}\n\n/** Whether a filter value is actually narrowing anything (vs its empty default). */\nexport function isFilterActive(v: FilterValue | undefined): boolean {\n  if (!v) return false;\n  switch (v.type) {\n    case \"text\":\n      return v.q.trim().length > 0;\n    case \"select\":\n      return v.values.length > 0;\n    case \"date\":\n      return !!v.from || !!v.to;\n    case \"number\":\n      return v.min !== \"\" || v.max !== \"\" || v.abs;\n  }\n}\n\n/**\n * Whether `row` passes column `col`'s filter given the user's `state`.\n *\n * `locale` is for the text filter's case folding. Plain `toLowerCase` folds by the\n * root rules, under which a Turkish user typing \"istanbul\" does not find \"İSTANBUL\";\n * `toLocaleLowerCase(locale)` does. Optional, and `undefined` is the runtime's default.\n */\nexport function rowMatches<T>(\n  col: DataTableColumn<T>,\n  row: T,\n  state: FilterValue,\n  locale?: string,\n): boolean {\n  const filter = resolveFilter(col);\n  if (!filter) return true;\n  switch (filter.type) {\n    case \"text\": {\n      if (state.type !== \"text\" || !state.q.trim()) return true;\n      return filter\n        .getValue(row)\n        .toLocaleLowerCase(locale)\n        .includes(state.q.trim().toLocaleLowerCase(locale));\n    }\n    case \"select\": {\n      if (state.type !== \"select\" || state.values.length === 0) return true;\n      return state.values.includes(filter.getValue(row));\n    }\n    case \"date\": {\n      if (state.type !== \"date\") return true;\n      const raw = filter.getValue(row);\n      if (!raw) return !state.from && !state.to;\n      const v = raw.slice(0, 10);\n      if (state.from && v < state.from) return false;\n      if (state.to && v > state.to) return false;\n      return true;\n    }\n    case \"number\": {\n      if (state.type !== \"number\") return true;\n      const raw = filter.getValue(row);\n      if (raw == null || Number.isNaN(raw)) return !state.min && !state.max;\n      const x = state.abs ? Math.abs(raw) : raw;\n      if (state.min !== \"\" && x < Number(state.min)) return false;\n      if (state.max !== \"\" && x > Number(state.max)) return false;\n      return true;\n    }\n  }\n}\n\n/** The empty filter state for a column's filter type. */\nexport function defaultFilterState<T>(filter: ColumnFilter<T>): FilterValue {\n  switch (filter.type) {\n    case \"text\":\n      return { type: \"text\", q: \"\" };\n    case \"select\":\n      return { type: \"select\", values: [] };\n    case \"date\":\n      return { type: \"date\", from: \"\", to: \"\" };\n    case \"number\":\n      return { type: \"number\", min: \"\", max: \"\", abs: false };\n  }\n}\n\n/**\n * Escape the ONE character the select codec uses as its separator, plus the escape\n * marker itself so the transform is reversible.\n *\n * A minimal escape rather than `encodeURIComponent`, deliberately: these strings sit\n * inside a query-parameter value that `URLSearchParams` already encodes, so a full\n * percent-encode would double-encode every space into `%2520` and make shared links\n * unreadable for no gain. Only `,` can be misread here.\n *\n * Backwards compatible with every link written before this existed: a value with\n * neither `,` nor `%` passes through both directions untouched, and `%` on its own\n * never matched `%25` either.\n */\nfunction escapeSelectValue(v: string): string {\n  return v.replace(/%/g, \"%25\").replace(/,/g, \"%2C\");\n}\n\n/** Inverse of {@link escapeSelectValue}. The order matters and is the reverse of the\n *  escape: undoing `%2C` first cannot see the `2C` inside an escaped `%252C`. */\nfunction unescapeSelectValue(v: string): string {\n  return v.replace(/%2C/g, \",\").replace(/%25/g, \"%\");\n}\n\n/** URL-safe encoding of a filter value (`f.<column>` param), null when empty. */\nexport function encodeFilterValue(v: FilterValue): string | null {\n  switch (v.type) {\n    case \"text\":\n      return v.q.trim() ? v.q : null;\n    case \"select\":\n      // Escaped before joining: an option value may legitimately contain the\n      // separator (a free-text title, a payee or category name), and without this it\n      // came back as two values and the filter silently matched nothing.\n      return v.values.length ? v.values.map(escapeSelectValue).join(\",\") : null;\n    case \"date\":\n      return v.from || v.to ? `${v.from}..${v.to}` : null;\n    case \"number\": {\n      const hasRange = v.min !== \"\" || v.max !== \"\";\n      if (!hasRange && !v.abs) return null;\n      return `${v.min}..${v.max}${v.abs ? \"!\" : \"\"}`;\n    }\n  }\n}\n\n/** Inverse of {@link encodeFilterValue} given just the filter type — for\n *  callers that know a column's type without holding its full config. */\nexport function decodeFilterValueOfType(type: FilterValue[\"type\"], raw: string): FilterValue {\n  switch (type) {\n    case \"text\":\n      return { type: \"text\", q: raw };\n    case \"select\":\n      return {\n        type: \"select\",\n        values: raw\n          .split(\",\")\n          .filter((v) => v.length > 0)\n          .map(unescapeSelectValue),\n      };\n    case \"date\": {\n      const [from = \"\", to = \"\"] = raw.split(\"..\");\n      return { type: \"date\", from, to };\n    }\n    case \"number\": {\n      let body = raw;\n      const abs = body.endsWith(\"!\");\n      if (abs) body = body.slice(0, -1);\n      const [min = \"\", max = \"\"] = body.split(\"..\");\n      return { type: \"number\", min, max, abs };\n    }\n  }\n}\n\n/** Inverse of {@link encodeFilterValue}, typed by the column's filter config. */\nexport function decodeFilterValue<T>(filter: ColumnFilter<T>, raw: string): FilterValue {\n  return decodeFilterValueOfType(filter.type, raw);\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/data-table-filters.ts"],"sourcesContent":["import type { DataTableColumn } from \"./data-table\";\n\n/** How a column is filtered. `text`/`select`/`date`/`number` each read a value\n *  off the row and compare it against the user's {@link FilterValue}. */\nexport type ColumnFilter<T> =\n  | { type: \"text\"; getValue: (row: T) => string }\n  | { type: \"select\"; getValue: (row: T) => string; options?: { value: string; label?: string }[] }\n  | { type: \"date\"; getValue: (row: T) => string | null | undefined }\n  | { type: \"number\"; getValue: (row: T) => number | null | undefined };\n\n/** The current state of a column's filter (what the user has entered). */\nexport type FilterValue =\n  | { type: \"text\"; q: string }\n  | { type: \"select\"; values: string[] }\n  | { type: \"date\"; from: string; to: string }\n  | { type: \"number\"; min: string; max: string; abs: boolean };\n\n/** A column's filter config, falling back to a plain text filter over `filterBy`. */\nexport function resolveFilter<T>(col: DataTableColumn<T>): ColumnFilter<T> | null {\n  if (col.filter) return col.filter;\n  if (col.filterBy) return { type: \"text\", getValue: col.filterBy };\n  return null;\n}\n\n/** Whether a filter value is actually narrowing anything (vs its empty default). */\nexport function isFilterActive(v: FilterValue | undefined): boolean {\n  if (!v) return false;\n  switch (v.type) {\n    case \"text\":\n      return v.q.trim().length > 0;\n    case \"select\":\n      return v.values.length > 0;\n    case \"date\":\n      return !!v.from || !!v.to;\n    case \"number\":\n      return v.min !== \"\" || v.max !== \"\" || v.abs;\n  }\n}\n\n/**\n * Whether `row` passes column `col`'s filter given the user's `state`.\n *\n * `locale` is for the text filter's case folding. Plain `toLowerCase` folds by the\n * root rules, under which a Turkish user typing \"istanbul\" does not find \"İSTANBUL\";\n * `toLocaleLowerCase(locale)` does. Optional, and `undefined` is the runtime's default.\n */\nexport function rowMatches<T>(\n  col: DataTableColumn<T>,\n  row: T,\n  state: FilterValue,\n  locale?: string,\n): boolean {\n  const filter = resolveFilter(col);\n  if (!filter) return true;\n  switch (filter.type) {\n    case \"text\": {\n      if (state.type !== \"text\" || !state.q.trim()) return true;\n      return filter\n        .getValue(row)\n        .toLocaleLowerCase(locale)\n        .includes(state.q.trim().toLocaleLowerCase(locale));\n    }\n    case \"select\": {\n      if (state.type !== \"select\" || state.values.length === 0) return true;\n      return state.values.includes(filter.getValue(row));\n    }\n    case \"date\": {\n      if (state.type !== \"date\") return true;\n      const raw = filter.getValue(row);\n      if (!raw) return !state.from && !state.to;\n      const v = raw.slice(0, 10);\n      if (state.from && v < state.from) return false;\n      if (state.to && v > state.to) return false;\n      return true;\n    }\n    case \"number\": {\n      if (state.type !== \"number\") return true;\n      const raw = filter.getValue(row);\n      if (raw == null || Number.isNaN(raw)) return !state.min && !state.max;\n      const x = state.abs ? Math.abs(raw) : raw;\n      if (state.min !== \"\" && x < Number(state.min)) return false;\n      if (state.max !== \"\" && x > Number(state.max)) return false;\n      return true;\n    }\n  }\n}\n\n/** The empty filter state for a column's filter type. */\nexport function defaultFilterState<T>(filter: ColumnFilter<T>): FilterValue {\n  switch (filter.type) {\n    case \"text\":\n      return { type: \"text\", q: \"\" };\n    case \"select\":\n      return { type: \"select\", values: [] };\n    case \"date\":\n      return { type: \"date\", from: \"\", to: \"\" };\n    case \"number\":\n      return { type: \"number\", min: \"\", max: \"\", abs: false };\n  }\n}\n\n/**\n * Escape the ONE character the select codec uses as its separator, plus the escape\n * marker itself so the transform is reversible.\n *\n * A minimal escape rather than `encodeURIComponent`, deliberately: these strings sit\n * inside a query-parameter value that `URLSearchParams` already encodes, so a full\n * percent-encode would double-encode every space into `%2520` and make shared links\n * unreadable for no gain. Only `,` can be misread here.\n *\n * Backwards compatible with every link written before this existed: a value with\n * neither `,` nor `%` passes through both directions untouched, and `%` on its own\n * never matched `%25` either.\n */\nfunction escapeSelectValue(v: string): string {\n  return v.replace(/%/g, \"%25\").replace(/,/g, \"%2C\");\n}\n\n/** Inverse of {@link escapeSelectValue}. The order matters and is the reverse of the\n *  escape: undoing `%2C` first cannot see the `2C` inside an escaped `%252C`. */\nfunction unescapeSelectValue(v: string): string {\n  return v.replace(/%2C/g, \",\").replace(/%25/g, \"%\");\n}\n\n/** URL-safe encoding of a filter value (`f.<column>` param), null when empty. */\nexport function encodeFilterValue(v: FilterValue): string | null {\n  switch (v.type) {\n    case \"text\":\n      return v.q.trim() ? v.q : null;\n    case \"select\":\n      // Escaped before joining: an option value may legitimately contain the\n      // separator (a free-text title, a payee or category name), and without this it\n      // came back as two values and the filter silently matched nothing.\n      return v.values.length ? v.values.map(escapeSelectValue).join(\",\") : null;\n    case \"date\":\n      return v.from || v.to ? `${v.from}..${v.to}` : null;\n    case \"number\": {\n      const hasRange = v.min !== \"\" || v.max !== \"\";\n      if (!hasRange && !v.abs) return null;\n      return `${v.min}..${v.max}${v.abs ? \"!\" : \"\"}`;\n    }\n  }\n}\n\n/** Inverse of {@link encodeFilterValue} given just the filter type — for\n *  callers that know a column's type without holding its full config. */\nexport function decodeFilterValueOfType(type: FilterValue[\"type\"], raw: string): FilterValue {\n  switch (type) {\n    case \"text\":\n      return { type: \"text\", q: raw };\n    case \"select\":\n      return {\n        type: \"select\",\n        values: raw\n          .split(\",\")\n          .filter((v) => v.length > 0)\n          .map(unescapeSelectValue),\n      };\n    case \"date\": {\n      const [from = \"\", to = \"\"] = raw.split(\"..\");\n      return { type: \"date\", from, to };\n    }\n    case \"number\": {\n      let body = raw;\n      const abs = body.endsWith(\"!\");\n      if (abs) body = body.slice(0, -1);\n      const [min = \"\", max = \"\"] = body.split(\"..\");\n      return { type: \"number\", min, max, abs };\n    }\n  }\n}\n\n/** Inverse of {@link encodeFilterValue}, typed by the column's filter config. */\nexport function decodeFilterValue<T>(filter: ColumnFilter<T>, raw: string): FilterValue {\n  return decodeFilterValueOfType(filter.type, raw);\n}\n\n// ---------- Filter builders ----------\n//\n// Terse builders for `DataTableColumn.filter`, lifted from kastlan's column-filters.ts,\n// which every converted list page imports. The one that earns its keep is `selectFilter`:\n// in `serverPagination` mode a select filter MUST declare its options (the table would\n// otherwise derive them from the rows of the page on screen), and the options an app has\n// to hand are usually a translated `{ value: label }` map.\n\n/** A free-text filter over `getValue`. */\nexport function textFilter<T>(getValue: (row: T) => string): ColumnFilter<T> {\n  return { type: \"text\", getValue };\n}\n\n/**\n * A multi-select filter. `options` is an options array, or a `{ value: label }` record\n * (a translated status map) — kept in its key order. Left out, the table derives the\n * options from the rows it holds.\n */\nexport function selectFilter<T>(\n  getValue: (row: T) => string,\n  options?: { value: string; label?: string }[] | Record<string, string>,\n): ColumnFilter<T> {\n  const opts = Array.isArray(options)\n    ? options\n    : options\n      ? Object.entries(options).map(([value, label]) => ({ value, label }))\n      : undefined;\n  return { type: \"select\", getValue, options: opts };\n}\n\n/** A from/to date filter over an ISO date (or date-time) string. */\nexport function dateFilter<T>(getValue: (row: T) => string | null | undefined): ColumnFilter<T> {\n  return { type: \"date\", getValue };\n}\n\n/** A min/max (and absolute-value) filter over a number. */\nexport function numberFilter<T>(getValue: (row: T) => number | null | undefined): ColumnFilter<T> {\n  return { type: \"number\", getValue };\n}\n\n/**\n * A link to a list page with one column filter already applied — in the table's own URL\n * scheme (`f.<column>=<encoded>`), which a table with `urlSync` (or\n * {@link useTableUrlState}) reads on mount. kastlan's `buildListUrl`, which had to\n * restate the `f.` prefix to do it.\n *\n * `value` is a string for a text filter, an array for a select filter, or any\n * {@link FilterValue}. A filter that narrows nothing returns `path` unchanged. A `path`\n * that already carries a query keeps it; a `#fragment` stays at the end.\n *\n *     filterHref(\"/units\", \"status\", [\"vacant\"]) // \"/units?f.status=vacant\"\n */\nexport function filterHref(\n  path: string,\n  column: string,\n  value: string | string[] | FilterValue,\n  /** The target table's `urlSync` prefix, if it has one (`{ prefix: \"inv.\" }` →\n   *  `inv.f.<column>`). */\n  options?: { prefix?: string },\n): string {\n  const state: FilterValue =\n    typeof value === \"string\"\n      ? { type: \"text\", q: value }\n      : Array.isArray(value)\n        ? { type: \"select\", values: value }\n        : value;\n  const encoded = encodeFilterValue(state);\n  if (encoded == null) return path;\n  const hashAt = path.indexOf(\"#\");\n  const base = hashAt >= 0 ? path.slice(0, hashAt) : path;\n  const hash = hashAt >= 0 ? path.slice(hashAt) : \"\";\n  const queryAt = base.indexOf(\"?\");\n  const params = new URLSearchParams(queryAt >= 0 ? base.slice(queryAt + 1) : \"\");\n  params.set(`${options?.prefix ?? \"\"}f.${column}`, encoded);\n  return `${queryAt >= 0 ? base.slice(0, queryAt) : base}?${params.toString()}${hash}`;\n}\n"],"mappings":"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","names":[]}

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

@@ -47,6 +47,19 @@ interface DataTableLabels {
     rowCount: (total: number) => string;
     /** The column-settings rail and its heading: "Columns (4/9)". */
     columnsCount: (visible: number, total: number) => string;
+    /** The body of a table with no rows and no `empty` prop of its own. A sentence, not
+     *  "—": a dash in the only row of a table reads as one row with a missing value. */
+    empty: string;
+    /** The accessible name of the `rowActions` column (its header is visually empty). */
+    actions: string;
+    /** The `kind: "edit"` row action's name — its tooltip and its swipe label. */
+    edit: string;
+    /** The `kind: "delete"` row action's name. */
+    delete: string;
+    /** What {@link BooleanMark} says to a screen reader for `true` / `false` / nothing. */
+    booleanTrue: string;
+    booleanFalse: string;
+    booleanUnset: string;
 }
 declare const DEFAULT_DATA_TABLE_LABELS: DataTableLabels;
 /**

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

@@ -47,7 +47,14 @@ const DEFAULT_DATA_TABLE_LABELS = {
   // The separators are the ones that shipped, so adding the seam changes no screen.
   pageRange: (from, to, total) => `${from}\u2013${to} / ${total}`,
   rowCount: (total) => `${total}`,
-  columnsCount: (visible, total) => `Columns (${visible}/${total})`
+  columnsCount: (visible, total) => `Columns (${visible}/${total})`,
+  empty: "No entries",
+  actions: "Actions",
+  edit: "Edit",
+  delete: "Delete",
+  booleanTrue: "Yes",
+  booleanFalse: "No",
+  booleanUnset: "Not set"
 };
 function resolveDataTableLabels(partial) {
   if (!partial) return DEFAULT_DATA_TABLE_LABELS;

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/data-table-labels.ts"],"sourcesContent":["// All user-facing strings for the DataTable system — the `dataTable` namespace of\n// `<UiKitProvider labels>`, and per table the `labels` prop over that. The package\n// ships no translations; the English defaults below make the table usable with no\n// wiring.\n\nexport interface DataTableLabels {\n  // Table chrome\n  columns: string;\n  selectAllRows: string;\n  sortHint: string;\n  filter: string;\n  close: string;\n  selectRow: string;\n  autoSize: string;\n  loading: string;\n  filters: string;\n  clearAll: string;\n  done: string;\n  // Pagination\n  pageSize: string;\n  pageSizeAll: string;\n  prevPage: string;\n  nextPage: string;\n  // Filter popover\n  clearFilter: string;\n  filterPlaceholder: string;\n  selectFilter: string;\n  selectAll: string;\n  selectNone: string;\n  dateFrom: string;\n  dateTo: string;\n  numberMin: string;\n  numberMax: string;\n  numberAbs: string;\n  // Date-range preset labels, keyed by preset key (see dateRangePresets()).\n  presets: Record<string, string>;\n\n  /**\n   * The table's own accessible name. Deliberately a label rather than a second,\n   * parallel `tableLabel` prop: the audit already records \"three different prop\n   * names for the accessible name\" as a finding, and a table that is not \"Data\n   * table\" says so with `labels={{ table: \"Transactions\" }}` at the call site.\n   */\n  table: string;\n\n  // ---- Announcements ----\n  // Spoken through the live region, never rendered. Each takes its numbers as\n  // ARGUMENTS: a count glued into an English template literal is untranslatable,\n  // and the grammar around it moves with the number in most languages.\n\n  /** After a filter changes: \"12 of 137 rows\". */\n  filterResults: (shown: number, total: number) => string;\n  /** After a header is activated: \"Sorted by Name, ascending\". */\n  sortedAscending: (column: string) => string;\n  sortedDescending: (column: string) => string;\n  /** The third click, which removes the column from the sort entirely. */\n  sortCleared: (column: string) => string;\n  /** After paging: \"Page 3 of 14\". `page` is 1-BASED, as spoken. */\n  pageChanged: (page: number, totalPages: number) => string;\n\n  // ---- Counted chrome ----\n  // Visible text that interpolates numbers. These were template literals until the\n  // audit flagged them: a consumer could translate every key in this file and still\n  // be left with English (and with ASCII digit grouping) in the footer.\n\n  /** The pagination range summary: \"1–25 / 137\". */\n  pageRange: (from: number, to: number, total: number) => string;\n  /** The same summary when the page size is \"all\" — just the row count. */\n  rowCount: (total: number) => string;\n  /** The column-settings rail and its heading: \"Columns (4/9)\". */\n  columnsCount: (visible: number, total: number) => string;\n}\n\nexport const DEFAULT_DATA_TABLE_LABELS: DataTableLabels = {\n  columns: \"Columns\",\n  selectAllRows: \"Select all rows\",\n  sortHint: \"Click to sort · Shift-click to add a sort\",\n  filter: \"Filter\",\n  close: \"Close\",\n  selectRow: \"Select row\",\n  autoSize: \"Auto-size columns\",\n  loading: \"Loading…\",\n  filters: \"Filters\",\n  clearAll: \"Clear all\",\n  done: \"Done\",\n  pageSize: \"Rows per page\",\n  pageSizeAll: \"All\",\n  prevPage: \"Previous page\",\n  nextPage: \"Next page\",\n  clearFilter: \"Clear filter\",\n  filterPlaceholder: \"Filter…\",\n  selectFilter: \"Select\",\n  selectAll: \"All\",\n  selectNone: \"None\",\n  dateFrom: \"From\",\n  dateTo: \"To\",\n  numberMin: \"Min\",\n  numberMax: \"Max\",\n  numberAbs: \"Absolute value\",\n  presets: {\n    today: \"Today\",\n    yesterday: \"Yesterday\",\n    this_week: \"This week\",\n    last_week: \"Last week\",\n    last_7_days: \"Last 7 days\",\n    last_30_days: \"Last 30 days\",\n    this_month: \"This month\",\n    last_month: \"Last month\",\n    last_3_months: \"Last 3 months\",\n    ytd: \"Year to date\",\n    last_year: \"Last year\",\n  },\n  table: \"Data table\",\n  filterResults: (shown, total) => `${shown} of ${total} rows`,\n  sortedAscending: (column) => `Sorted by ${column}, ascending`,\n  sortedDescending: (column) => `Sorted by ${column}, descending`,\n  sortCleared: (column) => `Sort cleared on ${column}`,\n  pageChanged: (page, totalPages) => `Page ${page} of ${totalPages}`,\n  // The separators are the ones that shipped, so adding the seam changes no screen.\n  pageRange: (from, to, total) => `${from}–${to} / ${total}`,\n  rowCount: (total) => `${total}`,\n  columnsCount: (visible, total) => `Columns (${visible}/${total})`,\n};\n\n/**\n * Merge caller overrides onto the English defaults (presets merged too).\n *\n * The parameter is `Partial` on purpose — a table with no labels at all still\n * renders — but that is also how a translated app ends up half English and never\n * hears about it: lenkbank ships nineteen of these keys in English in a German UI\n * today, because every one of them is backfilled silently. The kit will not start\n * throwing over it (three apps depend on the lenient merge), so\n * {@link missingDataTableLabels} is the other half: it answers which keys fell back,\n * and an app asserts on that in its OWN test, where the answer is actionable.\n */\nexport function resolveDataTableLabels(partial?: Partial<DataTableLabels>): DataTableLabels {\n  if (!partial) return DEFAULT_DATA_TABLE_LABELS;\n  const merged: DataTableLabels = {\n    ...DEFAULT_DATA_TABLE_LABELS,\n    ...partial,\n    presets: { ...DEFAULT_DATA_TABLE_LABELS.presets, ...(partial.presets ?? {}) },\n  };\n  // `columnsCount` was split out of `columns` + a template literal. Consumers have\n  // been translating `columns` since 0.1, and backfilling the English default over\n  // that would hand them \"Columns (4/9)\" back for having translated the key that\n  // existed at the time — the same silent-English failure the audit records against\n  // this file. So the count is derived from the RESOLVED `columns` unless the caller\n  // states the whole sentence, which is the escape hatch for a language where the\n  // parenthetical does not fit.\n  if (partial.columns !== undefined && partial.columnsCount === undefined) {\n    merged.columnsCount = (visible, total) => `${merged.columns} (${visible}/${total})`;\n  }\n  return merged;\n}\n\n/**\n * The label keys `labels` does not supply, and which therefore come back English\n * from {@link resolveDataTableLabels}.\n *\n * For a consumer's own test:\n *\n * ```ts\n * expect(missingDataTableLabels(de.dataTable)).toEqual([]);\n * ```\n *\n * which fails the day the kit adds a key — which is the point. Adding a label is\n * additive here and a silent regression in a translated app, and nothing else in\n * either repository can tell the two apart.\n *\n * Preset labels are reported one at a time (`presets.yesterday`), because `presets`\n * is a `Record` merged key by key: answering `\"presets\"` would say nothing about\n * which of the eleven are still English.\n */\nexport function missingDataTableLabels(labels?: Partial<DataTableLabels>): string[] {\n  const missing: string[] = [];\n  for (const key of Object.keys(DEFAULT_DATA_TABLE_LABELS) as Array<keyof DataTableLabels>) {\n    if (key === \"presets\") continue;\n    if (labels?.[key] !== undefined) continue;\n    // `columnsCount` is DERIVED from a translated `columns` by the resolver above,\n    // so a caller who set that one is not leaking English here. Reporting it would\n    // send them to translate a key they have already covered, and an `toEqual([])`\n    // assertion built on this would never go green.\n    if (key === \"columnsCount\" && labels?.columns !== undefined) continue;\n    missing.push(key);\n  }\n  for (const preset of Object.keys(DEFAULT_DATA_TABLE_LABELS.presets)) {\n    if (labels?.presets?.[preset] === undefined) missing.push(`presets.${preset}`);\n  }\n  return missing;\n}\n"],"mappings":";AAyEO,MAAM,4BAA6C;AAAA,EACxD,SAAS;AAAA,EACT,eAAe;AAAA,EACf,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,WAAW;AAAA,EACX,UAAU;AAAA,EACV,SAAS;AAAA,EACT,SAAS;AAAA,EACT,UAAU;AAAA,EACV,MAAM;AAAA,EACN,UAAU;AAAA,EACV,aAAa;AAAA,EACb,UAAU;AAAA,EACV,UAAU;AAAA,EACV,aAAa;AAAA,EACb,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AAAA,IACP,OAAO;AAAA,IACP,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,aAAa;AAAA,IACb,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,KAAK;AAAA,IACL,WAAW;AAAA,EACb;AAAA,EACA,OAAO;AAAA,EACP,eAAe,CAAC,OAAO,UAAU,GAAG,KAAK,OAAO,KAAK;AAAA,EACrD,iBAAiB,CAAC,WAAW,aAAa,MAAM;AAAA,EAChD,kBAAkB,CAAC,WAAW,aAAa,MAAM;AAAA,EACjD,aAAa,CAAC,WAAW,mBAAmB,MAAM;AAAA,EAClD,aAAa,CAAC,MAAM,eAAe,QAAQ,IAAI,OAAO,UAAU;AAAA;AAAA,EAEhE,WAAW,CAAC,MAAM,IAAI,UAAU,GAAG,IAAI,SAAI,EAAE,MAAM,KAAK;AAAA,EACxD,UAAU,CAAC,UAAU,GAAG,KAAK;AAAA,EAC7B,cAAc,CAAC,SAAS,UAAU,YAAY,OAAO,IAAI,KAAK;AAChE;AAaO,SAAS,uBAAuB,SAAqD;AAC1F,MAAI,CAAC,QAAS,QAAO;AACrB,QAAM,SAA0B;AAAA,IAC9B,GAAG;AAAA,IACH,GAAG;AAAA,IACH,SAAS,EAAE,GAAG,0BAA0B,SAAS,GAAI,QAAQ,WAAW,CAAC,EAAG;AAAA,EAC9E;AAQA,MAAI,QAAQ,YAAY,UAAa,QAAQ,iBAAiB,QAAW;AACvE,WAAO,eAAe,CAAC,SAAS,UAAU,GAAG,OAAO,OAAO,KAAK,OAAO,IAAI,KAAK;AAAA,EAClF;AACA,SAAO;AACT;AAoBO,SAAS,uBAAuB,QAA6C;AAClF,QAAM,UAAoB,CAAC;AAC3B,aAAW,OAAO,OAAO,KAAK,yBAAyB,GAAmC;AACxF,QAAI,QAAQ,UAAW;AACvB,QAAI,SAAS,GAAG,MAAM,OAAW;AAKjC,QAAI,QAAQ,kBAAkB,QAAQ,YAAY,OAAW;AAC7D,YAAQ,KAAK,GAAG;AAAA,EAClB;AACA,aAAW,UAAU,OAAO,KAAK,0BAA0B,OAAO,GAAG;AACnE,QAAI,QAAQ,UAAU,MAAM,MAAM,OAAW,SAAQ,KAAK,WAAW,MAAM,EAAE;AAAA,EAC/E;AACA,SAAO;AACT;","names":[]}
+{"version":3,"sources":["../../src/components/data-table-labels.ts"],"sourcesContent":["// All user-facing strings for the DataTable system — the `dataTable` namespace of\n// `<UiKitProvider labels>`, and per table the `labels` prop over that. The package\n// ships no translations; the English defaults below make the table usable with no\n// wiring.\n\nexport interface DataTableLabels {\n  // Table chrome\n  columns: string;\n  selectAllRows: string;\n  sortHint: string;\n  filter: string;\n  close: string;\n  selectRow: string;\n  autoSize: string;\n  loading: string;\n  filters: string;\n  clearAll: string;\n  done: string;\n  // Pagination\n  pageSize: string;\n  pageSizeAll: string;\n  prevPage: string;\n  nextPage: string;\n  // Filter popover\n  clearFilter: string;\n  filterPlaceholder: string;\n  selectFilter: string;\n  selectAll: string;\n  selectNone: string;\n  dateFrom: string;\n  dateTo: string;\n  numberMin: string;\n  numberMax: string;\n  numberAbs: string;\n  // Date-range preset labels, keyed by preset key (see dateRangePresets()).\n  presets: Record<string, string>;\n\n  /**\n   * The table's own accessible name. Deliberately a label rather than a second,\n   * parallel `tableLabel` prop: the audit already records \"three different prop\n   * names for the accessible name\" as a finding, and a table that is not \"Data\n   * table\" says so with `labels={{ table: \"Transactions\" }}` at the call site.\n   */\n  table: string;\n\n  // ---- Announcements ----\n  // Spoken through the live region, never rendered. Each takes its numbers as\n  // ARGUMENTS: a count glued into an English template literal is untranslatable,\n  // and the grammar around it moves with the number in most languages.\n\n  /** After a filter changes: \"12 of 137 rows\". */\n  filterResults: (shown: number, total: number) => string;\n  /** After a header is activated: \"Sorted by Name, ascending\". */\n  sortedAscending: (column: string) => string;\n  sortedDescending: (column: string) => string;\n  /** The third click, which removes the column from the sort entirely. */\n  sortCleared: (column: string) => string;\n  /** After paging: \"Page 3 of 14\". `page` is 1-BASED, as spoken. */\n  pageChanged: (page: number, totalPages: number) => string;\n\n  // ---- Counted chrome ----\n  // Visible text that interpolates numbers. These were template literals until the\n  // audit flagged them: a consumer could translate every key in this file and still\n  // be left with English (and with ASCII digit grouping) in the footer.\n\n  /** The pagination range summary: \"1–25 / 137\". */\n  pageRange: (from: number, to: number, total: number) => string;\n  /** The same summary when the page size is \"all\" — just the row count. */\n  rowCount: (total: number) => string;\n  /** The column-settings rail and its heading: \"Columns (4/9)\". */\n  columnsCount: (visible: number, total: number) => string;\n\n  // ---- Empty state, row actions, boolean cells (0.12.0) ----\n\n  /** The body of a table with no rows and no `empty` prop of its own. A sentence, not\n   *  \"—\": a dash in the only row of a table reads as one row with a missing value. */\n  empty: string;\n  /** The accessible name of the `rowActions` column (its header is visually empty). */\n  actions: string;\n  /** The `kind: \"edit\"` row action's name — its tooltip and its swipe label. */\n  edit: string;\n  /** The `kind: \"delete\"` row action's name. */\n  delete: string;\n  /** What {@link BooleanMark} says to a screen reader for `true` / `false` / nothing. */\n  booleanTrue: string;\n  booleanFalse: string;\n  booleanUnset: string;\n}\n\nexport const DEFAULT_DATA_TABLE_LABELS: DataTableLabels = {\n  columns: \"Columns\",\n  selectAllRows: \"Select all rows\",\n  sortHint: \"Click to sort · Shift-click to add a sort\",\n  filter: \"Filter\",\n  close: \"Close\",\n  selectRow: \"Select row\",\n  autoSize: \"Auto-size columns\",\n  loading: \"Loading…\",\n  filters: \"Filters\",\n  clearAll: \"Clear all\",\n  done: \"Done\",\n  pageSize: \"Rows per page\",\n  pageSizeAll: \"All\",\n  prevPage: \"Previous page\",\n  nextPage: \"Next page\",\n  clearFilter: \"Clear filter\",\n  filterPlaceholder: \"Filter…\",\n  selectFilter: \"Select\",\n  selectAll: \"All\",\n  selectNone: \"None\",\n  dateFrom: \"From\",\n  dateTo: \"To\",\n  numberMin: \"Min\",\n  numberMax: \"Max\",\n  numberAbs: \"Absolute value\",\n  presets: {\n    today: \"Today\",\n    yesterday: \"Yesterday\",\n    this_week: \"This week\",\n    last_week: \"Last week\",\n    last_7_days: \"Last 7 days\",\n    last_30_days: \"Last 30 days\",\n    this_month: \"This month\",\n    last_month: \"Last month\",\n    last_3_months: \"Last 3 months\",\n    ytd: \"Year to date\",\n    last_year: \"Last year\",\n  },\n  table: \"Data table\",\n  filterResults: (shown, total) => `${shown} of ${total} rows`,\n  sortedAscending: (column) => `Sorted by ${column}, ascending`,\n  sortedDescending: (column) => `Sorted by ${column}, descending`,\n  sortCleared: (column) => `Sort cleared on ${column}`,\n  pageChanged: (page, totalPages) => `Page ${page} of ${totalPages}`,\n  // The separators are the ones that shipped, so adding the seam changes no screen.\n  pageRange: (from, to, total) => `${from}–${to} / ${total}`,\n  rowCount: (total) => `${total}`,\n  columnsCount: (visible, total) => `Columns (${visible}/${total})`,\n  empty: \"No entries\",\n  actions: \"Actions\",\n  edit: \"Edit\",\n  delete: \"Delete\",\n  booleanTrue: \"Yes\",\n  booleanFalse: \"No\",\n  booleanUnset: \"Not set\",\n};\n\n/**\n * Merge caller overrides onto the English defaults (presets merged too).\n *\n * The parameter is `Partial` on purpose — a table with no labels at all still\n * renders — but that is also how a translated app ends up half English and never\n * hears about it: lenkbank ships nineteen of these keys in English in a German UI\n * today, because every one of them is backfilled silently. The kit will not start\n * throwing over it (three apps depend on the lenient merge), so\n * {@link missingDataTableLabels} is the other half: it answers which keys fell back,\n * and an app asserts on that in its OWN test, where the answer is actionable.\n */\nexport function resolveDataTableLabels(partial?: Partial<DataTableLabels>): DataTableLabels {\n  if (!partial) return DEFAULT_DATA_TABLE_LABELS;\n  const merged: DataTableLabels = {\n    ...DEFAULT_DATA_TABLE_LABELS,\n    ...partial,\n    presets: { ...DEFAULT_DATA_TABLE_LABELS.presets, ...(partial.presets ?? {}) },\n  };\n  // `columnsCount` was split out of `columns` + a template literal. Consumers have\n  // been translating `columns` since 0.1, and backfilling the English default over\n  // that would hand them \"Columns (4/9)\" back for having translated the key that\n  // existed at the time — the same silent-English failure the audit records against\n  // this file. So the count is derived from the RESOLVED `columns` unless the caller\n  // states the whole sentence, which is the escape hatch for a language where the\n  // parenthetical does not fit.\n  if (partial.columns !== undefined && partial.columnsCount === undefined) {\n    merged.columnsCount = (visible, total) => `${merged.columns} (${visible}/${total})`;\n  }\n  return merged;\n}\n\n/**\n * The label keys `labels` does not supply, and which therefore come back English\n * from {@link resolveDataTableLabels}.\n *\n * For a consumer's own test:\n *\n * ```ts\n * expect(missingDataTableLabels(de.dataTable)).toEqual([]);\n * ```\n *\n * which fails the day the kit adds a key — which is the point. Adding a label is\n * additive here and a silent regression in a translated app, and nothing else in\n * either repository can tell the two apart.\n *\n * Preset labels are reported one at a time (`presets.yesterday`), because `presets`\n * is a `Record` merged key by key: answering `\"presets\"` would say nothing about\n * which of the eleven are still English.\n */\nexport function missingDataTableLabels(labels?: Partial<DataTableLabels>): string[] {\n  const missing: string[] = [];\n  for (const key of Object.keys(DEFAULT_DATA_TABLE_LABELS) as Array<keyof DataTableLabels>) {\n    if (key === \"presets\") continue;\n    if (labels?.[key] !== undefined) continue;\n    // `columnsCount` is DERIVED from a translated `columns` by the resolver above,\n    // so a caller who set that one is not leaking English here. Reporting it would\n    // send them to translate a key they have already covered, and an `toEqual([])`\n    // assertion built on this would never go green.\n    if (key === \"columnsCount\" && labels?.columns !== undefined) continue;\n    missing.push(key);\n  }\n  for (const preset of Object.keys(DEFAULT_DATA_TABLE_LABELS.presets)) {\n    if (labels?.presets?.[preset] === undefined) missing.push(`presets.${preset}`);\n  }\n  return missing;\n}\n"],"mappings":";AAyFO,MAAM,4BAA6C;AAAA,EACxD,SAAS;AAAA,EACT,eAAe;AAAA,EACf,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,WAAW;AAAA,EACX,UAAU;AAAA,EACV,SAAS;AAAA,EACT,SAAS;AAAA,EACT,UAAU;AAAA,EACV,MAAM;AAAA,EACN,UAAU;AAAA,EACV,aAAa;AAAA,EACb,UAAU;AAAA,EACV,UAAU;AAAA,EACV,aAAa;AAAA,EACb,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AAAA,IACP,OAAO;AAAA,IACP,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,aAAa;AAAA,IACb,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,KAAK;AAAA,IACL,WAAW;AAAA,EACb;AAAA,EACA,OAAO;AAAA,EACP,eAAe,CAAC,OAAO,UAAU,GAAG,KAAK,OAAO,KAAK;AAAA,EACrD,iBAAiB,CAAC,WAAW,aAAa,MAAM;AAAA,EAChD,kBAAkB,CAAC,WAAW,aAAa,MAAM;AAAA,EACjD,aAAa,CAAC,WAAW,mBAAmB,MAAM;AAAA,EAClD,aAAa,CAAC,MAAM,eAAe,QAAQ,IAAI,OAAO,UAAU;AAAA;AAAA,EAEhE,WAAW,CAAC,MAAM,IAAI,UAAU,GAAG,IAAI,SAAI,EAAE,MAAM,KAAK;AAAA,EACxD,UAAU,CAAC,UAAU,GAAG,KAAK;AAAA,EAC7B,cAAc,CAAC,SAAS,UAAU,YAAY,OAAO,IAAI,KAAK;AAAA,EAC9D,OAAO;AAAA,EACP,SAAS;AAAA,EACT,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,cAAc;AAAA,EACd,cAAc;AAChB;AAaO,SAAS,uBAAuB,SAAqD;AAC1F,MAAI,CAAC,QAAS,QAAO;AACrB,QAAM,SAA0B;AAAA,IAC9B,GAAG;AAAA,IACH,GAAG;AAAA,IACH,SAAS,EAAE,GAAG,0BAA0B,SAAS,GAAI,QAAQ,WAAW,CAAC,EAAG;AAAA,EAC9E;AAQA,MAAI,QAAQ,YAAY,UAAa,QAAQ,iBAAiB,QAAW;AACvE,WAAO,eAAe,CAAC,SAAS,UAAU,GAAG,OAAO,OAAO,KAAK,OAAO,IAAI,KAAK;AAAA,EAClF;AACA,SAAO;AACT;AAoBO,SAAS,uBAAuB,QAA6C;AAClF,QAAM,UAAoB,CAAC;AAC3B,aAAW,OAAO,OAAO,KAAK,yBAAyB,GAAmC;AACxF,QAAI,QAAQ,UAAW;AACvB,QAAI,SAAS,GAAG,MAAM,OAAW;AAKjC,QAAI,QAAQ,kBAAkB,QAAQ,YAAY,OAAW;AAC7D,YAAQ,KAAK,GAAG;AAAA,EAClB;AACA,aAAW,UAAU,OAAO,KAAK,0BAA0B,OAAO,GAAG;AACnE,QAAI,QAAQ,UAAU,MAAM,MAAM,OAAW,SAAQ,KAAK,WAAW,MAAM,EAAE;AAAA,EAC/E;AACA,SAAO;AACT;","names":[]}

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

@@ -1,5 +1,5 @@
 import 'react';
-export { D as DataTable, l as DataTableCellProps, a as DataTableChrome, b as DataTableColumn, c as DataTableDensity, m as DataTableHeadProps, d as DataTableProps, F as FilterState, M as MobileSwipeActions, S as ServerPagination } from '../data-table-filters-Dh9uF_S-.js';
+export { D as DataTable, x as DataTableCellProps, a as DataTableChrome, b as DataTableColumn, c as DataTableDensity, y as DataTableHeadProps, d as DataTableProps, e as DataTableRowAction, F as FilterState, M as MobileSwipeActions, S as ServerPagination } from '../data-table-Drun8Fk9.js';
 export { SortState } from './data-table-sort.js';
 import './swipeable-row.js';
 import './data-table-labels.js';

package/dist/components/data-table.js

@@ -1,7 +1,7 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { createElement } from "react";
-import { Fragment as Fragment2, useEffect, useMemo, useRef, useState } from "react";
+import { Fragment as Fragment2, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { createPortal } from "react-dom";
 import {
   ArrowDown,
@@ -10,9 +10,11 @@ import {
   ChevronDown,
   ChevronRight,
   Filter,
+  Pencil,
+  Trash2,
   X
 } from "lucide-react";
-import { Card, Spinner } from "./ui.js";
+import { Card, IconButton, Spinner } from "./ui.js";
 import { cn } from "../lib/cn.js";
 import {
   defaultFilterState,
@@ -52,6 +54,22 @@ function dataAttrsOf(props) {
   for (const [k, v] of Object.entries(props)) if (k.startsWith("data-") && k !== "data-col") out[k] = v;
   return out;
 }
+const ROW_ACTIONS_KEY = "__rowActions";
+function resolveRowAction(action, index, labels) {
+  const tone = action.tone ?? (action.kind === "delete" ? "danger" : "default");
+  return {
+    key: action.kind ?? `${index}:${action.label ?? ""}`,
+    label: action.label ?? (action.kind === "edit" ? labels.edit : action.kind === "delete" ? labels.delete : ""),
+    icon: action.icon ?? (action.kind === "edit" ? /* @__PURE__ */ jsx(Pencil, {}) : action.kind === "delete" ? /* @__PURE__ */ jsx(Trash2, {}) : null),
+    tone,
+    swipe: action.swipe ?? (tone === "danger" ? "start" : "end"),
+    action
+  };
+}
+async function runRowAction(action, row) {
+  if (action.confirm && !await action.confirm(row)) return;
+  action.onAction(row);
+}
 function physicalSwipe(actions, dir) {
   const rtl = dir === "rtl";
   return {
@@ -76,10 +94,14 @@ function cleanAttrs(attrs) {
   for (const [k, v] of Object.entries(attrs)) if (v !== void 0) out[k] = v;
   return out;
 }
-function columnLabel(col) {
+function columnLabel(col, labels) {
+  if (col.key === ROW_ACTIONS_KEY && labels) return labels.actions;
   return typeof col.header === "string" ? col.header : col.key;
 }
 const OWN_CONTROL = 'a[href],button,input,select,textarea,label,summary,[role="button"],[role="link"],[role="checkbox"],[role="switch"],[role="menuitem"],[role="option"],[contenteditable=""],[contenteditable="true"],[tabindex]:not([tabindex="-1"])';
+function fromOutside(target, row) {
+  return !(target instanceof Node) || !row.contains(target);
+}
 function fromOwnControl(target, row) {
   if (!(target instanceof Element)) return false;
   const hit = target.closest(OWN_CONTROL);
@@ -114,9 +136,11 @@ function RowLink({
       draggable: false,
       className,
       onClickCapture: (e) => {
+        if (fromOutside(e.target, e.currentTarget)) return;
         if (isPlainLeftClick(e)) e.preventDefault();
       },
       onClick: (e) => {
+        if (fromOutside(e.target, e.currentTarget)) return;
         if (!isPlainLeftClick(e)) {
           e.stopPropagation();
           return;
@@ -131,7 +155,7 @@ import { DEFAULT_PERSIST_PREFIX, useTableState } from "./use-table-state.js";
 import { useMobileReveal } from "./use-mobile-reveal.js";
 function DataTable({
   rows,
-  columns,
+  columns: columnsProp,
   rowKey,
   defaultPageSize = 25,
   onRowClick,
@@ -168,7 +192,9 @@ function DataTable({
   resizable: resizableProp,
   multiSort: multiSortProp,
   frame = true,
-  className
+  className,
+  rowActions,
+  toolbar
 }) {
   const compact = density === "compact";
   const minimal = chrome === "minimal";
@@ -189,6 +215,54 @@ function DataTable({
     [labelOverrides, labelsProp]
   );
   const locale = useKitLocale(localeProp);
+  const rowActionsFor = useCallback(
+    (row) => rowActions ? (typeof rowActions === "function" ? rowActions(row) : rowActions).filter((a) => !a.hidden?.(row)).map((a, i) => resolveRowAction(a, i, labels)) : [],
+    [rowActions, labels]
+  );
+  const columns = useMemo(
+    () => rowActions ? [
+      ...columnsProp,
+      {
+        key: ROW_ACTIONS_KEY,
+        header: /* @__PURE__ */ jsx("span", { className: "sr-only", children: labels.actions }),
+        cell: (row) => /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end gap-0.5", children: rowActionsFor(row).map((a) => /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            size: density === "compact" ? "2xs" : "xs",
+            label: a.label,
+            tone: a.tone === "danger" ? "danger" : void 0,
+            disabledReason: a.action.disabledReason?.(row),
+            stopPropagation: true,
+            onClick: () => void runRowAction(a.action, row),
+            children: a.icon
+          },
+          a.key
+        )) }),
+        className: "w-px whitespace-nowrap text-end",
+        headClassName: "w-px",
+        // On a phone the same actions are the card's swipes.
+        mobileHidden: true,
+        noRowLink: true
+      }
+    ] : columnsProp,
+    [columnsProp, rowActions, rowActionsFor, labels.actions, density]
+  );
+  const swipesFromActions = (row) => {
+    const swipes = rowActionsFor(row).filter((a) => a.swipe && !a.action.disabledReason?.(row));
+    if (!swipes.length) return null;
+    const toSwipe = (a) => ({
+      label: a.label,
+      icon: a.icon,
+      onCommit: () => void runRowAction(a.action, row),
+      className: a.tone === "danger" ? "bg-[var(--danger)]" : "bg-[var(--brand)]",
+      armedClassName: a.tone === "danger" ? "bg-[var(--danger-hover)]" : "bg-[var(--brand-hover)]"
+    });
+    return {
+      start: swipes.filter((a) => a.swipe === "start").map(toSwipe),
+      end: swipes.filter((a) => a.swipe === "end").map(toSwipe)
+    };
+  };
+  const swipeActionsFor = mobileSwipeActions ?? (rowActions ? swipesFromActions : void 0);
   const { announce, regionProps } = useAnnounce();
   const {
     sorts,
@@ -291,7 +365,7 @@ function DataTable({
     });
     if (onSortsChange) onSortsChange(next);
     else setInternalSorts(next);
-    const name = col ? columnLabel(col) : key;
+    const name = col ? columnLabel(col, labels) : key;
     const entry = next.find((s) => s.key === key);
     announce(
       !entry ? labels.sortCleared(name) : entry.dir === "asc" ? labels.sortedAscending(name) : labels.sortedDescending(name)
@@ -443,7 +517,7 @@ function DataTable({
   const visibleCount = visibleColumns.length;
   const totalCount = columns.length;
   const totalColSpan = visibleCount + (selection ? 1 : 0);
-  const columnsCountLabel = labels.columnsCount(visibleCount, totalCount);
+  const columnsCountLabel = rowActions ? labels.columnsCount(visibleCount - 1, totalCount - 1) : labels.columnsCount(visibleCount, totalCount);
   const isMdUp = useMediaQuery("(min-width: 768px)", true);
   const mobileColumns = visibleColumns.filter((c) => !c.mobileHidden);
   const mobilePrimaryCol = mobileColumns.find((c) => c.mobilePrimary) ?? mobileColumns[0] ?? null;
@@ -495,7 +569,7 @@ function DataTable({
     const tint = rowClassName?.(row);
     const interactive = !!onRowClick;
     const opensDetail = interactive && !!expandedRow;
-    const swipeActions = mobileSwipeActions?.(row);
+    const swipeActions = swipeActionsFor?.(row);
     const swipe = swipeActions ? physicalSwipe(swipeActions, mobileDir) : null;
     const swipeEnabled = !!swipe && !expanded;
     const href = mobileCardLinkable ? rowHref?.(row) : void 0;
@@ -581,7 +655,10 @@ function DataTable({
       {
         role: interactive ? "button" : void 0,
         tabIndex: interactive ? 0 : void 0,
-        onClick: interactive ? () => onRowClick(row) : void 0,
+        onClick: interactive ? (e) => {
+          if (fromOutside(e.target, e.currentTarget)) return;
+          onRowClick(row);
+        } : void 0,
         onKeyDown: interactive ? (e) => {
           if (e.target !== e.currentTarget) return;
           if (e.key === "Enter" || e.key === " ") {
@@ -621,6 +698,7 @@ function DataTable({
     {
       "data-density": density,
       "data-frame": frame ? void 0 : "none",
+      "data-clips": frame ? "" : void 0,
       className: cn(
         "group/table",
         frame ? "overflow-clip" : "min-w-0",
@@ -629,6 +707,17 @@ function DataTable({
       ),
       children: [
         /* @__PURE__ */ jsx("span", { ...regionProps }),
+        toolbar != null && toolbar !== false && /* @__PURE__ */ jsx(
+          "div",
+          {
+            "data-table-toolbar": "",
+            className: cn(
+              "flex flex-wrap items-center gap-2",
+              frame ? cn("border-b border-[var(--border)]", compact ? "px-2 py-1.5" : "px-3 py-2") : "pb-3"
+            ),
+            children: toolbar
+          }
+        ),
         !isMdUp && /* @__PURE__ */ jsxs("div", { ref: mobileRootRef, children: [
           (!isServer || onFiltersChange) && /* @__PURE__ */ jsx(
             MobileFilters,
@@ -666,7 +755,7 @@ function DataTable({
                       "text-center text-[var(--text-muted)]",
                       compact ? "px-3 py-3 text-xs" : "px-4 py-6 text-sm"
                     ),
-                    children: isLoading ? /* @__PURE__ */ jsx(LoadingText, { label: labels.loading }) : empty ?? "\u2014"
+                    children: isLoading ? /* @__PURE__ */ jsx(LoadingText, { label: labels.loading }) : empty ?? labels.empty
                   }
                 ),
                 canRevealMoreMobile && /* @__PURE__ */ jsx(
@@ -710,6 +799,7 @@ function DataTable({
             /* @__PURE__ */ jsx(
               "div",
               {
+                "data-clips": "",
                 className: cn("overflow-auto [scrollbar-gutter:stable]", fillHeight && "flex-1 min-h-0"),
                 style: fillHeight ? void 0 : { maxHeight: maxBodyHeight },
                 children: /* @__PURE__ */ jsxs(
@@ -840,7 +930,7 @@ function DataTable({
                                 ]
                               }
                             ),
-                            resizable && /* @__PURE__ */ jsx(
+                            resizable && col.key !== ROW_ACTIONS_KEY && /* @__PURE__ */ jsx(
                               "span",
                               {
                                 role: "separator",
@@ -905,6 +995,7 @@ function DataTable({
                                     ),
                                     onClick: rowInteractive ? (e) => {
                                       if (fromOwnControl(e.target, e.currentTarget)) return;
+                                      if (fromOutside(e.target, e.currentTarget)) return;
                                       if (selection && canSelect(row)) {
                                         if (e.shiftKey) {
                                           window.getSelection?.()?.removeAllRanges();
@@ -990,7 +1081,7 @@ function DataTable({
                               {
                                 colSpan: totalColSpan,
                                 className: cn("text-center text-[var(--text-muted)]", compact ? "px-2 py-2" : "px-3 py-4"),
-                                children: isLoading ? /* @__PURE__ */ jsx(LoadingText, { label: labels.loading }) : empty ?? "\u2014"
+                                children: isLoading ? /* @__PURE__ */ jsx(LoadingText, { label: labels.loading }) : empty ?? labels.empty
                               }
                             ) })
                           ]
@@ -1075,6 +1166,7 @@ function DataTable({
                     }
                   ),
                   /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-0.5", children: columns.map((col) => {
+                    if (col.key === ROW_ACTIONS_KEY) return null;
                     const checked = !hiddenCols.has(col.key);
                     const headerLabel = columnLabel(col);
                     return /* @__PURE__ */ jsxs(