@rotki/ui-library 3.0.0-beta.3 → 3.0.0-beta.5

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

@@ -73,16 +73,24 @@ var RuiDataTableBody_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 						key: `row-${unref(getRowId)(row)}`,
 						row,
 						index
-					}, createSlots({ _: 2 }, [renderList(unref(itemSlotKeys), (key) => {
-						return {
-							name: `item.${key}`,
-							fn: withCtx((slotData) => [renderSlot(_ctx.$slots, `item.${key}`, mergeProps({ ref_for: true }, slotData))])
-						};
-					}), _ctx.$slots["expanded-item"] ? {
-						name: "expanded-item",
-						fn: withCtx((slotData) => [renderSlot(_ctx.$slots, "expanded-item", mergeProps({ ref_for: true }, slotData))]),
-						key: "0"
-					} : void 0]), 1032, ["row", "index"]))], 64);
+					}, createSlots({ _: 2 }, [
+						renderList(unref(itemSlotKeys), (key) => {
+							return {
+								name: `item.${key}`,
+								fn: withCtx((slotData) => [renderSlot(_ctx.$slots, `item.${key}`, mergeProps({ ref_for: true }, slotData))])
+							};
+						}),
+						_ctx.$slots["expanded-item"] ? {
+							name: "expanded-item",
+							fn: withCtx((slotData) => [renderSlot(_ctx.$slots, "expanded-item", mergeProps({ ref_for: true }, slotData))]),
+							key: "0"
+						} : void 0,
+						_ctx.$slots["row-append"] ? {
+							name: "row-append",
+							fn: withCtx((slotData) => [renderSlot(_ctx.$slots, "row-append", mergeProps({ ref_for: true }, slotData))]),
+							key: "1"
+						} : void 0
+					]), 1032, ["row", "index"]))], 64);
 				}), 256)),
 				__props.loading && __props.noData ? (openBlock(), createBlock(RuiDataTableLoadingRow_default, { key: 2 })) : createCommentVNode("", true),
 				__props.noData && __props.empty && !__props.loading && !unref(showError) ? (openBlock(), createBlock(RuiDataTableEmptyRow_default, {

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableBody.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../src/components/tables/data-table/RuiDataTableBody.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { TableColumn } from '@/components/tables/RuiTableHead.vue';\nimport { useDataTableColumns, useDataTableRowIdentity, useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiDataTableEmptyRow from '@/components/tables/data-table/RuiDataTableEmptyRow.vue';\nimport RuiDataTableErrorRow from '@/components/tables/data-table/RuiDataTableErrorRow.vue';\nimport RuiDataTableGroupRow from '@/components/tables/data-table/RuiDataTableGroupRow.vue';\nimport RuiDataTableLoadingRow from '@/components/tables/data-table/RuiDataTableLoadingRow.vue';\nimport RuiDataTableRow from '@/components/tables/data-table/RuiDataTableRow.vue';\nimport { type GroupHeader, isRow } from '@/composables/tables/data-table/types';\n\nconst { error, loading, noData } = defineProps<{\n  filtered: (T | GroupHeader<T>)[];\n  loading: boolean;\n  noData: boolean;\n  empty: { label?: string; description?: string };\n  error: string;\n  errorTitle: string;\n  retryText: string;\n}>();\n\nconst emit = defineEmits<{\n  retry: [];\n}>();\n\ndefineSlots<Partial<\n  Record<`item.${string}`, (props: { column: TableColumn<T>; row: T; index: number }) => any> & {\n    'body.prepend'?: (props: { colspan: number }) => any;\n    'body.append'?: (props: { colspan: number }) => any;\n    'group.header'?: (props: {\n      colspan: number;\n      header: GroupHeader<T>;\n      isOpen: boolean;\n      toggle: () => void;\n    }) => any;\n    'group.header.content'?: (props: { header: GroupHeader<T>; groupKey: string }) => any;\n    'expanded-item'?: (props: { row: T; index: number }) => any;\n    'no-data'?: () => any;\n    'empty-description'?: () => any;\n    'error'?: () => any;\n  }\n>>();\n\nconst { classes, colspan } = useDataTableStyling();\nconst { itemSlotKeys } = useDataTableColumns<T>();\nconst { getRowId } = useDataTableRowIdentity<T>();\n\n/**\n * Loading outranks a failure, which outranks the empty state: rows that did\n * not arrive are not rows that are not there. Rows kept from an earlier read\n * stay below the error.\n */\nconst showError = computed<boolean>(() => !!error && !loading);\n\n/**\n * Rows shown while a read is in flight are the previous result, so they dim\n * until it lands. An empty table shows its loading row instead, undimmed.\n */\nconst stale = computed<boolean>(() => loading && !noData);\n</script>\n\n<template>\n  <tbody\n    class=\"transition-opacity duration-150\"\n    :class=\"[classes.tbody, { 'opacity-50': stale }]\"\n    :data-stale=\"stale || undefined\"\n  >\n    <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n    <slot\n      v-if=\"$slots['body.prepend']\"\n      :colspan=\"colspan\"\n      name=\"body.prepend\"\n    />\n    <RuiDataTableErrorRow\n      v-if=\"showError\"\n      :message=\"error\"\n      :title=\"errorTitle\"\n      :retry-text=\"retryText\"\n      @retry=\"emit('retry')\"\n    >\n      <template\n        v-if=\"$slots.error\"\n        #error\n      >\n        <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n        <slot name=\"error\" />\n      </template>\n    </RuiDataTableErrorRow>\n    <template v-for=\"(row, index) in filtered\">\n      <RuiDataTableGroupRow\n        v-if=\"!isRow(row)\"\n        :key=\"`group-${row.identifier}`\"\n        :row=\"row\"\n      >\n        <template\n          v-if=\"$slots['group.header']\"\n          #group.header=\"slotData\"\n        >\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            name=\"group.header\"\n            v-bind=\"slotData\"\n          />\n        </template>\n        <template\n          v-if=\"$slots['group.header.content']\"\n          #group.header.content=\"slotData\"\n        >\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            name=\"group.header.content\"\n            v-bind=\"slotData\"\n          />\n        </template>\n      </RuiDataTableGroupRow>\n      <RuiDataTableRow\n        v-else\n        :key=\"`row-${getRowId(row)}`\"\n        :row=\"row\"\n        :index=\"index\"\n      >\n        <template\n          v-for=\"key in itemSlotKeys\"\n          #[`item.${key}`]=\"slotData\"\n        >\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            :name=\"`item.${key}`\"\n            v-bind=\"slotData\"\n          />\n        </template>\n        <template\n          v-if=\"$slots['expanded-item']\"\n          #expanded-item=\"slotData\"\n        >\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            name=\"expanded-item\"\n            v-bind=\"slotData\"\n          />\n        </template>\n      </RuiDataTableRow>\n    </template>\n    <RuiDataTableLoadingRow v-if=\"loading && noData\" />\n    <RuiDataTableEmptyRow\n      v-if=\"noData && empty && !loading && !showError\"\n      :empty=\"empty\"\n    >\n      <template\n        v-if=\"$slots['no-data']\"\n        #no-data\n      >\n        <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n        <slot name=\"no-data\" />\n      </template>\n      <template\n        v-if=\"$slots['empty-description']\"\n        #empty-description\n      >\n        <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n        <slot name=\"empty-description\" />\n      </template>\n    </RuiDataTableEmptyRow>\n    <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n    <slot\n      v-if=\"$slots['body.append']\"\n      :colspan=\"colspan\"\n      name=\"body.append\"\n    />\n  </tbody>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"RuiDataTableBody.vue_vue_type_script_setup_true_lang.js","names":["$slots","_openBlock","_createElementBlock","_normalizeClass","_unref","_renderSlot","_createCommentVNode","_createBlock","RuiDataTableErrorRow","_createSlots","_withCtx","_Fragment","_renderList","RuiDataTableGroupRow","_mergeProps","RuiDataTableRow","RuiDataTableLoadingRow","RuiDataTableEmptyRow"],"sources":["../../../../src/components/tables/data-table/RuiDataTableBody.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { TableColumn } from '@/components/tables/RuiTableHead.vue';\nimport { useDataTableColumns, useDataTableRowIdentity, useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiDataTableEmptyRow from '@/components/tables/data-table/RuiDataTableEmptyRow.vue';\nimport RuiDataTableErrorRow from '@/components/tables/data-table/RuiDataTableErrorRow.vue';\nimport RuiDataTableGroupRow from '@/components/tables/data-table/RuiDataTableGroupRow.vue';\nimport RuiDataTableLoadingRow from '@/components/tables/data-table/RuiDataTableLoadingRow.vue';\nimport RuiDataTableRow from '@/components/tables/data-table/RuiDataTableRow.vue';\nimport { type GroupHeader, isRow } from '@/composables/tables/data-table/types';\n\nconst { error, loading, noData } = defineProps<{\n  filtered: (T | GroupHeader<T>)[];\n  loading: boolean;\n  noData: boolean;\n  empty: { label?: string; description?: string };\n  error: string;\n  errorTitle: string;\n  retryText: string;\n}>();\n\nconst emit = defineEmits<{\n  retry: [];\n}>();\n\ndefineSlots<Partial<\n  Record<`item.${string}`, (props: { column: TableColumn<T>; row: T; index: number }) => any> & {\n    'body.prepend'?: (props: { colspan: number }) => any;\n    'body.append'?: (props: { colspan: number }) => any;\n    'group.header'?: (props: {\n      colspan: number;\n      header: GroupHeader<T>;\n      isOpen: boolean;\n      toggle: () => void;\n    }) => any;\n    'group.header.content'?: (props: { header: GroupHeader<T>; groupKey: string }) => any;\n    'expanded-item'?: (props: { row: T; index: number }) => any;\n    'row-append'?: (props: { row: T; index: number }) => any;\n    'no-data'?: () => any;\n    'empty-description'?: () => any;\n    'error'?: () => any;\n  }\n>>();\n\nconst { classes, colspan } = useDataTableStyling();\nconst { itemSlotKeys } = useDataTableColumns<T>();\nconst { getRowId } = useDataTableRowIdentity<T>();\n\n/**\n * Loading outranks a failure, which outranks the empty state: rows that did\n * not arrive are not rows that are not there. Rows kept from an earlier read\n * stay below the error.\n */\nconst showError = computed<boolean>(() => !!error && !loading);\n\n/**\n * Rows shown while a read is in flight are the previous result, so they dim\n * until it lands. An empty table shows its loading row instead, undimmed.\n */\nconst stale = computed<boolean>(() => loading && !noData);\n</script>\n\n<template>\n  <tbody\n    class=\"transition-opacity duration-150\"\n    :class=\"[classes.tbody, { 'opacity-50': stale }]\"\n    :data-stale=\"stale || undefined\"\n  >\n    <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n    <slot\n      v-if=\"$slots['body.prepend']\"\n      :colspan=\"colspan\"\n      name=\"body.prepend\"\n    />\n    <RuiDataTableErrorRow\n      v-if=\"showError\"\n      :message=\"error\"\n      :title=\"errorTitle\"\n      :retry-text=\"retryText\"\n      @retry=\"emit('retry')\"\n    >\n      <template\n        v-if=\"$slots.error\"\n        #error\n      >\n        <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n        <slot name=\"error\" />\n      </template>\n    </RuiDataTableErrorRow>\n    <template v-for=\"(row, index) in filtered\">\n      <RuiDataTableGroupRow\n        v-if=\"!isRow(row)\"\n        :key=\"`group-${row.identifier}`\"\n        :row=\"row\"\n      >\n        <template\n          v-if=\"$slots['group.header']\"\n          #group.header=\"slotData\"\n        >\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            name=\"group.header\"\n            v-bind=\"slotData\"\n          />\n        </template>\n        <template\n          v-if=\"$slots['group.header.content']\"\n          #group.header.content=\"slotData\"\n        >\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            name=\"group.header.content\"\n            v-bind=\"slotData\"\n          />\n        </template>\n      </RuiDataTableGroupRow>\n      <RuiDataTableRow\n        v-else\n        :key=\"`row-${getRowId(row)}`\"\n        :row=\"row\"\n        :index=\"index\"\n      >\n        <template\n          v-for=\"key in itemSlotKeys\"\n          #[`item.${key}`]=\"slotData\"\n        >\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            :name=\"`item.${key}`\"\n            v-bind=\"slotData\"\n          />\n        </template>\n        <template\n          v-if=\"$slots['expanded-item']\"\n          #expanded-item=\"slotData\"\n        >\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            name=\"expanded-item\"\n            v-bind=\"slotData\"\n          />\n        </template>\n        <template\n          v-if=\"$slots['row-append']\"\n          #row-append=\"slotData\"\n        >\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            name=\"row-append\"\n            v-bind=\"slotData\"\n          />\n        </template>\n      </RuiDataTableRow>\n    </template>\n    <RuiDataTableLoadingRow v-if=\"loading && noData\" />\n    <RuiDataTableEmptyRow\n      v-if=\"noData && empty && !loading && !showError\"\n      :empty=\"empty\"\n    >\n      <template\n        v-if=\"$slots['no-data']\"\n        #no-data\n      >\n        <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n        <slot name=\"no-data\" />\n      </template>\n      <template\n        v-if=\"$slots['empty-description']\"\n        #empty-description\n      >\n        <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n        <slot name=\"empty-description\" />\n      </template>\n    </RuiDataTableEmptyRow>\n    <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n    <slot\n      v-if=\"$slots['body.append']\"\n      :colspan=\"colspan\"\n      name=\"body.append\"\n    />\n  </tbody>\n</template>\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableCell.js","names":[],"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';\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":""}

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

@@ -1,4 +1,4 @@
-import type { TableColumn } from '../RuiTableHead.vue';
+import type { TableColumn } from '../RuiTableHead.vue.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<{
         column: TableColumn<T>;

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":[],"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,OAAA,UAAA,GAAA,mBAwCK,MAAA;IAvCF,OAAK,eAAA;KAAU,QAAA,OAAO;KAAe,QAAA,OAAO;KAAiB,MAAA,QAAA,IAAQ,sDAAA;;IAKrE,SAAS,QAAA,OAAO,WAAO;IACvB,SAAS,QAAA,OAAO,WAAO;GAGhB,GAAA,CAAA,MAAA,eAAA,KADR,UAAA,GAAA,mBAOO,QAPP,YAOO,gBADF,MAAA,WAAA,CAAW,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAEhB,mBAsBM,OAAA,EAtBA,OAAK,eAAE,MAAA,QAAA,IAAQ,oBAAA,UAAA,EAAA,GAAA,CACnB,WAoBO,KAAA,QAAA,WAAA;IAnBJ,QAAQ,QAAA;IACR,KAAK,QAAA;IACL,OAAO,QAAA;GAHV,SAoBO,CAdG,QAAA,OAAO,QAAG,YAAA,CAAkB,MAAA,gBAAA,KADpC,UAAA,GAAA,YAIE,yBAAA;;IAFC,UAAU,QAAA,UAAU,KAAA,KAAa,MAAA,UAAA,CAAU,CAAC,QAAA,KAAK;IACjD,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAA,cAAA,CAAc,CAAC,QAAA,GAAG;GAGf,GAAA,MAAA,GAAA,CAAA,UAAA,CAAA,KAAA,MAAA,qBAAA,KADb,UAAA,GAAA,mBAMO,QANP,YAIC,KAED,KACqB,QAAA,OAAO,QAAG,YAA/B,UAAA,GAAA,mBAEW,UAAA,EAAA,KAAA,EAAA,GAAA,CADN,gBAAA,gBAAA,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';\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"}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableEmptyRow.js","names":[],"sources":["../../../../src/components/tables/data-table/RuiDataTableEmptyRow.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiTableEmptyState from '@/components/tables/RuiTableEmptyState.vue';\n\ndefineProps<{\n  empty: { label?: string; description?: string };\n}>();\n\ndefineSlots<{\n  'no-data'?: () => any;\n  'empty-description'?: () => any;\n}>();\n\nconst { classes, colspan } = useDataTableStyling();\n</script>\n\n<template>\n  <tr\n    :class=\"classes.trEmpty\"\n    data-id=\"row-empty\"\n  >\n    <Transition\n      appear\n      enter-active-class=\"transition ease-out duration-200 delay-200\"\n      enter-from-class=\"opacity-0 translate-y-1\"\n      enter-to-class=\"opacity-100 translate-y-0\"\n      leave-active-class=\"transition ease-in duration-150\"\n      leave-from-class=\"opacity-100 translate-y-0\"\n      leave-to-class=\"opacity-0 translate-y-1\"\n    >\n      <td\n        :class=\"classes.td\"\n        :colspan=\"colspan\"\n      >\n        <slot name=\"no-data\">\n          <RuiTableEmptyState\n            :label=\"empty.label\"\n            :description=\"empty.description\"\n          >\n            <template\n              v-if=\"$slots['empty-description']\"\n              #description\n            >\n              <slot name=\"empty-description\" />\n            </template>\n          </RuiTableEmptyState>\n        </slot>\n      </td>\n    </Transition>\n  </tr>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiDataTableEmptyRow.js","names":["_sfc_main"],"sources":["../../../../src/components/tables/data-table/RuiDataTableEmptyRow.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiTableEmptyState from '@/components/tables/RuiTableEmptyState.vue';\n\ndefineProps<{\n  empty: { label?: string; description?: string };\n}>();\n\ndefineSlots<{\n  'no-data'?: () => any;\n  'empty-description'?: () => any;\n}>();\n\nconst { classes, colspan } = useDataTableStyling();\n</script>\n\n<template>\n  <tr\n    :class=\"classes.trEmpty\"\n    data-id=\"row-empty\"\n  >\n    <Transition\n      appear\n      enter-active-class=\"transition ease-out duration-200 delay-200\"\n      enter-from-class=\"opacity-0 translate-y-1\"\n      enter-to-class=\"opacity-100 translate-y-0\"\n      leave-active-class=\"transition ease-in duration-150\"\n      leave-from-class=\"opacity-100 translate-y-0\"\n      leave-to-class=\"opacity-0 translate-y-1\"\n    >\n      <td\n        :class=\"classes.td\"\n        :colspan=\"colspan\"\n      >\n        <slot name=\"no-data\">\n          <RuiTableEmptyState\n            :label=\"empty.label\"\n            :description=\"empty.description\"\n          >\n            <template\n              v-if=\"$slots['empty-description']\"\n              #description\n            >\n              <slot name=\"empty-description\" />\n            </template>\n          </RuiTableEmptyState>\n        </slot>\n      </td>\n    </Transition>\n  </tr>\n</template>\n"],"mappings":""}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableEmptyRow.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../../src/components/tables/data-table/RuiDataTableEmptyRow.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiTableEmptyState from '@/components/tables/RuiTableEmptyState.vue';\n\ndefineProps<{\n  empty: { label?: string; description?: string };\n}>();\n\ndefineSlots<{\n  'no-data'?: () => any;\n  'empty-description'?: () => any;\n}>();\n\nconst { classes, colspan } = useDataTableStyling();\n</script>\n\n<template>\n  <tr\n    :class=\"classes.trEmpty\"\n    data-id=\"row-empty\"\n  >\n    <Transition\n      appear\n      enter-active-class=\"transition ease-out duration-200 delay-200\"\n      enter-from-class=\"opacity-0 translate-y-1\"\n      enter-to-class=\"opacity-100 translate-y-0\"\n      leave-active-class=\"transition ease-in duration-150\"\n      leave-from-class=\"opacity-100 translate-y-0\"\n      leave-to-class=\"opacity-0 translate-y-1\"\n    >\n      <td\n        :class=\"classes.td\"\n        :colspan=\"colspan\"\n      >\n        <slot name=\"no-data\">\n          <RuiTableEmptyState\n            :label=\"empty.label\"\n            :description=\"empty.description\"\n          >\n            <template\n              v-if=\"$slots['empty-description']\"\n              #description\n            >\n              <slot name=\"empty-description\" />\n            </template>\n          </RuiTableEmptyState>\n        </slot>\n      </td>\n    </Transition>\n  </tr>\n</template>\n"],"mappings":";;;;;;;;;EAaA,MAAM,EAAE,SAAS,YAAY,oBAAoB;;GAI/C,OAAA,UAAA,GAAA,mBAgCK,MAAA;IA/BF,OAAK,eAAE,MAAA,OAAA,CAAO,CAAC,OAAO;IACvB,WAAQ;GAER,GAAA,CAAA,YA2Ba,YAAA;IA1BX,QAAA;IACA,sBAAmB;IACnB,oBAAiB;IACjB,kBAAe;IACf,sBAAmB;IACnB,oBAAiB;IACjB,kBAAe;;IAEf,SAAA,cAiBK,CAjBL,mBAiBK,MAAA;KAhBF,OAAK,eAAE,MAAA,OAAA,CAAO,CAAC,EAAE;KACjB,SAAS,MAAA,OAAA;IAEV,GAAA,CAAA,WAYO,KAAA,QAAA,WAAA,CAAA,SAAA,CAXL,YAUqB,4BAAA;KATlB,OAAO,QAAA,MAAM;KACb,aAAa,QAAA,MAAM;IAGZA,GAAAA,YAAAA,EAAAA,GAAAA,EAAAA,GAAAA,CAAAA,KAAAA,OAAM,uBAAA;KACX,MAAA;KAED,IAAA,cAAiC,CAAjC,WAAiC,KAAA,QAAA,mBAAA,CAAA,CAAA"}
+{"version":3,"file":"RuiDataTableEmptyRow.vue_vue_type_script_setup_true_lang.js","names":["$slots","_openBlock","_createElementBlock","_normalizeClass","_unref","_createVNode","_Transition","_withCtx","_createElementVNode","_renderSlot","RuiTableEmptyState","_createSlots"],"sources":["../../../../src/components/tables/data-table/RuiDataTableEmptyRow.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiTableEmptyState from '@/components/tables/RuiTableEmptyState.vue';\n\ndefineProps<{\n  empty: { label?: string; description?: string };\n}>();\n\ndefineSlots<{\n  'no-data'?: () => any;\n  'empty-description'?: () => any;\n}>();\n\nconst { classes, colspan } = useDataTableStyling();\n</script>\n\n<template>\n  <tr\n    :class=\"classes.trEmpty\"\n    data-id=\"row-empty\"\n  >\n    <Transition\n      appear\n      enter-active-class=\"transition ease-out duration-200 delay-200\"\n      enter-from-class=\"opacity-0 translate-y-1\"\n      enter-to-class=\"opacity-100 translate-y-0\"\n      leave-active-class=\"transition ease-in duration-150\"\n      leave-from-class=\"opacity-100 translate-y-0\"\n      leave-to-class=\"opacity-0 translate-y-1\"\n    >\n      <td\n        :class=\"classes.td\"\n        :colspan=\"colspan\"\n      >\n        <slot name=\"no-data\">\n          <RuiTableEmptyState\n            :label=\"empty.label\"\n            :description=\"empty.description\"\n          >\n            <template\n              v-if=\"$slots['empty-description']\"\n              #description\n            >\n              <slot name=\"empty-description\" />\n            </template>\n          </RuiTableEmptyState>\n        </slot>\n      </td>\n    </Transition>\n  </tr>\n</template>\n"],"mappings":";;;;;;;;;EAaA,MAAM,EAAE,SAAS,YAAY,oBAAoB;;GAI/C,OAAAC,UAAA,GAAAC,mBAgCK,MAAA;IA/BF,OAAKC,eAAEC,MAAA,OAAA,CAAO,CAAC,OAAO;IACvB,WAAQ;GAERC,GAAAA,CAAAA,YA2BaC,YAAA;IA1BX,QAAA;IACA,sBAAmB;IACnB,oBAAiB;IACjB,kBAAe;IACf,sBAAmB;IACnB,oBAAiB;IACjB,kBAAe;;IAEf,SAAAC,cAiBK,CAjBLC,mBAiBK,MAAA;KAhBF,OAAKL,eAAEC,MAAA,OAAA,CAAO,CAAC,EAAE;KACjB,SAASA,MAAA,OAAA;IAEVK,GAAAA,CAAAA,WAYO,KAAA,QAAA,WAAA,CAAA,SAAA,CAXLJ,YAUqBK,4BAAA;KATlB,OAAO,QAAA,MAAM;KACb,aAAa,QAAA,MAAM;IAGZV,GAAAA,YAAAA,EAAAA,GAAAA,EAAAA,GAAAA,CAAAA,KAAAA,OAAM,uBAAA;KACX,MAAA;KAED,IAAAO,cAAiC,CAAjCE,WAAiC,KAAA,QAAA,mBAAA,CAAA,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableErrorRow.js","names":[],"sources":["../../../../src/components/tables/data-table/RuiDataTableErrorRow.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiTableErrorState from '@/components/tables/RuiTableErrorState.vue';\n\ndefineProps<{\n  message: string;\n  title: string;\n  retryText: string;\n}>();\n\nconst emit = defineEmits<{\n  retry: [];\n}>();\n\ndefineSlots<{\n  error?: () => any;\n}>();\n\nconst { classes, colspan } = useDataTableStyling();\n</script>\n\n<template>\n  <tr\n    :class=\"classes.trEmpty\"\n    data-id=\"row-error\"\n  >\n    <td\n      :class=\"classes.td\"\n      :colspan=\"colspan\"\n    >\n      <slot name=\"error\">\n        <RuiTableErrorState\n          :action-text=\"retryText\"\n          :message=\"message\"\n          :title=\"title\"\n          @action=\"emit('retry')\"\n        />\n      </slot>\n    </td>\n  </tr>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiDataTableErrorRow.js","names":["_sfc_main"],"sources":["../../../../src/components/tables/data-table/RuiDataTableErrorRow.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiTableErrorState from '@/components/tables/RuiTableErrorState.vue';\n\ndefineProps<{\n  message: string;\n  title: string;\n  retryText: string;\n}>();\n\nconst emit = defineEmits<{\n  retry: [];\n}>();\n\ndefineSlots<{\n  error?: () => any;\n}>();\n\nconst { classes, colspan } = useDataTableStyling();\n</script>\n\n<template>\n  <tr\n    :class=\"classes.trEmpty\"\n    data-id=\"row-error\"\n  >\n    <td\n      :class=\"classes.td\"\n      :colspan=\"colspan\"\n    >\n      <slot name=\"error\">\n        <RuiTableErrorState\n          :action-text=\"retryText\"\n          :message=\"message\"\n          :title=\"title\"\n          @action=\"emit('retry')\"\n        />\n      </slot>\n    </td>\n  </tr>\n</template>\n"],"mappings":""}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableErrorRow.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../src/components/tables/data-table/RuiDataTableErrorRow.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiTableErrorState from '@/components/tables/RuiTableErrorState.vue';\n\ndefineProps<{\n  message: string;\n  title: string;\n  retryText: string;\n}>();\n\nconst emit = defineEmits<{\n  retry: [];\n}>();\n\ndefineSlots<{\n  error?: () => any;\n}>();\n\nconst { classes, colspan } = useDataTableStyling();\n</script>\n\n<template>\n  <tr\n    :class=\"classes.trEmpty\"\n    data-id=\"row-error\"\n  >\n    <td\n      :class=\"classes.td\"\n      :colspan=\"colspan\"\n    >\n      <slot name=\"error\">\n        <RuiTableErrorState\n          :action-text=\"retryText\"\n          :message=\"message\"\n          :title=\"title\"\n          @action=\"emit('retry')\"\n        />\n      </slot>\n    </td>\n  </tr>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAUA,MAAM,OAAO;EAQb,MAAM,EAAE,SAAS,YAAY,oBAAoB;;GAI/C,OAAA,UAAA,GAAA,mBAiBK,MAAA;IAhBF,OAAK,eAAE,MAAA,OAAA,CAAO,CAAC,OAAO;IACvB,WAAQ;GAER,GAAA,CAAA,mBAYK,MAAA;IAXF,OAAK,eAAE,MAAA,OAAA,CAAO,CAAC,EAAE;IACjB,SAAS,MAAA,OAAA;GAEV,GAAA,CAAA,WAOO,KAAA,QAAA,SAAA,CAAA,SAAA,CANL,YAKE,4BAAA;IAJC,eAAa,QAAA;IACb,SAAS,QAAA;IACT,OAAO,QAAA;IACP,UAAM,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,OAAA"}
+{"version":3,"file":"RuiDataTableErrorRow.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeClass","_unref","_createElementVNode","_renderSlot","_createVNode","RuiTableErrorState"],"sources":["../../../../src/components/tables/data-table/RuiDataTableErrorRow.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiTableErrorState from '@/components/tables/RuiTableErrorState.vue';\n\ndefineProps<{\n  message: string;\n  title: string;\n  retryText: string;\n}>();\n\nconst emit = defineEmits<{\n  retry: [];\n}>();\n\ndefineSlots<{\n  error?: () => any;\n}>();\n\nconst { classes, colspan } = useDataTableStyling();\n</script>\n\n<template>\n  <tr\n    :class=\"classes.trEmpty\"\n    data-id=\"row-error\"\n  >\n    <td\n      :class=\"classes.td\"\n      :colspan=\"colspan\"\n    >\n      <slot name=\"error\">\n        <RuiTableErrorState\n          :action-text=\"retryText\"\n          :message=\"message\"\n          :title=\"title\"\n          @action=\"emit('retry')\"\n        />\n      </slot>\n    </td>\n  </tr>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAUA,MAAM,OAAO;EAQb,MAAM,EAAE,SAAS,YAAY,oBAAoB;;GAI/C,OAAAA,UAAA,GAAAC,mBAiBK,MAAA;IAhBF,OAAKC,eAAEC,MAAA,OAAA,CAAO,CAAC,OAAO;IACvB,WAAQ;GAERC,GAAAA,CAAAA,mBAYK,MAAA;IAXF,OAAKF,eAAEC,MAAA,OAAA,CAAO,CAAC,EAAE;IACjB,SAASA,MAAA,OAAA;GAEVE,GAAAA,CAAAA,WAOO,KAAA,QAAA,SAAA,CAAA,SAAA,CANLC,YAKEC,4BAAA;IAJC,eAAa,QAAA;IACb,SAAS,QAAA;IACT,OAAO,QAAA;IACP,UAAM,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,OAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableExpandedRow.js","names":[],"sources":["../../../../src/components/tables/data-table/RuiDataTableExpandedRow.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\n\ndefineProps<{\n  row: T;\n  index: number;\n}>();\n\ndefineSlots<{\n  'expanded-item': (props: { row: T; index: number }) => any;\n}>();\n\nconst { classes, colspan, isMobile } = useDataTableStyling();\n\n/**\n * On mobile the expanded content attaches beneath its card: matching side\n * borders and a rounded, bordered bottom edge. It carries no top border, since\n * the parent card's flattened bottom edge is the divider, and `border-b!`\n * defeats the `divide-y-0` on the mobile tbody.\n */\nconst mobileExpandedClass = 'block border-x border-b! border-rui-divider rounded-b-rui-card mb-3 overflow-hidden';\n\n/**\n * Caps the panel to the table's visible width, less the cell's 16px sides, and\n * pins it to the left edge while the table scrolls sideways. Wider content,\n * such as a nested table, scrolls inside its own scroller. Where the table\n * resets `--rui-table-viewport` the calc is invalid and the width stays auto.\n */\nconst panelStyle = { width: 'calc(var(--rui-table-viewport) - 2rem)' };\n</script>\n\n<template>\n  <tr\n    :class=\"[classes.trExpandable, isMobile ? mobileExpandedClass : '']\"\n    data-id=\"row-expanded\"\n  >\n    <!-- an inset on every side: the cell's 16px sides, matched top and bottom instead of a row's dense padding -->\n    <td\n      :colspan=\"colspan\"\n      class=\"py-4\"\n      :class=\"classes.td\"\n    >\n      <div\n        :class=\"{ 'sticky left-4': !isMobile }\"\n        :style=\"panelStyle\"\n        data-id=\"expanded-panel\"\n      >\n        <slot\n          name=\"expanded-item\"\n          :row=\"row\"\n          :index=\"index\"\n        />\n      </div>\n    </td>\n  </tr>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiDataTableExpandedRow.js","names":["_sfc_main"],"sources":["../../../../src/components/tables/data-table/RuiDataTableExpandedRow.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\n\ndefineProps<{\n  row: T;\n  index: number;\n}>();\n\ndefineSlots<{\n  'expanded-item': (props: { row: T; index: number }) => any;\n}>();\n\nconst { classes, colspan, isMobile } = useDataTableStyling();\n\n/**\n * On mobile the expanded content attaches beneath its card: matching side\n * borders and a rounded, bordered bottom edge. It carries no top border, since\n * the parent card's flattened bottom edge is the divider, and `border-b!`\n * defeats the `divide-y-0` on the mobile tbody.\n */\nconst mobileExpandedClass = 'block border-x border-b! border-rui-divider rounded-b-rui-card mb-3 overflow-hidden';\n\n/**\n * Caps the panel to the table's visible width, less the cell's 16px sides, and\n * pins it to the left edge while the table scrolls sideways. Wider content,\n * such as a nested table, scrolls inside its own scroller. Where the table\n * resets `--rui-table-viewport` the calc is invalid and the width stays auto.\n */\nconst panelStyle = { width: 'calc(var(--rui-table-viewport) - 2rem)' };\n</script>\n\n<template>\n  <tr\n    :class=\"[classes.trExpandable, isMobile ? mobileExpandedClass : '']\"\n    data-id=\"row-expanded\"\n  >\n    <!-- an inset on every side: the cell's 16px sides, matched top and bottom instead of a row's dense padding -->\n    <td\n      :colspan=\"colspan\"\n      class=\"py-4\"\n      :class=\"classes.td\"\n    >\n      <div\n        :class=\"{ 'sticky left-4': !isMobile }\"\n        :style=\"panelStyle\"\n        data-id=\"expanded-panel\"\n      >\n        <slot\n          name=\"expanded-item\"\n          :row=\"row\"\n          :index=\"index\"\n        />\n      </div>\n    </td>\n  </tr>\n</template>\n"],"mappings":""}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableExpandedRow.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../src/components/tables/data-table/RuiDataTableExpandedRow.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\n\ndefineProps<{\n  row: T;\n  index: number;\n}>();\n\ndefineSlots<{\n  'expanded-item': (props: { row: T; index: number }) => any;\n}>();\n\nconst { classes, colspan, isMobile } = useDataTableStyling();\n\n/**\n * On mobile the expanded content attaches beneath its card: matching side\n * borders and a rounded, bordered bottom edge. It carries no top border, since\n * the parent card's flattened bottom edge is the divider, and `border-b!`\n * defeats the `divide-y-0` on the mobile tbody.\n */\nconst mobileExpandedClass = 'block border-x border-b! border-rui-divider rounded-b-rui-card mb-3 overflow-hidden';\n\n/**\n * Caps the panel to the table's visible width, less the cell's 16px sides, and\n * pins it to the left edge while the table scrolls sideways. Wider content,\n * such as a nested table, scrolls inside its own scroller. Where the table\n * resets `--rui-table-viewport` the calc is invalid and the width stays auto.\n */\nconst panelStyle = { width: 'calc(var(--rui-table-viewport) - 2rem)' };\n</script>\n\n<template>\n  <tr\n    :class=\"[classes.trExpandable, isMobile ? mobileExpandedClass : '']\"\n    data-id=\"row-expanded\"\n  >\n    <!-- an inset on every side: the cell's 16px sides, matched top and bottom instead of a row's dense padding -->\n    <td\n      :colspan=\"colspan\"\n      class=\"py-4\"\n      :class=\"classes.td\"\n    >\n      <div\n        :class=\"{ 'sticky left-4': !isMobile }\"\n        :style=\"panelStyle\"\n        data-id=\"expanded-panel\"\n      >\n        <slot\n          name=\"expanded-item\"\n          :row=\"row\"\n          :index=\"index\"\n        />\n      </div>\n    </td>\n  </tr>\n</template>\n"],"mappings":";;;;AAoBA,IAAM,sBAAsB;;;;;;;;;;;;;;EAR5B,MAAM,EAAE,SAAS,SAAS,aAAa,oBAAoB;;;;;;;EAgB3D,MAAM,aAAa,EAAE,OAAO,yCAAyC;;GAInE,OAAA,UAAA,GAAA,mBAsBK,MAAA;IArBF,OAAK,eAAA,CAAG,MAAA,OAAA,CAAO,CAAC,cAAc,MAAA,QAAA,IAAW,sBAAmB,EAAA,CAAA;IAC7D,WAAQ;GAGR,GAAA,CAAA,mBAgBK,MAAA;IAfF,SAAS,MAAA,OAAA;IACV,OAAK,eAAA,CAAC,QACE,MAAA,OAAA,CAAO,CAAC,EAAE,CAAA;GAElB,GAAA,CAAA,mBAUM,OAAA;IATH,OAAK,eAAA,EAAA,iBAAA,CAAsB,MAAA,QAAA,EAAQ,CAAA;IACnC,OAAO;IACR,WAAQ;GAER,GAAA,CAAA,WAIE,KAAA,QAAA,iBAAA;IAFC,KAAK,QAAA;IACL,OAAO,QAAA"}
+{"version":3,"file":"RuiDataTableExpandedRow.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeClass","_unref","_createElementVNode","_renderSlot"],"sources":["../../../../src/components/tables/data-table/RuiDataTableExpandedRow.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\n\ndefineProps<{\n  row: T;\n  index: number;\n}>();\n\ndefineSlots<{\n  'expanded-item': (props: { row: T; index: number }) => any;\n}>();\n\nconst { classes, colspan, isMobile } = useDataTableStyling();\n\n/**\n * On mobile the expanded content attaches beneath its card: matching side\n * borders and a rounded, bordered bottom edge. It carries no top border, since\n * the parent card's flattened bottom edge is the divider, and `border-b!`\n * defeats the `divide-y-0` on the mobile tbody.\n */\nconst mobileExpandedClass = 'block border-x border-b! border-rui-divider rounded-b-rui-card mb-3 overflow-hidden';\n\n/**\n * Caps the panel to the table's visible width, less the cell's 16px sides, and\n * pins it to the left edge while the table scrolls sideways. Wider content,\n * such as a nested table, scrolls inside its own scroller. Where the table\n * resets `--rui-table-viewport` the calc is invalid and the width stays auto.\n */\nconst panelStyle = { width: 'calc(var(--rui-table-viewport) - 2rem)' };\n</script>\n\n<template>\n  <tr\n    :class=\"[classes.trExpandable, isMobile ? mobileExpandedClass : '']\"\n    data-id=\"row-expanded\"\n  >\n    <!-- an inset on every side: the cell's 16px sides, matched top and bottom instead of a row's dense padding -->\n    <td\n      :colspan=\"colspan\"\n      class=\"py-4\"\n      :class=\"classes.td\"\n    >\n      <div\n        :class=\"{ 'sticky left-4': !isMobile }\"\n        :style=\"panelStyle\"\n        data-id=\"expanded-panel\"\n      >\n        <slot\n          name=\"expanded-item\"\n          :row=\"row\"\n          :index=\"index\"\n        />\n      </div>\n    </td>\n  </tr>\n</template>\n"],"mappings":";;;;AAoBA,IAAM,sBAAsB;;;;;;;;;;;;;;EAR5B,MAAM,EAAE,SAAS,SAAS,aAAa,oBAAoB;;;;;;;EAgB3D,MAAM,aAAa,EAAE,OAAO,yCAAyC;;GAInE,OAAAA,UAAA,GAAAC,mBAsBK,MAAA;IArBF,OAAKC,eAAA,CAAGC,MAAA,OAAA,CAAO,CAAC,cAAcA,MAAA,QAAA,IAAW,sBAAmB,EAAA,CAAA;IAC7D,WAAQ;GAGRC,GAAAA,CAAAA,mBAgBK,MAAA;IAfF,SAASD,MAAA,OAAA;IACV,OAAKD,eAAA,CAAC,QACEC,MAAA,OAAA,CAAO,CAAC,EAAE,CAAA;GAElBC,GAAAA,CAAAA,mBAUM,OAAA;IATH,OAAKF,eAAA,EAAA,iBAAA,CAAsBC,MAAA,QAAA,EAAQ,CAAA;IACnC,OAAO;IACR,WAAQ;GAERE,GAAAA,CAAAA,WAIE,KAAA,QAAA,iBAAA;IAFC,KAAK,QAAA;IACL,OAAO,QAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableGroupRow.js","names":[],"sources":["../../../../src/components/tables/data-table/RuiDataTableGroupRow.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { GroupHeader } from '@/composables/tables/data-table/types';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiTooltip from '@/components/overlays/tooltip/RuiTooltip.vue';\nimport { useDataTableGrouping, useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiExpandButton from '@/components/tables/RuiExpandButton.vue';\nimport { GroupExpandButtonPosition } from '@/components/tables/table-props';\n\nconst { row } = defineProps<{\n  row: GroupHeader<T>;\n}>();\n\ndefineSlots<{\n  'group.header'?: (props: {\n    colspan: number;\n    header: GroupHeader<T>;\n    isOpen: boolean;\n    toggle: () => void;\n  }) => any;\n  'group.header.content'?: (props: { header: GroupHeader<T>; groupKey: string }) => any;\n}>();\n\nconst { classes, colspan, isMobile } = useDataTableStyling();\n\n/**\n * On mobile the group header reads as a rounded section label, separated from\n * the previous group's cards above and its own below, aligned to the card\n * content padding.\n */\nconst mobileGroupClass = 'mt-6 first:mt-0 mb-2 rounded-rui-card';\nconst {\n  getGroupSize,\n  groupExpandButtonPosition,\n  groupKey,\n  groupLabels,\n  isExpandedGroup,\n  onCopyGroup,\n  onToggleExpandGroup,\n  onUngroup,\n} = useDataTableGrouping<T>();\n\nconst isOpen = computed<boolean>(() => isExpandedGroup(row.group));\nconst groupSize = computed<number>(() => getGroupSize(row.identifier));\n\n/** One label/value pair per grouped column, e.g. `Username: amartin`. */\nconst groupParts = computed<{ key: string; label: string; value: string }[]>(() => {\n  const values = new Map<string, unknown>(Object.entries(row.group));\n  return get(groupLabels).map(({ key, label }) => {\n    const value = values.get(key);\n    return { key, label, value: value === undefined || value === null ? '' : String(value) };\n  });\n});\n</script>\n\n<template>\n  <tr\n    :class=\"[classes.trGroup, isMobile ? mobileGroupClass : '']\"\n    data-id=\"row-group\"\n  >\n    <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n    <slot\n      name=\"group.header\"\n      :colspan=\"colspan\"\n      :header=\"row\"\n      :is-open=\"isOpen\"\n      :toggle=\"() => onToggleExpandGroup(row.group, row.identifier)\"\n    >\n      <td\n        class=\"px-4! py-2!\"\n        :class=\"[classes.td, { 'h-auto': !isMobile }]\"\n        :colspan=\"colspan\"\n      >\n        <div class=\"flex items-center gap-2\">\n          <!-- the edge controls pull in by their own padding so their icons sit on the cell grid -->\n          <RuiExpandButton\n            v-if=\"groupExpandButtonPosition === GroupExpandButtonPosition.start\"\n            class=\"-ml-1.5\"\n            aria-label=\"Expand group\"\n            :expanded=\"isOpen\"\n            @click=\"onToggleExpandGroup(row.group, row.identifier)\"\n          />\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            :group-key=\"groupKey ?? ''\"\n            name=\"group.header.content\"\n            :header=\"row\"\n          >\n            <span\n              class=\"flex flex-wrap items-baseline gap-x-3\"\n              data-id=\"group-label\"\n            >\n              <span\n                v-for=\"part in groupParts\"\n                :key=\"part.key\"\n              >\n                <span class=\"text-rui-text-secondary\">{{ part.label }}:</span>\n                <span class=\"font-medium ml-1\">{{ part.value }}</span>\n              </span>\n            </span>\n            <span\n              class=\"rounded-full bg-rui-hover px-2 text-caption text-rui-text-secondary\"\n              data-id=\"group-size\"\n            >\n              {{ groupSize }}\n            </span>\n            <RuiButton\n              size=\"sm\"\n              variant=\"text\"\n              icon\n              data-id=\"group-copy-button\"\n              aria-label=\"Copy group\"\n              @click=\"onCopyGroup(row)\"\n            >\n              <RuiIcon\n                name=\"lu-copy\"\n                size=\"16\"\n              />\n            </RuiButton>\n          </slot>\n          <RuiTooltip\n            :options=\"{ placement: 'top' }\"\n            class=\"ml-auto\"\n            :class=\"{ '-mr-1.5': groupExpandButtonPosition !== GroupExpandButtonPosition.end }\"\n          >\n            <template #activator>\n              <RuiButton\n                size=\"sm\"\n                variant=\"text\"\n                icon\n                data-id=\"group-ungroup-button\"\n                aria-label=\"Ungroup\"\n                @click=\"onUngroup()\"\n              >\n                <RuiIcon\n                  name=\"lu-ungroup\"\n                  size=\"16\"\n                />\n              </RuiButton>\n            </template>\n            Ungroup\n          </RuiTooltip>\n          <RuiExpandButton\n            v-if=\"groupExpandButtonPosition === GroupExpandButtonPosition.end\"\n            class=\"-mr-1.5\"\n            aria-label=\"Expand group\"\n            :expanded=\"isOpen\"\n            @click=\"onToggleExpandGroup(row.group, row.identifier)\"\n          />\n        </div>\n      </td>\n    </slot>\n  </tr>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiDataTableGroupRow.js","names":["_sfc_main"],"sources":["../../../../src/components/tables/data-table/RuiDataTableGroupRow.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { GroupHeader } from '@/composables/tables/data-table/types';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiTooltip from '@/components/overlays/tooltip/RuiTooltip.vue';\nimport { useDataTableGrouping, useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiExpandButton from '@/components/tables/RuiExpandButton.vue';\nimport { GroupExpandButtonPosition } from '@/components/tables/table-props';\n\nconst { row } = defineProps<{\n  row: GroupHeader<T>;\n}>();\n\ndefineSlots<{\n  'group.header'?: (props: {\n    colspan: number;\n    header: GroupHeader<T>;\n    isOpen: boolean;\n    toggle: () => void;\n  }) => any;\n  'group.header.content'?: (props: { header: GroupHeader<T>; groupKey: string }) => any;\n}>();\n\nconst { classes, colspan, isMobile } = useDataTableStyling();\n\n/**\n * On mobile the group header reads as a rounded section label, separated from\n * the previous group's cards above and its own below, aligned to the card\n * content padding.\n */\nconst mobileGroupClass = 'mt-6 first:mt-0 mb-2 rounded-rui-card';\nconst {\n  getGroupSize,\n  groupExpandButtonPosition,\n  groupKey,\n  groupLabels,\n  isExpandedGroup,\n  onCopyGroup,\n  onToggleExpandGroup,\n  onUngroup,\n} = useDataTableGrouping<T>();\n\nconst isOpen = computed<boolean>(() => isExpandedGroup(row.group));\nconst groupSize = computed<number>(() => getGroupSize(row.identifier));\n\n/** One label/value pair per grouped column, e.g. `Username: amartin`. */\nconst groupParts = computed<{ key: string; label: string; value: string }[]>(() => {\n  const values = new Map<string, unknown>(Object.entries(row.group));\n  return get(groupLabels).map(({ key, label }) => {\n    const value = values.get(key);\n    return { key, label, value: value === undefined || value === null ? '' : String(value) };\n  });\n});\n</script>\n\n<template>\n  <tr\n    :class=\"[classes.trGroup, isMobile ? mobileGroupClass : '']\"\n    data-id=\"row-group\"\n  >\n    <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n    <slot\n      name=\"group.header\"\n      :colspan=\"colspan\"\n      :header=\"row\"\n      :is-open=\"isOpen\"\n      :toggle=\"() => onToggleExpandGroup(row.group, row.identifier)\"\n    >\n      <td\n        class=\"px-4! py-2!\"\n        :class=\"[classes.td, { 'h-auto': !isMobile }]\"\n        :colspan=\"colspan\"\n      >\n        <div class=\"flex items-center gap-2\">\n          <!-- the edge controls pull in by their own padding so their icons sit on the cell grid -->\n          <RuiExpandButton\n            v-if=\"groupExpandButtonPosition === GroupExpandButtonPosition.start\"\n            class=\"-ml-1.5\"\n            aria-label=\"Expand group\"\n            :expanded=\"isOpen\"\n            @click=\"onToggleExpandGroup(row.group, row.identifier)\"\n          />\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            :group-key=\"groupKey ?? ''\"\n            name=\"group.header.content\"\n            :header=\"row\"\n          >\n            <span\n              class=\"flex flex-wrap items-baseline gap-x-3\"\n              data-id=\"group-label\"\n            >\n              <span\n                v-for=\"part in groupParts\"\n                :key=\"part.key\"\n              >\n                <span class=\"text-rui-text-secondary\">{{ part.label }}:</span>\n                <span class=\"font-medium ml-1\">{{ part.value }}</span>\n              </span>\n            </span>\n            <span\n              class=\"rounded-full bg-rui-hover px-2 text-caption text-rui-text-secondary\"\n              data-id=\"group-size\"\n            >\n              {{ groupSize }}\n            </span>\n            <RuiButton\n              size=\"sm\"\n              variant=\"text\"\n              icon\n              data-id=\"group-copy-button\"\n              aria-label=\"Copy group\"\n              @click=\"onCopyGroup(row)\"\n            >\n              <RuiIcon\n                name=\"lu-copy\"\n                size=\"16\"\n              />\n            </RuiButton>\n          </slot>\n          <RuiTooltip\n            :options=\"{ placement: 'top' }\"\n            class=\"ml-auto\"\n            :class=\"{ '-mr-1.5': groupExpandButtonPosition !== GroupExpandButtonPosition.end }\"\n          >\n            <template #activator>\n              <RuiButton\n                size=\"sm\"\n                variant=\"text\"\n                icon\n                data-id=\"group-ungroup-button\"\n                aria-label=\"Ungroup\"\n                @click=\"onUngroup()\"\n              >\n                <RuiIcon\n                  name=\"lu-ungroup\"\n                  size=\"16\"\n                />\n              </RuiButton>\n            </template>\n            Ungroup\n          </RuiTooltip>\n          <RuiExpandButton\n            v-if=\"groupExpandButtonPosition === GroupExpandButtonPosition.end\"\n            class=\"-mr-1.5\"\n            aria-label=\"Expand group\"\n            :expanded=\"isOpen\"\n            @click=\"onToggleExpandGroup(row.group, row.identifier)\"\n          />\n        </div>\n      </td>\n    </slot>\n  </tr>\n</template>\n"],"mappings":""}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableGroupRow.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../src/components/tables/data-table/RuiDataTableGroupRow.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { GroupHeader } from '@/composables/tables/data-table/types';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiTooltip from '@/components/overlays/tooltip/RuiTooltip.vue';\nimport { useDataTableGrouping, useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiExpandButton from '@/components/tables/RuiExpandButton.vue';\nimport { GroupExpandButtonPosition } from '@/components/tables/table-props';\n\nconst { row } = defineProps<{\n  row: GroupHeader<T>;\n}>();\n\ndefineSlots<{\n  'group.header'?: (props: {\n    colspan: number;\n    header: GroupHeader<T>;\n    isOpen: boolean;\n    toggle: () => void;\n  }) => any;\n  'group.header.content'?: (props: { header: GroupHeader<T>; groupKey: string }) => any;\n}>();\n\nconst { classes, colspan, isMobile } = useDataTableStyling();\n\n/**\n * On mobile the group header reads as a rounded section label, separated from\n * the previous group's cards above and its own below, aligned to the card\n * content padding.\n */\nconst mobileGroupClass = 'mt-6 first:mt-0 mb-2 rounded-rui-card';\nconst {\n  getGroupSize,\n  groupExpandButtonPosition,\n  groupKey,\n  groupLabels,\n  isExpandedGroup,\n  onCopyGroup,\n  onToggleExpandGroup,\n  onUngroup,\n} = useDataTableGrouping<T>();\n\nconst isOpen = computed<boolean>(() => isExpandedGroup(row.group));\nconst groupSize = computed<number>(() => getGroupSize(row.identifier));\n\n/** One label/value pair per grouped column, e.g. `Username: amartin`. */\nconst groupParts = computed<{ key: string; label: string; value: string }[]>(() => {\n  const values = new Map<string, unknown>(Object.entries(row.group));\n  return get(groupLabels).map(({ key, label }) => {\n    const value = values.get(key);\n    return { key, label, value: value === undefined || value === null ? '' : String(value) };\n  });\n});\n</script>\n\n<template>\n  <tr\n    :class=\"[classes.trGroup, isMobile ? mobileGroupClass : '']\"\n    data-id=\"row-group\"\n  >\n    <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n    <slot\n      name=\"group.header\"\n      :colspan=\"colspan\"\n      :header=\"row\"\n      :is-open=\"isOpen\"\n      :toggle=\"() => onToggleExpandGroup(row.group, row.identifier)\"\n    >\n      <td\n        class=\"px-4! py-2!\"\n        :class=\"[classes.td, { 'h-auto': !isMobile }]\"\n        :colspan=\"colspan\"\n      >\n        <div class=\"flex items-center gap-2\">\n          <!-- the edge controls pull in by their own padding so their icons sit on the cell grid -->\n          <RuiExpandButton\n            v-if=\"groupExpandButtonPosition === GroupExpandButtonPosition.start\"\n            class=\"-ml-1.5\"\n            aria-label=\"Expand group\"\n            :expanded=\"isOpen\"\n            @click=\"onToggleExpandGroup(row.group, row.identifier)\"\n          />\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            :group-key=\"groupKey ?? ''\"\n            name=\"group.header.content\"\n            :header=\"row\"\n          >\n            <span\n              class=\"flex flex-wrap items-baseline gap-x-3\"\n              data-id=\"group-label\"\n            >\n              <span\n                v-for=\"part in groupParts\"\n                :key=\"part.key\"\n              >\n                <span class=\"text-rui-text-secondary\">{{ part.label }}:</span>\n                <span class=\"font-medium ml-1\">{{ part.value }}</span>\n              </span>\n            </span>\n            <span\n              class=\"rounded-full bg-rui-hover px-2 text-caption text-rui-text-secondary\"\n              data-id=\"group-size\"\n            >\n              {{ groupSize }}\n            </span>\n            <RuiButton\n              size=\"sm\"\n              variant=\"text\"\n              icon\n              data-id=\"group-copy-button\"\n              aria-label=\"Copy group\"\n              @click=\"onCopyGroup(row)\"\n            >\n              <RuiIcon\n                name=\"lu-copy\"\n                size=\"16\"\n              />\n            </RuiButton>\n          </slot>\n          <RuiTooltip\n            :options=\"{ placement: 'top' }\"\n            class=\"ml-auto\"\n            :class=\"{ '-mr-1.5': groupExpandButtonPosition !== GroupExpandButtonPosition.end }\"\n          >\n            <template #activator>\n              <RuiButton\n                size=\"sm\"\n                variant=\"text\"\n                icon\n                data-id=\"group-ungroup-button\"\n                aria-label=\"Ungroup\"\n                @click=\"onUngroup()\"\n              >\n                <RuiIcon\n                  name=\"lu-ungroup\"\n                  size=\"16\"\n                />\n              </RuiButton>\n            </template>\n            Ungroup\n          </RuiTooltip>\n          <RuiExpandButton\n            v-if=\"groupExpandButtonPosition === GroupExpandButtonPosition.end\"\n            class=\"-mr-1.5\"\n            aria-label=\"Expand group\"\n            :expanded=\"isOpen\"\n            @click=\"onToggleExpandGroup(row.group, row.identifier)\"\n          />\n        </div>\n      </td>\n    </slot>\n  </tr>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"RuiDataTableGroupRow.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeClass","_unref","_renderSlot","_createElementVNode","_createBlock","RuiExpandButton","_createCommentVNode","_Fragment","_renderList","_toDisplayString","_createVNode","RuiButton","_withCtx","RuiIcon","RuiTooltip","_createTextVNode"],"sources":["../../../../src/components/tables/data-table/RuiDataTableGroupRow.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { GroupHeader } from '@/composables/tables/data-table/types';\nimport RuiButton from '@/components/buttons/button/RuiButton.vue';\nimport RuiIcon from '@/components/icons/RuiIcon.vue';\nimport RuiTooltip from '@/components/overlays/tooltip/RuiTooltip.vue';\nimport { useDataTableGrouping, useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiExpandButton from '@/components/tables/RuiExpandButton.vue';\nimport { GroupExpandButtonPosition } from '@/components/tables/table-props';\n\nconst { row } = defineProps<{\n  row: GroupHeader<T>;\n}>();\n\ndefineSlots<{\n  'group.header'?: (props: {\n    colspan: number;\n    header: GroupHeader<T>;\n    isOpen: boolean;\n    toggle: () => void;\n  }) => any;\n  'group.header.content'?: (props: { header: GroupHeader<T>; groupKey: string }) => any;\n}>();\n\nconst { classes, colspan, isMobile } = useDataTableStyling();\n\n/**\n * On mobile the group header reads as a rounded section label, separated from\n * the previous group's cards above and its own below, aligned to the card\n * content padding.\n */\nconst mobileGroupClass = 'mt-6 first:mt-0 mb-2 rounded-rui-card';\nconst {\n  getGroupSize,\n  groupExpandButtonPosition,\n  groupKey,\n  groupLabels,\n  isExpandedGroup,\n  onCopyGroup,\n  onToggleExpandGroup,\n  onUngroup,\n} = useDataTableGrouping<T>();\n\nconst isOpen = computed<boolean>(() => isExpandedGroup(row.group));\nconst groupSize = computed<number>(() => getGroupSize(row.identifier));\n\n/** One label/value pair per grouped column, e.g. `Username: amartin`. */\nconst groupParts = computed<{ key: string; label: string; value: string }[]>(() => {\n  const values = new Map<string, unknown>(Object.entries(row.group));\n  return get(groupLabels).map(({ key, label }) => {\n    const value = values.get(key);\n    return { key, label, value: value === undefined || value === null ? '' : String(value) };\n  });\n});\n</script>\n\n<template>\n  <tr\n    :class=\"[classes.trGroup, isMobile ? mobileGroupClass : '']\"\n    data-id=\"row-group\"\n  >\n    <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n    <slot\n      name=\"group.header\"\n      :colspan=\"colspan\"\n      :header=\"row\"\n      :is-open=\"isOpen\"\n      :toggle=\"() => onToggleExpandGroup(row.group, row.identifier)\"\n    >\n      <td\n        class=\"px-4! py-2!\"\n        :class=\"[classes.td, { 'h-auto': !isMobile }]\"\n        :colspan=\"colspan\"\n      >\n        <div class=\"flex items-center gap-2\">\n          <!-- the edge controls pull in by their own padding so their icons sit on the cell grid -->\n          <RuiExpandButton\n            v-if=\"groupExpandButtonPosition === GroupExpandButtonPosition.start\"\n            class=\"-ml-1.5\"\n            aria-label=\"Expand group\"\n            :expanded=\"isOpen\"\n            @click=\"onToggleExpandGroup(row.group, row.identifier)\"\n          />\n          <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n          <slot\n            :group-key=\"groupKey ?? ''\"\n            name=\"group.header.content\"\n            :header=\"row\"\n          >\n            <span\n              class=\"flex flex-wrap items-baseline gap-x-3\"\n              data-id=\"group-label\"\n            >\n              <span\n                v-for=\"part in groupParts\"\n                :key=\"part.key\"\n              >\n                <span class=\"text-rui-text-secondary\">{{ part.label }}:</span>\n                <span class=\"font-medium ml-1\">{{ part.value }}</span>\n              </span>\n            </span>\n            <span\n              class=\"rounded-full bg-rui-hover px-2 text-caption text-rui-text-secondary\"\n              data-id=\"group-size\"\n            >\n              {{ groupSize }}\n            </span>\n            <RuiButton\n              size=\"sm\"\n              variant=\"text\"\n              icon\n              data-id=\"group-copy-button\"\n              aria-label=\"Copy group\"\n              @click=\"onCopyGroup(row)\"\n            >\n              <RuiIcon\n                name=\"lu-copy\"\n                size=\"16\"\n              />\n            </RuiButton>\n          </slot>\n          <RuiTooltip\n            :options=\"{ placement: 'top' }\"\n            class=\"ml-auto\"\n            :class=\"{ '-mr-1.5': groupExpandButtonPosition !== GroupExpandButtonPosition.end }\"\n          >\n            <template #activator>\n              <RuiButton\n                size=\"sm\"\n                variant=\"text\"\n                icon\n                data-id=\"group-ungroup-button\"\n                aria-label=\"Ungroup\"\n                @click=\"onUngroup()\"\n              >\n                <RuiIcon\n                  name=\"lu-ungroup\"\n                  size=\"16\"\n                />\n              </RuiButton>\n            </template>\n            Ungroup\n          </RuiTooltip>\n          <RuiExpandButton\n            v-if=\"groupExpandButtonPosition === GroupExpandButtonPosition.end\"\n            class=\"-mr-1.5\"\n            aria-label=\"Expand group\"\n            :expanded=\"isOpen\"\n            @click=\"onToggleExpandGroup(row.group, row.identifier)\"\n          />\n        </div>\n      </td>\n    </slot>\n  </tr>\n</template>\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableLoadingRow.js","names":[],"sources":["../../../../src/components/tables/data-table/RuiDataTableLoadingRow.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiTableLoadingState from '@/components/tables/RuiTableLoadingState.vue';\n\nconst { classes, colspan } = useDataTableStyling();\n</script>\n\n<template>\n  <tr>\n    <td\n      :class=\"classes.tbodyLoader\"\n      :colspan=\"colspan\"\n      data-id=\"tbody-loader\"\n    >\n      <RuiTableLoadingState />\n    </td>\n  </tr>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiDataTableLoadingRow.js","names":["_sfc_main"],"sources":["../../../../src/components/tables/data-table/RuiDataTableLoadingRow.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiTableLoadingState from '@/components/tables/RuiTableLoadingState.vue';\n\nconst { classes, colspan } = useDataTableStyling();\n</script>\n\n<template>\n  <tr>\n    <td\n      :class=\"classes.tbodyLoader\"\n      :colspan=\"colspan\"\n      data-id=\"tbody-loader\"\n    >\n      <RuiTableLoadingState />\n    </td>\n  </tr>\n</template>\n"],"mappings":""}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableLoadingRow.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../src/components/tables/data-table/RuiDataTableLoadingRow.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiTableLoadingState from '@/components/tables/RuiTableLoadingState.vue';\n\nconst { classes, colspan } = useDataTableStyling();\n</script>\n\n<template>\n  <tr>\n    <td\n      :class=\"classes.tbodyLoader\"\n      :colspan=\"colspan\"\n      data-id=\"tbody-loader\"\n    >\n      <RuiTableLoadingState />\n    </td>\n  </tr>\n</template>\n"],"mappings":";;;;;;;;EAIA,MAAM,EAAE,SAAS,YAAY,oBAAoB;;GAI/C,OAAA,UAAA,GAAA,mBAQK,MAAA,MAAA,CAPH,mBAMK,MAAA;IALF,OAAK,eAAE,MAAA,OAAA,CAAO,CAAC,WAAW;IAC1B,SAAS,MAAA,OAAA;IACV,WAAQ;GAER,GAAA,CAAA,YAAwB,4BAAA,CAAA,GAAA,IAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"RuiDataTableLoadingRow.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_createElementVNode","_normalizeClass","_unref","_createVNode","RuiTableLoadingState"],"sources":["../../../../src/components/tables/data-table/RuiDataTableLoadingRow.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiTableLoadingState from '@/components/tables/RuiTableLoadingState.vue';\n\nconst { classes, colspan } = useDataTableStyling();\n</script>\n\n<template>\n  <tr>\n    <td\n      :class=\"classes.tbodyLoader\"\n      :colspan=\"colspan\"\n      data-id=\"tbody-loader\"\n    >\n      <RuiTableLoadingState />\n    </td>\n  </tr>\n</template>\n"],"mappings":";;;;;;;;EAIA,MAAM,EAAE,SAAS,YAAY,oBAAoB;;GAI/C,OAAAA,UAAA,GAAAC,mBAQK,MAAA,MAAA,CAPHC,mBAMK,MAAA;IALF,OAAKC,eAAEC,MAAA,OAAA,CAAO,CAAC,WAAW;IAC1B,SAASA,MAAA,OAAA;IACV,WAAQ;GAERC,GAAAA,CAAAA,YAAwBC,4BAAA,CAAA,GAAA,IAAA,UAAA,CAAA,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableMobileSort.js","names":[],"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 { 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":""}

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

@@ -1,4 +1,4 @@
-import type { SortColumn, TableColumn, TableRowKey } from '../RuiTableHead.vue';
+import type { SortColumn, TableColumn, TableRowKey } from '../RuiTableHead.vue.js';
 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<{

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":[],"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,OAAA,UAAA,GAAA,YAgDU,iBAAA;IA/CP,OAAO,QAAA;IACP,SAAS,EAAA,WAAA,aAAA;IACV,WAAQ;;IAEG,WAAS,SAcN,EAdU,YAAK,CAC3B,YAaY,mBAbZ,WAaY;KAZT,MAAM,QAAA,QAAK,OAAU,KAAA;KACtB,SAAQ;IACA,GAAA,OAAK,EACb,WAAQ,8BAA6B,CAAA,GAAA;KAE1B,SAAO,cAId,CAHF,YAGE,iBAAA;MAFA,MAAK;MACL,MAAK;;KAEE,SAAA,cACX,CADW,gBAAA,MACX,gBAAG,MAAA,WAAA,CAAW,GAAA,CAAA,CAAA,CAAA;;;IAGlB,SAAA,cA0BM,CA1BN,mBA0BM,OA1BN,YA0BM,EAzBJ,UAAA,IAAA,GAAA,mBAwBY,UAAA,MAAA,WAvBO,MAAA,eAAA,IAAV,WAAM;KADf,OAAA,UAAA,GAAA,YAwBY,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,QAAM,cAMb,CAJM,SAAS,OAAO,GAAG,KAD3B,UAAA,GAAA,YAKE,iBAAA;;OAHA,MAAK;OACJ,OAAK,eAAE,cAAc,OAAO,GAAG,MAAA,QAAA,eAAA,EAAA;OAChC,MAAK;MAEP,GAAA,MAAA,GAAA,CAAA,OAAA,CAAA,MAAA,UAAA,GAAA,mBAGE,QAHF,UAGE,EAAA,CAAA;MAXJ,SAAA,cAAyB,CAAtB,gBAAA,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 { 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"}

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

@@ -1 +1 @@
-{"version":3,"file":"RuiDataTableRow.js","names":[],"sources":["../../../../src/components/tables/data-table/RuiDataTableRow.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { TableColumn } from '@/components/tables/RuiTableHead.vue';\nimport RuiCheckbox from '@/components/forms/checkbox/RuiCheckbox.vue';\nimport { useDataTableColumns, useDataTableExpansion, useDataTableRowIdentity, useDataTableSelection, useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiDataTableCell from '@/components/tables/data-table/RuiDataTableCell.vue';\nimport RuiDataTableExpandedRow from '@/components/tables/data-table/RuiDataTableExpandedRow.vue';\nimport RuiExpandButton from '@/components/tables/RuiExpandButton.vue';\n\nconst {\n  row,\n  index,\n} = defineProps<{\n  row: T;\n  index: number;\n}>();\n\nconst slots = defineSlots<Partial<\n  Record<`item.${string}`, (props: { column: TableColumn<T>; row: T; index: number }) => any> & {\n    'expanded-item'?: (props: { row: T; index: number }) => any;\n  }\n>>();\n\nconst { classes, dense, isMobile } = useDataTableStyling();\nconst { cellValue, columns, itemSlotKeys } = useDataTableColumns<T>();\nconst { isDisabledRow, isSelected, onCheckboxClick, onSelect, selectedData } = useDataTableSelection<T>();\nconst { expandable, isExpanded, onToggleExpand } = useDataTableExpansion<T>();\nconst { getRowId, itemClass } = useDataTableRowIdentity<T>();\n\nconst rowId = computed<T[keyof T]>(() => getRowId(row));\nconst selected = computed<boolean>(() => isSelected(get(rowId)));\nconst disabled = computed<boolean>(() => isDisabledRow(get(rowId)));\nconst expanded = computed<boolean>(() => get(expandable) && !!slots['expanded-item'] && isExpanded(get(rowId)));\n\n/** How long a closing panel stays to fade out; matches its `duration-100`. */\nconst PANEL_LEAVE_MS = 100;\n\nconst reducedMotion = usePreferredReducedMotion();\n\n/**\n * Whether the panel is in the DOM, which outlasts `expanded` by its fade-out.\n *\n * @remarks\n * Not a `<Transition>`: test utilities stub that with an element, which lands inside the consumer's\n * `<tbody>` and shifts every `tr:nth-child` its specs count. The fade-in is CSS `@starting-style`.\n */\nconst panelShown = ref<boolean>(get(expanded));\nconst panelClosing = ref<boolean>(false);\n\nconst { start: finishClosing, stop: cancelClosing } = useTimeoutFn(() => {\n  set(panelShown, false);\n  set(panelClosing, false);\n}, PANEL_LEAVE_MS, { immediate: false });\n\nwatch(expanded, (open) => {\n  if (open) {\n    cancelClosing();\n    set(panelClosing, false);\n    set(panelShown, true);\n    return;\n  }\n  if (!get(panelShown))\n    return;\n  if (get(reducedMotion) === 'reduce') {\n    set(panelShown, false);\n    return;\n  }\n  set(panelClosing, true);\n  finishClosing();\n});\n\nconst rowClass = computed<string>(() => typeof itemClass === 'string' ? itemClass : itemClass(row));\n\n/** Selection wins over the open-panel shade, so a selected row still reads as selected. */\nconst stateClass = computed<string>(() => {\n  if (get(selected))\n    return get(classes).trSelected;\n  if (get(expanded))\n    return get(classes).trExpandedParent;\n  return get(classes).tr;\n});\n\n/**\n * A column is pinned to the mobile card header when it is flagged\n * `mobileHeader`, typically an action column, or when it is the\n * auto-generated expand column.\n */\nfunction isMobileHeaderColumn(column: TableColumn<T>): boolean {\n  return !!column.mobileHeader || column.key === 'expand';\n}\n\n/**\n * A pinned column only earns a spot in the header if it renders something: the\n * expand toggle, a provided item slot, or a non-empty cell value. Without this,\n * a pinned column with no content, such as an action column whose\n * `#item.action` slot a nested table does not provide, leaves an empty header\n * bar with just its divider line.\n */\nfunction mobileHeaderColumnHasContent(column: TableColumn<T>): boolean {\n  if (column.key === 'expand')\n    return true;\n  if (itemSlotKeys.has(column.key.toString()))\n    return true;\n  const value = cellValue(row, column.key);\n  return value !== undefined && value !== null && value !== '';\n}\n\n/**\n * In the stacked mobile layout, header columns render in the card header row\n * instead of as a label/value pair. Everything else stacks below in the body.\n */\nconst mobileHeaderColumns = computed<TableColumn<T>[]>(() =>\n  get(isMobile) ? get(columns).filter(column => isMobileHeaderColumn(column) && mobileHeaderColumnHasContent(column)) : [],\n);\nconst bodyColumns = computed<TableColumn<T>[]>(() =>\n  get(isMobile) ? get(columns).filter(column => !isMobileHeaderColumn(column)) : get(columns),\n);\nconst showMobileHeader = computed<boolean>(() =>\n  get(isMobile) && (!!get(selectedData) || get(mobileHeaderColumns).length > 0),\n);\n\n/**\n * Without a selection checkbox the header bar would hold only the pinned\n * actions, so they float in the card's top-right corner instead and the first\n * field row makes room for them.\n */\nconst compactMobileHeader = computed<boolean>(() =>\n  get(showMobileHeader) && !get(selectedData) && get(bodyColumns).length > 0,\n);\n\n/** Room for each floating action, about one small icon button wide. */\nconst firstRowInset = computed<Record<string, string> | undefined>(() =>\n  get(compactMobileHeader) ? { paddingRight: `${get(mobileHeaderColumns).length * 2 + 1}rem` } : undefined,\n);\n\n/**\n * `border-y!` defeats the `divide-y-0` on the mobile tbody, which otherwise\n * zeroes the top and bottom border on every card except the first. An expanded\n * card flattens its bottom edge so the expanded panel attaches flush beneath\n * it.\n *\n * These bindings do not run through the class merger, so each state picks its\n * own utilities rather than emitting conflicting ones.\n */\nconst mobileCardClass = computed<string>(() => {\n  const shared = 'relative flex flex-col border border-y! border-rui-divider overflow-hidden';\n  return get(expanded)\n    ? `${shared} rounded-t-rui-card mb-0`\n    : `${shared} rounded-rui-card mb-3 last:mb-0`;\n});\n</script>\n\n<template>\n  <tr\n    :class=\"[stateClass, rowClass, isMobile ? mobileCardClass : '']\"\n    :aria-selected=\"selectedData ? selected : undefined\"\n    data-id=\"row\"\n  >\n    <!-- Mobile card header: checkbox on the left, pinned action columns on the right -->\n    <td\n      v-if=\"showMobileHeader\"\n      :class=\"compactMobileHeader\n        ? 'absolute top-0 right-0 z-1 flex items-center gap-1 px-2 py-1'\n        : 'flex items-center justify-between gap-2 px-4 py-2 border-b border-rui-divider'\"\n      data-id=\"mobile-card-header\"\n    >\n      <RuiCheckbox\n        v-if=\"selectedData\"\n        :data-id=\"`table-toggle-check-${index}`\"\n        aria-label=\"Select row\"\n        :model-value=\"selected\"\n        :disabled=\"disabled\"\n        :size=\"dense ? 'sm' : undefined\"\n        color=\"primary\"\n        class=\"select-none\"\n        hide-details\n        @update:model-value=\"onSelect($event, rowId, true)\"\n        @click=\"onCheckboxClick($event, rowId, index)\"\n      />\n      <span v-else-if=\"!compactMobileHeader\" />\n\n      <div\n        v-if=\"mobileHeaderColumns.length > 0\"\n        class=\"flex items-center gap-1 min-w-0\"\n      >\n        <template\n          v-for=\"(column, headerIndex) in mobileHeaderColumns\"\n          :key=\"`header-${headerIndex}`\"\n        >\n          <slot\n            v-if=\"itemSlotKeys.has(column.key.toString())\"\n            :name=\"`item.${column.key.toString()}`\"\n            :column=\"column\"\n            :row=\"row\"\n            :index=\"index\"\n          />\n          <RuiExpandButton\n            v-else-if=\"column.key === 'expand'\"\n            :expanded=\"isExpanded(rowId)\"\n            @click=\"onToggleExpand(row)\"\n          />\n          <template v-else>\n            {{ cellValue(row, column.key) }}\n          </template>\n        </template>\n      </div>\n    </td>\n\n    <!-- Desktop checkbox cell -->\n    <td\n      v-else-if=\"selectedData && !isMobile\"\n      :class=\"classes.checkbox\"\n      colspan=\"1\"\n      rowspan=\"1\"\n    >\n      <RuiCheckbox\n        :data-id=\"`table-toggle-check-${index}`\"\n        aria-label=\"Select row\"\n        :model-value=\"selected\"\n        :disabled=\"disabled\"\n        :size=\"dense ? 'sm' : undefined\"\n        color=\"primary\"\n        class=\"select-none\"\n        hide-details\n        @update:model-value=\"onSelect($event, rowId, true)\"\n        @click=\"onCheckboxClick($event, rowId, index)\"\n      />\n    </td>\n\n    <RuiDataTableCell\n      v-for=\"(column, subIndex) in bodyColumns\"\n      :key=\"subIndex\"\n      :column=\"column\"\n      :row=\"row\"\n      :index=\"index\"\n      :row-id=\"rowId\"\n      :style=\"subIndex === 0 ? firstRowInset : undefined\"\n    >\n      <template\n        v-if=\"itemSlotKeys.has(column.key.toString())\"\n        #default=\"slotData\"\n      >\n        <slot\n          :name=\"`item.${column.key.toString()}`\"\n          v-bind=\"slotData\"\n        />\n      </template>\n    </RuiDataTableCell>\n  </tr>\n\n  <!-- opacity only: the rows below move once, at once, rather than sliding with a growing height -->\n  <RuiDataTableExpandedRow\n    v-if=\"panelShown\"\n    class=\"transition-opacity starting:opacity-0 motion-reduce:transition-none\"\n    :class=\"panelClosing ? 'opacity-0 duration-100 ease-in' : 'duration-150 ease-out'\"\n    :row=\"row\"\n    :index=\"index\"\n  >\n    <template\n      v-if=\"slots['expanded-item']\"\n      #expanded-item=\"slotData\"\n    >\n      <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n      <slot\n        name=\"expanded-item\"\n        v-bind=\"slotData\"\n      />\n    </template>\n  </RuiDataTableExpandedRow>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RuiDataTableRow.js","names":["_sfc_main"],"sources":["../../../../src/components/tables/data-table/RuiDataTableRow.vue"],"sourcesContent":["<script lang=\"ts\" setup generic=\"T extends object\">\nimport type { TableColumn } from '@/components/tables/RuiTableHead.vue';\nimport RuiCheckbox from '@/components/forms/checkbox/RuiCheckbox.vue';\nimport { useDataTableColumns, useDataTableExpansion, useDataTableRowIdentity, useDataTableSelection, useDataTableStyling } from '@/components/tables/data-table/context';\nimport RuiDataTableAppendRow from '@/components/tables/data-table/RuiDataTableAppendRow.vue';\nimport RuiDataTableCell from '@/components/tables/data-table/RuiDataTableCell.vue';\nimport RuiDataTableExpandedRow from '@/components/tables/data-table/RuiDataTableExpandedRow.vue';\nimport RuiExpandButton from '@/components/tables/RuiExpandButton.vue';\n\nconst {\n  row,\n  index,\n} = defineProps<{\n  row: T;\n  index: number;\n}>();\n\nconst slots = defineSlots<Partial<\n  Record<`item.${string}`, (props: { column: TableColumn<T>; row: T; index: number }) => any> & {\n    'expanded-item'?: (props: { row: T; index: number }) => any;\n    'row-append'?: (props: { row: T; index: number }) => any;\n  }\n>>();\n\nconst { classes, dense, isMobile } = useDataTableStyling();\nconst { cellValue, columns, itemSlotKeys } = useDataTableColumns<T>();\nconst { isDisabledRow, isSelected, onCheckboxClick, onSelect, selectedData } = useDataTableSelection<T>();\nconst { expandable, isExpanded, onToggleExpand } = useDataTableExpansion<T>();\nconst { getRowId, itemClass } = useDataTableRowIdentity<T>();\n\nconst rowId = computed<T[keyof T]>(() => getRowId(row));\nconst selected = computed<boolean>(() => isSelected(get(rowId)));\nconst disabled = computed<boolean>(() => isDisabledRow(get(rowId)));\nconst expanded = computed<boolean>(() => get(expandable) && !!slots['expanded-item'] && isExpanded(get(rowId)));\n\n/** How long a closing panel stays to fade out; matches its `duration-100`. */\nconst PANEL_LEAVE_MS = 100;\n\nconst reducedMotion = usePreferredReducedMotion();\n\n/**\n * Whether the panel is in the DOM, which outlasts `expanded` by its fade-out.\n *\n * @remarks\n * Not a `<Transition>`: test utilities stub that with an element, which lands inside the consumer's\n * `<tbody>` and shifts every `tr:nth-child` its specs count. The fade-in is CSS `@starting-style`.\n */\nconst panelShown = ref<boolean>(get(expanded));\nconst panelClosing = ref<boolean>(false);\n\nconst { start: finishClosing, stop: cancelClosing } = useTimeoutFn(() => {\n  set(panelShown, false);\n  set(panelClosing, false);\n}, PANEL_LEAVE_MS, { immediate: false });\n\nwatch(expanded, (open) => {\n  if (open) {\n    cancelClosing();\n    set(panelClosing, false);\n    set(panelShown, true);\n    return;\n  }\n  if (!get(panelShown))\n    return;\n  if (get(reducedMotion) === 'reduce') {\n    set(panelShown, false);\n    return;\n  }\n  set(panelClosing, true);\n  finishClosing();\n});\n\nconst rowClass = computed<string>(() => typeof itemClass === 'string' ? itemClass : itemClass(row));\n\n/** Selection wins over the open-panel shade, so a selected row still reads as selected. */\nconst stateClass = computed<string>(() => {\n  if (get(selected))\n    return get(classes).trSelected;\n  if (get(expanded))\n    return get(classes).trExpandedParent;\n  return get(classes).tr;\n});\n\n/** Whether the row has a follow-up row, which reads as the second half of the same item. */\nconst appended = computed<boolean>(() => !!slots['row-append']);\n\n/**\n * The stripe follows the item, not the `<tr>`: counting rows would shade an item and its follow-up\n * differently, and an open panel would flip every stripe below it. The table's `striped` variant\n * shades the marked rows.\n */\nconst stripe = computed<'' | undefined>(() => (index % 2 === 1 ? '' : undefined));\n\n/**\n * The two rows of an item highlight together, whichever one the pointer is over. An open row keeps\n * its band rather than taking the hover, as it does without a follow-up.\n */\nconst pairHoverClass = computed<string>(() => {\n  if (!get(appended) || get(expanded) || get(isMobile))\n    return '';\n  return 'has-[+[data-id=row-append]:hover]:bg-rui-hover';\n});\nconst appendHoverClass = computed<string>(() => {\n  if (get(expanded) || get(isMobile))\n    return '';\n  return '[[data-id=row]:hover+&]:bg-rui-hover';\n});\n\n/**\n * On mobile the follow-up is the bottom of the item's card: square on top, against the card, and\n * rounded below unless an open panel follows it.\n */\nconst mobileAppendClass = computed<string>(() => {\n  const shared = 'block border-x border-b! border-rui-divider overflow-hidden';\n  return get(expanded) ? shared : `${shared} rounded-b-rui-card mb-3`;\n});\n\n/**\n * A column is pinned to the mobile card header when it is flagged\n * `mobileHeader`, typically an action column, or when it is the\n * auto-generated expand column.\n */\nfunction isMobileHeaderColumn(column: TableColumn<T>): boolean {\n  return !!column.mobileHeader || column.key === 'expand';\n}\n\n/**\n * A pinned column only earns a spot in the header if it renders something: the\n * expand toggle, a provided item slot, or a non-empty cell value. Without this,\n * a pinned column with no content, such as an action column whose\n * `#item.action` slot a nested table does not provide, leaves an empty header\n * bar with just its divider line.\n */\nfunction mobileHeaderColumnHasContent(column: TableColumn<T>): boolean {\n  if (column.key === 'expand')\n    return true;\n  if (itemSlotKeys.has(column.key.toString()))\n    return true;\n  const value = cellValue(row, column.key);\n  return value !== undefined && value !== null && value !== '';\n}\n\n/**\n * In the stacked mobile layout, header columns render in the card header row\n * instead of as a label/value pair. Everything else stacks below in the body.\n */\nconst mobileHeaderColumns = computed<TableColumn<T>[]>(() =>\n  get(isMobile) ? get(columns).filter(column => isMobileHeaderColumn(column) && mobileHeaderColumnHasContent(column)) : [],\n);\nconst bodyColumns = computed<TableColumn<T>[]>(() =>\n  get(isMobile) ? get(columns).filter(column => !isMobileHeaderColumn(column)) : get(columns),\n);\nconst showMobileHeader = computed<boolean>(() =>\n  get(isMobile) && (!!get(selectedData) || get(mobileHeaderColumns).length > 0),\n);\n\n/**\n * Without a selection checkbox the header bar would hold only the pinned\n * actions, so they float in the card's top-right corner instead and the first\n * field row makes room for them.\n */\nconst compactMobileHeader = computed<boolean>(() =>\n  get(showMobileHeader) && !get(selectedData) && get(bodyColumns).length > 0,\n);\n\n/** Room for each floating action, about one small icon button wide. */\nconst firstRowInset = computed<Record<string, string> | undefined>(() =>\n  get(compactMobileHeader) ? { paddingRight: `${get(mobileHeaderColumns).length * 2 + 1}rem` } : undefined,\n);\n\n/**\n * `border-y!` defeats the `divide-y-0` on the mobile tbody, which otherwise\n * zeroes the top and bottom border on every card except the first. An expanded\n * card flattens its bottom edge so the expanded panel attaches flush beneath\n * it. A card with a follow-up row drops its bottom border too, so the\n * follow-up continues it with no line between them, as on desktop.\n *\n * These bindings do not run through the class merger, so each state picks its\n * own utilities rather than emitting conflicting ones.\n */\nconst mobileCardClass = computed<string>(() => {\n  if (get(appended))\n    return 'relative flex flex-col border-x border-t! border-rui-divider overflow-hidden rounded-t-rui-card mb-0';\n  const shared = 'relative flex flex-col border border-y! border-rui-divider overflow-hidden';\n  return get(expanded)\n    ? `${shared} rounded-t-rui-card mb-0`\n    : `${shared} rounded-rui-card mb-3 last:mb-0`;\n});\n</script>\n\n<template>\n  <tr\n    :class=\"[stateClass, rowClass, pairHoverClass, isMobile ? mobileCardClass : '']\"\n    :aria-selected=\"selectedData ? selected : undefined\"\n    :data-stripe=\"stripe\"\n    data-id=\"row\"\n  >\n    <!-- Mobile card header: checkbox on the left, pinned action columns on the right -->\n    <td\n      v-if=\"showMobileHeader\"\n      :class=\"compactMobileHeader\n        ? 'absolute top-0 right-0 z-1 flex items-center gap-1 px-2 py-1'\n        : 'flex items-center justify-between gap-2 px-4 py-2 border-b border-rui-divider'\"\n      data-id=\"mobile-card-header\"\n    >\n      <RuiCheckbox\n        v-if=\"selectedData\"\n        :data-id=\"`table-toggle-check-${index}`\"\n        aria-label=\"Select row\"\n        :model-value=\"selected\"\n        :disabled=\"disabled\"\n        :size=\"dense ? 'sm' : undefined\"\n        color=\"primary\"\n        class=\"select-none\"\n        hide-details\n        @update:model-value=\"onSelect($event, rowId, true)\"\n        @click=\"onCheckboxClick($event, rowId, index)\"\n      />\n      <span v-else-if=\"!compactMobileHeader\" />\n\n      <div\n        v-if=\"mobileHeaderColumns.length > 0\"\n        class=\"flex items-center gap-1 min-w-0\"\n      >\n        <template\n          v-for=\"(column, headerIndex) in mobileHeaderColumns\"\n          :key=\"`header-${headerIndex}`\"\n        >\n          <slot\n            v-if=\"itemSlotKeys.has(column.key.toString())\"\n            :name=\"`item.${column.key.toString()}`\"\n            :column=\"column\"\n            :row=\"row\"\n            :index=\"index\"\n          />\n          <RuiExpandButton\n            v-else-if=\"column.key === 'expand'\"\n            :expanded=\"isExpanded(rowId)\"\n            @click=\"onToggleExpand(row)\"\n          />\n          <template v-else>\n            {{ cellValue(row, column.key) }}\n          </template>\n        </template>\n      </div>\n    </td>\n\n    <!-- Desktop checkbox cell -->\n    <td\n      v-else-if=\"selectedData && !isMobile\"\n      :class=\"classes.checkbox\"\n      colspan=\"1\"\n      rowspan=\"1\"\n    >\n      <RuiCheckbox\n        :data-id=\"`table-toggle-check-${index}`\"\n        aria-label=\"Select row\"\n        :model-value=\"selected\"\n        :disabled=\"disabled\"\n        :size=\"dense ? 'sm' : undefined\"\n        color=\"primary\"\n        class=\"select-none\"\n        hide-details\n        @update:model-value=\"onSelect($event, rowId, true)\"\n        @click=\"onCheckboxClick($event, rowId, index)\"\n      />\n    </td>\n\n    <RuiDataTableCell\n      v-for=\"(column, subIndex) in bodyColumns\"\n      :key=\"subIndex\"\n      :column=\"column\"\n      :row=\"row\"\n      :index=\"index\"\n      :row-id=\"rowId\"\n      :style=\"subIndex === 0 ? firstRowInset : undefined\"\n    >\n      <template\n        v-if=\"itemSlotKeys.has(column.key.toString())\"\n        #default=\"slotData\"\n      >\n        <slot\n          :name=\"`item.${column.key.toString()}`\"\n          v-bind=\"slotData\"\n        />\n      </template>\n    </RuiDataTableCell>\n  </tr>\n\n  <!-- no divider above: with its row it is one item, sharing the row's state, stripe and hover -->\n  <RuiDataTableAppendRow\n    v-if=\"slots['row-append']\"\n    class=\"border-t-0!\"\n    :class=\"[stateClass, rowClass, appendHoverClass, isMobile ? mobileAppendClass : '']\"\n    :data-stripe=\"stripe\"\n    :row=\"row\"\n    :index=\"index\"\n  >\n    <template #row-append=\"slotData\">\n      <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n      <slot\n        name=\"row-append\"\n        v-bind=\"slotData\"\n      />\n    </template>\n  </RuiDataTableAppendRow>\n\n  <!-- opacity only: the rows below move once, at once, rather than sliding with a growing height -->\n  <RuiDataTableExpandedRow\n    v-if=\"panelShown\"\n    class=\"transition-opacity starting:opacity-0 motion-reduce:transition-none\"\n    :class=\"panelClosing ? 'opacity-0 duration-100 ease-in' : 'duration-150 ease-out'\"\n    :row=\"row\"\n    :index=\"index\"\n  >\n    <template\n      v-if=\"slots['expanded-item']\"\n      #expanded-item=\"slotData\"\n    >\n      <!-- eslint-disable-next-line vue/require-explicit-slots -- defined via Partial<Record<...>> in defineSlots -->\n      <slot\n        name=\"expanded-item\"\n        v-bind=\"slotData\"\n      />\n    </template>\n  </RuiDataTableExpandedRow>\n</template>\n"],"mappings":""}

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

@@ -1,4 +1,4 @@
-import type { TableColumn } from '../RuiTableHead.vue';
+import type { TableColumn } from '../RuiTableHead.vue.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<{
         row: T;
@@ -17,6 +17,10 @@ declare const __VLS_export: <T extends object>(__VLS_props: NonNullable<Awaited<
             row: T;
             index: number;
         }) => any;
+        'row-append'?: (props: {
+            row: T;
+            index: number;
+        }) => any;
     }>;
     emit: {};
 }>) => import("vue").VNode & {