@atscript/vue-table 0.1.58

package/dist/as-table-base-VIz-B_6_.cjs

@@ -0,0 +1,651 @@
+const require_use_table_state = require("./use-table-state-MU-vuzui.cjs");
+const require_as_table_status = require("./as-table-status-DWYoJIMC.cjs");
+const require_get_cell_value = require("./get-cell-value-CZSVfDLg.cjs");
+let vue = require("vue");
+let _atscript_ui_table = require("@atscript/ui-table");
+let _vueuse_core = require("@vueuse/core");
+let reka_ui = require("reka-ui");
+let _tanstack_vue_virtual = require("@tanstack/vue-virtual");
+//#region src/components/internal/as-table-virtualizer.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1$1 = {
+	key: 0,
+	"aria-hidden": "true"
+};
+const _hoisted_2$1 = {
+	key: 1,
+	"aria-hidden": "true"
+};
+//#endregion
+//#region src/components/internal/as-table-virtualizer.vue
+var as_table_virtualizer_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	__name: "as-table-virtualizer",
+	props: {
+		options: {
+			type: Array,
+			required: true
+		},
+		estimateSize: {
+			type: Number,
+			required: false,
+			default: 40
+		},
+		overscan: {
+			type: Number,
+			required: false,
+			default: 5
+		},
+		bypass: {
+			type: Boolean,
+			required: false
+		},
+		scrollPaddingStart: {
+			type: Number,
+			required: false,
+			default: 0
+		}
+	},
+	setup(__props, { expose: __expose }) {
+		const props = __props;
+		const parentEl = (0, _vueuse_core.useParentElement)();
+		const virtualizer = (0, _tanstack_vue_virtual.useVirtualizer)({
+			get count() {
+				return props.options.length;
+			},
+			estimateSize() {
+				return props.estimateSize;
+			},
+			getScrollElement() {
+				return parentEl.value?.closest("[data-virtual-scroll]");
+			},
+			overscan: props.overscan,
+			get scrollPaddingStart() {
+				return props.scrollPaddingStart;
+			}
+		});
+		const virtualItems = (0, vue.computed)(() => virtualizer.value.getVirtualItems());
+		const tailFillCount = (0, vue.computed)(() => {
+			const items = virtualItems.value;
+			if (items.length === 0) return 0;
+			const last = items[items.length - 1];
+			const remaining = props.options.length - 1 - last.index;
+			if (remaining <= 0 || remaining > props.overscan) return 0;
+			return virtualizer.value.getTotalSize() - last.end <= (remaining + 1) * props.estimateSize ? remaining : 0;
+		});
+		const virtualizedItems = (0, vue.computed)(() => {
+			const items = virtualItems.value;
+			if (tailFillCount.value === 0) return items.map((vItem) => ({
+				item: props.options[vItem.index],
+				index: vItem.index
+			}));
+			const result = [];
+			for (const vItem of items) result.push({
+				item: props.options[vItem.index],
+				index: vItem.index
+			});
+			const start = items[items.length - 1].index + 1;
+			for (let i = start; i < props.options.length; i++) result.push({
+				item: props.options[i],
+				index: i
+			});
+			return result;
+		});
+		const paddingTop = (0, vue.computed)(() => {
+			const items = virtualItems.value;
+			if (items.length >= props.options.length) return 0;
+			return items[0]?.start ?? 0;
+		});
+		const paddingBottom = (0, vue.computed)(() => {
+			const items = virtualItems.value;
+			if (items.length === 0) return 0;
+			if (items.length + tailFillCount.value >= props.options.length) return 0;
+			return virtualizer.value.getTotalSize() - items[items.length - 1].end;
+		});
+		__expose({ scrollToIndex(index, opts) {
+			if (props.bypass) return;
+			virtualizer.value.scrollToIndex(index, { align: opts?.align ?? "auto" });
+		} });
+		return (_ctx, _cache) => {
+			return __props.bypass ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(reka_ui.Primitive), { key: 0 }, {
+				default: (0, vue.withCtx)(() => [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(__props.options, (item, index) => {
+					return (0, vue.renderSlot)(_ctx.$slots, "default", (0, vue.mergeProps)({ key: index }, { ref_for: true }, {
+						item,
+						index,
+						spaceBefore: void 0
+					}));
+				}), 128))]),
+				_: 3
+			})) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(reka_ui.Primitive), { key: 1 }, {
+				default: (0, vue.withCtx)(() => [
+					paddingTop.value > 0 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("tr", _hoisted_1$1, [(0, vue.createElementVNode)("td", { style: (0, vue.normalizeStyle)({
+						height: `${paddingTop.value}px`,
+						padding: "0",
+						border: "none"
+					}) }, null, 4)])) : (0, vue.createCommentVNode)("v-if", true),
+					((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)(virtualizedItems.value, (vItem) => {
+						return (0, vue.renderSlot)(_ctx.$slots, "default", (0, vue.mergeProps)({ key: vItem.index }, { ref_for: true }, {
+							item: vItem.item,
+							index: vItem.index,
+							spaceBefore: void 0
+						}));
+					}), 128)),
+					paddingBottom.value > 0 ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("tr", _hoisted_2$1, [(0, vue.createElementVNode)("td", { style: (0, vue.normalizeStyle)({
+						height: `${paddingBottom.value}px`,
+						padding: "0",
+						border: "none"
+					}) }, null, 4)])) : (0, vue.createCommentVNode)("v-if", true)
+				]),
+				_: 3
+			}));
+		};
+	}
+});
+//#endregion
+//#region src/components/internal/as-table-base.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1 = [
+	"role",
+	"aria-rowcount",
+	"aria-multiselectable"
+];
+const _hoisted_2 = {
+	key: 0,
+	class: "as-td-select"
+};
+const _hoisted_3 = { class: "as-table-checkbox" };
+const _hoisted_4 = { key: 0 };
+const _hoisted_5 = {
+	key: 3,
+	class: "as-td-filler"
+};
+const _hoisted_6 = [
+	"id",
+	"aria-rowindex",
+	"aria-selected",
+	"onClick",
+	"onDblclick"
+];
+const _hoisted_7 = {
+	key: 0,
+	class: "as-td-select",
+	role: "gridcell"
+};
+const _hoisted_8 = {
+	key: 0,
+	class: "as-table-checkbox-tick",
+	"aria-hidden": "true"
+};
+const _hoisted_9 = {
+	key: 0,
+	role: "gridcell"
+};
+const _hoisted_10 = {
+	key: 3,
+	class: "as-td-filler",
+	role: "gridcell"
+};
+const SCROLL_TOL = 1.5;
+//#endregion
+//#region src/components/internal/as-table-base.vue
+var as_table_base_default = /* @__PURE__ */ (0, vue.defineComponent)({
+	__name: "as-table-base",
+	props: {
+		columns: {
+			type: Array,
+			required: true
+		},
+		rows: {
+			type: Array,
+			required: true
+		},
+		sorters: {
+			type: Array,
+			required: true
+		},
+		selectedRows: {
+			type: Array,
+			required: false
+		},
+		select: {
+			type: String,
+			required: false,
+			default: "none"
+		},
+		renderMode: {
+			type: String,
+			required: false,
+			default: "standalone"
+		},
+		rowValueFn: {
+			type: Function,
+			required: false
+		},
+		querying: {
+			type: Boolean,
+			required: false
+		},
+		queryError: {
+			type: [Error, null],
+			required: false
+		},
+		onRetry: {
+			type: Function,
+			required: false
+		},
+		stickyHeader: {
+			type: Boolean,
+			required: false,
+			default: true
+		},
+		virtualRowHeight: {
+			type: Number,
+			required: false
+		},
+		virtualOverscan: {
+			type: Number,
+			required: false,
+			default: 5
+		},
+		filters: {
+			type: Object,
+			required: false
+		},
+		searchTerm: {
+			type: String,
+			required: false
+		},
+		onClearFilters: {
+			type: Function,
+			required: false
+		},
+		columnMenu: {
+			type: Object,
+			required: false
+		},
+		stretch: {
+			type: Boolean,
+			required: false,
+			default: true
+		},
+		reorderable: {
+			type: Boolean,
+			required: false,
+			default: true
+		},
+		resizable: {
+			type: Boolean,
+			required: false,
+			default: true
+		},
+		columnMinWidth: {
+			type: Number,
+			required: false,
+			default: 48
+		},
+		columnWidths: {
+			type: Object,
+			required: false,
+			default: () => ({})
+		}
+	},
+	emits: [
+		"sort",
+		"hide",
+		"filter",
+		"filters-off",
+		"row-click",
+		"row-dblclick",
+		"select-all",
+		"deselect-all",
+		"reorder",
+		"resize",
+		"reset-width"
+	],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const ctx = require_use_table_state.useTableContextOptional();
+		const { resolve: cellResolver, hasAnyCellBindings } = require_as_table_status.useCellResolver(() => ctx?.state.tableDef.value ?? null);
+		const cellComponents = require_as_table_status.useCellComponents(() => props.columns);
+		const isStandalone = (0, vue.computed)(() => props.renderMode === "standalone");
+		const isCombobox = (0, vue.computed)(() => props.renderMode === "combobox");
+		const isListbox = (0, vue.computed)(() => props.renderMode === "listbox");
+		const isRekaWrapped = (0, vue.computed)(() => isCombobox.value || isListbox.value);
+		const hasValue = (0, vue.computed)(() => isRekaWrapped.value || props.select !== "none");
+		const hasActiveFilters = (0, vue.computed)(() => props.filters ? (0, _atscript_ui_table.filledFilterCount)(props.filters) > 0 : false);
+		const showSelectAllCheckbox = (0, vue.computed)(() => isStandalone.value && props.select === "multi" && !!props.selectedRows);
+		const selectAllState = (0, vue.computed)(() => {
+			if (!showSelectAllCheckbox.value) return void 0;
+			const sel = props.selectedRows ?? [];
+			if (sel.length === 0) return "none";
+			if (sel.length === props.rows.length && props.rows.length > 0) return "all";
+			return "some";
+		});
+		const emit = __emit;
+		const slots = (0, vue.useSlots)();
+		const cellSlotFlags = (0, vue.computed)(() => {
+			const out = {};
+			for (const c of props.columns) out[c.path] = !!slots[`cell-${c.path}`];
+			return out;
+		});
+		function isPkSelected(row) {
+			if (!ctx || !props.rowValueFn) return false;
+			return ctx.state.isPkSelected(props.rowValueFn(row));
+		}
+		function ariaSelectedFor(row) {
+			if (props.select === "none") return void 0;
+			return isPkSelected(row) ? "true" : "false";
+		}
+		function onRowClick(row, event, index) {
+			emit("row-click", row, event);
+			if (!isStandalone.value) return;
+			if (ctx) ctx.state.setActive(index);
+			if (props.select === "none") return;
+			if (!ctx) return;
+			ctx.state.toggleActiveSelection(props.select);
+		}
+		function onRowDblClick(row, event, index) {
+			emit("row-dblclick", row, event);
+			if (!isStandalone.value || !ctx) return;
+			ctx.state.setActive(index);
+			ctx.state.requestMainAction(event);
+		}
+		function onSelectAllToggle(state) {
+			if (state === "all") emit("deselect-all");
+			else emit("select-all");
+		}
+		function onTbodyKeydown(event) {
+			if (!isStandalone.value || !ctx) return;
+			ctx.state.handleNavKey(event, { mode: props.select });
+		}
+		const scrollContainerRef = (0, vue.ref)(null);
+		function alignActiveRow(idx) {
+			if (!ctx) return;
+			const container = scrollContainerRef.value;
+			if (!container) return;
+			const rowHeight = props.virtualRowHeight;
+			const theadHeight = container.querySelector("thead")?.offsetHeight ?? 0;
+			if (rowHeight) {
+				const total = props.rows.length;
+				const maxScrollTop = Math.max(0, container.scrollHeight - container.clientHeight);
+				let target = container.scrollTop;
+				if (idx >= total - 1) target = maxScrollTop;
+				else if (idx <= 0) target = 0;
+				else {
+					const rowTop = theadHeight + idx * rowHeight;
+					const rowBottom = rowTop + rowHeight;
+					const visibleTop = container.scrollTop + theadHeight;
+					const visibleBottom = container.scrollTop + container.clientHeight;
+					if (rowTop < visibleTop - SCROLL_TOL) target = rowTop - theadHeight;
+					else if (rowBottom > visibleBottom + SCROLL_TOL) target = rowBottom - container.clientHeight;
+					else return;
+				}
+				target = Math.round(Math.max(0, Math.min(maxScrollTop, target)));
+				if (Math.abs(target - container.scrollTop) < 1) return;
+				container.scrollTop = target;
+				return;
+			}
+			const el = document.getElementById(ctx.state.rowId(idx));
+			if (!el) return;
+			const containerRect = container.getBoundingClientRect();
+			const rowRect = el.getBoundingClientRect();
+			const stickyTop = containerRect.top + theadHeight;
+			if (rowRect.top < stickyTop - SCROLL_TOL) container.scrollTop -= stickyTop - rowRect.top;
+			else if (rowRect.bottom > containerRect.bottom + SCROLL_TOL) container.scrollTop += rowRect.bottom - containerRect.bottom;
+		}
+		function recomputeViewportRows() {
+			if (!isStandalone.value || !ctx) return;
+			const container = scrollContainerRef.value;
+			if (!container) return;
+			const rowHeight = props.virtualRowHeight ?? _atscript_ui_table.DEFAULT_ROW_HEIGHT_PX;
+			if (rowHeight <= 0) return;
+			const headerHeight = container.querySelector("thead")?.offsetHeight ?? 0;
+			const usable = Math.max(0, container.clientHeight - headerHeight);
+			const fits = Math.max(0, Math.floor(usable / rowHeight));
+			if (ctx.state.navViewportRowCount.value !== fits) ctx.state.navViewportRowCount.value = fits;
+		}
+		if (ctx) {
+			(0, vue.watch)(() => ctx.state.activeIndex.value, (idx) => {
+				if (!isStandalone.value || idx < 0) return;
+				alignActiveRow(idx);
+			}, { flush: "post" });
+			(0, _vueuse_core.useResizeObserver)(scrollContainerRef, recomputeViewportRows);
+			(0, vue.onMounted)(() => void (0, vue.nextTick)(recomputeViewportRows));
+			(0, vue.watch)(() => props.virtualRowHeight, recomputeViewportRows);
+			(0, vue.watch)(() => props.columns, () => void (0, vue.nextTick)(recomputeViewportRows));
+		}
+		const ariaRowCount = (0, vue.computed)(() => {
+			if (!isStandalone.value || !ctx) return void 0;
+			return ctx.state.totalCount.value + 1;
+		});
+		const ariaActiveDescendant = (0, vue.computed)(() => {
+			if (!isStandalone.value || !ctx) return void 0;
+			const idx = ctx.state.activeIndex.value;
+			if (idx < 0) return "";
+			return ctx.state.rowId(idx);
+		});
+		function rowIdFor(index) {
+			if (!isStandalone.value || !ctx) return void 0;
+			return ctx.state.rowId(index);
+		}
+		function isActiveRow(index) {
+			if (!isStandalone.value || !ctx) return false;
+			return ctx.state.activeIndex.value === index;
+		}
+		return (_ctx, _cache) => {
+			return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, null, [(0, vue.createCommentVNode)("\n    Always render the table + header so filter/sort/hide menus stay reachable\n    even when rows are empty or the last query errored. The empty/error block\n    renders AFTER </table> (but inside the scroll container) so its width is\n    bound to the container, not the table's intrinsic fit-content width.\n  "), (0, vue.createElementVNode)("div", {
+				ref_key: "scrollContainerRef",
+				ref: scrollContainerRef,
+				class: "as-table-scroll-container",
+				"data-virtual-scroll": ""
+			}, [
+				(0, vue.createElementVNode)("table", {
+					class: (0, vue.normalizeClass)(["as-table", {
+						"as-table-sticky": __props.stickyHeader,
+						"as-table-stretch": __props.stretch
+					}]),
+					role: isStandalone.value ? "grid" : void 0,
+					"aria-rowcount": ariaRowCount.value,
+					"aria-multiselectable": isStandalone.value && __props.select === "multi" ? "true" : void 0
+				}, [
+					(0, vue.createVNode)(require_as_table_status.as_table_header_default, {
+						columns: __props.columns,
+						sorters: __props.sorters,
+						filters: __props.filters,
+						"column-menu": __props.columnMenu,
+						"column-widths": __props.columnWidths,
+						reorderable: __props.reorderable,
+						resizable: __props.resizable,
+						"column-min-width": __props.columnMinWidth,
+						"has-select-column": hasValue.value,
+						"select-all-state": selectAllState.value,
+						"with-filler": __props.stretch,
+						"enable-auto-fit": true,
+						"aria-rowindex": isStandalone.value ? 1 : void 0,
+						onSort: _cache[0] || (_cache[0] = (c, d) => emit("sort", c, d)),
+						onHide: _cache[1] || (_cache[1] = (c) => emit("hide", c)),
+						onFilter: _cache[2] || (_cache[2] = (c) => emit("filter", c)),
+						onFiltersOff: _cache[3] || (_cache[3] = (c) => emit("filters-off", c)),
+						onResetWidth: _cache[4] || (_cache[4] = (c) => emit("reset-width", c)),
+						onReorder: _cache[5] || (_cache[5] = (f, t, p) => emit("reorder", f, t, p)),
+						onResize: _cache[6] || (_cache[6] = (p, w) => emit("resize", p, w)),
+						onSelectAllToggle
+					}, (0, vue.createSlots)({ _: 2 }, [(0, vue.renderList)(__props.columns, (col) => {
+						return {
+							name: `header-${col.path}`,
+							fn: (0, vue.withCtx)((scope) => [(0, vue.renderSlot)(_ctx.$slots, `header-${col.path}`, (0, vue.normalizeProps)((0, vue.guardReactiveProps)(scope)))])
+						};
+					})]), 1032, [
+						"columns",
+						"sorters",
+						"filters",
+						"column-menu",
+						"column-widths",
+						"reorderable",
+						"resizable",
+						"column-min-width",
+						"has-select-column",
+						"select-all-state",
+						"with-filler",
+						"aria-rowindex"
+					]),
+					(0, vue.createCommentVNode)(" Combobox / listbox branches: rows render as Reka items. "),
+					isRekaWrapped.value && !__props.queryError ? ((0, vue.openBlock)(), (0, vue.createBlock)(as_table_virtualizer_default, {
+						key: 0,
+						options: __props.rows,
+						"estimate-size": __props.virtualRowHeight,
+						overscan: __props.virtualOverscan,
+						bypass: !__props.virtualRowHeight,
+						as: "tbody"
+					}, {
+						default: (0, vue.withCtx)(({ item, index, spaceBefore }) => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(isCombobox.value ? (0, vue.unref)(reka_ui.ComboboxItem) : (0, vue.unref)(reka_ui.ListboxItem)), {
+							as: "tr",
+							value: __props.rowValueFn ? __props.rowValueFn(item) : void 0,
+							style: (0, vue.normalizeStyle)({
+								height: __props.virtualRowHeight ? `${__props.virtualRowHeight}px` : void 0,
+								transform: spaceBefore ? `translateY(${spaceBefore}px)` : void 0
+							}),
+							onClick: ($event) => emit("row-click", item, $event),
+							onDblclick: ($event) => emit("row-dblclick", item, $event)
+						}, {
+							default: (0, vue.withCtx)(() => [
+								hasValue.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("td", _hoisted_2, [(0, vue.createElementVNode)("span", _hoisted_3, [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(isCombobox.value ? (0, vue.unref)(reka_ui.ComboboxItemIndicator) : (0, vue.unref)(reka_ui.ListboxItemIndicator)), {
+									class: "as-table-checkbox-tick",
+									"aria-hidden": "true"
+								}))])])) : (0, vue.createCommentVNode)("v-if", true),
+								(0, vue.unref)(hasAnyCellBindings) ? ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, (0, vue.renderList)(__props.columns, (col) => {
+									return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: col.path }, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)([(0, vue.unref)(cellResolver)(col, item, index)], (bindings) => {
+										return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [cellSlotFlags.value[col.path] ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("td", (0, vue.mergeProps)({
+											key: 0,
+											ref_for: true
+										}, bindings), [(0, vue.renderSlot)(_ctx.$slots, `cell-${col.path}`, {
+											row: item,
+											value: (0, vue.unref)(require_get_cell_value.getCellValue)(item, col.path),
+											column: col
+										})], 16)) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(cellComponents)[col.path]), (0, vue.mergeProps)({
+											key: 1,
+											row: item,
+											column: col
+										}, { ref_for: true }, bindings), null, 16, ["row", "column"]))], 64);
+									}), 128))], 64);
+								}), 128)) : ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 2 }, (0, vue.renderList)(__props.columns, (col) => {
+									return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: col.path }, [cellSlotFlags.value[col.path] ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("td", _hoisted_4, [(0, vue.renderSlot)(_ctx.$slots, `cell-${col.path}`, {
+										row: item,
+										value: (0, vue.unref)(require_get_cell_value.getCellValue)(item, col.path),
+										column: col
+									})])) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(cellComponents)[col.path]), {
+										key: 1,
+										row: item,
+										column: col
+									}, null, 8, ["row", "column"]))], 64);
+								}), 128)),
+								__props.stretch ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("td", _hoisted_5)) : (0, vue.createCommentVNode)("v-if", true)
+							]),
+							_: 2
+						}, 1064, [
+							"value",
+							"style",
+							"onClick",
+							"onDblclick"
+						]))]),
+						_: 3
+					}, 8, [
+						"options",
+						"estimate-size",
+						"overscan",
+						"bypass"
+					])) : isStandalone.value && !__props.queryError ? ((0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, [(0, vue.createCommentVNode)(" Standalone branch — plain rows + custom keyboard nav, ARIA grid. "), (0, vue.createVNode)(as_table_virtualizer_default, {
+						options: __props.rows,
+						"estimate-size": __props.virtualRowHeight,
+						overscan: __props.virtualOverscan,
+						bypass: !__props.virtualRowHeight,
+						as: "tbody",
+						tabindex: 0,
+						"aria-activedescendant": ariaActiveDescendant.value,
+						onKeydown: onTbodyKeydown
+					}, {
+						default: (0, vue.withCtx)(({ item, index, spaceBefore }) => [(0, vue.createElementVNode)("tr", {
+							id: rowIdFor(index),
+							role: "row",
+							"aria-rowindex": index + 2,
+							"aria-selected": ariaSelectedFor(item),
+							class: (0, vue.normalizeClass)({ "as-table-row-active": isActiveRow(index) }),
+							style: (0, vue.normalizeStyle)({
+								height: __props.virtualRowHeight ? `${__props.virtualRowHeight}px` : void 0,
+								transform: spaceBefore ? `translateY(${spaceBefore}px)` : void 0
+							}),
+							onClick: ($event) => onRowClick(item, $event, index),
+							onDblclick: ($event) => onRowDblClick(item, $event, index)
+						}, [
+							hasValue.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("td", _hoisted_7, [(0, vue.createElementVNode)("span", { class: (0, vue.normalizeClass)(["as-table-checkbox", { "as-table-checkbox-checked": isPkSelected(item) }]) }, [isPkSelected(item) ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("span", _hoisted_8)) : (0, vue.createCommentVNode)("v-if", true)], 2)])) : (0, vue.createCommentVNode)("v-if", true),
+							(0, vue.unref)(hasAnyCellBindings) ? ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 1 }, (0, vue.renderList)(__props.columns, (col) => {
+								return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: col.path }, [((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, null, (0, vue.renderList)([(0, vue.unref)(cellResolver)(col, item, index)], (bindings) => {
+									return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: 0 }, [cellSlotFlags.value[col.path] ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("td", (0, vue.mergeProps)({
+										key: 0,
+										role: "gridcell"
+									}, { ref_for: true }, bindings), [(0, vue.renderSlot)(_ctx.$slots, `cell-${col.path}`, {
+										row: item,
+										value: (0, vue.unref)(require_get_cell_value.getCellValue)(item, col.path),
+										column: col
+									})], 16)) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(cellComponents)[col.path]), (0, vue.mergeProps)({
+										key: 1,
+										row: item,
+										column: col,
+										role: "gridcell"
+									}, { ref_for: true }, bindings), null, 16, ["row", "column"]))], 64);
+								}), 128))], 64);
+							}), 128)) : ((0, vue.openBlock)(true), (0, vue.createElementBlock)(vue.Fragment, { key: 2 }, (0, vue.renderList)(__props.columns, (col) => {
+								return (0, vue.openBlock)(), (0, vue.createElementBlock)(vue.Fragment, { key: col.path }, [cellSlotFlags.value[col.path] ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("td", _hoisted_9, [(0, vue.renderSlot)(_ctx.$slots, `cell-${col.path}`, {
+									row: item,
+									value: (0, vue.unref)(require_get_cell_value.getCellValue)(item, col.path),
+									column: col
+								})])) : ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)((0, vue.unref)(cellComponents)[col.path]), {
+									key: 1,
+									row: item,
+									column: col,
+									role: "gridcell"
+								}, null, 8, ["row", "column"]))], 64);
+							}), 128)),
+							__props.stretch ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("td", _hoisted_10)) : (0, vue.createCommentVNode)("v-if", true)
+						], 46, _hoisted_6)]),
+						_: 3
+					}, 8, [
+						"options",
+						"estimate-size",
+						"overscan",
+						"bypass",
+						"aria-activedescendant"
+					])], 2112)) : (0, vue.createCommentVNode)("v-if", true)
+				], 10, _hoisted_1),
+				(0, vue.createVNode)(require_as_table_status.as_table_status_default, {
+					"query-error": __props.queryError,
+					"is-empty": __props.rows.length === 0,
+					querying: !!__props.querying,
+					columns: __props.columns,
+					"search-term": __props.searchTerm,
+					"has-active-filters": hasActiveFilters.value,
+					"on-clear-filters": __props.onClearFilters,
+					"on-retry": __props.onRetry
+				}, {
+					error: (0, vue.withCtx)((scope) => [(0, vue.renderSlot)(_ctx.$slots, "error", (0, vue.normalizeProps)((0, vue.guardReactiveProps)(scope)))]),
+					empty: (0, vue.withCtx)((scope) => [(0, vue.renderSlot)(_ctx.$slots, "empty", (0, vue.normalizeProps)((0, vue.guardReactiveProps)(scope)))]),
+					_: 3
+				}, 8, [
+					"query-error",
+					"is-empty",
+					"querying",
+					"columns",
+					"search-term",
+					"has-active-filters",
+					"on-clear-filters",
+					"on-retry"
+				]),
+				(0, vue.renderSlot)(_ctx.$slots, "last-row")
+			], 512)], 2112);
+		};
+	}
+});
+//#endregion
+Object.defineProperty(exports, "as_table_base_default", {
+	enumerable: true,
+	get: function() {
+		return as_table_base_default;
+	}
+});

package/dist/as-table-cell-value-B1CiJYFn.mjs

@@ -0,0 +1,26 @@
+import { t as getCellValue } from "./get-cell-value-DiH84HKL.mjs";
+import { t as formatCellValue } from "./format-cell-B2xMDYO9.mjs";
+import { createElementBlock, defineComponent, normalizeClass, openBlock, toDisplayString, unref } from "vue";
+//#endregion
+//#region src/components/defaults/as-table-cell-value.vue
+var as_table_cell_value_default = /* @__PURE__ */ defineComponent({
+	__name: "as-table-cell-value",
+	props: {
+		row: {
+			type: Object,
+			required: true
+		},
+		column: {
+			type: Object,
+			required: true
+		}
+	},
+	setup(__props) {
+		const props = __props;
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("td", { class: normalizeClass({ "as-cell-number": props.column.type === "number" }) }, toDisplayString(unref(formatCellValue)(unref(getCellValue)(props.row, props.column.path), props.column.type)), 3);
+		};
+	}
+});
+//#endregion
+export { as_table_cell_value_default as t };