@sheetxl/grid-react 0.8.0-beta.6 → 0.8.0-beta.9

package/browser/esm/index.mjs

@@ -1,6 +1,6 @@
 (function(){try{if(typeof document<`u`){var e=document.createElement(`style`);e.appendChild(document.createTextNode(`._grid-stage_rzp9d_1{width:100%;height:100%;position:absolute;top:0;left:0}._grid-stage_rzp9d_1>*{pointer-events:none;position:absolute;inset:0}._grid-stage_rzp9d_1>*>*{pointer-events:auto}._sheetxl-grid_5yo0n_7{box-sizing:border-box;user-select:none;contain:strict;width:100%;height:100%;position:relative}._sheetxl-grid_5yo0n_7 *{box-sizing:border-box!important}._sheetxl-grid_5yo0n_7 :focus{outline:none}._sheetxl-grid_5yo0n_7>*{contain:size layout style}._virtual-div_16eab_1{position:absolute}._tiles_ikr1b_7{will-change:transform}._tiles_ikr1b_7 .tile{white-space:pre;position:absolute}._tiles_ikr1b_7 .tile>*{contain:strict;position:absolute}._gridlines_ikr1b_26,._gridlines_ikr1b_26 *{pointer-events:none;position:absolute;overflow:visible}.cell{letter-spacing:-.25px;padding:2px 4px;font-family:Calibri;line-height:1.2}._search_b1nag_5{box-sizing:border-box;width:100%;min-width:0;font:inherit;color:inherit;background:light-dark(#fff,#2b2b2b);border:1px solid light-dark(#c4c4c4,#5a5a5a);border-radius:2px;outline:none;margin:0;padding:3px 8px}._search_b1nag_5:focus{border-color:var(--sxl-color-primary,#0078d7)}._search_b1nag_5::placeholder{opacity:.6}/*$vite$:1*/`)),document.head.appendChild(e)}}catch(e){console.error(`vite-plugin-css-injected-by-js`,e)}})();
 /**
-* @license @sheetxl/grid-react - Grid React - Advanced grid component for React - v0.8.0-beta.6
+* @license @sheetxl/grid-react - Grid React - Advanced grid component for React - v0.8.0-beta.9
 *
 * (C) 2026-present SheetXL Inc. & Michael T. Ford
 * License: The license can be found at https://www.sheetxl.com/license.
@@ -2660,12 +2660,20 @@ var Kn = (e, t) => {
 		options: [e, t]
 	};
 }, Yn = (e) => {
-	let t = I(), n = B(), r = e?.getElement(), i = {}, a = r?.closest(`[${O}]`)?.getAttribute(O), o = r?.closest(`[${k}]`)?.getAttribute(k);
-	a && (i[O] = a), o && (i[k] = o);
-	let s = [...t?.themeScope?.classes ?? [], n?.scopeClass].filter(Boolean);
+	let t = I(), n = B(), r = e?.getElement(), i = r?.ownerDocument, a = c((e) => {
+		if (!i || typeof MutationObserver > "u") return () => {};
+		let t = new MutationObserver(e);
+		return t.observe(i.documentElement, {
+			attributes: !0,
+			subtree: !0,
+			attributeFilter: [O, k]
+		}), () => t.disconnect();
+	}, [i]), o = () => `${r?.closest(`[${O}]`)?.getAttribute(O) ?? ""}\n${r?.closest(`[${k}]`)?.getAttribute(k) ?? ""}`, [s, l] = _(a, o, o).split("\n"), u = {};
+	s && (u[O] = s), l && (u[k] = l);
+	let d = [...t?.themeScope?.classes ?? [], n?.scopeClass].filter(Boolean);
 	return {
-		className: s.length ? s.join(" ") : void 0,
-		attrs: i
+		className: d.length ? d.join(" ") : void 0,
+		attrs: u
 	};
 }, Xn = (e) => {
 	let { side: t, align: n = "center" } = e;
@@ -2839,7 +2847,8 @@ var nr = ({ outOfView: e, close: t }) => (u(() => {
 	key: e.key ?? Ee(e.range),
 	range: e.range,
 	data: e.data,
-	placement: e.placement
+	placement: e.placement,
+	alignOffset: e.alignOffset
 }), lr = (e, t) => Array.isArray(e) ? e.includes(t) : e === t, ur = (e) => {
 	let t = e.getCoords();
 	return t ? `${t.rowIndex},${t.colIndex}` : null;
@@ -2889,7 +2898,7 @@ var nr = ({ outOfView: e, close: t }) => (u(() => {
 			anchor: { range: B.range },
 			placement: B.placement ?? s,
 			offset: c,
-			alignOffset: d,
+			alignOffset: B.alignOffset ?? d,
 			boundary: h,
 			zIndex: g,
 			open: V,
@@ -6152,40 +6161,49 @@ var Fa, Ia = parseInt(v.split(".")[0], 10) >= 19 ? function(e) {
 	tabIndex: -1,
 	style: { margin: 0 }
 }), Ha = a(function(e, t) {
-	let { itemCount: n, isChecked: r, onCheckedChange: i, renderValue: a, renderCheckbox: o = Va, renderDivider: s, selectAllLabel: l, itemHeight: u, selection: d, cacheToken: f, autoFocus: g, viewport: _, className: v, style: S, children: C, ...w } = e, T = p(() => new Ci({ getBounds: () => ({
+	let { itemCount: n, isChecked: r, isIndeterminate: i, onCheckedChange: a, renderValue: o, renderCheckbox: s = Va, renderDivider: l, selectAllLabel: d, itemHeight: f, selection: g, cacheToken: _, autoFocus: v, viewport: S, className: C, style: w, children: T, ...E } = e, D = h(n);
+	D.current = n;
+	let O = p(() => new Ci({ getBounds: () => ({
 		rowStart: 0,
 		colStart: 0,
-		rowEnd: Math.max(0, n - 1),
+		rowEnd: Math.max(0, D.current - 1),
 		colEnd: 0
-	}) }), [n]), E = d ?? T, D = F(() => {
+	}) }), []), k = g ?? O;
+	u(() => {
+		n !== 0 && k.getSelection().cell.rowIndex >= n && k.setSelection({ cell: {
+			rowIndex: n - 1,
+			colIndex: 0
+		} });
+	}, [k, n]);
+	let A = F(() => {
 		if (n === 0) return;
-		let e = !r(E.getSelection().cell.rowIndex);
-		i(((e) => {
+		let e = !r(k.getSelection().cell.rowIndex);
+		a(((e) => {
 			let t = e.getSelection();
 			return t.ranges && t.ranges.length ? t.ranges.flatMap((e) => Array.from({ length: e.rowEnd - e.rowStart + 1 }, (t, n) => e.rowStart + n)) : [t.cell.rowIndex];
-		})(E), e);
+		})(k), e);
 	}, [
-		E,
+		k,
 		n,
 		r,
-		i
-	]), O = h(null), [, k] = m((e) => e + 1, 0), A = F(() => n === 0 ? -1 : E.getSelection().cell.rowIndex, [E, n]), j = F((e) => {
+		a
+	]), j = h(null), [, M] = m((e) => e + 1, 0), N = F(() => n === 0 ? -1 : k.getSelection().cell.rowIndex, [k, n]), P = F((e) => {
 		if (n === 0) return;
-		let t = Math.min(Math.max(0, E.getSelection().cell.rowIndex + e), n - 1);
-		E.setSelection({ cell: {
+		let t = Math.min(Math.max(0, k.getSelection().cell.rowIndex + e), n - 1);
+		k.setSelection({ cell: {
 			rowIndex: t,
 			colIndex: 0
-		} }), O.current = { row: t }, k();
-	}, [E, n]), M = R(t, () => ({
+		} }), j.current = { row: t }, M();
+	}, [k, n]), I = R(t, () => ({
 		isCheckboxList: () => !0,
-		getHighlightIndex: A,
-		moveHighlight: j,
-		toggleHighlighted: D
+		getHighlightIndex: N,
+		moveHighlight: P,
+		toggleHighlighted: A
 	}), [
-		A,
-		j,
-		D
-	]), N = c((e) => x("div", {
+		N,
+		P,
+		A
+	]), L = c((e) => x("div", {
 		style: {
 			display: "flex",
 			alignItems: "center",
@@ -6196,30 +6214,31 @@ var Fa, Ia = parseInt(v.split(".")[0], 10) >= 19 ? function(e) {
 			cursor: "pointer"
 		},
 		onMouseDown: (t) => {
-			t.preventDefault(), i([e], !r(e));
+			t.preventDefault(), a([e], !r(e));
 		},
 		children: [b("div", {
 			style: {
 				display: "inline-flex",
 				pointerEvents: "none"
 			},
-			children: o(r(e))
+			children: s(r(e), i?.(e))
 		}), b("div", {
 			style: {
 				overflow: "hidden",
 				textOverflow: "ellipsis"
 			},
-			children: a(e)
+			children: o(e)
 		})]
 	}), [
 		r,
 		i,
 		a,
-		o
-	]), P = c((e) => {
-		e.key !== " " && e.key !== "Enter" || (e.preventDefault(), e.stopPropagation(), D());
-	}, [D]), { allChecked: I, someChecked: L } = p(() => {
-		if (l == null || n === 0) return {
+		o,
+		s
+	]), z = c((e) => {
+		e.key !== " " && e.key !== "Enter" || (e.preventDefault(), e.stopPropagation(), A());
+	}, [A]), { allChecked: ee, someChecked: B } = p(() => {
+		if (d == null || n === 0) return {
 			allChecked: !1,
 			someChecked: !1
 		};
@@ -6230,22 +6249,22 @@ var Fa, Ia = parseInt(v.split(".")[0], 10) >= 19 ? function(e) {
 			someChecked: t && !e
 		};
 	}, [
-		l,
+		d,
 		n,
 		r,
-		f
+		_
 	]);
 	return x("div", {
-		ref: M,
-		className: q("checkbox-list", v),
+		ref: I,
+		className: q("checkbox-list", C),
 		style: {
 			display: "flex",
 			flexDirection: "column",
 			minHeight: 0,
-			...S
+			...w
 		},
-		...w,
-		children: [l != null && x(y, { children: [x("div", {
+		...E,
+		children: [d != null && x(y, { children: [x("div", {
 			style: {
 				display: "flex",
 				alignItems: "center",
@@ -6255,25 +6274,25 @@ var Fa, Ia = parseInt(v.split(".")[0], 10) >= 19 ? function(e) {
 				cursor: "pointer"
 			},
 			onMouseDown: (e) => {
-				e.preventDefault(), i(Array.from({ length: n }, (e, t) => t), !I);
+				e.preventDefault(), a(Array.from({ length: n }, (e, t) => t), !ee);
 			},
 			children: [b("div", {
 				style: {
 					display: "inline-flex",
 					pointerEvents: "none"
 				},
-				children: o(I, L)
-			}), l]
-		}), s?.()] }), b(Ba, {
+				children: s(ee, B)
+			}), d]
+		}), l?.()] }), b(Ba, {
 			itemCount: n,
-			itemHeight: u,
-			selection: E,
-			renderItem: N,
-			onKeyDown: P,
-			cacheToken: f,
-			scrollTo: O.current,
-			autoFocus: g,
-			viewport: _,
+			itemHeight: f,
+			selection: k,
+			renderItem: L,
+			onKeyDown: z,
+			cacheToken: _,
+			scrollTo: j.current,
+			autoFocus: v,
+			viewport: S,
 			style: {
 				flex: "1 1 100%",
 				minHeight: 0