@sheetxl/grid-react 0.7.28-beta.4 → 0.8.0-beta.1

package/node/esm/index.mjs

@@ -1,19 +1,20 @@
 /**
-* @license @sheetxl/grid-react - Grid React - Advanced grid component for React - v0.7.28-beta.4
+* @license @sheetxl/grid-react - Grid React - Advanced grid component for React - v0.8.0-beta.1
 *
 * (C) 2026-present SheetXL Inc. & Michael T. Ford
 * License: The license can be found at https://www.sheetxl.com/license.
 */
-import e, { cloneElement as t, createContext as n, createElement as o, forwardRef as r, isValidElement as l, memo as i, useCallback as s, useContext as a, useEffect as c, useId as d, useLayoutEffect as u, useMemo as g, useReducer as h, useRef as f, useState as p, useSyncExternalStore as m } from "react";
+import e, { cloneElement as t, createContext as n, createElement as o, forwardRef as r, isValidElement as l, memo as i, useCallback as a, useContext as s, useEffect as c, useId as d, useLayoutEffect as u, useMemo as g, useReducer as h, useRef as f, useState as p, useSyncExternalStore as m } from "react";
 import { Fragment as w, jsx as x, jsxs as v } from "react/jsx-runtime";
-import { KeyCodes as y, KeyModifiers as b, ReactUtils as S, SERIES_COUNT as E, ScrollPane as I, THEME_MODE_ATTR as C, THEME_SURFACE_ATTR as R, Viewport as M, buildThemeCSS as P, defaultTheme as k, themeVars as D, useBoundSyncExternalStore as T, useCallbackRef as z, useFloatSurface as O, useFullscreenPortal as $, useImperativeElement as L, useOptionalBoundSyncExternalStore as B, useSynchronizedPointerHandler as A, useTokenThemeContext as N } from "@sheetxl/utils-react";
+import { KeyCodes as y, KeyModifiers as b, ReactUtils as S, SERIES_COUNT as E, ScrollPane as I, THEME_MODE_ATTR as C, THEME_SURFACE_ATTR as R, Viewport as M, buildThemeCSS as P, defaultTheme as k, themeVars as D, useBoundSyncExternalStore as T, useCallbackRef as O, useFloatSurface as z, useFullscreenPortal as $, useImperativeElement as L, useOptionalBoundSyncExternalStore as B, useSynchronizedPointerHandler as A, useTokenThemeContext as N } from "@sheetxl/utils-react";
 import F from "tiny-invariant";
 import V, { clsx as H } from "clsx";
 import { AnchorLocation as _, CommonUtils as W, CoordUtils as U, DOMUtils as K, Direction as j, RangeAxis as G, SelectionTraversalUtils as X } from "@sheetxl/utils";
 import { createPortal as Y } from "react-dom";
 import { autoUpdate as q, flip as Z, offset as J, shift as Q, useFloating as ee } from "@floating-ui/react-dom";
 import { useMeasure as te } from "react-use";
