@rotki/ui-library 3.1.7 → 3.3.0

package/dist/components/tables/data-table/RuiDataTableCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableCell.js","names":["_sfc_main"],"sources":["../../../../src/components/tables/data-table/RuiDataTableCell.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { TableColumn } from '@/components/tables/RuiTableHead.vue';\nimport { useDataTableColumns, useDataTableExpansion, useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiExpandButton from '@/components/tables/RuiExpandButton.vue';\n\nconst { column, row } = defineProps<{\n  column: TableColumn<T>;\n  row: T;\n  index: number;\n  rowId?: T[keyof T];\n}>();\n\ndefineSlots<{\n  default?: (props: { column: TableColumn<T>; row: T; index: number }) => any;\n}>();\n\nconst { cellValue, columnAttr, itemSlotKeys } = useDataTableColumns<T>();\nconst { isExpanded, onToggleExpand } = useDataTableExpansion<T>();\nconst { isMobile } = useDataTableStyling();\n\n/**\n * The built-in toggle is only a fallback for a consumer that does not drive\n * the expand column itself. One that provides `#item.expand` owns the decision\n * per row, rendering nothing for a row that cannot expand among them, so an\n * empty slot must not fall back to a toggle they deliberately withheld.\n */\nconst ownsExpandColumn = computed<boolean>(() => itemSlotKeys.has('expand'));\n\nconst mobileLabel = computed<string>(() => {\n  const label = column[columnAttr];\n  return label === undefined || label === null ? '' : String(label);\n});\nconst showMobileLabel = computed<boolean>(() => get(isMobile) && column.key !== 'expand' && get(mobileLabel).length > 0);\n\n/** A stacked card shows a placeholder for an empty value rather than a bare label. */\nconst showMobilePlaceholder = computed<boolean>(() => {\n  if (!get(showMobileLabel))\n    return false;\n  const value = cellValue(row, column.key);\n  return value === undefined || value === null || value === '';\n});\n</script>\n\n<template>\n  <td\n    :class=\"[\n      column.tdClass,\n      column.cellClass,\n      isMobile ? 'flex items-start justify-between gap-4 text-right' : '',\n    ]\"\n    :colspan=\"column.colspan ?? 1\"\n    :rowspan=\"column.rowspan ?? 1\"\n  >\n    <span\n      v-if=\"showMobileLabel\"\n      aria-hidden=\"true\"\n      class=\"shrink-0 text-left text-caption text-rui-text-secondary\"\n      data-id=\"cell-label\"\n    >\n      {{ mobileLabel }}\n    </span>\n    <div :class=\"isMobile ? 'min-w-0 ml-auto' : 'contents'\">\n      <slot\n        :column=\"column\"\n        :row=\"row\"\n        :index=\"index\"\n      >\n        <RuiExpandButton\n          v-if=\"column.key === 'expand' && !ownsExpandColumn\"\n          :expanded=\"rowId !== undefined && isExpanded(rowId)\"\n          @click=\"onToggleExpand(row)\"\n        />\n        <span\n          v-else-if=\"showMobilePlaceholder\"\n          class=\"text-rui-text-disabled\"\n          data-id=\"cell-placeholder\"\n        >\n          –\n        </span>\n        <template v-else-if=\"column.key !== 'expand'\">\n          {{ cellValue(row, column.key) }}\n        </template>\n      </slot>\n    </div>\n  </td>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiDataTableCell.js","names":["_sfc_main"],"sources":["../../../../src/components/tables/data-table/RuiDataTableCell.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { TableColumn } from '@/components/tables/RuiTableHead.vue';\nimport { useDataTableColumns, useDataTableExpansion, useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiExpandButton from '@/components/tables/RuiExpandButton.vue';\nimport { getColumnLabel } from '@/components/tables/table-props';\n\nconst { column, row } = defineProps<{\n  column: TableColumn<T>;\n  row: T;\n  index: number;\n  rowId?: T[keyof T];\n}>();\n\ndefineSlots<{\n  default?: (props: { column: TableColumn<T>; row: T; index: number }) => any;\n}>();\n\nconst { cellValue, columnAttr, itemSlotKeys } = useDataTableColumns<T>();\nconst { isExpanded, onToggleExpand } = useDataTableExpansion<T>();\nconst { isMobile } = useDataTableStyling();\n\n/**\n * The built-in toggle is only a fallback for a consumer that does not drive\n * the expand column itself. One that provides `#item.expand` owns the decision\n * per row, rendering nothing for a row that cannot expand among them, so an\n * empty slot must not fall back to a toggle they deliberately withheld.\n */\nconst ownsExpandColumn = computed<boolean>(() => itemSlotKeys.has('expand'));\n\nconst mobileLabel = computed<string>(() => getColumnLabel(column, columnAttr) ?? '');\nconst showMobileLabel = computed<boolean>(() => get(isMobile) && column.key !== 'expand' && get(mobileLabel).length > 0);\n\n/** A stacked card shows a placeholder for an empty value rather than a bare label. */\nconst showMobilePlaceholder = computed<boolean>(() => {\n  if (!get(showMobileLabel))\n    return false;\n  const value = cellValue(row, column.key);\n  return value === undefined || value === null || value === '';\n});\n</script>\n\n<template>\n  <td\n    :class=\"[\n      column.tdClass,\n      column.cellClass,\n      isMobile ? 'flex items-start justify-between gap-4 text-right' : '',\n    ]\"\n    :colspan=\"column.colspan ?? 1\"\n    :rowspan=\"column.rowspan ?? 1\"\n  >\n    <span\n      v-if=\"showMobileLabel\"\n      aria-hidden=\"true\"\n      class=\"shrink-0 text-left text-caption text-rui-text-secondary\"\n      data-id=\"cell-label\"\n    >\n      {{ mobileLabel }}\n    </span>\n    <div :class=\"isMobile ? 'min-w-0 ml-auto' : 'contents'\">\n      <slot\n        :column=\"column\"\n        :row=\"row\"\n        :index=\"index\"\n      >\n        <RuiExpandButton\n          v-if=\"column.key === 'expand' && !ownsExpandColumn\"\n          :expanded=\"rowId !== undefined && isExpanded(rowId)\"\n          @click=\"onToggleExpand(row)\"\n        />\n        <span\n          v-else-if=\"showMobilePlaceholder\"\n          class=\"text-rui-text-disabled\"\n          data-id=\"cell-placeholder\"\n        >\n          –\n        </span>\n        <template v-else-if=\"column.key !== 'expand'\">\n          {{ cellValue(row, column.key) }}\n        </template>\n      </slot>\n    </div>\n  </td>\n</template>\n"],"mappings":""}

package/dist/components/tables/data-table/RuiDataTableCell.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,7 @@
 import { get } from "../../../vendor/@vueuse/shared/dist/index.js";
 import { useDataTableColumns, useDataTableExpansion, useDataTableStyling } from "./context.js";
 import RuiExpandButton_default from "../RuiExpandButton.js";
+import { getColumnLabel } from "../table-props.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, normalizeClass, openBlock, renderSlot, toDisplayString, unref } from "vue";
 //#region src/components/tables/data-table/RuiDataTableCell.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["colspan", "rowspan"];
@@ -34,10 +35,7 @@ var RuiDataTableCell_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 		* empty slot must not fall back to a toggle they deliberately withheld.
 		*/
 		const ownsExpandColumn = computed(() => itemSlotKeys.has("expand"));
