bitboss-ui 3.0.0-beta.2 → 3.0.0-beta.20

package/dist/components/BbTable/BbTable.vue_vue_type_script_setup_true_lang.js

@@ -2,98 +2,109 @@ import { useId as e } from "../../composables/useId.js";
 import { removedPropsFor as t } from "../../deprecation/removedProps.js";
 import { useLogger as n } from "../../composables/useLogger.js";
 import { warnRemovedAttrs as r } from "../../utilities/functions/warnRemovedAttrs.js";
-import i from "../BbBaseButton/BbBaseButton.vue.js";
-import a from "../BbIcon/BbIcon.vue.js";
-import { isNil as o } from "../../utilities/functions/isNil.js";
-import { useLocale as s } from "../../composables/useLocale.js";
-import { useItemsGetter as c } from "../../composables/useItemsGetter.js";
-import { useItemValue as l } from "../../composables/useItemValue.js";
+import { isTopEscapeEntry as i, pushEscapeEntry as a, removeEscapeEntry as o } from "../../utils/overlayEscapeStack.js";
+import s from "../BbBaseButton/BbBaseButton.vue.js";
+import { useLocale as c } from "../../composables/useLocale.js";
+import { isNil as l } from "../../utilities/functions/isNil.js";
 import { hash as u } from "../../utilities/functions/hash.js";
-import { useHashedWatcher as ee } from "../../composables/useHashedWatcher.js";
-import { useBbTableContextHost as te } from "../../composables/useBbTableContext.js";
-import { clamp as ne } from "../../utilities/functions/clamp.js";
-import d from "../BbBaseCheckbox/BbBaseCheckbox.vue.js";
-import { useIndexById as f } from "../../composables/useIndexById.js";
-import { useBaseOptions as re } from "../../composables/useBaseOptions.js";
-import { usePrefill as ie } from "../../composables/usePrefill.js";
-import { parseCount as ae, parsePositiveInteger as p } from "../../utilities/functions/parsePaginationNumber.js";
-import oe from "../BbBaseRadio/BbBaseRadio.vue.js";
-import { when as se } from "../../utilities/functions/when.js";
-import { useTableWidthContext as ce } from "../../composables/useTableWidthContext.js";
-import le from "../../assets/svgs/sort.svg_raw.js";
-import { applyFixedTableColumns as ue, columnKeyToSlotName as de, mergeCellClasses as fe, mergeHeaderClasses as pe, mergeRowClasses as me } from "./utils.js";
-import { Fragment as m, computed as h, createBlock as he, createCommentVNode as g, createElementBlock as _, createElementVNode as v, createTextVNode as ge, createVNode as _e, defineComponent as y, mergeModels as ve, mergeProps as ye, nextTick as be, normalizeClass as b, normalizeStyle as x, onBeforeUnmount as xe, onMounted as Se, openBlock as S, reactive as Ce, ref as C, renderList as w, renderSlot as T, resolveDynamicComponent as we, toDisplayString as E, toRef as Te, unref as D, useModel as Ee, watch as O, withCtx as De } from "vue";
+import { useItemsGetter as d } from "../../composables/useItemsGetter.js";
+import { useItemValue as f } from "../../composables/useItemValue.js";
+import { useHashedWatcher as p } from "../../composables/useHashedWatcher.js";
+import { useBbTableContextHost as ee } from "../../composables/useBbTableContext.js";
+import { clamp as te } from "../../utilities/functions/clamp.js";
+import ne from "../BbBaseCheckbox/BbBaseCheckbox.vue.js";
+import { useIndexById as re } from "../../composables/useIndexById.js";
+import { useBaseOptions as ie } from "../../composables/useBaseOptions.js";
+import { usePrefill as ae } from "../../composables/usePrefill.js";
+import { parseCount as oe, parsePositiveInteger as se } from "../../utilities/functions/parsePaginationNumber.js";
+import { when as ce } from "../../utilities/functions/when.js";
+import { useTableWidthContext as le } from "../../composables/useTableWidthContext.js";
+import ue from "./BbTableDataRow.js";
+import de from "./BbTableExpandRow.js";
+import { applyFixedTableColumns as fe, columnKeyToSlotName as pe, completeColumnOrder as me, mergeCellClasses as he, mergeHeaderClasses as ge, mergeRowClasses as _e, moveColumnKey as ve, orderColumns as ye, readResolvedTracks as be, sameColumnOrder as xe } from "./utils.js";
+import { Fragment as m, computed as h, createBlock as g, createCommentVNode as _, createElementBlock as v, createElementVNode as y, createTextVNode as Se, defineComponent as Ce, getCurrentInstance as we, mergeModels as Te, mergeProps as Ee, nextTick as De, normalizeClass as b, normalizeStyle as x, onBeforeUnmount as Oe, onMounted as ke, openBlock as S, reactive as Ae, ref as C, renderList as je, renderSlot as w, resolveDynamicComponent as Me, shallowRef as Ne, toDisplayString as T, toRef as Pe, unref as E, useModel as Fe, useSlots as Ie, watch as D, withCtx as Le, withModifiers as Re } from "vue";
+import { defaultRangeExtractor as ze, elementScroll as Be, observeElementOffset as Ve, observeElementRect as He, observeWindowOffset as Ue, observeWindowRect as We, useVirtualizer as Ge, windowScroll as Ke } from "@tanstack/vue-virtual";
 //#region src/components/BbTable/BbTable.vue?vue&type=script&setup=true&lang.ts
