react-table-dnd 2.0.0

package/dist/index.es.js

@@ -0,0 +1,1236 @@
+import { createContext as e, forwardRef as t, memo as n, useCallback as r, useContext as i, useEffect as a, useImperativeHandle as o, useLayoutEffect as s, useMemo as c, useRef as l, useState as u } from "react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { flushSync as p } from "react-dom";
+import m from "classnames";
+//#region \0rolldown/runtime.js
+var h = (e, t) => () => (t || e((t = { exports: {} }).exports, t), t.exports), g = /* @__PURE__ */ ((e) => typeof require < "u" ? require : typeof Proxy < "u" ? new Proxy(e, { get: (e, t) => (typeof require < "u" ? require : e)[t] }) : e)(function(e) {
+	if (typeof require < "u") return require.apply(this, arguments);
+	throw Error("Calling `require` for \"" + e + "\" in an environment that doesn't expose the `require` function. See https://rolldown.rs/in-depth/bundling-cjs#require-external-modules for more details.");
+}), _ = ({ children: e, className: t }) => /* @__PURE__ */ d("div", {
+	"data-flexitable-root": "",
+	className: t ?? "",
+	children: e
+}), v = /* @__PURE__ */ h(((e) => {
+	var t = g("react");
+	function n(e, t) {
+		return e === t && (e !== 0 || 1 / e == 1 / t) || e !== e && t !== t;
+	}
+	var r = typeof Object.is == "function" ? Object.is : n, i = t.useState, a = t.useEffect, o = t.useLayoutEffect, s = t.useDebugValue;
+	function c(e, t) {
+		var n = t(), r = i({ inst: {
+			value: n,
+			getSnapshot: t
+		} }), c = r[0].inst, u = r[1];
+		return o(function() {
+			c.value = n, c.getSnapshot = t, l(c) && u({ inst: c });
+		}, [
+			e,
+			n,
+			t
+		]), a(function() {
+			return l(c) && u({ inst: c }), e(function() {
+				l(c) && u({ inst: c });
+			});
+		}, [e]), s(n), n;
+	}
+	function l(e) {
+		var t = e.getSnapshot;
+		e = e.value;
+		try {
+			var n = t();
+			return !r(e, n);
+		} catch {
+			return !0;
+		}
+	}
+	function u(e, t) {
+		return t();
+	}
+	var d = typeof window > "u" || window.document === void 0 || window.document.createElement === void 0 ? u : c;
+	e.useSyncExternalStore = t.useSyncExternalStore === void 0 ? d : t.useSyncExternalStore;
+})), y = /* @__PURE__ */ h(((e) => {
+	process.env.NODE_ENV !== "production" && (function() {
+		function t(e, t) {
+			return e === t && (e !== 0 || 1 / e == 1 / t) || e !== e && t !== t;
+		}
+		function n(e, t) {
+			d || a.startTransition === void 0 || (d = !0, console.error("You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release."));
+			var n = t();
+			if (!f) {
+				var i = t();
+				o(n, i) || (console.error("The result of getSnapshot should be cached to avoid an infinite loop"), f = !0);
+			}
+			i = s({ inst: {
+				value: n,
+				getSnapshot: t
+			} });
+			var p = i[0].inst, m = i[1];
+			return l(function() {
+				p.value = n, p.getSnapshot = t, r(p) && m({ inst: p });
+			}, [
+				e,
+				n,
+				t
+			]), c(function() {
+				return r(p) && m({ inst: p }), e(function() {
+					r(p) && m({ inst: p });
+				});
+			}, [e]), u(n), n;
+		}
+		function r(e) {
+			var t = e.getSnapshot;
+			e = e.value;
+			try {
+				var n = t();
+				return !o(e, n);
+			} catch {
+				return !0;
+			}
+		}
+		function i(e, t) {
+			return t();
+		}
+		typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
+		var a = g("react"), o = typeof Object.is == "function" ? Object.is : t, s = a.useState, c = a.useEffect, l = a.useLayoutEffect, u = a.useDebugValue, d = !1, f = !1, p = typeof window > "u" || window.document === void 0 || window.document.createElement === void 0 ? i : n;
+		e.useSyncExternalStore = a.useSyncExternalStore === void 0 ? p : a.useSyncExternalStore, typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ < "u" && typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop == "function" && __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
+	})();
+})), b = (/* @__PURE__ */ h(((e, t) => {
+	process.env.NODE_ENV === "production" ? t.exports = v() : t.exports = y();
+})))(), x = e(null), S = (e) => {
+	let t = i(x);
+	if (!t) throw Error("useTableStore must be used within TableProvider");
+	return (0, b.useSyncExternalStore)(t.subscribe, () => e(t.getState()));
+}, C = () => {
+	let e = i(x);
+	if (!e) throw Error("useTableDispatch must be used within TableProvider");
+	return e.dispatch;
+}, w = () => {
+	let e = i(x);
+	if (!e) throw Error("useTable must be used within a TableProvider");
+	return {
+		state: (0, b.useSyncExternalStore)(e.subscribe, e.getState),
+		dispatch: e.dispatch
+	};
+};
+//#endregion
+//#region src/Components/TableContainer/store.ts
+function T(e, t) {
+	let n = t, r = /* @__PURE__ */ new Set();
+	return {
+		getState: () => n,
+		dispatch(t) {
+			n = e(n, t), r.forEach((e) => e());
+		},
+		subscribe(e) {
+			return r.add(e), () => {
+				r.delete(e);
+			};
+		}
+	};
+}
+//#endregion
+//#region src/hooks/useAutoScroll.ts
+var E = 30, D = (e) => {
+	let { headerRef: t, bodyRef: n } = e, i = l(null), o = l(t), s = l(!1), c = l(!1), u = l(0), d = l(null), f = l({
+		x: 0,
+		y: 0
+	}), p = l(null), m = r((e) => {
+		p.current = e;
+	}, []), h = r(() => {
+		c.current = !1, s.current = !1, d.current !== null && (cancelAnimationFrame(d.current), d.current = null);
+	}, []), g = r((e, t, n) => {
+		let r = n === "vertical", a = r ? c : s;
+		if (!a.current) return;
+		let l = p.current;
+		if (l) {
+			let e = f.current;
+			if (r) {
+				let t = e.y < l.top + E, n = e.y > l.bottom - E;
+				if (!t && !n) {
+					a.current = !1;
+					return;
+				}
+			} else {
+				let t = e.x < l.left + E, n = e.x > l.right - E;
+				if (!t && !n) {
+					a.current = !1;
+					return;
+				}
+			}
+		}
+		let m = r ? t.scrollHeight - t.clientHeight : t.scrollWidth - t.clientWidth;
+		if (r) t.scrollTop += e;
+		else {
+			t.scrollLeft += e;
+			let n = o.current;
+			n?.current && (n.current.scrollLeft = t.scrollLeft);
+		}
+		let h = r ? t.scrollTop : t.scrollLeft;
+		if (h >= m || h <= 0) {
+			a.current = !1;
+			return;
+		}
+		u.current += e / 1e3, d.current = requestAnimationFrame(() => i.current?.(e + u.current, t, n));
+	}, []);
+	return a(() => {
+		i.current = g;
+	}, [g]), {
+		startAutoScroll: r((e, t, n) => {
+			let r = n === "vertical" ? c : s;
+			r.current || (r.current = !0, u.current = 0, d.current = requestAnimationFrame(() => g(e, t, n)));
+		}, [g]),
+		stopAutoScroll: h,
+		setContainerRect: m,
+		isAutoScrollingVertical: c,
+		isAutoScrollingHorizontal: s,
+		pointerRef: f,
+		BodyScrollHandle: r((e) => {
+			t?.current && e.currentTarget && (t.current.scrollLeft = e.currentTarget.scrollLeft);
+		}, [t]),
+		HeaderScrollHandle: r((e) => {
+			n?.current && e.currentTarget && (n.current.scrollLeft = e.currentTarget.scrollLeft);
+		}, [n])
+	};
+}, O = 300, k = 8, A = .92, j = .5;
+function M(e, t, n, i) {
+	let a = l(null), o = l({
+		x: 0,
+		y: 0
+	}), s = l(null), c = l(!1), u = l(null), d = l(null), f = r(() => {
+		d.current !== null && (cancelAnimationFrame(d.current), d.current = null);
+	}, []), p = r(() => {
+		a.current &&= (clearTimeout(a.current), null), s.current = null, u.current &&= (u.current(), null);
+	}, []);
+	return {
+		touchStart: r((r) => {
+			if (r.target === r.currentTarget) return;
+			let l = r.target, m = !1;
+			for (; l && !(l.dataset?.contextid || l.dataset?.disabled === "true");) {
+				if (l.dataset?.id) {
+					m = !0;
+					break;
+				}
+				l = l.parentNode;
+			}
+			if (!m) return;
+			f(), p(), c.current = !0, window.getSelection()?.removeAllRanges();
+			let h = r.touches[0];
+			o.current = {
+				x: h.clientX,
+				y: h.clientY
+			}, s.current = r;
+			let g = e.tableRef?.current;
+			if (!g) return;
+			let _ = !1, v = !1, y = h.clientY, b = h.clientX, x = 0, S = 0, C = Date.now(), w = (e) => e.preventDefault();
+			document.addEventListener("selectstart", w);
+			let T = ((t) => {
+				let n = e.bodyRef?.current, r = t;
+				for (; r && r !== n;) {
+					let e = window.getComputedStyle(r), t = e.overflowY, n = e.overflowX, i = (t === "auto" || t === "scroll") && r.scrollHeight > r.clientHeight, a = (n === "auto" || n === "scroll") && r.scrollWidth > r.clientWidth;
+					if (i || a) return r;
+					r = r.parentElement;
+				}
+				return n ?? document.body;
+			})(r.target), E = (t) => {
+				t.preventDefault();
+				let n = t.touches[0], r = Date.now(), c = Math.max(r - C, 1);
+				if (C = r, v) {
+					let t = n.clientY - y, r = n.clientX - b;
+					if (T) {
+						let n = e.bodyRef?.current, i = t > 0 && T.scrollTop <= 0, a = t < 0 && T.scrollTop + T.clientHeight >= T.scrollHeight - 1, o = r > 0 && T.scrollLeft <= 0, s = r < 0 && T.scrollLeft + T.clientWidth >= T.scrollWidth - 1, c = i || a, l = o || s;
+						T === n ? (T.scrollTop -= t, T.scrollLeft -= r) : (l || (T.scrollLeft -= r), c || (T.scrollTop -= t), n && (c && (n.scrollTop -= t), l && (n.scrollLeft -= r)));
+					}
+					x = -t / c * 16, S = -r / c * 16, y = n.clientY, b = n.clientX;
+				} else if (_) i(n.clientX, n.clientY);
+				else {
+					let e = n.clientX - o.current.x, t = n.clientY - o.current.y;
+					(Math.abs(e) > k || Math.abs(t) > k) && (a.current &&= (clearTimeout(a.current), null), s.current = null, v = !0, y = n.clientY, b = n.clientX, x = 0, S = 0, C = Date.now());
+				}
+			}, D = () => {
+				if (_) M(), n();
+				else {
+					if (p(), v && T && (Math.abs(x) > j || Math.abs(S) > j)) {
+						let e = T, t = () => {
+							x *= A, S *= A, e.scrollTop += x, e.scrollLeft += S, Math.abs(x) > j || Math.abs(S) > j ? d.current = requestAnimationFrame(t) : d.current = null;
+						};
+						d.current = requestAnimationFrame(t);
+					}
+					setTimeout(() => {
+						c.current = !1;
+					}, 400);
+				}
+			}, M = () => {
+				g.removeEventListener("touchmove", E), g.removeEventListener("touchend", D), g.removeEventListener("touchcancel", D), document.removeEventListener("selectstart", w), u.current = null;
+			};
+			g.addEventListener("touchmove", E, { passive: !1 }), g.addEventListener("touchend", D, !1), g.addEventListener("touchcancel", D, !1), u.current = M, a.current = setTimeout(() => {
+				a.current = null, _ = !0;
+				let e = s.current;
+				s.current = null, e && t(e, h.clientX, h.clientY);
+			}, O);
+		}, [
+			t,
+			n,
+			i,
+			p,
+			f,
+			e.tableRef?.current,
+			e.bodyRef?.current
+		]),
+		cancelLongPress: p,
+		isTouchActiveRef: c
+	};
+}
+//#endregion
+//#region src/hooks/useShiftTransforms.ts
+var N = "transform 450ms cubic-bezier(0.2, 0, 0, 1)", ee = (e, t, n, i) => {
+	let a = l({
+		width: 0,
+		height: 0
+	}), o = l(null), s = l(/* @__PURE__ */ new Set()), c = l(/* @__PURE__ */ new Set()), u = l(/* @__PURE__ */ new Map()), d = r((t, n, r, i) => {
+		let o = e.placeholderRef?.current;
+		if (!o || !t) {
+			o && (o.style.display = "none");
+			return;
+		}
+		let s = a.current, c = t.getBoundingClientRect(), l = e.tableRef?.current?.getBoundingClientRect(), u = (n ?? 0) < (r ?? 0);
+		o.style.display = "block", i === "row" ? (o.style.top = `${u ? c.top + c.height - s.height : c.top}px`, o.style.left = `${l?.left ?? c.left}px`, o.style.width = `${l?.width ?? c.width}px`, o.style.height = `${s.height}px`) : (o.style.top = `${l?.top ?? c.top}px`, o.style.left = `${u ? c.left + c.width - s.width : c.left}px`, o.style.width = `${s.width}px`, o.style.height = `${l?.height ?? c.height}px`);
+	}, [e.placeholderRef, e.tableRef]);
+	return {
+		applyShiftTransforms: r((e, r, l) => {
+			if (e === null || r === null) return;
+			let f = a.current, p = o.current, m = p === null, h = m ? -Infinity : Math.min(p, r, e) - 1, g = m ? Infinity : Math.max(p, r, e) + 1, _ = null, v = (l === "row" ? t.current : n.current).get(r);
+			v && (_ = v.outer), d(_, e, r, l);
+			let y = (t, n, i) => {
+				let a = (t, a, o) => {
+					let c = "";
+					t > e && t <= r ? c = `translate${n}(-${i}px)` : t < e && t >= r && (c = `translate${n}(${i}px)`), o.style.transform = c, o.style.transition = t === e ? "none" : N, c && s.current.add(o), t === r ? a.setAttribute("data-drop-target", "true") : a.removeAttribute("data-drop-target");
+				};
+				if (m) for (let [e, { outer: n, inner: r }] of t) a(e, n, r);
+				else for (let e = h; e <= g; e++) {
+					let n = t.get(e);
+					n && a(e, n.outer, n.inner);
+				}
+			};
+			if (l === "row") y(t.current, "Y", f.height);
+			else if (l === "column") {
+				y(n.current, "X", f.width);
+				let t = i.current, a = u.current, o = (t, n, i) => {
+					let o = "";
+					t > e && t <= r ? o = `translateX(-${f.width}px)` : t < e && t >= r && (o = `translateX(${f.width}px)`);
+					for (let e of n) a.get(e) !== o && (e.style.transform = o, i && (e.style.transition = N), a.set(e, o), o && c.current.add(e));
+				};
+				if (m) for (let [e, n] of t) o(e, n, !0);
+				else for (let e = h; e <= g; e++) {
+					let n = t.get(e);
+					n && o(e, n, !1);
+				}
+			}
+			o.current = r;
+		}, [
+			d,
+			t,
+			n,
+			i
+		]),
+		clearShiftTransforms: r(() => {
+			let t = e.placeholderRef?.current;
+			t && (t.style.display = "none");
+			for (let e of s.current) {
+				e.style.transition = "none", e.style.transform = "";
+				let t = e.parentElement;
+				t && t.removeAttribute("data-drop-target");
+			}
+			s.current.clear();
+			for (let e of c.current) e.style.transition = "none", e.style.transform = "";
+			c.current.clear(), u.current.clear(), o.current = null;
+		}, [e.placeholderRef]),
+		prevTargetIndexRef: o,
+		draggedSizeRef: a
+	};
+}, te = (e) => {
+	let t = l(/* @__PURE__ */ new Map()), n = l(/* @__PURE__ */ new Map()), i = l(/* @__PURE__ */ new Map()), a = l(!1), o = r(() => {
+		t.current.clear(), n.current.clear(), i.current.clear();
+	}, []), s = r((e) => {
+		t.current.clear();
+		let n = e.querySelectorAll(".draggable[data-type=\"row\"]");
+		for (let e = 0; e < n.length; e++) {
+			let r = n[e], i = r.dataset.index;
+			if (i === void 0) continue;
+			let a = r.firstElementChild;
+			a && t.current.set(+i, {
+				outer: r,
+				inner: a
+			});
+		}
+	}, []), c = r((e) => {
+		n.current.clear();
+		let t = e.querySelectorAll(".draggable[data-type=\"column\"]");
+		for (let e = 0; e < t.length; e++) {
+			let r = t[e], i = r.dataset.index;
+			if (i === void 0) continue;
+			let a = r.firstElementChild;
+			a && n.current.set(+i, {
+				outer: r,
+				inner: a
+			});
+		}
+	}, []), u = r((e) => {
+		i.current.clear();
+		let t = e.querySelectorAll(".td[data-col-index]");
+		for (let e = 0; e < t.length; e++) {
+			let n = t[e], r = +n.dataset.colIndex;
+			i.current.has(r) || i.current.set(r, []), i.current.get(r).push(n);
+		}
+	}, []);
+	return {
+		rowIndexMapRef: t,
+		colIndexMapRef: n,
+		cellIndexMapRef: i,
+		mapStaleRef: a,
+		buildMaps: r((t, n) => {
+			if (o(), n) {
+				if (t === "row") s(n);
+				else if (t === "column") {
+					let t = e.headerRef?.current;
+					t && c(t), u(n);
+				}
+			}
+		}, [
+			e.headerRef,
+			o,
+			s,
+			c,
+			u
+		]),
+		rebuildRowMap: r((e) => {
+			a.current = !1, s(e);
+		}, [s]),
+		rebuildColumnMaps: r((e, t) => {
+			a.current = !1, t && c(t), u(e);
+		}, [c, u]),
+		checkStaleness: r(() => {
+			if (!a.current) {
+				if (t.current.size > 0) {
+					let e = t.current.values().next().value;
+					if (e && !e.outer.isConnected) {
+						a.current = !0;
+						return;
+					}
+				}
+				if (n.current.size > 0) {
+					let e = n.current.values().next().value;
+					e && !e.outer.isConnected && (a.current = !0);
+				}
+			}
+		}, []),
+		clearMaps: o
+	};
+}, P = (e, t) => {
+	let n = e, r = 0, i = t.length - 1;
+	for (; r < i;) {
+		let e = Math.floor((r + i) / 2), a = t[e];
+		if (a.itemTop <= n && n <= a.itemBottom) return n < a.itemTop + a.height / 2 ? +a.index : +a.index + 1;
+		n < a.itemTop ? i = e - 1 : r = e + 1;
+	}
+	return +t[r].index;
+}, F = (e, t) => {
+	let n = e, r = 0, i = t.length - 1;
+	for (; r < i;) {
+		let e = Math.floor((r + i) / 2), a = t[e];
+		if (a.itemLeft <= n && n <= a.itemRight) return n < a.itemLeft + a.width / 2 ? +a.index : +a.index + 1;
+		n < a.itemLeft ? i = e - 1 : r = e + 1;
+	}
+	return +t[r].index;
+};
+function ne(e, t, n) {
+	let r = n.getBoundingClientRect();
+	return e > r.left + n.clientWidth || t > r.top + n.clientHeight;
+}
+var I = (e, t, n) => {
+	let r = Number(e);
+	return t !== void 0 && r < t || n !== void 0 && r > n;
+}, re = (e, t) => {
+	let n = l(null), i = l(null), a = r(() => {
+		let n = e.bodyRef?.current;
+		if (!n) return null;
+		let r = n.scrollTop, i = n.getBoundingClientRect().top, a = n.querySelectorAll(".draggable[data-type=\"row\"]"), o = [];
+		for (let e = 0; e < a.length; e++) {
+			let t = a[e];
+			if (t.dataset.index === void 0) continue;
+			let n = t.getBoundingClientRect(), s = n.top - i + r;
+			o.push({
+				height: n.height,
+				itemTop: s,
+				itemBottom: s + n.height,
+				index: t.dataset.index
+			});
+		}
+		let { start: s, end: c } = t.rowDragRange;
+		return (s || c) && (o = o.filter((e) => (!s || +e.index >= s) && (!c || +e.index <= c))), o;
+	}, [e.bodyRef, t.rowDragRange]), o = r(() => {
+		let n = e.headerRef?.current;
+		if (!n || !n.children[0]) return null;
+		let r = Array.from(n.children[0].children).map((e) => {
+			let t = e.getBoundingClientRect();
+			return {
+				left: t.left,
+				width: t.width,
+				itemLeft: t.left,
+				itemRight: t.left + t.width,
+				index: e.dataset.index
+			};
+		}).filter((e) => e.index !== void 0), { start: i, end: a } = t.columnDragRange ?? {};
+		return (i !== void 0 || a !== void 0) && (r = r.filter((e) => {
+			let t = +e.index;
+			return (i === void 0 || t >= i) && (a === void 0 || t <= a);
+		})), r;
+	}, [e.headerRef, t.columnDragRange]);
+	return {
+		computeRowItems: a,
+		computeColumnItems: o,
+		resolveDropIndex: r((e, t, r, i, s, c, l) => {
+			let u;
+			if (r === "row") {
+				if (u = n.current, u || (u = a(), n.current = u), u && u.length > 0) return P(t - c.y + l.height / 2 - i.top + s, u);
+			} else if (u = n.current, u || (u = o(), n.current = u), u && u.length > 0) return F(e - c.x + l.width / 2, u);
+			return 0;
+		}, [a, o]),
+		cachedItemsRef: n,
+		cachedContainerRef: i
+	};
+}, L = 200, R = 30, z = 5;
+function ie(e) {
+	let t = e, n = !1;
+	for (; t;) {
+		if (t.dataset?.dragHandle === "true" && (n = !0), t.dataset?.contextid || t.dataset?.disabled === "true") return null;
+		if (t.dataset?.id) return {
+			element: t,
+			foundHandle: n
+		};
+		t = t.parentNode;
+	}
+	return null;
+}
+var B = (e, t, n, i, o, c) => {
+	let { startAutoScroll: u, stopAutoScroll: d, setContainerRect: f, pointerRef: m, isAutoScrollingVertical: h, isAutoScrollingHorizontal: g } = D(e), _ = te(e), { rowIndexMapRef: v, colIndexMapRef: y, cellIndexMapRef: b, mapStaleRef: x } = _, { applyShiftTransforms: S, clearShiftTransforms: C, prevTargetIndexRef: w, draggedSizeRef: T } = ee(e, v, y, b), E = re(e, o), { resolveDropIndex: O, cachedItemsRef: k, cachedContainerRef: A } = E, j = l(null), N = l({
+		x: 0,
+		y: 0
+	}), P = l(null), F = l(null), I = l(!1), B = l(!1), V = l(null), H = l(null), U = l([]), W = r((t, r, i) => {
+		let a = ie(t.target);
+		if (!a) return;
+		let { element: o, foundHandle: s } = a;
+		if (!s && o.querySelector("[data-drag-handle]")) return;
+		let c = o.dataset.id, l = +o.dataset.index, u = o.dataset.type;
+		j.current = u ?? null, P.current = l, F.current = null, V.current = null, U.current = [], w.current = null, I.current = !1;
+		let d = u === "row" ? e.bodyRef?.current?.scrollLeft ?? 0 : 0, p = o.getBoundingClientRect();
+		T.current = {
+			width: p.width,
+			height: p.height
+		};
+		let h = {
+			x: r - p.left - d,
+			y: i - p.top
+		};
+		N.current = h, m.current = {
+			x: r,
+			y: i
+		};
+		let g = {
+			x: p.left + d,
+			y: p.top
+		};
+		k.current = u === "row" ? E.computeRowItems() : E.computeColumnItems();
+		let v = e.bodyRef?.current;
+		v && (A.current = v.getBoundingClientRect(), f(A.current)), _.buildMaps(u, v ?? null);
+		let y = e.tableRef?.current;
+		y && (y.style.touchAction = "none");
+		let b = o.firstElementChild;
+		b && (b.style.opacity = "0", b.style.pointerEvents = "none", b.style.zIndex = "2", b.style.cursor = "-webkit-grabbing"), H.current = b;
+		let x = e.cloneRef?.current;
+		if (x) {
+			if (x.innerHTML = "", x.style.transform = `translate(${g.x}px, ${g.y}px)`, B.current = (v?.querySelector("[data-type=\"row\"]"))?.style.position === "absolute", u === "row") {
+				let e = o.firstElementChild?.firstElementChild;
+				e && x.appendChild(e.cloneNode(!0));
+			} else if (u === "column" && v) {
+				let e = String(l), t = o.querySelector(".th");
+				if (t) {
+					let e = document.createElement("div");
+					e.style.flexShrink = "0", e.style.order = "-1", e.appendChild(t.cloneNode(!0)), x.appendChild(e);
+				}
+				let n = document.createElement("div");
+				n.style.flex = "1";
+				let r = document.createElement("div");
+				r.className = "rbody", r.style.height = `${v.scrollHeight}px`, r.style.position = "relative", v.querySelectorAll("[data-type=\"row\"]").forEach((t) => {
+					let n = t.cloneNode(!0);
+					if (B.current) {
+						let t = n.querySelector(".tr");
+						if (t) {
+							let n = t.querySelector(`[data-col-index="${e}"]`);
+							for (; t.firstChild;) t.removeChild(t.firstChild);
+							n && t.appendChild(n);
+						}
+					} else n.querySelectorAll("[data-col-index]").forEach((t) => {
+						t.getAttribute("data-col-index") !== e && t.remove();
+					});
+					r.appendChild(n);
+				}), n.appendChild(r), B.current ? (n.style.overflow = "auto", n.style.scrollbarWidth = "none", n.className = "clone-body-strip") : n.style.overflow = "hidden", x.appendChild(n), V.current = n, U.current = [], v.querySelectorAll(`[data-col-index="${e}"]`).forEach((e) => {
+					e.style.opacity = "0", U.current.push(e);
+				});
+			}
+		}
+		n({
+			type: "dragStart",
+			value: {
+				rect: {
+					draggedItemHeight: p.height,
+					draggedItemWidth: p.width
+				},
+				dragged: {
+					initial: h,
+					translate: g,
+					draggedID: c ?? null,
+					isDragging: !0,
+					sourceIndex: l
+				},
+				dragType: u ?? null,
+				tableDimensions: {
+					height: (e.tableRef?.current?.offsetHeight ?? 0) - (v ? v.offsetHeight - v.clientHeight : 0),
+					width: (e.tableRef?.current?.offsetWidth ?? 0) - (v ? v.offsetWidth - v.clientWidth : 0)
+				}
+			}
+		});
+		let S = v?.scrollLeft ?? 0, C = v?.scrollTop ?? 0;
+		requestAnimationFrame(() => {
+			let t = e.cloneRef?.current;
+			t && (u === "row" ? t.scrollLeft = S : V.current && (V.current.scrollTop = C));
+		});
+	}, [
+		n,
+		e,
+		m,
+		f,
+		E,
+		_,
+		k,
+		A,
+		T,
+		w
+	]), G = r((t, r, i, a, o) => {
+		let s = e.cloneRef?.current;
+		s && (s.style.visibility = "hidden"), H.current &&= (H.current.style.opacity = "", H.current.style.pointerEvents = "", H.current.style.zIndex = "", H.current.style.cursor = "", null), U.current.forEach((e) => {
+			e.style.opacity = "";
+		}), U.current = [];
+		let l = e.tableRef?.current;
+		l && (l.style.touchAction = ""), p(() => {
+			c && t !== null && r !== null && (i === "row" || i === "column") && c({
+				sourceIndex: t,
+				targetIndex: r,
+				dragType: i
+			}), n({
+				type: "dragEnd",
+				value: {
+					targetIndex: r,
+					sourceIndex: t
+				}
+			});
+		}), C();
+		let u = e.bodyRef?.current;
+		u && (u.scrollTop = a, u.scrollLeft = o, requestAnimationFrame(() => {
+			u.scrollTop = a, u.scrollLeft = o;
+		}));
+	}, [
+		n,
+		e.bodyRef,
+		e.cloneRef,
+		e.tableRef,
+		C,
+		c
+	]), K = r(() => {
+		if (I.current) return;
+		I.current = !0, Y(), setTimeout(() => {
+			X.current = !1;
+		}, 400);
+		let t = F.current, n = P.current, r = j.current, i = e.bodyRef?.current, a = i?.scrollTop ?? 0, o = i?.scrollLeft ?? 0;
+		k.current = null, A.current = null, d(), j.current = null, P.current = null, F.current = null;
+		let s = e.cloneRef?.current, c = e.placeholderRef?.current;
+		if (s && c && c.style.display !== "none") {
+			let e = parseFloat(c.style.left) || 0, i = parseFloat(c.style.top) || 0;
+			s.style.transition = `transform ${L}ms cubic-bezier(0.2, 0, 0, 1)`, s.style.transform = `translate(${e}px, ${i}px)`, setTimeout(() => G(n, t, r, a, o), L);
+		} else G(n, t, r, a, o);
+	}, [
+		d,
+		e.bodyRef,
+		e.placeholderRef,
+		e.cloneRef,
+		G
+	]), q = l(() => {}), { touchStart: J, cancelLongPress: Y, isTouchActiveRef: X } = M(e, W, K, (e, t) => q.current(e, t)), Z = r((e) => {
+		e.button === 0 && e.target !== e.currentTarget && (X.current || ne(e.clientX, e.clientY, e.target) || W(e, e.clientX, e.clientY));
+	}, [W, X]), Q = r((t, n) => {
+		if (I.current) return;
+		let r = N.current;
+		m.current.x = t, m.current.y = n;
+		let a = e.bodyRef?.current;
+		if (!a) return;
+		let o = A.current;
+		(!o || x.current) && (o = a.getBoundingClientRect(), A.current = o);
+		let s = a.scrollLeft, c = a.scrollTop, l = e.cloneRef?.current;
+		l && (l.style.transform = `translate(${t - r.x}px, ${n - r.y}px)`, j.current === "row" ? l.scrollLeft = s : V.current && (V.current.scrollTop = c));
+		let f = j.current || i;
+		if (B.current && _.checkStaleness(), x.current && (k.current = null, F.current = null, w.current = null, B.current ? f === "row" ? _.rebuildRowMap(a) : _.rebuildColumnMaps(a, e.headerRef?.current ?? null) : x.current = !1), f === "row") if (n < o.top + R) u(-z, a, "vertical"), x.current = !0;
+		else if (n > o.bottom - R) u(z, a, "vertical"), x.current = !0;
+		else {
+			let t = h.current;
+			d(), t && requestAnimationFrame(() => {
+				let t = e.bodyRef?.current;
+				if (!t) return;
+				B.current && _.rebuildRowMap(t), k.current = null;
+				let n = t.getBoundingClientRect();
+				A.current = n;
+				let r = O(m.current.x, m.current.y, "row", n, t.scrollTop, N.current, T.current);
+				F.current = r, w.current = null, S(P.current, r, "row");
+			});
+		}
+		else if (t < o.left + R) u(-z, a, "horizontal"), x.current = !0;
+		else if (t > o.right - R) u(z, a, "horizontal"), x.current = !0;
+		else {
+			let t = g.current;
+			d(), t && requestAnimationFrame(() => {
+				let t = e.bodyRef?.current;
+				if (!t) return;
+				B.current && _.rebuildColumnMaps(t, e.headerRef?.current ?? null), k.current = null;
+				let n = t.getBoundingClientRect();
+				A.current = n;
+				let r = O(m.current.x, m.current.y, "column", n, t.scrollTop, N.current, T.current);
+				F.current = r, w.current = null, S(P.current, r, "column");
+			});
+		}
+		let p = O(t, n, f, o, c, r, T.current);
+		p !== F.current && (F.current = p, requestAnimationFrame(() => S(P.current, p, f)));
+	}, [
+		m,
+		e.bodyRef,
+		e.cloneRef,
+		e.headerRef,
+		i,
+		u,
+		d,
+		h,
+		g,
+		_,
+		O,
+		S,
+		k,
+		A,
+		x,
+		w,
+		T
+	]);
+	q.current = Q;
+	let $ = r(() => {
+		Y(), k.current = null, A.current = null;
+		let t = e.cloneRef?.current;
+		t && (t.style.visibility = "hidden");
+		let r = e.tableRef?.current;
+		r && (r.style.touchAction = ""), n({
+			type: "dragEnd",
+			value: {
+				targetIndex: null,
+				sourceIndex: null
+			}
+		}), d(), C(), j.current = null, P.current = null, F.current = null;
+	}, [
+		Y,
+		k,
+		A,
+		e.cloneRef,
+		e.tableRef,
+		n,
+		d,
+		C
+	]);
+	return s(() => {
+		if (!t.isDragging) {
+			C();
+			let t = e.cloneRef?.current;
+			t && (t.style.transition = "", t.style.transform = "translate(0px, 0px)", t.style.visibility = "", t.scrollLeft = 0, t.innerHTML = "");
+		}
+	}, [
+		t.isDragging,
+		C,
+		e.cloneRef
+	]), a(() => {
+		if (!t.isDragging) return;
+		let e = 0, n = 0, r = !1, i = (t) => {
+			e = t.clientX, n = t.clientY, r || (r = !0, requestAnimationFrame(() => {
+				r = !1, Q(e, n);
+			}));
+		}, a = () => K(), o = (e) => {
+			e.key === "Escape" && $();
+		};
+		return window.addEventListener("pointermove", i), window.addEventListener("pointerup", a), window.addEventListener("pointercancel", a), window.addEventListener("keydown", o), () => {
+			window.removeEventListener("pointermove", i), window.removeEventListener("pointerup", a), window.removeEventListener("pointercancel", a), window.removeEventListener("keydown", o);
+		};
+	}, [
+		t.isDragging,
+		Q,
+		K,
+		$
+	]), {
+		dragStart: Z,
+		touchStart: J
+	};
+}, V = {
+	columnDragRange: {
+		start: void 0,
+		end: void 0
+	},
+	rowDragRange: {
+		start: void 0,
+		end: void 0
+	},
+	defaultSizing: 50
+};
+function H(e, t) {
+	switch (t.type) {
+		case "setDragged": return {
+			...e,
+			dragged: {
+				...e.dragged,
+				...t.value
+			}
+		};
+		case "setDragType": return {
+			...e,
+			dragType: t.value
+		};
+		case "setTableDimensions": return {
+			...e,
+			tableDimensions: t.value
+		};
+		case "setRef": return {
+			...e,
+			refs: {
+				...e.refs,
+				[t.refName]: t.value
+			}
+		};
+		case "setBodyScrollBarWidth": return {
+			...e,
+			bodyScrollBarWidth: t.value
+		};
+		case "setWidths": return {
+			...e,
+			widths: t.value
+		};
+		case "setColumnIds": return {
+			...e,
+			columnIds: t.value
+		};
+		case "setOptions": return {
+			...e,
+			options: {
+				...e.options,
+				...t.value
+			}
+		};
+		case "dragStart": return {
+			...e,
+			rect: t.value.rect,
+			dragged: {
+				...e.dragged,
+				...t.value.dragged
+			},
+			dragType: t.value.dragType,
+			tableDimensions: t.value.tableDimensions
+		};
+		case "dragEnd": return {
+			...e,
+			dragged: {
+				initial: {
+					x: 0,
+					y: 0
+				},
+				translate: {
+					x: 0,
+					y: 0
+				},
+				isDragging: !1,
+				draggedID: null,
+				targetIndex: t.value?.targetIndex ?? null,
+				sourceIndex: t.value?.sourceIndex ?? null
+			},
+			dragType: null,
+			rect: {
+				draggedItemWidth: 0,
+				draggedItemHeight: 0
+			}
+		};
+		default: throw Error("Unhandled action");
+	}
+}
+var U = {
+	dragged: {
+		initial: {
+			x: 0,
+			y: 0
+		},
+		translate: {
+			x: 0,
+			y: 0
+		},
+		isDragging: !1,
+		draggedID: null,
+		targetIndex: null,
+		sourceIndex: null
+	},
+	dragType: null,
+	rect: {
+		draggedItemWidth: 0,
+		draggedItemHeight: 0
+	},
+	tableDimensions: {
+		height: 0,
+		width: 0
+	},
+	refs: {
+		tableRef: { current: null },
+		bodyRef: { current: null },
+		headerRef: { current: null },
+		cloneRef: { current: null },
+		placeholderRef: { current: null }
+	},
+	bodyScrollBarWidth: 0,
+	options: V,
+	widths: [],
+	columnIds: []
+}, W = {
+	position: "relative",
+	display: "flex",
+	flexFlow: "column"
+}, G = {
+	position: "fixed",
+	pointerEvents: "none",
+	zIndex: 3,
+	top: 0,
+	left: 0,
+	display: "none"
+}, K = t(({ children: e, className: t, style: n, options: r, onDragEnd: i, renderPlaceholder: s }, p) => {
+	let m = l(null), h = l(null), g = l(null);
+	o(p, () => m.current, []);
+	let [v] = u(() => T(H, U)), y = (0, b.useSyncExternalStore)(v.subscribe, v.getState), S = v.dispatch;
+	a(() => {
+		S({
+			type: "setRef",
+			refName: "tableRef",
+			value: m
+		}), S({
+			type: "setRef",
+			refName: "cloneRef",
+			value: h
+		}), S({
+			type: "setRef",
+			refName: "placeholderRef",
+			value: g
+		});
+	}, [m, S]), a(() => {
+		let e = () => {
+			m.current && S({
+				type: "setTableDimensions",
+				value: {
+					height: m.current.offsetHeight,
+					width: m.current.offsetWidth
+				}
+			});
+		};
+		return e(), window.addEventListener("resize", e), () => {
+			window.removeEventListener("resize", e);
+		};
+	}, [m, S]), a(() => {
+		r && S({
+			type: "setOptions",
+			value: r
+		});
+	}, [r, S]);
+	let { dragStart: C, touchStart: w } = B(y.refs, y.dragged, S, y.dragType, y.options, i), E = c(() => ({
+		position: "fixed",
+		zIndex: "5",
+		pointerEvents: "none",
+		top: 0,
+		left: 0,
+		display: "flex",
+		flexDirection: "column",
+		height: y.dragType === "row" ? y.rect.draggedItemHeight : `${y.tableDimensions.height}px`,
+		width: y.dragType === "column" ? `${y.rect.draggedItemWidth}px` : `${y.tableDimensions.width}px`,
+		overflow: "scroll",
+		scrollbarWidth: "none",
+		boxShadow: y.dragged.isDragging ? "0 0 10px 0 rgba(0, 0, 0, 0.1)" : "none"
+	}), [
+		y.dragType,
+		y.dragged.isDragging,
+		y.rect.draggedItemHeight,
+		y.rect.draggedItemWidth,
+		y.tableDimensions.height,
+		y.tableDimensions.width
+	]);
+	return /* @__PURE__ */ d(x.Provider, {
+		value: v,
+		children: /* @__PURE__ */ f(_, {
+			className: y.dragged.isDragging ? "is-dragging" : "",
+			children: [
+				/* @__PURE__ */ d("div", {
+					id: "portalroot",
+					style: {
+						...E,
+						visibility: y.dragged.isDragging ? "visible" : "hidden"
+					},
+					ref: h
+				}),
+				/* @__PURE__ */ d("div", {
+					ref: g,
+					style: G,
+					children: s ? s() : /* @__PURE__ */ d("div", { style: {
+						width: "100%",
+						height: "100%"
+					} })
+				}),
+				/* @__PURE__ */ d("div", {
+					"data-contextid": "context",
+					ref: m,
+					onMouseDown: C,
+					onTouchStart: w,
+					style: {
+						...W,
+						...n
+					},
+					className: `table ${t ?? ""}`,
+					children: e
+				})
+			]
+		})
+	});
+});
+K.displayName = "TableProvider";
+//#endregion
+//#region src/Components/TableHeader.tsx
+var q = t(({ children: e, style: t, className: n }, i) => {
+	let o = l(null), u = i || o, f = S((e) => e.bodyScrollBarWidth), p = S((e) => e.dragged.isDragging), m = S((e) => e.refs), h = C(), g = r((e) => "current" in e ? e.current : null, []);
+	a(() => {
+		o.current && h({
+			type: "setRef",
+			refName: "headerRef",
+			value: o
+		});
+	}, [h]);
+	let { HeaderScrollHandle: _ } = D(m), v = {
+		display: "flex",
+		flex: "1 0 auto"
+	}, y = c(() => ({
+		overflowX: "scroll",
+		overflowY: "clip",
+		scrollbarWidth: "none",
+		display: "flex",
+		paddingRight: `${f}px`,
+		userSelect: p ? "none" : "auto",
+		...t
+	}), [
+		f,
+		p,
+		t
+	]);
+	return s(() => {
+		let e = g(u);
+		e && h({
+			type: "setWidths",
+			value: Array.from(e.querySelectorAll(".th")).map((e) => {
+				let t = e.getAttribute("data-width");
+				return t ? parseInt(t, 10) : 0;
+			})
+		});
+	}, [
+		e,
+		h,
+		g,
+		u
+	]), s(() => {
+		let e = g(u);
+		e && h({
+			type: "setColumnIds",
+			value: Array.from(e.querySelectorAll(".draggable")).map((e) => e.getAttribute("data-id") || "")
+		});
+	}, [
+		e,
+		h,
+		g,
+		u
+	]), /* @__PURE__ */ d("div", {
+		className: `header ${n ?? ""}`,
+		children: /* @__PURE__ */ d("div", {
+			className: "thead",
+			style: y,
+			"data-droppableid": "header",
+			onScroll: _,
+			ref: u,
+			children: /* @__PURE__ */ d("div", {
+				style: v,
+				className: "tr",
+				children: e
+			})
+		})
+	});
+});
+q.displayName = "TableHeader";
+//#endregion
+//#region src/Components/Draggable.tsx
+var J = n(({ children: e, id: t, index: n, type: r, styles: i = {} }) => {
+	let o = S((e) => e.options.rowDragRange), s = S((e) => e.options.columnDragRange), u = c(() => r === "row" ? I(n, o.start, o.end) : I(n, s.start, s.end), [
+		n,
+		s.end,
+		s.start,
+		o.end,
+		o.start,
+		r
+	]), f = l(null), p = c(() => ({
+		cursor: u ? "auto" : "-webkit-grab",
+		display: "flex"
+	}), [u]);
+	return a(() => {
+		f.current && f.current.querySelector("[data-drag-handle]") && (f.current.style.cursor = "auto");
+	}, [e, u]), /* @__PURE__ */ d("div", {
+		className: "draggable",
+		"data-id": t,
+		"data-index": n,
+		"data-type": r,
+		"data-disabled": u ? "true" : "false",
+		style: i,
+		children: /* @__PURE__ */ d("div", {
+			ref: f,
+			style: p,
+			children: e
+		})
+	});
+});
+J.displayName = "Draggable";
+//#endregion
+//#region src/Components/ColumnCell.tsx
+var Y = n(({ children: e, style: t, className: n, ...r }) => {
+	let i = S((e) => e.options.defaultSizing), { width: a, flex: o, ...s } = t ?? {}, l = c(() => a === void 0 ? i : typeof a == "number" ? a : parseFloat(String(a)) || i, [a, i]), u = c(() => ({
+		width: `${l}px`,
+		flex: o === void 0 ? `${l} 0 auto` : o
+	}), [l, o]);
+	return /* @__PURE__ */ d(J, {
+		...r,
+		styles: u,
+		type: "column",
+		children: /* @__PURE__ */ d("div", {
+			className: `th ${n ?? ""}`,
+			"data-width": l,
+			style: {
+				width: "100%",
+				...s
+			},
+			children: e
+		})
+	});
+});
+Y.displayName = "ColumnCell";
+//#endregion
+//#region src/Components/TableBody.tsx
+var X = {
+	display: "flex",
+	overflow: "hidden",
+	flex: 1
+}, Z = t(({ children: e, style: t, className: n }, r) => {
+	let i = l(null);
+	o(r, () => i.current, []);
+	let s = S((e) => e.dragged.isDragging), u = S((e) => e.refs), f = C();
+	a(() => {
+		f({
+			type: "setRef",
+			refName: "bodyRef",
+			value: i
+		});
+	}, [f, i]);
+	let { BodyScrollHandle: p } = D(u), m = c(() => ({
+		overflowX: "auto",
+		overflowY: "auto",
+		flex: 1,
+		userSelect: s ? "none" : "auto",
+		...t
+	}), [s, t]);
+	return a(() => {
+		if (i.current) {
+			let e = i.current.clientWidth;
+			f({
+				type: "setBodyScrollBarWidth",
+				value: i.current.offsetWidth - e
+			});
+		}
+	}, [f, i]), /* @__PURE__ */ d("div", {
+		className: `body ${n ?? ""}`,
+		style: X,
+		children: /* @__PURE__ */ d("div", {
+			className: "ibody",
+			style: m,
+			"data-droppableid": "body",
+			onScroll: p,
+			ref: i,
+			children: e
+		})
+	});
+}), Q = {
+	display: "flex",
+	flex: "1 0 auto",
+	minHeight: "24px"
+}, $ = n(({ children: e, style: t, className: n, ...r }) => {
+	let i = c(() => t ? {
+		...Q,
+		...t
+	} : Q, [t]), a = m("tr", n);
+	return /* @__PURE__ */ d(J, {
+		...r,
+		type: "row",
+		children: /* @__PURE__ */ d("div", {
+			className: a,
+			style: i,
+			children: e
+		})
+	});
+});
+$.displayName = "BodyRow";
+//#endregion
+//#region src/Components/RowCell.tsx
+var ae = n(({ children: e, style: t, className: n, ...r }) => {
+	let { index: i } = r, a = S((e) => e.widths), o = S((e) => e.options.defaultSizing), s = c(() => a[i] ?? o, [
+		a,
+		i,
+		o
+	]), l = c(() => ({
+		display: "inline-flex",
+		width: `${s}px`,
+		flex: `${s} 0 auto`,
+		...t
+	}), [s, t]);
+	return /* @__PURE__ */ d("div", {
+		className: `td ${n ?? ""}`,
+		style: l,
+		"data-col-index": i,
+		children: e
+	});
+});
+ae.displayName = "RowCell";
+//#endregion
+//#region src/Components/DragHandle.tsx
+var oe = n(({ children: e, className: t, style: n }) => /* @__PURE__ */ d("div", {
+	"data-drag-handle": "true",
+	className: t,
+	style: {
+		cursor: "-webkit-grab",
+		display: "inline-flex",
+		alignItems: "center",
+		...n
+	},
+	children: e
+}));
+oe.displayName = "DragHandle";
+//#endregion
+export { $ as BodyRow, Y as ColumnCell, oe as DragHandle, ae as RowCell, Z as TableBody, K as TableContainer, q as TableHeader, w as useTable, C as useTableDispatch, S as useTableStore };