@chelone/vue 0.6.0 → 0.7.0

package/dist/components/admin/list/data-table-context.js

@@ -1,39 +1,52 @@
-import { defineComponent, provide, onMounted, onUpdated, inject } from "vue";
-const DataTablePassKey = /* @__PURE__ */ Symbol(
-  "chelone-data-table-pass"
-);
+import { defineComponent, inject, onMounted, onUpdated, provide } from "vue";
+// src/components/admin/list/data-table-context.ts
+/** The provide/inject key for the current render pass (default `"data"`). */
+var DataTablePassKey = Symbol("chelone-data-table-pass");
+/** Read the ambient render pass (`"data"` when no provider is above). */
 function useDataTablePass() {
-  return inject(DataTablePassKey, "data");
+	return inject(DataTablePassKey, "data");
 }
-const PassProvider = defineComponent({
-  name: "DataTablePassProvider",
-  props: {
-    pass: { type: String, required: true }
-  },
-  setup(props, { slots }) {
-    provide(DataTablePassKey, props.pass);
-    return () => slots.default?.();
-  }
+/**
+* A renderless provider that stamps a render pass onto its slot content. Used by
+* `<DataTable>` to wrap the header render of the columns in `pass="header"`.
+*/
+var PassProvider = defineComponent({
+	name: "DataTablePassProvider",
+	props: { pass: {
+		type: String,
+		required: true
+	} },
+	setup(props, { slots }) {
+		provide(DataTablePassKey, props.pass);
+		return () => slots.default?.();
+	}
 });
-const ColumnsOutlet = defineComponent({
-  name: "DataTableColumnsOutlet",
-  props: {
-    render: { type: Function, required: true },
-    report: { type: Function, default: void 0 }
-  },
-  setup(props) {
-    onMounted(() => props.report?.());
-    onUpdated(() => props.report?.());
-    return () => props.render();
-  }
+/**
+* Renders the columns `<DataTable>` chose to show. A slot is called inside the
+* component that renders it, so the filter and reorder run in `render` here,
+* and a column added or a store write re-renders only this outlet.
+*
+* `report` runs after the outlet mounts and after each update, never during
+* render, so the header outlet can publish the declared columns without a
+* write in the render path.
+*/
+var ColumnsOutlet = defineComponent({
+	name: "DataTableColumnsOutlet",
+	props: {
+		render: {
+			type: Function,
+			required: true
+		},
+		report: {
+			type: Function,
+			default: void 0
+		}
+	},
+	setup(props) {
+		onMounted(() => props.report?.());
+		onUpdated(() => props.report?.());
+		return () => props.render();
+	}
 });
-const DataTableRowsKey = /* @__PURE__ */ Symbol(
-  "chelone-data-table-rows"
-);
-export {
-  ColumnsOutlet,
-  DataTablePassKey,
-  DataTableRowsKey,
-  PassProvider,
-  useDataTablePass
-};
+var DataTableRowsKey = Symbol("chelone-data-table-rows");
+export { ColumnsOutlet, DataTablePassKey, DataTableRowsKey, PassProvider, useDataTablePass };

package/dist/components/admin/list/data-table-number-col.js

@@ -0,0 +1,4 @@
+import data_table_number_col_vue_vue_type_script_setup_true_lang_default from "./data-table-number-col.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/list/data-table-number-col.vue
+var data_table_number_col_default = data_table_number_col_vue_vue_type_script_setup_true_lang_default;
+export { data_table_number_col_default as default };

package/dist/components/admin/list/data-table-number-col.vue.d.ts

@@ -8,5 +8,6 @@ export interface DataTableNumberColProps extends Omit<DataTableColProps, "source
     /** `Intl.NumberFormatOptions` (currency, percent, fraction digits…). */
     options?: Intl.NumberFormatOptions;
 }
-declare const _default: import("vue").DefineComponent<DataTableNumberColProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DataTableNumberColProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
 export default _default;
+declare const __VLS_export: import("vue").DefineComponent<DataTableNumberColProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DataTableNumberColProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/admin/list/data-table-number-col.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,61 @@
+import { cn } from "../../../lib/utils.js";
+import number_field_default from "../fields/number-field.js";
+import data_table_col_default from "./data-table-col.js";
+import { createBlock, createVNode, defineComponent, normalizeClass, openBlock, unref, withCtx } from "vue";
+// src/components/admin/list/data-table-number-col.vue?vue&type=script&setup=true&lang.ts
+var data_table_number_col_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "data-table-number-col",
+	props: {
+		source: {},
+		locales: {},
+		options: {},
+		label: {},
+		class: {},
+		disableSort: { type: Boolean },
+		sortByOrder: {},
+		headerClass: {},
+		cellClass: {},
+		conditionalClass: { type: Function }
+	},
+	setup(__props) {
+		/**
+		* `<DataTableNumberCol>` — a right-aligned, number-formatted column, the Vue
+		* analog of `@chelone/react`'s `DataTable.NumberCol`: a `<DataTableCol>` whose
+		* cell is a `<NumberField>`.
+		*/
+		const props = __props;
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(data_table_col_default, {
+				source: __props.source,
+				label: __props.label,
+				class: normalizeClass(props.class),
+				"disable-sort": __props.disableSort,
+				"sort-by-order": __props.sortByOrder,
+				"header-class": unref(cn)("text-right", __props.headerClass),
+				"cell-class": unref(cn)("text-right", __props.cellClass),
+				"conditional-class": __props.conditionalClass
+			}, {
+				default: withCtx(() => [createVNode(number_field_default, {
+					source: __props.source,
+					locales: __props.locales,
+					options: __props.options
+				}, null, 8, [
+					"source",
+					"locales",
+					"options"
+				])]),
+				_: 1
+			}, 8, [
+				"source",
+				"label",
+				"class",
+				"disable-sort",
+				"sort-by-order",
+				"header-class",
+				"cell-class",
+				"conditional-class"
+			]);
+		};
+	}
+});
+export { data_table_number_col_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/list/data-table-row.js

@@ -0,0 +1,4 @@
+import data_table_row_vue_vue_type_script_setup_true_lang_default from "./data-table-row.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/list/data-table-row.vue
+var data_table_row_default = data_table_row_vue_vue_type_script_setup_true_lang_default;
+export { data_table_row_default as default };

package/dist/components/admin/list/data-table-row.vue.d.ts

@@ -17,12 +17,15 @@ type __VLS_Props = {
     record: LooseRecord;
     hasBulkActions?: boolean;
 };
-declare var __VLS_44: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_44) => any;
+declare const __VLS_template: () => {
+    __VLS_Slots: {
+        default?: (props: {}) => any;
+    };
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+type __VLS_Slots = ReturnType<typeof __VLS_template>['__VLS_Slots'];
+declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
 export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {

package/dist/components/admin/list/data-table-row.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,124 @@
+import { useListContext } from "../../../list/list-context.js";
+import { RecordContextKey } from "../../../record/record-context.js";
+import { useResourceContext } from "../../../resource-context.js";
+import { useRouterAdapterOptional } from "../../../router/adapter.js";
+import { useCreatePath } from "../../../router/nav-composables.js";
+import button_default from "../../ui/button.js";
+import checkbox_default from "../../ui/checkbox.js";
+import { TableCell, TableRow } from "../../ui/table.js";
+import { DataTablePassKey, DataTableRowsKey } from "./data-table-context.js";
+import { ChevronDownIcon } from "../buttons/icons.js";
+import { ChevronRightIcon } from "./list-icons.js";
+import { computed, createBlock, createCommentVNode, createVNode, defineComponent, inject, normalizeClass, openBlock, provide, ref, renderSlot, unref, watch, withCtx, withModifiers } from "vue";
+// src/components/admin/list/data-table-row.vue?vue&type=script&setup=true&lang.ts
+var data_table_row_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "data-table-row",
+	props: {
+		record: {},
+		hasBulkActions: { type: Boolean }
+	},
+	setup(__props) {
+		/**
+		* `<DataTableRow>` — one body row of a `<DataTable>`, the Vue analog of
+		* `@chelone/react`'s `DataTableRow`. It provides the row's record (so slotted
+		* field/`<DataTableCol>` children resolve it via `RecordContext`) and stamps the
+		* `"data"` render pass, then renders the columns inside a `<TableRow>`.
+		*
+		* Row-click navigation to the record's edit page is wired when a router adapter
+		* is present (mirrors the React twin's `rowClick="edit"` default); without one
+		* the row is inert (unit tests, no router).
+		*
+		* Selection (V3-b): when `hasBulkActions` is set the row renders a leading
+		* checkbox bound to the ambient list selection (`selectedIds` / `toggleItem`);
+		* toggling it stops propagation so it never triggers the row-click navigation.
+		*/
+		const props = __props;
+		const recordRef = ref(props.record);
+		watch(() => props.record, (next) => {
+			recordRef.value = next;
+		});
+		provide(RecordContextKey, recordRef);
+		provide(DataTablePassKey, "data");
+		const list = useListContext();
+		const recordId = computed(() => props.record.id);
+		const isSelected = computed(() => list.selectedIds?.includes(recordId.value) ?? false);
+		function onToggleSelect() {
+			if (recordId.value == null) return;
+			list.toggleItem(recordId.value);
+		}
+		const adapter = useRouterAdapterOptional();
+		const resource = useResourceContext();
+		const navigate = adapter?.useNavigate();
+		const createPath = adapter ? useCreatePath() : void 0;
+		const rows = inject(DataTableRowsKey, null);
+		const link = computed(() => {
+			const rowClick = rows?.rowClick.value ?? "edit";
+			return typeof rowClick === "function" ? rowClick(props.record, recordId.value) : rowClick;
+		});
+		const expandable = computed(() => !!rows?.expandEnabled.value && rows.canExpand(props.record));
+		const isExpanded = computed(() => rows?.expandedIds.value.includes(recordId.value) ?? false);
+		const clickable = computed(() => {
+			if (link.value === false) return false;
+			if (link.value === "expand") return expandable.value;
+			if (link.value === "toggleSelection") return true;
+			return !!adapter;
+		});
+		function onRowClick() {
+			if (!clickable.value || recordId.value == null) return;
+			if (link.value === "expand") return rows?.toggleExpand(recordId.value);
+			if (link.value === "toggleSelection") return onToggleSelect();
+			if (!navigate || !createPath || !resource || !link.value) return;
+			navigate(createPath({
+				type: link.value,
+				resource,
+				id: recordId.value
+			}));
+		}
+		function onToggleExpand() {
+			if (recordId.value != null) rows?.toggleExpand(recordId.value);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(TableRow), {
+				class: normalizeClass(clickable.value ? "cursor-pointer" : ""),
+				"data-slot": "data-table-row",
+				onClick: onRowClick
+			}, {
+				default: withCtx(() => [
+					__props.hasBulkActions ? (openBlock(), createBlock(unref(TableCell), {
+						key: 0,
+						class: "w-8",
+						onClick: _cache[0] || (_cache[0] = withModifiers(() => {}, ["stop"]))
+					}, {
+						default: withCtx(() => [createVNode(checkbox_default, {
+							"model-value": isSelected.value,
+							"aria-label": "Select row",
+							"onUpdate:modelValue": onToggleSelect
+						}, null, 8, ["model-value"])]),
+						_: 1
+					})) : createCommentVNode("", true),
+					unref(rows)?.expandEnabled.value ? (openBlock(), createBlock(unref(TableCell), {
+						key: 1,
+						class: "w-8 p-0"
+					}, {
+						default: withCtx(() => [expandable.value ? (openBlock(), createBlock(button_default, {
+							key: 0,
+							variant: "ghost",
+							size: "icon",
+							class: "size-7",
+							"aria-label": isExpanded.value ? "Collapse row" : "Expand row",
+							"aria-expanded": isExpanded.value,
+							onClick: withModifiers(onToggleExpand, ["stop"])
+						}, {
+							default: withCtx(() => [isExpanded.value ? (openBlock(), createBlock(unref(ChevronDownIcon), { key: 0 })) : (openBlock(), createBlock(unref(ChevronRightIcon), { key: 1 }))]),
+							_: 1
+						}, 8, ["aria-label", "aria-expanded"])) : createCommentVNode("", true)]),
+						_: 1
+					})) : createCommentVNode("", true),
+					renderSlot(_ctx.$slots, "default")
+				]),
+				_: 3
+			}, 8, ["class"]);
+		};
+	}
+});
+export { data_table_row_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/list/data-table.js

@@ -0,0 +1,4 @@
+import data_table_vue_vue_type_script_setup_true_lang_default from "./data-table.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/list/data-table.vue
+var data_table_default = data_table_vue_vue_type_script_setup_true_lang_default;
+export { data_table_default as default };

package/dist/components/admin/list/data-table.vue.d.ts

@@ -28,7 +28,9 @@ export interface DataTableProps {
     /** Column ids hidden until a choice is stored. */
     defaultHiddenColumns?: string[];
 }
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DataTableProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DataTableProps> & Readonly<{}>, {
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<DataTableProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DataTableProps> & Readonly<{}>, {
     pagination: boolean;
     bulkActions: boolean;
     rowClick: DataTableRowClick;
@@ -42,7 +44,6 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<DataTableP
 } & {
     bulkActions?: (props: {}) => any;
 }>;
-export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;

package/dist/components/admin/list/data-table.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,240 @@
+import { flattenVNodes, keyByColumnId } from "../../../lib/vnode-children.js";
+import { useListContext } from "../../../list/list-context.js";
+import { useDataTableColumns } from "../../../list/use-data-table-columns.js";
+import { useResourceContext } from "../../../resource-context.js";
+import checkbox_default from "../../ui/checkbox.js";
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../../ui/table.js";
+import bulk_actions_toolbar_default from "./bulk-actions-toolbar.js";
+import button_default from "../../ui/button.js";
+import { ColumnsOutlet, DataTableRowsKey, PassProvider } from "./data-table-context.js";
+import data_table_row_default from "./data-table-row.js";
+import { ChevronsUpDownIcon } from "./list-icons.js";
+import list_pagination_default from "./list-pagination.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, provide, ref, renderList, renderSlot, unref, useSlots, withCtx, withModifiers } from "vue";
+import { arrangeColumns, defaultDataTableStoreKey, getDataTableColumnId } from "@chelone/core";
+// src/components/admin/list/data-table.vue?vue&type=script&setup=true&lang.ts
+var data_table_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	__name: "data-table",
+	props: {
+		class: {},
+		bulkActions: {
+			type: Boolean,
+			default: false
+		},
+		pagination: {
+			type: Boolean,
+			default: true
+		},
+		rowClick: {
+			type: [
+				String,
+				Boolean,
+				Function
+			],
+			default: "edit"
+		},
+		expandSingle: {
+			type: Boolean,
+			default: false
+		},
+		isRowExpandable: {},
+		rowClass: {},
+		storeKey: {},
+		defaultHiddenColumns: {}
+	},
+	setup(__props) {
+		/**
+		* `<DataTable>` — a table over the ambient list surface, the Vue analog of
+		* `@chelone/react`'s `list/data-table.tsx`. Reads `useListContext` (published by
+		* `<List>`), renders a header row from the `<DataTableCol>` children (in the
+		* `"header"` pass) and one `<DataTableRow>` per record (each providing the row
+		* record + the `"data"` pass).
+		*
+		* Selection + pagination (V3-b): when bulk actions are enabled — the
+		* `:bulk-actions` prop is set OR a `#bulkActions` slot is passed — a leading
+		* select-all/select-row checkbox column is added and a `<BulkActionsToolbar>`
+		* (carrying the `#bulkActions` slot) is rendered below the table; it surfaces on
+		* selection. `<ListPagination>` renders below the table by default (opt out with
+		* `:pagination="false"`). Both read the SAME ambient `useListContext`.
+		*
+		* Column API (mirrors React's `DataTable.Col`): pass `<DataTableCol>` children.
+		* The named export `DataTableCol` is the Vue equivalent of `DataTable.Col`.
+		*/
+		const props = __props;
+		const slots = useSlots();
+		const list = useListContext();
+		const hasBulkActions = computed(() => props.bulkActions || slots.bulkActions != null);
+		const resource = useResourceContext();
+		const expandEnabled = computed(() => slots.expand != null);
+		const expandedIds = ref([]);
+		const canExpand = (record) => props.isRowExpandable?.(record) ?? true;
+		function toggleExpand(id) {
+			if (expandedIds.value.includes(id)) expandedIds.value = expandedIds.value.filter((x) => x !== id);
+			else expandedIds.value = props.expandSingle ? [id] : [...expandedIds.value, id];
+		}
+		provide(DataTableRowsKey, {
+			rowClick: computed(() => props.rowClick),
+			expandEnabled,
+			expandedIds,
+			toggleExpand,
+			canExpand
+		});
+		const rows = computed(() => list.data ?? []);
+		const isEmpty = computed(() => !list.isPending && rows.value.length === 0);
+		const rowId = (record) => record.id;
+		const rowKey = (record) => String(record.id);
+		const selectableIds = computed(() => rows.value.map((r) => r.id));
+		const allSelected = computed(() => {
+			const selected = list.selectedIds ?? [];
+			return selected.length > 0 && selectableIds.value.length > 0 && selectableIds.value.every((id) => selected.includes(id));
+		});
+		const anyExpanded = computed(() => rows.value.some((r) => expandedIds.value.includes(rowId(r))));
+		function handleToggleExpandAll() {
+			expandedIds.value = anyExpanded.value ? [] : rows.value.filter(canExpand).map(rowId);
+		}
+		const columnProps = (node) => node.props ?? {};
+		const { hidden, order, publish } = useDataTableColumns({
+			storeKey: () => props.storeKey ?? defaultDataTableStoreKey(resource ?? ""),
+			defaultHiddenColumns: () => props.defaultHiddenColumns
+		});
+		const declare = (nodes, ids) => {
+			const defaults = props.defaultHiddenColumns ?? [];
+			const seen = /* @__PURE__ */ new Set();
+			const declared = [];
+			nodes.forEach((node, index) => {
+				const id = ids[index];
+				if (id === void 0 || seen.has(id)) return;
+				seen.add(id);
+				const { source, label } = columnProps(node);
+				declared.push({
+					id,
+					...typeof source === "string" && { source },
+					...typeof label === "string" && { label },
+					defaultHidden: defaults.includes(id)
+				});
+			});
+			return declared;
+		};
+		let declaredColumns = [];
+		function arrangedColumns() {
+			const nodes = flattenVNodes(slots.default?.() ?? []);
+			const ids = nodes.map((node) => getDataTableColumnId(columnProps(node)));
+			declaredColumns = declare(nodes, ids);
+			const shown = arrangeColumns(ids, {
+				hidden: hidden.value,
+				order: order.value
+			});
+			return keyByColumnId(nodes, ids, shown);
+		}
+		const reportColumns = () => publish(declaredColumns);
+		const columnCount = () => arrangedColumns().length + (hasBulkActions.value ? 1 : 0) + (expandEnabled.value ? 1 : 0);
+		function handleToggleSelectAll(checked) {
+			const selected = list.selectedIds ?? [];
+			if (checked) list.select(selected.concat(selectableIds.value.filter((id) => !selected.includes(id))));
+			else list.select(selected.filter((id) => !selectableIds.value.includes(id)));
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", {
+				class: normalizeClass(props.class),
+				"data-slot": "data-table"
+			}, [
+				createVNode(unref(Table), null, {
+					default: withCtx(() => [createVNode(unref(TableHeader), null, {
+						default: withCtx(() => [createVNode(unref(TableRow), null, {
+							default: withCtx(() => [
+								hasBulkActions.value ? (openBlock(), createBlock(unref(TableHead), {
+									key: 0,
+									class: "w-8"
+								}, {
+									default: withCtx(() => [createVNode(checkbox_default, {
+										"model-value": allSelected.value,
+										"aria-label": "Select all rows on this page",
+										"onUpdate:modelValue": handleToggleSelectAll
+									}, null, 8, ["model-value"])]),
+									_: 1
+								})) : createCommentVNode("", true),
+								expandEnabled.value ? (openBlock(), createBlock(unref(TableHead), {
+									key: 1,
+									class: "w-8"
+								}, {
+									default: withCtx(() => [!__props.expandSingle ? (openBlock(), createBlock(button_default, {
+										key: 0,
+										variant: "ghost",
+										size: "icon",
+										class: "size-7",
+										"aria-label": anyExpanded.value ? "Collapse all rows" : "Expand all rows",
+										onClick: withModifiers(handleToggleExpandAll, ["stop"])
+									}, {
+										default: withCtx(() => [createVNode(unref(ChevronsUpDownIcon))]),
+										_: 1
+									}, 8, ["aria-label"])) : createCommentVNode("", true)]),
+									_: 1
+								})) : createCommentVNode("", true),
+								createVNode(unref(PassProvider), { pass: "header" }, {
+									default: withCtx(() => [createVNode(unref(ColumnsOutlet), {
+										render: () => arrangedColumns(),
+										report: reportColumns
+									}, null, 8, ["render"])]),
+									_: 1
+								})
+							]),
+							_: 1
+						})]),
+						_: 1
+					}), createVNode(unref(TableBody), null, {
+						default: withCtx(() => [unref(list).isPending ? (openBlock(), createBlock(unref(TableRow), { key: 0 }, {
+							default: withCtx(() => [createVNode(unref(TableCell), { "data-slot": "data-table-loading" }, {
+								default: withCtx(() => [..._cache[0] || (_cache[0] = [createTextVNode("Loading…", -1)])]),
+								_: 1
+							})]),
+							_: 1
+						})) : isEmpty.value ? (openBlock(), createBlock(unref(TableRow), { key: 1 }, {
+							default: withCtx(() => [createVNode(unref(TableCell), { "data-slot": "data-table-empty" }, {
+								default: withCtx(() => [..._cache[1] || (_cache[1] = [createTextVNode("No results found.", -1)])]),
+								_: 1
+							})]),
+							_: 1
+						})) : (openBlock(true), createElementBlock(Fragment, { key: 2 }, renderList(rows.value, (record, index) => {
+							return openBlock(), createElementBlock(Fragment, { key: rowKey(record) }, [createVNode(data_table_row_default, {
+								record,
+								"has-bulk-actions": hasBulkActions.value,
+								class: normalizeClass(__props.rowClass?.(record, index) || void 0)
+							}, {
+								default: withCtx(() => [createVNode(unref(ColumnsOutlet), { render: () => arrangedColumns() }, null, 8, ["render"])]),
+								_: 1
+							}, 8, [
+								"record",
+								"has-bulk-actions",
+								"class"
+							]), expandEnabled.value && canExpand(record) && expandedIds.value.includes(rowId(record)) ? (openBlock(), createBlock(unref(TableRow), {
+								key: 0,
+								"data-slot": "data-table-expand-panel"
+							}, {
+								default: withCtx(() => [createVNode(unref(TableCell), { colspan: columnCount() }, {
+									default: withCtx(() => [renderSlot(_ctx.$slots, "expand", {
+										id: rowId(record),
+										record,
+										resource: unref(resource) ?? ""
+									})]),
+									_: 2
+								}, 1032, ["colspan"])]),
+								_: 2
+							}, 1024)) : createCommentVNode("", true)], 64);
+						}), 128))]),
+						_: 3
+					})]),
+					_: 3
+				}),
+				__props.pagination ? (openBlock(), createBlock(list_pagination_default, {
+					key: 0,
+					class: "mt-2"
+				})) : createCommentVNode("", true),
+				hasBulkActions.value ? (openBlock(), createBlock(bulk_actions_toolbar_default, { key: 1 }, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "bulkActions")]),
+					_: 3
+				})) : createCommentVNode("", true)
+			], 2);
+		};
+	}
+});
+export { data_table_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/admin/list/filter-form.js

@@ -0,0 +1,4 @@
+import filter_form_vue_vue_type_script_setup_true_lang_default from "./filter-form.vue_vue_type_script_setup_true_lang.js";
+// src/components/admin/list/filter-form.vue
+var filter_form_default = filter_form_vue_vue_type_script_setup_true_lang_default;
+export { filter_form_default as default };

package/dist/components/admin/list/filter-form.vue.d.ts

@@ -18,10 +18,11 @@ export interface FilterFormProps {
      */
     filters?: FilterFormEntry[];
 }
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<FilterFormProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<FilterFormProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<FilterFormProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<FilterFormProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: (props: {}) => any;
 }>;
-export default _default;
 type __VLS_WithSlots<T, S> = T & {
     new (): {
         $slots: S;