@eos-ui/vue 0.0.0-stage → 0.1.1

package/dist/components/DataGrid/EDataGrid.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,616 @@
+/* empty css                */
+import { useMessages as e, usePortalTarget as t } from "../../config.js";
+import { useUid as n } from "../../composables/useUid.js";
+import r from "../Icon/EIcon.js";
+/* empty css                 */
+import ee from "../TextField/ETextField.js";
+import { normalizeOptions as te } from "../Select/options.js";
+/* empty css              */
+import ne from "../Select/ESelect.js";
+import i from "../Button/EButton.js";
+import re from "../IconButton/EIconButton.js";
+import ie from "../Checkbox/ECheckbox.js";
+import ae from "../EmptyState/EEmptyState.js";
+import oe from "../Pagination/EPagination.js";
+import se from "./EDataGridResizer.js";
+import { cellValue as ce, compareValues as le, filterActive as ue, parsePx as de, passesFilter as fe } from "./grid.js";
+import { Fragment as a, computed as o, createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createSlots as pe, createTextVNode as d, createVNode as f, defineComponent as p, mergeModels as m, mergeProps as me, nextTick as he, normalizeClass as h, normalizeStyle as g, openBlock as _, ref as v, renderList as y, renderSlot as b, toDisplayString as x, unref as S, useModel as C, useSlots as ge, watch as _e, withCtx as w } from "vue";
+import { PopoverClose as ve, PopoverContent as ye, PopoverPortal as be, PopoverRoot as xe, PopoverTrigger as Se } from "reka-ui";
+import { columnFilteringFeature as Ce, columnSizingFeature as we, columnVisibilityFeature as Te, createFilteredRowModel as Ee, createPaginatedRowModel as De, createSortedRowModel as Oe, functionalUpdate as T, globalFilteringFeature as ke, rowPaginationFeature as Ae, rowSelectionFeature as je, rowSortingFeature as Me, tableFeatures as Ne, useTable as Pe } from "@tanstack/vue-table";
+import { useVirtualizer as Fe } from "@tanstack/vue-virtual";
+//#region src/components/DataGrid/EDataGrid.vue?vue&type=script&setup=true&lang.ts
+var Ie = { class: "e-grid-frame" }, Le = {
+	key: 0,
+	class: "e-input-wrap e-grid-search"
+}, Re = { class: "e-affix e-affix--pre" }, ze = [
+	"placeholder",
+	"aria-label",
+	"value"
+], Be = {
+	key: 1,
+	class: "e-grid-picked"
+}, Ve = { class: "e-grid-count" }, He = {
+	key: 2,
+	class: "e-grid-sortsel"
+}, Ue = { class: "e-grid-tools" }, We = { class: "e-pop-head" }, Ge = ["id"], Ke = { class: "e-pop-body" }, qe = ["aria-label"], Je = [
+	"role",
+	"aria-busy",
+	"aria-rowcount"
+], Ye = { class: "e-sr" }, Xe = { key: 0 }, Ze = {
+	key: 0,
+	style: { width: "52px" }
+}, Qe = ["role"], $e = ["role"], et = ["role"], tt = ["role", "aria-sort"], nt = ["onClick"], rt = ["role"], it = ["role"], at = ["role"], ot = {
+	key: 1,
+	class: "e-filter-range"
+}, st = ["role"], ct = ["role"], lt = ["role"], ut = ["role"], dt = ["role"], ft = ["colspan", "role"], pt = ["colspan"], mt = [
+	"role",
+	"data-selected",
+	"aria-rowindex"
+], ht = ["role"], gt = ["role", "data-label"], _t = ["colspan"], vt = {
+	key: 1,
+	class: "e-grid-foot"
+}, yt = { class: "e-grid-range" }, bt = {
+	class: "e-sr",
+	role: "status",
+	"aria-live": "polite"
+}, xt = "__e-all__", St = "__e-none__", E = /*@__PURE__*/ p({
+	__name: "EDataGrid",
+	props: /*@__PURE__*/ m({
+		columns: {},
+		rows: {},
+		caption: {},
+		searchable: { type: Boolean },
+		searchPlaceholder: {},
+		filterable: { type: Boolean },
+		resizable: { type: Boolean },
+		stickyFirst: { type: Boolean },
+		columnToggle: { type: Boolean },
+		selectable: { type: Boolean },
+		pageSize: { default: 10 },
+		maxHeight: {},
+		virtual: { type: [Boolean, Object] },
+		cards: {
+			type: Boolean,
+			default: !0
+		},
+		manual: { type: Boolean },
+		total: {},
+		loading: { type: Boolean },
+		emptyTitle: {},
+		emptyText: {},
+		emptyIcon: {},
+		plain: { type: Boolean }
+	}, {
+		sort: { default: null },
+		sortModifiers: {},
+		page: { default: 1 },
+		pageModifiers: {},
+		search: { default: "" },
+		searchModifiers: {},
+		filters: { default: () => ({}) },
+		filtersModifiers: {},
+		selected: { default: () => [] },
+		selectedModifiers: {}
+	}),
+	emits: /*@__PURE__*/ m(["queryChange"], [
+		"update:sort",
+		"update:page",
+		"update:search",
+		"update:filters",
+		"update:selected"
+	]),
+	setup(p, { emit: m }) {
+		let E = p, Ct = m, wt = ge(), D = C(p, "sort"), O = C(p, "page"), k = C(p, "search"), A = C(p, "filters"), j = C(p, "selected"), M = e(), Tt = t(), Et = n(), N = v(!1), Dt = v(null);
+		_e(N, async (e) => {
+			e && (await he(), document.getElementById(Dt.value?.$el?.getAttribute("aria-controls") ?? "")?.setAttribute("aria-labelledby", `${Et.value}-columns`));
+		}, { flush: "post" });
+		let Ot = Ne({
+			rowSortingFeature: Me,
+			sortedRowModel: Oe(),
+			columnFilteringFeature: Ce,
+			globalFilteringFeature: ke,
+			filteredRowModel: Ee(),
+			rowPaginationFeature: Ae,
+			paginatedRowModel: De(),
+			rowSelectionFeature: je,
+			columnVisibilityFeature: Te,
+			columnSizingFeature: we
+		}), P = v({}), F = v({}), kt = (e, t, n) => le(e.getValue(n), t.getValue(n)), At = (e, t, n) => {
+			if (!n.cols.includes(t)) return !1;
+			let r = e.getValue(t);
+			return r != null && String(r).toLowerCase().includes(n.q);
+		}, I = o(() => new Map(E.columns.map((e) => [e.key, e]))), jt = o(() => E.columns.map((e) => ({
+			id: e.key,
+			accessorFn: (t) => ce(t, e),
+			header: e.label,
+			enableSorting: !!e.sortable,
+			sortDescFirst: !1,
+			sortFn: kt,
+			enableColumnFilter: !!e.filter,
+			filterFn: ((t, n, r) => fe(e, t.getValue(n), r)),
+			enableResizing: e.resizable !== !1
+		}))), L = o(() => E.virtual ? {
+			rowHeight: 48,
+			height: 440,
+			overscan: 8,
+			...E.virtual === !0 ? {} : E.virtual
+		} : null), R = o(() => L.value || E.plain ? 0 : E.pageSize ?? 10), Mt = o(() => R.value > 0 && !E.manual), z = o(() => !!E.resizable && !E.plain), B = o(() => E.cards !== !1 && !L.value && !z.value), V = o(() => k.value.trim().toLowerCase()), H = o(() => Object.values(A.value).some(ue)), U = Pe({
+			features: Ot,
+			columns: jt,
+			data: o(() => E.rows),
+			getRowId: (e) => String(e.id),
+			enableMultiSort: !1,
+			enableSubRowSelection: !1,
+			autoResetPageIndex: !1,
+			manualSorting: o(() => !!E.manual),
+			manualFiltering: o(() => !!E.manual),
+			manualPagination: o(() => !Mt.value),
+			rowCount: o(() => E.manual ? E.total ?? E.rows.length : void 0),
+			globalFilterFn: At,
+			state: o(() => ({
+				sorting: D.value ? [{
+					id: D.value.key,
+					desc: D.value.dir === "desc"
+				}] : [],
+				columnFilters: Object.entries(A.value).filter(([e, t]) => I.value.has(e) && ue(t)).map(([e, t]) => ({
+					id: e,
+					value: t
+				})),
+				globalFilter: V.value ? {
+					q: V.value,
+					cols: E.columns.filter((e) => P.value[e.key] !== !1).map((e) => e.key)
+				} : void 0,
+				rowSelection: Object.fromEntries(j.value.map((e) => [e, !0])),
+				columnVisibility: P.value,
+				columnSizing: F.value,
+				pagination: {
+					pageIndex: Math.max(0, O.value - 1),
+					pageSize: R.value || 1
+				}
+			})),
+			onSortingChange: (e) => {
+				let t = T(e, D.value ? [{
+					id: D.value.key,
+					desc: D.value.dir === "desc"
+				}] : [])[0];
+				D.value = t ? {
+					key: t.id,
+					dir: t.desc ? "desc" : "asc"
+				} : null, O.value = 1;
+			},
+			onRowSelectionChange: (e) => {
+				let t = T(e, Object.fromEntries(j.value.map((e) => [e, !0])));
+				j.value = Object.keys(t).filter((e) => t[e]);
+			},
+			onColumnVisibilityChange: (e) => {
+				P.value = T(e, P.value);
+			},
+			onColumnSizingChange: (e) => {
+				F.value = T(e, F.value);
+			}
+		}), W = o(() => U.getRowModel().rows), G = o(() => E.manual ? E.total ?? E.rows.length : U.getPrePaginatedRowModel().rows.length), K = o(() => R.value > 0 ? Math.max(1, Math.ceil(G.value / R.value)) : 1), Nt = o(() => Math.min(O.value, K.value));
+		_e(K, (e) => {
+			O.value > e && (O.value = e);
+		});
+		let q = o(() => U.getVisibleLeafColumns().map((e) => I.value.get(e.id)).filter((e) => !!e)), Pt = o(() => !!E.filterable && !E.plain && q.value.some((e) => e.filter)), Ft = o(() => q.value.length + +!!E.selectable), It = o(() => G.value === 0 ? 0 : (Nt.value - 1) * (R.value > 0 ? R.value : G.value) + 1), Lt = o(() => R.value > 0 ? Math.min(G.value, Nt.value * R.value) : G.value), Rt = o(() => D.value ? I.value.get(D.value.key) : void 0), zt = o(() => j.value.length), Bt = o(() => W.value.length > 0 && W.value.every((e) => e.getIsSelected())), Vt = o(() => W.value.some((e) => e.getIsSelected())), Ht = v(null), Ut = Fe(o(() => ({
+			count: L.value ? W.value.length : 0,
+			getScrollElement: () => Ht.value,
+			estimateSize: () => L.value?.rowHeight ?? 48,
+			overscan: L.value?.overscan ?? 8,
+			getItemKey: (e) => W.value[e]?.id ?? e,
+			initialRect: {
+				width: 0,
+				height: L.value?.height ?? 0
+			}
+		}))), J = o(() => L.value ? Ut.value.getVirtualItems() : []), Wt = o(() => L.value ? J.value.flatMap((e) => W.value[e.index] ? [e] : []) : []), Gt = o(() => J.value[0]?.start ?? 0), Kt = o(() => {
+			let e = J.value[J.value.length - 1];
+			return e ? Math.max(0, Ut.value.getTotalSize() - e.end) : 0;
+		}), qt = o(() => L.value ? Wt.value.map((e) => ({
+			row: W.value[e.index],
+			index: e.index
+		})) : W.value.map((e, t) => ({
+			row: e,
+			index: t
+		}))), Jt = (e, t) => ({
+			row: e.original,
+			value: e.getValue(t.key)
+		}), Yt = o(() => z.value || !!L.value || q.value.some((e) => e.width)), Xt = o(() => E.selectable ? 52 : 0), Y = (e) => F.value[e.key] || de(e.width) || void 0, Zt = o(() => (E.selectable ? 52 : 0) + q.value.reduce((e, t) => e + (Y(t) || t.minWidth || 96), 0)), X = (e) => !!E.stickyFirst && e === 0, Qt = (e) => X(e) ? { insetInlineStart: `${Xt.value}px` } : void 0, $t = o(() => ({
+			tableLayout: Yt.value ? "fixed" : void 0,
+			"--e-grid-min-w": Yt.value ? `${Zt.value}px` : void 0,
+			"--e-row-h": L.value ? `${L.value.rowHeight}px` : void 0
+		})), en = o(() => L.value ? { height: `${L.value.height}px` } : E.maxHeight ? { "--e-grid-max-h": E.maxHeight } : void 0), Z = (e) => B.value ? e : void 0, tn = o(() => E.columns.filter((e) => e.sortable)), nn = o(() => [{
+			value: St,
+			label: M("sortBy")
+		}, ...tn.value.flatMap((e) => ["asc", "desc"].map((t) => ({
+			value: `${e.key}:${t}`,
+			label: `${e.label}, ${M(t === "asc" ? "ascending" : "descending")}`
+		})))]), rn = o(() => D.value ? `${D.value.key}:${D.value.dir}` : St), an = o(() => B.value && tn.value.length > 0), on = o(() => !!wt.toolbar), sn = o(() => !!E.searchable || !!E.columnToggle || zt.value > 0 || H.value || on.value), cn = o(() => !E.plain && (sn.value || an.value));
+		function ln(e) {
+			k.value = e.target.value, O.value = 1;
+		}
+		function Q(e, t) {
+			A.value = {
+				...A.value,
+				[e]: t
+			}, O.value = 1;
+		}
+		function un() {
+			A.value = {}, k.value = "", O.value = 1;
+		}
+		function dn(e) {
+			if (e === St) D.value = null;
+			else {
+				let t = e.lastIndexOf(":");
+				D.value = {
+					key: e.slice(0, t),
+					dir: e.slice(t + 1) === "desc" ? "desc" : "asc"
+				};
+			}
+			O.value = 1;
+		}
+		function fn(e, t) {
+			U.setColumnSizing((n) => ({
+				...n,
+				[e]: t
+			}));
+		}
+		function pn(e) {
+			U.setColumnSizing((t) => {
+				let n = { ...t };
+				return delete n[e], n;
+			});
+		}
+		let $ = (e) => {
+			let t = A.value[e];
+			return typeof t == "object" ? t : {
+				min: "",
+				max: ""
+			};
+		}, mn = (e) => {
+			let t = A.value[e];
+			return typeof t == "string" ? t : "";
+		}, hn = (e) => [{
+			value: xt,
+			label: M("all")
+		}, ...te(e.filter?.type === "select" ? e.filter.options : [])];
+		return _e([
+			D,
+			O,
+			k,
+			A
+		], () => {
+			Ct("queryChange", {
+				sort: D.value,
+				page: O.value,
+				pageSize: R.value,
+				search: k.value,
+				filters: A.value
+			});
+		}), (e, t) => (_(), l("div", { class: h(["e-grid", {
+			"e-grid--plain": p.plain,
+			"e-grid--cards": B.value
+		}]) }, [u("div", Ie, [
+			cn.value ? (_(), l("div", {
+				key: 0,
+				class: h(["e-grid-bar", { "e-grid-bar--sortonly": !sn.value }])
+			}, [
+				p.searchable ? (_(), l("div", Le, [u("span", Re, [f(r, { name: "search" })]), u("input", {
+					class: "e-input",
+					type: "search",
+					placeholder: p.searchPlaceholder || S(M)("searchAll"),
+					"aria-label": S(M)("searchAll"),
+					value: k.value,
+					onInput: ln
+				}, null, 40, ze)])) : c("", !0),
+				zt.value ? (_(), l("div", Be, [u("span", Ve, x(S(M)("selected", { n: zt.value })), 1), b(e.$slots, "bulk-actions")])) : c("", !0),
+				an.value ? (_(), l("div", He, [f(ne, {
+					bare: "",
+					"aria-label": S(M)("sortBy"),
+					placeholder: S(M)("sortBy"),
+					options: nn.value,
+					"model-value": rn.value,
+					"onUpdate:modelValue": dn
+				}, null, 8, [
+					"aria-label",
+					"placeholder",
+					"options",
+					"model-value"
+				])])) : c("", !0),
+				u("div", Ue, [
+					H.value || V.value ? (_(), s(i, {
+						key: 0,
+						variant: "quiet",
+						onClick: un
+					}, {
+						default: w(() => [d(x(S(M)("clearFilters")), 1)]),
+						_: 1
+					})) : c("", !0),
+					p.columnToggle ? (_(), s(S(xe), {
+						key: 1,
+						open: N.value,
+						"onUpdate:open": t[0] ||= (e) => N.value = e
+					}, {
+						default: w(() => [f(S(Se), { "as-child": "" }, {
+							default: w(() => [f(i, {
+								ref_key: "menuTrigger",
+								ref: Dt,
+								variant: "outline",
+								"aria-label": S(M)("chooseColumns")
+							}, {
+								default: w(() => [d(x(S(M)("columns")), 1)]),
+								_: 1
+							}, 8, ["aria-label"])]),
+							_: 1
+						}), f(S(be), { to: S(Tt) }, {
+							default: w(() => [f(S(ye), {
+								class: "e-popover e-root",
+								side: "bottom",
+								align: "start",
+								"side-offset": 8,
+								"collision-padding": 16
+							}, {
+								default: w(() => [u("header", We, [u("h3", {
+									id: `${S(Et)}-columns`,
+									class: "e-pop-title"
+								}, x(S(M)("showColumns")), 9, Ge), f(S(ve), { "as-child": "" }, {
+									default: w(() => [f(re, {
+										icon: "x",
+										label: S(M)("close")
+									}, null, 8, ["label"])]),
+									_: 1
+								})]), u("div", Ke, [(_(!0), l(a, null, y(S(U).getAllLeafColumns(), (e) => (_(), s(ie, {
+									key: e.id,
+									label: I.value.get(e.id)?.label ?? e.id,
+									"model-value": e.getIsVisible(),
+									"onUpdate:modelValue": (t) => e.toggleVisibility(t)
+								}, null, 8, [
+									"label",
+									"model-value",
+									"onUpdate:modelValue"
+								]))), 128))])]),
+								_: 1
+							})]),
+							_: 1
+						}, 8, ["to"])]),
+						_: 1
+					}, 8, ["open"])) : c("", !0),
+					b(e.$slots, "toolbar")
+				])
+			], 2)) : c("", !0),
+			u("div", {
+				ref_key: "scrollEl",
+				ref: Ht,
+				class: "e-grid-scroll",
+				style: g(en.value),
+				tabindex: "0",
+				role: "region",
+				"aria-label": p.caption
+			}, [u("table", {
+				class: h(["e-table e-gridtable", { "e-gridtable--virtual": L.value }]),
+				style: g($t.value),
+				role: Z("table"),
+				"aria-busy": p.loading ? "true" : void 0,
+				"aria-rowcount": L.value ? G.value + 1 + +!!Pt.value : void 0
+			}, [
+				u("caption", Ye, x(p.caption), 1),
+				Yt.value ? (_(), l("colgroup", Xe, [p.selectable ? (_(), l("col", Ze)) : c("", !0), (_(!0), l(a, null, y(q.value, (e) => (_(), l("col", {
+					key: e.key,
+					style: g(Y(e) ? { width: `${Y(e)}px` } : void 0)
+				}, null, 4))), 128))])) : c("", !0),
+				u("thead", { role: Z("rowgroup") }, [u("tr", { role: Z("row") }, [p.selectable ? (_(), l("th", {
+					key: 0,
+					scope: "col",
+					class: "e-cell-check",
+					role: Z("columnheader")
+				}, [f(ie, {
+					bare: "",
+					label: L.value ? S(M)("selectAll") : S(M)("selectAllPage"),
+					"model-value": Bt.value,
+					indeterminate: Vt.value && !Bt.value,
+					"onUpdate:modelValue": t[1] ||= (e) => S(U).toggleAllPageRowsSelected(!Bt.value)
+				}, null, 8, [
+					"label",
+					"model-value",
+					"indeterminate"
+				])], 8, et)) : c("", !0), (_(!0), l(a, null, y(q.value, (t, n) => (_(), l("th", {
+					key: t.key,
+					scope: "col",
+					role: Z("columnheader"),
+					class: h({
+						"e-num": t.numeric,
+						"e-center": t.align === "center",
+						"e-sticky": X(n)
+					}),
+					style: g(Qt(n)),
+					"aria-sort": t.sortable ? D.value?.key === t.key ? D.value.dir === "asc" ? "ascending" : "descending" : "none" : void 0
+				}, [t.sortable ? (_(), l("button", {
+					key: 0,
+					type: "button",
+					class: "e-sortbtn",
+					onClick: (e) => S(U).getColumn(t.key)?.toggleSorting()
+				}, [b(e.$slots, `header-${t.key}`, { column: t }, () => [d(x(t.label), 1)]), f(r, {
+					name: D.value?.key === t.key ? D.value.dir === "asc" ? "arrow-up" : "arrow-down" : "sort",
+					small: ""
+				}, null, 8, ["name"])], 8, nt)) : b(e.$slots, `header-${t.key}`, { column: t }, () => [d(x(t.label), 1)], void 0, 1), z.value && t.resizable !== !1 ? (_(), s(se, {
+					key: 2,
+					label: t.label,
+					width: Y(t),
+					min: t.minWidth || 72,
+					onResize: (e) => fn(t.key, e),
+					onReset: (e) => pn(t.key)
+				}, null, 8, [
+					"label",
+					"width",
+					"min",
+					"onResize",
+					"onReset"
+				])) : c("", !0)], 14, tt))), 128))], 8, $e), Pt.value ? (_(), l("tr", {
+					key: 0,
+					class: "e-filterrow",
+					role: Z("row")
+				}, [p.selectable ? (_(), l("td", {
+					key: 0,
+					class: "e-cell-check",
+					role: Z("cell")
+				}, null, 8, it)) : c("", !0), (_(!0), l(a, null, y(q.value, (e, t) => (_(), l("td", {
+					key: e.key,
+					role: Z("cell"),
+					class: h({ "e-sticky": X(t) }),
+					style: g(Qt(t))
+				}, [e.filter ? (_(), l(a, { key: 0 }, [e.filter.type === "select" ? (_(), s(ne, {
+					key: 0,
+					bare: "",
+					"aria-label": S(M)("filterColumn", { col: e.label }),
+					placeholder: S(M)("all"),
+					options: hn(e),
+					"model-value": mn(e.key) || xt,
+					"onUpdate:modelValue": (t) => Q(e.key, t === xt ? "" : t)
+				}, null, 8, [
+					"aria-label",
+					"placeholder",
+					"options",
+					"model-value",
+					"onUpdate:modelValue"
+				])) : e.filter.type === "number" ? (_(), l("div", ot, [f(ee, {
+					"hide-label": "",
+					inputmode: "decimal",
+					label: S(M)("minOf", { col: S(M)("filterColumn", { col: e.label }) }),
+					placeholder: S(M)("min"),
+					"model-value": $(e.key).min,
+					"onUpdate:modelValue": (t) => Q(e.key, {
+						min: t,
+						max: $(e.key).max
+					})
+				}, null, 8, [
+					"label",
+					"placeholder",
+					"model-value",
+					"onUpdate:modelValue"
+				]), f(ee, {
+					"hide-label": "",
+					inputmode: "decimal",
+					label: S(M)("maxOf", { col: S(M)("filterColumn", { col: e.label }) }),
+					placeholder: S(M)("max"),
+					"model-value": $(e.key).max,
+					"onUpdate:modelValue": (t) => Q(e.key, {
+						min: $(e.key).min,
+						max: t
+					})
+				}, null, 8, [
+					"label",
+					"placeholder",
+					"model-value",
+					"onUpdate:modelValue"
+				])])) : (_(), s(ee, {
+					key: 2,
+					"hide-label": "",
+					type: "search",
+					label: S(M)("filterColumn", { col: e.label }),
+					placeholder: S(M)("filter"),
+					"model-value": mn(e.key),
+					"onUpdate:modelValue": (t) => Q(e.key, t)
+				}, null, 8, [
+					"label",
+					"placeholder",
+					"model-value",
+					"onUpdate:modelValue"
+				]))], 64)) : c("", !0)], 14, at))), 128))], 8, rt)) : c("", !0)], 8, Qe),
+				u("tbody", { role: Z("rowgroup") }, [p.loading ? (_(), l(a, { key: 0 }, y(5, (e) => u("tr", {
+					key: `s${e}`,
+					role: Z("row")
+				}, [p.selectable ? (_(), l("td", {
+					key: 0,
+					class: "e-cell-check",
+					role: Z("cell")
+				}, null, 8, lt)) : c("", !0), (_(!0), l(a, null, y(q.value, (e) => (_(), l("td", {
+					key: e.key,
+					role: Z("cell")
+				}, [...t[3] ||= [u("span", { class: "e-skel" }, null, -1)]], 8, ut))), 128))], 8, ct)), 64)) : W.value.length === 0 ? (_(), l("tr", {
+					key: 1,
+					role: Z("row")
+				}, [u("td", {
+					colspan: Ft.value,
+					class: "e-grid-empty",
+					role: Z("cell")
+				}, [f(ae, {
+					bare: "",
+					icon: p.emptyIcon || "search",
+					title: p.emptyTitle || S(M)("noResults")
+				}, pe({
+					default: w(() => [d(x(p.emptyText || (H.value || V.value ? S(M)("noMatchesFilters") : S(M)("nothingYet"))) + " ", 1)]),
+					_: 2
+				}, [H.value || V.value ? {
+					name: "action",
+					fn: w(() => [f(i, {
+						variant: "outline",
+						onClick: un
+					}, {
+						default: w(() => [d(x(S(M)("clearFilters")), 1)]),
+						_: 1
+					})]),
+					key: "0"
+				} : void 0]), 1032, ["icon", "title"])], 8, ft)], 8, dt)) : (_(), l(a, { key: 2 }, [
+					L.value && Gt.value > 0 ? (_(), l("tr", {
+						key: 0,
+						"aria-hidden": "true",
+						class: "e-spacer",
+						style: g({ height: `${Gt.value}px` })
+					}, [u("td", { colspan: Ft.value }, null, 8, pt)], 4)) : c("", !0),
+					(_(!0), l(a, null, y(qt.value, ({ row: t, index: n }) => (_(), l("tr", {
+						key: t.id,
+						role: Z("row"),
+						"data-selected": t.getIsSelected() ? "" : void 0,
+						"aria-rowindex": L.value ? n + 2 + +!!Pt.value : void 0
+					}, [p.selectable ? (_(), l("td", {
+						key: 0,
+						class: "e-cell-check",
+						role: Z("cell")
+					}, [f(ie, {
+						bare: "",
+						label: S(M)("selectRow"),
+						"model-value": t.getIsSelected(),
+						"onUpdate:modelValue": (e) => t.toggleSelected(e)
+					}, null, 8, [
+						"label",
+						"model-value",
+						"onUpdate:modelValue"
+					])], 8, ht)) : c("", !0), (_(!0), l(a, null, y(q.value, (n, r) => (_(), l("td", {
+						key: n.key,
+						role: Z("cell"),
+						"data-label": n.label,
+						class: h({
+							"e-num": n.numeric,
+							"e-center": n.align === "center",
+							"e-sticky": X(r)
+						}),
+						style: g(Qt(r))
+					}, [b(e.$slots, `cell-${n.key}`, me({ ref_for: !0 }, Jt(t, n)), () => [d(x(t.original[n.key]), 1)])], 14, gt))), 128))], 8, mt))), 128)),
+					L.value && Kt.value > 0 ? (_(), l("tr", {
+						key: 1,
+						"aria-hidden": "true",
+						class: "e-spacer",
+						style: g({ height: `${Kt.value}px` })
+					}, [u("td", { colspan: Ft.value }, null, 8, _t)], 4)) : c("", !0)
+				], 64))], 8, st)
+			], 14, Je)], 12, qe),
+			p.plain ? c("", !0) : (_(), l("div", vt, [u("span", yt, x(G.value === 0 ? S(M)("rows", { n: 0 }) : L.value || R.value === 0 ? S(M)("rows", { n: G.value }) : S(M)("showing", {
+				from: It.value,
+				to: Lt.value,
+				total: G.value
+			})), 1), R.value > 0 && K.value > 1 ? (_(), s(oe, {
+				key: 0,
+				"model-value": Nt.value,
+				"page-count": K.value,
+				"onUpdate:modelValue": t[2] ||= (e) => O.value = e
+			}, null, 8, ["model-value", "page-count"])) : c("", !0)])),
+			u("span", bt, x(p.loading ? S(M)("loading") : (Rt.value ? S(M)("sortedBy", {
+				col: Rt.value.label,
+				dir: S(M)(D.value?.dir === "asc" ? "ascending" : "descending")
+			}) + " " : "") + S(M)("rowsAnnounce", { n: G.value })), 1)
+		])], 2));
+	}
+});
+//#endregion
+export { E as default };
+
+//# sourceMappingURL=EDataGrid.vue_vue_type_script_setup_true_lang.js.map