-		const mobileLabel = computed(() => {
-			const label = __props.column[columnAttr];
-			return label === void 0 || label === null ? "" : String(label);
-		});
+		const mobileLabel = computed(() => getColumnLabel(__props.column, columnAttr) ?? "");
 		const showMobileLabel = computed(() => get(isMobile) && __props.column.key !== "expand" && get(mobileLabel).length > 0);
 		/** A stacked card shows a placeholder for an empty value rather than a bare label. */
 		const showMobilePlaceholder = computed(() => {

package/dist/components/tables/data-table/RuiDataTableCell.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableCell.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeClass","_unref","_toDisplayString","_createCommentVNode","_createElementVNode","_renderSlot","_createBlock","RuiExpandButton","_Fragment","_createTextVNode"],"sources":["../../../../src/components/tables/data-table/RuiDataTableCell.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { TableColumn } from '@/components/tables/RuiTableHead.vue';\nimport { useDataTableColumns, useDataTableExpansion, useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiExpandButton from '@/components/tables/RuiExpandButton.vue';\n\nconst { column, row } = defineProps<{\n  column: TableColumn<T>;\n  row: T;\n  index: number;\n  rowId?: T[keyof T];\n}>();\n\ndefineSlots<{\n  default?: (props: { column: TableColumn<T>; row: T; index: number }) => any;\n}>();\n\nconst { cellValue, columnAttr, itemSlotKeys } = useDataTableColumns<T>();\nconst { isExpanded, onToggleExpand } = useDataTableExpansion<T>();\nconst { isMobile } = useDataTableStyling();\n\n/**\n * The built-in toggle is only a fallback for a consumer that does not drive\n * the expand column itself. One that provides `#item.expand` owns the decision\n * per row, rendering nothing for a row that cannot expand among them, so an\n * empty slot must not fall back to a toggle they deliberately withheld.\n */\nconst ownsExpandColumn = computed<boolean>(() => itemSlotKeys.has('expand'));\n\nconst mobileLabel = computed<string>(() => {\n  const label = column[columnAttr];\n  return label === undefined || label === null ? '' : String(label);\n});\nconst showMobileLabel = computed<boolean>(() => get(isMobile) && column.key !== 'expand' && get(mobileLabel).length > 0);\n\n/** A stacked card shows a placeholder for an empty value rather than a bare label. */\nconst showMobilePlaceholder = computed<boolean>(() => {\n  if (!get(showMobileLabel))\n    return false;\n  const value = cellValue(row, column.key);\n  return value === undefined || value === null || value === '';\n});\n</script>\n\n<template>\n  <td\n    :class=\"[\n      column.tdClass,\n      column.cellClass,\n      isMobile ? 'flex items-start justify-between gap-4 text-right' : '',\n    ]\"\n    :colspan=\"column.colspan ?? 1\"\n    :rowspan=\"column.rowspan ?? 1\"\n  >\n    <span\n      v-if=\"showMobileLabel\"\n      aria-hidden=\"true\"\n      class=\"shrink-0 text-left text-caption text-rui-text-secondary\"\n      data-id=\"cell-label\"\n    >\n      {{ mobileLabel }}\n    </span>\n    <div :class=\"isMobile ? 'min-w-0 ml-auto' : 'contents'\">\n      <slot\n        :column=\"column\"\n        :row=\"row\"\n        :index=\"index\"\n      >\n        <RuiExpandButton\n          v-if=\"column.key === 'expand' && !ownsExpandColumn\"\n          :expanded=\"rowId !== undefined && isExpanded(rowId)\"\n          @click=\"onToggleExpand(row)\"\n        />\n        <span\n          v-else-if=\"showMobilePlaceholder\"\n          class=\"text-rui-text-disabled\"\n          data-id=\"cell-placeholder\"\n        >\n          –\n        </span>\n        <template v-else-if=\"column.key !== 'expand'\">\n          {{ cellValue(row, column.key) }}\n        </template>\n      </slot>\n    </div>\n  </td>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;EAgBA,MAAM,EAAE,WAAW,YAAY,iBAAiB,oBAAuB;EACvE,MAAM,EAAE,YAAY,mBAAmB,sBAAyB;EAChE,MAAM,EAAE,aAAa,oBAAoB;;;;;;;EAQzC,MAAM,mBAAmB,eAAwB,aAAa,IAAI,QAAQ,CAAC;EAE3E,MAAM,cAAc,eAAuB;GACzC,MAAM,QAAQ,QAAA,OAAO;GACrB,OAAO,UAAU,KAAA,KAAa,UAAU,OAAO,KAAK,OAAO,KAAK;EAClE,CAAC;EACD,MAAM,kBAAkB,eAAwB,IAAI,QAAQ,KAAK,QAAA,OAAO,QAAQ,YAAY,IAAI,WAAW,CAAC,CAAC,SAAS,CAAC;;EAGvH,MAAM,wBAAwB,eAAwB;GACpD,IAAI,CAAC,IAAI,eAAe,GACtB,OAAO;GACT,MAAM,QAAQ,UAAU,QAAA,KAAK,QAAA,OAAO,GAAG;GACvC,OAAO,UAAU,KAAA,KAAa,UAAU,QAAQ,UAAU;EAC5D,CAAC;;GAIC,OAAAA,UAAA,GAAAC,mBAwCK,MAAA;IAvCF,OAAKC,eAAA;KAAU,QAAA,OAAO;KAAe,QAAA,OAAO;KAAiBC,MAAA,QAAA,IAAQ,sDAAA;;IAKrE,SAAS,QAAA,OAAO,WAAO;IACvB,SAAS,QAAA,OAAO,WAAO;GAGhBA,GAAAA,CAAAA,MAAA,eAAA,KADRH,UAAA,GAAAC,mBAOO,QAPP,YAOOG,gBADFD,MAAA,WAAA,CAAW,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAEhBG,mBAsBM,OAAA,EAtBA,OAAKJ,eAAEC,MAAA,QAAA,IAAQ,oBAAA,UAAA,EAAA,GAAA,CACnBI,WAoBO,KAAA,QAAA,WAAA;IAnBJ,QAAQ,QAAA;IACR,KAAK,QAAA;IACL,OAAO,QAAA;GAHV,SAoBO,CAdG,QAAA,OAAO,QAAG,YAAA,CAAkBJ,MAAA,gBAAA,KADpCH,UAAA,GAAAQ,YAIEC,yBAAA;;IAFC,UAAU,QAAA,UAAU,KAAA,KAAaN,MAAA,UAAA,CAAU,CAAC,QAAA,KAAK;IACjD,SAAK,OAAA,OAAA,OAAA,MAAA,WAAEA,MAAA,cAAA,CAAc,CAAC,QAAA,GAAG;GAGfA,GAAAA,MAAAA,GAAAA,CAAAA,UAAAA,CAAAA,KAAAA,MAAA,qBAAA,KADbH,UAAA,GAAAC,mBAMO,QANP,YAIC,KAED,KACqB,QAAA,OAAO,QAAG,YAA/BD,UAAA,GAAAC,mBAEWS,UAAA,EAAA,KAAA,EAAA,GAAA,CADNC,gBAAAP,gBAAAD,MAAA,SAAA,CAAS,CAAC,QAAA,KAAK,QAAA,OAAO,GAAG,CAAA,GAAA,CAAA,CAAA,GAAA,EAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,CAAA,CAAA,GAAA,CAAA,CAAA,GAAA,IAAA,UAAA"}
+{"version":3,"file":"RuiDataTableCell.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeClass","_unref","_toDisplayString","_createCommentVNode","_createElementVNode","_renderSlot","_createBlock","RuiExpandButton","_Fragment","_createTextVNode"],"sources":["../../../../src/components/tables/data-table/RuiDataTableCell.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { TableColumn } from '@/components/tables/RuiTableHead.vue';\nimport { useDataTableColumns, useDataTableExpansion, useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiExpandButton from '@/components/tables/RuiExpandButton.vue';\nimport { getColumnLabel } from '@/components/tables/table-props';\n\nconst { column, row } = defineProps<{\n  column: TableColumn<T>;\n  row: T;\n  index: number;\n  rowId?: T[keyof T];\n}>();\n\ndefineSlots<{\n  default?: (props: { column: TableColumn<T>; row: T; index: number }) => any;\n}>();\n\nconst { cellValue, columnAttr, itemSlotKeys } = useDataTableColumns<T>();\nconst { isExpanded, onToggleExpand } = useDataTableExpansion<T>();\nconst { isMobile } = useDataTableStyling();\n\n/**\n * The built-in toggle is only a fallback for a consumer that does not drive\n * the expand column itself. One that provides `#item.expand` owns the decision\n * per row, rendering nothing for a row that cannot expand among them, so an\n * empty slot must not fall back to a toggle they deliberately withheld.\n */\nconst ownsExpandColumn = computed<boolean>(() => itemSlotKeys.has('expand'));\n\nconst mobileLabel = computed<string>(() => getColumnLabel(column, columnAttr) ?? '');\nconst showMobileLabel = computed<boolean>(() => get(isMobile) && column.key !== 'expand' && get(mobileLabel).length > 0);\n\n/** A stacked card shows a placeholder for an empty value rather than a bare label. */\nconst showMobilePlaceholder = computed<boolean>(() => {\n  if (!get(showMobileLabel))\n    return false;\n  const value = cellValue(row, column.key);\n  return value === undefined || value === null || value === '';\n});\n</script>\n\n<template>\n  <td\n    :class=\"[\n      column.tdClass,\n      column.cellClass,\n      isMobile ? 'flex items-start justify-between gap-4 text-right' : '',\n    ]\"\n    :colspan=\"column.colspan ?? 1\"\n    :rowspan=\"column.rowspan ?? 1\"\n  >\n    <span\n      v-if=\"showMobileLabel\"\n      aria-hidden=\"true\"\n      class=\"shrink-0 text-left text-caption text-rui-text-secondary\"\n      data-id=\"cell-label\"\n    >\n      {{ mobileLabel }}\n    </span>\n    <div :class=\"isMobile ? 'min-w-0 ml-auto' : 'contents'\">\n      <slot\n        :column=\"column\"\n        :row=\"row\"\n        :index=\"index\"\n      >\n        <RuiExpandButton\n          v-if=\"column.key === 'expand' && !ownsExpandColumn\"\n          :expanded=\"rowId !== undefined && isExpanded(rowId)\"\n          @click=\"onToggleExpand(row)\"\n        />\n        <span\n          v-else-if=\"showMobilePlaceholder\"\n          class=\"text-rui-text-disabled\"\n          data-id=\"cell-placeholder\"\n        >\n          –\n        </span>\n        <template v-else-if=\"column.key !== 'expand'\">\n          {{ cellValue(row, column.key) }}\n        </template>\n      </slot>\n    </div>\n  </td>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;EAiBA,MAAM,EAAE,WAAW,YAAY,iBAAiB,oBAAuB;EACvE,MAAM,EAAE,YAAY,mBAAmB,sBAAyB;EAChE,MAAM,EAAE,aAAa,oBAAoB;;;;;;;EAQzC,MAAM,mBAAmB,eAAwB,aAAa,IAAI,QAAQ,CAAC;EAE3E,MAAM,cAAc,eAAuB,eAAe,QAAA,QAAQ,UAAU,KAAK,EAAE;EACnF,MAAM,kBAAkB,eAAwB,IAAI,QAAQ,KAAK,QAAA,OAAO,QAAQ,YAAY,IAAI,WAAW,CAAC,CAAC,SAAS,CAAC;;EAGvH,MAAM,wBAAwB,eAAwB;GACpD,IAAI,CAAC,IAAI,eAAe,GACtB,OAAO;GACT,MAAM,QAAQ,UAAU,QAAA,KAAK,QAAA,OAAO,GAAG;GACvC,OAAO,UAAU,KAAA,KAAa,UAAU,QAAQ,UAAU;EAC5D,CAAC;;GAIC,OAAAA,UAAA,GAAAC,mBAwCK,MAAA;IAvCF,OAAKC,eAAA;KAAU,QAAA,OAAO;KAAe,QAAA,OAAO;KAAiBC,MAAA,QAAA,IAAQ,sDAAA;;IAKrE,SAAS,QAAA,OAAO,WAAO;IACvB,SAAS,QAAA,OAAO,WAAO;GAGhBA,GAAAA,CAAAA,MAAA,eAAA,KADRH,UAAA,GAAAC,mBAOO,QAPP,YAOOG,gBADFD,MAAA,WAAA,CAAW,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAEhBG,mBAsBM,OAAA,EAtBA,OAAKJ,eAAEC,MAAA,QAAA,IAAQ,oBAAA,UAAA,EAAA,GAAA,CACnBI,WAoBO,KAAA,QAAA,WAAA;IAnBJ,QAAQ,QAAA;IACR,KAAK,QAAA;IACL,OAAO,QAAA;GAHV,SAoBO,CAdG,QAAA,OAAO,QAAG,YAAA,CAAkBJ,MAAA,gBAAA,KADpCH,UAAA,GAAAQ,YAIEC,yBAAA;;IAFC,UAAU,QAAA,UAAU,KAAA,KAAaN,MAAA,UAAA,CAAU,CAAC,QAAA,KAAK;IACjD,SAAK,OAAA,OAAA,OAAA,MAAA,WAAEA,MAAA,cAAA,CAAc,CAAC,QAAA,GAAG;GAGfA,GAAAA,MAAAA,GAAAA,CAAAA,UAAAA,CAAAA,KAAAA,MAAA,qBAAA,KADbH,UAAA,GAAAC,mBAMO,QANP,YAIC,KAED,KACqB,QAAA,OAAO,QAAG,YAA/BD,UAAA,GAAAC,mBAEWS,UAAA,EAAA,KAAA,EAAA,GAAA,CADNC,gBAAAP,gBAAAD,MAAA,SAAA,CAAS,CAAC,QAAA,KAAK,QAAA,OAAO,GAAG,CAAA,GAAA,CAAA,CAAA,GAAA,EAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,CAAA,CAAA,GAAA,CAAA,CAAA,GAAA,IAAA,UAAA"}

package/dist/components/tables/data-table/RuiDataTableMobileSort.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableMobileSort.js","names":["_sfc_main"],"sources":["../../../../src/components/tables/data-table/RuiDataTableMobileSort.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { SortColumn, TableColumn, TableRowKey } from '@/components/tables/RuiTableHead.vue';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiMenu from '@/components/overlays/menu/RuiMenu.vue';\nimport { SortDirection } from '@/components/tables/table-props';\n\nconst {\n  columns,\n  columnAttr = 'label',\n  sortedMap,\n  dense = false,\n} = defineProps<{\n  columns: TableColumn<T>[];\n  columnAttr?: keyof TableColumn<T>;\n  sortedMap: Partial<Record<TableRowKey<T>, SortColumn<T>>>;\n  dense?: boolean;\n}>();\n\nconst emit = defineEmits<{\n  sort: [value: { key: TableRowKey<T>; direction?: SortDirection }];\n}>();\n\nconst sortableColumns = computed<TableColumn<T>[]>(() => columns.filter(column => column.sortable));\n\nfunction columnLabel(column: TableColumn<T>): string {\n  const label = column[columnAttr];\n  return label === undefined || label === null ? String(column.key) : String(label);\n}\n\nfunction sortDirection(key: TableColumn<T>['key']): SortDirection | undefined {\n  return sortedMap[key as TableRowKey<T>]?.direction;\n}\n\nfunction isActive(key: TableColumn<T>['key']): boolean {\n  return (key as TableRowKey<T>) in sortedMap;\n}\n\nconst activeLabel = computed<string>(() => {\n  const active = get(sortableColumns).filter(column => isActive(column.key));\n  if (active.length === 0)\n    return 'Sort';\n  if (active.length === 1)\n    return columnLabel(active[0]!);\n  return `${active.length} sorts`;\n});\n\n/**\n * Emits the column's configured default direction, as RuiTableHead does, so\n * the sort composable runs the same asc, desc, none cycle on repeat taps.\n */\nfunction onSelect(column: TableColumn<T>): void {\n  emit('sort', {\n    key: column.key as TableRowKey<T>,\n    direction: (column.direction as SortDirection | undefined) ?? SortDirection.asc,\n  });\n}\n</script>\n\n<template>\n  <RuiMenu\n    :dense=\"dense\"\n    :options=\"{ placement: 'bottom-end' }\"\n    data-id=\"table-mobile-sort\"\n  >\n    <template #activator=\"{ attrs }\">\n      <RuiButton\n        :size=\"dense ? 'sm' : undefined\"\n        variant=\"outlined\"\n        v-bind=\"attrs\"\n        data-id=\"table-mobile-sort-activator\"\n      >\n        <template #prepend>\n          <RuiIcon\n            name=\"lu-arrow-up-down\"\n            size=\"18\"\n          />\n        </template>\n        {{ activeLabel }}\n      </RuiButton>\n    </template>\n    <div class=\"py-1 min-w-40\">\n      <RuiButton\n        v-for=\"column in sortableColumns\"\n        :key=\"column.key.toString()\"\n        variant=\"text\"\n        size=\"sm\"\n        class=\"justify-between! w-full rounded-none!\"\n        :data-id=\"`table-mobile-sort-option-${column.key}`\"\n        :data-active=\"isActive(column.key)\"\n        :data-direction=\"sortDirection(column.key)\"\n        @click=\"onSelect(column)\"\n      >\n        {{ columnLabel(column) }}\n        <template #append>\n          <RuiIcon\n            v-if=\"isActive(column.key)\"\n            name=\"lu-arrow-down\"\n            :class=\"sortDirection(column.key) === 'asc' ? 'rotate-180' : ''\"\n            size=\"16\"\n          />\n          <span\n            v-else\n            class=\"w-4\"\n          />\n        </template>\n      </RuiButton>\n    </div>\n  </RuiMenu>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiDataTableMobileSort.js","names":["_sfc_main"],"sources":["../../../../src/components/tables/data-table/RuiDataTableMobileSort.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { SortColumn, TableColumn, TableRowKey } from '@/components/tables/RuiTableHead.vue';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiMenu from '@/components/overlays/menu/RuiMenu.vue';\nimport { getColumnLabel, SortDirection } from '@/components/tables/table-props';\n\nconst {\n  columns,\n  columnAttr = 'label',\n  sortedMap,\n  dense = false,\n} = defineProps<{\n  columns: TableColumn<T>[];\n  columnAttr?: string;\n  sortedMap: Partial<Record<TableRowKey<T>, SortColumn<T>>>;\n  dense?: boolean;\n}>();\n\nconst emit = defineEmits<{\n  sort: [value: { key: TableRowKey<T>; direction?: SortDirection }];\n}>();\n\nconst sortableColumns = computed<TableColumn<T>[]>(() => columns.filter(column => column.sortable));\n\nfunction columnLabel(column: TableColumn<T>): string {\n  return getColumnLabel(column, columnAttr) ?? String(column.key);\n}\n\nfunction sortDirection(key: TableColumn<T>['key']): SortDirection | undefined {\n  return sortedMap[key as TableRowKey<T>]?.direction;\n}\n\nfunction isActive(key: TableColumn<T>['key']): boolean {\n  return (key as TableRowKey<T>) in sortedMap;\n}\n\nconst activeLabel = computed<string>(() => {\n  const active = get(sortableColumns).filter(column => isActive(column.key));\n  if (active.length === 0)\n    return 'Sort';\n  if (active.length === 1)\n    return columnLabel(active[0]!);\n  return `${active.length} sorts`;\n});\n\n/**\n * Emits the column's configured default direction, as RuiTableHead does, so\n * the sort composable runs the same asc, desc, none cycle on repeat taps.\n */\nfunction onSelect(column: TableColumn<T>): void {\n  emit('sort', {\n    key: column.key as TableRowKey<T>,\n    direction: (column.direction as SortDirection | undefined) ?? SortDirection.asc,\n  });\n}\n</script>\n\n<template>\n  <RuiMenu\n    :dense=\"dense\"\n    :options=\"{ placement: 'bottom-end' }\"\n    data-id=\"table-mobile-sort\"\n  >\n    <template #activator=\"{ attrs }\">\n      <RuiButton\n        :size=\"dense ? 'sm' : undefined\"\n        variant=\"outlined\"\n        v-bind=\"attrs\"\n        data-id=\"table-mobile-sort-activator\"\n      >\n        <template #prepend>\n          <RuiIcon\n            name=\"lu-arrow-up-down\"\n            size=\"18\"\n          />\n        </template>\n        {{ activeLabel }}\n      </RuiButton>\n    </template>\n    <div class=\"py-1 min-w-40\">\n      <RuiButton\n        v-for=\"column in sortableColumns\"\n        :key=\"column.key.toString()\"\n        variant=\"text\"\n        size=\"sm\"\n        class=\"justify-between! w-full rounded-none!\"\n        :data-id=\"`table-mobile-sort-option-${column.key}`\"\n        :data-active=\"isActive(column.key)\"\n        :data-direction=\"sortDirection(column.key)\"\n        @click=\"onSelect(column)\"\n      >\n        {{ columnLabel(column) }}\n        <template #append>\n          <RuiIcon\n            v-if=\"isActive(column.key)\"\n            name=\"lu-arrow-down\"\n            :class=\"sortDirection(column.key) === 'asc' ? 'rotate-180' : ''\"\n            size=\"16\"\n          />\n          <span\n            v-else\n            class=\"w-4\"\n          />\n        </template>\n      </RuiButton>\n    </div>\n  </RuiMenu>\n</template>\n"],"mappings":""}

package/dist/components/tables/data-table/RuiDataTableMobileSort.vue.d.ts

@@ -3,7 +3,7 @@ import { SortDirection } from '../table-props.js';
 declare const __VLS_export: <T extends object>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: import("vue").PublicProps & __VLS_PrettifyLocal<{
         columns: TableColumn<T>[];
-        columnAttr?: keyof TableColumn<T>;
+        columnAttr?: string;
         sortedMap: Partial<Record<TableRowKey<T>, SortColumn<T>>>;
         dense?: boolean;
     } & {

package/dist/components/tables/data-table/RuiDataTableMobileSort.vue_vue_type_script_setup_true_lang.js

@@ -2,7 +2,7 @@ import { get } from "../../../vendor/@vueuse/shared/dist/index.js";
 import RuiIcon_default from "../../icons/RuiIcon.js";
 import RuiButton_default from "../../buttons/button/RuiButton.js";
 import RuiMenu_default from "../../overlays/menu/RuiMenu.js";
-import { SortDirection } from "../table-props.js";
+import { SortDirection, getColumnLabel } from "../table-props.js";
 import { Fragment, computed, createBlock, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeProps, normalizeClass, openBlock, renderList, toDisplayString, unref, withCtx } from "vue";
 //#region src/components/tables/data-table/RuiDataTableMobileSort.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = { class: "py-1 min-w-40" };
@@ -26,8 +26,7 @@ var RuiDataTableMobileSort_vue_vue_type_script_setup_true_lang_default = /*@__PU
 		const emit = __emit;
 		const sortableColumns = computed(() => __props.columns.filter((column) => column.sortable));
 		function columnLabel(column) {
-			const label = column[__props.columnAttr];
-			return label === void 0 || label === null ? String(column.key) : String(label);
+			return getColumnLabel(column, __props.columnAttr) ?? String(column.key);
 		}
 		function sortDirection(key) {
 			return __props.sortedMap[key]?.direction;

package/dist/components/tables/data-table/RuiDataTableMobileSort.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableMobileSort.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","RuiMenu","_withCtx","_createVNode","RuiButton","_mergeProps","RuiIcon","_createTextVNode","_toDisplayString","_unref","_createElementVNode","_createElementBlock","_Fragment","_renderList","_normalizeClass"],"sources":["../../../../src/components/tables/data-table/RuiDataTableMobileSort.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { SortColumn, TableColumn, TableRowKey } from '@/components/tables/RuiTableHead.vue';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiMenu from '@/components/overlays/menu/RuiMenu.vue';\nimport { SortDirection } from '@/components/tables/table-props';\n\nconst {\n  columns,\n  columnAttr = 'label',\n  sortedMap,\n  dense = false,\n} = defineProps<{\n  columns: TableColumn<T>[];\n  columnAttr?: keyof TableColumn<T>;\n  sortedMap: Partial<Record<TableRowKey<T>, SortColumn<T>>>;\n  dense?: boolean;\n}>();\n\nconst emit = defineEmits<{\n  sort: [value: { key: TableRowKey<T>; direction?: SortDirection }];\n}>();\n\nconst sortableColumns = computed<TableColumn<T>[]>(() => columns.filter(column => column.sortable));\n\nfunction columnLabel(column: TableColumn<T>): string {\n  const label = column[columnAttr];\n  return label === undefined || label === null ? String(column.key) : String(label);\n}\n\nfunction sortDirection(key: TableColumn<T>['key']): SortDirection | undefined {\n  return sortedMap[key as TableRowKey<T>]?.direction;\n}\n\nfunction isActive(key: TableColumn<T>['key']): boolean {\n  return (key as TableRowKey<T>) in sortedMap;\n}\n\nconst activeLabel = computed<string>(() => {\n  const active = get(sortableColumns).filter(column => isActive(column.key));\n  if (active.length === 0)\n    return 'Sort';\n  if (active.length === 1)\n    return columnLabel(active[0]!);\n  return `${active.length} sorts`;\n});\n\n/**\n * Emits the column's configured default direction, as RuiTableHead does, so\n * the sort composable runs the same asc, desc, none cycle on repeat taps.\n */\nfunction onSelect(column: TableColumn<T>): void {\n  emit('sort', {\n    key: column.key as TableRowKey<T>,\n    direction: (column.direction as SortDirection | undefined) ?? SortDirection.asc,\n  });\n}\n</script>\n\n<template>\n  <RuiMenu\n    :dense=\"dense\"\n    :options=\"{ placement: 'bottom-end' }\"\n    data-id=\"table-mobile-sort\"\n  >\n    <template #activator=\"{ attrs }\">\n      <RuiButton\n        :size=\"dense ? 'sm' : undefined\"\n        variant=\"outlined\"\n        v-bind=\"attrs\"\n        data-id=\"table-mobile-sort-activator\"\n      >\n        <template #prepend>\n          <RuiIcon\n            name=\"lu-arrow-up-down\"\n            size=\"18\"\n          />\n        </template>\n        {{ activeLabel }}\n      </RuiButton>\n    </template>\n    <div class=\"py-1 min-w-40\">\n      <RuiButton\n        v-for=\"column in sortableColumns\"\n        :key=\"column.key.toString()\"\n        variant=\"text\"\n        size=\"sm\"\n        class=\"justify-between! w-full rounded-none!\"\n        :data-id=\"`table-mobile-sort-option-${column.key}`\"\n        :data-active=\"isActive(column.key)\"\n        :data-direction=\"sortDirection(column.key)\"\n        @click=\"onSelect(column)\"\n      >\n        {{ columnLabel(column) }}\n        <template #append>\n          <RuiIcon\n            v-if=\"isActive(column.key)\"\n            name=\"lu-arrow-down\"\n            :class=\"sortDirection(column.key) === 'asc' ? 'rotate-180' : ''\"\n            size=\"16\"\n          />\n          <span\n            v-else\n            class=\"w-4\"\n          />\n        </template>\n      </RuiButton>\n    </div>\n  </RuiMenu>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EAmBA,MAAM,OAAO;EAIb,MAAM,kBAAkB,eAAiC,QAAA,QAAQ,QAAO,WAAU,OAAO,QAAQ,CAAC;EAElG,SAAS,YAAY,QAAgC;GACnD,MAAM,QAAQ,OAAO,QAAA;GACrB,OAAO,UAAU,KAAA,KAAa,UAAU,OAAO,OAAO,OAAO,GAAG,IAAI,OAAO,KAAK;EAClF;EAEA,SAAS,cAAc,KAAuD;GAC5E,OAAO,QAAA,UAAU,IAAsB,EAAE;EAC3C;EAEA,SAAS,SAAS,KAAqC;GACrD,OAAQ,OAA0B,QAAA;EACpC;EAEA,MAAM,cAAc,eAAuB;GACzC,MAAM,SAAS,IAAI,eAAe,CAAC,CAAC,QAAO,WAAU,SAAS,OAAO,GAAG,CAAC;GACzE,IAAI,OAAO,WAAW,GACpB,OAAO;GACT,IAAI,OAAO,WAAW,GACpB,OAAO,YAAY,OAAO,EAAG;GAC/B,OAAO,GAAG,OAAO,OAAO;EAC1B,CAAC;;;;;EAMD,SAAS,SAAS,QAA8B;GAC9C,KAAK,QAAQ;IACX,KAAK,OAAO;IACZ,WAAY,OAAO,aAA2C,cAAc;GAC9E,CAAC;EACH;;GAIE,OAAAA,UAAA,GAAAC,YAgDUC,iBAAA;IA/CP,OAAO,QAAA;IACP,SAAS,EAAA,WAAA,aAAA;IACV,WAAQ;;IAEG,WAASC,SAcN,EAdU,YAAK,CAC3BC,YAaYC,mBAbZC,WAaY;KAZT,MAAM,QAAA,QAAK,OAAU,KAAA;KACtB,SAAQ;IACA,GAAA,OAAK,EACb,WAAQ,8BAA6B,CAAA,GAAA;KAE1B,SAAOH,cAId,CAHFC,YAGEG,iBAAA;MAFA,MAAK;MACL,MAAK;;KAEE,SAAAJ,cACX,CADWK,gBAAA,MACXC,gBAAGC,MAAA,WAAA,CAAW,GAAA,CAAA,CAAA,CAAA;;;IAGlB,SAAAP,cA0BM,CA1BNQ,mBA0BM,OA1BN,YA0BM,EAzBJX,UAAA,IAAA,GAAAY,mBAwBYC,UAAA,MAAAC,WAvBOJ,MAAA,eAAA,IAAV,WAAM;KADf,OAAAV,UAAA,GAAAC,YAwBYI,mBAAA;MAtBT,KAAK,OAAO,IAAI,SAAQ;MACzB,SAAQ;MACR,MAAK;MACL,OAAM;MACL,WAAO,4BAA8B,OAAO;MAC5C,eAAa,SAAS,OAAO,GAAG;MAChC,kBAAgB,cAAc,OAAO,GAAG;MACxC,UAAK,WAAE,SAAS,MAAM;;MAGZ,QAAMF,cAMb,CAJM,SAAS,OAAO,GAAG,KAD3BH,UAAA,GAAAC,YAKEM,iBAAA;;OAHA,MAAK;OACJ,OAAKQ,eAAE,cAAc,OAAO,GAAG,MAAA,QAAA,eAAA,EAAA;OAChC,MAAK;MAEPf,GAAAA,MAAAA,GAAAA,CAAAA,OAAAA,CAAAA,MAAAA,UAAA,GAAAY,mBAGE,QAHF,UAGE,EAAA,CAAA;MAXJ,SAAAT,cAAyB,CAAtBK,gBAAAC,gBAAA,YAAY,MAAM,CAAA,IAAI,KACzB,CAAA,CAAA,CAAA"}
+{"version":3,"file":"RuiDataTableMobileSort.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","RuiMenu","_withCtx","_createVNode","RuiButton","_mergeProps","RuiIcon","_createTextVNode","_toDisplayString","_unref","_createElementVNode","_createElementBlock","_Fragment","_renderList","_normalizeClass"],"sources":["../../../../src/components/tables/data-table/RuiDataTableMobileSort.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { SortColumn, TableColumn, TableRowKey } from '@/components/tables/RuiTableHead.vue';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiMenu from '@/components/overlays/menu/RuiMenu.vue';\nimport { getColumnLabel, SortDirection } from '@/components/tables/table-props';\n\nconst {\n  columns,\n  columnAttr = 'label',\n  sortedMap,\n  dense = false,\n} = defineProps<{\n  columns: TableColumn<T>[];\n  columnAttr?: string;\n  sortedMap: Partial<Record<TableRowKey<T>, SortColumn<T>>>;\n  dense?: boolean;\n}>();\n\nconst emit = defineEmits<{\n  sort: [value: { key: TableRowKey<T>; direction?: SortDirection }];\n}>();\n\nconst sortableColumns = computed<TableColumn<T>[]>(() => columns.filter(column => column.sortable));\n\nfunction columnLabel(column: TableColumn<T>): string {\n  return getColumnLabel(column, columnAttr) ?? String(column.key);\n}\n\nfunction sortDirection(key: TableColumn<T>['key']): SortDirection | undefined {\n  return sortedMap[key as TableRowKey<T>]?.direction;\n}\n\nfunction isActive(key: TableColumn<T>['key']): boolean {\n  return (key as TableRowKey<T>) in sortedMap;\n}\n\nconst activeLabel = computed<string>(() => {\n  const active = get(sortableColumns).filter(column => isActive(column.key));\n  if (active.length === 0)\n    return 'Sort';\n  if (active.length === 1)\n    return columnLabel(active[0]!);\n  return `${active.length} sorts`;\n});\n\n/**\n * Emits the column's configured default direction, as RuiTableHead does, so\n * the sort composable runs the same asc, desc, none cycle on repeat taps.\n */\nfunction onSelect(column: TableColumn<T>): void {\n  emit('sort', {\n    key: column.key as TableRowKey<T>,\n    direction: (column.direction as SortDirection | undefined) ?? SortDirection.asc,\n  });\n}\n</script>\n\n<template>\n  <RuiMenu\n    :dense=\"dense\"\n    :options=\"{ placement: 'bottom-end' }\"\n    data-id=\"table-mobile-sort\"\n  >\n    <template #activator=\"{ attrs }\">\n      <RuiButton\n        :size=\"dense ? 'sm' : undefined\"\n        variant=\"outlined\"\n        v-bind=\"attrs\"\n        data-id=\"table-mobile-sort-activator\"\n      >\n        <template #prepend>\n          <RuiIcon\n            name=\"lu-arrow-up-down\"\n            size=\"18\"\n          />\n        </template>\n        {{ activeLabel }}\n      </RuiButton>\n    </template>\n    <div class=\"py-1 min-w-40\">\n      <RuiButton\n        v-for=\"column in sortableColumns\"\n        :key=\"column.key.toString()\"\n        variant=\"text\"\n        size=\"sm\"\n        class=\"justify-between! w-full rounded-none!\"\n        :data-id=\"`table-mobile-sort-option-${column.key}`\"\n        :data-active=\"isActive(column.key)\"\n        :data-direction=\"sortDirection(column.key)\"\n        @click=\"onSelect(column)\"\n      >\n        {{ columnLabel(column) }}\n        <template #append>\n          <RuiIcon\n            v-if=\"isActive(column.key)\"\n            name=\"lu-arrow-down\"\n            :class=\"sortDirection(column.key) === 'asc' ? 'rotate-180' : ''\"\n            size=\"16\"\n          />\n          <span\n            v-else\n            class=\"w-4\"\n          />\n        </template>\n      </RuiButton>\n    </div>\n  </RuiMenu>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EAmBA,MAAM,OAAO;EAIb,MAAM,kBAAkB,eAAiC,QAAA,QAAQ,QAAO,WAAU,OAAO,QAAQ,CAAC;EAElG,SAAS,YAAY,QAAgC;GACnD,OAAO,eAAe,QAAQ,QAAA,UAAU,KAAK,OAAO,OAAO,GAAG;EAChE;EAEA,SAAS,cAAc,KAAuD;GAC5E,OAAO,QAAA,UAAU,IAAsB,EAAE;EAC3C;EAEA,SAAS,SAAS,KAAqC;GACrD,OAAQ,OAA0B,QAAA;EACpC;EAEA,MAAM,cAAc,eAAuB;GACzC,MAAM,SAAS,IAAI,eAAe,CAAC,CAAC,QAAO,WAAU,SAAS,OAAO,GAAG,CAAC;GACzE,IAAI,OAAO,WAAW,GACpB,OAAO;GACT,IAAI,OAAO,WAAW,GACpB,OAAO,YAAY,OAAO,EAAG;GAC/B,OAAO,GAAG,OAAO,OAAO;EAC1B,CAAC;;;;;EAMD,SAAS,SAAS,QAA8B;GAC9C,KAAK,QAAQ;IACX,KAAK,OAAO;IACZ,WAAY,OAAO,aAA2C,cAAc;GAC9E,CAAC;EACH;;GAIE,OAAAA,UAAA,GAAAC,YAgDUC,iBAAA;IA/CP,OAAO,QAAA;IACP,SAAS,EAAA,WAAA,aAAA;IACV,WAAQ;;IAEG,WAASC,SAcN,EAdU,YAAK,CAC3BC,YAaYC,mBAbZC,WAaY;KAZT,MAAM,QAAA,QAAK,OAAU,KAAA;KACtB,SAAQ;IACA,GAAA,OAAK,EACb,WAAQ,8BAA6B,CAAA,GAAA;KAE1B,SAAOH,cAId,CAHFC,YAGEG,iBAAA;MAFA,MAAK;MACL,MAAK;;KAEE,SAAAJ,cACX,CADWK,gBAAA,MACXC,gBAAGC,MAAA,WAAA,CAAW,GAAA,CAAA,CAAA,CAAA;;;IAGlB,SAAAP,cA0BM,CA1BNQ,mBA0BM,OA1BN,YA0BM,EAzBJX,UAAA,IAAA,GAAAY,mBAwBYC,UAAA,MAAAC,WAvBOJ,MAAA,eAAA,IAAV,WAAM;KADf,OAAAV,UAAA,GAAAC,YAwBYI,mBAAA;MAtBT,KAAK,OAAO,IAAI,SAAQ;MACzB,SAAQ;MACR,MAAK;MACL,OAAM;MACL,WAAO,4BAA8B,OAAO;MAC5C,eAAa,SAAS,OAAO,GAAG;MAChC,kBAAgB,cAAc,OAAO,GAAG;MACxC,UAAK,WAAE,SAAS,MAAM;;MAGZ,QAAMF,cAMb,CAJM,SAAS,OAAO,GAAG,KAD3BH,UAAA,GAAAC,YAKEM,iBAAA;;OAHA,MAAK;OACJ,OAAKQ,eAAE,cAAc,OAAO,GAAG,MAAA,QAAA,eAAA,EAAA;OAChC,MAAK;MAEPf,GAAAA,MAAAA,GAAAA,CAAAA,OAAAA,CAAAA,MAAAA,UAAA,GAAAY,mBAGE,QAHF,UAGE,EAAA,CAAA;MAXJ,SAAAT,cAAyB,CAAtBK,gBAAAC,gBAAA,YAAY,MAAM,CAAA,IAAI,KACzB,CAAA,CAAA,CAAA"}

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

@@ -27,7 +27,7 @@ export interface DataTableColumnsContext<T extends object = any> {
     cellValue: (row: T, key: TableColumn<T>['key']) => T[keyof T];
     itemSlotKeys: Set<string>;
     /** the column definition attribute used as the visible label (e.g. `label`) */
-    columnAttr: keyof TableColumn<T>;
+    columnAttr: string;
 }
 export interface DataTableSelectionContext<T extends object = any, IdType extends keyof T = keyof T> {
     selectedData: Ref<T[IdType][] | undefined>;
@@ -65,15 +65,15 @@ export type DataTableContext<T extends object = any, IdType extends keyof T = ke
 export declare function provideDataTableStyling(context: DataTableStylingContext): void;
 export declare function useDataTableStyling(): DataTableStylingContext;
 export declare function provideDataTableColumns<T extends object>(context: DataTableColumnsContext<T>): void;
-export declare function useDataTableColumns<T extends object = any>(): DataTableColumnsContext<T>;
+export declare function useDataTableColumns<T extends object>(): DataTableColumnsContext<T>;
 export declare function provideDataTableSelection<T extends object, IdType extends keyof T>(context: DataTableSelectionContext<T, IdType>): void;
-export declare function useDataTableSelection<T extends object = any, IdType extends keyof T = keyof T>(): DataTableSelectionContext<T, IdType>;
+export declare function useDataTableSelection<T extends object, IdType extends keyof T = keyof T>(): DataTableSelectionContext<T, IdType>;
 export declare function provideDataTableExpansion<T extends object, IdType extends keyof T>(context: DataTableExpansionContext<T, IdType>): void;
-export declare function useDataTableExpansion<T extends object = any, IdType extends keyof T = keyof T>(): DataTableExpansionContext<T, IdType>;
+export declare function useDataTableExpansion<T extends object, IdType extends keyof T = keyof T>(): DataTableExpansionContext<T, IdType>;
 export declare function provideDataTableGrouping<T extends object>(context: DataTableGroupingContext<T>): void;
-export declare function useDataTableGrouping<T extends object = any>(): DataTableGroupingContext<T>;
+export declare function useDataTableGrouping<T extends object>(): DataTableGroupingContext<T>;
 export declare function provideDataTableRowIdentity<T extends object, IdType extends keyof T>(context: DataTableRowIdentityContext<T, IdType>): void;
-export declare function useDataTableRowIdentity<T extends object = any, IdType extends keyof T = keyof T>(): DataTableRowIdentityContext<T, IdType>;
+export declare function useDataTableRowIdentity<T extends object, IdType extends keyof T = keyof T>(): DataTableRowIdentityContext<T, IdType>;
 /** Marks descendant data tables as nested (e.g. rendered inside an expanded row). */
 export declare function provideDataTableNested(): void;
 /** True when this data table is rendered inside another data table. */

package/dist/components/tables/data-table/context.js

@@ -8,7 +8,7 @@ var DATA_TABLE_GROUPING = Symbol("data-table-grouping");
 var DATA_TABLE_ROW_IDENTITY = Symbol("data-table-row-identity");
 var DATA_TABLE_NESTED = Symbol("data-table-nested");
 function injectOrThrow(key, name) {
-	const context = inject(key);
+	const context = inject(key, void 0);
 	if (context === void 0) throw new Error(`${name} must be used within a RuiDataTable`);
 	return context;
 }

package/dist/components/tables/data-table/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","names":[],"sources":["../../../../src/components/tables/data-table/context.ts"],"sourcesContent":["import type { ComputedRef, Ref } from 'vue';\nimport type { TableColumn } from '@/components/tables/RuiTableHead.vue';\nimport type { GroupExpandButtonPosition } from '@/components/tables/table-props';\nimport type { GroupHeader } from '@/composables/tables/data-table/types';\n\nexport interface DataTableClasses {\n  td: string;\n  tr: string;\n  trSelected: string;\n  trExpandable: string;\n  /** a row whose expanded panel is open, shaded to match the panel */\n  trExpandedParent: string;\n  trGroup: string;\n  trEmpty: string;\n  checkbox: string;\n  tbody: string;\n  tbodyLoader: string;\n}\n\n// --- Per-concern context interfaces ---\n\nexport interface DataTableStylingContext {\n  classes: ComputedRef<DataTableClasses>;\n  colspan: ComputedRef<number>;\n  dense: boolean;\n  /** whether the table is currently rendered in its stacked mobile layout */\n  isMobile: ComputedRef<boolean>;\n}\n\nexport interface DataTableColumnsContext<T extends object = any> {\n  columns: ComputedRef<TableColumn<T>[]>;\n  cellValue: (row: T, key: TableColumn<T>['key']) => T[keyof T];\n  itemSlotKeys: Set<string>;\n  /** the column definition attribute used as the visible label (e.g. `label`) */\n  columnAttr: keyof TableColumn<T>;\n}\n\nexport interface DataTableSelectionContext<T extends object = any, IdType extends keyof T = keyof T> {\n  selectedData: Ref<T[IdType][] | undefined>;\n  isSelected: (id: T[IdType]) => boolean;\n  isDisabledRow: (id: T[IdType]) => boolean;\n  onSelect: (selected: boolean, id: T[IdType], userAction: boolean) => void;\n  onCheckboxClick: (event: MouseEvent, id: T[IdType], index: number) => void;\n}\n\nexport interface DataTableExpansionContext<T extends object = any, IdType extends keyof T = keyof T> {\n  expandable: ComputedRef<boolean>;\n  isExpanded: (id: T[IdType]) => boolean;\n  onToggleExpand: (row: T) => void;\n}\n\nexport interface DataTableGroupLabel {\n  key: string;\n  /** the grouped column's visible label, or the key when no column defines one */\n  label: string;\n}\n\nexport interface DataTableGroupingContext<T extends object = any> {\n  groupExpandButtonPosition: GroupExpandButtonPosition;\n  groupKey: ComputedRef<string | undefined>;\n  groupLabels: ComputedRef<DataTableGroupLabel[]>;\n  /** the number of rows in the group, across all pages */\n  getGroupSize: (identifier: string) => number;\n  isExpandedGroup: (group: Partial<T>) => boolean;\n  onToggleExpandGroup: (group: Partial<T>, identifier: string) => void;\n  onUngroup: () => void;\n  onCopyGroup: (header: GroupHeader<T>) => void;\n}\n\nexport interface DataTableRowIdentityContext<T extends object = any, IdType extends keyof T = keyof T> {\n  getRowId: (row: T) => T[IdType];\n  itemClass: ((item: T) => string) | string;\n}\n\n// --- Backward-compatible merged type ---\n\nexport type DataTableContext<T extends object = any, IdType extends keyof T = keyof T> =\n  DataTableStylingContext &\n  DataTableColumnsContext<T> &\n  DataTableSelectionContext<T, IdType> &\n  DataTableExpansionContext<T, IdType> &\n  DataTableGroupingContext<T> &\n  DataTableRowIdentityContext<T, IdType>;\n\n// --- Per-concern symbols ---\n\nconst DATA_TABLE_STYLING = Symbol('data-table-styling');\nconst DATA_TABLE_COLUMNS = Symbol('data-table-columns');\nconst DATA_TABLE_SELECTION = Symbol('data-table-selection');\nconst DATA_TABLE_EXPANSION = Symbol('data-table-expansion');\nconst DATA_TABLE_GROUPING = Symbol('data-table-grouping');\nconst DATA_TABLE_ROW_IDENTITY = Symbol('data-table-row-identity');\nconst DATA_TABLE_NESTED = Symbol('data-table-nested');\n\n// --- Per-concern provide/use pairs ---\n\nfunction injectOrThrow<C>(key: symbol, name: string): C {\n  const context = inject<C>(key);\n  if (context === undefined)\n    throw new Error(`${name} must be used within a RuiDataTable`);\n\n  return context;\n}\n\nexport function provideDataTableStyling(context: DataTableStylingContext): void {\n  provide(DATA_TABLE_STYLING, context);\n}\n\nexport function useDataTableStyling(): DataTableStylingContext {\n  return injectOrThrow<DataTableStylingContext>(DATA_TABLE_STYLING, 'useDataTableStyling');\n}\n\nexport function provideDataTableColumns<T extends object>(context: DataTableColumnsContext<T>): void {\n  provide(DATA_TABLE_COLUMNS, context);\n}\n\nexport function useDataTableColumns<T extends object = any>(): DataTableColumnsContext<T> {\n  return injectOrThrow<DataTableColumnsContext<T>>(DATA_TABLE_COLUMNS, 'useDataTableColumns');\n}\n\nexport function provideDataTableSelection<T extends object, IdType extends keyof T>(context: DataTableSelectionContext<T, IdType>): void {\n  provide(DATA_TABLE_SELECTION, context);\n}\n\nexport function useDataTableSelection<T extends object = any, IdType extends keyof T = keyof T>(): DataTableSelectionContext<T, IdType> {\n  return injectOrThrow<DataTableSelectionContext<T, IdType>>(DATA_TABLE_SELECTION, 'useDataTableSelection');\n}\n\nexport function provideDataTableExpansion<T extends object, IdType extends keyof T>(context: DataTableExpansionContext<T, IdType>): void {\n  provide(DATA_TABLE_EXPANSION, context);\n}\n\nexport function useDataTableExpansion<T extends object = any, IdType extends keyof T = keyof T>(): DataTableExpansionContext<T, IdType> {\n  return injectOrThrow<DataTableExpansionContext<T, IdType>>(DATA_TABLE_EXPANSION, 'useDataTableExpansion');\n}\n\nexport function provideDataTableGrouping<T extends object>(context: DataTableGroupingContext<T>): void {\n  provide(DATA_TABLE_GROUPING, context);\n}\n\nexport function useDataTableGrouping<T extends object = any>(): DataTableGroupingContext<T> {\n  return injectOrThrow<DataTableGroupingContext<T>>(DATA_TABLE_GROUPING, 'useDataTableGrouping');\n}\n\nexport function provideDataTableRowIdentity<T extends object, IdType extends keyof T>(context: DataTableRowIdentityContext<T, IdType>): void {\n  provide(DATA_TABLE_ROW_IDENTITY, context);\n}\n\nexport function useDataTableRowIdentity<T extends object = any, IdType extends keyof T = keyof T>(): DataTableRowIdentityContext<T, IdType> {\n  return injectOrThrow<DataTableRowIdentityContext<T, IdType>>(DATA_TABLE_ROW_IDENTITY, 'useDataTableRowIdentity');\n}\n\n/** Marks descendant data tables as nested (e.g. rendered inside an expanded row). */\nexport function provideDataTableNested(): void {\n  provide(DATA_TABLE_NESTED, true);\n}\n\n/** True when this data table is rendered inside another data table. */\nexport function useDataTableNested(): boolean {\n  return inject<boolean>(DATA_TABLE_NESTED, false);\n}\n\n// --- Backward-compatible facade ---\n\nexport function provideDataTableContext<T extends object, IdType extends keyof T>(context: DataTableContext<T, IdType>): void {\n  provideDataTableStyling({ classes: context.classes, colspan: context.colspan, dense: context.dense, isMobile: context.isMobile });\n  provideDataTableColumns<T>({ columns: context.columns, cellValue: context.cellValue, itemSlotKeys: context.itemSlotKeys, columnAttr: context.columnAttr });\n  provideDataTableSelection<T, IdType>({ selectedData: context.selectedData, isSelected: context.isSelected, isDisabledRow: context.isDisabledRow, onSelect: context.onSelect, onCheckboxClick: context.onCheckboxClick });\n  provideDataTableExpansion<T, IdType>({ expandable: context.expandable, isExpanded: context.isExpanded, onToggleExpand: context.onToggleExpand });\n  provideDataTableGrouping<T>({ groupExpandButtonPosition: context.groupExpandButtonPosition, groupKey: context.groupKey, groupLabels: context.groupLabels, getGroupSize: context.getGroupSize, isExpandedGroup: context.isExpandedGroup, onToggleExpandGroup: context.onToggleExpandGroup, onUngroup: context.onUngroup, onCopyGroup: context.onCopyGroup });\n  provideDataTableRowIdentity<T, IdType>({ getRowId: context.getRowId, itemClass: context.itemClass });\n}\n\nexport function useDataTableContext<T extends object, IdType extends keyof T = keyof T>(): DataTableContext<T, IdType> {\n  return {\n    ...useDataTableStyling(),\n    ...useDataTableColumns<T>(),\n    ...useDataTableSelection<T, IdType>(),\n    ...useDataTableExpansion<T, IdType>(),\n    ...useDataTableGrouping<T>(),\n    ...useDataTableRowIdentity<T, IdType>(),\n  };\n}\n"],"mappings":";;AAsFA,IAAM,qBAAqB,OAAO,oBAAoB;AACtD,IAAM,qBAAqB,OAAO,oBAAoB;AACtD,IAAM,uBAAuB,OAAO,sBAAsB;AAC1D,IAAM,uBAAuB,OAAO,sBAAsB;AAC1D,IAAM,sBAAsB,OAAO,qBAAqB;AACxD,IAAM,0BAA0B,OAAO,yBAAyB;AAChE,IAAM,oBAAoB,OAAO,mBAAmB;AAIpD,SAAS,cAAiB,KAAa,MAAiB;CACtD,MAAM,UAAU,OAAU,GAAG;CAC7B,IAAI,YAAY,KAAA,GACd,MAAM,IAAI,MAAM,GAAG,KAAK,oCAAoC;CAE9D,OAAO;AACT;AAEA,SAAgB,wBAAwB,SAAwC;CAC9E,QAAQ,oBAAoB,OAAO;AACrC;AAEA,SAAgB,sBAA+C;CAC7D,OAAO,cAAuC,oBAAoB,qBAAqB;AACzF;AAEA,SAAgB,wBAA0C,SAA2C;CACnG,QAAQ,oBAAoB,OAAO;AACrC;AAEA,SAAgB,sBAA0E;CACxF,OAAO,cAA0C,oBAAoB,qBAAqB;AAC5F;AAEA,SAAgB,0BAAoE,SAAqD;CACvI,QAAQ,sBAAsB,OAAO;AACvC;AAEA,SAAgB,wBAAwH;CACtI,OAAO,cAAoD,sBAAsB,uBAAuB;AAC1G;AAEA,SAAgB,0BAAoE,SAAqD;CACvI,QAAQ,sBAAsB,OAAO;AACvC;AAEA,SAAgB,wBAAwH;CACtI,OAAO,cAAoD,sBAAsB,uBAAuB;AAC1G;AAEA,SAAgB,yBAA2C,SAA4C;CACrG,QAAQ,qBAAqB,OAAO;AACtC;AAEA,SAAgB,uBAA4E;CAC1F,OAAO,cAA2C,qBAAqB,sBAAsB;AAC/F;AAEA,SAAgB,4BAAsE,SAAuD;CAC3I,QAAQ,yBAAyB,OAAO;AAC1C;AAEA,SAAgB,0BAA4H;CAC1I,OAAO,cAAsD,yBAAyB,yBAAyB;AACjH;;AAGA,SAAgB,yBAA+B;CAC7C,QAAQ,mBAAmB,IAAI;AACjC;;AAGA,SAAgB,qBAA8B;CAC5C,OAAO,OAAgB,mBAAmB,KAAK;AACjD;AAIA,SAAgB,wBAAkE,SAA4C;CAC5H,wBAAwB;EAAE,SAAS,QAAQ;EAAS,SAAS,QAAQ;EAAS,OAAO,QAAQ;EAAO,UAAU,QAAQ;CAAS,CAAC;CAChI,wBAA2B;EAAE,SAAS,QAAQ;EAAS,WAAW,QAAQ;EAAW,cAAc,QAAQ;EAAc,YAAY,QAAQ;CAAW,CAAC;CACzJ,0BAAqC;EAAE,cAAc,QAAQ;EAAc,YAAY,QAAQ;EAAY,eAAe,QAAQ;EAAe,UAAU,QAAQ;EAAU,iBAAiB,QAAQ;CAAgB,CAAC;CACvN,0BAAqC;EAAE,YAAY,QAAQ;EAAY,YAAY,QAAQ;EAAY,gBAAgB,QAAQ;CAAe,CAAC;CAC/I,yBAA4B;EAAE,2BAA2B,QAAQ;EAA2B,UAAU,QAAQ;EAAU,aAAa,QAAQ;EAAa,cAAc,QAAQ;EAAc,iBAAiB,QAAQ;EAAiB,qBAAqB,QAAQ;EAAqB,WAAW,QAAQ;EAAW,aAAa,QAAQ;CAAY,CAAC;CAC1V,4BAAuC;EAAE,UAAU,QAAQ;EAAU,WAAW,QAAQ;CAAU,CAAC;AACrG"}
+{"version":3,"file":"context.js","names":[],"sources":["../../../../src/components/tables/data-table/context.ts"],"sourcesContent":["import type { ComputedRef, InjectionKey, Ref } from 'vue';\nimport type { TableColumn } from '@/components/tables/RuiTableHead.vue';\nimport type { GroupExpandButtonPosition } from '@/components/tables/table-props';\nimport type { GroupHeader } from '@/composables/tables/data-table/types';\n\nexport interface DataTableClasses {\n  td: string;\n  tr: string;\n  trSelected: string;\n  trExpandable: string;\n  /** a row whose expanded panel is open, shaded to match the panel */\n  trExpandedParent: string;\n  trGroup: string;\n  trEmpty: string;\n  checkbox: string;\n  tbody: string;\n  tbodyLoader: string;\n}\n\n// --- Per-concern context interfaces ---\n\nexport interface DataTableStylingContext {\n  classes: ComputedRef<DataTableClasses>;\n  colspan: ComputedRef<number>;\n  dense: boolean;\n  /** whether the table is currently rendered in its stacked mobile layout */\n  isMobile: ComputedRef<boolean>;\n}\n\nexport interface DataTableColumnsContext<T extends object = any> {\n  columns: ComputedRef<TableColumn<T>[]>;\n  cellValue: (row: T, key: TableColumn<T>['key']) => T[keyof T];\n  itemSlotKeys: Set<string>;\n  /** the column definition attribute used as the visible label (e.g. `label`) */\n  columnAttr: string;\n}\n\nexport interface DataTableSelectionContext<T extends object = any, IdType extends keyof T = keyof T> {\n  selectedData: Ref<T[IdType][] | undefined>;\n  isSelected: (id: T[IdType]) => boolean;\n  isDisabledRow: (id: T[IdType]) => boolean;\n  onSelect: (selected: boolean, id: T[IdType], userAction: boolean) => void;\n  onCheckboxClick: (event: MouseEvent, id: T[IdType], index: number) => void;\n}\n\nexport interface DataTableExpansionContext<T extends object = any, IdType extends keyof T = keyof T> {\n  expandable: ComputedRef<boolean>;\n  isExpanded: (id: T[IdType]) => boolean;\n  onToggleExpand: (row: T) => void;\n}\n\nexport interface DataTableGroupLabel {\n  key: string;\n  /** the grouped column's visible label, or the key when no column defines one */\n  label: string;\n}\n\nexport interface DataTableGroupingContext<T extends object = any> {\n  groupExpandButtonPosition: GroupExpandButtonPosition;\n  groupKey: ComputedRef<string | undefined>;\n  groupLabels: ComputedRef<DataTableGroupLabel[]>;\n  /** the number of rows in the group, across all pages */\n  getGroupSize: (identifier: string) => number;\n  isExpandedGroup: (group: Partial<T>) => boolean;\n  onToggleExpandGroup: (group: Partial<T>, identifier: string) => void;\n  onUngroup: () => void;\n  onCopyGroup: (header: GroupHeader<T>) => void;\n}\n\nexport interface DataTableRowIdentityContext<T extends object = any, IdType extends keyof T = keyof T> {\n  getRowId: (row: T) => T[IdType];\n  itemClass: ((item: T) => string) | string;\n}\n\n// --- Backward-compatible merged type ---\n\nexport type DataTableContext<T extends object = any, IdType extends keyof T = keyof T> =\n  DataTableStylingContext &\n  DataTableColumnsContext<T> &\n  DataTableSelectionContext<T, IdType> &\n  DataTableExpansionContext<T, IdType> &\n  DataTableGroupingContext<T> &\n  DataTableRowIdentityContext<T, IdType>;\n\n// --- Per-concern symbols ---\n\n/*\n * A key cannot carry the row type: the table and its row components are generic\n * components that each name `T` themselves. The keys erase it (the row type and\n * its id key), and each `use*` below names the row type its caller passes.\n */\nconst DATA_TABLE_STYLING: InjectionKey<DataTableStylingContext> = Symbol('data-table-styling');\nconst DATA_TABLE_COLUMNS: InjectionKey<DataTableColumnsContext> = Symbol('data-table-columns');\nconst DATA_TABLE_SELECTION: InjectionKey<DataTableSelectionContext<any, any>> = Symbol('data-table-selection');\nconst DATA_TABLE_EXPANSION: InjectionKey<DataTableExpansionContext<any, any>> = Symbol('data-table-expansion');\nconst DATA_TABLE_GROUPING: InjectionKey<DataTableGroupingContext> = Symbol('data-table-grouping');\nconst DATA_TABLE_ROW_IDENTITY: InjectionKey<DataTableRowIdentityContext<any, any>> = Symbol('data-table-row-identity');\nconst DATA_TABLE_NESTED: InjectionKey<boolean> = Symbol('data-table-nested');\n\n// --- Per-concern provide/use pairs ---\n\nfunction injectOrThrow<C>(key: InjectionKey<C>, name: string): C {\n  const context = inject(key, undefined);\n  if (context === undefined)\n    throw new Error(`${name} must be used within a RuiDataTable`);\n\n  return context;\n}\n\nexport function provideDataTableStyling(context: DataTableStylingContext): void {\n  provide(DATA_TABLE_STYLING, context);\n}\n\nexport function useDataTableStyling(): DataTableStylingContext {\n  return injectOrThrow<DataTableStylingContext>(DATA_TABLE_STYLING, 'useDataTableStyling');\n}\n\nexport function provideDataTableColumns<T extends object>(context: DataTableColumnsContext<T>): void {\n  provide(DATA_TABLE_COLUMNS, context);\n}\n\nexport function useDataTableColumns<T extends object>(): DataTableColumnsContext<T> {\n  return injectOrThrow<DataTableColumnsContext<T>>(DATA_TABLE_COLUMNS, 'useDataTableColumns');\n}\n\nexport function provideDataTableSelection<T extends object, IdType extends keyof T>(context: DataTableSelectionContext<T, IdType>): void {\n  provide(DATA_TABLE_SELECTION, context);\n}\n\nexport function useDataTableSelection<T extends object, IdType extends keyof T = keyof T>(): DataTableSelectionContext<T, IdType> {\n  return injectOrThrow<DataTableSelectionContext<T, IdType>>(DATA_TABLE_SELECTION, 'useDataTableSelection');\n}\n\nexport function provideDataTableExpansion<T extends object, IdType extends keyof T>(context: DataTableExpansionContext<T, IdType>): void {\n  provide(DATA_TABLE_EXPANSION, context);\n}\n\nexport function useDataTableExpansion<T extends object, IdType extends keyof T = keyof T>(): DataTableExpansionContext<T, IdType> {\n  return injectOrThrow<DataTableExpansionContext<T, IdType>>(DATA_TABLE_EXPANSION, 'useDataTableExpansion');\n}\n\nexport function provideDataTableGrouping<T extends object>(context: DataTableGroupingContext<T>): void {\n  provide(DATA_TABLE_GROUPING, context);\n}\n\nexport function useDataTableGrouping<T extends object>(): DataTableGroupingContext<T> {\n  return injectOrThrow<DataTableGroupingContext<T>>(DATA_TABLE_GROUPING, 'useDataTableGrouping');\n}\n\nexport function provideDataTableRowIdentity<T extends object, IdType extends keyof T>(context: DataTableRowIdentityContext<T, IdType>): void {\n  provide(DATA_TABLE_ROW_IDENTITY, context);\n}\n\nexport function useDataTableRowIdentity<T extends object, IdType extends keyof T = keyof T>(): DataTableRowIdentityContext<T, IdType> {\n  return injectOrThrow<DataTableRowIdentityContext<T, IdType>>(DATA_TABLE_ROW_IDENTITY, 'useDataTableRowIdentity');\n}\n\n/** Marks descendant data tables as nested (e.g. rendered inside an expanded row). */\nexport function provideDataTableNested(): void {\n  provide(DATA_TABLE_NESTED, true);\n}\n\n/** True when this data table is rendered inside another data table. */\nexport function useDataTableNested(): boolean {\n  return inject(DATA_TABLE_NESTED, false);\n}\n\n// --- Backward-compatible facade ---\n\nexport function provideDataTableContext<T extends object, IdType extends keyof T>(context: DataTableContext<T, IdType>): void {\n  provideDataTableStyling({ classes: context.classes, colspan: context.colspan, dense: context.dense, isMobile: context.isMobile });\n  provideDataTableColumns<T>({ columns: context.columns, cellValue: context.cellValue, itemSlotKeys: context.itemSlotKeys, columnAttr: context.columnAttr });\n  provideDataTableSelection<T, IdType>({ selectedData: context.selectedData, isSelected: context.isSelected, isDisabledRow: context.isDisabledRow, onSelect: context.onSelect, onCheckboxClick: context.onCheckboxClick });\n  provideDataTableExpansion<T, IdType>({ expandable: context.expandable, isExpanded: context.isExpanded, onToggleExpand: context.onToggleExpand });\n  provideDataTableGrouping<T>({ groupExpandButtonPosition: context.groupExpandButtonPosition, groupKey: context.groupKey, groupLabels: context.groupLabels, getGroupSize: context.getGroupSize, isExpandedGroup: context.isExpandedGroup, onToggleExpandGroup: context.onToggleExpandGroup, onUngroup: context.onUngroup, onCopyGroup: context.onCopyGroup });\n  provideDataTableRowIdentity<T, IdType>({ getRowId: context.getRowId, itemClass: context.itemClass });\n}\n\nexport function useDataTableContext<T extends object, IdType extends keyof T = keyof T>(): DataTableContext<T, IdType> {\n  return {\n    ...useDataTableStyling(),\n    ...useDataTableColumns<T>(),\n    ...useDataTableSelection<T, IdType>(),\n    ...useDataTableExpansion<T, IdType>(),\n    ...useDataTableGrouping<T>(),\n    ...useDataTableRowIdentity<T, IdType>(),\n  };\n}\n"],"mappings":";;AA2FA,IAAM,qBAA4D,OAAO,oBAAoB;AAC7F,IAAM,qBAA4D,OAAO,oBAAoB;AAC7F,IAAM,uBAA0E,OAAO,sBAAsB;AAC7G,IAAM,uBAA0E,OAAO,sBAAsB;AAC7G,IAAM,sBAA8D,OAAO,qBAAqB;AAChG,IAAM,0BAA+E,OAAO,yBAAyB;AACrH,IAAM,oBAA2C,OAAO,mBAAmB;AAI3E,SAAS,cAAiB,KAAsB,MAAiB;CAC/D,MAAM,UAAU,OAAO,KAAK,KAAA,CAAS;CACrC,IAAI,YAAY,KAAA,GACd,MAAM,IAAI,MAAM,GAAG,KAAK,oCAAoC;CAE9D,OAAO;AACT;AAEA,SAAgB,wBAAwB,SAAwC;CAC9E,QAAQ,oBAAoB,OAAO;AACrC;AAEA,SAAgB,sBAA+C;CAC7D,OAAO,cAAuC,oBAAoB,qBAAqB;AACzF;AAEA,SAAgB,wBAA0C,SAA2C;CACnG,QAAQ,oBAAoB,OAAO;AACrC;AAEA,SAAgB,sBAAoE;CAClF,OAAO,cAA0C,oBAAoB,qBAAqB;AAC5F;AAEA,SAAgB,0BAAoE,SAAqD;CACvI,QAAQ,sBAAsB,OAAO;AACvC;AAEA,SAAgB,wBAAkH;CAChI,OAAO,cAAoD,sBAAsB,uBAAuB;AAC1G;AAEA,SAAgB,0BAAoE,SAAqD;CACvI,QAAQ,sBAAsB,OAAO;AACvC;AAEA,SAAgB,wBAAkH;CAChI,OAAO,cAAoD,sBAAsB,uBAAuB;AAC1G;AAEA,SAAgB,yBAA2C,SAA4C;CACrG,QAAQ,qBAAqB,OAAO;AACtC;AAEA,SAAgB,uBAAsE;CACpF,OAAO,cAA2C,qBAAqB,sBAAsB;AAC/F;AAEA,SAAgB,4BAAsE,SAAuD;CAC3I,QAAQ,yBAAyB,OAAO;AAC1C;AAEA,SAAgB,0BAAsH;CACpI,OAAO,cAAsD,yBAAyB,yBAAyB;AACjH;;AAGA,SAAgB,yBAA+B;CAC7C,QAAQ,mBAAmB,IAAI;AACjC;;AAGA,SAAgB,qBAA8B;CAC5C,OAAO,OAAO,mBAAmB,KAAK;AACxC;AAIA,SAAgB,wBAAkE,SAA4C;CAC5H,wBAAwB;EAAE,SAAS,QAAQ;EAAS,SAAS,QAAQ;EAAS,OAAO,QAAQ;EAAO,UAAU,QAAQ;CAAS,CAAC;CAChI,wBAA2B;EAAE,SAAS,QAAQ;EAAS,WAAW,QAAQ;EAAW,cAAc,QAAQ;EAAc,YAAY,QAAQ;CAAW,CAAC;CACzJ,0BAAqC;EAAE,cAAc,QAAQ;EAAc,YAAY,QAAQ;EAAY,eAAe,QAAQ;EAAe,UAAU,QAAQ;EAAU,iBAAiB,QAAQ;CAAgB,CAAC;CACvN,0BAAqC;EAAE,YAAY,QAAQ;EAAY,YAAY,QAAQ;EAAY,gBAAgB,QAAQ;CAAe,CAAC;CAC/I,yBAA4B;EAAE,2BAA2B,QAAQ;EAA2B,UAAU,QAAQ;EAAU,aAAa,QAAQ;EAAa,cAAc,QAAQ;EAAc,iBAAiB,QAAQ;EAAiB,qBAAqB,QAAQ;EAAqB,WAAW,QAAQ;EAAW,aAAa,QAAQ;CAAY,CAAC;CAC1V,4BAAuC;EAAE,UAAU,QAAQ;EAAU,WAAW,QAAQ;CAAU,CAAC;AACrG"}

package/dist/components/tables/table-empty-state-styles.d.ts

@@ -0,0 +1,43 @@
+export declare const emptyStyles: import("tailwind-variants").TVReturnType<{
+    compact: {
+        true: {
+            root: string;
+            title: string;
+        };
+        false: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+    title: string;
+    subtitle: string;
+}, undefined, {
+    compact: {
+        true: {
+            root: string;
+            title: string;
+        };
+        false: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+    title: string;
+    subtitle: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+    compact: {
+        true: {
+            root: string;
+            title: string;
+        };
+        false: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+    title: string;
+    subtitle: string;
+}>>;

package/dist/components/tables/table-empty-state-styles.js

@@ -0,0 +1,20 @@
+import { tv } from "../../utils/tv.js";
+//#region src/components/tables/table-empty-state-styles.ts
+var emptyStyles = tv({
+	slots: {
+		root: "flex flex-col items-center justify-center flex-1",
+		title: "text-body-1 font-semibold text-center text-current pb-0 mb-0",
+		subtitle: "text-body-2 text-center text-rui-text-secondary pb-0 mb-0"
+	},
+	variants: { compact: {
+		true: {
+			root: "gap-1 py-6",
+			title: "font-normal text-rui-text-secondary"
+		},
+		false: { root: "gap-3 min-h-56 my-4" }
+	} }
+});
+//#endregion
+export { emptyStyles };
+
+//# sourceMappingURL=table-empty-state-styles.js.map

package/dist/components/tables/table-empty-state-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-empty-state-styles.js","names":[],"sources":["../../../src/components/tables/table-empty-state-styles.ts"],"sourcesContent":["import { tv } from '@/utils/tv';\n\nexport const emptyStyles = tv({\n  slots: {\n    root: 'flex flex-col items-center justify-center flex-1',\n    title: 'text-body-1 font-semibold text-center text-current pb-0 mb-0',\n    subtitle: 'text-body-2 text-center text-rui-text-secondary pb-0 mb-0',\n  },\n  variants: {\n    compact: {\n      true: {\n        root: 'gap-1 py-6',\n        title: 'font-normal text-rui-text-secondary',\n      },\n      false: {\n        root: 'gap-3 min-h-56 my-4',\n      },\n    },\n  },\n});\n"],"mappings":";;AAEA,IAAa,cAAc,GAAG;CAC5B,OAAO;EACL,MAAM;EACN,OAAO;EACP,UAAU;CACZ;CACA,UAAU,EACR,SAAS;EACP,MAAM;GACJ,MAAM;GACN,OAAO;EACT;EACA,OAAO,EACL,MAAM,sBACR;CACF,EACF;AACF,CAAC"}

package/dist/components/tables/table-error-state-styles.d.ts

@@ -0,0 +1,36 @@
+/**
+ * Centred and capped, like the loading and empty states beside it. Left to
+ * span the table, a wide one puts the reason hard left and the retry hard
+ * right, with the whole width between them.
+ */
+export declare const errorStyles: import("tailwind-variants").TVReturnType<{
+    [key: string]: {
+        [key: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+            alert?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+            alert?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+    alert: string;
+}, undefined, {
+    [key: string]: {
+        [key: string]: import("tailwind-variants").ClassValue | {
+            root?: import("tailwind-variants").ClassValue;
+            alert?: import("tailwind-variants").ClassValue;
+        };
+    };
+} | {}, {
+    root: string;
+    alert: string;
+}, import("tailwind-variants").TVReturnTypeLike<unknown, {
+    root: string;
+    alert: string;
+}>>;

package/dist/components/tables/table-error-state-styles.js

@@ -0,0 +1,15 @@
+import { tv } from "../../utils/tv.js";
+//#region src/components/tables/table-error-state-styles.ts
+/**
+* Centred and capped, like the loading and empty states beside it. Left to
+* span the table, a wide one puts the reason hard left and the retry hard
+* right, with the whole width between them.
+*/
+var errorStyles = tv({ slots: {
+	root: "flex justify-center p-4",
+	alert: "w-full max-w-2xl"
+} });
+//#endregion
+export { errorStyles };
+
+//# sourceMappingURL=table-error-state-styles.js.map

package/dist/components/tables/table-error-state-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-error-state-styles.js","names":[],"sources":["../../../src/components/tables/table-error-state-styles.ts"],"sourcesContent":["import { tv } from '@/utils/tv';\n\n/**\n * Centred and capped, like the loading and empty states beside it. Left to\n * span the table, a wide one puts the reason hard left and the retry hard\n * right, with the whole width between them.\n */\nexport const errorStyles = tv({\n  slots: {\n    root: 'flex justify-center p-4',\n    alert: 'w-full max-w-2xl',\n  },\n});\n"],"mappings":";;;;;;;AAOA,IAAa,cAAc,GAAG,EAC5B,OAAO;CACL,MAAM;CACN,OAAO;AACT,EACF,CAAC"}

package/dist/components/tables/table-head-styles.d.ts

@@ -0,0 +1,91 @@
+export declare const tableHeadStyles: import("tailwind-variants").TVReturnType<{
+    position: {
+        default: {};
+        sticky: {
+            thead: string;
+        };
+        fixed: {
+            thead: string;
+            th: string;
+        };
+    };
+    dense: {
+        true: {
+            th: string;
+        };
+        false: {
+            th: string;
+        };
+    };
+}, {
+    thead: string;
+    checkbox: string;
+    th: string;
+    columnText: string;
+    sortButton: string;
+    sortIcon: string;
+    sortPosition: string;
+    loaderRow: string;
+    progress: string;
+    progressWrapper: string;
+}, undefined, {
+    position: {
+        default: {};
+        sticky: {
+            thead: string;
+        };
+        fixed: {
+            thead: string;
+            th: string;
+        };
+    };
+    dense: {
+        true: {
+            th: string;
+        };
+        false: {
+            th: string;
+        };
+    };
+}, {
+    thead: string;
+    checkbox: string;
+    th: string;
+    columnText: string;
+    sortButton: string;
+    sortIcon: string;
+    sortPosition: string;
+    loaderRow: string;
+    progress: string;
+    progressWrapper: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+    position: {
+        default: {};
+        sticky: {
+            thead: string;
+        };
+        fixed: {
+            thead: string;
+            th: string;
+        };
+    };
+    dense: {
+        true: {
+            th: string;
+        };
+        false: {
+            th: string;
+        };
+    };
+}, {
+    thead: string;
+    checkbox: string;
+    th: string;
+    columnText: string;
+    sortButton: string;
+    sortIcon: string;
+    sortPosition: string;
+    loaderRow: string;
+    progress: string;
+    progressWrapper: string;
+}>>;

package/dist/components/tables/table-head-styles.js

@@ -0,0 +1,39 @@
+import { tv } from "../../utils/tv.js";
+import { NESTED_BAR } from "./data-table-styles.js";
+//#region src/components/tables/table-head-styles.ts
+var tableHeadStyles = tv({
+	slots: {
+		thead: "between:border-t between:border-b-0 between:border-rui-divider",
+		checkbox: `px-2 w-14.5 max-w-14.5 [&_label]:ml-0 bg-rui-surface-muted ${NESTED_BAR}`,
+		th: `[:where(&)]:px-4 bg-rui-surface-muted ${NESTED_BAR}`,
+		columnText: "text-rui-text-secondary font-medium text-[0.8125rem] leading-5",
+		sortButton: "inline-flex group/sort -mx-1.5",
+		sortIcon: "transition opacity-75 group-hover/sort:opacity-100 group-focus-visible/sort:opacity-100",
+		sortPosition: "text-[0.6875rem] leading-none font-semibold tabular-nums text-rui-text-secondary",
+		loaderRow: "border-none",
+		progress: "p-0 h-0",
+		progressWrapper: "h-0 -mt-1"
+	},
+	variants: {
+		position: {
+			default: {},
+			sticky: { thead: "top-0 z-rui-raised absolute" },
+			fixed: {
+				thead: "top-0 z-rui-raised fixed",
+				th: "border-b border-b-rui-divider"
+			}
+		},
+		dense: {
+			true: { th: "[:where(&)]:py-0.5 [:where(&)]:h-8" },
+			false: { th: "[:where(&)]:py-1 [:where(&)]:h-10" }
+		}
+	},
+	defaultVariants: {
+		position: "default",
+		dense: false
+	}
+});
+//#endregion
+export { tableHeadStyles };
+
+//# sourceMappingURL=table-head-styles.js.map

package/dist/components/tables/table-head-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-head-styles.js","names":[],"sources":["../../../src/components/tables/table-head-styles.ts"],"sourcesContent":["import { NESTED_BAR } from '@/components/tables/data-table-styles';\nimport { tv } from '@/utils/tv';\n\nexport const tableHeadStyles = tv({\n  slots: {\n    thead: 'between:border-t between:border-b-0 between:border-rui-divider',\n    checkbox: `px-2 w-14.5 max-w-14.5 [&_label]:ml-0 bg-rui-surface-muted ${NESTED_BAR}`,\n    // tinted like the pagination bar, framing the body; opaque, so rows scroll behind a stuck header\n    th: `[:where(&)]:px-4 bg-rui-surface-muted ${NESTED_BAR}`,\n    // labels read as secondary to the data; the sorted column's label steps up to primary\n    columnText: 'text-rui-text-secondary font-medium text-[0.8125rem] leading-5',\n    // the negative margin cancels the button's own padding so the label lines up with the cells below\n    sortButton: 'inline-flex group/sort -mx-1.5',\n    // a resting icon marks sortable columns for keyboard and touch users, at 3:1 on a nested table's darker header\n    sortIcon: 'transition opacity-75 group-hover/sort:opacity-100 group-focus-visible/sort:opacity-100',\n    // tucked against the arrow, closer than the button's gap\n    sortPosition: 'text-[0.6875rem] leading-none font-semibold tabular-nums text-rui-text-secondary',\n    /*\n     * The row is always there and only its bar comes and goes: a collapsed-border table gives even a\n     * zero-height row half a pixel, so adding the row on load pushed the body down.\n     */\n    loaderRow: 'border-none',\n    progress: 'p-0 h-0',\n    progressWrapper: 'h-0 -mt-1',\n  },\n  variants: {\n    position: {\n      default: {},\n      sticky: { thead: 'top-0 z-rui-raised absolute' },\n      fixed: {\n        thead: 'top-0 z-rui-raised fixed',\n        th: 'border-b border-b-rui-divider',\n      },\n    },\n    // a fixed height evens out rows with and without sort buttons; `:where()` lets a column's `class` win\n    dense: {\n      true: { th: '[:where(&)]:py-0.5 [:where(&)]:h-8' },\n      false: { th: '[:where(&)]:py-1 [:where(&)]:h-10' },\n    },\n  },\n  defaultVariants: {\n    position: 'default',\n    dense: false,\n  },\n});\n"],"mappings":";;;AAGA,IAAa,kBAAkB,GAAG;CAChC,OAAO;EACL,OAAO;EACP,UAAU,8DAA8D;EAExE,IAAI,yCAAyC;EAE7C,YAAY;EAEZ,YAAY;EAEZ,UAAU;EAEV,cAAc;EAKd,WAAW;EACX,UAAU;EACV,iBAAiB;CACnB;CACA,UAAU;EACR,UAAU;GACR,SAAS,CAAC;GACV,QAAQ,EAAE,OAAO,8BAA8B;GAC/C,OAAO;IACL,OAAO;IACP,IAAI;GACN;EACF;EAEA,OAAO;GACL,MAAM,EAAE,IAAI,qCAAqC;GACjD,OAAO,EAAE,IAAI,oCAAoC;EACnD;CACF;CACA,iBAAiB;EACf,UAAU;EACV,OAAO;CACT;AACF,CAAC"}

package/dist/components/tables/table-loading-state-styles.d.ts

@@ -0,0 +1,34 @@
+export declare const loadingStyles: import("tailwind-variants").TVReturnType<{
+    compact: {
+        true: {
+            root: string;
+        };
+        false: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+}, undefined, {
+    compact: {
+        true: {
+            root: string;
+        };
+        false: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+}, import("tailwind-variants").TVReturnTypeLike<{
+    compact: {
+        true: {
+            root: string;
+        };
+        false: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+}>>;

package/dist/components/tables/table-loading-state-styles.js

@@ -0,0 +1,13 @@
+import { tv } from "../../utils/tv.js";
+//#region src/components/tables/table-loading-state-styles.ts
+var loadingStyles = tv({
+	slots: { root: "flex items-center justify-center" },
+	variants: { compact: {
+		true: { root: "py-6" },
+		false: { root: "min-h-56 py-8" }
+	} }
+});
+//#endregion
+export { loadingStyles };
+
+//# sourceMappingURL=table-loading-state-styles.js.map

package/dist/components/tables/table-loading-state-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-loading-state-styles.js","names":[],"sources":["../../../src/components/tables/table-loading-state-styles.ts"],"sourcesContent":["import { tv } from '@/utils/tv';\n\nexport const loadingStyles = tv({\n  slots: {\n    root: 'flex items-center justify-center',\n  },\n  variants: {\n    compact: {\n      true: { root: 'py-6' },\n      false: { root: 'min-h-56 py-8' },\n    },\n  },\n});\n"],"mappings":";;AAEA,IAAa,gBAAgB,GAAG;CAC9B,OAAO,EACL,MAAM,mCACR;CACA,UAAU,EACR,SAAS;EACP,MAAM,EAAE,MAAM,OAAO;EACrB,OAAO,EAAE,MAAM,gBAAgB;CACjC,EACF;AACF,CAAC"}