-var Oe = {
+var qe = {
 	key: 0,
 	class: "sr-only"
-}, ke = ["aria-rowcount"], Ae = ["inert"], je = ["aria-rowindex"], Me = { class: "bb-table-header__content" }, Ne = { class: "bb-table-check__label-text sr-only" }, Pe = {
+}, Je = ["id"], Ye = ["id"], Xe = {
+	"aria-live": "polite",
+	class: "bb-table-loading__text sr-only",
+	role: "status"
+}, Ze = {
+	"aria-live": "polite",
+	class: "bb-table__reorder-status sr-only",
+	role: "status"
+}, Qe = ["aria-labelledby", "aria-rowcount"], $e = ["inert"], et = ["aria-rowindex"], tt = { class: "bb-table-header__content" }, nt = { class: "bb-table-check__label-text sr-only" }, rt = {
 	key: 1,
 	class: "bb-table-radio__label-text sr-only"
-}, Fe = ["aria-sort"], Ie = { class: "bb-table-header__content" }, Le = {
+}, it = [
+	"aria-describedby",
+	"aria-sort",
+	"data-column-key",
+	"tabindex",
+	"onClick",
+	"onFocus",
+	"onKeydown"
+], at = { class: "bb-table-header__content" }, ot = {
 	key: 1,
 	class: "bb-table-header__content"
-}, Re = { class: "bb-table-header__content sr-only" }, ze = ["aria-rowindex"], Be = {
+}, st = ["onDblclick", "onPointerdown"], ct = { class: "bb-table-header__content sr-only" }, lt = ["aria-rowindex"], ut = {
 	key: 0,
-	class: "bb-table-skeleton__cell bb-table-skeleton__cell--select"
-}, Ve = {
+	class: "bb-table-skeleton__cell bb-table-skeleton__cell--select",
+	role: "cell"
+}, dt = {
 	key: 0,
 	class: "bb-table-skeleton__cell-content"
-}, He = {
+}, ft = {
 	key: 1,
 	class: "bb-table-skeleton__avatar"
-}, Ue = {
+}, pt = {
 	key: 2,
 	class: "bb-table-skeleton__avatar-text"
-}, We = { class: "bb-table-skeleton__cell-content" }, Ge = {
+}, mt = { class: "bb-table-skeleton__cell-content" }, ht = {
 	key: 3,
 	class: "bb-table-skeleton__image"
-}, Ke = {
+}, gt = {
 	key: 4,
 	class: "bb-table-skeleton__badge"
-}, qe = {
+}, _t = {
 	key: 1,
-	class: "bb-table-skeleton__cell bb-table-skeleton__cell--actions"
-}, Je = ["aria-rowindex"], Ye = ["colspan"], Xe = { class: "bb-table-no-data__text" }, Ze = [
-	"aria-current",
-	"aria-rowindex",
-	"inert",
-	"tabindex",
-	"onClick",
-	"onContextmenu",
-	"onDblclick",
-	"onFocus",
-	"onKeydown"
-], Qe = { class: "bb-table-check__label-text sr-only" }, $e = { class: "bb-table-radio__label-text sr-only" }, et = ["id", "aria-rowindex"], tt = ["colspan"], nt = ["aria-rowindex"], rt = ["colspan"], it = { class: "bb-table-loading__text sr-only" }, at = 10, k = /*@__PURE__*/ y({
+	class: "bb-table-skeleton__cell bb-table-skeleton__cell--actions",
+	role: "cell"
+}, vt = ["aria-rowindex"], yt = ["aria-colspan"], bt = { class: "bb-table-no-data__text" }, xt = ["data-index"], St = ["role"], Ct = 48, wt = 10, Tt = "bb-table-resizing", Et = 5, Dt = 10, Ot = 500, kt = 40, At = 12, jt = 4, Mt = 12, Nt = "a, button:not(.bb-table-sort), input, select, textarea, [contenteditable], [role=\"button\"], .bb-table-header__resizer", Pt = 12, Ft = 10, It = 600, Lt = 120, Rt = 6, zt = 120, Bt = 10, O = /*@__PURE__*/ Ce({
 	__name: "BbTable",
-	props: /*@__PURE__*/ ve({
+	props: /*@__PURE__*/ Te({
 		accessibleLabel: {},
 		actions: { type: Boolean },
 		actionsText: {},
 		align: { default: "left" },
-		id: {},
-		inheritColumnWidths: { type: [Boolean, String] },
-		disableSelectAll: { type: Boolean },
 		caption: {},
 		compact: { type: Boolean },
 		dependencies: { default: () => [] },
 		depsDebounceTime: { default: 0 },
 		disabled: { type: Boolean },
-		enforceCoherence: { type: Boolean },
+		disableSelectAll: { type: Boolean },
 		displayCaption: { type: Boolean },
+		enforceCoherence: { type: Boolean },
+		expandedItems: {},
 		fixed: { type: Boolean },
 		fixedColumns: { default: () => [] },
 		fixedHeaders: { type: Boolean },
+		headerRowClass: {},
 		highlighted: {},
+		id: {},
+		inheritColumnWidths: { type: [Boolean, String] },
+		interactiveWhileLoading: { type: Boolean },
 		items: {
 			type: [Array, Function],
 			default: () => []
 		},
-		keyboardNavigation: { type: Boolean },
 		itemValue: {},
+		keyboardNavigation: { type: Boolean },
 		legend: {},
 		loading: { type: Boolean },
-		interactiveWhileLoading: { type: Boolean },
 		loadingText: {},
 		max: { default: Infinity },
 		modelValue: { default: () => [] },
@@ -103,22 +114,24 @@ var Oe = {
 		},
 		name: {},
 		noDataText: {},
+		order: {},
 		page: {},
 		perPage: {},
 		readonly: { type: Boolean },
+		reorderable: { type: Boolean },
+		resizable: { type: Boolean },
 		rowClass: {},
-		headerRowClass: {},
-		selectAll: { type: Boolean },
 		selectable: { type: [Boolean, Function] },
-		sort: {},
-		expandedItems: {},
+		selectAll: { type: Boolean },
 		selectAllLabel: {},
 		selectText: {},
+		sort: {},
 		tdClass: {},
 		thClass: {},
 		totalItems: {},
 		totalPages: {},
 		unselectedItems: { default: () => [] },
+		virtual: { type: Boolean },
 		columns: { default: () => [] }
 	}, {
 		selectAll: {
@@ -132,6 +145,11 @@ var Oe = {
 			default: () => []
 		},
 		sortModifiers: {},
+		order: {
+			required: !1,
+			default: () => []
+		},
+		orderModifiers: {},
 		highlighted: {
 			required: !1,
 			default: void 0
@@ -143,7 +161,7 @@ var Oe = {
 		},
 		expandedItemsModifiers: {}
 	}),
-	emits: /*@__PURE__*/ ve([
+	emits: /*@__PURE__*/ Te([
 		"click:row",
 		"contextmenu:row",
 		"dblclick:row",
@@ -151,6 +169,8 @@ var Oe = {
 		"update:modelValue",
 		"update:selectAll",
 		"update:sort",
+		"update:order",
+		"resize:column",
 		"update:expandedItems",
 		"update:unselectedItems",
 		"item:selected",
@@ -158,413 +178,1051 @@ var Oe = {
 	], [
 		"update:selectAll",
 		"update:sort",
+		"update:order",
 		"update:highlighted",
 		"update:expandedItems"
 	]),
-	setup(y, { emit: ve }) {
-		let k = Ee(y, "selectAll"), A = Ee(y, "sort"), j = Ee(y, "highlighted"), M = Ee(y, "expandedItems"), N = y, P = ve;
+	setup(Ce, { emit: Te }) {
+		let O = Fe(Ce, "selectAll"), k = Fe(Ce, "sort"), Vt = Fe(Ce, "order"), A = Fe(Ce, "highlighted"), j = Fe(Ce, "expandedItems"), M = Ce, N = Te, P = Ie();
 		process.env.NODE_ENV !== "production" && r("BbTable", t("BbTable"));
-		let { getItemValue: ot } = l(), st = e().id.value;
-		N.multiple && !Array.isArray(N.modelValue) && n().throw("BbTable is set for multiple selection but modelValue is not an array.");
-		let ct = ["actions", "select"];
+		let { getItemValue: Ht } = f(), Ut = e().id.value;
+		M.multiple && !Array.isArray(M.modelValue) && n().throw("BbTable is set for multiple selection but modelValue is not an array.");
+		let Wt = ["actions", "select"], Gt = ["prepend", "append"], Kt = (e) => Gt.includes(e);
 		if (process.env.NODE_ENV !== "production") {
-			let e = N.columns.filter((e) => ct.includes(e.key));
+			let e = M.columns.filter((e) => Wt.includes(e.key));
 			for (let t of e) n().warn(`BbTable: \`{ key: '${String(t.key)}' }\` is a reserved column and must not appear in \`columns\`. ` + (t.key === "actions" ? "Set the `actions` prop and fill the `#actions` slot instead." : "Selection is controlled by the `selectable` prop."));
+			for (let e of M.columns) {
+				let t = pe(e.key);
+				Kt(t) && n().warn(`BbTable: column key '${String(e.key)}' normalizes to the slot name '${t}', which collides with the table-wide \`#header:${t}\` slot. That name keeps its table-wide meaning and per-column header slots are unavailable for this column.`);
+			}
 		}
-		let { t: F } = s(), I = C(), L = C(), { id: lt, parentId: R, parentNode: ut, cssVars: dt, parentVar: ft, setTracks: pt } = ce({
-			id: () => N.id,
+		let { t: F } = c(), I = C(), L = C(), { id: qt, parentId: Jt, parentNode: Yt, node: Xt, cssVars: Zt, parentVar: Qt, setTracks: $t } = le({
+			id: () => M.id,
 			container: () => L.value,
-			inheritFrom: () => typeof N.inheritColumnWidths == "string" ? N.inheritColumnWidths : void 0
-		}), { data: mt } = f({ items: h(() => o(j.value) ? [] : [j.value]) }), z = (e) => {
-			let t = e.valueHash in mt.value;
-			j.value = t ? null : e.value;
-		}, ht = (e, t) => {
-			e.target instanceof Element && (e.target.closest("a, button, input, label, select, textarea, [contenteditable], [role=\"button\"]") || window.getSelection()?.toString() || z(t));
-		}, gt = (e) => A.value.find(([t]) => t === e)?.[1] ?? null, _t = (e) => {
-			let t = gt(e);
-			t === null ? A.value = [...A.value, [e, "asc"]] : t === "asc" ? A.value = A.value.map((t) => t[0] === e ? [e, "desc"] : t) : A.value = A.value.filter(([t]) => t !== e);
-		}, { state: B, isReady: vt } = te(() => lt.value, {
+			inheritFrom: () => typeof M.inheritColumnWidths == "string" ? M.inheritColumnWidths : void 0
+		}), en = h(() => `${qt.value}__caption`), tn = h(() => `${qt.value}__header_instructions`), nn = h(() => !!(M.reorderable || M.resizable)), rn = h(() => M.columns.map((e) => String(e.key))), R = C(null), z = h(() => {
+			let e = R.value ?? Vt.value;
+			if (!e.length) return M.columns;
+			let t = ye(M.columns, e);
+			return t.every((e, t) => e === M.columns[t]) ? M.columns : t;
+		}), an = h(() => z.value.map((e) => String(e.key))), on = (e, t) => {
+			let n = me(Vt.value, rn.value), r = ve(Vt.value, rn.value, e, t);
+			return xe(r, n) ? null : r;
+		}, sn = C("");
+		D(() => M.reorderable, () => {
+			sn.value = "";
+		});
+		let cn = (e, t) => {
+			let n = z.value, r = n.findIndex((t) => String(t.key) === e);
+			r < 0 || r === t || (sn.value = F("table.columnMoved", n[r].label, r + 1, n.length).value);
+		}, ln = C(null), un = h(() => {
+			let e = an.value, t = ln.value;
+			return t !== null && e.includes(t) ? t : e[0] ?? null;
+		}), dn = (e, t) => {
+			if (!t.sortable) return;
+			let n = e.target;
+			if (!(n instanceof Element)) return;
+			let r = e.currentTarget;
+			if (n.closest(".bb-table-sort")) return;
+			let i = n.closest(Nt);
+			i && r.contains(i) || window.getSelection()?.toString() || mr(t.key);
+		}, fn = (e) => {
+			nn.value && (ln.value = e);
+		}, pn = (e) => I.value?.querySelector(`:scope > .bb-table__head > .bb-table-header-row > [data-column-key="${CSS.escape(e)}"]`) ?? null, mn = (e) => {
+			let t = an.value, n = t[Math.max(0, Math.min(t.length - 1, e))];
+			n && (ln.value = n, pn(n)?.focus());
+		}, hn = async (e, t) => {
+			if (!nn.value) return;
+			let n = e.currentTarget, r = e.target;
+			if (!(r instanceof Element) || r !== n && !r.closest(".bb-table-sort")) return;
+			let i = getComputedStyle(n).direction === "rtl";
+			if (e.altKey && !e.ctrlKey && !e.metaKey) {
+				if (!gn.value || e.key !== "ArrowLeft" && e.key !== "ArrowRight") return;
+				e.preventDefault();
+				let r = e.key === "ArrowRight" !== i, a = B.value[t] ?? n.getBoundingClientRect().width;
+				wn({ [t]: a + (r ? 1 : -1) * wt });
+				return;
+			}
+			if (e.ctrlKey || e.metaKey) return;
+			let a = an.value, o = a.indexOf(t);
+			if (o < 0) return;
+			let s;
+			switch (e.key) {
+				case "ArrowLeft":
+					s = i ? o + 1 : o - 1;
+					break;
+				case "ArrowRight":
+					s = i ? o - 1 : o + 1;
+					break;
+				case "Home":
+					s = 0;
+					break;
+				case "End":
+					s = a.length - 1;
+					break;
+				case "Enter":
+				case " ":
+					if (r !== n || !z.value[o]?.sortable) return;
+					e.preventDefault(), mr(t);
+					return;
+				default: return;
+			}
+			if (e.preventDefault(), !e.shiftKey) {
+				mn(s);
+				return;
+			}
+			if (!M.reorderable) return;
+			let c = on(t, s);
+			c && (sn.value = "", Vt.value = c, ln.value = t, await De(), pn(t)?.focus(), cn(t, o));
+		};
+		process.env.NODE_ENV !== "production" && (D(Vt, (e) => {
+			new Set(e).size !== e.length && n().warn("BbTable: `order` lists a key more than once — the first occurrence wins.");
+		}, { immediate: !0 }), D(() => M.columns.some((e) => e.snap != null) && (!!M.reorderable || z.value !== M.columns), (e) => {
+			e && n().warn("BbTable: `snap` is positional in the parent's rendered order and does not compose with `order` / `reorderable` on the same table — order the parent (a snap-mapped child follows its slots), or drop the snaps and share the parent's `order` with a same-key child.");
+		}, { immediate: !0 }));
+		let gn = h(() => !!M.resizable && !K.value), B = C({}), V = C(null), _n = C(null), vn = (e) => {
+			let t = String(e.key);
+			return V.value?.[t] ?? B.value[t] ?? e.width ?? (q.value ? J.value[t] : void 0);
+		}, yn = (e) => {
+			let t = String(e.key);
+			return V.value?.[t] !== void 0 || t in B.value;
+		}, bn = h(() => Object.keys(V.value ?? {}).join(" ")), xn = h(() => /* @__PURE__ */ new Set([...Object.keys(B.value), ...bn.value.split(" ").filter(Boolean)])), Sn = h(() => {
+			let e = /* @__PURE__ */ new Map(), t = xn.value, n = q.value, r = J.value;
+			for (let i of z.value) {
+				let a = String(i.key), o = n && i.width == null, s = [];
+				o && s.push("bb-table-data__cell--nowrap"), t.has(a) && s.push("bb-table-data__cell--resized"), (t.has(a) || o && a in r) && s.push("bb-table-data__cell--clip"), s.length && e.set(a, s.join(" "));
+			}
+			return e;
+		}), Cn = h(() => V.value !== null || Object.keys(B.value).length > 0), wn = (e) => {
+			let t = { ...B.value }, n = [];
+			for (let [r, i] of Object.entries(e)) {
+				let e = Math.max(Ct, Math.round(i));
+				t[r] !== e && (t[r] = e, n.push([r, e]));
+			}
+			if (n.length) {
+				B.value = t;
+				for (let [e, t] of n) N("resize:column", e, t);
+			}
+		}, Tn = (e) => {
+			if (!(e in B.value)) return;
+			let { [e]: t, ...n } = B.value;
+			B.value = n, N("resize:column", e, null);
+		};
+		D(() => M.columns.map((e) => [String(e.key), e.width]), (e, t) => {
+			if (!t || !Object.keys(B.value).length) return;
+			let n = new Map(t), r = B.value, i = e.filter(([e, t]) => n.has(e) && n.get(e) !== t && e in r && t !== r[e]);
+			if (!i.length) return;
+			let a = { ...r };
+			for (let [e] of i) delete a[e];
+			B.value = a;
+		});
+		let H = null, En = () => {
+			document.removeEventListener("pointermove", On), document.removeEventListener("pointerup", kn), document.removeEventListener("pointercancel", An), document.removeEventListener("keydown", jn, !0), window.removeEventListener("blur", An);
+		}, Dn = () => {
+			if (En(), H) try {
+				H.handle.releasePointerCapture(H.pointerId);
+			} catch {}
+			document.documentElement.classList.remove(Tt), H = null, V.value = null, _n.value = null, I.value && (I.value.style.gridTemplateColumns = Xr.value);
+		}, On = (e) => {
+			if (!H || e.pointerId !== H.pointerId) return;
+			let t = (e.clientX - H.x0) * (H.rtl ? -1 : 1);
+			t = Math.max(Ct - H.startWidth, t);
+			let { neighbour: n } = H;
+			if (e.shiftKey && n) {
+				t = Math.min(n.startWidth - Ct, t), V.value = {
+					[H.key]: Math.round(H.startWidth + t),
+					[n.key]: Math.round(n.startWidth - t)
+				};
+				return;
+			}
+			V.value = { [H.key]: Math.round(H.startWidth + t) };
+		}, kn = (e) => {
+			if (!H || e.pointerId !== H.pointerId) return;
+			let { key: t, startWidth: n, neighbour: r } = H, i = V.value;
+			if (Dn(), !i) return;
+			let a = {};
+			i[t] !== Math.round(n) && (a[t] = i[t]), r && i[r.key] !== void 0 && i[r.key] !== Math.round(r.startWidth) && (a[r.key] = i[r.key]), wn(a);
+		}, An = (e) => {
+			H && (e instanceof PointerEvent && e.pointerId !== H.pointerId || Dn());
+		}, jn = (e) => {
+			!H || e.key !== "Escape" || (e.preventDefault(), e.stopImmediatePropagation(), Dn());
+		}, Mn = (e, t) => {
+			if (!gn.value || vi.value || H || !e.isPrimary || e.button !== 0) return;
+			let n = pn(t);
+			if (!n) return;
+			e.preventDefault();
+			let r = e.currentTarget;
+			try {
+				r.setPointerCapture(e.pointerId);
+			} catch {}
+			document.documentElement.classList.add(Tt);
+			let i = an.value, a = i[i.indexOf(t) + 1], o = a ? pn(a) : null;
+			H = {
+				pointerId: e.pointerId,
+				handle: r,
+				key: t,
+				x0: e.clientX,
+				startWidth: n.getBoundingClientRect().width,
+				neighbour: a && o ? {
+					key: a,
+					startWidth: o.getBoundingClientRect().width
+				} : null,
+				rtl: getComputedStyle(n).direction === "rtl"
+			}, _n.value = t, document.addEventListener("pointermove", On), document.addEventListener("pointerup", kn), document.addEventListener("pointercancel", An), document.addEventListener("keydown", jn, !0), window.addEventListener("blur", An);
+		};
+		Oe(Dn);
+		let U = C("idle"), Nn = C(null), Pn = C(""), Fn = C(), In = Symbol("bb-table-column-drag"), W = null, Ln = (e) => Math.max(0, Math.min(1, e)), Rn = () => {
+			let e = Sr.value ? L.value?.parentElement ?? null : L.value ?? null;
+			for (; e;) {
+				let t = getComputedStyle(e).overflowX;
+				if (t === "auto" || t === "scroll") return e;
+				e = e.parentElement;
+			}
+			return null;
+		}, zn = () => {
+			let e = W?.scrollport?.getBoundingClientRect(), t = Math.max(e?.left ?? 0, 0), n = Math.min(e?.right ?? window.innerWidth, window.innerWidth);
+			return {
+				left: t,
+				right: Math.max(t + 1, n)
+			};
+		}, Bn = (e) => Array.from(e.children).filter((e) => e instanceof HTMLElement && e.classList.contains("bb-table-header") && !!e.dataset.columnKey), Vn = () => {
+			let e = Fn.value;
+			e?.isConnected && !e.matches(":popover-open") && e.showPopover();
+		}, Hn = () => {
+			let e = Fn.value;
+			e && e.matches(":popover-open") && e.hidePopover();
+		}, Un = (e, t) => {
+			let n = Fn.value;
+			n && (n.style.translate = `${e + Mt}px ${t + Mt}px`);
+		}, Wn = (e) => {
+			if (!W || U.value !== "dragging") return;
+			let t = zn(), n = Math.max(t.left, Math.min(e, t.right - 1)), r = Bn(W.row);
+			if (r.length < 2) return;
+			let i = (e) => e.style.position === "sticky", a = new Map(r.map((e) => [e, e.getBoundingClientRect()])), o = [...r.filter(i), ...r.filter((e) => !i(e))].filter((e) => e.dataset.columnKey !== W.key), s = an.value, c = s.indexOf(W.key);
+			if (c < 0) return;
+			let l = Infinity, u = -Infinity;
+			for (let e of a.values()) l = Math.min(l, e.left), u = Math.max(u, e.right);
+			let d, f;
+			if (n < l) d = "\0start", f = W.rtl ? s.length - 1 : 0;
+			else if (n >= u) d = "\0end", f = W.rtl ? 0 : s.length - 1;
+			else {
+				let e = o.find((e) => {
+					let t = a.get(e);
+					return n >= t.left && n < t.right;
+				});
+				if (!e) return;
+				d = e.dataset.columnKey, f = s.indexOf(d);
+			}
+			if (f < 0 || f === c) return;
+			let p = f > c;
+			if (W.target?.key === d && W.target.after === p) return;
+			let ee = ve(W.base, rn.value, W.key, f);
+			if (xe(ee, R.value ?? W.base)) {
+				W.target = {
+					key: d,
+					after: p
+				};
+				return;
+			}
+			((W.rtl ? !p : p) ? n <= W.lastMoveX + jt : n >= W.lastMoveX - jt) || (W.target = {
+				key: d,
+				after: p
+			}, W.lastMoveX = n, R.value = ee);
+		}, Gn = () => {
+			if (!W || U.value !== "dragging" || !W.scrollDirection) {
+				W && (W.raf = void 0);
+				return;
+			}
+			let e = zn(), t = W.scrollDirection < 0 ? W.lastX - e.left : e.right - W.lastX, n = Math.ceil(At * (1 - Ln(t / kt))), r = W.scrollport ?? document.scrollingElement;
+			r && (r.scrollLeft += W.scrollDirection * n), Wn(W.lastX), W.raf = requestAnimationFrame(Gn);
+		}, Kn = () => {
+			if (!W) return;
+			let e = zn(), t = W.lastX - e.left, n = e.right - W.lastX;
+			W.scrollDirection = t < kt ? -1 : +(n < kt), W.scrollDirection && W.raf === void 0 && (W.raf = requestAnimationFrame(Gn));
+		}, qn = () => {
+			document.removeEventListener("pointermove", Zn), document.removeEventListener("pointerup", Qn), document.removeEventListener("pointercancel", $n), document.removeEventListener("keydown", tr, !0), document.removeEventListener("dragstart", nr), document.removeEventListener("contextmenu", nr, !0), window.removeEventListener("blur", $n), W?.row.removeEventListener("lostpointercapture", er);
+		}, Jn = () => {
+			if (W) {
+				clearTimeout(W.timer), W.raf !== void 0 && cancelAnimationFrame(W.raf), qn();
+				try {
+					W.row.hasPointerCapture(W.pointerId) && W.row.releasePointerCapture(W.pointerId);
+				} catch {}
+				Hn(), o(In), Nn.value = null, R.value = null, U.value = "idle", W = null;
+			}
+		}, Yn = () => {
+			W && (W.raf !== void 0 && cancelAnimationFrame(W.raf), W.raf = void 0, W.scrollDirection = 0, Hn(), o(In), Nn.value = null, R.value = null, U.value = "cancelled");
+		}, Xn = () => {
+			if (!(!W || U.value !== "armed")) {
+				clearTimeout(W.timer), W.timer = void 0;
+				try {
+					W.row.setPointerCapture(W.pointerId);
+				} catch {}
+				W.row.addEventListener("lostpointercapture", er), W.base = me(Vt.value, rn.value), W.rtl = getComputedStyle(W.row).direction === "rtl", W.scrollport = Rn(), W.lastMoveX = W.x0, W.target = null, R.value = W.base, Nn.value = W.key, Pn.value = W.label, U.value = "dragging", a(In), Vn(), Un(W.lastX, W.lastY), Wn(W.lastX), Kn();
+			}
+		}, Zn = (e) => {
+			if (!(!W || e.pointerId !== W.pointerId)) {
+				if (W.lastX = e.clientX, W.lastY = e.clientY, U.value === "armed") {
+					let t = Math.hypot(e.clientX - W.x0, e.clientY - W.y0);
+					if (W.pointerType === "touch") {
+						t >= Dt && Jn();
+						return;
+					}
+					if (t < Et) return;
+					Xn();
+					return;
+				}
+				U.value === "dragging" && (Un(e.clientX, e.clientY), Wn(e.clientX), Kn());
+			}
+		}, Qn = (e) => {
+			if (!W || e.pointerId !== W.pointerId) return;
+			let { key: t } = W, n = W.base ? W.base.filter((e) => rn.value.includes(e)).indexOf(t) : -1, r = U.value === "dragging" && R.value !== null && !xe(R.value, W.base) ? R.value : null;
+			Jn(), r && (sn.value = "", Vt.value = r, De(() => cn(t, n)));
+		}, $n = (e) => {
+			W && (e instanceof PointerEvent && e.pointerId !== W.pointerId || Jn());
+		}, er = () => {
+			W && U.value === "dragging" && Jn();
+		}, tr = (e) => {
+			!W || U.value !== "dragging" || e.key !== "Escape" || !i(In) || (e.preventDefault(), e.stopImmediatePropagation(), Yn());
+		}, nr = (e) => {
+			W && U.value !== "idle" && e.preventDefault();
+		}, rr = (e) => {
+			if (!M.reorderable || vi.value || P.thead || !e.isPrimary || e.button !== 0 || W || z.value.length < 2) return;
+			let t = e.target;
+			if (!(t instanceof Element)) return;
+			let n = e.currentTarget, r = t.closest(".bb-table-header");
+			if (!r || r.parentElement !== n || !r.dataset.columnKey) return;
+			let i = t.closest(Nt);
+			if (i && r.contains(i)) return;
+			let a = r.dataset.columnKey, o = z.value.find((e) => String(e.key) === a);
+			o && (W = {
+				pointerId: e.pointerId,
+				pointerType: e.pointerType,
+				key: a,
+				label: o.label,
+				row: n,
+				x0: e.clientX,
+				y0: e.clientY,
+				lastX: e.clientX,
+				lastY: e.clientY,
+				lastMoveX: e.clientX,
+				rtl: !1,
+				base: [],
+				scrollport: null,
+				target: null,
+				timer: void 0,
+				raf: void 0,
+				scrollDirection: 0
+			}, U.value = "armed", document.addEventListener("pointermove", Zn), document.addEventListener("pointerup", Qn), document.addEventListener("pointercancel", $n), document.addEventListener("keydown", tr, !0), document.addEventListener("dragstart", nr), document.addEventListener("contextmenu", nr, !0), window.addEventListener("blur", $n), e.pointerType === "touch" && (W.timer = setTimeout(Xn, Ot)));
+		}, ir = (e) => {
+			W && (U.value === "dragging" || U.value === "cancelled") && e.cancelable && e.preventDefault();
+		};
+		Oe(Jn);
+		let { data: ar } = re({ items: h(() => l(A.value) ? [] : [A.value]) }), or = h(() => A.value !== void 0 || G.highlighted !== void 0), sr = we(), cr = () => {
+			let e = sr?.vnode.props ?? {};
+			return "highlighted" in e || "onUpdate:highlighted" in e;
+		};
+		process.env.NODE_ENV !== "production" && D(() => A.value === void 0 && cr(), (e) => {
+			e && n().warn("BbTable: `highlighted` is bound but its value is `undefined`, so the highlight mechanic stays off. Initialise it to `null` — `ref(null)`, not `ref()` — to be considered bound. `undefined` means \"never initialised\" and switches highlight off entirely; `null` means \"initialised and currently empty\".");
+		}, { immediate: !0 });
+		let lr = !1, ur = () => {
+			process.env.NODE_ENV !== "production" && (lr || (lr = !0, n().warn("BbTable: `toggleHighlighted` was called from a slot, but highlight is not connected, so nothing happened. Bind `v-model:highlighted` (initialised to `null`), or seed `highlighted` through `useBbTableContext(id, { highlighted })`, or drop the call — with nothing bound the table has nowhere to put the value.")));
+		}, dr = (e, { viaSlot: t = !1 } = {}) => {
+			if (!or.value) {
+				t && ur();
+				return;
+			}
+			let n = e.valueHash in ar.value;
+			A.value = n ? null : e.value;
+		}, fr = (e, t) => {
+			e.target instanceof Element && (e.target.closest("a, button, input, label, select, textarea, [contenteditable], [role=\"button\"]") || window.getSelection()?.toString() || dr(t));
+		}, pr = (e) => k.value.find(([t]) => t === e)?.[1] ?? null, mr = (e) => {
+			let t = pr(e);
+			t === null ? k.value = [...k.value, [e, "asc"]] : t === "asc" ? k.value = k.value.map((t) => t[0] === e ? [e, "desc"] : t) : k.value = k.value.filter(([t]) => t !== e);
+		}, { state: G, isReady: hr } = ee(() => qt.value, {
 			selected: {
-				get: () => N.modelValue,
-				set: (e) => P("update:modelValue", e)
+				get: () => M.modelValue,
+				set: (e) => N("update:modelValue", e)
 			},
 			unselected: {
-				get: () => N.unselectedItems,
-				set: (e) => P("update:unselectedItems", e)
+				get: () => M.unselectedItems,
+				set: (e) => N("update:unselectedItems", e)
 			},
 			all: {
-				get: () => k.value,
+				get: () => O.value,
 				set: (e) => {
-					k.value = e;
+					O.value = e;
 				}
 			},
 			sort: {
-				get: () => A.value,
+				get: () => k.value,
 				set: (e) => {
-					A.value = e;
+					k.value = e;
 				}
 			},
 			highlighted: {
-				get: () => j.value ?? null,
+				get: () => A.value,
 				set: (e) => {
-					j.value = e;
+					A.value = e;
 				}
 			},
-			page: { get: () => N.page === void 0 ? void 0 : p(N.page, 1) },
+			page: { get: () => M.page === void 0 ? M.virtual ? 1 : void 0 : se(M.page, 1) },
 			perPage: {
-				get: () => ae(N.perPage),
-				infer: () => Array.isArray(N.items) ? N.items.length : void 0
+				get: () => oe(M.perPage),
+				infer: () => Array.isArray(M.items) ? M.items.length : void 0
 			},
 			totalItems: {
-				get: () => ae(N.totalItems),
-				infer: () => Array.isArray(N.items) ? N.items.length : void 0
+				get: () => oe(M.totalItems),
+				infer: () => Array.isArray(M.items) ? M.items.length : void 0
 			},
-			totalPages: { get: () => N.totalPages === void 0 ? void 0 : p(N.totalPages, 1) }
-		}), yt = h(() => N.columns.some((e) => e.snap != null)), V = h(() => !!N.inheritColumnWidths || yt.value), H = h(() => N.fixed || yt.value || N.columns.some((e) => e.width != null) || V.value && !!R.value), bt = h(() => V.value && !!R.value), xt = bt, St = (e) => {
+			totalPages: { get: () => M.totalPages === void 0 ? void 0 : se(M.totalPages, 1) }
+		}), gr = h(() => M.columns.some((e) => e.snap != null)), _r = h(() => !!M.inheritColumnWidths || gr.value), vr = h(() => M.fixed || gr.value || M.columns.some((e) => e.width != null) || Cn.value || _r.value && !!Jt.value), K = h(() => _r.value && !!Jt.value), q = h(() => !!M.virtual && !K.value && !P.tbody), J = C({}), Y = C({}), yr = C(""), br = h(() => q.value && !!yr.value && qr.value.every((e) => !e.contentSized)), xr = (e) => q.value && e.width == null && !yn(e) && String(e.key) in J.value, Sr = K, Cr = (e) => {
 			if (typeof e == "number") return `${e}px`;
 			let t = e.trim();
 			return /^-?\d*\.?\d+$/.test(t) ? `${t}px` : t;
-		}, Ct = h(() => {
-			let e = ut.value?.tracks;
+		}, wr = h(() => {
+			let e = Yt.value?.tracks;
 			return e ? Object.keys(e).filter((e) => /^\d+$/.test(e)).length : 0;
-		}), wt = h(() => {
-			let e = ut.value?.tracks ?? {}, t = [];
+		}), Tr = h(() => {
+			let e = Yt.value?.tracks ?? {}, t = [];
 			"select" in e && t.push("select");
-			for (let e = 0; e < Ct.value; e++) t.push(String(e));
+			for (let e = 0; e < wr.value; e++) t.push(String(e));
 			return "actions" in e && t.push("actions"), t;
-		}), Tt = h(() => +("select" in (ut.value?.tracks ?? {}))), Et = h(() => Tt.value + Ct.value), Dt = h(() => wt.value.length), Ot = (e) => {
-			let t = wt.value[e];
-			return t ? ft(t, "0px") : "0px";
-		}, kt = (e, t) => {
-			if (!R.value || t - e <= 1e-6) return null;
+		}), Er = h(() => +("select" in (Yt.value?.tracks ?? {}))), Dr = h(() => Er.value + wr.value), Or = h(() => Tr.value.length), kr = (e) => {
+			let t = Tr.value[e];
+			return t ? Qt(t, "0px") : "0px";
+		}, Ar = (e, t) => {
+			if (!Jt.value || t - e <= 1e-6) return null;
 			let n = [];
 			for (let r = Math.floor(e); r < Math.ceil(t - 1e-6); r++) {
 				let i = Math.min(t, r + 1) - Math.max(e, r);
 				if (i <= 1e-6) continue;
-				let a = Ot(r);
+				let a = kr(r);
 				n.push(i >= .999999 ? a : `${Number(i.toFixed(4))} * ${a}`);
 			}
 			return n.length ? n.length === 1 && !n[0].includes("*") ? n[0] : `calc(${n.join(" + ")})` : null;
-		}, At = h(() => {
-			let e = N.columns, t = e.map((e) => typeof e.snap == "number" ? e.snap : Array.isArray(e.snap) ? e.snap[0] : null), n = Tt.value;
-			return e.map((e, r) => {
-				let i = t[r] ?? n, a;
-				if (Array.isArray(e.snap)) a = e.snap[1] === -1 ? Et.value : e.snap[1];
+		}, jr = h(() => {
+			let e = z.value, t = e.map((e) => typeof e.snap == "number" ? e.snap : Array.isArray(e.snap) ? e.snap[0] : null), n = Er.value;
+			return e.map((r, i) => {
+				let a = t[i] ?? n, o;
+				if (Array.isArray(r.snap)) o = r.snap[1] === -1 ? Dr.value : r.snap[1];
 				else {
-					let e = t[r + 1];
-					a = e != null && e > i ? e : Math.floor(i) + 1;
+					let n = t[i + 1];
+					o = n != null && n > a ? n : Math.floor(a) + 1, i === e.length - 1 && r.width == null && (o = Math.max(o, Dr.value));
 				}
-				return n = a, {
-					start: i,
-					end: a
+				return n = o, {
+					start: a,
+					end: o
 				};
 			});
-		}), jt = (e) => bt.value && e.start >= Et.value, Mt = h(() => At.value.some(jt)), Nt = (e) => N.columns[e]?.width == null && !bt.value, Pt = h(() => {
-			if (!bt.value) return -1;
-			for (let e = N.columns.length - 1; e >= 0; e--) {
-				let t = N.columns[e];
-				if (t.width == null && t.snap == null) return e;
+		}), Mr = (e) => K.value && e.start >= Dr.value, Nr = h(() => jr.value.some(Mr)), Pr = (e) => {
+			let t = z.value[e];
+			return (t ? vn(t) : null) == null && !K.value;
+		}, Fr = h(() => {
+			if (!K.value) return -1;
+			let e = z.value;
+			for (let t = e.length - 1; t >= 0; t--) {
+				let n = e[t];
+				if (n.width == null && n.snap == null) return t;
 			}
 			return -1;
-		}), Ft = h(() => {
-			let e = At.value[0];
-			if (!V.value || !R.value || !e) return null;
-			let t = kt(0, e.start), n = N.selectable ? U.select : null;
-			return n ? `calc(${t ?? "0px"} - ${n})` : t;
-		}), It = h(() => {
-			let e = At.value, t = e[e.length - 1];
-			if (!V.value || !R.value || !t || Mt.value || Pt.value === N.columns.length - 1) return null;
-			let n = kt(t.end, Dt.value), r = N.actions ? U.actions : null;
-			return r ? `calc(${n ?? "0px"} - ${r})` : n;
-		}), Lt = h(() => Ft.value !== null), Rt = h(() => It.value !== null), U = Ce({
-			select: null,
-			actions: null
-		}), zt = h(() => {
-			let e = (e) => V.value ? ft(e) : "auto", t = (t) => H.value && U[t] ? U[t] : e(t), n = [];
-			N.selectable && n.push({
+		}), Ir = h(() => {
+			let e = jr.value[0];
+			return !_r.value || !Jt.value || !e ? null : Ar(0, e.start);
+		}), Lr = h(() => {
+			let e = jr.value, t = e[e.length - 1];
+			return !_r.value || !Jt.value || !t || Nr.value ? null : Ar(t.end, Or.value);
+		}), Rr = (e) => Xt.tracks[e] ?? null, zr = (e, t, n) => !_r.value || !Jt.value ? null : n ? t ? `calc(${e ?? "0px"} - ${t})` : null : e, Br = h(() => zr(Ir.value, M.selectable ? Rr("select") : null, !!M.selectable)), Vr = h(() => Nr.value ? null : zr(Lr.value, M.actions ? Rr("actions") : null, !!M.actions)), Hr = h(() => Br.value !== null), Ur = h(() => Vr.value !== null), Wr = (e, t) => {
+			let n = q.value ? Y.value[t] : null;
+			return n == null ? e && Gr.value ? `minmax(${e}, max-content)` : "max-content" : `${n}px`;
+		}, Gr = h(() => Object.keys(Yt.value?.tracks ?? {}).length > 0), Kr = (e) => /^(auto|min-content|max-content|fit-content\(.*\)|-?[\d.]+fr)$/.test(e.trim()), qr = h(() => {
+			let e = [];
+			M.selectable && e.push({
 				key: "select",
-				width: t("select")
+				width: Wr(Ir.value, "select"),
+				contentSized: Y.value.select == null
 			});
-			let r = N.columns.length - 1;
-			return N.columns.forEach((e, t) => {
-				let i = String(t), a = e.width == null ? null : St(e.width), o = At.value[t];
-				if (t === Pt.value && !Mt.value) {
-					n.push({
-						key: i,
-						width: "auto"
+			let t = z.value, n = t.length - 1, r = !K.value && M.columns.length > 0 && M.columns.every((e) => e.width != null);
+			return t.forEach((t, i) => {
+				let a = String(i), o = vn(t), s = o == null ? null : Cr(o), c = jr.value[i], l = null, u = null;
+				if (s != null && Kr(s) ? u = s : s != null && r && !yn(t) ? u = `minmax(${s}, ${parseFloat(s) || 1}fr)` : s != null && xr(t) ? u = `minmax(${s}, 1fr)` : s == null ? Pr(i) ? u = M.fixed ? "minmax(0, 1fr)" : "auto" : Gr.value ? Mr(c) ? u = "min-content" : (l = Ar(c.start, c.end), l === null && (u = "auto")) : u = "max-content" : l = s, u !== null) {
+					e.push({
+						key: a,
+						width: u,
+						contentSized: /^(auto|min-content|max-content)$/.test(u)
 					});
 					return;
 				}
-				let s;
-				s = a ?? (Nt(t) ? H.value && Kt.value[t] || null : jt(o) ? qt.value[t] ?? null : kt(o.start, o.end));
-				let c = [];
-				t === 0 && Lt.value && c.push("var(--offset-internal-start, 0px)"), t === r && Rt.value && c.push("var(--offset-internal-end, 0px)");
-				let l = c.length ? `calc(${[...c, s ?? "0px"].join(" + ")})` : s ?? "auto";
-				n.push({
-					key: i,
-					width: l
+				let d = [];
+				i === 0 && Hr.value && d.push("var(--offset-internal-start, 0px)"), i === n && Ur.value && d.push("var(--offset-internal-end, 0px)");
+				let f = d.length ? `calc(${[...d, l].join(" + ")})` : l, p = i === Fr.value && !Nr.value ? `minmax(${f}, 1fr)` : f;
+				e.push({
+					key: a,
+					width: p,
+					contentSized: !1
 				});
-			}), N.actions && n.push({
+			}), M.actions && e.push({
 				key: "actions",
-				width: t("actions")
-			}), n;
-		}), Bt = h(() => {
+				width: Wr(Lr.value, "actions"),
+				contentSized: Y.value.actions == null
+			}), e;
+		}), Jr = h(() => {
+			let e = z.value, t = [];
+			for (let n of qr.value) {
+				if (n.contentSized) continue;
+				let r = e[Number(n.key)];
+				r && t.push(String(r.key));
+			}
+			return t.join(" ");
+		}), Yr = h(() => new Set(Jr.value.split(" ").filter(Boolean))), Xr = h(() => qr.value.map((e) => e.width).join(" ")), Zr = C(Xr.value), Qr = h(() => `grid-template-columns: ${Zr.value}`);
+		D(Xr, (e) => {
+			if (H && I.value) {
+				I.value.style.gridTemplateColumns = e;
+				return;
+			}
+			Zr.value = e;
+		}, { flush: "sync" });
+		let $r = h(() => {
 			let e = {};
-			return Ft.value && (e["--offset-start"] = Ft.value), It.value && (e["--offset-end"] = It.value), e;
-		}), Vt = h(() => {
-			let e = {
-				...dt.value,
-				...Bt.value
-			};
-			return Jt.value && (e["--natural-width"] = Jt.value), W.value > 0 && (e["--fill"] = `${W.value}px`), e;
-		}), Ht = () => Array.from(I.value?.querySelectorAll(":scope > thead > tr.bb-table-header-row > th") ?? []), Ut = () => {
-			let e = zt.value.map((e) => e.key), t = {};
-			Ht().forEach((n, r) => {
-				let i = e[r];
-				i != null && (t[i] = `${n.getBoundingClientRect().width}px`);
-			}), pt(t);
-		}, Wt = () => {
-			let e = I.value;
-			if (!e) return;
-			let t = [
-				"block",
-				"flex",
-				"grid",
-				"flow-root",
-				"list-item"
-			], n = [
-				"BUTTON",
-				"INPUT",
-				"SELECT",
-				"TEXTAREA",
-				"IMG",
-				"svg",
-				"VIDEO",
-				"CANVAS"
-			], r = (e) => {
-				let i = getComputedStyle(e), a = i.display.includes("flex") || i.display.includes("grid"), o = 0, s = 0;
-				if (e.querySelectorAll(":scope > *").forEach((e) => {
-					let i = getComputedStyle(e);
-					if (i.position === "absolute" || i.position === "fixed") return;
-					let c = parseFloat(i.marginLeft) + parseFloat(i.marginRight), l = !a && !n.includes(e.tagName) && i.cssFloat === "none" && t.includes(i.display) ? r(e) + parseFloat(i.paddingLeft) + parseFloat(i.paddingRight) + parseFloat(i.borderLeftWidth) + parseFloat(i.borderRightWidth) : e.getBoundingClientRect().width;
-					o += l + (c || 0), s += 1;
-				}), s === 0) {
-					let t = document.createRange();
-					return t.selectNodeContents(e), t.getBoundingClientRect().width;
-				}
-				if (s > 1) {
-					let e = parseFloat(i.columnGap);
-					e && (o += e * (s - 1));
+			return Br.value && (e["--offset-start"] = Br.value), Vr.value && (e["--offset-end"] = Vr.value), e;
+		}), X = C({}), ei = [
+			.62,
+			.42,
+			.78,
+			.52
+		], ti = (e) => {
+			let t = ["transparent 0"], n = 0;
+			return e.forEach((e, r) => {
+				let i = ei[r % ei.length], a = Math.round((e - Pt * 2) * i);
+				if (a >= Ft) {
+					let e = Math.round(n + Pt);
+					t.push(`transparent ${e}px`, `currentColor ${e}px ${e + a}px`, `transparent ${e + a}px`);
 				}
-				return o;
-			}, i = (t) => {
-				let n = 0;
-				return e.querySelectorAll(t).forEach((e) => {
-					let t = getComputedStyle(e), i = parseFloat(t.paddingLeft) + parseFloat(t.paddingRight);
-					n = Math.max(n, r(e) + i);
-				}), n > 0 ? `${Math.ceil(n)}px` : null;
-			};
-			U.select = N.selectable ? i(":scope > thead > tr > th.bb-table-header--select, :scope > tbody > tr > td.bb-table-data__cell--select") : null, U.actions = N.actions ? i(":scope > thead > tr > th.bb-table-header--actions, :scope > tbody > tr > td.bb-table__cell--actions") : null;
-		}, Gt = () => {
-			Wt(), Ut();
-		}, Kt = C([]), qt = C([]), W = C(0), Jt = C(null), Yt = () => {
-			let e = L.value;
-			if (!e || !H.value || !N.columns.some((e) => e.width != null) && !Mt.value && Pt.value < 0) return;
-			let t = e.offsetWidth, n = +!!N.selectable, r = U.select ? parseFloat(U.select) : 0, i = U.actions ? parseFloat(U.actions) : 0, a = Ht(), o = 0, s = 0;
-			N.columns.forEach((e, t) => {
-				let r = a[n + t]?.getBoundingClientRect().width ?? 0;
-				e.width != null && (o += r), Nt(t) || (s += r);
+				n += e;
+			}), `linear-gradient(90deg, ${t.join(",")})`;
+		}, ni = (e) => {
+			if (!q.value) {
+				X.value["--placeholder-bars"] && (X.value = {});
+				return;
+			}
+			let t = e.map((e) => parseFloat(e));
+			t.some((e) => !(e >= 0)) || (X.value = {
+				...X.value,
+				"--placeholder-bars": ti(t)
 			});
-			let c = document.createElement("div");
-			c.style.cssText = [
-				"position:absolute",
-				"top:-9999px",
-				"left:-9999px",
-				"visibility:hidden",
-				"pointer-events:none",
-				`width:${t}px`,
-				`height:${e.offsetHeight}px`,
-				"overflow:visible"
-			].join(";");
-			let l = e.cloneNode(!0);
-			l.classList.remove("bb-table--fixed"), l.querySelectorAll(".bb-table-expand__row").forEach((e) => e.remove());
-			let u = Array.from(l.querySelectorAll("col"));
-			N.columns.forEach((e, t) => {
-				if (e.width == null) {
-					let e = u[n + t];
-					e && (e.style.width = "");
-				}
+		}, ri = () => {
+			if (!q.value) return;
+			let e = Math.round(ba.value || ra.value);
+			if (!(e > 0)) return;
+			let t = `${e}px`;
+			X.value["--row-h"] !== t && (X.value = {
+				...X.value,
+				"--row-h": t
 			});
-			let ee = l.querySelector("table");
-			ee && (ee.style.width = "min-content", ee.style.minWidth = "0"), c.appendChild(l), document.body.appendChild(c);
-			let te = c.querySelector("table thead tr.bb-table-header-row"), ne = te ? Array.from(te.querySelectorAll(":scope > th")) : [], d = N.columns.map((e, t) => {
-				if (e.width != null) return 0;
-				let r = ne[n + t];
-				return r ? r.getBoundingClientRect().width : 0;
+		}, ii = h(() => ({
+			...Zt.value,
+			...$r.value,
+			...X.value,
+			...M.fixedHeaders || q.value ? { "--stuck-head-h": `${si.value}px` } : null,
+			...br.value ? { "--virtual-row-tracks": yr.value } : null
+		})), ai = () => {
+			let e = I.value, t = qr.value.length;
+			if (!e || !t) return [];
+			let n = e.querySelector(":scope > .bb-table__head > .bb-table-header-row"), r = [...n ? [n] : [], ...Array.from(e.querySelectorAll(":scope > .bb-table__head > [role=\"row\"], :scope > .bb-table__body > [role=\"row\"]"))].find((e) => e.children.length >= t);
+			return r ? Array.from(r.children) : [];
+		}, oi = "", si = C(0), ci = () => {
+			let e = I.value;
+			if (!e) return;
+			if (M.fixedHeaders || q.value) {
+				let t = e.querySelector(":scope > .bb-table__head"), n = t ? Math.round(t.getBoundingClientRect().height) : 0;
+				n !== si.value && (si.value = n);
+			}
+			let t = be(e);
+			if (!t) return;
+			let n = qr.value.map((e) => e.key);
+			if (t.length !== n.length) return;
+			let r = t.join(" "), i = `${pi.value}|${r}`;
+			if (i === oi) return;
+			oi = i;
+			let a = {};
+			n.forEach((e, n) => {
+				a[e] = t[n];
 			});
-			document.body.removeChild(c);
-			let f = N.columns.reduce((e, t, n) => e + (Nt(n) ? d[n] : 0), 0), re = t - s - r - i, ie = (e) => `${Number(e.toFixed(3))}px`;
-			if (Kt.value = N.columns.map((e, t) => {
-				if (!Nt(t)) return null;
-				let n = d[t];
-				if (f <= 0) return ie(n);
-				let r = re > 0 ? n / f * re : 0;
-				return ie(Math.max(n, r));
-			}), qt.value = d.map((e) => e > 0 ? ie(e) : null), Pt.value >= 0) {
-				let e = Object.values(ut.value?.tracks ?? {}).reduce((e, t) => e + (parseFloat(t) || 0), 0), t = a.reduce((e, t) => e + t.getBoundingClientRect().width, 0);
-				W.value = Math.max(0, e - t + W.value);
-			} else W.value = 0;
-			let ae = d.reduce((e, t) => e + t, 0), p = o + ae + r + i;
-			Jt.value = p > 0 ? `${Math.ceil(p)}px` : null;
-		}, G = null, Xt, Zt = C(!1), Qt = !1, $t = () => {
-			let e = L.value, t = I.value;
-			Qt = !!e && !!t && t.getBoundingClientRect().width > e.clientWidth + 1;
-		}, en = () => {
-			G !== null && clearTimeout(G), G = setTimeout(() => {
-				G = null, Yt(), be(() => {
-					Zt.value = !1, $t();
-				});
-			}, 200);
-		}, K, tn, nn = () => {
-			K && (K.disconnect(), Ht().forEach((e) => K?.observe(e)), Gt());
+			let o = String(M.columns.length - 1), s = Br.value, c = Vr.value;
+			s && a[0] && (a[0] = `calc(${a[0]} - (${s}))`, !M.selectable && Ir.value && (a.select = Ir.value)), c && a[o] && (a[o] = `calc(${a[o]} - (${c}))`, !M.actions && Lr.value && (a.actions = Lr.value)), Fa(t), ni(t), q.value && (yr.value = r), li = t, $t(a), M.fixedColumns?.length && fe(e, M.fixedColumns, t);
+		}, li = null, ui, di = () => {
+			if (!ui) return;
+			ui.disconnect();
+			let e = ai();
+			e.forEach((e) => ui?.observe(e)), e.length && ci();
 		};
-		Se(() => {
-			K = new ResizeObserver(() => Gt()), nn(), be(Yt), I.value && (Xt = new MutationObserver(en), Xt.observe(I.value, {
-				childList: !0,
-				subtree: !0,
-				characterData: !0
-			})), L.value && (tn = new ResizeObserver(() => {
-				Qt || (Zt.value = !0), en();
-			}), tn.observe(L.value));
-		}), xe(() => {
-			K?.disconnect(), tn?.disconnect(), Xt?.disconnect(), G !== null && clearTimeout(G);
-		}), O(zt, () => be(nn), { flush: "post" });
-		let rn = (e, t) => N.accessibleLabel ? N.accessibleLabel(e, t) : [F("table.select").value, ...e.map((e) => e.content)].join(" "), an = h(() => N.selectable ? "fieldset" : "div"), on = h(() => N.legend || N.caption || F("table.selectableLegend").value), q = h(() => N.loading || pn.value), sn = h(() => q.value && !N.interactiveWhileLoading), J = h(() => vt.value && !o(B.page) && !o(B.perPage) && !o(B.totalItems) && B.page >= 1 && B.perPage > 0 && B.totalItems >= 0), cn = h(() => ({
+		ke(() => {
+			ui = new ResizeObserver(ci), di();
+		}), Oe(() => {
+			ui?.disconnect();
+		});
+		let fi = h(() => qr.value.map((e) => e.key).join(" ")), pi = h(() => an.value.join(" "));
+		D([fi, pi], () => {
+			De(di), requestAnimationFrame(() => {
+				I.value && ci();
+			});
+		}, { flush: "post" });
+		let mi = (e, t) => M.accessibleLabel ? M.accessibleLabel(e, t) : [F("table.select").value, ...e.map((e) => e.content)].join(" "), hi = h(() => M.selectable ? "fieldset" : "div"), gi = h(() => M.legend || M.caption || F("table.selectableLegend").value), _i = h(() => M.loading || Di.value), vi = h(() => _i.value && !M.interactiveWhileLoading), yi = h(() => hr.value && !l(G.page) && !l(G.perPage) && !l(G.totalItems) && G.page >= 1 && G.perPage > 0 && G.totalItems >= 0), bi = h(() => ({
 			"bb-table": !0,
-			[`bb-table--align-${N.align}`]: !0,
-			"bb-table--compact": N.compact,
-			"bb-table--fixed": H.value,
-			"bb-table--inherit-widths": xt.value,
-			"bb-table--fixed-header": N.fixedHeaders,
-			"bb-table--loading": q.value,
-			"bb-table--empty": !Y.value.length,
-			"bb-table--selectable": !!N.selectable,
-			"bb-table--measuring": Zt.value,
+			[`bb-table--align-${M.align}`]: !0,
+			"bb-table--compact": M.compact,
+			"bb-table--reorderable": !!M.reorderable,
+			"bb-table--resizable": gn.value,
+			"bb-table--fixed": vr.value,
+			"bb-table--inherit-widths": Sr.value,
+			"bb-table--fixed-header": M.fixedHeaders || q.value,
+			"bb-table--virtual": q.value,
+			"bb-table--virtual-flat": br.value,
+			"bb-table--loading": _i.value,
+			"bb-table--empty": !Z.value.length,
+			"bb-table--selectable": !!M.selectable,
 			"scrollbar-border": !0
-		})), ln = h(() => N.columns.length + Number(!!N.selectable) + Number(!!N.actions)), un = h(() => Object.fromEntries(N.columns.map((e) => [e.key, de(e.key)]))), { getter: dn, items: fn, loading: pn } = c({ items: Te(N, "items") }), { hasPrefilled: mn } = ie({
+		})), xi = h(() => M.columns.length + Number(!!M.selectable) + Number(!!M.actions)), Si = h(() => Object.fromEntries(M.columns.map((e) => [e.key, pe(e.key)]))), { getter: Ci, clientReproducible: wi, hydratedFromSsr: Ti, items: Ei, loading: Di } = d({ items: Pe(M, "items") }), { hasPrefilled: Oi } = ae({
+			alreadyLoaded: Ti,
+			clientReproducible: wi,
 			trigger: !0,
 			fn: async (e) => {
-				await dn(e, B.selected), yn();
+				await Ci(e, G.selected), Ni();
 			}
-		}), { data: hn } = f({ items: h(() => B.selected) }), { options: Y, baseOptions: gn } = re({
-			disabled: Te(N, "disabled"),
-			items: fn,
+		}), { data: ki } = re({ items: h(() => G.selected) }), { options: Z, baseOptions: Ai } = ie({
+			disabled: Pe(M, "disabled"),
+			items: Ei,
 			itemText: void 0,
-			itemValue: N.itemValue,
-			max: N.max,
+			itemValue: M.itemValue,
+			max: M.max,
 			selectable: !0,
-			selectedIndexedByHash: hn
-		}), _n = async (e) => {
-			N.multiple ? B.selected = (B.selected ?? []).concat(e.value) : B.selected = e.value;
-		}, vn = async (e) => {
-			if (N.multiple) {
-				let t = { ...hn.value };
-				delete t[e.valueHash], B.selected = Object.values(t);
-			} else B.selected = null;
+			selectedIndexedByHash: ki
+		}), ji = async (e) => {
+			M.multiple ? G.selected = (G.selected ?? []).concat(e.value) : G.selected = e.value;
+		}, Mi = async (e) => {
+			if (M.multiple) {
+				let t = { ...ki.value };
+				delete t[e.valueHash], G.selected = Object.values(t);
+			} else G.selected = null;
 		};
-		ee(() => [
-			N.dependencies,
-			N.items,
-			typeof N.items == "function" ? [B.page, B.perPage] : void 0
+		p(() => [
+			M.dependencies,
+			M.items,
+			typeof M.items == "function" ? [G.page, G.perPage] : void 0
 		], async () => {
-			mn.value && (await dn(!0, B.selected), yn());
-		}, { debounce: N.depsDebounceTime });
-		let yn = () => {
-			if (!N.enforceCoherence) return;
-			let e = new Set(Y.value.map((e) => e.valueHash)), t = (t) => e.has(u(t));
-			if (N.multiple) {
-				let e = B.selected ?? [];
-				e.every(t) || (B.selected = e.filter(t));
-			} else !o(B.selected) && !t(B.selected) && (B.selected = null);
-			let n = B.unselected ?? [];
-			n.every(t) || (B.unselected = n.filter(t)), !o(j.value) && !t(j.value) && (j.value = null), M.value.every(t) || (M.value = M.value.filter(t));
-		}, bn = (e, t) => {
-			let n = un.value[e.key], r = e.align ?? "left", i = ot(t.item, e.key);
-			return e.formatter && (!o(i) || e.formatOnNull !== !1) && (i = e.formatter(i, e.key, t.item)), e.placeholder && o(i) && (i = e.placeholder), {
+			Oi.value && (await Ci(!0, G.selected), Ni());
+		}, { debounce: M.depsDebounceTime });
+		let Ni = () => {
+			if (!M.enforceCoherence) return;
+			let e = new Set(Z.value.map((e) => e.valueHash)), t = (t) => e.has(u(t));
+			if (M.multiple) {
+				let e = G.selected ?? [];
+				e.every(t) || (G.selected = e.filter(t));
+			} else !l(G.selected) && !t(G.selected) && (G.selected = null);
+			let n = G.unselected ?? [];
+			n.every(t) || (G.unselected = n.filter(t)), !l(A.value) && !t(A.value) && (A.value = null), j.value.every(t) || (j.value = j.value.filter(t));
+		}, Pi = (e, t) => {
+			let n = Si.value[e.key], r = e.align ?? "left", i = Ht(t.item, e.key);
+			return e.formatter && (!l(i) || e.formatOnNull !== !1) && (i = e.formatter(i, e.key, t.item)), e.placeholder && l(i) && (i = e.placeholder), {
 				align: r,
-				classes: fe([`bb-table-data__cell--${r}`], N.tdClass, e.tdClass, i, e.key, t.item),
+				get classes() {
+					return he([`bb-table-data__cell--${r}`], M.tdClass, e.tdClass, i, e.key, t.item);
+				},
 				content: i,
 				key: e.key,
 				label: e.label,
 				slotName: n
 			};
-		}, xn = h(() => N.columns.map((e) => {
-			let t = e.align ?? "left", n = `header:${un.value[e.key]}`, r = gt(e.key), i = r ?? e.sorted, a = i ? i === "asc" ? "ascending" : "descending" : void 0;
+		}, Fi = h(() => z.value.map((e) => {
+			let t = e.align ?? "left", n = Si.value[e.key], r = Kt(n) ? `header:${n} (shadowed)` : `header:${n}`, i = pr(e.key), a = i ?? e.sorted, o = a ? a === "asc" ? "ascending" : "descending" : void 0;
 			return {
 				align: t,
 				key: e.key,
 				label: e.label,
-				slotName: n,
-				classes: pe([`bb-table-header--${t}`], N.thClass, e.thClass),
+				slotName: r,
+				classes: ge([`bb-table-header--${t}`], M.thClass, e.thClass),
 				sortable: !!e.sortable,
-				sortDirection: a,
-				sortOrder: r
+				sortDirection: o,
+				sortOrder: i
 			};
-		})), Sn = (e, t) => {
-			let n = Y.value[e];
-			return n && n.valueHash === t ? n : Y.value.find((e) => e.valueHash === t);
-		}, Cn = h(() => gn.value.map((e, t) => {
-			let n = N.columns.map((t) => bn(t, e));
+		})), Ii = (e, t) => {
+			let n = Si.value[e];
+			return (Kt(n) ? void 0 : P[`header:${n}:${t}`]) ?? P[`header:${t}`];
+		}, Li = (e) => ({
+			classes: e.classes,
+			columnKey: e.key,
+			items: Ei.value,
+			label: e.label,
+			sortable: e.sortable,
+			sortOrder: e.sortOrder,
+			toggleSort: () => mr(e.key)
+		}), Ri = (e, t) => {
+			let n = Z.value[e];
+			return n && n.valueHash === t ? n : Z.value.find((e) => e.valueHash === t);
+		}, zi = (e) => {
+			let t = Ai.value[e], n = z.value.map((e) => Pi(e, t));
 			return {
-				accessibleLabel: rn(n, e.item),
+				accessibleLabel: mi(n, t.item),
 				cols: n,
-				rowClasses: me(N.rowClass, N.columns, n, e.item),
+				get rowClasses() {
+					return _e(M.rowClass, z.value, n, t.item);
+				},
 				onRowClick: (n) => {
-					let r = Sn(t, e.valueHash);
-					r && (ht(n, r), P("click:row", n, r, !!r.selected));
+					let r = Ri(e, t.valueHash);
+					r && (fr(n, r), N("click:row", n, r.item));
 				},
 				onRowContextMenu: (n) => {
-					let r = Sn(t, e.valueHash);
-					r && P("contextmenu:row", n, r, !!r.selected);
+					let r = Ri(e, t.valueHash);
+					r && N("contextmenu:row", n, r.item);
 				},
 				onRowDblClick: (n) => {
-					let r = Sn(t, e.valueHash);
-					r && P("dblclick:row", n, r, !!r.selected);
+					let r = Ri(e, t.valueHash);
+					r && N("dblclick:row", n, r.item);
+				},
+				item: t.item,
+				get text() {
+					return t.text;
+				},
+				valueHash: t.valueHash,
+				value: t.value
+			};
+		}, Bi = h(() => {
+			Ai.value, Si.value, M.tdClass, M.rowClass, M.accessibleLabel;
+			for (let e of z.value) e.align, e.formatOnNull, e.formatter, e.key, e.label, e.placeholder, e.tdClass;
+			return /* @__PURE__ */ new Map();
+		}), Vi = (e) => {
+			if (!(!q.value || e.size <= It)) {
+				for (let t of e.keys()) if (e.delete(t), e.size <= It) break;
+			}
+		}, Hi = (e) => {
+			let t = Bi.value, n = t.get(e);
+			if (n) return n;
+			let r = zi(e);
+			return t.set(e, r), Vi(t), r;
+		}, Ui = h(() => (Bi.value, Q.value, Z.value, ar.value, M.selectable, /* @__PURE__ */ new Map())), Wi = (e) => {
+			let t = Ui.value, n = t.get(e.index);
+			if (n) return n;
+			let r = Hi(e.index), i = Z.value[e.index], a = !M.selectable || typeof M.selectable == "function" && !M.selectable(r.item) || !!i.disabled, o = {
+				accessibleLabel: r.accessibleLabel,
+				cols: r.cols,
+				item: r.item,
+				onRowClick: r.onRowClick,
+				onRowContextMenu: r.onRowContextMenu,
+				onRowDblClick: r.onRowDblClick,
+				get rowClasses() {
+					return r.rowClasses;
+				},
+				get text() {
+					return r.text;
 				},
-				item: e.item,
-				text: e.text,
-				valueHash: e.valueHash,
-				value: e.value
+				value: r.value,
+				valueHash: r.valueHash,
+				expanded: e.expanded,
+				highlighted: r.valueHash in ar.value,
+				rowIndex: e.rowIndex,
+				selected: i.selected,
+				disabled: a,
+				expandProps: {},
+				toggleExpanded: () => qa(r.valueHash),
+				toggleHighlighted: () => dr(r, { viaSlot: !0 }),
+				toggleSelected: () => eo(o)
 			};
-		})), wn = h(() => {
-			let e = 0, t = ((B.page ?? 0) - 1) * (B.perPage ?? 0);
-			return Cn.value.map((n, r) => {
-				let i = Y.value[r], a = !N.selectable || typeof N.selectable == "function" && !N.selectable(n.item) || !!i.disabled, o = r + 1, s = t + 1 + o + e, c = kn.value[n.valueHash] ?? !1;
-				return c && e++, {
-					...n,
-					expanded: c,
-					highlighted: n.valueHash in mt.value,
-					rowIndex: s,
-					selected: i.selected,
-					disabled: a
+			return o.expandProps = Ka(o), t.set(e.index, o), Vi(t), o;
+		}, Gi = C(0);
+		D(() => Ai.value.length, (e) => {
+			Gi.value = te(Gi.value, 0, Math.max(0, e - 1));
+		});
+		let Ki = () => I.value?.querySelectorAll(":scope > .bb-table__body > .bb-table-data__row"), qi = (e) => {
+			let t = Ki();
+			if (t) {
+				if (!q.value) return t[e];
+				for (let n of t) if (Q.value[Number(n.dataset.index)]?.index === e) return n;
+			}
+		}, Ji = () => new Promise((e) => requestAnimationFrame(() => e())), Yi = async (e) => {
+			Gi.value = e;
+			let t = qi(e);
+			if (q.value && !t) {
+				let n = Q.value.findIndex((t) => t.kind === "row" && t.index === e);
+				if (n >= 0) {
+					pa++, va();
+					try {
+						for (let r = 0; r < 8 && !t; r++) Ma.value.scrollToIndex(n, { align: "auto" }), await Ji(), await De(), t = qi(e);
+					} finally {
+						pa--;
+					}
+				}
+			}
+			if (t?.focus(), t?.scrollIntoView({ block: "nearest" }), t && q.value) for (let e = 0; e < 4; e++) {
+				let e = t.getBoundingClientRect().top;
+				if (await Ji(), t.scrollIntoView({ block: "nearest" }), Math.abs(t.getBoundingClientRect().top - e) < .5) break;
+			}
+		}, Xi = (e) => {
+			M.keyboardNavigation && (Gi.value = e);
+		}, Q = h(() => {
+			let e = [], t = 0, n = ((G.page ?? 0) - 1) * (G.perPage ?? 0);
+			return Ai.value.forEach((r, i) => {
+				let a = r.valueHash in Wa.value, o = n + 1 + i + 1 + t;
+				e.push({
+					kind: "row",
+					index: i,
+					key: `r:${r.valueHash}`,
+					virtualIndex: e.length,
+					expanded: a,
+					rowIndex: o
+				}), a && (t++, e.push({
+					kind: "expand",
+					index: i,
+					key: `x:${r.valueHash}`,
+					virtualIndex: e.length,
+					expanded: a,
+					rowIndex: o
+				}));
+			}), e;
+		}), Zi = (e, t, n, r) => {
+			let i;
+			return {
+				kind: t,
+				index: e.index,
+				key: n,
+				virtualIndex: e.virtualIndex,
+				height: r,
+				get item() {
+					return i ??= Wi(e);
+				}
+			};
+		}, Qi = Ne(null), $i = C(0), ea = C(null), ta = (e) => /^(auto|scroll)$/.test(getComputedStyle(e).overflowY), na = () => {
+			let e = L.value, t = ea.value, n = I.value;
+			if (!q.value || !e || !t || !n) {
+				Qi.value = null;
+				return;
+			}
+			let r = e.getBoundingClientRect(), i = n.getBoundingClientRect().bottom - r.top, a = getComputedStyle(e).maxHeight !== "none" || e.scrollHeight > e.clientHeight + 1 || e.clientHeight > i + 1, o = window;
+			if (a) o = e;
+			else {
+				let t = e.parentElement;
+				for (; t && t !== document.body && t !== document.documentElement;) {
+					if (ta(t)) {
+						o = t;
+						break;
+					}
+					t = t.parentElement;
+				}
+			}
+			let s = t.getBoundingClientRect().top, c = o === window ? s + window.scrollY : s - o.getBoundingClientRect().top + o.scrollTop;
+			$i.value !== c && ($i.value = c), Qi.value !== o && (Qi.value = o);
+		}, ra = C(37), ia = () => {
+			let e = L.value;
+			if (!e) return;
+			let t = parseFloat(getComputedStyle(e).getPropertyValue("--cell-h"));
+			t > 0 && (ra.value = t + 1);
+		}, aa = C(null), oa = (e) => {
+			if (!q.value || !ea.value) return;
+			let t = e.target;
+			for (; t && t.parentElement !== ea.value;) t = t.parentElement;
+			let n = Number(t?.dataset.index);
+			aa.value = Number.isInteger(n) ? n : null;
+		}, sa = (e) => {
+			if (!q.value) return;
+			let t = e.relatedTarget;
+			(!t || !ea.value?.contains(t)) && (aa.value = null);
+		}, ca = C(0), la = 0, ua = C(!1), da, fa = {
+			offset: 0,
+			time: 0
+		}, pa = 0, ma = /* @__PURE__ */ new Set(), ha = null, ga = 0, _a = (e) => {
+			ga = ga ? ga * .7 + e * .3 : e;
+		}, va = () => {
+			clearTimeout(da), da = void 0, ua.value && (ua.value = !1, Ea());
+		}, ya = (e) => {
+			let t = performance.now(), n = t - fa.time, r = e - fa.offset;
+			if (fa = {
+				offset: e,
+				time: t
+			}, pa > 0) return;
+			let i = ha;
+			if (n > 0 && n < 250 && i && ga) {
+				let e = $?.scrollRect?.height ?? 0, t = (i.end - i.start + e) / 2;
+				Math.abs(r) / n * ga > t && (ua.value = !0);
+			}
+			clearTimeout(da), da = setTimeout(va, zt);
+		}, ba = C(0), xa = -1, Sa = !1, Ca = () => {
+			let e = $?.itemSizeCache;
+			if (!e?.size || e.size === xa) return;
+			xa = e.size;
+			let t = /* @__PURE__ */ new Map(), n = 0;
+			for (let [r, i] of e) {
+				if (typeof r != "string" || !r.startsWith("r:")) continue;
+				let e = Math.round(i);
+				t.set(e, (t.get(e) ?? 0) + 1), n++;
+			}
+			if (n >= 5) {
+				let e = 0, r = -1;
+				for (let [n, i] of t) (i > r || i === r && n < e) && (r = i, e = n);
+				e > 0 && !Sa && (ba.value = e, n >= 20 && (Sa = !0));
+			}
+			ri();
+		}, $ = null, wa = !1;
+		D(q, (e) => {
+			wa = e;
+		}, { immediate: !0 });
+		let Ta = Ne([]), Ea = (e = !1) => {
+			if (la &&= (cancelAnimationFrame(la), 0), !$) return;
+			let t = q.value ? $.getVirtualItems() : [];
+			ca.value = $.getTotalSize();
+			let n = [], r = null;
+			if (t.length) {
+				let e = $.measurementsCache, i = Q.value.length, a = $.range, o = a ? a.startIndex : t[0].index, s = a ? a.endIndex : t[t.length - 1].index;
+				for (let e of t) n.push({
+					index: e.index,
+					start: e.start,
+					end: e.end,
+					size: e.size
+				});
+				let c = e?.[Math.max(0, o - Rt)], l = e?.[Math.min(i - 1, s + Rt)] ?? c;
+				c && l && (r = {
+					start: c.start,
+					end: l.end
+				});
+			}
+			let i = !Da || !r || Da.start !== r.start || Da.end !== r.end;
+			if (Da = r, Ta.value = n, !r) return;
+			if (!e || !i) {
+				ha = r;
+				return;
+			}
+			let a = performance.now(), o = r;
+			De(() => {
+				_a(performance.now() - a), ha = o;
+			});
+		}, Da = null, Oa = () => {
+			la ||= requestAnimationFrame(() => {
+				la = 0, Ca(), Ea();
+			});
+		}, ka = (e, t) => {
+			t ? (ya(e.getScrollOffset()), Ea(!0)) : Oa();
+		}, Aa = (e) => Q.value[e]?.key ?? e, ja = (e) => (Q.value[e]?.kind === "expand" ? 3 : 1) * (ba.value || ra.value), Ma = Ge(h(() => {
+			let e = Qi.value, t = e === window, n = aa.value;
+			return {
+				onChange: ka,
+				count: q.value ? Q.value.length : 0,
+				enabled: q.value,
+				getScrollElement: () => e,
+				estimateSize: ja,
+				getItemKey: Aa,
+				overscan: Rt,
+				scrollMargin: $i.value,
+				initialRect: {
+					width: 0,
+					height: 800
+				},
+				rangeExtractor: (e) => {
+					let t = ze(e.endIndex - e.startIndex > Lt ? {
+						...e,
+						endIndex: e.startIndex + Lt
+					} : e);
+					return n == null || n >= e.count || t.includes(n) ? t : [...t, n].sort((e, t) => e - t);
+				},
+				observeElementRect: t ? We : He,
+				observeElementOffset: t ? Ue : Ve,
+				scrollToFn: t ? Ke : Be
+			};
+		}));
+		$ = Ma.value, Ea();
+		let Na = (e) => {
+			wa && $?.measureElement(e);
+		}, Pa = h(() => {
+			let e = Q.value;
+			if (Ui.value, !q.value) return e.map((e) => Zi(e, e.kind, e.key, 0));
+			let t = Ta.value;
+			if (!t.length) return [];
+			let n = [], r = $i.value, i = ua.value, a = r, o;
+			for (let r of t) {
+				let t = e[r.index];
+				if (!t) continue;
+				let s = r.start - a;
+				s > .5 && n.push(Zi(t, "spacer", `s:${t.key}`, s)), i && t.kind === "row" && !ma.has(t.key) ? n.push(Zi(t, "placeholder", `p:${t.key}`, r.size)) : n.push(Zi(t, t.kind, t.key, 0)), a = r.end, o = t;
+			}
+			let s = ca.value - (a - r);
+			return s > .5 && o && n.push(Zi(o, "spacer", "s:end", s)), n;
+		});
+		D(Pa, (e) => {
+			if (q.value) for (let t of e) (t.kind === "row" || t.kind === "expand") && ma.add(t.key);
+		}, { flush: "post" });
+		let Fa = (e) => {
+			let t = I.value;
+			if (!q.value || !t || !t.querySelector(":scope > .bb-table__body > .bb-table-data__row")) return;
+			let n = z.value, r = null, i = null;
+			if (qr.value.forEach((t, a) => {
+				if (t.key === "select" || t.key === "actions") {
+					if (t.key in Y.value) return;
+					let n = parseFloat(e[a]);
+					if (!(n > 0)) return;
+					(i ??= { ...Y.value })[t.key] = n;
+					return;
+				}
+				let o = n[Number(t.key)];
+				if (!o || o.width != null) return;
+				let s = String(o.key);
+				if (s in J.value || s in (r ?? {})) return;
+				let c = parseFloat(e[a]);
+				c > 0 && ((r ??= { ...J.value })[s] = c);
+			}), !r && !i || Ia) return;
+			let a = r, o = i;
+			Ia = requestAnimationFrame(() => {
+				Ia = 0, a && (J.value = {
+					...J.value,
+					...a
+				}), o && (Y.value = {
+					...Y.value,
+					...o
+				});
+			});
+		}, Ia = 0;
+		D(() => [q.value, Z.value.length === 0], ([e, t]) => {
+			(!e || t) && (J.value = {}, Y.value = {}, yr.value = "");
+		}), D(ra, () => {
+			q.value && Ma.value.measure();
+		});
+		let La, Ra, za = () => {
+			La?.disconnect(), La = void 0, Ra?.(), Ra = void 0;
+			let e = L.value;
+			if (!q.value || !e) return;
+			let t = 0, n = () => {
+				t ||= requestAnimationFrame(() => {
+					t = 0, na();
+				});
+			};
+			if (Qi.value === e) La = new ResizeObserver(() => na()), La.observe(e);
+			else {
+				window.addEventListener("resize", n);
+				let e = new ResizeObserver(n);
+				e.observe(document.documentElement), Ra = () => {
+					window.removeEventListener("resize", n), e.disconnect(), t && cancelAnimationFrame(t);
 				};
+			}
+		};
+		D(Qi, za), D(() => [q.value, Q.value.length], () => {
+			De(() => {
+				ia(), na(), za(), ma = /* @__PURE__ */ new Set(), xa = -1, Sa = !1, Ea();
 			});
-		}), X = C(0);
-		O(() => wn.value.length, (e) => {
-			X.value = ne(X.value, 0, Math.max(0, e - 1));
+		}, { flush: "post" });
+		let Ba = () => {
+			q.value && Object.keys(J.value).length && (J.value = {});
+		}, Va, Ha = () => {
+			let e = typeof document < "u" ? document.fonts : void 0;
+			!e || Va || (e.status !== "loaded" && e.ready.then(Ba), e.addEventListener("loadingdone", Ba), Va = () => e.removeEventListener("loadingdone", Ba));
+		};
+		ke(() => {
+			ia(), ri(), na(), za(), Ea(), q.value && Ha();
+		}), D(q, (e) => {
+			e && Ha(), li && ni(li), ri();
+		}), Oe(() => {
+			La?.disconnect(), Ra?.(), Va?.(), la && cancelAnimationFrame(la);
 		});
-		let Tn = () => I.value?.querySelectorAll(":scope > tbody > tr.bb-table-data__row"), En = (e) => {
-			X.value = e;
-			let t = Tn()?.[e];
-			t?.focus(), t?.scrollIntoView({ block: "nearest" });
-		}, Dn = (e) => {
-			N.keyboardNavigation && (X.value = e);
-		}, On = (e, t) => {
-			if (!N.keyboardNavigation || e.target !== e.currentTarget) return;
-			let n = wn.value.length - 1;
+		let Ua = (e, t) => {
+			if (!M.keyboardNavigation || e.target !== e.currentTarget) return;
+			let n = Ai.value.length - 1;
 			if (n < 0) return;
 			let r = (t) => {
-				e.preventDefault(), En(ne(t, 0, n));
+				e.preventDefault(), Yi(te(t, 0, n));
 			};
 			switch (e.key) {
 				case "ArrowDown":
@@ -574,10 +1232,10 @@ var Oe = {
 					r(t - 1);
 					break;
 				case "PageDown":
-					r(t + at);
+					r(t + Bt);
 					break;
 				case "PageUp":
-					r(t - at);
+					r(t - Bt);
 					break;
 				case "Home":
 					r(0);
@@ -590,105 +1248,175 @@ var Oe = {
 					e.preventDefault(), e.currentTarget.click();
 					break;
 			}
-		}, { data: kn } = f({ items: M }), An = (e, t) => {
-			e.target instanceof HTMLElement && (e.target instanceof HTMLButtonElement || e.key !== "Enter" && e.key !== " " || (e.preventDefault(), Z(t)));
-		}, jn = (e) => ({
-			"aria-controls": o(kn.value[e.valueHash]) ? void 0 : `expanded_${e.valueHash}`,
+		}, { data: Wa } = re({ items: j }), Ga = (e, t) => {
+			e.target instanceof HTMLElement && (e.target instanceof HTMLButtonElement || e.key !== "Enter" && e.key !== " " || (e.preventDefault(), qa(t)));
+		}, Ka = (e) => ({
+			"aria-controls": l(Wa.value[e.valueHash]) ? void 0 : `expanded_${e.valueHash}`,
 			"aria-expanded": e.expanded ? "true" : "false",
 			onClick: (t) => {
-				t.stopPropagation(), Z(e.valueHash);
+				t.stopPropagation(), qa(e.valueHash);
 			},
-			onKeydown: (t) => An(t, e.valueHash)
-		}), Z = (e) => {
-			let t = Y.value.find((t) => t.valueHash === e);
-			t && (e in kn.value ? M.value = M.value.filter((t) => u(t) !== e) : M.value = [...M.value, t.value]);
+			onKeydown: (t) => Ga(t, e.valueHash)
+		}), qa = (e) => {
+			let t = Z.value.find((t) => t.valueHash === e);
+			t && (e in Wa.value ? j.value = j.value.filter((t) => u(t) !== e) : j.value = [...j.value, t.value]);
 		};
-		O(k, () => {
-			Q.clear(), B.unselected = [], B.selected = [];
+		D(O, () => {
+			Ya.clear(), G.unselected = [], G.selected = [];
 		});
-		let Mn = h(() => {
-			let e = Array.isArray(B.selected) ? B.selected.length : 0;
-			return !!(N.multiple && e > 0 && !k.value || k.value && Q.size > 0);
-		}), Q = Ce(/* @__PURE__ */ new Set());
-		O(() => B.unselected, (e) => {
-			Q.clear(), (e ?? []).forEach((e) => {
-				Q.add(u(e));
+		let Ja = h(() => {
+			let e = Array.isArray(G.selected) ? G.selected.length : 0;
+			return !!(M.multiple && e > 0 && !O.value || O.value && Ya.size > 0);
+		}), Ya = Ae(/* @__PURE__ */ new Set());
+		D(() => G.unselected, (e) => {
+			Ya.clear(), (e ?? []).forEach((e) => {
+				Ya.add(u(e));
 			});
 		}, { immediate: !0 });
-		let Nn = (e) => {
-			let t = B.unselected ?? [];
-			if ($(e)) {
-				vn(e), P("item:unselected", e.value), Q.add(e.valueHash), B.unselected = [...t, e.value];
+		let Xa = (e) => {
+			let t = G.unselected ?? [];
+			if (Za(e)) {
+				Mi(e), N("item:unselected", e.value), Ya.add(e.valueHash), G.unselected = [...t, e.value];
 				return;
 			}
-			k.value || _n(e), P("item:selected", e.value), Q.delete(e.valueHash), B.unselected = t.filter((t) => u(t) !== u(e.value));
-		}, $ = (e) => Q.has(e.valueHash) ? !1 : e.selected || k.value, Pn = (e) => {
-			if (N.disabled || N.readonly || typeof N.selectable == "function" && !N.selectable(e.item)) return !0;
-			let t = Y.value.find((t) => t.valueHash === e.valueHash);
+			O.value || ji(e), N("item:selected", e.value), Ya.delete(e.valueHash), G.unselected = t.filter((t) => u(t) !== u(e.value));
+		}, Za = (e) => Ya.has(e.valueHash) ? !1 : e.selected || O.value, Qa = h(() => {
+			let e = /* @__PURE__ */ new Map();
+			for (let t of Z.value) e.set(t.valueHash, t);
+			return e;
+		}), $a = (e) => {
+			if (M.disabled || M.readonly || typeof M.selectable == "function" && !M.selectable(e.item)) return !0;
+			let t = Qa.value.get(e.valueHash);
 			return !t || !!t.disabled;
-		}, Fn = (e) => {
-			Pn(e) || Nn(e);
-		}, In = se((e) => typeof e != "string", JSON.stringify), Ln = h(() => [].concat(B.selected ?? []).map((e) => ({
-			disabled: N.disabled,
-			name: N.name,
+		}, eo = (e) => {
+			$a(e) || Xa(e);
+		}, to = ce((e) => typeof e != "string", JSON.stringify), no = h(() => [].concat(G.selected ?? []).map((e) => ({
+			disabled: M.disabled,
+			name: M.name,
 			type: "hidden",
-			value: In(e)
-		}))), Rn = [
+			value: to(e)
+		}))), ro = [
 			70,
 			45,
 			85,
 			55
-		], zn = h(() => ne(Y.value.length || N.columns.length || 1, 4, 10));
-		return O(() => [wn.value, N.fixedColumns], () => {
-			I.value && N.fixedColumns?.length && ue(I.value, N.fixedColumns);
-		}, { flush: "post" }), (e, t) => (S(), he(we(an.value), {
+		], io = h(() => te(Z.value.length || M.columns.length || 1, 4, 10)), ao = h(() => {
+			let e = /* @__PURE__ */ new Map();
+			for (let [t, n] of k.value) e.has(t) || e.set(t, n);
+			return e;
+		}), oo = h(() => ({
+			slots: P,
+			selectable: M.selectable,
+			multiple: !!M.multiple,
+			readonly: !!M.readonly,
+			actions: !!M.actions,
+			keyboardNavigation: !!M.keyboardNavigation,
+			contentInert: vi.value,
+			hasRowIndex: yi.value,
+			columnSpan: xi.value,
+			inputName: Ut,
+			tdClass: M.tdClass,
+			cellClasses: Sn.value,
+			sortOrders: ao.value,
+			measureRow: Na,
+			onInputChange: Xa,
+			onRowFocus: Xi,
+			onRowKeydown: Ua
+		})), so = h(() => (M.fixedColumns ?? []).map((e) => typeof e == "number" ? `${e}:left` : `${e.index}:${e.position}`).join(","));
+		return D(() => [
+			Pa.value,
+			so.value,
+			fi.value
+		], ([, e, t], n) => {
+			let r = n?.[1], i = M.fixedColumns;
+			if (I.value && (e.length || r?.length)) {
+				let a = e === r && t === n?.[2];
+				fe(I.value, i ?? [], a ? li : null, a);
+			}
+			P.thead && De(di);
+		}, { flush: "post" }), (e, t) => (S(), g(Me(hi.value), {
 			id: e.id,
 			ref_key: "containerRef",
 			ref: L,
-			"aria-busy": q.value,
-			class: b(cn.value),
-			"data-bb-table-id": D(lt),
+			"aria-busy": _i.value,
+			class: b(bi.value),
+			"data-bb-table-id": E(qt),
 			inert: e.disabled,
-			style: x(Vt.value)
+			style: x(ii.value)
 		}, {
-			default: De(() => [
-				e.selectable ? (S(), _("legend", Oe, E(on.value), 1)) : g("", !0),
-				v("table", {
+			default: Le(() => [
+				e.selectable ? (S(), v("legend", qe, T(gi.value), 1)) : _("", !0),
+				e.caption ? (S(), v("div", {
+					key: 1,
+					id: en.value,
+					class: b(["bb-table-caption", { "sr-only": !e.displayCaption }])
+				}, T(e.caption), 11, Je)) : _("", !0),
+				e.reorderable || e.resizable ? (S(), v("div", {
+					key: 2,
+					id: tn.value,
+					class: "sr-only"
+				}, [e.reorderable ? (S(), v(m, { key: 0 }, [Se(T(E(F)("table.reorderInstructions").value), 1)], 64)) : _("", !0), e.resizable && !K.value ? (S(), v(m, { key: 1 }, [Se(T(E(F)("table.resizeInstructions").value), 1)], 64)) : _("", !0)], 8, Ye)) : _("", !0),
+				y("span", Xe, T(_i.value ? e.loadingText || E(F)("common.loadingText").value : ""), 1),
+				e.reorderable ? (S(), v(m, { key: 3 }, [y("span", Ze, T(sn.value), 1), y("div", {
+					ref_key: "ghostRef",
+					ref: Fn,
+					"aria-hidden": "true",
+					class: "bb-table-column-ghost",
+					popover: "manual"
+				}, [t[1] ||= y("svg", {
+					"aria-hidden": "true",
+					class: "bb-table-column-ghost__icon",
+					fill: "none",
+					height: "1em",
+					stroke: "currentColor",
+					"stroke-linecap": "round",
+					"stroke-linejoin": "round",
+					"stroke-width": "2",
+					viewBox: "0 0 24 24",
+					width: "1em"
+				}, [y("path", { d: "M12 2v20M2 12h20M5 9l-3 3 3 3M9 5l3-3 3 3M15 19l-3 3-3-3M19 9l3 3-3 3" })], -1), y("span", null, T(Pn.value), 1)], 512)], 64)) : _("", !0),
+				y("div", {
 					ref_key: "tableRef",
 					ref: I,
-					"aria-rowcount": J.value ? D(B).totalItems : void 0
+					"aria-labelledby": e.caption ? en.value : void 0,
+					"aria-rowcount": yi.value && E(G).totalItems != null ? E(G).totalItems + 1 : void 0,
+					class: "bb-table__table",
+					role: "table",
+					style: x(Qr.value)
 				}, [
-					e.caption ? (S(), _("caption", {
-						key: 0,
-						class: b(["bb-table-caption", { "sr-only": !e.displayCaption }])
-					}, E(e.caption), 3)) : g("", !0),
-					v("colgroup", null, [(S(!0), _(m, null, w(zt.value, (e) => (S(), _("col", {
-						key: e.key,
-						style: x({ width: e.width })
-					}, null, 4))), 128))]),
-					v("thead", { inert: sn.value }, [T(e.$slots, "thead", {}, () => [v("tr", {
-						"aria-rowindex": J.value ? 1 : void 0,
-						class: b(["bb-table-header-row", e.headerRowClass])
+					y("div", {
+						class: b(["bb-table__head", {
+							"bb-table__head--dragging": U.value === "dragging",
+							"bb-table__head--resizing": _n.value !== null
+						}]),
+						inert: vi.value,
+						role: "rowgroup"
+					}, [w(e.$slots, "thead", {}, () => [y("div", {
+						"aria-rowindex": yi.value ? 1 : void 0,
+						class: b(["bb-table-header-row", e.headerRowClass]),
+						role: "row",
+						onPointerdown: rr,
+						onTouchmove: ir
 					}, [
-						e.selectable ? (S(), _("th", {
+						e.selectable ? (S(), v("div", {
 							key: 0,
 							class: b(["bb-table-header bb-table-header--select", e.thClass]),
-							scope: "col"
-						}, [T(e.$slots, "header:select", {
+							role: "columnheader"
+						}, [w(e.$slots, "header:select", {
 							multiple: e.multiple,
-							selectAll: !!k.value,
-							text: e.selectText || D(F)("table.selectText").value
-						}, () => [v("span", Me, [!e.disableSelectAll && e.multiple ? (S(), _("label", {
+							selectAll: !!O.value,
+							text: e.selectText || E(F)("table.selectText").value
+						}, () => [y("span", tt, [!e.disableSelectAll && e.multiple ? (S(), v("label", {
 							key: 0,
 							class: b(["bb-table-check__label", { "bb-table-check__label--disabled": e.disabled }])
-						}, [(S(), he(d, {
-							key: Mn.value.toString(),
-							modelValue: k.value,
-							"onUpdate:modelValue": t[0] ||= (e) => k.value = e,
-							checked: !!k.value,
+						}, [(S(), g(ne, {
+							key: Ja.value.toString(),
+							modelValue: O.value,
+							"onUpdate:modelValue": t[0] ||= (e) => O.value = e,
+							checked: !!O.value,
 							class: "bb-table-check",
 							disabled: e.disabled,
-							indeterminate: Mn.value,
+							indeterminate: Ja.value,
 							name: `select_all_${e.name || ""}`,
 							readonly: e.readonly
 						}, null, 8, [
@@ -698,198 +1426,173 @@ var Oe = {
 							"indeterminate",
 							"name",
 							"readonly"
-						])), v("span", Ne, E(e.selectAllLabel || D(F)("table.selectAllLabel").value), 1)], 2)) : e.multiple ? g("", !0) : (S(), _("span", Pe, E(e.selectText || D(F)("table.selectText").value), 1))])])], 2)) : g("", !0),
-						(S(!0), _(m, null, w(xn.value, (t, n) => (S(), _("th", {
-							key: t.key,
-							"aria-sort": t.sortDirection ?? (t.sortable ? "none" : void 0),
-							class: b(["bb-table-header", [t.classes, {
-								"bb-table-header--edge-start": n === 0,
-								"bb-table-header--edge-end": n === xn.value.length - 1
+						])), y("span", nt, T(e.selectAllLabel || E(F)("table.selectAllLabel").value), 1)], 2)) : e.multiple ? _("", !0) : (S(), v("span", rt, T(e.selectText || E(F)("table.selectText").value), 1))])])], 2)) : _("", !0),
+						(S(!0), v(m, null, je(Fi.value, (n, r) => (S(), v("div", {
+							key: n.key,
+							"aria-describedby": nn.value ? tn.value : void 0,
+							"aria-sort": n.sortDirection ?? (n.sortable ? "none" : void 0),
+							class: b(["bb-table-header", [n.classes, {
+								"bb-table-header--edge-start": r === 0,
+								"bb-table-header--edge-end": r === Fi.value.length - 1,
+								"bb-table-header--clip": Yr.value.has(n.key),
+								"bb-table-header--dragging": Nn.value === n.key,
+								"bb-table-header--sortable": n.sortable,
+								"bb-table-header--resizing": _n.value === n.key
 							}]]),
-							scope: "col"
-						}, [T(e.$slots, t.slotName, {
-							classes: t.classes,
-							items: D(fn),
-							label: t.label,
-							sortOrder: t.sortOrder,
-							sortable: t.sortable,
-							toggleSort: () => _t(t.key)
-						}, () => [t.sortable ? (S(), he(i, {
-							key: 0,
-							class: b(["bb-table-sort", {
-								"bb-table-sort--asc": t.sortOrder === "asc",
-								"bb-table-sort--desc": t.sortOrder === "desc"
-							}]),
-							type: "button",
-							onClick: () => _t(t.key)
-						}, {
-							default: De(() => [v("span", Ie, E(t.label), 1), _e(a, {
-								class: "bb-table-sort__icon",
-								icon: D(le),
-								size: "sm"
-							}, null, 8, ["icon"])]),
-							_: 2
-						}, 1032, ["class", "onClick"])) : (S(), _("span", Le, E(t.label), 1))])], 10, Fe))), 128)),
-						e.actions ? (S(), _("th", {
+							"data-column-key": nn.value ? n.key : void 0,
+							role: "columnheader",
+							tabindex: nn.value ? n.key === un.value ? 0 : -1 : void 0,
+							onClick: (e) => dn(e, n),
+							onFocus: (e) => fn(n.key),
+							onKeydown: (e) => hn(e, n.key)
+						}, [
+							Ii(n.key, "prepend") ? (S(), g(Me(Ii(n.key, "prepend")), Ee({
+								key: 0,
+								ref_for: !0
+							}, Li(n)), null, 16)) : _("", !0),
+							w(e.$slots, n.slotName, {
+								classes: n.classes,
+								items: E(Ei),
+								label: n.label,
+								sortOrder: n.sortOrder,
+								sortable: n.sortable,
+								toggleSort: () => mr(n.key)
+							}, () => [n.sortable ? (S(), g(s, {
+								key: 0,
+								class: b(["bb-table-sort", {
+									"bb-table-sort--asc": n.sortOrder === "asc",
+									"bb-table-sort--desc": n.sortOrder === "desc"
+								}]),
+								tabindex: nn.value ? -1 : void 0,
+								type: "button",
+								onClick: () => mr(n.key)
+							}, {
+								default: Le(() => [y("span", at, T(n.label), 1), t[2] ||= y("svg", {
+									"aria-hidden": "true",
+									class: "bb-table-sort__icon",
+									fill: "none",
+									height: "1em",
+									stroke: "currentColor",
+									"stroke-linecap": "round",
+									"stroke-linejoin": "round",
+									"stroke-width": "2",
+									viewBox: "0 0 24 24",
+									width: "1em"
+								}, [y("path", { d: "M12 20V4m-7 7l7-7l7 7" })], -1)]),
+								_: 2
+							}, 1032, [
+								"class",
+								"tabindex",
+								"onClick"
+							])) : (S(), v("span", ot, T(n.label), 1))]),
+							Ii(n.key, "append") ? (S(), g(Me(Ii(n.key, "append")), Ee({
+								key: 1,
+								ref_for: !0
+							}, Li(n)), null, 16)) : _("", !0),
+							e.resizable && !K.value ? (S(), v("div", {
+								key: 2,
+								"aria-hidden": "true",
+								class: "bb-table-header__resizer",
+								onDblclick: Re((e) => Tn(n.key), ["stop"]),
+								onPointerdown: (e) => Mn(e, n.key)
+							}, null, 40, st)) : _("", !0)
+						], 42, it))), 128)),
+						e.actions ? (S(), v("div", {
 							key: 1,
 							class: b(["bb-table-header bb-table-header--actions", e.thClass]),
-							scope: "col"
-						}, [T(e.$slots, "header:actions", { text: e.actionsText || D(F)("table.actionsText").value }, () => [v("span", Re, E(e.actionsText || D(F)("table.actionsText").value), 1)])], 2)) : g("", !0)
-					], 10, je)])], 8, Ae),
-					v("tbody", null, [q.value && !D(Y).length ? T(e.$slots, "loading", {
+							role: "columnheader"
+						}, [w(e.$slots, "header:actions", { text: e.actionsText || E(F)("table.actionsText").value }, () => [y("span", ct, T(e.actionsText || E(F)("table.actionsText").value), 1)])], 2)) : _("", !0)
+					], 42, et)])], 10, $e),
+					y("div", {
+						ref_key: "bodyRef",
+						ref: ea,
+						class: "bb-table__body",
+						role: "rowgroup",
+						onFocusin: oa,
+						onFocusout: sa
+					}, [_i.value && !E(Z).length ? w(e.$slots, "loading", {
 						key: 0,
-						items: D(fn)
-					}, () => [(S(!0), _(m, null, w(zn.value, (n, r) => (S(), _("tr", {
+						items: E(Ei)
+					}, () => [(S(!0), v(m, null, je(io.value, (n, r) => (S(), v("div", {
 						key: r,
-						"aria-rowindex": J.value ? r + 2 : void 0,
-						class: "bb-table-skeleton__row"
+						"aria-rowindex": yi.value ? r + 2 : void 0,
+						class: "bb-table-skeleton__row",
+						role: "row"
 					}, [
-						e.selectable ? (S(), _("td", Be, t[1] ||= [v("div", { class: "bb-table-skeleton__placeholder" }, null, -1)])) : g("", !0),
-						(S(!0), _(m, null, w(N.columns, (e, n) => (S(), _("td", {
+						e.selectable ? (S(), v("div", ut, t[3] ||= [y("div", { class: "bb-table-skeleton__placeholder" }, null, -1)])) : _("", !0),
+						(S(!0), v(m, null, je(z.value, (e, n) => (S(), v("div", {
 							key: e.key,
-							class: b(["bb-table-skeleton__cell", [`bb-table-skeleton__cell--${e.skeleton ?? "text"}`]])
-						}, [!e.skeleton || e.skeleton === "text" ? (S(), _("div", Ve, [v("div", {
+							class: b(["bb-table-skeleton__cell", [`bb-table-skeleton__cell--${e.skeleton ?? "text"}`]]),
+							role: "cell"
+						}, [!e.skeleton || e.skeleton === "text" ? (S(), v("div", dt, [y("div", {
 							class: "bb-table-skeleton__line",
-							style: x({ width: `${Rn[(r + n) % 4]}%` })
-						}, null, 4), v("div", {
+							style: x({ width: `${ro[(r + n) % 4]}%` })
+						}, null, 4), y("div", {
 							class: "bb-table-skeleton__line",
-							style: x({ width: `${Rn[(r + n + 2) % 4]}%` })
-						}, null, 4)])) : e.skeleton === "avatar" ? (S(), _("div", He)) : e.skeleton === "avatar-text" ? (S(), _("div", Ue, [t[2] ||= v("div", { class: "bb-table-skeleton__avatar" }, null, -1), v("div", We, [v("div", {
+							style: x({ width: `${ro[(r + n + 2) % 4]}%` })
+						}, null, 4)])) : e.skeleton === "avatar" ? (S(), v("div", ft)) : e.skeleton === "avatar-text" ? (S(), v("div", pt, [t[4] ||= y("div", { class: "bb-table-skeleton__avatar" }, null, -1), y("div", mt, [y("div", {
 							class: "bb-table-skeleton__line",
-							style: x({ width: `${Rn[(r + n) % 4]}%` })
-						}, null, 4), v("div", {
+							style: x({ width: `${ro[(r + n) % 4]}%` })
+						}, null, 4), y("div", {
 							class: "bb-table-skeleton__line",
-							style: x({ width: `${Rn[(r + n + 2) % 4]}%` })
-						}, null, 4)])])) : e.skeleton === "image" ? (S(), _("div", Ge)) : e.skeleton === "badge" ? (S(), _("div", Ke)) : g("", !0)], 2))), 128)),
-						e.actions ? (S(), _("td", qe, t[3] ||= [v("div", { class: "bb-table-skeleton__placeholder" }, null, -1)])) : g("", !0)
-					], 8, ze))), 128))]) : D(Y).length ? T(e.$slots, "tbody", { key: 2 }, () => [(S(!0), _(m, null, w(wn.value, (t, n) => (S(), _(m, { key: t.valueHash }, [v("tr", {
-						"aria-current": t.highlighted ? "true" : void 0,
-						"aria-rowindex": J.value && t.rowIndex ? t.rowIndex : void 0,
-						class: b(["bb-table-data__row", [t.rowClasses, { "bb-table-data__row--highlighted": t.highlighted }]]),
-						inert: sn.value,
-						tabindex: e.keyboardNavigation ? n === X.value ? 0 : -1 : void 0,
-						onClick: t.onRowClick,
-						onContextmenu: t.onRowContextMenu,
-						onDblclick: t.onRowDblClick,
-						onFocus: () => Dn(n),
-						onKeydown: (e) => On(e, n)
-					}, [
-						e.selectable ? (S(), _("td", {
-							key: 0,
-							class: b(["bb-table-data__cell bb-table-data__cell--select", e.tdClass])
-						}, [T(e.$slots, "select", {
-							checked: $(t),
-							disabled: Pn(t),
-							inputName: D(st),
-							item: t.item,
-							readonly: !!e.readonly,
-							toggleSelected: () => Fn(t),
-							value: t.value
-						}, () => [e.multiple ? (S(), _("label", {
-							key: 0,
-							class: b(["bb-table-check__label", { "bb-table-check__label--disabled": t.disabled }])
-						}, [_e(d, {
-							checked: $(t),
-							class: "bb-table-check",
-							disabled: t.disabled,
-							readonly: e.readonly,
-							onChange: () => Nn(t)
-						}, null, 8, [
-							"checked",
-							"disabled",
-							"readonly",
-							"onChange"
-						]), v("span", Qe, E(t.accessibleLabel), 1)], 2)) : (S(), _("label", {
-							key: 1,
-							class: b(["bb-table-radio__label", { "bb-table-radio__label--disabled": t.disabled }])
-						}, [_e(oe, {
-							checked: t.selected,
-							class: "bb-table-radio",
-							disabled: t.disabled,
-							name: D(st),
-							readonly: e.readonly,
-							value: t.value,
-							onChange: () => Nn(t)
-						}, null, 8, [
-							"checked",
-							"disabled",
-							"name",
-							"readonly",
-							"value",
-							"onChange"
-						]), v("span", $e, E(t.accessibleLabel), 1)], 2))])], 2)) : g("", !0),
-						(S(!0), _(m, null, w(t.cols, (n, r) => (S(), _("td", {
-							key: n.key,
-							class: b(["bb-table-data__cell", [n.classes, {
-								"bb-table-data__cell--edge-start": r === 0,
-								"bb-table-data__cell--edge-end": r === t.cols.length - 1
-							}]])
-						}, [T(e.$slots, n.slotName, {
-							classes: n.classes,
-							content: n.content,
-							expandProps: jn(t),
-							expanded: t.expanded,
-							highlighted: t.highlighted,
-							item: t.item,
-							selected: $(t),
-							sortOrder: gt(n.key),
-							toggleExpanded: () => Z(t.valueHash),
-							toggleHighlighted: () => z(t),
-							toggleSelected: () => Fn(t),
-							value: t.value
-						}, () => [ge(E(n.content), 1)])], 2))), 128)),
-						e.actions ? (S(), _("td", {
-							key: 1,
-							class: b(["bb-table__cell bb-table__cell--actions", e.tdClass])
-						}, [T(e.$slots, "actions", {
-							expandProps: jn(t),
-							expanded: t.expanded,
-							highlighted: t.highlighted,
-							item: t.item,
-							selected: $(t),
-							toggleExpanded: () => Z(t.valueHash),
-							toggleHighlighted: () => z(t),
-							toggleSelected: () => Fn(t),
-							value: t.value
-						})], 2)) : g("", !0)
-					], 42, Ze), t.expanded ? (S(), _("tr", {
+							style: x({ width: `${ro[(r + n + 2) % 4]}%` })
+						}, null, 4)])])) : e.skeleton === "image" ? (S(), v("div", ht)) : e.skeleton === "badge" ? (S(), v("div", gt)) : _("", !0)], 2))), 128)),
+						e.actions ? (S(), v("div", _t, t[5] ||= [y("div", { class: "bb-table-skeleton__placeholder" }, null, -1)])) : _("", !0)
+					], 8, lt))), 128))]) : E(Z).length ? w(e.$slots, "tbody", { key: 2 }, () => [(S(!0), v(m, null, je(Pa.value, (e) => (S(), v(m, { key: e.key }, [e.kind === "spacer" ? (S(), v("div", {
 						key: 0,
-						id: `expanded_${t.valueHash}`,
-						"aria-rowindex": J.value && t.rowIndex ? t.rowIndex + 1 : void 0,
-						class: b(["bb-table-expand__row", { "bb-table-expand__row--highlighted": t.highlighted }])
-					}, [v("td", {
-						class: "bb-table-expand__cell",
-						colspan: ln.value
-					}, [T(e.$slots, "expand", {
-						expandProps: jn(t),
-						expanded: t.expanded,
-						highlighted: t.highlighted,
-						item: t.item,
-						selected: $(t),
-						toggleExpanded: () => Z(t.valueHash),
-						toggleHighlighted: () => z(t),
-						toggleSelected: () => Fn(t),
-						value: t.value
-					})], 8, tt)], 10, et)) : g("", !0)], 64))), 128))]) : (S(), _("tr", {
+						"aria-hidden": "true",
+						class: "bb-table-spacer__row bb-table-placeholder__row",
+						style: x({ height: `${e.height}px` })
+					}, null, 4)) : e.kind === "placeholder" ? (S(), v("div", {
 						key: 1,
-						"aria-rowindex": J.value ? 2 : void 0,
-						class: "bb-table-no-data__row"
-					}, [v("td", {
-						class: "bb-table-no-data__cell",
-						colspan: ln.value
-					}, [T(e.$slots, "no-data", {}, () => [v("span", Xe, E(e.noDataText || D(F)("common.noDataText").value), 1)])], 8, Ye)], 8, Je)), q.value ? (S(), _("tr", {
+						"aria-hidden": "true",
+						class: "bb-table-placeholder__row bb-table-placeholder__row--pending",
+						"data-index": e.virtualIndex,
+						style: x({ height: `${e.height}px` })
+					}, null, 12, xt)) : e.kind === "row" ? (S(), g(E(ue), {
+						key: 2,
+						active: e.index === Gi.value,
+						context: oo.value,
+						index: e.index,
+						item: e.item,
+						"select-blocked": $a(e.item),
+						selected: Za(e.item),
+						"virtual-index": e.virtualIndex
+					}, null, 8, [
+						"active",
+						"context",
+						"index",
+						"item",
+						"select-blocked",
+						"selected",
+						"virtual-index"
+					])) : (S(), g(E(de), {
 						key: 3,
-						"aria-rowindex": J.value && !D(Y).length ? zn.value + 2 : void 0,
-						class: "bb-table-loading__row bb-table-loading__row--sr-only"
-					}, [v("td", {
-						"aria-live": "polite",
-						class: "bb-table-loading__cell",
-						colspan: ln.value,
-						role: "status"
-					}, [v("span", it, E(e.loadingText || D(F)("common.loadingText").value), 1)], 8, rt)], 8, nt)) : g("", !0)]),
-					v("tfoot", null, [T(e.$slots, "tfoot", { columnCount: ln.value })])
-				], 8, ke),
-				(S(!0), _(m, null, w(Ln.value, (e) => (S(), _("input", ye({
+						context: oo.value,
+						item: e.item,
+						selected: Za(e.item),
+						"virtual-index": e.virtualIndex
+					}, null, 8, [
+						"context",
+						"item",
+						"selected",
+						"virtual-index"
+					]))], 64))), 128))]) : (S(), v("div", {
+						key: 1,
+						"aria-rowindex": yi.value ? 2 : void 0,
+						class: "bb-table-no-data__row",
+						role: "row"
+					}, [y("div", {
+						"aria-colspan": xi.value,
+						class: "bb-table-no-data__cell",
+						role: "cell"
+					}, [w(e.$slots, "no-data", {}, () => [y("span", bt, T(e.noDataText || E(F)("common.noDataText").value), 1)])], 8, yt)], 8, vt))], 544),
+					y("div", {
+						class: "bb-table__foot",
+						role: P.tfoot ? "rowgroup" : void 0
+					}, [w(e.$slots, "tfoot", { columnCount: xi.value })], 8, St)
+				], 12, Qe),
+				(S(!0), v(m, null, je(no.value, (e) => (S(), v("input", Ee({
 					key: e.value,
 					ref_for: !0
 				}, e), null, 16))), 128))
@@ -906,4 +1609,4 @@ var Oe = {
 	}
 });
 //#endregion
-export { k as default };
+export { O as default };