-var ne = (e, t) => {
+import { mergeRefs as ne } from "react-merge-refs";
+var oe = (e, t) => {
 	if ("number" == typeof t) {
 		const n = t;
 		return {
@@ -40,20 +41,20 @@ var ne = (e, t) => {
 		getIndex: (t) => {
 			if (t <= 0 || e <= 0) return 0;
 			if ((r > 0 ? o[r] : 0) > t) return i(0, r, t);
-			let s = r > 0 ? r : 0, a = 1;
-			for (; s < e && l(s) <= t;) s += a, a *= 2;
-			if (s >= e) {
+			let a = r > 0 ? r : 0, s = 1;
+			for (; a < e && l(a) <= t;) a += s, s *= 2;
+			if (a >= e) {
 				const o = e - 1;
 				if (t >= l(o) + n(o)) return e;
 			}
-			return i(Math.floor(s / 2), Math.min(s, e - 1), t);
+			return i(Math.floor(a / 2), Math.min(a, e - 1), t);
 		}
 	};
-}, oe = (e) => {
+}, re = (e) => {
 	const t = null != e, n = e?.rowCount ?? 0, o = e?.columnCount ?? 0, r = e?.getRowHeight, l = e?.getColumnWidth;
 	return g(() => {
 		if (!t) return null;
-		const e = ne(n, r ?? 20), i = ne(o, l ?? 75);
+		const e = oe(n, r ?? 20), i = oe(o, l ?? 75);
 		return {
 			getColOffset: i.getOffset,
 			getColIndex: i.getIndex,
@@ -67,7 +68,7 @@ var ne = (e, t) => {
 		r,
 		l
 	]);
-}, re = n(null), le = () => a(re), ie = (e) => {
+}, le = n(null), ie = () => s(le), ae = (e) => {
 	const { linePoints: t, bounds: n, propsPath: o, style: r, ...l } = e;
 	return n ? x("svg", {
 		width: `${n.width}`,
@@ -96,25 +97,25 @@ var ne = (e, t) => {
 		})
 	}) : null;
 }, se = i((e) => {
-	const { bounds: t, fill: n, stroke: o, alignWidth: r = 1, disableAlign: l = !1, disableEdgeAware: i = !1, inset: s = 0, hole: a, animatedStroke: d, animatedTransition: u, strokeDasharray: g, strokeDashoffset: h, propsFillPath: f, propsStrokePath: p, className: m, style: y, propsRoot: b } = e, E = le(), I = t ?? E;
+	const { bounds: t, fill: n, stroke: o, alignWidth: r = 1, disableAlign: l = !1, disableEdgeAware: i = !1, inset: a = 0, hole: s, animatedStroke: d, animatedTransition: u, strokeDasharray: g, strokeDashoffset: h, propsFillPath: f, propsStrokePath: p, className: m, style: y, propsRoot: b } = e, E = ie(), I = t ?? E;
 	if (c(() => {
-		d && ue();
+		d && ge();
 	}, [d]), !I) return null;
 	const C = S.getDevicePixelRatio(), R = l ? r : r / C;
-	let M, P, k, D, T, z, O;
+	let M, P, k, D, T, O, z;
 	if (l) M = I.x, P = I.y, k = I.x + I.width, D = I.y + I.height;
 	else {
-		const e = (e) => i ? S.snapLineCenter(e, R, C) : S.edgeCenter(e, "leading", r, C), t = (e) => i ? S.snapLineCenter(e, R, C) : S.edgeCenter(e, "trailing", r, C), n = s / C;
+		const e = (e) => i ? S.snapLineCenter(e, R, C) : S.edgeCenter(e, "leading", r, C), t = (e) => i ? S.snapLineCenter(e, R, C) : S.edgeCenter(e, "trailing", r, C), n = a / C;
 		M = e(I.x + n), P = e(I.y + n), k = t(I.x + I.width - n), D = t(I.y + I.height - n);
 	}
-	if (a) if (l) T = a;
+	if (s) if (l) T = s;
 	else {
-		const e = S.snapDeviceEdge(a.x, C), t = S.snapDeviceEdge(a.y, C);
+		const e = S.snapDeviceEdge(s.x, C), t = S.snapDeviceEdge(s.y, C);
 		T = {
 			x: e,
 			y: t,
-			width: S.snapDeviceEdge(a.x + a.width, C) - e,
-			height: S.snapDeviceEdge(a.y + a.height, C) - t
+			width: S.snapDeviceEdge(s.x + s.width, C) - e,
+			height: S.snapDeviceEdge(s.y + s.height, C) - t
 		};
 	}
 	if (d) {
@@ -125,23 +126,23 @@ var ne = (e, t) => {
 			gapColor: "var(--sxl-color-base-100, #fff)",
 			..."object" == typeof d ? d : void 0
 		}, t = e.dashGap + e.dashLength;
-		z = {
+		O = {
 			strokeDasharray: `${e.dashLength}px ${e.dashGap}px`,
 			strokeDashoffset: `${t}px`,
-			animation: `${ce} ${e.speed * t}ms linear infinite`,
+			animation: `${de} ${e.speed * t}ms linear infinite`,
 			willChange: "stroke-dashoffset"
-		}, O = e.gapColor;
+		}, z = e.gapColor;
 	}
 	const $ = u ? "d 60ms ease-in-out" : "none";
 	let L = null;
 	if (n) {
-		let e = ae({
+		let e = ce({
 			top: P,
 			left: M,
 			bottom: D,
 			right: k
 		});
-		T && (e += " " + ae({
+		T && (e += " " + ce({
 			top: T.y,
 			left: T.x,
 			bottom: T.y + T.height,
@@ -159,20 +160,20 @@ var ne = (e, t) => {
 	}
 	let B = null;
 	if (o && r) {
-		const e = ae({
+		const e = ce({
 			top: P,
 			left: M,
 			right: k,
 			bottom: D
 		});
-		B = v(w, { children: [O && x("path", {
+		B = v(w, { children: [z && x("path", {
 			fill: "none",
 			vectorEffect: "non-scaling-stroke",
 			strokeWidth: R,
 			style: {
 				d: `path("${e}")`,
 				transition: $,
-				stroke: O
+				stroke: z
 			}
 		}, "stroke-under"), x("path", {
 			fill: "none",
@@ -185,7 +186,7 @@ var ne = (e, t) => {
 				d: `path("${e}")`,
 				transition: $,
 				stroke: o,
-				...z,
+				...O,
 				...p?.style
 			}
 		}, "stroke")] });
@@ -208,12 +209,12 @@ var ne = (e, t) => {
 	});
 });
 se.displayName = "RectangleSVG";
-var ae = (e, t = !0) => `M ${e.left} ${e.top} L ${e.right} ${e.top} L ${e.right} ${e.bottom} L ${e.left} ${e.bottom} L ${e.left} ${e.top} ${t ? "Z" : ""}`, ce = "sxl-marching-ants", de = !1, ue = () => {
-	if (de || "undefined" == typeof document) return;
-	de = !0;
+var ce = (e, t = !0) => `M ${e.left} ${e.top} L ${e.right} ${e.top} L ${e.right} ${e.bottom} L ${e.left} ${e.bottom} L ${e.left} ${e.top} ${t ? "Z" : ""}`, de = "sxl-marching-ants", ue = !1, ge = () => {
+	if (ue || "undefined" == typeof document) return;
+	ue = !0;
 	const e = document.createElement("style");
-	e.appendChild(document.createTextNode(`@keyframes ${ce} { to { stroke-dashoffset: 0; } }`)), document.head.appendChild(e);
-}, ge = (e, t, n) => Math.min(n, Math.max(t, e)), he = (e, t, n) => {
+	e.appendChild(document.createTextNode(`@keyframes ${de} { to { stroke-dashoffset: 0; } }`)), document.head.appendChild(e);
+}, he = (e, t, n) => Math.min(n, Math.max(t, e)), fe = (e, t, n) => {
 	const o = [];
 	let r = t;
 	for (; r <= n;) {
@@ -221,26 +222,26 @@ var ae = (e, t = !0) => `M ${e.left} ${e.top} L ${e.right} ${e.top} L ${e.right}
 		0 === t ? (o.push(r), r++) : r += t;
 	}
 	return o;
-}, fe = (e, t, n, o, r, l) => {
+}, pe = (e, t, n, o, r, l) => {
 	if (n - t >= r - o) return o;
 	let i = o;
 	return "nearest" === e && (o - t > 0 ? e = "start" : n - r > 0 && (e = "end")), "start" === e ? i = t : "end" === e ? i = n - (r - o) : "center" === e && (i = t + (n - t) / 2 - (r - o) / 2), i < o ? Math.max(0, i) : i > o ? Math.min(i, l - (r - o)) : void 0;
-}, pe = (e, t = !1, n, o) => {
+}, me = (e, t = !1, n, o) => {
 	if (!n) return 0;
 	const r = !t, l = r ? 1 : -1;
-	let i = n(r ? e : e + 1), s = n(r ? e + 1 : e), a = e + (r ? 2 : -1), c = 0;
-	for (; (s - i) * l <= 0;) {
-		if (r && a - 1 > o + 1 || !r && a + 1 < o) return c;
-		i = s, s = n(a), a += l, c++;
+	let i = n(r ? e : e + 1), a = n(r ? e + 1 : e), s = e + (r ? 2 : -1), c = 0;
+	for (; (a - i) * l <= 0;) {
+		if (r && s - 1 > o + 1 || !r && s + 1 < o) return c;
+		i = a, a = n(s), s += l, c++;
 	}
 	return c;
-}, me = (e, t, n) => {
+}, we = (e, t, n) => {
 	if (!n) return !1;
 	const o = n.x;
 	if (e < o || e > o + n.width) return !1;
 	const r = n.y;
 	return !(t < r || t > r + n.height);
-}, we = "_grid-stage_rzp9d_1", xe = {
+}, xe = "_grid-stage_rzp9d_1", ve = {
 	pointerdown: "onPointerDown",
 	pointermove: "onPointerMove",
 	pointerup: "onPointerUp",
@@ -251,18 +252,18 @@ var ae = (e, t = !0) => `M ${e.left} ${e.top} L ${e.right} ${e.top} L ${e.right}
 	mouseout: "onMouseOut",
 	dblclick: "onDoubleClick",
 	contextmenu: "onContextMenu"
-}, ve = Object.values(xe), ye = [
-	...Object.keys(xe),
+}, ye = Object.values(ve), be = [
+	...Object.keys(ve),
 	"keydown",
 	"keypress",
 	"keyup"
-], be = new Set(ye), Se = (e) => {
+], Se = new Set(be), Ee = (e) => {
 	const t = e?.getElement();
 	return t && "function" == typeof t.isStage && t.isStage() ? t : null;
-}, Ee = i(r((e, t) => {
-	const { className: n, onFocus: o, onBlur: r, children: l, ...i } = e, a = qe(), d = f(a);
-	d.current = a;
-	const u = f(/* @__PURE__ */ new Set()), g = f(0), h = s((e) => {
+}, Ie = i(r((e, t) => {
+	const { className: n, onFocus: o, onBlur: r, children: l, ...i } = e, s = Ze(), d = f(s);
+	d.current = s;
+	const u = f(/* @__PURE__ */ new Set()), g = f(0), h = a((e) => {
 		const t = {
 			responder: e,
 			seq: g.current++
@@ -270,9 +271,9 @@ var ae = (e, t = !0) => `M ${e.left} ${e.top} L ${e.right} ${e.top} L ${e.right}
 		return u.current.add(t), () => {
 			u.current.delete(t);
 		};
-	}, []), p = f(/* @__PURE__ */ new Set()), m = f(0), w = s((e) => (p.current.add(e), e.hasHandlers && m.current++, () => {
+	}, []), p = f(/* @__PURE__ */ new Set()), m = f(0), w = a((e) => (p.current.add(e), e.hasHandlers && m.current++, () => {
 		p.current.delete(e), e.hasHandlers && m.current--;
-	}), []), v = f(null), y = f(0), b = s((e, t) => {
+	}), []), v = f(null), y = f(0), b = a((e, t) => {
 		const n = v.current;
 		if (n && n.x === e && n.y === t) return n.stack;
 		const o = document.elementsFromPoint(e, t);
@@ -287,13 +288,13 @@ var ae = (e, t = !0) => `M ${e.left} ${e.top} L ${e.right} ${e.top} L ${e.right}
 	c(() => () => {
 		y.current && "function" == typeof cancelAnimationFrame && cancelAnimationFrame(y.current);
 	}, []);
-	const S = s((e, t, n) => {
+	const S = a((e, t, n) => {
 		if (!t && !n) return () => {};
 		const o = (e, o) => {
 			t?.(e), n?.(e, o);
 		};
 		return h({ getHandler: (t) => t === e ? o : void 0 });
-	}, [h]), E = s((e) => {
+	}, [h]), E = a((e) => {
 		if (!e || e === G.current) return Number.NEGATIVE_INFINITY;
 		const t = /* @__PURE__ */ new Map();
 		if (u.current.forEach((e) => {
@@ -308,17 +309,17 @@ var ae = (e, t = !0) => `M ${e.left} ${e.top} L ${e.right} ${e.top} L ${e.right}
 			n = n.parentElement;
 		}
 		return Number.NEGATIVE_INFINITY;
-	}, []), I = s((e, t, n) => {
-		if (void 0 === xe[e]) return Ie;
-		if (0 === m.current) return Ie;
+	}, []), I = a((e, t, n) => {
+		if (void 0 === ve[e]) return Ce;
+		if (0 === m.current) return Ce;
 		const o = t.nativeEvent;
-		if ("number" != typeof o?.clientX || "number" != typeof o?.clientY) return Ie;
+		if ("number" != typeof o?.clientX || "number" != typeof o?.clientY) return Ce;
 		const r = /* @__PURE__ */ new Map();
 		if (p.current.forEach((e) => {
 			if (!e.hasHandlers || !e.getHandler) return;
 			const t = e.getElement();
 			t && r.set(t, e);
-		}), 0 === r.size) return Ie;
+		}), 0 === r.size) return Ce;
 		const l = (e) => {
 			let t = e;
 			for (; t;) {
@@ -327,24 +328,24 @@ var ae = (e, t = !0) => `M ${e.left} ${e.top} L ${e.right} ${e.top} L ${e.right}
 				t = t.parentElement;
 			}
 			return null;
-		}, i = l(t.target), s = "pointermove" === e || "mousemove" === e, a = s ? b(o.clientX, o.clientY) : document.elementsFromPoint(o.clientX, o.clientY), c = [], d = /* @__PURE__ */ new Set();
-		for (let e = 0; e < a.length; e++) {
-			const t = l(a[e]);
+		}, i = l(t.target), a = "pointermove" === e || "mousemove" === e, s = a ? b(o.clientX, o.clientY) : document.elementsFromPoint(o.clientX, o.clientY), c = [], d = /* @__PURE__ */ new Set();
+		for (let e = 0; e < s.length; e++) {
+			const t = l(s[e]);
 			if (!t || d.has(t)) continue;
 			if (d.add(t), t === i) continue;
-			const o = r.get(t), s = o.zIndex ?? 0;
-			s >= n || c.push({
-				slot: s,
+			const o = r.get(t), a = o.zIndex ?? 0;
+			a >= n || c.push({
+				slot: a,
 				box: !0,
 				ord: e,
 				getHandler: o.getHandler
 			});
 		}
-		return i && !d.has(i) && s ? Ie : c;
-	}, [b]), C = s((e, t, n) => {
+		return i && !d.has(i) && a ? Ce : c;
+	}, [b]), C = a((e, t, n) => {
 		const o = G.current;
 		if (o && t.target instanceof Node && !o.contains(t.target)) return;
-		const r = be.has(e) ? E(t.target) : Number.POSITIVE_INFINITY, l = [...I(e, t, r)];
+		const r = Se.has(e) ? E(t.target) : Number.POSITIVE_INFINITY, l = [...I(e, t, r)];
 		if (u.current.forEach((e) => {
 			const t = e.responder.zIndex ?? 0;
 			t >= r || l.push({
@@ -367,49 +368,49 @@ var ae = (e, t = !0) => `M ${e.left} ${e.top} L ${e.right} ${e.top} L ${e.right}
 				(e.responder.zIndex ?? 0) > o && r.push(e);
 			}), 0 === r.length) return;
 			r.sort((e, t) => (t.responder.zIndex ?? 0) - (e.responder.zIndex ?? 0) || t.seq - e.seq);
-			const l = Ce(t, e);
+			const l = Re(t, e);
 			for (let e = 0; e < r.length && !l.isPropagationStopped(); e++) r[e].responder.getHandler(n)?.(l, d.current);
 		};
-		for (let n = 0; n < ye.length; n++) e.addEventListener(ye[n], t, !0);
+		for (let n = 0; n < be.length; n++) e.addEventListener(be[n], t, !0);
 		return () => {
-			for (let n = 0; n < ye.length; n++) e.removeEventListener(ye[n], t, !0);
+			for (let n = 0; n < be.length; n++) e.removeEventListener(be[n], t, !0);
 		};
 	}, [E]);
-	const R = z((e) => {
+	const R = O((e) => {
 		C("pointerdown", e, d.current);
-	}, []), M = z((e) => {
+	}, []), M = O((e) => {
 		C("pointermove", e, d.current);
-	}, []), P = z((e) => {
+	}, []), P = O((e) => {
 		C("pointerup", e, d.current);
-	}, []), k = z((e) => {
+	}, []), k = O((e) => {
 		C("pointerleave", e, d.current);
-	}, []), D = z((e) => {
+	}, []), D = O((e) => {
 		C("mousedown", e, d.current);
-	}, []), T = z((e) => {
+	}, []), T = O((e) => {
 		C("mouseenter", e, d.current);
-	}, []), O = z((e) => {
+	}, []), z = O((e) => {
 		C("mouseleave", e, d.current);
-	}, []), $ = z((e) => {
+	}, []), $ = O((e) => {
 		C("mousemove", e, d.current);
-	}, []), B = z((e) => {
+	}, []), B = O((e) => {
 		C("mouseout", e, d.current);
-	}, []), A = z((e) => {
+	}, []), A = O((e) => {
 		C("mouseover", e, d.current);
-	}, []), N = z((e) => {
+	}, []), N = O((e) => {
 		C("mouseup", e, d.current);
-	}, []), F = z((e) => {
+	}, []), F = O((e) => {
 		C("dblclick", e, d.current);
-	}, []), H = z((e) => {
+	}, []), H = O((e) => {
 		C("keydown", e, d.current);
-	}, []), _ = z((e) => {
+	}, []), _ = O((e) => {
 		C("keypress", e, d.current);
-	}, []), W = z((e) => {
+	}, []), W = O((e) => {
 		C("keyup", e, d.current);
-	}, []), U = z((e) => {
+	}, []), U = O((e) => {
 		o?.(e), C("focus", e, d.current);
-	}, [o]), K = z((e) => {
+	}, [o]), K = O((e) => {
 		r?.(e), C("blur", e, d.current);
-	}, [r]), j = z((e) => {
+	}, [r]), j = O((e) => {
 		C("contextmenu", e, d.current);
 	}, []), G = L(t, () => ({
 		isStage: () => !0,
@@ -418,7 +419,7 @@ var ae = (e, t = !0) => `M ${e.left} ${e.top} L ${e.right} ${e.top} L ${e.right}
 		registerLayer: w
 	}), []);
 	return c(() => w({ getElement: () => G.current }), [w]), x("div", {
-		className: V(n, "stage", we),
+		className: V(n, "stage", xe),
 		ref: G,
 		tabIndex: 0,
 		...i,
@@ -428,7 +429,7 @@ var ae = (e, t = !0) => `M ${e.left} ${e.top} L ${e.right} ${e.top} L ${e.right}
 		onPointerLeave: k,
 		onMouseDown: D,
 		onMouseEnter: T,
-		onMouseLeave: O,
+		onMouseLeave: z,
 		onMouseMove: $,
 		onMouseOut: B,
 		onMouseOver: A,
@@ -443,8 +444,8 @@ var ae = (e, t = !0) => `M ${e.left} ${e.top} L ${e.right} ${e.top} L ${e.right}
 		children: l
 	});
 }));
-Ee.displayName = "Stage";
-var Ie = Object.freeze([]), Ce = (e, t) => {
+Ie.displayName = "Stage";
+var Ce = Object.freeze([]), Re = (e, t) => {
 	let n = !1;
 	return new Proxy(e, { get(o, r) {
 		switch (r) {
@@ -463,8 +464,8 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 			}
 		}
 	} });
-}, Re = (e) => `${e.rowStart},${e.colStart},${e.rowEnd},${e.colEnd}`, Me = n(0), Pe = n(!1), ke = (e, t) => {
-	const { rowDims: n, columnDims: o, computeRowDims: r, computeColumnDims: l, viewport: i, zoom: s, containerWidth: a, containerHeight: c, getRangeFromCell: d, invalidate: u, totalRange: g, getSurfacePointFromPointer: h, scrollTo: f, scrollCellCoordsIntoView: p, getAllPanes: m } = t, w = e.anchor, x = n[e.rowIndex], v = o[e.columnIndex];
+}, Me = (e) => `${e.rowStart},${e.colStart},${e.rowEnd},${e.colEnd}`, Pe = n(0), ke = n(!1), De = (e, t) => {
+	const { rowDims: n, columnDims: o, computeRowDims: r, computeColumnDims: l, viewport: i, zoom: a, containerWidth: s, containerHeight: c, getRangeFromCell: d, invalidate: u, totalRange: g, getSurfacePointFromPointer: h, scrollTo: f, scrollCellCoordsIntoView: p, getAllPanes: m } = t, w = e.anchor, x = n[e.rowIndex], v = o[e.columnIndex];
 	if (x.minIndex > x.maxIndex || v.minIndex > v.maxIndex) return null;
 	const y = e.scrollOrientation, b = Object.freeze({
 		x: v.minBounds,
@@ -483,21 +484,21 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 		left: v.freezeOffset,
 		top: x.freezeOffset
 	}, C = {
-		width: a,
+		width: s,
 		height: c
 	};
 	let R = null, M = null;
 	const P = () => {
 		const t = i.getSnapshot();
 		if (M && R === t) return M;
-		const n = l(t.left)[e.columnIndex], o = r(t.top)[e.rowIndex], a = n.metrics, c = o.metrics, d = Object.freeze({
+		const n = l(t.left)[e.columnIndex], o = r(t.top)[e.rowIndex], s = n.metrics, c = o.metrics, d = Object.freeze({
 			rowStart: o.minIndex,
 			colStart: n.minIndex,
 			rowEnd: o.maxIndex,
 			colEnd: n.maxIndex
 		}), u = Object.freeze({
-			getColIndex: (e) => a.getColIndex(e),
-			getColOffset: (e) => a.getColOffset(e),
+			getColIndex: (e) => s.getColIndex(e),
+			getColOffset: (e) => s.getColOffset(e),
 			getRowIndex: (e) => c.getRowIndex(e),
 			getRowOffset: (e) => c.getRowOffset(e)
 		}), g = {
@@ -509,8 +510,8 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 			metrics: u,
 			scrollTopLeft: g,
 			topLeft: {
-				top: (I.top + (y.vertical ? g.top : 0)) / s,
-				left: (I.left + (y.horizontal ? g.left : 0)) / s
+				top: (I.top + (y.vertical ? g.top : 0)) / a,
+				left: (I.left + (y.horizontal ? g.left : 0)) / a
 			},
 			colDims: n,
 			rowDims: o
@@ -542,7 +543,7 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 			offset: n,
 			size: t.getRowOffset(e + 1) - n
 		};
-	}, z = (e, t) => {
+	}, O = (e, t) => {
 		const n = new Array(e.length);
 		for (let o = 0; o < e.length; o++) n[o] = t(e[o]);
 		return n;
@@ -582,18 +583,18 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 					top: t.y + n,
 					bottom: t.height - 2 * n + t.y,
 					right: t.width - 2 * n + t.x
-				}, s = {
+				}, a = {
 					left: Math.max(l.left, i.left),
 					top: Math.max(l.top, i.top),
 					bottom: Math.min(l.bottom, i.bottom),
 					right: Math.min(l.right, i.right)
-				}, a = {
-					x: s.left,
-					y: s.top,
-					width: s.right - s.left,
-					height: s.bottom - s.top
+				}, s = {
+					x: a.left,
+					y: a.top,
+					width: a.right - a.left,
+					height: a.bottom - a.top
 				};
-				return a.height < 0 || a.width < 0 ? null : a;
+				return s.height < 0 || s.width < 0 ? null : s;
 			})(e ?? {
 				x: 0,
 				y: 0,
@@ -603,20 +604,20 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 		},
 		toPaneBounds: (e) => {
 			const t = P().topLeft;
-			return 0 === t.left && 0 === t.top && 1 === s ? e : {
-				x: (e.x - t.left) * s,
-				y: (e.y - t.top) * s,
-				width: e.width * s,
-				height: e.height * s
+			return 0 === t.left && 0 === t.top && 1 === a ? e : {
+				x: (e.x - t.left) * a,
+				y: (e.y - t.top) * a,
+				width: e.width * a,
+				height: e.height * a
 			};
 		},
 		toAbsoluteBounds: (e) => {
 			const t = P().topLeft;
-			return 0 === t.left && 0 === t.top && 1 === s ? e : {
-				x: e.x / s + t.left,
-				y: e.y / s + t.top,
-				width: e.width / s,
-				height: e.height / s
+			return 0 === t.left && 0 === t.top && 1 === a ? e : {
+				x: e.x / a + t.left,
+				y: e.y / a + t.top,
+				width: e.width / a,
+				height: e.height / a
 			};
 		},
 		getPanePointFromPointer: (e, t) => {
@@ -628,8 +629,8 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 		},
 		getMetrics: () => P().metrics,
 		getRangeFromCell: d,
-		getVisibleColumns: (e, t) => z(P().colDims.visibleIndices(e, t), D),
-		getVisibleRows: (e, t) => z(P().rowDims.visibleIndices(e, t), T),
+		getVisibleColumns: (e, t) => O(P().colDims.visibleIndices(e, t), D),
+		getVisibleRows: (e, t) => O(P().rowDims.visibleIndices(e, t), T),
 		getColumnSize: D,
 		getRowSize: T,
 		getTotalRange: () => g,
@@ -642,23 +643,23 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 				colIndex: l
 			};
 			if (n) return i;
-			const s = d(i);
+			const a = d(i);
 			return {
-				rowIndex: s.rowStart,
-				colIndex: s.colStart
+				rowIndex: a.rowStart,
+				colIndex: a.colStart
 			};
 		},
 		getPaneFromPointer: (e, t) => {
 			const n = h(e, t);
 			if (!n) return null;
 			const o = m();
-			for (let e = 0; e < De.length; e++) {
-				const t = o[De[e]];
-				if (t && me(n.x, n.y, t.getPaneBounds())) return t;
+			for (let e = 0; e < Te.length; e++) {
+				const t = o[Te[e]];
+				if (t && we(n.x, n.y, t.getPaneBounds())) return t;
 			}
 			return null;
 		},
-		getZoom: () => s,
+		getZoom: () => a,
 		getAnchor: () => w,
 		getPaneRange: () => S,
 		getPaneBounds: () => b,
@@ -679,12 +680,12 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 		scrollTo: (e) => f(e),
 		getAllPanes: m
 	};
-}, De = [
+}, Te = [
 	_.TopLeft,
 	_.Top,
 	_.Left,
 	_.Center
-], Te = (e, t, n) => {
+], Oe = (e, t, n) => {
 	const o = (t?.left ?? 0) + (n?.x ?? 0), r = (t?.top ?? 0) + (n?.y ?? 0);
 	return {
 		getColOffset: (t) => e.getColOffset(t) - o,
@@ -709,13 +710,13 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 	maxVirtualBounds: 0,
 	scrollOffset: 0,
 	freezeOffset: 0
-}]), Oe = n(null), $e = ({ pane: e, viewport: t, children: n }) => {
+}]), $e = n(null), Le = ({ pane: e, viewport: t, children: n }) => {
 	const o = g(() => ({ pane: e }), [e, B(t, (e) => e.getSnapshot())]);
-	return x(Oe.Provider, {
+	return x($e.Provider, {
 		value: o,
 		children: n
 	});
-}, Le = () => {
+}, Be = () => {
 	const e = /* @__PURE__ */ new Map(), t = /* @__PURE__ */ new Map();
 	return {
 		has: (t) => e.has(t),
@@ -733,15 +734,15 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 			};
 		}
 	};
-}, Be = n(null), Ae = ({ store: e, children: t }) => {
-	const n = a(Be), o = f(null);
+}, Ae = n(null), Ne = ({ store: e, children: t }) => {
+	const n = s(Ae), o = f(null);
 	let r = e ?? n;
-	return r || (o.current || (o.current = Le()), r = o.current), x(Be.Provider, {
+	return r || (o.current || (o.current = Be()), r = o.current), x(Ae.Provider, {
 		value: r,
 		children: t
 	});
-}, Ne = { "sheetxl-grid": "_sheetxl-grid_5yo0n_7" }, Fe = i(r((e, n) => {
-	const { rowCount: r = 1, columnCount: i = 1, viewport: a, metrics: d, getRangeFromCell: u = U.cellToRange, hiddenRowsAt: m, hiddenColumnsAt: y, freezeLeft: b = 0, freezeTop: S = 0, propsFreezeLeft: E, propsFreezeTop: I, onFirstRender: C, children: R, wrapPane: P, onFocus: k, onBlur: D, className: T, style: O, ...$ } = e, B = z(k, [k]), A = z(D, [D]), N = z(C, [C]), [H, W] = p(_.Center), [j, G] = h((e) => e + 1, 0), X = g(() => new M({}), []), Y = a ?? X, [q, Z] = p(() => {
+}, Fe = { "sheetxl-grid": "_sheetxl-grid_5yo0n_7" }, Ve = i(r((e, n) => {
+	const { rowCount: r = 1, columnCount: i = 1, viewport: s, metrics: d, getRangeFromCell: u = U.cellToRange, hiddenRowsAt: m, hiddenColumnsAt: y, freezeLeft: b = 0, freezeTop: S = 0, propsFreezeLeft: E, propsFreezeTop: I, onFirstRender: C, children: R, wrapPane: P, onFocus: k, onBlur: D, className: T, style: z, ...$ } = e, B = O(k, [k]), A = O(D, [D]), N = O(C, [C]), [H, W] = p(_.Center), [j, G] = h((e) => e + 1, 0), X = g(() => new M({}), []), Y = s ?? X, [q, Z] = p(() => {
 		const e = Y.getClient();
 		return {
 			zoom: Y.getZoom(),
@@ -763,60 +764,60 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 		return e(), Y.subscribe(e);
 	}, [Y]);
 	const J = q.zoom, Q = g(() => {
-		const e = d ?? Ve;
+		const e = d ?? He;
 		return {
 			getColOffset: (t) => e.getColOffset(t) * J,
 			getColIndex: (t) => e.getColIndex(t / J),
 			getRowOffset: (t) => e.getRowOffset(t) * J,
 			getRowIndex: (t) => e.getRowIndex(t / J)
 		};
-	}, [d, J]), ee = z((e, t = !1) => pe(e, t, Q.getRowOffset, t ? 0 : r), [r, Q?.getRowOffset]), te = z(m ?? ee, [m]), ne = z((e, t = !1) => pe(e, t, Q.getColOffset, t ? i : 0), [i, Q?.getColOffset]), oe = z(y ?? ne, [y]), re = s(() => {
+	}, [d, J]), ee = O((e, t = !1) => me(e, t, Q.getRowOffset, t ? 0 : r), [r, Q?.getRowOffset]), te = O(m ?? ee, [m]), ne = O((e, t = !1) => me(e, t, Q.getColOffset, t ? i : 0), [i, Q?.getColOffset]), oe = O(y ?? ne, [y]), re = a(() => {
 		G();
 	}, []), le = g(() => Math.min(q.w, Q.getColOffset(i)), [
 		j,
 		Q.getColOffset,
 		i,
 		q.w
-	]), se = g(() => Math.min(q.h, Q.getRowOffset(r)), [
+	]), ie = g(() => Math.min(q.h, Q.getRowOffset(r)), [
 		j,
 		Q.getRowOffset,
 		r,
 		q.h
-	]), ae = g(() => {
+	]), se = g(() => {
 		let e = NaN, t = null;
 		return (n) => (n === e && t || (e = n, t = ((e) => {
-			if (0 === se) return ze;
+			if (0 === ie) return ze;
 			const t = [];
 			let n = 0, o = 0;
 			"number" == typeof S ? n = S : (n = S.index ?? 0, o = (S.offset ?? 0) * J);
-			const l = o, i = Q.getRowOffset(n), s = i - l;
+			const l = o, i = Q.getRowOffset(n), a = i - l;
 			if (n > 0) {
-				const e = Te(Q, { top: o + Q.getRowOffset(0) }), r = Q.getRowIndex(l), a = Q.getRowIndex(i - 1);
+				const e = Oe(Q, { top: o + Q.getRowOffset(0) }), r = Q.getRowIndex(l), s = Q.getRowIndex(i - 1);
 				let c;
 				t[1] = {
 					minIndex: r,
-					maxIndex: a,
+					maxIndex: s,
 					minCoord: 0,
 					maxCoord: n - 1,
 					minBounds: 0,
-					maxBounds: s,
-					visibleIndices: (e, t) => void 0 !== e && void 0 !== t ? he(te, e, t) : c || (c = Object.freeze(he(te, r, a)), c),
+					maxBounds: a,
+					visibleIndices: (e, t) => void 0 !== e && void 0 !== t ? fe(te, e, t) : c || (c = Object.freeze(fe(te, r, s)), c),
 					metrics: e,
 					maxVirtualBounds: i,
 					scrollOffset: o,
 					freezeOffset: o
 				};
 			}
-			const a = Math.max(0, se - s), c = Te(Q, { top: e + s }), d = c.getRowIndex(0), u = c.getRowIndex(a - 1);
+			const s = Math.max(0, ie - a), c = Oe(Q, { top: e + a }), d = c.getRowIndex(0), u = c.getRowIndex(s - 1);
 			let g;
 			return t[0] = {
 				minIndex: d,
 				maxIndex: u,
 				minCoord: n,
 				maxCoord: r - 1,
-				minBounds: s,
-				maxBounds: a,
-				visibleIndices: (e, t) => void 0 !== e && void 0 !== t ? he(te, e, t) : g || (g = Object.freeze(he(te, d, u)), g),
+				minBounds: a,
+				maxBounds: s,
+				visibleIndices: (e, t) => void 0 !== e && void 0 !== t ? fe(te, e, t) : g || (g = Object.freeze(fe(te, d, u)), g),
 				metrics: c,
 				maxVirtualBounds: Q.getRowOffset(r),
 				scrollOffset: e,
@@ -828,45 +829,45 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 		Q.getRowIndex,
 		Q.getRowOffset,
 		te,
-		se,
+		ie,
 		r,
 		S,
 		J
-	]), ce = g(() => ae(0), [ae]), de = g(() => {
+	]), ce = g(() => se(0), [se]), de = g(() => {
 		let e = NaN, t = null;
 		return (n) => (n === e && t || (e = n, t = ((e) => {
 			if (0 === le) return ze;
 			const t = [];
 			let n = 0, o = 0;
 			"number" == typeof b ? n = b : (n = b.index ?? 0, o = (b.offset ?? 0) * J);
-			const r = o, l = Q.getColOffset(n), s = l - r;
+			const r = o, l = Q.getColOffset(n), a = l - r;
 			if (n > 0) {
-				const e = Te(Q, { left: o + Q.getColOffset(0) }), i = Q.getColIndex(r), a = Q.getColIndex(l - 1);
+				const e = Oe(Q, { left: o + Q.getColOffset(0) }), i = Q.getColIndex(r), s = Q.getColIndex(l - 1);
 				let c;
 				t[1] = {
 					minIndex: i,
-					maxIndex: a,
+					maxIndex: s,
 					minCoord: 0,
 					maxCoord: n - 1,
 					minBounds: 0,
-					maxBounds: s,
-					visibleIndices: (e, t) => void 0 !== e && void 0 !== t ? he(oe, e, t) : c || (c = Object.freeze(he(oe, i, a)), c),
+					maxBounds: a,
+					visibleIndices: (e, t) => void 0 !== e && void 0 !== t ? fe(oe, e, t) : c || (c = Object.freeze(fe(oe, i, s)), c),
 					metrics: e,
 					maxVirtualBounds: l,
 					scrollOffset: o,
 					freezeOffset: o
 				};
 			}
-			const a = Math.max(0, le - s), c = Te(Q, { left: e + s }), d = c.getColIndex(0), u = c.getColIndex(a - 1);
+			const s = Math.max(0, le - a), c = Oe(Q, { left: e + a }), d = c.getColIndex(0), u = c.getColIndex(s - 1);
 			let g;
 			return t[0] = {
 				minIndex: d,
 				maxIndex: u,
 				minCoord: n,
 				maxCoord: i - 1,
-				minBounds: s,
-				maxBounds: a,
-				visibleIndices: (e, t) => void 0 !== e && void 0 !== t ? he(oe, e, t) : g || (g = Object.freeze(he(oe, d, u)), g),
+				minBounds: a,
+				maxBounds: s,
+				visibleIndices: (e, t) => void 0 !== e && void 0 !== t ? fe(oe, e, t) : g || (g = Object.freeze(fe(oe, d, u)), g),
 				metrics: c,
 				maxVirtualBounds: Q.getColOffset(i),
 				scrollOffset: e,
@@ -882,7 +883,7 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 		i,
 		b,
 		J
-	]), ue = g(() => de(0), [de]), ge = f([]), [we, xe] = h((e) => e + 1, 0), ve = ce.length, ye = ue.length, be = g(() => {
+	]), ue = g(() => de(0), [de]), ge = f([]), [he, xe] = h((e) => e + 1, 0), ve = ce.length, ye = ue.length, be = g(() => {
 		const e = [], t = (t, n, o, r, l) => {
 			if (t >= ye || n >= ve) return null;
 			const i = {
@@ -902,7 +903,7 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 					bottom: l?.bottom ?? 0
 				})
 			};
-			i.elemStage = x(Ee, {
+			i.elemStage = x(Ie, {
 				ref: (e) => {
 					e ? (i.refStage = e, xe()) : i.refStage = null;
 				},
@@ -915,7 +916,7 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 				}
 			}), e.push(i);
 		};
-		return t(0, 0, _.Center, Ke, Ue), t(0, 1, _.Top, je), t(1, 0, _.Left, Ge), t(1, 1, _.TopLeft, Xe), e;
+		return t(0, 0, _.Center, je, Ke), t(0, 1, _.Top, Ge), t(1, 0, _.Left, Xe), t(1, 1, _.TopLeft, Ye), e;
 	}, [ve, ye]), Se = g(() => {
 		let e = {};
 		const t = {
@@ -923,21 +924,21 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 			rowStart: 0,
 			colEnd: i - 1,
 			rowEnd: r - 1
-		}, n = (n) => ke(n, {
+		}, n = (n) => De(n, {
 			rowDims: ce,
 			columnDims: ue,
-			computeRowDims: ae,
+			computeRowDims: se,
 			computeColumnDims: de,
 			viewport: Y,
 			zoom: J,
 			containerWidth: le,
-			containerHeight: se,
+			containerHeight: ie,
 			getRangeFromCell: u,
 			invalidate: re,
 			totalRange: t,
-			getSurfacePointFromPointer: (e, t) => Oe(e, t),
-			scrollTo: (e) => Je(e),
-			scrollCellCoordsIntoView: (e, t, n) => Ze(e, t, n),
+			getSurfacePointFromPointer: (e, t) => $e(e, t),
+			scrollTo: (e) => Qe(e),
+			scrollCellCoordsIntoView: (e, t, n) => Je(e, t, n),
 			getAllPanes: () => e
 		}), o = be.length;
 		for (let t = 0; t < o; t++) {
@@ -949,18 +950,18 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 		be,
 		ce,
 		ue,
-		ae,
+		se,
 		de,
 		Y,
 		u,
-		we
-	]), Ie = ue[0]?.maxVirtualBounds ?? 0, Ce = ce[0]?.maxVirtualBounds ?? 0, Re = q.ready, Pe = g(() => {
+		he
+	]), Ee = ue[0]?.maxVirtualBounds ?? 0, Ce = ce[0]?.maxVirtualBounds ?? 0, Re = q.ready, Me = g(() => {
 		const e = ue[1], t = ce[1];
 		return {
 			left: e ? e.metrics.getColOffset(e.maxIndex + 1) : 0,
 			top: t ? t.metrics.getRowOffset(t.maxIndex + 1) : 0
 		};
-	}, [ce, ue]), De = z((e) => {
+	}, [ce, ue]), Te = O((e) => {
 		K.canUseDOM && setTimeout(() => {
 			(Se[H]?.getElement() ?? Se[_.Center]?.getElement())?.focus({
 				preventScroll: !0,
@@ -975,9 +976,9 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 			ge.current = [];
 		}
 	}, [Se]);
-	const Oe = s((e, t) => {
+	const $e = a((e, t) => {
 		F("number" == typeof e && "number" == typeof t, "Top and left should be a number.");
-		const n = Qe.current?.getBoundingClientRect();
+		const n = et.current?.getBoundingClientRect();
 		return n ? {
 			x: e - n.x,
 			y: t - n.y
@@ -985,44 +986,44 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 			x: e,
 			y: t
 		};
-	}, []), Le = z((e, t) => {
+	}, []), Be = O((e, t) => {
 		if (1 === Object.keys(Se).length) return Se[_.Center];
-		const n = Oe(e, t);
+		const n = $e(e, t);
 		if (!n) return Se[_.Center];
 		const { x: o, y: r } = n;
 		let l = null;
-		const i = Ye, s = i.length;
-		for (let e = 0; !l && e < s; e++) {
+		const i = qe, a = i.length;
+		for (let e = 0; !l && e < a; e++) {
 			const t = Se[i[e]];
-			t && me(o, r, t.getPaneBounds()) && (l = t);
+			t && we(o, r, t.getPaneBounds()) && (l = t);
 		}
 		return l || (l = Se[_.Center]), l;
 	}, [Se, u]);
 	c(() => {
 		const e = ue?.[1]?.scrollOffset ?? 0, t = ce?.[1]?.scrollOffset ?? 0;
-		Y.setContent(Ie, Ce, e, t);
+		Y.setContent(Ee, Ce, e, t);
 	}, [
 		Y,
-		Ie,
+		Ee,
 		Ce,
 		ue,
 		ce
 	]);
-	const Be = z((e) => {
+	const Ae = O((e) => {
 		let t = e?.left ?? e?.[0], n = e?.top ?? e?.[1];
 		if (void 0 === t && void 0 === n) return;
 		const o = e?.behavior ?? "auto", r = Y.getTarget();
-		void 0 !== t && (t = r.left + (t ?? 0)), void 0 !== n && (n = r.top + (n ?? 0)), r.left === t && r.top === n || Je({
+		void 0 !== t && (t = r.left + (t ?? 0)), void 0 !== n && (n = r.top + (n ?? 0)), r.left === t && r.top === n || Qe({
 			left: t,
 			top: n,
 			behavior: o
 		});
-	}, []), Fe = z((e) => void 0 !== e ? Se[e] ?? null : Se[H] ?? Se[_.Center] ?? null, [Se, H]), qe = z((e) => {
+	}, []), Ve = O((e) => void 0 !== e ? Se[e] ?? null : Se[H] ?? Se[_.Center] ?? null, [Se, H]), Ze = O((e) => {
 		const t = Se[H];
 		if (!t) return Se[_.Center];
 		const n = t.getScrollOrientation(), o = { ...t.getVisibleRange() };
 		return n.vertical && (o.rowStart = ce[0].minCoord, o.rowEnd = ce[0].maxCoord), n.horizontal && (o.colStart = ue[0].minCoord, o.colEnd = ue[0].maxCoord), n && U.isCellWithinRange(e, o) ? t : Se[_.Center];
-	}, [Se, H]), Ze = z((e, t = {
+	}, [Se, H]), Je = O((e, t = {
 		inline: "nearest",
 		block: "nearest"
 	}, n = null) => {
@@ -1036,8 +1037,8 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 			if (r = Se[n], !r) return new Promise((e, t) => {
 				t("Invalid view");
 			});
-		} else r = qe(o);
-		const l = u(o), i = r.getMetrics(), s = i.getColOffset(l.colStart), a = i.getRowOffset(l.rowStart), c = i.getColOffset(l.colEnd + 1), d = i.getRowOffset(l.rowEnd + 1), g = r.getPaneBounds(), h = r.getTotalSize(), f = r.getScrollTopLeft(), p = ((e, t, n = !0) => {
+		} else r = Ze(o);
+		const l = u(o), i = r.getMetrics(), a = i.getColOffset(l.colStart), s = i.getRowOffset(l.rowStart), c = i.getColOffset(l.colEnd + 1), d = i.getRowOffset(l.rowEnd + 1), g = r.getPaneBounds(), h = r.getTotalSize(), f = r.getScrollTopLeft(), p = ((e, t, n = !0) => {
 			n = !0 === n ? {
 				block: "start",
 				inline: "end"
@@ -1049,16 +1050,16 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 				inline: "end",
 				...n
 			};
-			const o = fe(n.inline ?? "end", e.x, e.x + e.width, t.left, t.left + t.width, t.totalWidth), r = fe(n.block ?? "end", e.y, e.y + e.height, t.top, t.top + t.height, t.totalHeight);
+			const o = pe(n.inline ?? "end", e.x, e.x + e.width, t.left, t.left + t.width, t.totalWidth), r = pe(n.block ?? "end", e.y, e.y + e.height, t.top, t.top + t.height, t.totalHeight);
 			if (void 0 !== o || void 0 !== r) return {
 				left: o ?? t.left,
 				top: r ?? t.top
 			};
 		})({
-			x: s + f.left,
-			y: a + f.top,
-			width: c - s,
-			height: d - a
+			x: a + f.left,
+			y: s + f.top,
+			width: c - a,
+			height: d - s
 		}, {
 			left: f.left,
 			top: f.top,
@@ -1069,13 +1070,13 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 		}, t);
 		if (!p) return Promise.resolve({ ...f });
 		const m = { ...p }, { left: w, top: x } = Y.getScroll();
-		void 0 !== m.left && (m.left > w ? m.left += _e : m.left < w && (m.left -= He)), void 0 !== m.top && (m.top > x ? m.top += _e : m.top < x && (m.top -= He));
+		void 0 !== m.left && (m.left > w ? m.left += We : m.left < w && (m.left -= _e)), void 0 !== m.top && (m.top > x ? m.top += We : m.top < x && (m.top -= _e));
 		const v = r.getScrollOrientation();
 		v.horizontal && void 0 !== e.colIndex || delete m.left, v.vertical && void 0 !== e.rowIndex || delete m.top;
-		const y = void 0 !== m.left ? Math.abs(m.left - w) : 0, b = void 0 !== m.top ? Math.abs(m.top - x) : 0, S = ("object" == typeof t ? t?.behavior : void 0) ?? (Math.max(y, b) < We || !Y.isSettled() ? "instant" : "smooth");
+		const y = void 0 !== m.left ? Math.abs(m.left - w) : 0, b = void 0 !== m.top ? Math.abs(m.top - x) : 0, S = ("object" == typeof t ? t?.behavior : void 0) ?? (Math.max(y, b) < Ue || !Y.isSettled() ? "instant" : "smooth");
 		return new Promise((e, t) => {
 			try {
-				Je({
+				Qe({
 					...m,
 					behavior: S
 				}), e(m);
@@ -1084,47 +1085,50 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 			}
 		});
 	}, [
-		Ie,
+		Ee,
 		Ce,
 		Se,
 		u
-	]), Je = z((e) => {
+	]), Qe = O((e) => {
 		const t = e?.left ?? e?.[0], n = e?.top ?? e?.[1], o = Y.getTarget(), r = t ?? o.left, l = n ?? o.top, i = "smooth" === e?.behavior;
 		Y.setTarget(r, l, i);
-	}, []), Qe = L(n, () => ({
-		focus: De,
+	}, []), et = L(n, () => ({
+		focus: Te,
 		invalidate: re,
-		scrollTo: Je,
-		scrollBy: Be,
-		scrollCellCoordsIntoView: Ze,
-		getPaneFromClient: Le,
-		getPaneFromCell: qe,
-		getPane: Fe,
+		scrollTo: Qe,
+		scrollBy: Ae,
+		scrollCellCoordsIntoView: Je,
+		getPaneFromClient: Be,
+		getPaneFromCell: Ze,
+		getPane: Ve,
 		onPaneChangeOnce: (e) => {
 			ge.current.push(e);
 		}
 	}), [Se]);
-	c(() => Y.observe(Qe.current), [Y]);
-	const et = (e, t) => {
+	c(() => Y.observe(et.current), [Y]);
+	const tt = (e, t) => {
 		const n = ((e) => {
 			if (!e) return null;
 			if (!Array.isArray(e)) return e;
 			const t = (e) => l(e) && null != e.props?.zIndex ? e.props.zIndex : 0;
-			return [...e].sort((e, n) => t(e) - t(n)).map((e, t) => l(e) ? o(Me.Provider, {
+			return [...e].sort((e, n) => t(e) - t(n)).map((e, t) => l(e) ? o(Pe.Provider, {
 				key: e.key ?? `layer-${t}`,
 				value: t
 			}, e) : e);
 		})(t);
-		return n ? x($e, {
-			pane: e,
-			viewport: Y,
-			children: P ? P(e, n) : n
+		return n ? x(ke.Provider, {
+			value: !1,
+			children: x(Le, {
+				pane: e,
+				viewport: Y,
+				children: P ? P(e, n) : n
+			})
 		}) : null;
-	}, tt = g(() => {
+	}, nt = g(() => {
 		const e = {}, t = Object.keys(Se), n = t.length;
 		for (let o = 0; o < n; o++) {
 			const n = t[o];
-			e[n] = et(Se[n], R);
+			e[n] = tt(Se[n], R);
 		}
 		return e;
 	}, [
@@ -1134,26 +1138,26 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 		P,
 		r,
 		i
-	]), nt = g(() => 0 === Pe.left ? null : x(ie, {
+	]), ot = g(() => 0 === Me.left ? null : x(ae, {
 		linePoints: [
 			0,
 			0,
 			0,
-			se + 1
+			ie + 1
 		],
 		bounds: {
-			x: Pe.left,
+			x: Me.left,
 			y: 0,
 			width: 1,
-			height: se + 1
+			height: ie + 1
 		},
 		...E
 	}), [
 		j,
-		Pe.left,
-		se,
+		Me.left,
+		ie,
 		E
-	]), ot = g(() => 0 === Pe.top ? null : x(ie, {
+	]), rt = g(() => 0 === Me.top ? null : x(ae, {
 		linePoints: [
 			0,
 			0,
@@ -1162,20 +1166,20 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 		],
 		bounds: {
 			x: 0,
-			y: Pe.top,
+			y: Me.top,
 			width: le + 1,
 			height: 1
 		},
 		...I
 	}), [
 		j,
-		Pe.top,
+		Me.top,
 		le,
 		I
-	]), rt = f(!1), lt = g(() => {
+	]), lt = f(!1), it = g(() => {
 		if (!Re) return null;
 		const e = (e, n) => {
-			const o = e.anchor, r = n.getPaneBounds(), l = Pe.left > 0, i = Pe.top > 0, s = i && (o === _.Center || o === _.Left), a = i && (o === _.Top || o === _.TopLeft), c = l && (o === _.Center || o === _.Top), d = l && (o === _.Left || o === _.TopLeft), u = 1e6, g = s ? -1 : -1e6, h = c ? -1 : -1e6, f = d ? r.width + 2 : u, p = a ? r.height + 2 : u, m = s || a || c || d, w = {
+			const o = e.anchor, r = n.getPaneBounds(), l = Me.left > 0, i = Me.top > 0, a = i && (o === _.Center || o === _.Left), s = i && (o === _.Top || o === _.TopLeft), c = l && (o === _.Center || o === _.Top), d = l && (o === _.Left || o === _.TopLeft), u = 1e6, g = a ? -1 : -1e6, h = c ? -1 : -1e6, f = d ? r.width + 2 : u, p = s ? r.height + 2 : u, m = a || s || c || d, w = {
 				position: "absolute",
 				left: r.x,
 				top: r.y,
@@ -1183,10 +1187,10 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 				height: r.height,
 				clip: m ? `rect(${g}px, ${f}px, ${p}px, ${h}px)` : void 0
 			};
-			return x($e, {
+			return x(Le, {
 				pane: n,
 				viewport: Y,
-				children: e.elemStage ? t(e.elemStage, { style: w }, tt?.[o]) : null
+				children: e.elemStage ? t(e.elemStage, { style: w }, nt?.[o]) : null
 			}, `pane:${o}`);
 		}, n = be.length, o = new Array(n);
 		for (let t = 0; t < n; t++) {
@@ -1195,105 +1199,105 @@ var Ie = Object.freeze([]), Ce = (e, t) => {
 		}
 		return v(w, { children: [
 			o,
-			nt,
-			ot
+			ot,
+			rt
 		] });
 	}, [
 		Se,
 		be,
-		tt,
+		nt,
 		le,
-		se,
+		ie,
 		Re,
-		Pe
+		Me
 	]);
 	return c(() => {
-		!rt.current && lt && Re && (rt.current = !0, N?.(Qe.current));
-	}, [lt, Re]), x("div", {
-		ref: Qe,
-		className: V(T, "grid-surface", Ne["sheetxl-grid"]),
+		!lt.current && it && Re && (lt.current = !0, N?.(et.current));
+	}, [it, Re]), x("div", {
+		ref: et,
+		className: V(T, "grid-surface", Fe["sheetxl-grid"]),
 		style: {
 			overflow: "hidden",
-			...O
+			...z
 		},
 		...$,
-		children: x(Ae, { children: lt })
+		children: x(Ne, { children: it })
 	});
 }));
-Fe.displayName = "GridSurface";
-var Ve = Object.freeze({
+Ve.displayName = "GridSurface";
+var He = Object.freeze({
 	getColOffset: (e) => 75 * e,
 	getColIndex: (e) => Math.floor(e / 75),
 	getRowOffset: (e) => 20 * e,
 	getRowIndex: (e) => Math.floor(e / 20)
-}), He = 0, _e = 20, We = 150, Ue = Object.freeze({
+}), _e = 0, We = 20, Ue = 150, Ke = Object.freeze({
 	bottom: -4,
 	right: -4
-}), Ke = Object.freeze({
+}), je = Object.freeze({
 	horizontal: !0,
 	vertical: !0
-}), je = Object.freeze({
+}), Ge = Object.freeze({
 	horizontal: !0,
 	vertical: !1
-}), Ge = Object.freeze({
+}), Xe = Object.freeze({
 	horizontal: !1,
 	vertical: !0
-}), Xe = Object.freeze({
+}), Ye = Object.freeze({
 	horizontal: !1,
 	vertical: !1
-}), Ye = [
+}), qe = [
 	_.TopLeft,
 	_.Top,
 	_.Left,
 	_.Center
 ];
-function qe() {
-	const e = a(Oe);
+function Ze() {
+	const e = s($e);
 	if (!e) throw new Error("useGridPane must be used within a GridPaneProvider");
 	return e.pane;
 }
-function Ze() {
-	return a(Oe)?.pane ?? null;
+function Je() {
+	return s($e)?.pane ?? null;
 }
-function Je(e, t) {
-	const n = a(Be), o = f(null);
-	o.current || (o.current = Le());
+function Qe(e, t) {
+	const n = s(Ae), o = f(null);
+	o.current || (o.current = Be());
 	const r = n ?? o.current, l = `k:${e}`, i = f(null);
 	null === i.current && (i.current = { v: "function" == typeof t ? t() : t });
-	const c = s(() => r.has(l) ? r.get(l) : i.current.v, [r, l]);
-	return [m(s((e) => r.subscribe(l, e), [r, l]), c, c), s((e) => {
+	const c = a(() => r.has(l) ? r.get(l) : i.current.v, [r, l]);
+	return [m(a((e) => r.subscribe(l, e), [r, l]), c, c), a((e) => {
 		const t = r.has(l) ? r.get(l) : i.current.v;
 		r.set(l, "function" == typeof e ? e(t) : e);
 	}, [r, l])];
 }
-var Qe = () => ({
-	zIndex: a(Me),
-	pane: Ze()
-}), et = i((e) => {
-	const { onPointerDown: t, onPointerMove: n, onPointerUp: o, onPointerLeave: r, onMouseDown: l, onMouseEnter: i, onMouseLeave: s, onMouseMove: d, onMouseOut: u, onMouseOver: g, onMouseUp: h, onDoubleClick: p, onKeyDown: m, onKeyPress: w, onKeyUp: v, onFocus: y, onBlur: b, onContextMenu: S, zIndex: E, className: I, children: C } = e, R = a(Pe);
+var et = () => ({
+	zIndex: s(Pe),
+	pane: Je()
+}), tt = i((e) => {
+	const { onPointerDown: t, onPointerMove: n, onPointerUp: o, onPointerLeave: r, onMouseDown: l, onMouseEnter: i, onMouseLeave: a, onMouseMove: d, onMouseOut: u, onMouseOver: g, onMouseUp: h, onDoubleClick: p, onKeyDown: m, onKeyPress: w, onKeyUp: v, onFocus: y, onBlur: b, onContextMenu: S, zIndex: E, className: I, children: C } = e, R = s(ke);
 	c(() => {
-		R && !nt && (nt = !0, console.error("<Layer> nested inside another <Layer>. Layers exist only as direct children of the grid (law 4: the stack is flat) — a composite renders exactly one Layer at its root. For a full-view container inside a layer, use <VirtualDiv fill>. This error fires once."));
+		R && !ot && (ot = !0, console.error("<Layer> nested inside another <Layer>. Layers exist only as direct children of the grid (law 4: the stack is flat) — a composite renders exactly one Layer at its root. For a full-view container inside a layer, use <VirtualDiv fill>. This error fires once."));
 	}, [R]);
-	const M = Se(Ze()), P = a(Me), k = f({});
+	const M = Ee(Je()), P = s(Pe), k = f({});
 	k.current = {
-		pointerdown: tt(t),
-		pointermove: tt(n),
-		pointerup: tt(o),
-		pointerleave: tt(r),
-		mousedown: tt(l),
-		mouseenter: tt(i),
-		mouseleave: tt(s),
-		mousemove: tt(d),
-		mouseout: tt(u),
-		mouseover: tt(g),
-		mouseup: tt(h),
-		dblclick: tt(p),
-		keydown: tt(m),
-		keypress: tt(w),
-		keyup: tt(v),
-		focus: tt(y),
-		blur: tt(b),
-		contextmenu: tt(S)
+		pointerdown: nt(t),
+		pointermove: nt(n),
+		pointerup: nt(o),
+		pointerleave: nt(r),
+		mousedown: nt(l),
+		mouseenter: nt(i),
+		mouseleave: nt(a),
+		mousemove: nt(d),
+		mouseout: nt(u),
+		mouseover: nt(g),
+		mouseup: nt(h),
+		dblclick: nt(p),
+		keydown: nt(m),
+		keypress: nt(w),
+		keyup: nt(v),
+		focus: nt(y),
+		blur: nt(b),
+		contextmenu: nt(S)
 	};
 	const D = f(null);
 	return c(() => {
@@ -1318,24 +1322,24 @@ var Qe = () => ({
 		onKeyPress: w,
 		onKeyUp: v,
 		onContextMenu: S,
-		children: null == C ? null : x(Pe.Provider, {
+		children: null == C ? null : x(ke.Provider, {
 			value: !0,
 			children: C
 		})
 	});
 });
-et.displayName = "Layer";
-var tt = (e) => e ? (t) => e(t) : void 0, nt = !1, ot = !1, rt = "_virtual-div_16eab_1", lt = i(r((e, t) => {
+tt.displayName = "Layer";
+var nt = (e) => e ? (t) => e(t) : void 0, ot = !1, rt = !1, lt = "_virtual-div_16eab_1", it = i(r((e, t) => {
 	const { range: n, bounds: o, fill: r = !1, clipInsets: l, disableAlign: i = !1, coverGridlines: d = !1, alignWidth: u, keepMounted: g = !1, className: h, style: p, children: m, ...w } = e;
-	a(Pe) || it || (it = !0, console.warn("VirtualDiv rendered outside a <Layer>. The grid's children are Layers; place VirtualDivs inside one (law 4: the stack is flat). This warning fires once."));
-	const v = f(null), y = s((e) => {
+	s(ke) || at || (at = !0, console.warn("VirtualDiv rendered outside a <Layer>. The grid's children are Layers; place VirtualDivs inside one (law 4: the stack is flat). This warning fires once."));
+	const v = f(null), y = a((e) => {
 		v.current = e, "function" == typeof t ? t(e) : t && (t.current = e);
 	}, [t]);
 	(({ getElement: e, handlerProps: t }) => {
-		const n = Se(Ze()), o = a(Me);
+		const n = Ee(Je()), o = s(Pe);
 		let r = !1;
 		if (t) {
-			for (let e = 0; e < ve.length; e++) if ("function" == typeof t[ve[e]]) {
+			for (let e = 0; e < ye.length; e++) if ("function" == typeof t[ye[e]]) {
 				r = !0;
 				break;
 			}
@@ -1353,7 +1357,7 @@ var tt = (e) => e ? (t) => e(t) : void 0, nt = !1, ot = !1, rt = "_virtual-div_1
 				getElement: () => l.current.getElement(),
 				hasHandlers: r,
 				getHandler: r ? (e) => {
-					const t = xe[e];
+					const t = ve[e];
 					if (void 0 === t) return;
 					const n = l.current.handlerProps?.[t];
 					return "function" == typeof n ? (e) => n(e) : void 0;
@@ -1369,13 +1373,13 @@ var tt = (e) => e ? (t) => e(t) : void 0, nt = !1, ot = !1, rt = "_virtual-div_1
 		handlerProps: w
 	});
 	const b = (({ range: e, bounds: t, fill: n, clipInsets: o }) => {
-		const r = qe();
+		const r = Ze();
 		if (!r) return null;
 		let l = null, i = !1;
 		if (e) l = r.getBoundsFromRange(e), i = null === r.toClipBounds(l, o);
 		else if (t) i = null === r.toClipBounds(t, o), l = t;
 		else {
-			if (!n) return ot || (ot = !0, console.warn("VirtualDiv: provide exactly one of 'range' | 'bounds' | 'fill'. (The implicit \"no placement = pane-sized\" fallback was removed — use 'fill'.) This warning fires once.")), null;
+			if (!n) return rt || (rt = !0, console.warn("VirtualDiv: provide exactly one of 'range' | 'bounds' | 'fill'. (The implicit \"no placement = pane-sized\" fallback was removed — use 'fill'.) This warning fires once.")), null;
 			{
 				const e = r.getPaneBounds();
 				l = {
@@ -1410,14 +1414,14 @@ var tt = (e) => e ? (t) => e(t) : void 0, nt = !1, ot = !1, rt = "_virtual-div_1
 		const e = d ? 1 / C : 0;
 		P = S.snapDeviceEdge(E.x, C), k = S.snapDeviceEdge(E.y, C), D = S.snapDeviceEdge(E.x + E.width, C) + e - P, T = S.snapDeviceEdge(E.y + E.height, C) + e - k;
 	}
-	const { transform: z, ...O } = p ?? {}, $ = {
+	const { transform: O, ...z } = p ?? {}, $ = {
 		x: E.x - P,
 		y: E.y - k,
 		width: E.width,
 		height: E.height
 	};
 	return x("div", {
-		className: H(h, rt),
+		className: H(h, lt),
 		style: {
 			width: `${D}px`,
 			height: `${T}px`,
@@ -1426,19 +1430,19 @@ var tt = (e) => e ? (t) => e(t) : void 0, nt = !1, ot = !1, rt = "_virtual-div_1
 				borderWidth: `${M}px`,
 				borderStyle: "solid"
 			} : void 0,
-			...O,
-			transform: `translate(${P}px, ${k}px)${z ? ` ${z}` : ""}`
+			...z,
+			transform: `translate(${P}px, ${k}px)${O ? ` ${O}` : ""}`
 		},
 		...w,
 		ref: y,
-		children: null == m ? null : x(re.Provider, {
+		children: null == m ? null : x(le.Provider, {
 			value: $,
 			children: m
 		})
 	});
 }));
-lt.displayName = "VirtualDiv";
-var it = !1, st = (e, t, n, o) => ({
+it.displayName = "VirtualDiv";
+var at = !1, st = (e, t, n, o) => ({
 	x: e,
 	y: t,
 	width: n,
@@ -1447,52 +1451,52 @@ var it = !1, st = (e, t, n, o) => ({
 	left: e,
 	right: e + n,
 	bottom: t + o
-}), at = st(0, 0, 0, 0), ct = (e) => {
+}), ct = st(0, 0, 0, 0), dt = (e) => {
 	const t = e.getElement()?.getBoundingClientRect?.();
 	return {
 		x: t?.left ?? 0,
 		y: t?.top ?? 0
 	};
-}, dt = (e) => {
+}, ut = (e) => {
 	const t = e.getElement()?.getBoundingClientRect?.();
-	return t ? st(t.left, t.top, t.width, t.height) : at;
-}, ut = {
+	return t ? st(t.left, t.top, t.width, t.height) : ct;
+}, gt = {
 	side: "t",
 	align: "center"
-}, gt = [
+}, ht = [
 	_.TopLeft,
 	_.Top,
 	_.Left,
 	_.Center
-], ht = /* @__PURE__ */ new Set([_.Top, _.TopLeft]), ft = /* @__PURE__ */ new Set([_.Left, _.TopLeft]), pt = (e, t, n, o, r) => {
-	let l = null, i = null, s = Infinity, a = !1;
-	for (let c = 0; c < gt.length; c++) {
-		const d = e[gt[c]];
+], ft = /* @__PURE__ */ new Set([_.Top, _.TopLeft]), pt = /* @__PURE__ */ new Set([_.Left, _.TopLeft]), mt = (e, t, n, o, r) => {
+	let l = null, i = null, a = Infinity, s = !1;
+	for (let c = 0; c < ht.length; c++) {
+		const d = e[ht[c]];
 		if (!d) continue;
 		const u = d.getVisibleRange(), g = "row" === t ? u.rowStart : u.colStart, h = "row" === t ? u.rowEnd : u.colEnd;
 		if (n > h || o < g) continue;
-		a = !0, !l && r >= g && r <= h && (l = d);
+		s = !0, !l && r >= g && r <= h && (l = d);
 		const f = r < g ? g - r : r > h ? r - h : 0;
-		f < s && (s = f, i = d);
+		f < a && (a = f, i = d);
 	}
 	return {
 		pane: l ?? i,
-		visible: a
+		visible: s
 	};
-}, mt = (e, t) => {
-	const n = ht.has(e.getAnchor()), o = ft.has(t.getAnchor());
-	return n && o ? _.TopLeft : n ? _.Top : o ? _.Left : _.Center;
 }, wt = (e, t) => {
-	const n = dt(e), o = e.getBoundsFromRange(t);
-	return st(n.left + o.x, n.top + o.y, o.width, o.height);
+	const n = ft.has(e.getAnchor()), o = pt.has(t.getAnchor());
+	return n && o ? _.TopLeft : n ? _.Top : o ? _.Left : _.Center;
 }, xt = (e, t) => {
+	const n = ut(e), o = e.getBoundsFromRange(t);
+	return st(n.left + o.x, n.top + o.y, o.width, o.height);
+}, vt = (e, t) => {
 	const n = (t.left + t.right) / 2, o = (t.top + t.bottom) / 2;
 	return o < e.top ? "t" : o > e.bottom ? "b" : n < e.left ? "l" : n > e.right ? "r" : null;
-}, vt = (e, t, n = "data", o = 0, r = ut, l = "hide") => {
+}, yt = (e, t, n = "data", o = 0, r = gt, l = "hide") => {
 	if (!e) return {
-		rect: at,
+		rect: ct,
 		clipped: !0,
-		boundaryRect: at,
+		boundaryRect: ct,
 		clampedTo: null,
 		anchorPoint: {
 			x: 0,
@@ -1507,8 +1511,12 @@ var it = !1, st = (e, t, n, o) => ({
 			const e = t;
 			return st(e.x, e.y, e.width, e.height);
 		}
+		if ("viewport" === t) {
+			const t = e.getElement()?.ownerDocument?.documentElement;
+			if (t) return st(0, 0, t.clientWidth, t.clientHeight);
+		}
 		if ("pane" === t) {
-			const t = ct(e), n = e.getPaneBounds();
+			const t = dt(e), n = e.getPaneBounds();
 			return st(t.x, t.y, n.width, n.height);
 		}
 		const n = e.getAllPanes();
@@ -1518,11 +1526,11 @@ var it = !1, st = (e, t, n, o) => ({
 			t && (o = Math.min(o, t.left), r = Math.min(r, t.top), l = Math.max(l, t.right), i = Math.max(i, t.bottom));
 		}
 		if (o === Infinity) {
-			const t = ct(e), n = e.getPaneBounds();
+			const t = dt(e), n = e.getPaneBounds();
 			return st(t.x, t.y, n.width, n.height);
 		}
 		return st(o, r, l - o, i - r);
-	})(e, n), s = (e) => {
+	})(e, n), a = (e) => {
 		if (o <= 0) return !1;
 		const t = (n = e, r = i, {
 			w: Math.min(n.right, r.right) - Math.max(n.left, r.left),
@@ -1532,7 +1540,7 @@ var it = !1, st = (e, t, n, o) => ({
 		return t.w <= o || t.h <= o;
 	};
 	if ("point" in t) {
-		const n = st(t.point.x, t.point.y, 0, 0), o = xt(i, n), r = e.getPaneFromPointer(t.point.x, t.point.y);
+		const n = st(t.point.x, t.point.y, 0, 0), o = vt(i, n), r = e.getPaneFromPointer(t.point.x, t.point.y);
 		return {
 			rect: n,
 			clipped: null !== o,
@@ -1545,10 +1553,10 @@ var it = !1, st = (e, t, n, o) => ({
 		};
 	}
 	if ("edge" in t) {
-		const n = ct(e), o = e.getPaneBounds();
+		const n = dt(e), o = e.getPaneBounds();
 		let r = n.x + o.width / 2, l = n.y + o.height / 2;
 		"t" === t.edge ? l = n.y : "b" === t.edge ? l = n.y + o.height : "l" === t.edge ? r = n.x : "r" === t.edge && (r = n.x + o.width);
-		const s = e.getPaneFromPointer(r, l) ?? e;
+		const a = e.getPaneFromPointer(r, l) ?? e;
 		return {
 			rect: st(r, l, 0, 0),
 			clipped: !1,
@@ -1558,13 +1566,13 @@ var it = !1, st = (e, t, n, o) => ({
 				x: r,
 				y: l
 			},
-			owner: s.getAnchor(),
+			owner: a.getAnchor(),
 			slid: null,
 			outOfView: !1
 		};
 	}
 	if ("bounds" in t) {
-		const n = ct(e), o = t.bounds, l = e.toClipBounds(o, 0), c = st(n.x + o.x, n.y + o.y, o.width, o.height), d = null === l || s(c), u = ((e, t) => {
+		const n = dt(e), o = t.bounds, l = e.toClipBounds(o, 0), c = st(n.x + o.x, n.y + o.y, o.width, o.height), d = null === l || a(c), u = ((e, t) => {
 			const { side: n, align: o = "center" } = t;
 			if ("t" === n || "b" === n) {
 				const t = "t" === n ? e.top : e.bottom;
@@ -1582,14 +1590,14 @@ var it = !1, st = (e, t, n, o) => ({
 			rect: c,
 			clipped: d,
 			boundaryRect: i,
-			clampedTo: xt(i, (a = u, st(a.x, a.y, 0, 0))),
+			clampedTo: vt(i, (s = u, st(s.x, s.y, 0, 0))),
 			anchorPoint: u,
 			owner: e.getAnchor(),
 			slid: null,
 			outOfView: d
 		};
 	}
-	var a;
+	var s;
 	const c = ((e) => {
 		if ("range" in e) return e.range;
 		if ("cell" in e) {
@@ -1613,29 +1621,29 @@ var it = !1, st = (e, t, n, o) => ({
 			rowIndex: "start" === o ? e.rowStart : "end" === o ? e.rowEnd : r,
 			colIndex: i
 		};
-	})(c, r), g = pt(d, "row", c.rowStart, c.rowEnd, u.rowIndex), h = pt(d, "col", c.colStart, c.colEnd, u.colIndex), f = g.visible && h.visible, p = g.pane ?? d[_.Center] ?? e, m = h.pane ?? d[_.Center] ?? e, w = wt(p, c), x = wt(m, c), { side: v, align: y = "center" } = r;
+	})(c, r), g = mt(d, "row", c.rowStart, c.rowEnd, u.rowIndex), h = mt(d, "col", c.colStart, c.colEnd, u.colIndex), f = g.visible && h.visible, p = g.pane ?? d[_.Center] ?? e, m = h.pane ?? d[_.Center] ?? e, w = xt(p, c), x = xt(m, c), { side: v, align: y = "center" } = r;
 	let b, S;
 	"t" === v || "b" === v ? (S = "t" === v ? w.top : w.bottom, b = "start" === y ? x.left : "end" === y ? x.right : (x.left + x.right) / 2) : (b = "l" === v ? x.left : x.right, S = "start" === y ? w.top : "end" === y ? w.bottom : (w.top + w.bottom) / 2);
-	const E = dt(m), I = dt(p), C = (e) => Math.max(E.left, Math.min(E.right, e)), R = (e) => Math.max(I.top, Math.min(I.bottom, e)), M = C(b), P = R(S), k = {
+	const E = ut(m), I = ut(p), C = (e) => Math.max(E.left, Math.min(E.right, e)), R = (e) => Math.max(I.top, Math.min(I.bottom, e)), M = C(b), P = R(S), k = {
 		x: M,
 		y: P
-	}, D = C(x.left), T = R(w.top), z = st(D, T, C(x.right) - D, R(w.bottom) - T), O = M - b, $ = P - S, L = Math.abs($) >= Math.abs(O) ? $ < 0 ? "b" : $ > 0 ? "t" : O < 0 ? "r" : O > 0 ? "l" : null : O < 0 ? "r" : O > 0 ? "l" : $ < 0 ? "b" : $ > 0 ? "t" : null, B = O || $ ? {
-		dx: O,
+	}, D = C(x.left), T = R(w.top), O = st(D, T, C(x.right) - D, R(w.bottom) - T), z = M - b, $ = P - S, L = Math.abs($) >= Math.abs(z) ? $ < 0 ? "b" : $ > 0 ? "t" : z < 0 ? "r" : z > 0 ? "l" : null : z < 0 ? "r" : z > 0 ? "l" : $ < 0 ? "b" : $ > 0 ? "t" : null, B = z || $ ? {
+		dx: z,
 		dy: $,
-		distance: Math.hypot(O, $),
+		distance: Math.hypot(z, $),
 		direction: L ?? "t"
 	} : null;
 	return f || "hide" !== l ? {
-		rect: z,
+		rect: O,
 		clipped: !1,
 		boundaryRect: i,
 		clampedTo: L,
 		anchorPoint: k,
-		owner: mt(p, m),
+		owner: wt(p, m),
 		slid: B,
 		outOfView: !f
 	} : {
-		rect: z,
+		rect: O,
 		clipped: !0,
 		boundaryRect: i,
 		clampedTo: L,
@@ -1644,38 +1652,43 @@ var it = !1, st = (e, t, n, o) => ({
 		slid: null,
 		outOfView: !0
 	};
-}, yt = n(null), bt = () => {
-	const e = a(yt);
+}, bt = n(null), St = () => {
+	const e = s(bt);
 	if (!e) throw new Error("useSticky must be used within a <StickyAnchor>");
 	return e;
-}, St = () => a(yt), Et = (e) => {
-	const { anchor: t, placement: n = ut, boundary: o = "data", whenOff: r = "hide", minVisible: l = 0, children: i } = e, { reference: a, getBoundaryRect: c, anchorPoint: d, owner: h, clipped: p, slid: m, outOfView: w, pane: v } = ((e, t) => {
-		const n = Ze(), o = t?.pane ?? n, r = t?.boundary ?? "data", l = t?.minVisible ?? 0, i = t?.placement ?? ut, s = t?.whenOff ?? "hide", a = f({
+}, Et = () => s(bt), It = (e) => {
+	const { anchor: t, placement: n = gt, boundary: o = "data", whenOff: r = "hide", minVisible: l = 0, children: i } = e, { reference: s, getBoundaryRect: c, anchorPoint: d, owner: h, clipped: p, slid: m, outOfView: w, pane: v } = ((e, t) => {
+		const n = Je(), o = t?.pane ?? n, r = t?.boundary ?? "data", l = t?.minVisible ?? 0, i = t?.placement ?? gt, a = t?.whenOff ?? "hide", s = f({
 			pane: o,
 			anchor: e,
 			boundary: r,
 			minVisible: l,
 			placement: i,
-			whenOff: s
+			whenOff: a
 		});
-		a.current = {
+		s.current = {
 			pane: o,
 			anchor: e,
 			boundary: r,
 			minVisible: l,
 			placement: i,
-			whenOff: s
+			whenOff: a
 		};
 		const c = g(() => ({
-			reference: { getBoundingClientRect: () => {
-				const e = a.current;
-				return vt(e.pane, e.anchor, e.boundary, e.minVisible, e.placement, e.whenOff).rect;
-			} },
+			reference: {
+				get contextElement() {
+					return s.current.pane?.getElement() ?? void 0;
+				},
+				getBoundingClientRect: () => {
+					const e = s.current;
+					return yt(e.pane, e.anchor, e.boundary, e.minVisible, e.placement, e.whenOff).rect;
+				}
+			},
 			getBoundaryRect: () => {
-				const e = a.current;
-				return vt(e.pane, e.anchor, e.boundary, e.minVisible, e.placement, e.whenOff).boundaryRect;
+				const e = s.current;
+				return yt(e.pane, e.anchor, e.boundary, e.minVisible, e.placement, e.whenOff).boundaryRect;
 			}
-		}), []), d = vt(o, e, r, l, i, s);
+		}), []), d = yt(o, e, r, l, i, a);
 		return {
 			reference: c.reference,
 			getBoundaryRect: c.getBoundaryRect,
@@ -1704,11 +1717,11 @@ var it = !1, st = (e, t, n, o) => ({
 	S.current = t;
 	const E = f(v);
 	E.current = v;
-	const I = s((e) => {
-		const t = It(S.current), n = E.current;
+	const I = a((e) => {
+		const t = Ct(S.current), n = E.current;
 		return n && t ? n.scrollCellCoordsIntoView(t, e) : Promise.resolve(void 0);
 	}, []), C = g(() => ({
-		reference: a,
+		reference: s,
 		getBoundaryRect: c,
 		anchorPoint: d,
 		bounds: b,
@@ -1721,7 +1734,7 @@ var it = !1, st = (e, t, n, o) => ({
 		pane: v,
 		scrollIntoView: I
 	}), [
-		a,
+		s,
 		c,
 		d.x,
 		d.y,
@@ -1750,7 +1763,7 @@ var it = !1, st = (e, t, n, o) => ({
 				position: "absolute",
 				left: 0,
 				top: 0,
-				transform: `translate3d(${d.x - (e?.left ?? 0)}px, ${d.y - (e?.top ?? 0)}px, 0) ${Ct(n)}`,
+				transform: `translate3d(${d.x - (e?.left ?? 0)}px, ${d.y - (e?.top ?? 0)}px, 0) ${Rt(n)}`,
 				willChange: "transform"
 			},
 			children: x("div", {
@@ -1766,76 +1779,85 @@ var it = !1, st = (e, t, n, o) => ({
 		if (!o) return;
 		let r = 0, l = 0;
 		n.left < o.left ? r = o.left - n.left : n.right > o.right && (r = Math.min(0, o.right - n.right)), n.top < o.top ? l = o.top - n.top : n.bottom > o.bottom && (l = Math.min(0, o.bottom - n.bottom)), t.style.transform = r || l ? `translate(${r}px, ${l}px)` : "";
-	}), x(yt.Provider, {
+	}), x(bt.Provider, {
 		value: C,
 		children: D
 	});
-}, It = (e) => "range" in e ? {
+}, Ct = (e) => "range" in e ? {
 	rowIndex: e.range.rowStart,
 	colIndex: e.range.colStart
 } : "cell" in e ? {
 	rowIndex: e.cell.rowIndex,
 	colIndex: e.cell.colIndex
-} : null, Ct = (e) => {
+} : null, Rt = (e) => {
 	const { side: t, align: n = "center" } = e;
 	let o = "-50%", r = "-50%";
 	"t" === t ? r = "-100%" : "b" === t ? r = "0%" : "l" === t ? o = "-100%" : "r" === t && (o = "0%");
 	const l = "start" === n ? "0%" : "end" === n ? "-100%" : "-50%";
 	return "t" === t || "b" === t ? o = l : r = l, `translate(${o}, ${r})`;
 };
-Et.displayName = "StickyAnchor";
-var Rt = (e) => {
-	const t = O(), n = N(), o = e?.getElement(), r = {}, l = o?.closest(`[${C}]`)?.getAttribute(C), i = o?.closest(`[${R}]`)?.getAttribute(R);
+It.displayName = "StickyAnchor";
+var Mt = (e) => {
+	const t = z(), n = N(), o = e?.getElement(), r = {}, l = o?.closest(`[${C}]`)?.getAttribute(C), i = o?.closest(`[${R}]`)?.getAttribute(R);
 	l && (r[C] = l), i && (r[R] = i);
-	const s = [...t?.themeScope?.classes ?? [], n?.scopeClass].filter(Boolean);
+	const a = [...t?.themeScope?.classes ?? [], n?.scopeClass].filter(Boolean);
 	return {
-		className: s.length ? s.join(" ") : void 0,
+		className: a.length ? a.join(" ") : void 0,
 		attrs: r
 	};
-}, Mt = (e) => {
+}, Pt = (e) => {
 	const { side: t, align: n = "center" } = e;
 	return ("t" === t ? "top" : "b" === t ? "bottom" : "l" === t ? "left" : "right") + ("start" === n ? "-start" : "end" === n ? "-end" : "");
-}, Pt = (e) => {
-	const { state: t, offset: n, alignOffset: o, open: r, container: l, className: i, style: s, zIndex: a, children: c } = e, { getPortalContainer: d } = $(), { className: u, attrs: g } = Rt(t.pane), { refs: h, floatingStyles: f } = ee({
-		placement: Mt(t.placement),
+}, kt = (e) => {
+	const { state: t, offset: n, alignOffset: o, open: r, container: l, className: i, style: a, zIndex: s, children: c } = e, { getPortalContainer: d } = $(), { className: h, attrs: f } = Mt(t.pane), { getBoundaryRect: p } = t, m = g(() => [
+		J({
+			mainAxis: n,
+			alignmentAxis: o
+		}),
+		Z(() => ({ boundary: p() })),
+		Q(() => ({
+			boundary: p(),
+			padding: 4
+		}))
+	], [
+		n,
+		o,
+		p
+	]), { refs: w, floatingStyles: v, update: y } = ee({
+		placement: Pt(t.placement),
 		strategy: "fixed",
 		elements: { reference: t.reference },
-		whileElementsMounted: (e, t, n) => q(e, t, n, { animationFrame: !0 }),
-		middleware: [
-			J({
-				mainAxis: n,
-				alignmentAxis: o
-			}),
-			Z(),
-			Q({ padding: 4 })
-		]
+		whileElementsMounted: q,
+		middleware: m
 	});
-	if (!r) return null;
-	const p = "function" == typeof c ? c(t) : c;
+	if (u(() => {
+		y();
+	}, [t, y]), !r) return null;
+	const b = "function" == typeof c ? c(t) : c;
 	return Y(x("div", {
-		ref: h.setFloating,
-		className: [i, u].filter(Boolean).join(" ") || void 0,
-		...g,
+		ref: w.setFloating,
+		className: [i, h].filter(Boolean).join(" ") || void 0,
+		...f,
 		style: {
-			...f,
-			zIndex: a,
-			...s
+			...v,
+			zIndex: s,
+			...a
 		},
-		children: p
+		children: b
 	}), l ?? d());
-}, kt = (e) => {
-	const { anchor: t, placement: n, whenOff: o, boundary: r, minVisible: l, offset: i = 4, alignOffset: s = 0, open: a = !0, container: c, className: d, style: u, zIndex: g = 1250, children: h } = e;
-	return x(Et, {
+}, Dt = (e) => {
+	const { anchor: t, placement: n, whenOff: o, boundary: r, minVisible: l, offset: i = 4, alignOffset: a = 0, open: s = !0, container: c, className: d, style: u, zIndex: g = 1250, children: h } = e;
+	return x(It, {
 		anchor: t,
 		placement: n,
 		whenOff: o,
 		boundary: r,
 		minVisible: l,
-		children: (e) => x(Pt, {
+		children: (e) => x(kt, {
 			state: e,
 			offset: i,
-			alignOffset: s,
-			open: a,
+			alignOffset: a,
+			open: s,
 			container: c,
 			className: d,
 			style: u,
@@ -1844,35 +1866,35 @@ var Rt = (e) => {
 		})
 	});
 };
-kt.displayName = "StickyFloat";
-var Dt = { pointerEvents: "auto" }, Tt = (e = {}) => {
-	const { openDelay: t = 300, closeDelay: n = 150 } = e, [o, r] = p(!1), l = f(!1), i = f(null), a = f(!1), d = f(null), u = f(null), h = (e) => {
+Dt.displayName = "StickyFloat";
+var Tt = { pointerEvents: "auto" }, Ot = (e = {}) => {
+	const { openDelay: t = 300, closeDelay: n = 150 } = e, [o, r] = p(!1), l = f(!1), i = f(null), s = f(!1), d = f(null), u = f(null), h = (e) => {
 		l.current = e, r(e);
 	}, m = () => {
 		d.current && (clearTimeout(d.current), d.current = null);
 	}, w = () => {
 		u.current && (clearTimeout(u.current), u.current = null);
-	}, x = s(() => {
+	}, x = a(() => {
 		m(), w(), u.current = setTimeout(() => {
-			u.current = null, a.current || null !== i.current || h(!1);
+			u.current = null, s.current || null !== i.current || h(!1);
 		}, n);
-	}, [n]), v = s((e) => {
+	}, [n]), v = a((e) => {
 		if (e !== i.current) if (i.current = e, null !== e) {
 			if (w(), l.current) return;
 			m(), d.current = setTimeout(() => {
 				d.current = null, null !== i.current && h(!0);
 			}, t);
 		} else x();
-	}, [t, x]), y = s(() => {
-		m(), w(), i.current = null, a.current = !1, h(!1);
+	}, [t, x]), y = a(() => {
+		m(), w(), i.current = null, s.current = !1, h(!1);
 	}, []), b = g(() => ({
 		onPointerEnter: () => {
-			a.current = !0, w();
+			s.current = !0, w();
 		},
 		onPointerLeave: () => {
-			a.current = !1, x();
+			s.current = !1, x();
 		},
-		style: Dt
+		style: Tt
 	}), [x]);
 	return c(() => () => {
 		m(), w();
@@ -1883,89 +1905,127 @@ var Dt = { pointerEvents: "auto" }, Tt = (e = {}) => {
 		close: y
 	};
 }, zt = (e, t = {}) => {
-	const { open: n, setTarget: o, tipProps: r } = Tt(t), l = Ze(), i = Se(l), s = a(Me), d = f({}), u = Re(e);
-	return d.current = {
+	const { open: n, setTarget: o, tipProps: r } = Ot(t), l = Je(), i = Ee(l), a = s(Pe), d = Me(e), [u, g] = Qe(`range-hover:${a}:${d}`, null), h = f({});
+	return h.current = {
 		pointermove: (t, n) => {
-			const r = t, i = (n ?? l)?.getCellFromPointer(r.clientX, r.clientY);
-			o(i && U.isCellWithinRange(i, e) ? u : null);
+			const o = t, r = (n ?? l)?.getCellFromPointer(o.clientX, o.clientY);
+			g(r && U.isCellWithinRange(r, e) ? d : null);
 		},
-		pointerleave: () => o(null)
+		pointerleave: () => g(null)
 	}, c(() => {
+		o(u);
+	}, [u, o]), c(() => {
 		if (i) return i.registerResponder({
-			zIndex: s,
-			getHandler: (e) => d.current[e]
+			zIndex: a,
+			getHandler: (e) => h.current[e]
 		});
-	}, [i, s]), {
+	}, [i, a]), {
 		open: n,
 		tipProps: r
 	};
-}, Ot = (e) => {
-	const { probe: t, placement: n, offset: o = 6, alignOffset: r = 0, openDelay: l = 300, closeDelay: i = 150, whenOff: s = "hide", boundary: a, zIndex: d, dismiss: u, children: g, className: h, style: m } = e, w = qe(), { open: v, setTarget: y, tipProps: b, close: S } = Tt({
-		openDelay: l,
-		closeDelay: i
-	}), [E, I] = p(null), C = f(null), R = z((e) => {
-		const n = w.getCellFromPointer(e.clientX, e.clientY);
-		if (n) {
-			const e = t(n, w);
-			if (e && e.range) {
-				const t = e.key ?? Re(e.range);
-				t !== C.current && (C.current = t, I({
-					key: t,
-					range: e.range,
-					data: e.data
-				})), y(t);
-				return;
-			}
-		}
-		C.current = null, y(null);
+}, $t = {
+	target: null,
+	aimed: null
+}, Lt = (e) => ({
+	key: e.key ?? Me(e.range),
+	range: e.range,
+	data: e.data
+}), Bt = (e, t) => Array.isArray(e) ? e.includes(t) : e === t, At = (e) => {
+	const t = e.getCoords();
+	return t ? `${t.rowIndex},${t.colIndex}` : null;
+}, Nt = (e) => {
+	const { activateOn: t, name: n, probe: o, selection: r, target: l, dismiss: i, placement: a, offset: d = 6, alignOffset: u = 0, openDelay: g = 300, closeDelay: h = 150, whenOff: f = "hide", boundary: p, zIndex: m, children: w, className: v, style: y } = e, b = Ze(), S = s(Pe), E = Bt(t, "hover"), I = Bt(t, "selection"), C = void 0 !== l, { open: R, setTarget: M, tipProps: P, close: k } = Ot({
+		openDelay: g,
+		closeDelay: h
+	}), [D, T] = Qe(`range-float:${n ?? S}`, $t), z = O(() => {
+		T((e) => null === e.aimed ? e : {
+			target: e.target,
+			aimed: null
+		});
+	}, [T]), $ = O((e) => {
+		const t = b.getCellFromPointer(e.clientX, e.clientY), n = t ? o?.(t, b) : null;
+		if (!n?.range) return void z();
+		const r = Lt(n);
+		T((e) => e.aimed === r.key && e.target?.key === r.key ? e : {
+			target: r,
+			aimed: r.key
+		});
 	}, [
-		w,
-		t,
-		y
-	]), M = z(() => {
-		C.current = null, y(null);
-	}, [y]);
-	return c(() => {
-		u && (C.current = null, S(), I(null));
-	}, [u, S]), x(et, {
-		className: V(h, "hover-tip"),
-		onPointerMove: R,
-		onPointerLeave: M,
-		children: E && x(kt, {
-			anchor: { range: E.range },
-			placement: n,
-			offset: o,
-			alignOffset: r,
-			boundary: a,
-			zIndex: d,
-			open: v,
-			whenOff: s,
-			style: m,
-			children: (e) => g({
-				range: E.range,
-				data: E.data,
-				tipProps: b,
+		b,
+		o,
+		T,
+		z
+	]), L = E ? D.aimed : null;
+	c(() => {
+		M(L);
+	}, [L, M]), c(() => {
+		i && (k(), T($t));
+	}, [
+		i,
+		k,
+		T
+	]);
+	const A = B(I ? r : void 0, At);
+	let N = null;
+	if (I && !i && r && null !== A) {
+		const e = o?.(r.getCoords(), b);
+		e && e.range && (N = Lt(e));
+	}
+	const F = E ? D.target : null, H = R && null !== F, _ = C ? null === l ? null : Lt(l) : H ? F : N ?? F, W = C ? null !== _ : H || null !== N;
+	return x(tt, {
+		className: V(v, "range-float"),
+		onPointerMove: E ? $ : void 0,
+		onPointerLeave: E ? z : void 0,
+		children: _ && x(Dt, {
+			anchor: { range: _.range },
+			placement: a,
+			offset: d,
+			alignOffset: u,
+			boundary: p,
+			zIndex: m,
+			open: W,
+			whenOff: f,
+			style: y,
+			children: (e) => w({
+				range: _.range,
+				data: _.data,
+				floatProps: P,
 				state: e
 			})
 		})
 	});
 };
-Ot.displayName = "HoverTipLayer";
-var $t = {
+Nt.displayName = "RangeFloatLayer";
+var Ft = (e) => {
+	const { children: t, className: n, ...o } = e;
+	return x(Nt, {
+		...o,
+		activateOn: "hover",
+		className: V(n, "hover-tip"),
+		children: ({ range: e, data: n, floatProps: o, state: r }) => t({
+			range: e,
+			data: n,
+			tipProps: o,
+			state: r
+		})
+	});
+};
+Ft.displayName = "HoverTipLayer";
+var Vt = {
 	t: "↑",
 	b: "↓",
 	l: "←",
 	r: "→"
-}, Lt = (e) => {
+}, Ht = (e) => {
 	let t = "", n = e;
 	do
 		t = String.fromCharCode(65 + n % 26) + t, n = Math.floor(n / 26) - 1;
 	while (n >= 0);
 	return t;
-}, Bt = (e) => {
-	const t = `${Lt(e.colStart)}${e.rowStart + 1}`, n = `${Lt(e.colEnd)}${e.rowEnd + 1}`;
+}, _t = (e) => {
+	const t = `${Ht(e.colStart)}${e.rowStart + 1}`, n = `${Ht(e.colEnd)}${e.rowEnd + 1}`;
 	return t === n ? t : `${t}:${n}`;
-}, At = {
+}, Wt = {
 	border: "none",
 	background: "transparent",
 	color: "inherit",
@@ -1976,7 +2036,7 @@ var $t = {
 	height: 18,
 	borderRadius: 4,
 	opacity: .6
-}, Nt = {
+}, Ut = {
 	position: "relative",
 	background: "var(--sxl-color-base-100, white)",
 	color: "var(--sxl-color-base-content, #222)",
@@ -1986,7 +2046,7 @@ var $t = {
 	boxShadow: "0 6px 24px var(--sxl-color-shadow, rgba(0,0,0,0.2))",
 	pointerEvents: "auto",
 	maxWidth: 320
-}, Ft = {
+}, Kt = {
 	display: "inline-flex",
 	alignItems: "center",
 	gap: 8,
@@ -1996,8 +2056,8 @@ var $t = {
 	padding: "4px 6px 4px 12px",
 	boxShadow: "0 2px 10px var(--sxl-color-shadow, rgba(0,0,0,0.3))",
 	pointerEvents: "auto"
-}, Vt = ({ direction: e, label: t, onGoto: n, onCancel: o }) => v("div", {
-	style: Ft,
+}, jt = ({ direction: e, label: t, onGoto: n, onCancel: o }) => v("div", {
+	style: Kt,
 	children: [v("button", {
 		onClick: n,
 		style: {
@@ -2008,7 +2068,7 @@ var $t = {
 			font: "12px system-ui"
 		},
 		children: [
-			$t[e],
+			Vt[e],
 			" ",
 			t
 		]
@@ -2016,43 +2076,43 @@ var $t = {
 		"aria-label": "Cancel",
 		onClick: o,
 		style: {
-			...At,
+			...Wt,
 			opacity: .8
 		},
 		children: "×"
 	})]
-}), Ht = (e) => {
+}), Gt = (e) => {
 	const { range: t, placement: n = {
 		side: "t",
 		align: "start"
-	}, offset: o = 8, alignOffset: r = 0, address: l, onGoto: i, onCancel: s, zIndex: a, className: c, style: d, children: u } = e;
-	return x(kt, {
+	}, offset: o = 8, alignOffset: r = 0, address: l, onGoto: i, onCancel: a, zIndex: s, className: c, style: d, children: u } = e;
+	return x(Dt, {
 		anchor: { range: t },
 		placement: n,
 		offset: o,
 		alignOffset: r,
 		whenOff: "clamp",
-		zIndex: a,
+		zIndex: s,
 		open: !0,
 		children: (e) => {
-			if (e.outOfView) return x(Vt, {
+			if (e.outOfView) return x(jt, {
 				direction: e.slid?.direction ?? n.side,
-				label: l ?? Bt(t),
+				label: l ?? _t(t),
 				onGoto: () => i ? i(e) : e.scrollIntoView(),
-				onCancel: s
+				onCancel: a
 			});
 			const o = "function" == typeof u ? u(e) : u;
 			return v("div", {
 				className: c,
 				style: {
-					...Nt,
+					...Ut,
 					...d
 				},
-				children: [s && x("button", {
+				children: [a && x("button", {
 					"aria-label": "Cancel",
-					onClick: s,
+					onClick: a,
 					style: {
-						...At,
+						...Wt,
 						position: "absolute",
 						top: 4,
 						right: 4
@@ -2063,20 +2123,20 @@ var $t = {
 		}
 	});
 };
-Ht.displayName = "RangePrompt";
-var _t = {
+Gt.displayName = "RangePrompt";
+var Xt = {
 	stroke: "var(--sxl-color-primary, rgb(33, 115, 70))",
 	alignWidth: 2,
 	fill: "color-mix(in srgb, var(--sxl-color-primary, rgb(33, 115, 70)) 10%, transparent)"
-}, Wt = i((e) => {
-	const { range: t, hole: n, clipInsets: o, alignWidth: r = 1, animatedTransition: l, className: i, ...s } = e, a = S.getDevicePixelRatio(), c = r / a, d = o ?? -c / 2, u = Ze(), g = u ? u.getBoundsFromRange(t) : null, h = c + 4;
+}, Yt = i((e) => {
+	const { range: t, hole: n, clipInsets: o, alignWidth: r = 1, animatedTransition: l, className: i, ...a } = e, s = S.getDevicePixelRatio(), c = r / s, d = o ?? -c / 2, u = Je(), g = u ? u.getBoundsFromRange(t) : null, h = c + 4;
 	if (u && g && !u.toClipBounds(g, d)) return null;
 	const f = u ? u.getPaneBounds() : null, p = f ? {
 		x: -h,
 		y: -h,
 		width: f.width + 2 * h,
 		height: f.height + 2 * h
-	} : g, m = p ? S.snapDeviceEdge(p.x, a) : 0, w = p ? S.snapDeviceEdge(p.y, a) : 0;
+	} : g, m = p ? S.snapDeviceEdge(p.x, s) : 0, w = p ? S.snapDeviceEdge(p.y, s) : 0;
 	let v;
 	if (g && p) {
 		const e = c + 2, t = Math.max(g.x, p.x - e), n = Math.max(g.y, p.y - e);
@@ -2093,7 +2153,7 @@ var _t = {
 		width: y.width,
 		height: y.height
 	} : void 0;
-	return x(lt, {
+	return x(it, {
 		className: V(i),
 		bounds: p ?? void 0,
 		clipInsets: d,
@@ -2103,12 +2163,12 @@ var _t = {
 			alignWidth: r,
 			hole: b,
 			animatedTransition: l,
-			...s
+			...a
 		})
 	});
 });
-Wt.displayName = "RangeRect";
-var Ut = () => "undefined" != typeof window ? window : null, Kt = 60, jt = 24, Gt = (e, t, n = {
+Yt.displayName = "RangeRect";
+var qt = () => "undefined" != typeof window ? window : null, Zt = 60, Jt = 24, Qt = (e, t, n = {
 	x: !0,
 	y: !0
 }) => {
@@ -2116,19 +2176,19 @@ var Ut = () => "undefined" != typeof window ? window : null, Kt = 60, jt = 24, G
 	if (!o) return !1;
 	const r = !1 === n.x ? 0 : t.x <= o.left + 24 ? -1 : t.x >= o.right - 24 ? 1 : 0, l = !1 === n.y ? 0 : t.y <= o.top + 24 ? -1 : t.y >= o.bottom - 24 ? 1 : 0;
 	if (!r && !l) return !1;
-	const i = e.getVisibleRange(), s = e.getTotalRange(), a = e.getCellFromPointer(t.x, t.y), c = {};
-	return r > 0 && i.colEnd < s.colEnd ? c.colIndex = Math.min(s.colEnd, Math.max(i.colEnd + 1, a?.colIndex ?? 0)) : r < 0 && i.colStart > s.colStart && (c.colIndex = Math.max(s.colStart, Math.min(i.colStart - 1, a?.colIndex ?? Number.MAX_SAFE_INTEGER))), l > 0 && i.rowEnd < s.rowEnd ? c.rowIndex = Math.min(s.rowEnd, Math.max(i.rowEnd + 1, a?.rowIndex ?? 0)) : l < 0 && i.rowStart > s.rowStart && (c.rowIndex = Math.max(s.rowStart, Math.min(i.rowStart - 1, a?.rowIndex ?? Number.MAX_SAFE_INTEGER))), (void 0 !== c.colIndex || void 0 !== c.rowIndex) && ((e.getAllPanes()[_.Center] ?? e).scrollCellCoordsIntoView(c), !0);
-}, Xt = (e, t, n, o) => {
+	const i = e.getVisibleRange(), a = e.getTotalRange(), s = e.getCellFromPointer(t.x, t.y), c = {};
+	return r > 0 && i.colEnd < a.colEnd ? c.colIndex = Math.min(a.colEnd, Math.max(i.colEnd + 1, s?.colIndex ?? 0)) : r < 0 && i.colStart > a.colStart && (c.colIndex = Math.max(a.colStart, Math.min(i.colStart - 1, s?.colIndex ?? Number.MAX_SAFE_INTEGER))), l > 0 && i.rowEnd < a.rowEnd ? c.rowIndex = Math.min(a.rowEnd, Math.max(i.rowEnd + 1, s?.rowIndex ?? 0)) : l < 0 && i.rowStart > a.rowStart && (c.rowIndex = Math.max(a.rowStart, Math.min(i.rowStart - 1, s?.rowIndex ?? Number.MAX_SAFE_INTEGER))), (void 0 !== c.colIndex || void 0 !== c.rowIndex) && ((e.getAllPanes()[_.Center] ?? e).scrollCellCoordsIntoView(c), !0);
+}, en = (e, t, n, o) => {
 	const r = o ?? ((t, n) => e.getCellFromPointer(t, n));
-	let l = null, i = null, s = null, a = null, c = null;
+	let l = null, i = null, a = null, s = null, c = null;
 	const d = () => {
 		c && (document.removeEventListener("touchstart", c, { capture: !0 }), document.removeEventListener("touchmove", c, { capture: !0 }), c = null);
 	}, u = () => {
-		a && clearTimeout(a), a = null;
+		s && clearTimeout(s), s = null;
 	}, g = (t, n, o) => {
 		if (!l) return !1;
-		const s = r(t, n);
-		return s && !U.isEqualCells(s, i) && (i = s, l.drag(s, o)), (l.edgeScroll ?? ((t) => Gt(e, t)))({
+		const a = r(t, n);
+		return a && !U.isEqualCells(a, i) && (i = a, l.drag(a, o)), (l.edgeScroll ?? ((t) => Qt(e, t)))({
 			x: t,
 			y: n
 		});
@@ -2139,8 +2199,8 @@ var Ut = () => "undefined" != typeof window ? window : null, Kt = 60, jt = 24, G
 		begin: (e) => {
 			const o = r(e.clientX, e.clientY);
 			if (!o) return null;
-			const a = t(o, e);
-			return a ? (l = a, i = o, s = null, "touch" === e.pointerType && !1 !== a.capture && (() => {
+			const s = t(o, e);
+			return s ? (l = s, i = o, a = null, "touch" === e.pointerType && !1 !== s.capture && (() => {
 				if (c) return;
 				const e = (e) => {
 					e.stopImmediatePropagation(), e.preventDefault();
@@ -2152,31 +2212,31 @@ var Ut = () => "undefined" != typeof window ? window : null, Kt = 60, jt = 24, G
 					capture: !0,
 					passive: !1
 				});
-			})(), n?.(a.dragMode ?? null), a) : null;
+			})(), n?.(s.dragMode ?? null), s) : null;
 		},
 		move: (e, t, n) => {
-			l && (s = {
+			l && (a = {
 				x: e,
 				y: t
-			}, g(e, t, n) ? (u(), a = setTimeout(function e() {
-				a = l && s && g(s.x, s.y) ? setTimeout(e, 60) : null;
+			}, g(e, t, n) ? (u(), s = setTimeout(function e() {
+				s = l && a && g(a.x, a.y) ? setTimeout(e, 60) : null;
 			}, 60)) : u());
 		},
 		reset: () => {
 			const e = l;
-			return l = null, i = null, s = null, u(), d(), e && n?.(null), e;
+			return l = null, i = null, a = null, u(), d(), e && n?.(null), e;
 		},
 		dispose: () => {
 			u(), d();
 		}
 	};
-}, Yt = (e, t, n) => {
-	const o = Xt(e, t, n);
-	let r = !1, l = null, i = null, s = null, a = null, c = null;
+}, tn = (e, t, n) => {
+	const o = en(e, t, n);
+	let r = !1, l = null, i = null, a = null, s = null, c = null;
 	const d = () => {
-		s && l && l.removeEventListener?.("pointercancel", s), s = null, a && Ut()?.removeEventListener("keydown", a, !0), a = null;
+		a && l && l.removeEventListener?.("pointercancel", a), a = null, s && qt()?.removeEventListener("keydown", s, !0), s = null;
 	}, u = () => {
-		c && (Ut()?.removeEventListener("pointerup", c), Ut()?.removeEventListener("pointercancel", c), c = null);
+		c && (qt()?.removeEventListener("pointerup", c), qt()?.removeEventListener("pointercancel", c), c = null);
 	}, g = () => {
 		l && null !== i && l.hasPointerCapture?.(i) && l.releasePointerCapture(i), l = null, i = null;
 	}, h = (e, t) => {
@@ -2188,10 +2248,10 @@ var Ut = () => "undefined" != typeof window ? window : null, Kt = 60, jt = 24, G
 			const t = o.begin(e);
 			if (t) if (!1 !== t.capture) {
 				const t = e.currentTarget;
-				t.setPointerCapture?.(e.pointerId), l = t, i = e.pointerId, r = !0, s = (e) => h(!0, e), t.addEventListener?.("pointercancel", s), a = (e) => {
+				t.setPointerCapture?.(e.pointerId), l = t, i = e.pointerId, r = !0, a = (e) => h(!0, e), t.addEventListener?.("pointercancel", a), s = (e) => {
 					"Escape" === e.key && (e.preventDefault(), e.stopPropagation(), h(!0));
-				}, Ut()?.addEventListener("keydown", a, !0);
-			} else r = !1, c = (e) => h("pointercancel" === e.type, e), Ut()?.addEventListener("pointerup", c), Ut()?.addEventListener("pointercancel", c);
+				}, qt()?.addEventListener("keydown", s, !0);
+			} else r = !1, c = (e) => h("pointercancel" === e.type, e), qt()?.addEventListener("pointerup", c), qt()?.addEventListener("pointercancel", c);
 		},
 		onPointerMove: (e) => {
 			o.hasSession() && r && (!1 !== o.captureEvents() && e.stopPropagation(), o.move(e.clientX, e.clientY, e));
@@ -2203,25 +2263,25 @@ var Ut = () => "undefined" != typeof window ? window : null, Kt = 60, jt = 24, G
 		}
 	};
 };
-function qt(e, t, n, o) {
-	const r = Xt(e, t, n, o);
-	let l = null, i = null, s = null;
-	const a = () => {
+function nn(e, t, n, o) {
+	const r = en(e, t, n, o);
+	let l = null, i = null, a = null;
+	const s = () => {
 		l?.(), l = null;
 	}, c = () => {
-		i && null !== s && i.hasPointerCapture?.(s) && i.releasePointerCapture(s), i = null, s = null;
+		i && null !== a && i.hasPointerCapture?.(a) && i.releasePointerCapture(a), i = null, a = null;
 	};
 	return {
 		start: (e, t) => {
-			a(), c();
+			s(), c();
 			const n = r.begin(e);
 			if (!n) return;
 			if (!1 !== n.capture) {
 				const n = t ?? e.currentTarget;
-				n && (n.setPointerCapture?.(e.pointerId), i = n, s = e.pointerId);
+				n && (n.setPointerCapture?.(e.pointerId), i = n, a = e.pointerId);
 			}
 			const o = (e) => r.move(e.clientX, e.clientY, e), d = (e, t) => {
-				a();
+				s();
 				const n = r.reset();
 				c(), n && (e ? n.cancel?.(t) : n.end?.(t));
 			}, u = (e) => d(!1, e), g = (e) => d(!0, e), h = (e) => {
@@ -2232,14 +2292,14 @@ function qt(e, t, n, o) {
 			};
 		},
 		dispose: () => {
-			a(), c(), r.dispose();
+			s(), c(), r.dispose();
 		}
 	};
 }
-var Zt = (e) => {
-	const t = qe(), [n, o] = p(null), r = f(e);
+var on = (e) => {
+	const t = Ze(), [n, o] = p(null), r = f(e);
 	r.current = e;
-	const l = g(() => Yt(t, (e, t) => r.current(e, t), o), [t]);
+	const l = g(() => tn(t, (e, t) => r.current(e, t), o), [t]);
 	return c(() => () => l.dispose(), [l]), {
 		onPointerDown: l.onPointerDown,
 		onPointerMove: l.onPointerMove,
@@ -2247,15 +2307,15 @@ var Zt = (e) => {
 		onPointerCancel: l.onPointerCancel,
 		dragMode: n
 	};
-}, Jt = (e) => {
-	const t = qe(), [n, o] = p(null), r = f(e);
+}, rn = (e) => {
+	const t = Ze(), [n, o] = p(null), r = f(e);
 	r.current = e;
-	const l = g(() => qt(t, (e, t) => r.current(e, t), o), [t]);
+	const l = g(() => nn(t, (e, t) => r.current(e, t), o), [t]);
 	return c(() => () => l.dispose(), [l]), {
 		start: l.start,
 		dragMode: n
 	};
-}, Qt = (e) => {
+}, ln = (e) => {
 	const t = f(null), n = f(!1);
 	return c(() => {
 		const e = (e) => {
@@ -2273,16 +2333,16 @@ var Zt = (e) => {
 			n.current = !1;
 		}, 500), !0);
 	};
-}, en = (e) => {
-	const { range: t, anchor: n, size: o = 8, cursor: r, dragCursor: l, background: i = "var(--sxl-color-primary, rgb(33, 115, 70))", onDragStart: s, onDragMove: a, onDragEnd: c, onDragCancel: d, onDoubleClick: u, onHoverChange: g, hoverStyle: h, animatedTransition: f, renderHandle: m, children: v, className: y, style: b, preserveFocus: E, clampToView: I } = e, C = qe(), [R, M] = p(!1), P = Qt(!!u), { start: k, dragMode: D } = Jt((e, t) => {
+}, an = (e) => {
+	const { range: t, anchor: n, size: o = 8, cursor: r, dragCursor: l, background: i = "var(--sxl-color-primary, rgb(33, 115, 70))", onDragStart: a, onDragMove: s, onDragEnd: c, onDragCancel: d, onDoubleClick: u, onHoverChange: g, hoverStyle: h, animatedTransition: f, renderHandle: m, children: v, className: y, style: b, preserveFocus: E, clampToView: I } = e, C = Ze(), [R, M] = p(!1), P = ln(!!u), { start: k, dragMode: D } = rn((e, t) => {
 		if (0 !== t.button) return null;
 		t.stopPropagation(), E && t.preventDefault();
 		const n = e;
 		let o = e;
-		return s?.(n, t), {
+		return a?.(n, t), {
 			dragMode: "handle",
 			drag: (e, r) => {
-				o = e, a?.(n, e, r ?? t);
+				o = e, s?.(n, e, r ?? t);
 			},
 			end: (e) => {
 				c?.(n, o, e);
@@ -2291,10 +2351,10 @@ var Zt = (e) => {
 				d?.();
 			}
 		};
-	}), T = null !== D && l ? l : r ?? rn[n], z = C.getBoundsFromRange(t);
-	if (!z) return null;
-	const O = S.getDevicePixelRatio();
-	let $ = on(z.x, z.x + z.width, tn[n], O), L = on(z.y, z.y + z.height, nn[n], O);
+	}), T = null !== D && l ? l : r ?? un[n], O = C.getBoundsFromRange(t);
+	if (!O) return null;
+	const z = S.getDevicePixelRatio();
+	let $ = dn(O.x, O.x + O.width, sn[n], z), L = dn(O.y, O.y + O.height, cn[n], z);
 	if (I) {
 		if (!C.toClipBounds(C.getBoundsFromRange(t))) return null;
 		const e = C.getPaneBounds(), n = o / 2 + 1;
@@ -2350,8 +2410,8 @@ var Zt = (e) => {
 		children: v
 	});
 };
-en.displayName = "DragHandle";
-var tn = {
+an.displayName = "DragHandle";
+var sn = {
 	tl: "leading",
 	l: "leading",
 	bl: "leading",
@@ -2360,7 +2420,7 @@ var tn = {
 	tr: "trailing",
 	r: "trailing",
 	br: "trailing"
-}, nn = {
+}, cn = {
 	tl: "leading",
 	t: "leading",
 	tr: "leading",
@@ -2369,7 +2429,7 @@ var tn = {
 	bl: "trailing",
 	b: "trailing",
 	br: "trailing"
-}, on = (e, t, n, o) => "center" === n ? S.snapDeviceEdge((e + t) / 2, o) : S.edgeCenter("leading" === n ? e : t, n, 2, o), rn = {
+}, dn = (e, t, n, o) => "center" === n ? S.snapDeviceEdge((e + t) / 2, o) : S.edgeCenter("leading" === n ? e : t, n, 2, o), un = {
 	tl: "nwse-resize",
 	br: "nwse-resize",
 	tr: "nesw-resize",
@@ -2378,18 +2438,18 @@ var tn = {
 	b: "ns-resize",
 	l: "ew-resize",
 	r: "ew-resize"
-}, ln = (e) => {
-	const { range: t, children: n, grip: o = "entire", hitSize: r = 10, onHoverChange: l, onDragStateChange: i, onDragStart: s, onDragMove: a, onDragEnd: c, renderMove: d, preserveFocus: u, onEdgeDoubleClick: g } = e, h = qe(), p = t ? `range-move:${t.rowStart}:${t.colStart}:${t.rowEnd}:${t.colEnd}` : "range-move", m = f(null), [y, b] = Je(p, null), { start: E, dragMode: I } = Jt((e, n) => {
+}, gn = (e) => {
+	const { range: t, children: n, grip: o = "entire", hitSize: r = 10, onHoverChange: l, onDragStateChange: i, onDragStart: a, onDragMove: s, onDragEnd: c, renderMove: d, preserveFocus: u, onEdgeDoubleClick: g } = e, h = Ze(), p = t ? `range-move:${t.rowStart}:${t.colStart}:${t.rowEnd}:${t.colEnd}` : "range-move", m = f(null), [y, b] = Qe(p, null), { start: E, dragMode: I } = rn((e, n) => {
 		if (0 !== n.button) return null;
 		if (!t) return null;
 		n.stopPropagation(), u && n.preventDefault();
 		const o = e, r = t;
 		let l = r;
-		i?.(!0), s?.(r, n);
+		i?.(!0), a?.(r, n);
 		return {
 			dragMode: "move",
 			drag: (e, t) => {
-				l = ((e) => sn(r, e.rowIndex - o.rowIndex, e.colIndex - o.colIndex, h.getTotalRange()))(e), d && b(l), a?.(l, t ?? n);
+				l = ((e) => hn(r, e.rowIndex - o.rowIndex, e.colIndex - o.colIndex, h.getTotalRange()))(e), d && b(l), s?.(l, t ?? n);
 			},
 			end: (e) => {
 				i?.(!1), d && b(null), U.isEqualRanges(l, r) || c?.(l, e);
@@ -2398,15 +2458,15 @@ var tn = {
 				i?.(!1), d && b(null);
 			}
 		};
-	}), C = Qt(!!g), R = null !== I ? "grabbing" : "move";
+	}), C = ln(!!g), R = null !== I ? "grabbing" : "move";
 	if (!t) return null;
 	const M = { onPointerDown: (e) => {
 		if (C(e)) {
 			const n = ((e) => {
 				const n = h?.getPanePointFromPointer(e.clientX, e.clientY), o = h?.getBoundsFromRange(t);
 				if (!n || !o) return null;
-				const r = Math.abs(n.y - o.y), l = Math.abs(n.y - (o.y + o.height)), i = Math.abs(n.x - o.x), s = Math.abs(n.x - (o.x + o.width)), a = Math.min(r, l, i, s);
-				return a === r ? "top" : a === l ? "bottom" : a === i ? "left" : "right";
+				const r = Math.abs(n.y - o.y), l = Math.abs(n.y - (o.y + o.height)), i = Math.abs(n.x - o.x), a = Math.abs(n.x - (o.x + o.width)), s = Math.min(r, l, i, a);
+				return s === r ? "top" : s === l ? "bottom" : s === i ? "left" : "right";
 			})(e);
 			n && g(t, n, e);
 			return;
@@ -2422,7 +2482,7 @@ var tn = {
 		height: D.height + 2 * k
 	} : void 0;
 	return v(w, { children: [
-		x(lt, "entire" === o ? {
+		x(it, "entire" === o ? {
 			ref: m,
 			...T ? { bounds: T } : { range: t },
 			style: { cursor: R },
@@ -2451,21 +2511,21 @@ var tn = {
 		y && d?.(y)
 	] });
 };
-ln.displayName = "Draggable";
-var sn = (e, t, n, o) => {
-	const r = e.rowEnd - e.rowStart, l = e.colEnd - e.colStart, i = ge(e.rowStart + t, o.rowStart, o.rowEnd - r), s = ge(e.colStart + n, o.colStart, o.colEnd - l);
+gn.displayName = "Draggable";
+var hn = (e, t, n, o) => {
+	const r = e.rowEnd - e.rowStart, l = e.colEnd - e.colStart, i = he(e.rowStart + t, o.rowStart, o.rowEnd - r), a = he(e.colStart + n, o.colStart, o.colEnd - l);
 	return {
 		rowStart: i,
-		colStart: s,
+		colStart: a,
 		rowEnd: i + r,
-		colEnd: s + l
+		colEnd: a + l
 	};
-}, an = [
+}, fn = [
 	"tl",
 	"tr",
 	"br",
 	"bl"
-], cn = [
+], pn = [
 	"tl",
 	"t",
 	"tr",
@@ -2474,25 +2534,25 @@ var sn = (e, t, n, o) => {
 	"b",
 	"bl",
 	"l"
-], dn = (e) => {
-	const { range: t, anchors: n = cn, onDragStart: o, onDragMove: r, onDragEnd: l, onDragCancel: i, onHandleHoverChange: s, size: a = 8, renderHandle: c, preserveFocus: d, ...u } = e, g = {
-		..._t,
+], mn = (e) => {
+	const { range: t, anchors: n = pn, onDragStart: o, onDragMove: r, onDragEnd: l, onDragCancel: i, onHandleHoverChange: a, size: s = 8, renderHandle: c, preserveFocus: d, ...u } = e, g = {
+		...Xt,
 		...u
-	}, h = g.stroke ?? "rgb(33, 115, 70)", m = qe(), [y, b] = p(null), S = f(null);
+	}, h = g.stroke ?? "rgb(33, 115, 70)", m = Ze(), [y, b] = p(null), S = f(null);
 	if (!t) return null;
 	const E = y ?? t;
-	return v(w, { children: [x(Wt, {
+	return v(w, { children: [x(Yt, {
 		range: E,
 		...g
-	}), n.map((e) => x(en, {
+	}), n.map((e) => x(an, {
 		range: E,
 		anchor: e,
-		size: a,
+		size: s,
 		animatedTransition: g.animatedTransition,
 		dragCursor: "grabbing",
 		renderHandle: c,
 		preserveFocus: d,
-		onHoverChange: s,
+		onHoverChange: a,
 		style: {
 			background: h,
 			border: "1.5px solid var(--sxl-color-base-100, white)",
@@ -2503,11 +2563,11 @@ var sn = (e, t, n, o) => {
 			S.current = t, o?.(t, n);
 		},
 		onDragMove: (n, o, l) => {
-			const i = un(S.current ?? t, e, o, m.getTotalRange());
+			const i = wn(S.current ?? t, e, o, m.getTotalRange());
 			b(i), r?.(i, l);
 		},
 		onDragEnd: (n, o, r) => {
-			const i = un(S.current ?? t, e, o, m.getTotalRange());
+			const i = wn(S.current ?? t, e, o, m.getTotalRange());
 			S.current = null, b(null), l?.(i, r);
 		},
 		onDragCancel: () => {
@@ -2515,24 +2575,24 @@ var sn = (e, t, n, o) => {
 		}
 	}, e))] });
 };
-dn.displayName = "RangeResizer";
-var un = (e, t, n, o) => {
-	let { rowStart: r, colStart: l, rowEnd: i, colEnd: s } = e;
-	return t.includes("t") && (r = ge(n.rowIndex, o.rowStart, o.rowEnd)), t.includes("b") && (i = ge(n.rowIndex, o.rowStart, o.rowEnd)), t.includes("l") && (l = ge(n.colIndex, o.colStart, o.colEnd)), t.includes("r") && (s = ge(n.colIndex, o.colStart, o.colEnd)), {
+mn.displayName = "RangeResizer";
+var wn = (e, t, n, o) => {
+	let { rowStart: r, colStart: l, rowEnd: i, colEnd: a } = e;
+	return t.includes("t") && (r = he(n.rowIndex, o.rowStart, o.rowEnd)), t.includes("b") && (i = he(n.rowIndex, o.rowStart, o.rowEnd)), t.includes("l") && (l = he(n.colIndex, o.colStart, o.colEnd)), t.includes("r") && (a = he(n.colIndex, o.colStart, o.colEnd)), {
 		rowStart: Math.min(r, i),
-		colStart: Math.min(l, s),
+		colStart: Math.min(l, a),
 		rowEnd: Math.max(r, i),
-		colEnd: Math.max(l, s)
+		colEnd: Math.max(l, a)
 	};
-}, gn = (e) => {
-	const { range: t, snapDestination: n, onDragStart: o, onDragMove: r, onDragEnd: l, onDragDone: i, onDoubleClick: s, renderHandle: a, ...c } = e, d = {
-		..._t,
+}, xn = (e) => {
+	const { range: t, snapDestination: n, onDragStart: o, onDragMove: r, onDragEnd: l, onDragDone: i, onDoubleClick: a, renderHandle: s, ...c } = e, d = {
+		...Xt,
 		fill: void 0,
 		...c
 	}, u = d.stroke, g = {
 		...d,
 		strokeDasharray: "3 2"
-	}, h = qe(), p = f(null), [m, y] = Je("range-fill", null);
+	}, h = Ze(), p = f(null), [m, y] = Qe("range-fill", null);
 	if (!t) return null;
 	const b = h.getTotalRange(), S = t.rowStart === b.rowStart && t.rowEnd === b.rowEnd, E = t.colStart === b.colStart && t.colEnd === b.colEnd;
 	if (S && E) return null;
@@ -2540,16 +2600,16 @@ var un = (e, t, n, o) => {
 	return D && !((e, t, n, o) => {
 		const r = e.getAllPanes();
 		if (Object.keys(r).length <= 1) return !0;
-		const l = e.getAnchor(), i = !!r[_.TopLeft], s = !!r[_.Top], a = !!r[_.Left], c = e.getVisibleRange();
+		const l = e.getAnchor(), i = !!r[_.TopLeft], a = !!r[_.Top], s = !!r[_.Left], c = e.getVisibleRange();
 		if (o) {
-			if (l === _.Top && i || l === _.Center && a || !U.isCellWithinRange({
+			if (l === _.Top && i || l === _.Center && s || !U.isCellWithinRange({
 				colIndex: t.colStart,
 				rowIndex: t.rowEnd
 			}, c) && !U.isCellWithinRange({
 				colIndex: t.colStart,
 				rowIndex: t.rowEnd + 1
 			}, c)) return !1;
-		} else if (n && (l === _.Left && i || l === _.Center && s || !U.isCellWithinRange({
+		} else if (n && (l === _.Left && i || l === _.Center && a || !U.isCellWithinRange({
 			colIndex: t.colEnd,
 			rowIndex: t.rowStart
 		}, c) && !U.isCellWithinRange({
@@ -2557,21 +2617,21 @@ var un = (e, t, n, o) => {
 			rowIndex: t.rowStart
 		}, c))) return !1;
 		return !0;
-	})(h, t, S, E) ? null : v(w, { children: [x(en, {
+	})(h, t, S, E) ? null : v(w, { children: [x(an, {
 		range: t,
 		anchor: k,
 		clampToView: D,
 		cursor: "crosshair",
 		background: u,
-		renderHandle: a,
-		onDoubleClick: s ? (e) => s(t, e) : void 0,
+		renderHandle: s,
+		onDoubleClick: a ? (e) => a(t, e) : void 0,
 		onDragStart: (e, n) => {
 			p.current = null, y(null), o?.(t, n);
 		},
 		onDragMove: (e, o, l) => {
 			let i = ((e, t, n) => {
-				const o = t.rowIndex - e.rowEnd, r = e.rowStart - t.rowIndex, l = t.colIndex - e.colEnd, i = e.colStart - t.colIndex, s = Math.max(o, r, 0), a = Math.max(l, i, 0);
-				return 0 === s && 0 === a ? null : s >= a ? o > 0 ? {
+				const o = t.rowIndex - e.rowEnd, r = e.rowStart - t.rowIndex, l = t.colIndex - e.colEnd, i = e.colStart - t.colIndex, a = Math.max(o, r, 0), s = Math.max(l, i, 0);
+				return 0 === a && 0 === s ? null : a >= s ? o > 0 ? {
 					...e,
 					rowEnd: Math.min(n.rowEnd, t.rowIndex)
 				} : {
@@ -2594,46 +2654,46 @@ var un = (e, t, n, o) => {
 		onDragCancel: () => {
 			p.current = null, y(null), i?.();
 		}
-	}), m && x(Wt, {
+	}), m && x(Yt, {
 		range: m,
 		...g
 	})] });
 };
-gn.displayName = "FillHandle";
-var hn = i((e) => {
-	const { value: t, pane: n, bounds: o, cell: r, range: l, children: i, className: s, ...a } = e;
+xn.displayName = "FillHandle";
+var vn = i((e) => {
+	const { value: t, pane: n, bounds: o, cell: r, range: l, children: i, className: a, ...s } = e;
 	return x("div", {
-		className: V(s, "cell"),
-		...a,
+		className: V(a, "cell"),
+		...s,
 		children: t
 	});
-}), fn = Object.freeze({
+}), yn = Object.freeze({
 	cells: [],
 	rangesH: [],
 	rangesV: []
-}), pn = !1, mn = /* @__PURE__ */ new WeakMap(), wn = (e, t = {}) => {
-	const n = e.getVisibleRange(), o = e.getScrollTopLeft(), r = t.bufferRange, l = !!r, i = r ? r.rowStart : 0, s = r ? r.colStart : 0, a = r ? r.rowEnd : 0, c = r ? r.colEnd : 0, d = mn.get(e);
-	if (d && d.rowStart === n.rowStart && d.colStart === n.colStart && d.rowEnd === n.rowEnd && d.colEnd === n.colEnd && d.scrollLeft === o.left && d.scrollTop === o.top && d.hasBuffer === l && d.bRowStart === i && d.bColStart === s && d.bRowEnd === a && d.bColEnd === c && d.options.cacheToken === t.cacheToken && d.options.getVisibleCells === t.getVisibleCells && d.options.hiddenCellAt === t.hiddenCellAt) return d.model;
+}), bn = !1, Sn = /* @__PURE__ */ new WeakMap(), En = (e, t = {}) => {
+	const n = e.getVisibleRange(), o = e.getScrollTopLeft(), r = t.bufferRange, l = !!r, i = r ? r.rowStart : 0, a = r ? r.colStart : 0, s = r ? r.rowEnd : 0, c = r ? r.colEnd : 0, d = Sn.get(e);
+	if (d && d.rowStart === n.rowStart && d.colStart === n.colStart && d.rowEnd === n.rowEnd && d.colEnd === n.colEnd && d.scrollLeft === o.left && d.scrollTop === o.top && d.hasBuffer === l && d.bRowStart === i && d.bColStart === a && d.bRowEnd === s && d.bColEnd === c && d.options.cacheToken === t.cacheToken && d.options.getVisibleCells === t.getVisibleCells && d.options.hiddenCellAt === t.hiddenCellAt) return d.model;
 	const u = ((e, t = {}) => {
 		const { getVisibleCells: n, hiddenCellAt: o, bufferRange: r } = t, l = e.getTotalRange(), i = r ? {
 			rowStart: Math.max(r.rowStart, l.rowStart),
 			rowEnd: Math.min(r.rowEnd, l.rowEnd),
 			colStart: Math.max(r.colStart, l.colStart),
 			colEnd: Math.min(r.colEnd, l.colEnd)
-		} : null, s = i ? e.getVisibleColumns(i.colStart, i.colEnd) : e.getVisibleColumns(), a = i ? e.getVisibleRows(i.rowStart, i.rowEnd) : e.getVisibleRows();
-		if (0 === s.length || 0 === a.length) return fn;
+		} : null, a = i ? e.getVisibleColumns(i.colStart, i.colEnd) : e.getVisibleColumns(), s = i ? e.getVisibleRows(i.rowStart, i.rowEnd) : e.getVisibleRows();
+		if (0 === a.length || 0 === s.length) return yn;
 		const c = (t) => e.getRangeFromCell(t);
 		let d;
 		if (n) d = n(e, r);
 		else {
 			d = [];
-			const e = a.length, t = s.length;
+			const e = s.length, t = a.length;
 			for (let n = 0; n < e; n++) {
-				const e = a[n].index;
+				const e = s[n].index;
 				for (let n = 0; n < t; n++) {
 					const t = {
 						rowIndex: e,
-						colIndex: s[n].index
+						colIndex: a[n].index
 					}, r = c(t);
 					U.isSingleCell(r) && o?.(t) || d.push({
 						cell: t,
@@ -2643,7 +2703,7 @@ var hn = i((e) => {
 			}
 		}
 		const u = d ? d.length : 0;
-		if (0 === u) return fn;
+		if (0 === u) return yn;
 		const g = e.getVisibleRange(), h = r ?? g, f = [], p = [], m = [], w = /* @__PURE__ */ new Set();
 		for (let t = 0; t < u; t++) {
 			const n = d[t];
@@ -2658,31 +2718,31 @@ var hn = i((e) => {
 			if (!U.isRangesIntersect(l, h) && !U.isRangeWithinRange(l, h)) continue;
 			const i = l && !U.isSingleCell(l);
 			if (!i && o?.(r)) continue;
-			let s = null;
+			let a = null;
 			if (i) {
 				const t = c(r);
 				U.isSingleCell(t) || r.rowIndex === t.rowStart && r.colIndex === t.colStart || (r = {
 					rowIndex: t.rowStart,
 					colIndex: t.colStart
 				});
-				const n = bn(l.rowStart, l.colStart);
+				const n = Mn(l.rowStart, l.colStart);
 				if (w.has(n)) continue;
-				w.add(n), l.rowEnd - l.rowStart > 0 && p.push(l), l.colEnd - l.colStart > 0 && m.push(l), s = e.getBoundsFromRange(l);
+				w.add(n), l.rowEnd - l.rowStart > 0 && p.push(l), l.colEnd - l.colStart > 0 && m.push(l), a = e.getBoundsFromRange(l);
 			} else {
 				const t = e.getRowSize(r.rowIndex), n = e.getColumnSize(r.colIndex);
-				t && n && (s = {
+				t && n && (a = {
 					x: n.offset,
 					y: t.offset,
 					width: n.size,
 					height: t.size
 				});
 			}
-			s || (s = e.getBoundsFromRange(l)), s ? f.push({
+			a || (a = e.getBoundsFromRange(l)), a ? f.push({
 				cell: r,
 				range: l,
-				bounds: s,
+				bounds: a,
 				value: n?.value
-			}) : pn || (pn = !0, console.warn("grid-react: no bounds for cell", bn(l.rowStart, l.colStart)));
+			}) : bn || (bn = !0, console.warn("grid-react: no bounds for cell", Mn(l.rowStart, l.colStart)));
 		}
 		return {
 			cells: f,
@@ -2690,7 +2750,7 @@ var hn = i((e) => {
 			rangesV: m
 		};
 	})(e, t);
-	return mn.set(e, {
+	return Sn.set(e, {
 		rowStart: n.rowStart,
 		colStart: n.colStart,
 		rowEnd: n.rowEnd,
@@ -2699,47 +2759,47 @@ var hn = i((e) => {
 		scrollTop: o.top,
 		hasBuffer: l,
 		bRowStart: i,
-		bColStart: s,
-		bRowEnd: a,
+		bColStart: a,
+		bRowEnd: s,
 		bColEnd: c,
 		options: t,
 		model: u
 	}), u;
-}, xn = Object.freeze({
+}, In = Object.freeze({
 	rangesH: [],
 	rangesV: []
-}), vn = /* @__PURE__ */ new WeakMap(), yn = (e, t = {}) => {
-	const n = e.getVisibleRange(), o = vn.get(e);
+}), Cn = /* @__PURE__ */ new WeakMap(), Rn = (e, t = {}) => {
+	const n = e.getVisibleRange(), o = Cn.get(e);
 	if (o && o.rowStart === n.rowStart && o.colStart === n.colStart && o.rowEnd === n.rowEnd && o.colEnd === n.colEnd && o.cacheToken === t.cacheToken && o.getVisibleCells === t.getVisibleCells) return o.ranges;
 	const r = ((e, t = {}) => {
-		const { getVisibleCells: n } = t, o = e.getVisibleRange(), r = [], l = [], i = /* @__PURE__ */ new Set(), s = (e) => {
+		const { getVisibleCells: n } = t, o = e.getVisibleRange(), r = [], l = [], i = /* @__PURE__ */ new Set(), a = (e) => {
 			if (U.isSingleCell(e)) return;
 			if (!U.isRangesIntersect(e, o) && !U.isRangeWithinRange(e, o)) return;
-			const t = bn(e.rowStart, e.colStart);
+			const t = Mn(e.rowStart, e.colStart);
 			i.has(t) || (i.add(t), e.rowEnd - e.rowStart > 0 && r.push(e), e.colEnd - e.colStart > 0 && l.push(e));
 		};
 		if (n) {
 			const t = n(e), o = t ? t.length : 0;
 			for (let e = 0; e < o; e++) {
 				const n = t[e]?.range;
-				n && s(n);
+				n && a(n);
 			}
 		} else {
 			const t = e.getVisibleColumns(), n = e.getVisibleRows(), o = n.length, r = t.length;
 			for (let l = 0; l < o; l++) {
 				const o = n[l].index;
-				for (let n = 0; n < r; n++) s(e.getRangeFromCell({
+				for (let n = 0; n < r; n++) a(e.getRangeFromCell({
 					rowIndex: o,
 					colIndex: t[n].index
 				}));
 			}
 		}
-		return 0 === r.length && 0 === l.length ? xn : {
+		return 0 === r.length && 0 === l.length ? In : {
 			rangesH: r,
 			rangesV: l
 		};
 	})(e, t);
-	return vn.set(e, {
+	return Cn.set(e, {
 		rowStart: n.rowStart,
 		colStart: n.colStart,
 		rowEnd: n.rowEnd,
@@ -2748,11 +2808,11 @@ var hn = i((e) => {
 		cacheToken: t.cacheToken,
 		ranges: r
 	}), r;
-}, bn = (e, t) => `${e}:${t}`, Sn = {
+}, Mn = (e, t) => `${e}:${t}`, Pn = {
 	tiles: "_tiles_ikr1b_7",
 	gridlines: "_gridlines_ikr1b_26"
-}, En = i((e) => {
-	const { renderCell: t, cacheToken: n, getVisibleCells: o, hiddenCellAt: r, suppressCell: l, className: i, style: s } = e, a = qe(), c = a.getAnchor(), u = d(), h = g(() => `sxl-cl-${u.replace(/[^a-zA-Z0-9_-]/g, "")}`, [u]), p = f({
+}, kn = i((e) => {
+	const { renderCell: t, cacheToken: n, getVisibleCells: o, hiddenCellAt: r, suppressCell: l, className: i, style: a } = e, s = Ze(), c = s.getAnchor(), u = d(), h = g(() => `sxl-cl-${u.replace(/[^a-zA-Z0-9_-]/g, "")}`, [u]), p = f({
 		token: void 0,
 		renderCell: void 0,
 		getVisibleCells: void 0,
@@ -2761,43 +2821,43 @@ var hn = i((e) => {
 		rebaseLeft: 0,
 		rebaseTop: 0,
 		map: /* @__PURE__ */ new Map()
-	}), m = a.getScrollTopLeft(), y = a.getFreezeTopLeft(), b = m.left + y.left, S = m.top + y.top, E = Math.floor(b / Rn) * Rn, I = Math.floor(S / Rn) * Rn, C = a.getVisibleRange();
+	}), m = s.getScrollTopLeft(), y = s.getFreezeTopLeft(), b = m.left + y.left, S = m.top + y.top, E = Math.floor(b / On) * On, I = Math.floor(S / On) * On, C = s.getVisibleRange();
 	let R = 0, M = -1, P = 0, k = -1;
-	C && (R = Math.max(0, Math.floor(C.rowStart / Cn) - Mn), M = Math.floor(C.rowEnd / Cn) + Mn, P = Math.max(0, Math.floor(C.colStart / Cn) - Mn), k = Math.floor(C.colEnd / Cn) + Mn);
+	C && (R = Math.max(0, Math.floor(C.rowStart / Tn) - zn), M = Math.floor(C.rowEnd / Tn) + zn, P = Math.max(0, Math.floor(C.colStart / Tn) - zn), k = Math.floor(C.colEnd / Tn) + zn);
 	const D = g(() => {
 		if (!C || M < R) return null;
 		const e = p.current;
-		e.token === n && e.pane === a && e.renderCell === t && e.getVisibleCells === o && e.hiddenCellAt === r && e.rebaseLeft === E && e.rebaseTop === I || (e.map = /* @__PURE__ */ new Map(), e.token = n, e.pane = a, e.renderCell = t, e.getVisibleCells = o, e.hiddenCellAt = r, e.rebaseLeft = E, e.rebaseTop = I);
-		const l = e.map, i = a.getTotalRange(), s = {
-			rowStart: Math.max(i.rowStart, R * Cn),
-			colStart: Math.max(i.colStart, P * Cn),
-			rowEnd: Math.min(i.rowEnd, (M + 1) * Cn - 1),
-			colEnd: Math.min(i.colEnd, (k + 1) * Cn - 1)
-		}, { cells: d } = wn(a, {
+		e.token === n && e.pane === s && e.renderCell === t && e.getVisibleCells === o && e.hiddenCellAt === r && e.rebaseLeft === E && e.rebaseTop === I || (e.map = /* @__PURE__ */ new Map(), e.token = n, e.pane = s, e.renderCell = t, e.getVisibleCells = o, e.hiddenCellAt = r, e.rebaseLeft = E, e.rebaseTop = I);
+		const l = e.map, i = s.getTotalRange(), a = {
+			rowStart: Math.max(i.rowStart, R * Tn),
+			colStart: Math.max(i.colStart, P * Tn),
+			rowEnd: Math.min(i.rowEnd, (M + 1) * Tn - 1),
+			colEnd: Math.min(i.colEnd, (k + 1) * Tn - 1)
+		}, { cells: d } = En(s, {
 			getVisibleCells: o,
 			hiddenCellAt: r,
-			bufferRange: s,
+			bufferRange: a,
 			cacheToken: n
 		}), u = /* @__PURE__ */ new Map();
 		for (let e = 0; e < d.length; e++) {
-			const t = d[e], n = `${Math.floor(t.cell.rowIndex / Cn)}:${Math.floor(t.cell.colIndex / Cn)}`;
+			const t = d[e], n = `${Math.floor(t.cell.rowIndex / Tn)}:${Math.floor(t.cell.colIndex / Tn)}`;
 			let o = u.get(n);
 			o || (o = [], u.set(n, o)), o.push(t);
 		}
 		const g = [], h = (e, n) => {
-			if (e * Cn > i.rowEnd || n * Cn > i.colEnd) return;
+			if (e * Tn > i.rowEnd || n * Tn > i.colEnd) return;
 			const o = e >= R && e <= M && n >= P && n <= k, r = `${e}:${n}`;
-			let s = l.get(r);
-			if (void 0 === s) {
+			let a = l.get(r);
+			if (void 0 === a) {
 				const d = u.get(r);
-				if (!d && !kn) return;
-				const g = a.getBoundsFromRange({
-					rowStart: e * Cn,
-					colStart: n * Cn,
-					rowEnd: Math.min(i.rowEnd, e * Cn + Cn - 1),
-					colEnd: Math.min(i.colEnd, n * Cn + Cn - 1)
+				if (!d && !Ln) return;
+				const g = s.getBoundsFromRange({
+					rowStart: e * Tn,
+					colStart: n * Tn,
+					rowEnd: Math.min(i.rowEnd, e * Tn + Tn - 1),
+					colEnd: Math.min(i.colEnd, n * Tn + Tn - 1)
 				}), h = b + g.x - E, f = S + g.y - I, p = [];
-				if (kn && p.push(x("div", { style: {
+				if (Ln && p.push(x("div", { style: {
 					position: "absolute",
 					left: 0,
 					top: 0,
@@ -2808,13 +2868,13 @@ var hn = i((e) => {
 				} }, "__bg")), d) for (let e = 0; e < d.length; e++) {
 					const { cell: n, range: o, bounds: r, value: l } = d[e];
 					r && p.push(t({
-						key: `pane:${c}:cell:${bn(n.rowIndex, n.colIndex)}`,
+						key: `pane:${c}:cell:${Mn(n.rowIndex, n.colIndex)}`,
 						cell: n,
 						bounds: r,
 						range: o,
-						pane: a,
+						pane: s,
 						value: l,
-						"data-rc": bn(n.rowIndex, n.colIndex),
+						"data-rc": Mn(n.rowIndex, n.colIndex),
 						style: {
 							left: r.x - g.x,
 							top: r.y - g.y,
@@ -2823,19 +2883,19 @@ var hn = i((e) => {
 						}
 					}));
 				}
-				if (s = x("div", {
+				if (a = x("div", {
 					className: "tile",
 					style: { transform: `translate(${h}px, ${f}px)` },
 					children: p
-				}, `pane:${c}:tile:${e}:${n}`), o && (l.set(r, s), l.size > Pn)) {
+				}, `pane:${c}:tile:${e}:${n}`), o && (l.set(r, a), l.size > $n)) {
 					const e = l.keys().next().value;
 					void 0 !== e && l.delete(e);
 				}
 			}
-			s && g.push(s);
+			a && g.push(a);
 		};
-		if (kn) {
-			for (let e = R; e <= M && !(e * Cn > i.rowEnd); e++) for (let t = P; t <= k && !(t * Cn > i.colEnd); t++) h(e, t);
+		if (Ln) {
+			for (let e = R; e <= M && !(e * Tn > i.rowEnd); e++) for (let t = P; t <= k && !(t * Tn > i.colEnd); t++) h(e, t);
 			for (const e of u.keys()) {
 				const t = e.indexOf(":"), n = Number(e.slice(0, t)), o = Number(e.slice(t + 1));
 				(n < R || n > M || o < P || o > k) && h(n, o);
@@ -2851,60 +2911,60 @@ var hn = i((e) => {
 		t,
 		o,
 		r,
-		a,
+		s,
 		c,
 		E,
 		I
 	]);
-	return v(w, { children: [x(lt, {
+	return v(w, { children: [x(it, {
 		fill: !0,
-		className: V(Sn.tiles, h, i),
+		className: V(Pn.tiles, h, i),
 		style: {
 			pointerEvents: "none",
-			...s,
+			...a,
 			transform: `translate3d(${E - b}px, ${I - S}px, 0)`,
 			willChange: "transform"
 		},
 		children: D
-	}), l ? x("style", { children: `.${h} [data-rc="${bn(l.rowIndex, l.colIndex)}"]{visibility:hidden !important;}` }) : null] });
+	}), l ? x("style", { children: `.${h} [data-rc="${Mn(l.rowIndex, l.colIndex)}"]{visibility:hidden !important;}` }) : null] });
 });
-En.displayName = "CellTileDiv";
-var In = i((e) => {
-	const { renderCell: t, cacheToken: n, getVisibleCells: o, hiddenCellAt: r, suppressCell: l, className: i, style: s, ...a } = e;
-	return x(et, {
+kn.displayName = "CellTileDiv";
+var Dn = i((e) => {
+	const { renderCell: t, cacheToken: n, getVisibleCells: o, hiddenCellAt: r, suppressCell: l, className: i, style: a, ...s } = e;
+	return x(tt, {
 		className: V(i, "tiles"),
-		...a,
-		children: x(En, {
+		...s,
+		children: x(kn, {
 			renderCell: t,
 			cacheToken: n,
 			getVisibleCells: o,
 			hiddenCellAt: r,
 			suppressCell: l,
-			style: s
+			style: a
 		})
 	});
 });
-In.displayName = "CellLayer";
-var Cn = 8, Rn = 1 << 19, Mn = 1, Pn = 512, kn = !1, Dn = (e, t, n) => {
-	const o = S.getDevicePixelRatio(), r = $n / o, l = e.getVisibleRange(), i = (t) => e.getColumnSize(t).offset, s = (t) => {
+Dn.displayName = "CellLayer";
+var Tn = 8, On = 1 << 19, zn = 1, $n = 512, Ln = !1, Bn = (e, t, n) => {
+	const o = S.getDevicePixelRatio(), r = Vn / o, l = e.getVisibleRange(), i = (t) => e.getColumnSize(t).offset, a = (t) => {
 		const n = e.getColumnSize(t);
 		return n.offset + n.size;
-	}, a = (t) => e.getRowSize(t).offset, c = (t) => {
+	}, s = (t) => e.getRowSize(t).offset, c = (t) => {
 		const n = e.getRowSize(t);
 		return n.offset + n.size;
 	}, d = [], u = [];
 	let g = !1, h = "";
 	if (t) {
-		const t = e.getVisibleRows(), a = t ? t.length : 0;
-		if (0 === a) return h;
-		const f = [...n].sort(U.rowFirstRangeComparator), p = S.snapDeviceEdge(0, o), m = Math.min(e.getPaneBounds().width, s(l.colEnd)), w = S.snapDeviceEdge(m, o);
-		for (let e = 0; e < a && t[e].index <= l.rowEnd; e++) {
-			const n = t[e], a = n.index;
-			if (a < l.rowStart) continue;
+		const t = e.getVisibleRows(), s = t ? t.length : 0;
+		if (0 === s) return h;
+		const f = [...n].sort(U.rowFirstRangeComparator), p = S.snapDeviceEdge(0, o), m = Math.min(e.getPaneBounds().width, a(l.colEnd)), w = S.snapDeviceEdge(m, o);
+		for (let e = 0; e < s && t[e].index <= l.rowEnd; e++) {
+			const n = t[e], s = n.index;
+			if (s < l.rowStart) continue;
 			const x = n.offset + n.size;
 			for (let e = d.length - 1; e >= 0; e--) c(d[e].rowEnd) <= x && (d.splice(e, 1), g = !1);
 			let v = !1;
-			for (; f.length > 0 && f[0].rowStart <= a;) {
+			for (; f.length > 0 && f[0].rowStart <= s;) {
 				const e = f.shift();
 				c(e.rowEnd) > x && (d.push(e), v = !0, g = !1);
 			}
@@ -2912,7 +2972,7 @@ var Cn = 8, Rn = 1 << 19, Mn = 1, Pn = 512, kn = !1, Dn = (e, t, n) => {
 				u.length = 0;
 				for (let e = 0; e < d.length; e++) {
 					const t = d[e];
-					u.push(S.snapDeviceEdge(Math.min(m, i(t.colStart)), o), S.snapDeviceEdge(Math.min(m, s(t.colEnd)), o));
+					u.push(S.snapDeviceEdge(Math.min(m, i(t.colStart)), o), S.snapDeviceEdge(Math.min(m, a(t.colEnd)), o));
 				}
 				g = !0;
 			}
@@ -2933,17 +2993,17 @@ var Cn = 8, Rn = 1 << 19, Mn = 1, Pn = 512, kn = !1, Dn = (e, t, n) => {
 			const n = t[e], i = n.index;
 			if (i < l.colStart) continue;
 			const x = n.offset + n.size;
-			for (let e = d.length - 1; e >= 0; e--) s(d[e].colEnd) <= x && (d.splice(e, 1), g = !1);
+			for (let e = d.length - 1; e >= 0; e--) a(d[e].colEnd) <= x && (d.splice(e, 1), g = !1);
 			let v = !1;
 			for (; f.length > 0 && f[0].colStart <= i;) {
 				const e = f.shift();
-				s(e.colEnd) > x && (d.push(e), v = !0, g = !1);
+				a(e.colEnd) > x && (d.push(e), v = !0, g = !1);
 			}
 			if (v && d.sort(U.rowFirstRangeComparator), !g) {
 				u.length = 0;
 				for (let e = 0; e < d.length; e++) {
 					const t = d[e];
-					u.push(S.snapDeviceEdge(Math.min(m, a(t.rowStart)), o), S.snapDeviceEdge(Math.min(m, c(t.rowEnd)), o));
+					u.push(S.snapDeviceEdge(Math.min(m, s(t.rowStart)), o), S.snapDeviceEdge(Math.min(m, c(t.rowEnd)), o));
 				}
 				g = !0;
 			}
@@ -2958,60 +3018,60 @@ var Cn = 8, Rn = 1 << 19, Mn = 1, Pn = 512, kn = !1, Dn = (e, t, n) => {
 		}
 	}
 	return h;
-}, Tn = (e) => {
+}, An = (e) => {
 	let t = "";
 	for (let n = 0; n < e.length; n++) {
 		const o = e[n];
 		t += `${o.rowStart},${o.colStart},${o.rowEnd},${o.colEnd};`;
 	}
 	return t;
-}, zn = (e, t, n, o, r) => {
+}, Nn = (e, t, n, o, r) => {
 	if (!n) return null;
-	const l = e.getPaneBounds(), i = Math.ceil(l.width), s = Math.ceil(l.height), a = String($n / S.getDevicePixelRatio());
+	const l = e.getPaneBounds(), i = Math.ceil(l.width), a = Math.ceil(l.height), s = String(Vn / S.getDevicePixelRatio());
 	return x("svg", {
 		className: V(t ? "horizontal" : "vertical"),
 		width: `${i}`,
-		height: `${s}`,
-		viewBox: `0 0 ${i} ${s}`,
+		height: `${a}`,
+		viewBox: `0 0 ${i} ${a}`,
 		preserveAspectRatio: "none",
 		children: x("path", {
 			d: n,
 			fill: "none",
 			stroke: o,
-			strokeWidth: a,
+			strokeWidth: s,
 			vectorEffect: "non-scaling-stroke",
 			...r
 		})
 	});
-}, On = i((e) => {
-	const { showGridLines: t = !0, gridLineColor: n = "var(--sxl-color-base-300, rgb(224, 224, 224))", propsRows: o, propsColumns: r, getVisibleCells: l, hiddenCellAt: i, cacheToken: s, bufferRange: a, className: c, style: d, ...u } = e, h = qe(), f = t, p = !0 === t || !0 === f?.horizontal, m = !0 === t || !0 === f?.vertical, { rangesH: w, rangesV: y } = yn(h, {
+}, Fn = i((e) => {
+	const { showGridLines: t = !0, gridLineColor: n = "var(--sxl-color-base-300, rgb(224, 224, 224))", propsRows: o, propsColumns: r, getVisibleCells: l, hiddenCellAt: i, cacheToken: a, bufferRange: s, className: c, style: d, ...u } = e, h = Ze(), f = t, p = !0 === t || !0 === f?.horizontal, m = !0 === t || !0 === f?.vertical, { rangesH: w, rangesV: y } = Rn(h, {
 		getVisibleCells: l,
-		cacheToken: s
-	}), b = S.getDevicePixelRatio(), { top: E, left: I } = h.getScrollTopLeft(), C = h.getPaneBounds(), R = h.getVisibleRange(), M = h.getColumnSize(R.colEnd), P = h.getRowSize(R.rowEnd), k = Math.min(C.width, M ? M.offset + M.size : C.width), D = Math.min(C.height, P ? P.offset + P.size : C.height), T = 0 === w.length ? `${E}|${k}|${b}` : `${E}|${I}|${k}|${b}|${Tn(w)}`, z = 0 === y.length ? `${I}|${D}|${b}` : `${I}|${E}|${D}|${b}|${Tn(y)}`, O = g(() => p ? Dn(h, !0, w) : null, [
+		cacheToken: a
+	}), b = S.getDevicePixelRatio(), { top: E, left: I } = h.getScrollTopLeft(), C = h.getPaneBounds(), R = h.getVisibleRange(), M = h.getColumnSize(R.colEnd), P = h.getRowSize(R.rowEnd), k = Math.min(C.width, M ? M.offset + M.size : C.width), D = Math.min(C.height, P ? P.offset + P.size : C.height), T = 0 === w.length ? `${E}|${k}|${b}` : `${E}|${I}|${k}|${b}|${An(w)}`, O = 0 === y.length ? `${I}|${D}|${b}` : `${I}|${E}|${D}|${b}|${An(y)}`, z = g(() => p ? Bn(h, !0, w) : null, [
 		h,
 		p,
 		T
-	]), $ = g(() => m ? Dn(h, !1, y) : null, [
+	]), $ = g(() => m ? Bn(h, !1, y) : null, [
 		h,
 		m,
-		z
+		O
 	]);
-	return p || m ? x(et, {
+	return p || m ? x(tt, {
 		...u,
 		className: V(c, "gridlines"),
-		children: v(lt, {
+		children: v(it, {
 			fill: !0,
-			className: Sn.gridlines,
+			className: Pn.gridlines,
 			style: {
 				pointerEvents: "none",
 				...d
 			},
-			children: [p && O ? zn(h, !0, O, n, o) : null, m && $ ? zn(h, !1, $, n, r) : null]
+			children: [p && z ? Nn(h, !0, z, n, o) : null, m && $ ? Nn(h, !1, $, n, r) : null]
 		})
 	}) : null;
 });
-On.displayName = "GridlineLayer";
-var $n = 1, Ln = -10, Bn = class {
+Fn.displayName = "GridlineLayer";
+var Vn = 1, Hn = -10, _n = class {
 	constructor(e = {}) {
 		this.listeners = /* @__PURE__ */ new Set(), this._coords = e.initial ?? {
 			cell: {
@@ -3020,7 +3080,7 @@ var $n = 1, Ln = -10, Bn = class {
 			},
 			ranges: U.EmptyRanges,
 			rangeIndex: -1
-		}, this._getBounds = e.getBounds ?? (() => Fn);
+		}, this._getBounds = e.getBounds ?? (() => Kn);
 	}
 	getSelection() {
 		return this._coords;
@@ -3029,7 +3089,7 @@ var $n = 1, Ln = -10, Bn = class {
 		U.isEqualSelectionCoords(this._coords, e) || (this._coords = e, this.listeners.forEach((e) => e()));
 	}
 	navigate(e, t = !1, n = !1, o = 1) {
-		const r = this._getBounds(), { cell: l } = this._coords, i = e === j.Down ? 1 : e === j.Up ? -1 : 0, s = e === j.Right ? 1 : e === j.Left ? -1 : 0, a = (e) => 0 === e ? 0 : n ? e > 0 ? Infinity : -Infinity : e * Math.max(1, o), c = this._activeRange(), d = t ? l.rowIndex === c.rowStart ? c.rowEnd : c.rowStart : l.rowIndex, u = t ? l.colIndex === c.colStart ? c.colEnd : c.colStart : l.colIndex, g = ge(d + a(i), r.rowStart, r.rowEnd), h = ge(u + a(s), r.colStart, r.colEnd);
+		const r = this._getBounds(), { cell: l } = this._coords, i = e === j.Down ? 1 : e === j.Up ? -1 : 0, a = e === j.Right ? 1 : e === j.Left ? -1 : 0, s = (e) => 0 === e ? 0 : n ? e > 0 ? Infinity : -Infinity : e * Math.max(1, o), c = this._activeRange(), d = t ? l.rowIndex === c.rowStart ? c.rowEnd : c.rowStart : l.rowIndex, u = t ? l.colIndex === c.colStart ? c.colEnd : c.colStart : l.colIndex, g = he(d + s(i), r.rowStart, r.rowEnd), h = he(u + s(a), r.colStart, r.colEnd);
 		if (!t) return void this.setSelection({
 			cell: {
 				rowIndex: g,
@@ -3081,20 +3141,20 @@ var $n = 1, Ln = -10, Bn = class {
 		return e >= 0 ? this._coords.ranges[e] : U.cellToRange(this._coords.cell);
 	}
 	modify(e, t = this._coords.cell) {
-		const n = this._activeRange(), r = An({
+		const n = this._activeRange(), r = Wn({
 			rowStart: Math.min(e.rowIndex ?? n.rowStart, t.rowIndex ?? n.rowStart),
 			colStart: Math.min(e.colIndex ?? n.colStart, t.colIndex ?? n.colStart),
 			rowEnd: Math.max(e.rowIndex ?? n.rowEnd, t.rowIndex ?? n.rowEnd),
 			colEnd: Math.max(e.colIndex ?? n.colEnd, t.colIndex ?? n.colEnd)
-		}, this._getBounds()), l = this._coords, i = this._activeIndex(), s = i >= 0 ? l.ranges.map((e, t) => t === i ? r : e) : [r], a = Nn(l.cell, r);
+		}, this._getBounds()), l = this._coords, i = this._activeIndex(), a = i >= 0 ? l.ranges.map((e, t) => t === i ? r : e) : [r], s = Un(l.cell, r);
 		this.setSelection({
-			cell: a,
-			ranges: s,
+			cell: s,
+			ranges: a,
 			rangeIndex: i >= 0 ? i : 0
 		});
 	}
 	append(e, t = e) {
-		const n = An({
+		const n = Wn({
 			rowStart: Math.min(e.rowIndex, t.rowIndex),
 			colStart: Math.min(e.colIndex, t.colIndex),
 			rowEnd: Math.max(e.rowIndex, t.rowIndex),
@@ -3119,7 +3179,7 @@ var $n = 1, Ln = -10, Bn = class {
 				n.push(l), -1 === o && U.isCellWithinRange(t.cell, l) && (o = n.length - 1);
 				continue;
 			}
-			const i = n.length, s = W.subtractRect({
+			const i = n.length, a = W.subtractRect({
 				top: l.rowStart,
 				left: l.colStart,
 				bottom: l.rowEnd + 1,
@@ -3130,7 +3190,7 @@ var $n = 1, Ln = -10, Bn = class {
 				bottom: e.rowEnd + 1,
 				right: e.colEnd + 1
 			});
-			for (const e of s) {
+			for (const e of a) {
 				const r = {
 					rowStart: e.top,
 					colStart: e.left,
@@ -3170,56 +3230,56 @@ var $n = 1, Ln = -10, Bn = class {
 			this.listeners.delete(e);
 		};
 	}
-}, An = (e, t) => ({
-	rowStart: ge(e.rowStart, t.rowStart, t.rowEnd),
-	colStart: ge(e.colStart, t.colStart, t.colEnd),
-	rowEnd: ge(e.rowEnd, t.rowStart, t.rowEnd),
-	colEnd: ge(e.colEnd, t.colStart, t.colEnd)
-}), Nn = (e, t) => ({
-	rowIndex: ge(e.rowIndex, t.rowStart, t.rowEnd),
-	colIndex: ge(e.colIndex, t.colStart, t.colEnd)
-}), Fn = {
+}, Wn = (e, t) => ({
+	rowStart: he(e.rowStart, t.rowStart, t.rowEnd),
+	colStart: he(e.colStart, t.colStart, t.colEnd),
+	rowEnd: he(e.rowEnd, t.rowStart, t.rowEnd),
+	colEnd: he(e.colEnd, t.colStart, t.colEnd)
+}), Un = (e, t) => ({
+	rowIndex: he(e.rowIndex, t.rowStart, t.rowEnd),
+	colIndex: he(e.colIndex, t.colStart, t.colEnd)
+}), Kn = {
 	rowStart: 0,
 	colStart: 0,
 	rowEnd: Number.MAX_SAFE_INTEGER,
 	colEnd: Number.MAX_SAFE_INTEGER
-}, Vn = "var(--sxl-color-primary, rgb(33, 115, 70))", Hn = "var(--sxl-color-base-100, rgb(255, 255, 255))", _n = "var(--sxl-color-warning, rgb(255, 0, 0))", Wn = (e) => `color-mix(in srgb, var(--sxl-color-primary, rgb(33, 115, 70)) ${e}%, transparent)`, Un = {
-	fill: { fill: Wn(10) },
+}, jn = "var(--sxl-color-primary, rgb(33, 115, 70))", Gn = "var(--sxl-color-base-100, rgb(255, 255, 255))", Xn = "var(--sxl-color-warning, rgb(255, 0, 0))", Yn = (e) => `color-mix(in srgb, var(--sxl-color-primary, rgb(33, 115, 70)) ${e}%, transparent)`, qn = {
+	fill: { fill: Yn(10) },
 	border: {
-		stroke: Vn,
+		stroke: jn,
 		alignWidth: 2,
 		style: { filter: "drop-shadow(1px 1px 0.3px var(--sxl-color-shadow, rgba(0, 0, 0, 0.24)))" }
 	},
 	inner: {
-		stroke: Hn,
+		stroke: Gn,
 		alignWidth: 2,
 		inset: 1
 	}
-}, Kn = {
-	fill: { fill: Wn(6) },
+}, Zn = {
+	fill: { fill: Yn(6) },
 	border: {
-		stroke: Vn,
+		stroke: jn,
 		alignWidth: 1
 	},
 	inner: {
-		stroke: Hn,
+		stroke: Gn,
 		alignWidth: 1,
 		inset: 1
 	}
-}, jn = {
-	stroke: Vn,
+}, Jn = {
+	stroke: jn,
 	alignWidth: 1,
 	inset: 2
-}, Gn = {
-	fill: { fill: `color-mix(in srgb, ${_n} 10%, transparent)` },
+}, Qn = {
+	fill: { fill: `color-mix(in srgb, ${Xn} 10%, transparent)` },
 	border: {
-		stroke: _n,
+		stroke: Xn,
 		alignWidth: 2
 	}
-}, Xn = (e, t) => {
-	const n = qe(), o = t?.allowDeselect ?? !0, r = t?.allowMulti ?? !0, l = f(null), [i, s] = p(null), a = f(t?.onSelectionEnd);
-	a.current = t?.onSelectionEnd;
-	const c = Zt((t, i) => {
+}, eo = (e, t) => {
+	const n = Ze(), o = t?.allowDeselect ?? !0, r = t?.allowMulti ?? !0, l = f(null), [i, a] = p(null), s = f(t?.onSelectionEnd);
+	s.current = t?.onSelectionEnd;
+	const c = on((t, i) => {
 		if ("touch" === i.pointerType) {
 			const t = n.getScrollTopLeft(), o = {
 				x: i.clientX,
@@ -3238,7 +3298,7 @@ var $n = 1, Ln = -10, Bn = class {
 							rangeIndex: -1
 						});
 					}
-					a.current?.(r);
+					s.current?.(r);
 				}
 			};
 		}
@@ -3252,7 +3312,7 @@ var $n = 1, Ln = -10, Bn = class {
 		}
 		if (0 !== i.button) return null;
 		i.stopPropagation();
-		const c = (e) => a.current?.(e), d = e.getSelection(), u = () => e.setSelection(d);
+		const c = (e) => s.current?.(e), d = e.getSelection(), u = () => e.setSelection(d);
 		if (i.shiftKey) return e.modify(t), {
 			dragMode: "extend",
 			drag: (t) => e.modify(t),
@@ -3261,7 +3321,7 @@ var $n = 1, Ln = -10, Bn = class {
 		};
 		if ((i.ctrlKey || i.metaKey) && r) {
 			const r = e.getSelection().ranges, i = !!r && r.some((e) => U.isCellWithinRange(t, e));
-			return o && i ? (l.current = U.cellToRange(t), s(l.current), {
+			return o && i ? (l.current = U.cellToRange(t), a(l.current), {
 				dragMode: "remove",
 				drag: (e) => {
 					l.current = ((e, t) => {
@@ -3272,14 +3332,14 @@ var $n = 1, Ln = -10, Bn = class {
 							rowEnd: Math.min(o.rowEnd, Math.max(e.rowIndex, t.rowIndex)),
 							colEnd: Math.min(o.colEnd, Math.max(e.colIndex, t.colIndex))
 						};
-					})(t, e), s(l.current);
+					})(t, e), a(l.current);
 				},
 				end: (t) => {
 					const n = l.current;
-					l.current = null, s(null), n && e.deselect(n), c(t);
+					l.current = null, a(null), n && e.deselect(n), c(t);
 				},
 				cancel: () => {
-					l.current = null, s(null);
+					l.current = null, a(null);
 				}
 			}) : (e.append(t), {
 				dragMode: "extend",
@@ -3306,8 +3366,8 @@ var $n = 1, Ln = -10, Bn = class {
 		removePreview: i,
 		dragMode: c.dragMode
 	};
-}, Yn = (e) => {
-	const { selection: t, color: n = "var(--sxl-color-primary, rgb(33, 115, 70))", size: o = 22 } = e, r = Ze(), i = Jn(T(t, (e) => e.getSelection())), s = r ? r.getAllPanes()[_.Center] ?? r : void 0, a = ((e, t, n) => {
+}, to = (e) => {
+	const { selection: t, color: n = "var(--sxl-color-primary, rgb(33, 115, 70))", size: o = 22 } = e, r = Je(), i = ro(T(t, (e) => e.getSelection())), a = r ? r.getAllPanes()[_.Center] ?? r : void 0, s = ((e, t, n) => {
 		const o = !!t && e.rowStart === t.rowStart && e.rowEnd === t.rowEnd, r = !!t && e.colStart === t.colStart && e.colEnd === t.colEnd;
 		if (o && r) return [];
 		if (o) {
@@ -3401,7 +3461,7 @@ var $n = 1, Ln = -10, Bn = class {
 			},
 			axis: "both"
 		}];
-	})(i, r?.getTotalRange(), s?.getVisibleRange()), [d, u] = p(!1), g = f(null);
+	})(i, r?.getTotalRange(), a?.getVisibleRange()), [d, u] = p(!1), g = f(null);
 	c(() => () => g.current?.dispose(), []);
 	const h = (e, n, o, r) => {
 		g.current?.dispose();
@@ -3414,21 +3474,21 @@ var $n = 1, Ln = -10, Bn = class {
 		} : {
 			x: !0,
 			y: !0
-		}, i = t.getSelection(), s = qt(e, () => (u(!0), {
+		}, i = t.getSelection(), a = nn(e, () => (u(!0), {
 			dragMode: "grip",
 			drag: (e) => {
 				const r = "col" === o ? { colIndex: e.colIndex } : "row" === o ? { rowIndex: e.rowIndex } : e;
 				t.modify(r, n);
 			},
-			edgeScroll: (t) => Gt(e, t, l),
+			edgeScroll: (t) => Qt(e, t, l),
 			end: () => u(!1),
 			cancel: () => {
 				t.setSelection(i), u(!1);
 			}
 		}), void 0, (t, n) => (e.getPaneFromPointer(t, n) ?? e).getCellFromPointer(t, n));
-		g.current = s, s.start(r, r.currentTarget);
+		g.current = a, a.start(r, r.currentTarget);
 	};
-	return x(w, { children: a.map((e) => x(qn, {
+	return x(w, { children: s.map((e) => x(no, {
 		spec: e,
 		size: o,
 		color: n,
@@ -3436,14 +3496,14 @@ var $n = 1, Ln = -10, Bn = class {
 		onBeginDrag: h
 	}, e.key)) });
 };
-Yn.displayName = "SelectionTouchGrips";
-var qn = (e) => {
+to.displayName = "SelectionTouchGrips";
+var no = (e) => {
 	const { spec: t, size: n, color: o, dragging: r, onBeginDrag: l } = e;
-	return x(Et, {
+	return x(It, {
 		anchor: { cell: t.cell },
 		placement: t.placement,
 		whenOff: "hide",
-		children: (e) => e.slid ? null : x(Zn, {
+		children: (e) => e.slid ? null : x(oo, {
 			state: e,
 			size: n,
 			color: o,
@@ -3454,15 +3514,15 @@ var qn = (e) => {
 			}
 		})
 	});
-}, Zn = (e) => {
-	const { state: t, size: n, color: o, dragging: r, pin: l, onBeginDrag: i } = e, { getPortalContainer: s } = $(), { className: a, attrs: c } = Rt(t.pane);
+}, oo = (e) => {
+	const { state: t, size: n, color: o, dragging: r, pin: l, onBeginDrag: i } = e, { getPortalContainer: a } = $(), { className: s, attrs: c } = Mt(t.pane);
 	let { x: d, y: u } = t.anchorPoint;
 	if (l) {
 		const e = t.pane?.getElement()?.getBoundingClientRect();
 		e && ("v" === l ? u = e.top + e.height / 2 : d = e.left + e.width / 2);
 	}
 	return Y(x("div", {
-		className: ["touch-select-grip", a].filter(Boolean).join(" "),
+		className: ["touch-select-grip", s].filter(Boolean).join(" "),
 		...c,
 		style: {
 			position: "fixed",
@@ -3485,42 +3545,42 @@ var qn = (e) => {
 		onPointerDown: (e) => {
 			0 !== e.button && "touch" !== e.pointerType || t.pane && (e.preventDefault(), e.stopPropagation(), i(e));
 		}
-	}), s());
-}, Jn = (e) => {
+	}), a());
+}, ro = (e) => {
 	const { ranges: t, rangeIndex: n, cell: o } = e;
 	if (t && t.length > 0) {
 		const e = n ?? -1;
 		return t[e >= 0 ? e : t.length - 1];
 	}
 	return U.cellToRange(o);
-}, Qn = [
+}, lo = [
 	j.Left,
 	j.Right,
 	j.Up,
 	j.Down
-], eo = {
+], io = {
 	[j.Left]: "ArrowLeft",
 	[j.Right]: "ArrowRight",
 	[j.Up]: "ArrowUp",
 	[j.Down]: "ArrowDown"
-}, to = {
+}, ao = {
 	[j.Left]: "Left",
 	[j.Right]: "Right",
 	[j.Up]: "Up",
 	[j.Down]: "Down"
 };
-var no = (e, t) => void 0 === t ? e : null === t ? null : {
+var so = (e, t) => void 0 === t ? e : null === t ? null : {
 	...e,
 	...t
-}, oo = (e, t) => t ? {
-	fill: no(e.fill, t.fill),
-	border: no(e.border, t.border),
-	inner: no(e.inner, t.inner)
-} : e, ro = {
+}, co = (e, t) => t ? {
+	fill: so(e.fill, t.fill),
+	border: so(e.border, t.border),
+	inner: so(e.inner, t.inner)
+} : e, uo = {
 	side: "b",
 	align: "end"
-}, lo = e.forwardRef((t, n) => {
-	const { selection: o, getContentBounds: r, getRegionBounds: l, scrollIntoView: i, singleStyle: s, multiStyle: a, multiAnchorStyle: c, singleAnchorStyle: d, removePreviewStyle: u, singleLayer: g, multiLayer: h, enabledMove: f, onMove: p, onMoveStart: m, onMoveUpdate: y, onMoveEnd: S, enableFill: E, snapFillDestination: I, onFill: C, onFillStart: R, onFillPreview: M, onFillEnd: P, resolveFillExtent: k, onEdgeDoubleClick: D, onSelectionEnd: z, renderTip: O, tipPlacement: $, disableKeyboard: L, anchorHole: B = !0, ...A } = t, N = T(o, (e) => e.getSelection()), F = Xn(o, { onSelectionEnd: z }), [V, H] = e.useState(null), _ = qe(), K = e.useRef(o);
+}, go = e.forwardRef((t, n) => {
+	const { selection: o, getContentBounds: r, getRegionBounds: l, scrollIntoView: i, singleStyle: a, multiStyle: s, multiAnchorStyle: c, singleAnchorStyle: d, removePreviewStyle: u, singleLayer: g, multiLayer: h, enabledMove: f, onMove: p, onMoveStart: m, onMoveUpdate: y, onMoveEnd: S, enableFill: E, snapFillDestination: I, onFill: C, onFillStart: R, onFillPreview: M, onFillEnd: P, resolveFillExtent: k, onEdgeDoubleClick: D, onSelectionEnd: O, renderTip: z, tipPlacement: $, disableKeyboard: L, anchorHole: B = !0, ...A } = t, N = T(o, (e) => e.getSelection()), F = eo(o, { onSelectionEnd: O }), [V, H] = e.useState(null), _ = Ze(), K = e.useRef(o);
 	K.current = o;
 	const X = e.useRef(_);
 	X.current = _;
@@ -3531,9 +3591,9 @@ var no = (e, t) => void 0 === t ? e : null === t ? null : {
 	const Z = e.useRef(i);
 	Z.current = i;
 	const J = e.useMemo(() => function(e) {
-		const { getSelection: t, getPane: n, getContentBounds: o, getScrollIntoView: r = () => {}, getRegionBounds: l = () => null } = e, i = () => t(), s = () => n(), a = () => s().getTotalRange(), c = o ?? a, d = (e) => l(e), u = (e) => {
+		const { getSelection: t, getPane: n, getContentBounds: o, getScrollIntoView: r = () => {}, getRegionBounds: l = () => null } = e, i = () => t(), a = () => n(), s = () => a().getTotalRange(), c = o ?? s, d = (e) => l(e), u = (e) => {
 			const t = r();
-			t ? t(e) : s().scrollCellCoordsIntoView(e);
+			t ? t(e) : a().scrollCellCoordsIntoView(e);
 		}, g = () => u(i().getSelection().cell), h = () => {
 			const e = i().getSelection();
 			return e.ranges && e.ranges.length > 0 && void 0 !== e.rangeIndex && e.rangeIndex >= 0 ? e.ranges[e.rangeIndex] : U.cellToRange(e.cell);
@@ -3541,14 +3601,14 @@ var no = (e, t) => void 0 === t ? e : null === t ? null : {
 			if (i().navigate(e, t, n), r()) return;
 			const o = i().getSelection(), l = e === j.Left || e === j.Right;
 			if (t) {
-				const t = a(), n = h(), r = o.cell.colIndex === n.colStart ? n.colEnd : n.colStart, i = o.cell.rowIndex === n.rowStart ? n.rowEnd : n.rowStart;
+				const t = s(), n = h(), r = o.cell.colIndex === n.colStart ? n.colEnd : n.colStart, i = o.cell.rowIndex === n.rowStart ? n.rowEnd : n.rowStart;
 				if (e === j.Right && r === t.colEnd || e === j.Left && r === t.colStart || e === j.Up && i === t.rowStart || e === j.Down && i === t.rowEnd) return;
 				u(l ? { colIndex: r } : { rowIndex: i });
 				return;
 			}
 			u(l ? { colIndex: o.cell.colIndex } : { rowIndex: o.cell.rowIndex });
 		}, p = (e, t) => {
-			const n = s(), o = n.getMetrics(), r = a(), l = n.getSurfaceSize(), c = n.getScrollTopLeft(), d = n.getScrollTarget?.() ?? c, u = h(), g = i().getSelection().cell, f = t ? g.rowIndex === u.rowStart ? u.rowEnd : u.rowStart : g.rowIndex, p = t ? g.colIndex === u.colStart ? u.colEnd : u.colStart : g.colIndex;
+			const n = a(), o = n.getMetrics(), r = s(), l = n.getSurfaceSize(), c = n.getScrollTopLeft(), d = n.getScrollTarget?.() ?? c, u = h(), g = i().getSelection().cell, f = t ? g.rowIndex === u.rowStart ? u.rowEnd : u.rowStart : g.rowIndex, p = t ? g.colIndex === u.colStart ? u.colEnd : u.colStart : g.colIndex;
 			let m = f, w = p, x = null;
 			switch (e) {
 				case j.Up: {
@@ -3621,8 +3681,8 @@ var no = (e, t) => void 0 === t ? e : null === t ? null : {
 				run: n
 			});
 		}, S = b.Shift, E = b.Ctrl, I = b.Alt;
-		for (const e of Qn) {
-			const t = to[e], n = eo[e];
+		for (const e of lo) {
+			const t = ao[e], n = io[e];
 			y(`move${t}`, { key: n }, () => f(e, !1)), y(`select${t}`, {
 				key: n,
 				modifiers: [S]
@@ -3667,28 +3727,28 @@ var no = (e, t) => void 0 === t ? e : null === t ? null : {
 		}, () => x(!1)), y("traverseSelectionPreviousRange", {
 			key: "ArrowLeft",
 			modifiers: [E, I]
-		}, () => x(!0)), y("moveToRowStart", { key: "Home" }, () => m({ colIndex: a().colStart }, !1)), y("moveToGridStart", {
+		}, () => x(!0)), y("moveToRowStart", { key: "Home" }, () => m({ colIndex: s().colStart }, !1)), y("moveToGridStart", {
 			key: "Home",
 			modifiers: [E]
 		}, () => m({
-			rowIndex: a().rowStart,
-			colIndex: a().colStart
+			rowIndex: s().rowStart,
+			colIndex: s().colStart
 		}, !1)), y("selectToRowStart", {
 			key: "Home",
 			modifiers: [S]
-		}, () => m({ colIndex: a().colStart }, !0)), y("selectToColumnStart", void 0, () => m({ rowIndex: a().rowStart }, !0)), y("selectToGridStart", {
+		}, () => m({ colIndex: s().colStart }, !0)), y("selectToColumnStart", void 0, () => m({ rowIndex: s().rowStart }, !0)), y("selectToGridStart", {
 			key: "Home",
 			modifiers: [E, S]
 		}, () => m({
-			rowIndex: a().rowStart,
-			colIndex: a().colStart
+			rowIndex: s().rowStart,
+			colIndex: s().colStart
 		}, !0)), y("moveToRowEnd", { key: "End" }, () => m({ colIndex: c().colEnd }, !1)), y("moveToGridEnd", {
 			key: "End",
 			modifiers: [E]
 		}, () => m({
 			rowIndex: c().rowEnd,
 			colIndex: c().colEnd
-		}, !1)), y("selectToColumnEnd", void 0, () => m({ rowIndex: a().rowEnd }, !0)), y("selectToRowEnd", {
+		}, !1)), y("selectToColumnEnd", void 0, () => m({ rowIndex: s().rowEnd }, !0)), y("selectToRowEnd", {
 			key: "End",
 			modifiers: [S]
 		}, () => m({ colIndex: c().colEnd }, !0)), y("selectToGridEnd", {
@@ -3701,13 +3761,13 @@ var no = (e, t) => void 0 === t ? e : null === t ? null : {
 			key: "Space",
 			modifiers: [E]
 		}, () => {
-			const e = d(i().getSelection().cell) ?? a();
+			const e = d(i().getSelection().cell) ?? s();
 			i().modify({ rowIndex: e.rowStart }, { rowIndex: e.rowEnd }), g();
 		}), y("selectRow", {
 			key: "Space",
 			modifiers: [S]
 		}, () => {
-			const e = d(i().getSelection().cell) ?? a();
+			const e = d(i().getSelection().cell) ?? s();
 			i().modify({ colIndex: e.colStart }, { colIndex: e.colEnd }), g();
 		}), y("scrollToActiveCoords", {
 			key: "Backspace",
@@ -3747,23 +3807,23 @@ var no = (e, t) => void 0 === t ? e : null === t ? null : {
 		getRegionBounds: (e) => q.current?.(e) ?? null
 	}), []);
 	e.useImperativeHandle(n, () => J, [J]);
-	const Q = !!N.ranges && N.ranges.length > 0, ee = Q ? [...N.ranges] : [U.cellToRange(N.cell)], te = ee.length > 1, ne = N.rangeIndex ?? -1, oe = Q ? ne >= 0 ? ne : ee.length - 1 : 0, re = _.getRangeFromCell(N.cell), le = U.unionRanges(ee[oe] ?? U.cellToRange(N.cell), re), ie = ee.filter((e, t) => t !== oe), se = te ? oo(Kn, a) : oo(Un, s), ae = {
-		...jn,
+	const Q = !!N.ranges && N.ranges.length > 0, ee = Q ? [...N.ranges] : [U.cellToRange(N.cell)], te = ee.length > 1, ne = N.rangeIndex ?? -1, oe = Q ? ne >= 0 ? ne : ee.length - 1 : 0, re = _.getRangeFromCell(N.cell), le = U.unionRanges(ee[oe] ?? U.cellToRange(N.cell), re), ie = ee.filter((e, t) => t !== oe), ae = te ? co(Zn, s) : co(qn, a), se = {
+		...Jn,
 		...c
-	}, ce = oo(Gn, u), de = (e) => {
-		const t = o.getSelection(), n = t.ranges, r = !!n && n.length > 0, l = r ? void 0 !== t.rangeIndex && t.rangeIndex >= 0 && t.rangeIndex < n.length ? t.rangeIndex : n.length - 1 : 0, i = r ? n.map((t, n) => n === l ? e : t) : [e], s = U.isCellWithinRange(t.cell, e) ? t.cell : {
+	}, ce = co(Qn, u), de = (e) => {
+		const t = o.getSelection(), n = t.ranges, r = !!n && n.length > 0, l = r ? void 0 !== t.rangeIndex && t.rangeIndex >= 0 && t.rangeIndex < n.length ? t.rangeIndex : n.length - 1 : 0, i = r ? n.map((t, n) => n === l ? e : t) : [e], a = U.isCellWithinRange(t.cell, e) ? t.cell : {
 			rowIndex: e.rowStart,
 			colIndex: e.colStart
 		};
 		o.setSelection({
-			cell: s,
+			cell: a,
 			ranges: i,
 			rangeIndex: l
 		});
 	}, ue = V ?? ("extend" === F.dragMode ? {
 		kind: "select",
 		range: le
-	} : null), ge = ue && O ? O(ue) : null, he = e.Children.map(te ? h : g, (t) => {
+	} : null), ge = ue && z ? z(ue) : null, he = e.Children.map(te ? h : g, (t) => {
 		if (!e.isValidElement(t)) return t;
 		const n = t.props;
 		return e.cloneElement(t, {
@@ -3773,7 +3833,7 @@ var no = (e, t) => void 0 === t ? e : null === t ? null : {
 			}
 		});
 	});
-	return v(et, {
+	return v(tt, {
 		...A,
 		onPointerDown: F.onPointerDown,
 		onPointerMove: F.onPointerMove,
@@ -3783,22 +3843,22 @@ var no = (e, t) => void 0 === t ? e : null === t ? null : {
 		},
 		children: [
 			v(w, te ? { children: [
-				ie.map((t, n) => x(e.Fragment, { children: io(se, t) }, `other-${n}`)),
-				io(se, le, B ? re : void 0),
-				x(Wt, {
+				ie.map((t, n) => x(e.Fragment, { children: ho(ae, t) }, `other-${n}`)),
+				ho(ae, le, B ? re : void 0),
+				x(Yt, {
 					range: re,
-					...ae
+					...se
 				})
-			] } : { children: [io(se, le, B ? re : void 0), d && x(Wt, {
+			] } : { children: [ho(ae, le, B ? re : void 0), d && x(Yt, {
 				range: re,
 				...d
 			})] }),
-			!te && f && x(ln, {
+			!te && f && x(gn, {
 				range: le,
 				grip: "edges",
-				renderMove: (e) => se.border && x(Wt, {
+				renderMove: (e) => ae.border && x(Yt, {
 					range: e,
-					...se.border,
+					...ae.border,
 					animatedTransition: !0,
 					style: { opacity: .6 }
 				}),
@@ -3830,10 +3890,10 @@ var no = (e, t) => void 0 === t ? e : null === t ? null : {
 					});
 				}
 			}),
-			!te && E && x(gn, {
+			!te && E && x(xn, {
 				range: le,
 				snapDestination: I,
-				...se.border,
+				...ae.border,
 				onDragStart: (e, t) => {
 					R?.(e, t), H({
 						kind: "fill",
@@ -3859,11 +3919,11 @@ var no = (e, t) => void 0 === t ? e : null === t ? null : {
 					n && !U.isEqualRanges(n, e) && (C?.(e, n, t), de(n));
 				} : void 0
 			}),
-			F.removePreview && io(ce, F.removePreview),
+			F.removePreview && ho(ce, F.removePreview),
 			he,
-			null != ge && ue && x(kt, {
+			null != ge && ue && x(Dt, {
 				anchor: { range: (fe = ue, "move" === fe.kind ? fe.to : "fill" === fe.kind ? fe.destination : fe.range) },
-				placement: $ ?? ro,
+				placement: $ ?? uo,
 				offset: 8,
 				whenOff: "clamp",
 				open: !0,
@@ -3874,28 +3934,28 @@ var no = (e, t) => void 0 === t ? e : null === t ? null : {
 	});
 	var fe;
 });
-lo.displayName = "SelectionLayer";
-var io = (e, t, n, o = !1) => v(w, { children: [
-	e.fill && x(Wt, {
+go.displayName = "SelectionLayer";
+var ho = (e, t, n, o = !1) => v(w, { children: [
+	e.fill && x(Yt, {
 		className: "fill",
 		animatedTransition: o,
 		range: t,
 		hole: n,
 		...e.fill
 	}),
-	e.inner && x(Wt, {
+	e.inner && x(Yt, {
 		className: "inner",
 		animatedTransition: o,
 		range: t,
 		...e.inner
 	}),
-	e.border && x(Wt, {
+	e.border && x(Yt, {
 		className: "border",
 		animatedTransition: o,
 		range: t,
 		...e.border
 	})
-] }), so = [
+] }), fo = [
 	"#1a73e8",
 	"#d93025",
 	"#1e8e3e",
@@ -3903,19 +3963,19 @@ var io = (e, t, n, o = !1) => v(w, { children: [
 	"#e37400",
 	"#12a4af",
 	"#d01884"
-], ao = Array.from({ length: E }, (e, t) => `var(--sxl-color-series-${t + 1}, ${so[t]})`), co = "var(--sxl-color-primary, rgb(0, 120, 215))", uo = (e, t, n) => ({
+], po = Array.from({ length: E }, (e, t) => `var(--sxl-color-series-${t + 1}, ${fo[t]})`), mo = "var(--sxl-color-primary, rgb(0, 120, 215))", wo = (e, t, n) => ({
 	rowStart: Math.max(n.rowStart, Math.min(e.rowIndex, t.rowIndex)),
 	colStart: Math.max(n.colStart, Math.min(e.colIndex, t.colIndex)),
 	rowEnd: Math.min(n.rowEnd, Math.max(e.rowIndex, t.rowIndex)),
 	colEnd: Math.min(n.colEnd, Math.max(e.colIndex, t.colIndex))
-}), go = (e) => ({ stroke: ao.length ? ao[e % ao.length] : co }), ho = (e) => {
-	const { selection: t, getRangeStyle: n = go, anchors: o = an, enabledMove: r, disableDraw: l, allowMulti: i = !0, size: s, animated: a, renderHandle: d, preserveFocus: u = !0, onDragActiveChange: g, rangeStyle: h = W.EmptyObject, className: m, ...w } = e, y = qe(), b = T(t, (e) => e.getSelection()), S = b.ranges ?? U.EmptyRanges, E = Math.min(Math.max(0, b.rangeIndex ?? S.length - 1), Math.max(0, S.length - 1)), [I, C] = p(null), [R, M] = p(null), [P, k] = p(!1), D = null !== R || P, z = f(g);
-	z.current = g, c(() => {
-		z.current?.(D, R);
+}), xo = (e) => ({ stroke: po.length ? po[e % po.length] : mo }), vo = (e) => {
+	const { selection: t, getRangeStyle: n = xo, anchors: o = fn, enabledMove: r, disableDraw: l, allowMulti: i = !0, size: a, animated: s, renderHandle: d, preserveFocus: u = !0, onDragActiveChange: g, rangeStyle: h = W.EmptyObject, className: m, ...w } = e, y = Ze(), b = T(t, (e) => e.getSelection()), S = b.ranges ?? U.EmptyRanges, E = Math.min(Math.max(0, b.rangeIndex ?? S.length - 1), Math.max(0, S.length - 1)), [I, C] = p(null), [R, M] = p(null), [P, k] = p(!1), D = null !== R || P, O = f(g);
+	O.current = g, c(() => {
+		O.current?.(D, R);
 	}, [D, R]), c(() => () => {
-		z.current?.(!1, null);
+		O.current?.(!1, null);
 	}, []);
-	const O = R ?? I, $ = (e, t) => C((n) => t ? e : n === e ? null : n), L = (e, n) => {
+	const z = R ?? I, $ = (e, t) => C((n) => t ? e : n === e ? null : n), L = (e, n) => {
 		const o = t.getSelection(), r = o.ranges ?? U.EmptyRanges, l = e < r.length ? r.map((t, o) => o === e ? {
 			...t,
 			...n
@@ -3935,7 +3995,7 @@ var io = (e, t, n, o = !1) => v(w, { children: [
 			...n,
 			rangeIndex: e
 		});
-	}, A = Zt((e, t) => {
+	}, A = on((e, t) => {
 		if (0 !== t.button) return null;
 		const n = (b.rangeIndex ?? -1) >= 0 ? b.rangeIndex : -1;
 		if (t.shiftKey && n >= 0 && S[n]) {
@@ -3943,24 +4003,24 @@ var io = (e, t, n, o = !1) => v(w, { children: [
 				rowIndex: S[n].rowStart,
 				colIndex: S[n].colStart
 			};
-			return k(!0), L(n, uo(t, e, y.getTotalRange())), {
-				drag: (e) => L(n, uo(t, e, y.getTotalRange())),
+			return k(!0), L(n, wo(t, e, y.getTotalRange())), {
+				drag: (e) => L(n, wo(t, e, y.getTotalRange())),
 				end: () => k(!1),
 				captureEvents: !1
 			};
 		}
 		const o = (!t.ctrlKey && !t.metaKey || !i) && n >= 0 ? n : S.length;
 		return k(!0), L(o, U.cellToRange(e)), {
-			drag: (t) => L(o, uo(e, t, y.getTotalRange())),
+			drag: (t) => L(o, wo(e, t, y.getTotalRange())),
 			end: () => k(!1),
 			captureEvents: !1
 		};
 	}), N = S.map((e, t) => n(t, t === E)), F = [];
 	for (let e = 0; e < N.length; e++) N[e] && F.push(e);
-	return v(et, {
+	return v(tt, {
 		...w,
 		children: [
-			(!l || P) && x(lt, {
+			(!l || P) && x(it, {
 				fill: !0,
 				className: V(m, "ranges-picker-draw"),
 				onPointerDown: (e) => {
@@ -3971,7 +4031,7 @@ var io = (e, t, n, o = !1) => v(w, { children: [
 					e.stopPropagation(), A.onPointerUp(e);
 				}
 			}),
-			r && F.map((e) => x(ln, {
+			r && F.map((e) => x(gn, {
 				range: S[e],
 				grip: "edges",
 				preserveFocus: u,
@@ -3983,21 +4043,21 @@ var io = (e, t, n, o = !1) => v(w, { children: [
 				onDragEnd: (t) => L(e, t)
 			}, `move-${e}`)),
 			F.map((e) => {
-				const t = e === E, n = e === O, r = ((e, t, n) => {
-					const o = e.stroke ?? h.stroke ?? co;
+				const t = e === E, n = e === z, r = ((e, t, n) => {
+					const o = e.stroke ?? h.stroke ?? mo;
 					return {
 						...h,
 						...e,
 						stroke: o,
 						fill: e.fill ?? h.fill ?? `color-mix(in srgb, ${o} 12%, transparent)`,
 						alignWidth: n ? 3 : e.alignWidth ?? h.alignWidth ?? 2,
-						...a && t ? { animatedStroke: !0 } : void 0
+						...s && t ? { animatedStroke: !0 } : void 0
 					};
 				})(N[e], t, n);
-				return x(dn, {
+				return x(mn, {
 					range: S[e],
 					anchors: o,
-					size: s,
+					size: a,
 					...r,
 					renderHandle: d,
 					preserveFocus: u,
@@ -4014,8 +4074,8 @@ var io = (e, t, n, o = !1) => v(w, { children: [
 		]
 	});
 };
-ho.displayName = "RangesPickerLayer";
-var fo = 0, po = class {
+vo.displayName = "RangesPickerLayer";
+var yo = 0, bo = class {
 	constructor(e, t = {}) {
 		this.listeners = /* @__PURE__ */ new Set(), this.commitListeners = /* @__PURE__ */ new Set(), this.cancelListeners = /* @__PURE__ */ new Set(), this.editors = /* @__PURE__ */ new Set(), this.activeEditor = null, this.activeEditorId = null, this.auxState = null, this.commitFn = e.commit, this.state = {
 			mode: t.mode ?? "enter",
@@ -4024,7 +4084,7 @@ var fo = 0, po = class {
 			dirty: t.dirty,
 			initialSelection: t.initialSelection ?? null,
 			autoFocus: t.autoFocus ?? !0,
-			token: ++fo
+			token: ++yo
 		};
 	}
 	getState() {
@@ -4129,7 +4189,7 @@ var fo = 0, po = class {
 	notify() {
 		this.listeners.forEach((e) => e());
 	}
-}, mo = (e) => e.ctrlKey || e.metaKey || e.altKey || e.isComposing ? null : "Process" === e.key || 229 === e.keyCode ? {
+}, So = (e) => e.ctrlKey || e.metaKey || e.altKey || e.isComposing ? null : "Process" === e.key || 229 === e.keyCode ? {
 	mode: "enter",
 	dirty: ""
 } : 1 === e.key.length ? " " === e.key && e.shiftKey ? null : {
@@ -4138,17 +4198,17 @@ var fo = 0, po = class {
 } : e.shiftKey ? null : "F2" === e.key ? { mode: "edit" } : "Backspace" === e.key ? {
 	mode: "enter",
 	dirty: ""
-} : null, wo = (e, t) => {
+} : null, Eo = (e, t) => {
 	const n = f(null);
 	return u(() => {
 		const t = n.current;
 		null !== t && (n.current = null, e.current?.setSelectionRange(t, t));
-	}, [t]), z((e) => {
+	}, [t]), O((e) => {
 		n.current = e;
 	}, []);
-}, xo = (e) => {
-	const { mode: t, value: n, onDirtyChange: o, onModeChange: r, onCommit: l, onCancel: i, onNavigate: s, onTraverse: a, setCaret: c } = e;
-	return z((e) => {
+}, Io = (e) => {
+	const { mode: t, value: n, onDirtyChange: o, onModeChange: r, onCommit: l, onCancel: i, onNavigate: a, onTraverse: s, setCaret: c } = e;
+	return O((e) => {
 		const d = e.nativeEvent;
 		if (d.isComposing) return void e.stopPropagation();
 		if (e.which === y.Escape) return e.preventDefault(), e.stopPropagation(), void i();
@@ -4167,7 +4227,7 @@ var fo = 0, po = class {
 			if (!l(t ? { broadcast: !0 } : void 0)) return void e.stopPropagation();
 			if (t) return void e.stopPropagation();
 			const n = e.which === y.Enter || e.which === y.Tab;
-			n && a ? (e.stopPropagation(), a(e.which === y.Tab ? G.Row : G.Column, e.shiftKey)) : !n && s && (e.stopPropagation(), s(((e) => {
+			n && s ? (e.stopPropagation(), s(e.which === y.Tab ? G.Row : G.Column, e.shiftKey)) : !n && a && (e.stopPropagation(), a(((e) => {
 				switch (e.which) {
 					case y.Enter: return e.shiftKey ? j.Up : j.Down;
 					case y.Tab: return e.shiftKey ? j.Left : j.Right;
@@ -4188,11 +4248,11 @@ var fo = 0, po = class {
 		i,
 		r,
 		o,
-		s,
 		a,
+		s,
 		c
 	]);
-}, vo = class {
+}, Co = class {
 	constructor(e, t, n) {
 		this.current = null, this.listeners = /* @__PURE__ */ new Set(), this.anchor = e, this.createEdit = t, this.revertAnchor = n?.revertAnchor, this.unsubscribeAnchor = e.subscribe(() => this.onAnchorChange());
 	}
@@ -4214,7 +4274,7 @@ var fo = 0, po = class {
 	}
 	startEdit(e, t = {}) {
 		const n = this.createEdit(e);
-		return !!n && (this.current = new po({
+		return !!n && (this.current = new bo({
 			coords: e,
 			...n
 		}, t), this.notify(), !0);
@@ -4233,16 +4293,16 @@ var fo = 0, po = class {
 	notify() {
 		this.listeners.forEach((e) => e());
 	}
-}, yo = (e, t, n, o = "left", r = 0) => {
+}, Ro = (e, t, n, o = "left", r = 0) => {
 	if (!t) return null;
 	const l = e.getRangeFromCell(t), i = e.getBoundsFromRange(l);
 	if (!i) return null;
-	const s = null !== e.toClipBounds(e.getBoundsFromRange(l)), a = e.getZoom(), c = n?.width ? n.width * a : void 0, d = n?.height ? n.height * a : void 0;
+	const a = null !== e.toClipBounds(e.getBoundsFromRange(l)), s = e.getZoom(), c = n?.width ? n.width * s : void 0, d = n?.height ? n.height * s : void 0;
 	let u = { ...i };
 	if (void 0 !== c) {
 		const t = e.getPaneRange(), n = e.getMetrics(), r = { ...l };
-		let i = !1, s = 0;
-		for (; !i && u.width <= c && s < 20;) s++, "left" === o ? r.colEnd + 1 < t.colEnd ? r.colEnd = n.getColIndex(u.x + c) : i = !0 : "right" === o ? r.colStart - 1 >= 0 ? r.colStart = n.getColIndex(u.x - (c - u.width)) : i = !0 : r.colEnd + 1 < t.colEnd && r.colStart - 1 >= 0 ? (r.colStart = n.getColIndex(u.x - (c - u.width) / 2), r.colEnd = n.getColIndex(u.x + u.width + (c - u.width) / 2)) : i = !0, i || (u = e.getBoundsFromRange(r));
+		let i = !1, a = 0;
+		for (; !i && u.width <= c && a < 20;) a++, "left" === o ? r.colEnd + 1 < t.colEnd ? r.colEnd = n.getColIndex(u.x + c) : i = !0 : "right" === o ? r.colStart - 1 >= 0 ? r.colStart = n.getColIndex(u.x - (c - u.width)) : i = !0 : r.colEnd + 1 < t.colEnd && r.colStart - 1 >= 0 ? (r.colStart = n.getColIndex(u.x - (c - u.width) / 2), r.colEnd = n.getColIndex(u.x + u.width + (c - u.width) / 2)) : i = !0, i || (u = e.getBoundsFromRange(r));
 	}
 	u.height = i.height, void 0 !== d && (u.height = Math.max(d + 1, i.height));
 	const g = e.getSurfaceSize(), h = Math.max(i.width, g.width - u.x - r);
@@ -4253,17 +4313,17 @@ var fo = 0, po = class {
 			width: Math.min(h, u.width),
 			height: Math.min(g.height - u.y, u.height)
 		},
-		inView: s
+		inView: a
 	};
-}, bo = 96 / 72 * 11, So = "Calibri, sans-serif", Eo = (e) => {
-	const { open: t, mode: n, clean: o, dirty: r, token: l, autoFocus: i, initialSelection: s, zoom: a, readOnly: c, onDirtyChange: d, onModeChange: g, onCommit: h, onCancel: p, onNaturalSize: m } = e, y = r ?? o ?? "", b = f(null), S = f(null), E = f(0);
+}, Mo = 96 / 72 * 11, Po = "Calibri, sans-serif", ko = (e) => {
+	const { open: t, mode: n, clean: o, dirty: r, token: l, autoFocus: i, initialSelection: a, zoom: s, readOnly: c, onDirtyChange: d, onModeChange: g, onCommit: h, onCancel: p, onNaturalSize: m } = e, y = r ?? o ?? "", b = f(null), S = f(null), E = f(0);
 	u(() => {
 		if (!t || !i) return;
 		const e = b.current;
 		if (!e) return;
 		if (e.focus(), E.current === l) return;
 		E.current = l;
-		const n = e.value.length, o = s ?? {
+		const n = e.value.length, o = a ?? {
 			start: n,
 			end: n,
 			direction: "forward"
@@ -4280,14 +4340,14 @@ var fo = 0, po = class {
 			height: e.offsetHeight
 		});
 	}, [y, m]);
-	const I = xo({
+	const I = Io({
 		mode: n,
 		value: y,
 		onDirtyChange: d,
 		onModeChange: g,
 		onCommit: h,
 		onCancel: p,
-		setCaret: wo(b, y)
+		setCaret: Eo(b, y)
 	});
 	return v(w, { children: [x("textarea", {
 		ref: b,
@@ -4307,8 +4367,8 @@ var fo = 0, po = class {
 			resize: "none",
 			overflow: "hidden",
 			background: "transparent",
-			fontFamily: So,
-			fontSize: bo * a + "px",
+			fontFamily: Po,
+			fontSize: Mo * s + "px",
 			lineHeight: 1.2,
 			whiteSpace: "pre",
 			userSelect: "text"
@@ -4328,30 +4388,30 @@ var fo = 0, po = class {
 			visibility: "hidden",
 			pointerEvents: "none",
 			whiteSpace: "pre",
-			fontFamily: So,
-			fontSize: `${bo}px`,
+			fontFamily: Po,
+			fontSize: `${Mo}px`,
 			lineHeight: 1.2
 		},
 		children: 0 === y.length ? " " : y
 	})] });
 };
-function Io(e) {
-	const { editable: t, renderEditor: n, alignment: o = "left", background: r = "var(--sxl-color-base-100, rgb(255, 255, 255))", borderColor: l = "var(--sxl-color-primary, rgb(33, 115, 70))", borderWidth: i = 2, zIndex: s, className: a, style: d, ...u } = e, g = Ze(), h = T(t, (e) => e.getSession()), f = B(h, (e) => e.getState()), [m, w] = p(null), v = z((e) => {
+function Do(e) {
+	const { editable: t, renderEditor: n, alignment: o = "left", background: r = "var(--sxl-color-base-100, rgb(255, 255, 255))", borderColor: l = "var(--sxl-color-primary, rgb(33, 115, 70))", borderWidth: i = 2, zIndex: a, className: s, style: d, ...u } = e, g = Je(), h = T(t, (e) => e.getSession()), f = B(h, (e) => e.getState()), [m, w] = p(null), v = O((e) => {
 		w((t) => t && t.width === e.width && t.height === e.height ? t : e);
-	}, []), y = z((e) => {
+	}, []), y = O((e) => {
 		if (t.getSession()) return;
 		const n = t.getAnchor().getCoords();
 		if (!n) return;
-		const o = mo(e.nativeEvent);
+		const o = So(e.nativeEvent);
 		o && ("Process" !== e.nativeEvent.key && 229 !== e.nativeEvent.keyCode && e.preventDefault(), e.stopPropagation(), t.startEdit(n, o));
-	}, [t]), b = z((e) => {
+	}, [t]), b = O((e) => {
 		if (t.getSession()) return;
 		const n = g?.getCellFromPointer(e.clientX, e.clientY) ?? t.getAnchor().getCoords();
 		n && t.startEdit(n, { mode: "edit" });
-	}, [g, t]), S = z((e) => {
+	}, [g, t]), S = O((e) => {
 		const n = t.commit(e);
 		return n && g?.focus(), n;
-	}, [t, g]), E = z(() => {
+	}, [t, g]), E = O(() => {
 		t.cancel(), g?.focus();
 	}, [t, g]);
 	c(() => {
@@ -4367,7 +4427,7 @@ function Io(e) {
 			rowEnd: e.rowStart,
 			colEnd: e.colStart
 		})), f) {
-			const e = yo(g, I, m, o, i);
+			const e = Ro(g, I, m, o, i);
 			C = e?.bounds ?? null, R = e?.inView ?? !1;
 		} else C = g.getBoundsFromRange(e);
 	}
@@ -4395,13 +4455,13 @@ function Io(e) {
 		onCommit: S,
 		onCancel: E,
 		onNaturalSize: v
-	}, O = "function" == typeof r ? (I ? r(I) : void 0) ?? "transparent" : r;
-	return x(et, {
+	}, z = "function" == typeof r ? (I ? r(I) : void 0) ?? "transparent" : r;
+	return x(tt, {
 		onKeyDown: y,
 		onDoubleClick: b,
-		children: C ? x(lt, {
+		children: C ? x(it, {
 			...u,
-			className: V(a, "editor"),
+			className: V(s, "editor"),
 			bounds: C,
 			alignWidth: i,
 			keepMounted: !0,
@@ -4409,18 +4469,18 @@ function Io(e) {
 				...d,
 				display: "flex",
 				overflow: "hidden",
-				background: O,
+				background: z,
 				borderColor: l,
 				boxShadow: k ? "rgba(60,64,67,.35) 2px 2px 6px 3px" : "none",
 				opacity: k ? 1 : 0,
 				pointerEvents: k ? "auto" : "none"
 			},
-			children: n ? n(D) : x(Eo, { ...D })
+			children: n ? n(D) : x(ko, { ...D })
 		}) : null
 	});
 }
-function Co(e) {
-	const { editable: t, renderEditor: n, idleClean: o = null, mapClean: r, editorId: l, readOnly: i, className: s, style: a } = e, c = T(t, (e) => e.getSession()), d = B(c, (e) => e.getState()), u = d?.clean ?? o, g = r ? r(u) : u, h = z((e) => t.commit(e), [t]), f = z(() => t.cancel(), [t]), p = z(() => {
+function To(e) {
+	const { editable: t, renderEditor: n, idleClean: o = null, mapClean: r, editorId: l, readOnly: i, className: a, style: s } = e, c = T(t, (e) => e.getSession()), d = B(c, (e) => e.getState()), u = d?.clean ?? o, g = r ? r(u) : u, h = O((e) => t.commit(e), [t]), f = O(() => t.cancel(), [t]), p = O(() => {
 		i || (t.getSession() || t.startEdit(t.getAnchor().getCoords(), {
 			mode: "edit",
 			autoFocus: !1
@@ -4446,20 +4506,20 @@ function Co(e) {
 		onCancel: f
 	};
 	return x("div", {
-		className: s,
-		style: a,
+		className: a,
+		style: s,
 		onFocus: p,
-		children: n ? n(m) : x(Eo, { ...m })
+		children: n ? n(m) : x(ko, { ...m })
 	});
 }
-Eo.displayName = "DefaultEditorInput", Co.displayName = "EditorDiv";
-var Ro = "ew-resize", Mo = "ns-resize", Po = i(r((e, t) => {
-	const { axis: n, index: o, className: r, style: l, disabled: i = !1, disabledResize: s = !1, isNextHidden: a, isHidden: c, isSelected: d, isSelectedAll: u, showTouchDivider: g, bounds: h, onPointerDown: f, onAutoFit: p, ...m } = e, w = qe(), y = n === G.Column, b = 1 / S.getDevicePixelRatio(), E = d || u, I = E ? "color-mix(in srgb, var(--sxl-color-primary, rgb(33, 115, 70)) 35%, var(--sxl-color-base-300, rgb(171, 171, 171)))" : "var(--sxl-color-base-300, rgb(171, 171, 171))", C = "var(--sxl-color-base-100, #f5f5f5)", R = "touch" === S.detectIt().primaryInput;
+ko.displayName = "DefaultEditorInput", To.displayName = "EditorDiv";
+var Oo = "ew-resize", zo = "ns-resize", $o = i(r((e, t) => {
+	const { axis: n, index: o, className: r, style: l, disabled: i = !1, disabledResize: a = !1, isNextHidden: s, isHidden: c, isSelected: d, isSelectedAll: u, showTouchDivider: g, bounds: h, onPointerDown: f, onAutoFit: p, ...m } = e, w = Ze(), y = n === G.Column, b = 1 / S.getDevicePixelRatio(), E = d || u, I = E ? "color-mix(in srgb, var(--sxl-color-primary, rgb(33, 115, 70)) 35%, var(--sxl-color-base-300, rgb(171, 171, 171)))" : "var(--sxl-color-base-300, rgb(171, 171, 171))", C = "var(--sxl-color-base-100, #f5f5f5)", R = "touch" === S.detectIt().primaryInput;
 	let M = y ? 14 : 8;
 	const P = w.getZoom();
 	P < 1 && (M = Math.max(2, M * P * .8));
 	let k = M / 2, D = 0;
-	a && (D = -2), c && (D = 2), c && (M = M / 2 + D, k = 2 * D);
+	s && (D = -2), c && (D = 2), c && (M = M / 2 + D, k = 2 * D);
 	let T = I;
 	return E || 0 !== D || (T = `linear-gradient(${y ? 180 : 90}deg, ${C}, ${I} 55%, ${I} 100%)`), v("div", {
 		className: V("header-divider", { disabled: i }, r, `index-${o}`),
@@ -4474,7 +4534,7 @@ var Ro = "ew-resize", Mo = "ns-resize", Po = i(r((e, t) => {
 			position: "absolute",
 			overflow: "visible",
 			pointerEvents: "auto",
-			cursor: i || s || R ? void 0 : y ? Ro : Mo,
+			cursor: i || a || R ? void 0 : y ? Oo : zo,
 			...l
 		},
 		...m,
@@ -4518,8 +4578,8 @@ var Ro = "ew-resize", Mo = "ns-resize", Po = i(r((e, t) => {
 			} })
 		}) : null]
 	});
-})), ko = (e) => x(Po, { ...e }), Do = i(r((e, t) => {
-	const { axis: n, index: o, disabled: r = !1, disabledResize: l = !1, resizeThreshold: i = 1, renderDivider: s = ko, onDividerMouseDown: a, onDividerResizeStart: c, onDividerResize: d, onDividerResizeEnd: u, onDividerMouseUp: g, onDividerAutoFit: h, onPointerDown: m, ...y } = e, b = qe(), E = z(m, [m]), I = z(h, [h]), C = n === G.Column;
+})), Lo = (e) => x($o, { ...e }), Bo = i(r((e, t) => {
+	const { axis: n, index: o, disabled: r = !1, disabledResize: l = !1, resizeThreshold: i = 1, renderDivider: a = Lo, onDividerMouseDown: s, onDividerResizeStart: c, onDividerResize: d, onDividerResizeEnd: u, onDividerMouseUp: g, onDividerAutoFit: h, onPointerDown: m, ...y } = e, b = Ze(), E = O(m, [m]), I = O(h, [h]), C = n === G.Column;
 	let R = C ? b.getVisibleColumns() : b.getVisibleRows(), M = null;
 	R.length > 0 && (M = C ? b.getBoundsFromRange({
 		rowStart: 0,
@@ -4532,23 +4592,23 @@ var Ro = "ew-resize", Mo = "ns-resize", Po = i(r((e, t) => {
 		colStart: 0,
 		colEnd: 0
 	}), M = b.toClipBounds(M, -10));
-	const P = f(null), [k, D] = p(null), T = (e, t) => C ? e.clientX - t.clientX : e.clientY - t.clientY, O = b.getMetrics(), L = C ? O.getColOffset(o + 1) : O.getRowOffset(o + 1), B = S.getDevicePixelRatio(), N = 1 / B, F = S.snapLineCenter(L, N, B) - N / 2, H = A({
+	const P = f(null), [k, D] = p(null), T = (e, t) => C ? e.clientX - t.clientX : e.clientY - t.clientY, z = b.getMetrics(), L = C ? z.getColOffset(o + 1) : z.getRowOffset(o + 1), B = S.getDevicePixelRatio(), N = 1 / B, F = S.snapLineCenter(L, N, B) - N / 2, H = A({
 		processTouch: !0,
 		onPointerDown: (e) => {
 			if (E?.(e), !r && !l) {
-				const e = C ? O.getColOffset(o) : O.getRowOffset(o), t = L - e;
+				const e = C ? z.getColOffset(o) : z.getRowOffset(o), t = L - e;
 				P.current = {
 					isResizing: !1,
 					startSize: t,
 					index: o,
 					pane: b,
 					axis: n,
-					onDividerMouseDown: a,
+					onDividerMouseDown: s,
 					onDividerResizeStart: c,
 					onDividerResize: d,
 					onDividerResizeEnd: u,
 					onDividerMouseUp: g
-				}, D(P.current), a?.(o, t);
+				}, D(P.current), s?.(o, t);
 			}
 			e.stopPropagation(), e.preventDefault();
 		},
@@ -4566,11 +4626,11 @@ var Ro = "ew-resize", Mo = "ns-resize", Po = i(r((e, t) => {
 				isResizing: !0
 			}, D(P.current), P.current.onDividerResizeStart?.(P.current.index, Math.max(0, P.current.startSize + o))), e.stopPropagation(), e.preventDefault();
 		}
-	}), _ = z(() => {
+	}), _ = O(() => {
 		I?.(o);
 	}, [o]), { getPortalContainer: W } = $();
 	if (!M) return;
-	const U = s({
+	const U = a({
 		bounds: M,
 		axis: n,
 		index: o,
@@ -4585,7 +4645,7 @@ var Ro = "ew-resize", Mo = "ns-resize", Po = i(r((e, t) => {
 	let K = null;
 	return k && k.isResizing && k.index === o && (K = Y(x("div", { style: {
 		position: "absolute",
-		cursor: C ? Ro : Mo,
+		cursor: C ? Oo : zo,
 		left: 0,
 		top: 0,
 		width: "100%",
@@ -4605,26 +4665,26 @@ var Ro = "ew-resize", Mo = "ns-resize", Po = i(r((e, t) => {
 		children: U
 	})] });
 }));
-Do.displayName = "HeaderDividerAnchor";
-var To = (e, t, n) => t === G.Column ? {
+Bo.displayName = "HeaderDividerAnchor";
+var Ao = (e, t, n) => t === G.Column ? {
 	rowIndex: n.rowStart,
 	colIndex: e.colIndex
 } : {
 	rowIndex: e.rowIndex,
 	colIndex: n.colStart
-}, zo = (e, t, n) => t === G.Column ? {
+}, No = (e, t, n) => t === G.Column ? {
 	rowIndex: n.rowEnd,
 	colIndex: e.colIndex
 } : {
 	rowIndex: e.rowIndex,
 	colIndex: n.colEnd
-}, Oo = (e, t, n) => t === G.Column ? {
+}, Fo = (e, t, n) => t === G.Column ? {
 	rowIndex: n.rowStart,
 	colIndex: e.colIndex
 } : {
 	rowIndex: e.rowIndex,
 	colIndex: n.colStart
-}, $o = (e, t, n, o) => n === G.Column ? {
+}, Vo = (e, t, n, o) => n === G.Column ? {
 	rowStart: o.rowStart,
 	rowEnd: o.rowEnd,
 	colStart: Math.min(e.colIndex, t.colIndex),
@@ -4634,9 +4694,9 @@ var To = (e, t, n) => t === G.Column ? {
 	colEnd: o.colEnd,
 	rowStart: Math.min(e.rowIndex, t.rowIndex),
 	rowEnd: Math.max(e.rowIndex, t.rowIndex)
-}, Lo = (e, t, n) => {
+}, Ho = (e, t, n) => {
 	let o = null, r = null, l = 0;
-	const i = () => t.getAllPanes()[_.Center] ?? t, s = (t, n, o) => {
+	const i = () => t.getAllPanes()[_.Center] ?? t, a = (t, n, o) => {
 		if (!e) return;
 		const r = e.getSelection(), l = !!r.ranges && r.ranges.length > 0;
 		if ("clear" === o) return void e.setSelection({
@@ -4653,13 +4713,13 @@ var To = (e, t, n) => t === G.Column ? {
 			});
 			return;
 		}
-		const i = r.rangeIndex ?? -1, s = l ? i >= 0 ? i : r.ranges.length - 1 : 0, a = l ? r.ranges.map((e, n) => n === s ? t : e) : [t];
+		const i = r.rangeIndex ?? -1, a = l ? i >= 0 ? i : r.ranges.length - 1 : 0, s = l ? r.ranges.map((e, n) => n === a ? t : e) : [t];
 		e.setSelection({
 			cell: n,
-			ranges: a,
-			rangeIndex: l ? s : 0
+			ranges: s,
+			rangeIndex: l ? a : 0
 		});
-	}, a = (t, n, o) => {
+	}, s = (t, n, o) => {
 		if (!e) return;
 		const r = e.getSelection(), l = r.ranges && r.ranges.length > 0 ? r.ranges : [], i = t < l.length ? l.map((e, o) => o === t ? n : e) : [...l, n];
 		e.setSelection({
@@ -4674,24 +4734,24 @@ var To = (e, t, n) => t === G.Column ? {
 		const { axis: t, entireRange: o } = n(), r = i().getElement()?.getBoundingClientRect();
 		if (!r) return !1;
 		const l = i().getVisibleRange();
-		let s = null;
-		return t === G.Column ? e.x >= r.right - 24 && l.colEnd < o.colEnd ? s = { colIndex: l.colEnd + 1 } : e.x <= r.left + 24 && l.colStart > o.colStart && (s = { colIndex: l.colStart - 1 }) : e.y >= r.bottom - 24 && l.rowEnd < o.rowEnd ? s = { rowIndex: l.rowEnd + 1 } : e.y <= r.top + 24 && l.rowStart > o.rowStart && (s = { rowIndex: l.rowStart - 1 }), !!s && (c(s), !0);
+		let a = null;
+		return t === G.Column ? e.x >= r.right - 24 && l.colEnd < o.colEnd ? a = { colIndex: l.colEnd + 1 } : e.x <= r.left + 24 && l.colStart > o.colStart && (a = { colIndex: l.colStart - 1 }) : e.y >= r.bottom - 24 && l.rowEnd < o.rowEnd ? a = { rowIndex: l.rowEnd + 1 } : e.y <= r.top + 24 && l.rowStart > o.rowStart && (a = { rowIndex: l.rowStart - 1 }), !!a && (c(a), !0);
 	}, u = (e) => {
-		const { axis: t, entireRange: c, replaceActive: d = !1 } = n(), u = $o(o ?? e, e, t, c), g = r ?? Oo(e, t, i().getVisibleRange());
-		d ? a(l, u, g) : s(u, g, "replace");
+		const { axis: t, entireRange: c, replaceActive: d = !1 } = n(), u = Vo(o ?? e, e, t, c), g = r ?? Fo(e, t, i().getVisibleRange());
+		d ? s(l, u, g) : a(u, g, "replace");
 	};
-	return Yt(t, (t, g) => {
+	return tn(t, (t, g) => {
 		if (!e) return null;
 		const h = 0 === g.button, f = 2 === g.button;
 		if (!h && !f) return null;
 		const { axis: p, entireRange: m, allowMulti: w = !0, replaceActive: x = !1, preserveFocus: v = !1, onPointerDownInterceptor: y, onDragStart: b, onDragEnd: S, onPointerUp: E } = n();
 		if (!1 === y?.(g, t)) return null;
 		x && g.stopPropagation(), v && h && g.preventDefault(), b?.();
-		const I = Oo(t, p, i().getVisibleRange()), C = g.shiftKey, R = (g.ctrlKey || g.metaKey) && w;
+		const I = Fo(t, p, i().getVisibleRange()), C = g.shiftKey, R = (g.ctrlKey || g.metaKey) && w;
 		if (x) {
-			const n = e.getSelection(), i = n.ranges ?? [], s = n.rangeIndex ?? -1;
-			C && o ? (l = s >= 0 ? s : Math.max(0, i.length - 1), a(l, $o(o, t, p, m), r ?? I)) : (o = t, r = I, l = R || s < 0 ? i.length : s, a(l, $o(t, t, p, m), I));
-		} else C && o ? s($o(o, t, p, m), r ?? I, "replace") : R ? (o = t, r = I, s($o(t, t, p, m), I, "append")) : (o = t, r = I, s($o(t, t, p, m), I, "clear"));
+			const n = e.getSelection(), i = n.ranges ?? [], a = n.rangeIndex ?? -1;
+			C && o ? (l = a >= 0 ? a : Math.max(0, i.length - 1), s(l, Vo(o, t, p, m), r ?? I)) : (o = t, r = I, l = R || a < 0 ? i.length : a, s(l, Vo(t, t, p, m), I));
+		} else C && o ? a(Vo(o, t, p, m), r ?? I, "replace") : R ? (o = t, r = I, a(Vo(t, t, p, m), I, "append")) : (o = t, r = I, a(Vo(t, t, p, m), I, "clear"));
 		return ((e) => {
 			c(n().axis === G.Column ? { colIndex: e.colIndex } : { rowIndex: e.rowIndex });
 		})(t), {
@@ -4704,38 +4764,38 @@ var To = (e, t, n) => t === G.Column ? {
 			captureEvents: x
 		};
 	});
-}, Bo = (e, t) => {
-	const n = qe(), o = f(t);
+}, _o = (e, t) => {
+	const n = Ze(), o = f(t);
 	o.current = t;
-	const r = g(() => Lo(e, n, () => o.current), [e, n]);
+	const r = g(() => Ho(e, n, () => o.current), [e, n]);
 	return c(() => () => r.dispose(), [r]), {
 		onPointerDown: r.onPointerDown,
 		onPointerMove: r.onPointerMove,
 		onPointerUp: r.onPointerUp
 	};
-}, Ao = (e) => null == e ? [] : Array.isArray(e) ? e : [e], No = i(r((e, t) => {
-	const { rowCount: n = 1, columnCount: o = 1, getRowHeight: r, getColumnWidth: l, metrics: i, renderCells: a, renderBorders: c, showGridLines: d = !0, gridLineColor: u, propsGridLineRows: f, propsGridLineColumns: p, getVisibleCells: m, hiddenCellAt: w, renderBelow: v, children: y, ...b } = e, S = oe({
+}, Wo = (e) => null == e ? [] : Array.isArray(e) ? e : [e], Uo = i(r((e, t) => {
+	const { rowCount: n = 1, columnCount: o = 1, getRowHeight: r, getColumnWidth: l, metrics: i, renderCells: s, renderBorders: c, showGridLines: d = !0, gridLineColor: u, propsGridLineRows: f, propsGridLineColumns: p, getVisibleCells: m, hiddenCellAt: w, renderBelow: v, children: y, ...b } = e, S = re({
 		rowCount: n,
 		columnCount: o,
 		getRowHeight: r,
 		getColumnWidth: l
-	}), E = i ?? S, [I, C] = h((e) => e + 1, 0), R = g(() => ({}), [I]), M = s((e) => {
+	}), E = i ?? S, [I, C] = h((e) => e + 1, 0), R = g(() => ({}), [I]), M = a((e) => {
 		C();
 	}, []), P = L(t, () => ({ invalidate: M }), [M]), k = g(() => {
 		const e = [];
-		return !1 !== d && e.push(x(On, {
+		return !1 !== d && e.push(x(Fn, {
 			showGridLines: d,
 			gridLineColor: u,
 			propsRows: f,
 			propsColumns: p,
 			getVisibleCells: m,
 			hiddenCellAt: w
-		}, "__gridlines")), e.push(...Ao(v)), e.push(...Ao(c)), a && e.push(x(In, {
-			renderCell: a,
+		}, "__gridlines")), e.push(...Wo(v)), e.push(...Wo(c)), s && e.push(x(Dn, {
+			renderCell: s,
 			getVisibleCells: m,
 			hiddenCellAt: w,
 			cacheToken: R
-		}, "__cells")), e.push(...Ao(y)), e;
+		}, "__cells")), e.push(...Wo(y)), e;
 	}, [
 		d,
 		u,
@@ -4745,11 +4805,11 @@ var To = (e, t, n) => t === G.Column ? {
 		w,
 		v,
 		c,
-		a,
+		s,
 		R,
 		y
 	]);
-	return x(Fe, {
+	return x(Ve, {
 		ref: P,
 		...b,
 		rowCount: n,
@@ -4758,56 +4818,46 @@ var To = (e, t, n) => t === G.Column ? {
 		children: k
 	});
 }));
-No.displayName = "Grid";
-var Fo = {
+Uo.displayName = "Grid";
+var Ko = {
 	fill: { fill: "color-mix(in srgb, var(--sxl-color-primary, rgb(0, 120, 215)) 14%, transparent)" },
 	border: null,
 	inner: null
-}, Vo = {
+}, jo = {
 	stroke: "var(--sxl-color-primary, rgb(0, 120, 215))",
 	alignWidth: 1,
 	inset: 1
-}, Ho = r(function(e, t) {
-	const { itemCount: n, renderItem: o, itemHeight: r = 24, selection: l, onKeyDown: i, cacheToken: a, className: c, style: d, children: u, ...h } = e, f = L(t, () => ({ isList: () => !0 }), []), p = g(() => new M(), []), m = g(() => new Bn({ getBounds: () => ({
+}, Go = r(function(e, t) {
+	const { itemCount: n, renderCell: o, getVisibleCells: r, itemHeight: l = 24, contentWidth: i, selection: a, propsLayer: s, autoFocus: d, cacheToken: u, className: h, style: p, children: m, ...w } = e, y = g(() => new M(), []), b = f(null);
+	c(() => {
+		d && b.current?.focus();
+	}, [d]);
+	const S = g(() => new _n({ getBounds: () => ({
 		rowStart: 0,
 		colStart: 0,
 		rowEnd: Math.max(0, n - 1),
 		colEnd: 0
-	}) }), [n]), w = l ?? m, [y, { width: b }] = te(), S = oe({
+	}) }), [n]), E = a ?? S, [C, { width: R }] = te(), [P, { width: k }] = te(), D = k > 0 && R > 0 ? Math.max(0, k - R) : 0, T = g(() => ne([P, t]), [P, t]), O = re({
 		rowCount: n,
 		columnCount: 1,
-		getRowHeight: r,
-		getColumnWidth: b
-	}), E = s((e) => {
-		const { key: t, style: n, range: r, cell: l } = e, i = r?.rowStart ?? l.rowIndex;
-		return x("div", {
-			style: {
-				...n,
-				position: "absolute",
-				display: "flex",
-				alignItems: "center",
-				boxSizing: "border-box",
-				padding: "0 8px",
-				overflow: "hidden",
-				whiteSpace: "nowrap",
-				userSelect: "none",
-				pointerEvents: "none",
-				background: "transparent"
-			},
-			children: o(i)
-		}, t);
-	}, [o]);
+		getRowHeight: l,
+		getColumnWidth: R
+	});
 	return x("div", {
-		ref: f,
-		className: V("list", c),
+		ref: T,
+		className: V("list-surface", h),
 		style: {
 			position: "relative",
 			overflow: "hidden",
-			...d
+			height: n * l,
+			maxWidth: "100%",
+			maxHeight: "100%",
+			...p,
+			...null != i ? { width: i + D } : null
 		},
-		...h,
+		...w,
 		children: x(I, {
-			viewport: p,
+			viewport: y,
 			showVerticalScrollbar: !0,
 			showHorizontalScrollbar: !1,
 			style: {
@@ -4815,39 +4865,73 @@ var Fo = {
 				height: "100%"
 			},
 			children: x("div", {
-				ref: y,
+				ref: C,
 				style: {
 					width: "100%",
 					height: "100%"
 				},
-				children: v(Fe, {
-					viewport: p,
+				children: v(Ve, {
+					ref: b,
+					viewport: y,
 					style: {
 						width: "100%",
 						height: "100%"
 					},
 					rowCount: n,
 					columnCount: 1,
-					metrics: S,
+					metrics: O,
 					children: [
-						x(lo, {
-							selection: w,
+						x(go, {
+							selection: E,
 							anchorHole: !1,
-							singleStyle: Fo,
-							singleAnchorStyle: Vo,
-							multiAnchorStyle: Vo
+							singleStyle: Ko,
+							singleAnchorStyle: jo,
+							multiAnchorStyle: jo
 						}, "__selection"),
-						x(In, {
-							renderCell: E,
-							cacheToken: a
+						x(Dn, {
+							renderCell: o,
+							getVisibleCells: r,
+							cacheToken: u
 						}, "__cells"),
-						i ? x(et, { onKeyDown: i }, "__keys") : null
+						s ? x(tt, { ...s }, "__taps") : null
 					]
 				})
 			})
 		})
 	});
-}), _o = (e, t) => x("input", {
+}), Xo = r(function(e, t) {
+	const { itemCount: n, renderItem: o, itemHeight: r, selection: l, onKeyDown: i, cacheToken: s, className: c, style: d, children: u, ...h } = e, f = L(t, () => ({ isList: () => !0 }), []), p = a((e) => {
+		const { key: t, style: n, range: r, cell: l } = e, i = r?.rowStart ?? l.rowIndex;
+		return x("div", {
+			style: {
+				...n,
+				position: "absolute",
+				display: "flex",
+				alignItems: "center",
+				boxSizing: "border-box",
+				padding: "0 8px",
+				overflow: "hidden",
+				whiteSpace: "nowrap",
+				userSelect: "none",
+				pointerEvents: "none",
+				background: "transparent"
+			},
+			children: o(i)
+		}, t);
+	}, [o]), m = g(() => i ? { onKeyDown: i } : void 0, [i]);
+	return x(Go, {
+		ref: f,
+		className: V("list", c),
+		style: d,
+		itemCount: n,
+		itemHeight: r,
+		selection: l,
+		renderCell: p,
+		propsLayer: m,
+		cacheToken: s,
+		...h
+	});
+}), Yo = (e, t) => x("input", {
 	type: "checkbox",
 	checked: e,
 	ref: (e) => {
@@ -4856,13 +4940,13 @@ var Fo = {
 	readOnly: !0,
 	tabIndex: -1,
 	style: { margin: 0 }
-}), Wo = r(function(e, t) {
-	const { itemCount: n, isChecked: o, onCheckedChange: r, renderValue: l, renderCheckbox: i = _o, renderDivider: a, selectAllLabel: c, itemHeight: d, selection: u, cacheToken: h, className: f, style: p, children: m, ...y } = e, b = L(t, () => ({ isCheckboxList: () => !0 }), []), S = g(() => new Bn({ getBounds: () => ({
+}), qo = r(function(e, t) {
+	const { itemCount: n, isChecked: o, onCheckedChange: r, renderValue: l, renderCheckbox: i = Yo, renderDivider: s, selectAllLabel: c, itemHeight: d, selection: u, cacheToken: h, className: f, style: p, children: m, ...y } = e, b = L(t, () => ({ isCheckboxList: () => !0 }), []), S = g(() => new _n({ getBounds: () => ({
 		rowStart: 0,
 		colStart: 0,
 		rowEnd: Math.max(0, n - 1),
 		colEnd: 0
-	}) }), [n]), E = u ?? S, I = s((e) => v("div", {
+	}) }), [n]), E = u ?? S, I = a((e) => v("div", {
 		style: {
 			display: "flex",
 			alignItems: "center",
@@ -4893,7 +4977,7 @@ var Fo = {
 		r,
 		l,
 		i
-	]), C = s((e) => {
+	]), C = a((e) => {
 		if (" " !== e.key && "Enter" !== e.key) return;
 		e.preventDefault(), e.stopPropagation();
 		const t = !o(E.getSelection().cell.rowIndex);
@@ -4951,7 +5035,7 @@ var Fo = {
 				},
 				children: i(R, M)
 			}), c]
-		}), a?.()] }), x(Ho, {
+		}), s?.()] }), x(Xo, {
 			itemCount: n,
 			itemHeight: d,
 			selection: E,
@@ -4964,13 +5048,13 @@ var Fo = {
 			}
 		})]
 	});
-}), Uo = {
+}), Zo = {
 	light: {},
 	dark: {
 		"color-base-100": "#1e1e1e",
 		"color-base-300": "#3a3a3a"
 	}
-}, Ko = {
+}, Jo = {
 	light: {
 		"color-base-100": "#f2f2f2",
 		"color-base-hover": "#ececec",
@@ -4981,7 +5065,7 @@ var Fo = {
 		"color-base-hover": "#2e2e2e",
 		"color-base-300": "#4a4a4a"
 	}
-}, jo = (e, ...t) => D(e, Uo[e], ...t), Go = (e, ...t) => D(e, Ko[e], ...t), Xo = ({ app: e, grid: t = Uo, header: n = Ko, layer: o = "sxl-defaults", scope: r } = {}) => {
+}, Qo = (e, ...t) => D(e, Zo[e], ...t), er = (e, ...t) => D(e, Jo[e], ...t), tr = ({ app: e, grid: t = Zo, header: n = Jo, layer: o = "sxl-defaults", scope: r } = {}) => {
 	const l = e ?? k, i = Object.fromEntries(Object.keys(n).map((e) => [e, {
 		"color-base-100": l[e]?.["color-base-200"],
 		...n[e]
@@ -4996,4 +5080,4 @@ var Fo = {
 		scope: r
 	});
 };
-export { Kt as AUTO_SCROLL_INTERVAL_MS, In as CellLayer, En as CellTileDiv, Wo as CheckboxList, jn as DEFAULT_ANCHOR_STYLE, _t as DEFAULT_HANDLE_STYLE, Kn as DEFAULT_MULTI_STYLE, Gn as DEFAULT_REMOVE_PREVIEW_STYLE, Un as DEFAULT_SINGLE_STYLE, hn as DefaultCellRenderer, vo as DefaultEditable, Eo as DefaultEditorInput, Po as DefaultHeaderDivider, Bn as DefaultSelection, en as DragHandle, ln as Draggable, jt as EDGE_AUTO_SCROLL_MARGIN_PX, po as EditSession, Co as EditorDiv, Io as EditorLayer, gn as FillHandle, Uo as GRID_SURFACE, No as Grid, Fe as GridSurface, On as GridlineLayer, Ko as HEADER_SURFACE, Do as HeaderDividerAnchor, Ot as HoverTipLayer, et as Layer, ie as LineSVG, Ho as List, ao as PICKER_COLORS, an as RESIZE_ANCHORS_4, cn as RESIZE_ANCHORS_8, Ht as RangePrompt, Wt as RangeRect, dn as RangeResizer, ho as RangesPickerLayer, se as RectangleSVG, Ln as SELECTION_CLIP_INSETS, lo as SelectionLayer, Yn as SelectionTouchGrips, re as ShapeBoundsContext, Et as StickyAnchor, kt as StickyFloat, Be as SurfaceStateContext, Ae as SurfaceStateProvider, lt as VirtualDiv, Xo as buildGridThemeCSS, ne as createAxis, Yt as createDragCells, Lo as createHeaderSelectionPointer, Le as createSurfaceStateStore, qt as createWindowDragCells, go as defaultRangeStyle, Gt as edgeScrollPane, yo as expandEditorBounds, jo as gridThemeVars, Oo as headerAnchorCell, zo as headerEntireEnd, To as headerEntireStart, $o as headerRange, Go as headerThemeVars, mo as startEventFromKey, Zt as useDragCells, xo as useEditorKeymap, Rt as useGridFloatTheme, oe as useGridMetrics, qe as useGridPane, Ze as useGridPaneOptional, Bo as useHeaderSelectionPointer, Tt as useHoverIntent, Qe as useLayer, wo as usePendingCaret, zt as useRangeHover, Xn as useSelectionPointer, le as useShapeBounds, bt as useSticky, St as useStickyOptional, Je as useSurfaceState, Jt as useWindowDragCells };
+export { Zt as AUTO_SCROLL_INTERVAL_MS, Dn as CellLayer, kn as CellTileDiv, qo as CheckboxList, Jn as DEFAULT_ANCHOR_STYLE, Xt as DEFAULT_HANDLE_STYLE, Zn as DEFAULT_MULTI_STYLE, Qn as DEFAULT_REMOVE_PREVIEW_STYLE, qn as DEFAULT_SINGLE_STYLE, vn as DefaultCellRenderer, Co as DefaultEditable, ko as DefaultEditorInput, $o as DefaultHeaderDivider, _n as DefaultSelection, an as DragHandle, gn as Draggable, Jt as EDGE_AUTO_SCROLL_MARGIN_PX, bo as EditSession, To as EditorDiv, Do as EditorLayer, xn as FillHandle, Zo as GRID_SURFACE, Uo as Grid, Ve as GridSurface, Fn as GridlineLayer, Jo as HEADER_SURFACE, Bo as HeaderDividerAnchor, Ft as HoverTipLayer, tt as Layer, ae as LineSVG, Xo as List, Go as ListSurface, po as PICKER_COLORS, fn as RESIZE_ANCHORS_4, pn as RESIZE_ANCHORS_8, Nt as RangeFloatLayer, Gt as RangePrompt, Yt as RangeRect, mn as RangeResizer, vo as RangesPickerLayer, se as RectangleSVG, Hn as SELECTION_CLIP_INSETS, go as SelectionLayer, to as SelectionTouchGrips, le as ShapeBoundsContext, It as StickyAnchor, Dt as StickyFloat, Ae as SurfaceStateContext, Ne as SurfaceStateProvider, it as VirtualDiv, tr as buildGridThemeCSS, oe as createAxis, tn as createDragCells, Ho as createHeaderSelectionPointer, Be as createSurfaceStateStore, nn as createWindowDragCells, xo as defaultRangeStyle, Qt as edgeScrollPane, Ro as expandEditorBounds, Qo as gridThemeVars, Fo as headerAnchorCell, No as headerEntireEnd, Ao as headerEntireStart, Vo as headerRange, er as headerThemeVars, So as startEventFromKey, on as useDragCells, Io as useEditorKeymap, Mt as useGridFloatTheme, re as useGridMetrics, Ze as useGridPane, Je as useGridPaneOptional, _o as useHeaderSelectionPointer, Ot as useHoverIntent, et as useLayer, Eo as usePendingCaret, zt as useRangeHover, eo as useSelectionPointer, ie as useShapeBounds, St as useSticky, Et as useStickyOptional, Qe as useSurfaceState, rn as useWindowDragCells };