@eifi1/ui-kit 0.21.0 → 0.22.0

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  // ---- 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":[]}
+{"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\n// A type-only import: erased at build time, so this module stays free of the table\n// itself (and of react-router), which `i18n/defaults` relies on.\nimport type { DataTableSortLabels } from \"./data-table\";\n\n/** The phone sort control's four keys (`sortBy`, `sortDefault`, `sortAscending`,\n *  `sortDescending`, 0.22.0) are {@link DataTableSortLabels}', declared beside the\n *  control and part of this namespace like every other key. */\nexport interface DataTableLabels extends DataTableSortLabels {\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  // The phone sort control (0.22.0). The same words as `DEFAULT_DATA_TABLE_SORT_LABELS`\n  // in data-table.tsx, written out rather than spread in: importing that VALUE here\n  // would make data-table.tsx and this module import each other (data-table.tsx reads\n  // its resolver from here), and would pull the whole table into `i18n/defaults`.\n  sortBy: \"Sort by\",\n  sortDefault: \"Default order\",\n  sortAscending: \"Ascending\",\n  sortDescending: \"Descending\",\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":";AAgGO,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;AAAA;AAAA;AAAA;AAAA;AAAA,EAKd,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,eAAe;AAAA,EACf,gBAAgB;AAClB;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-pagination.d.ts

@@ -1,5 +1,7 @@
 import * as react from 'react';
-import { DataTableLabels } from './data-table-labels.js';
+import { f as DataTableLabels } from '../data-table-labels-B7OdnM0S.js';
+import './data-table-sort.js';
+import './swipeable-row.js';
 
 declare const PAGE_SIZE_OPTIONS: readonly [10, 25, 50, 100, 200];
 interface PaginationProps {

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

@@ -1,5 +1,4 @@
 import 'react';
-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-3mi2R3so.js';
+export { a as DEFAULT_DATA_TABLE_SORT_LABELS, b as DataTable, G as DataTableCellProps, c as DataTableChrome, d as DataTableColumn, e as DataTableDensity, H as DataTableHeadProps, g as DataTableProps, h as DataTableRowAction, i as DataTableSortLabels, F as FilterState, M as MobileSwipeActions, S as ServerPagination } from '../data-table-labels-B7OdnM0S.js';
 export { SortState } from './data-table-sort.js';
 import './swipeable-row.js';
-import './data-table-labels.js';

package/dist/components/data-table.js

@@ -5,8 +5,10 @@ import { Fragment as Fragment2, useCallback, useEffect, useId, useMemo, useRef,
 import { createPortal } from "react-dom";
 import {
   ArrowDown,
+  ArrowDownWideNarrow,
   ArrowUp,
   ArrowUpDown,
+  ArrowUpNarrowWide,
   ChevronDown,
   ChevronRight,
   Filter,
@@ -14,7 +16,7 @@ import {
   Trash2,
   X
 } from "lucide-react";
-import { Card, IconButton, Spinner } from "./ui.js";
+import { Card, IconButton, Select, Spinner } from "./ui.js";
 import { cn } from "../lib/cn.js";
 import {
   defaultFilterState,
@@ -33,7 +35,7 @@ import { FullBleedDialog } from "./full-bleed-dialog.js";
 import { Popover } from "./popover.js";
 import { useMediaQuery } from "../hooks/use-media-query.js";
 import { useAnnounce } from "../hooks/use-announce.js";
-import { resolveDataTableLabels } from "./data-table-labels.js";
+import { DEFAULT_DATA_TABLE_LABELS, resolveDataTableLabels } from "./data-table-labels.js";
 import { useKitLabelOverrides, useKitLocale } from "../i18n/kit-labels.js";
 import { Tooltip } from "./tooltip.js";
 import { dirOf, isRtl } from "../lib/direction.js";
@@ -97,7 +99,68 @@ function cleanAttrs(attrs) {
 }
 function columnLabel(col, labels) {
   if (col.key === ROW_ACTIONS_KEY && labels) return labels.actions;
-  return typeof col.header === "string" ? col.header : col.key;
+  return col.headerText ?? (typeof col.header === "string" ? col.header : col.key);
+}
+const DEFAULT_DATA_TABLE_SORT_LABELS = {
+  sortBy: DEFAULT_DATA_TABLE_LABELS.sortBy,
+  sortDefault: DEFAULT_DATA_TABLE_LABELS.sortDefault,
+  sortAscending: DEFAULT_DATA_TABLE_LABELS.sortAscending,
+  sortDescending: DEFAULT_DATA_TABLE_LABELS.sortDescending
+};
+const flipDir = (d) => d === "asc" ? "desc" : "asc";
+function MobileSort({
+  columns,
+  sorts,
+  sortCycle,
+  compact,
+  labels,
+  onPick,
+  onFlip
+}) {
+  const selectId = useId();
+  const sortLabels = labels;
+  if (columns.length === 0) return null;
+  const primary = sorts[0] && columns.some((c) => c.key === sorts[0].key) ? sorts[0] : null;
+  const offerDefault = sortCycle === "tri" || primary === null;
+  const desc = primary?.dir === "desc";
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      "data-table-mobile-sort": "",
+      className: cn(
+        "flex items-center gap-2 border-b border-[var(--border)]",
+        compact ? "px-3 py-1.5" : "px-4 py-2"
+      ),
+      children: [
+        /* @__PURE__ */ jsx("label", { htmlFor: selectId, className: "shrink-0 text-xs text-[var(--text-muted)]", children: sortLabels.sortBy }),
+        /* @__PURE__ */ jsxs(
+          Select,
+          {
+            id: selectId,
+            size: compact ? "sm" : "md",
+            className: "min-w-0 flex-1",
+            value: primary?.key ?? "",
+            onChange: (e) => onPick(e.target.value || null),
+            children: [
+              offerDefault && /* @__PURE__ */ jsx("option", { value: "", children: sortLabels.sortDefault }),
+              columns.map((col) => /* @__PURE__ */ jsx("option", { value: col.key, children: columnLabel(col, labels) }, col.key))
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            size: compact ? "xs" : "md",
+            variant: "secondary",
+            label: desc ? sortLabels.sortDescending : sortLabels.sortAscending,
+            disabled: primary === null,
+            onClick: onFlip,
+            children: desc ? /* @__PURE__ */ jsx(ArrowDownWideNarrow, {}) : /* @__PURE__ */ jsx(ArrowUpNarrowWide, {})
+          }
+        )
+      ]
+    }
+  );
 }
 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) {
@@ -185,6 +248,7 @@ function DataTable({
   mobileGroupBy,
   mobileGroupLabel,
   mobileCard,
+  mobileSort = false,
   mobileSwipeActions,
   leadingRow,
   density = "comfortable",
@@ -367,6 +431,10 @@ function DataTable({
       firstDir: col?.firstSort,
       cycle: sortCycle
     });
+    commitSorts(next, key);
+  };
+  const commitSorts = (next, key) => {
+    const col = columns.find((c) => c.key === key);
     if (onSortsChange) onSortsChange(next);
     else setInternalSorts(next);
     const name = col ? columnLabel(col, labels) : key;
@@ -751,6 +819,32 @@ function DataTable({
               locale
             }
           ),
+          mobileSort && /* @__PURE__ */ jsx(
+            MobileSort,
+            {
+              columns: visibleColumns.filter((c) => (!isServer || !!onSortsChange) && !!c.sortBy),
+              sorts,
+              sortCycle,
+              compact,
+              labels,
+              onPick: (key) => {
+                if (key === null) {
+                  if (sorts.length > 0) commitSorts([], sorts[0].key);
+                  return;
+                }
+                if (sorts[0]?.key === key) return;
+                const col = columns.find((c) => c.key === key);
+                commitSorts([{ key, dir: col?.firstSort ?? "asc" }], key);
+              },
+              onFlip: () => {
+                if (sorts.length === 0) return;
+                commitSorts(
+                  sorts.map((s, i) => i === 0 ? { ...s, dir: flipDir(s.dir) } : s),
+                  sorts[0].key
+                );
+              }
+            }
+          ),
           /* @__PURE__ */ jsxs(
             "ul",
             {
@@ -1471,6 +1565,7 @@ function MobileFilters({
   ] });
 }
 export {
+  DEFAULT_DATA_TABLE_SORT_LABELS,
   DataTable
 };
 //# sourceMappingURL=data-table.js.map