@rio-cloud/rio-uikit 2.5.1 → 3.0.0-beta.1

package/components/table/layout/useHorizontalSectionSync.js

@@ -1,44 +1,37 @@
-import { useRef as f, useState as S, useCallback as m, useEffect as g } from "react";
-const h = "table-horizontal-scroll", R = (r) => {
-  const o = r?.currentTarget;
-  if (o && "scrollLeft" in o)
-    return o.scrollLeft;
-  const e = r?.target;
-  return e && "scrollLeft" in e ? e.scrollLeft : 0;
-}, z = ({ enabled: r, hasFooterCells: o = !0 }) => {
-  const e = f(null), c = f(null), a = f(0), [L, i] = S(!1), [H, u] = S(!1), l = m(
-    (s) => {
-      const n = (t) => {
-        if (t) {
-          if (s === 0) {
-            t.style.removeProperty("transform");
-            return;
-          }
-          t.style.transform = `translateX(-${s}px)`;
-        }
-      };
-      n(e.current), o ? n(c.current) : c.current && c.current.style.removeProperty("transform");
-    },
-    [o]
-  ), p = m(
-    (s) => {
-      const n = s?.currentTarget, t = R(s), y = n ? Math.max(n.scrollWidth - n.clientWidth, 0) : 0, E = Math.max(y - t, 0);
-      i(t > 0), u(E > 1), r && l(t), t !== a.current && (a.current = t, window.dispatchEvent(new CustomEvent(h)));
-    },
-    [r, l]
-  );
-  return g(() => {
-    r || (a.current = 0, i(!1), u(!1), l(0));
-  }, [r, l]), {
-    handleBodyScroll: p,
-    hasHorizontalScrollEndOffset: H,
-    hasHorizontalScrollStartOffset: L,
-    tableFooterRowRef: c,
-    tableHeadRowRef: e
-  };
+import { useCallback as e, useEffect as t, useRef as n, useState as r } from "react";
+//#region src/components/table/layout/useHorizontalSectionSync.ts
+var i = "table-horizontal-scroll", a = (e) => {
+	let t = e?.currentTarget;
+	if (t && "scrollLeft" in t) return t.scrollLeft;
+	let n = e?.target;
+	return n && "scrollLeft" in n ? n.scrollLeft : 0;
+}, o = ({ enabled: o, hasFooterCells: s = !0 }) => {
+	let c = n(null), l = n(null), u = n(0), [d, f] = r(!1), [p, m] = r(!1), h = e((e) => {
+		let t = (t) => {
+			if (t) {
+				if (e === 0) {
+					t.style.removeProperty("transform");
+					return;
+				}
+				t.style.transform = `translateX(-${e}px)`;
+			}
+		};
+		t(c.current), s ? t(l.current) : l.current && l.current.style.removeProperty("transform");
+	}, [s]), g = e((e) => {
+		let t = e?.currentTarget, n = a(e), r = t ? Math.max(t.scrollWidth - t.clientWidth, 0) : 0, s = Math.max(r - n, 0);
+		f(n > 0), m(s > 1), o && h(n), n !== u.current && (u.current = n, window.dispatchEvent(new CustomEvent(i)));
+	}, [o, h]);
+	return t(() => {
+		o || (u.current = 0, f(!1), m(!1), h(0));
+	}, [o, h]), {
+		handleBodyScroll: g,
+		hasHorizontalScrollEndOffset: p,
+		hasHorizontalScrollStartOffset: d,
+		tableFooterRowRef: l,
+		tableHeadRowRef: c
+	};
 };
-export {
-  h as TABLE_HORIZONTAL_SCROLL_EVENT,
-  z as useHorizontalSectionSync
-};
-//# sourceMappingURL=useHorizontalSectionSync.js.map
+//#endregion
+export { i as TABLE_HORIZONTAL_SCROLL_EVENT, o as useHorizontalSectionSync };
+
+//# sourceMappingURL=useHorizontalSectionSync.js.map

package/components/table/layout/useHorizontalSectionSync.js.map

@@ -1 +1 @@
-{"version":3,"file":"useHorizontalSectionSync.js","sources":["../../../../src/components/table/layout/useHorizontalSectionSync.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState, type UIEvent } from 'react';\n\nexport const TABLE_HORIZONTAL_SCROLL_EVENT = 'table-horizontal-scroll';\n\nconst getScrollLeftFromEvent = (event: UIEvent<HTMLElement> | undefined) => {\n    const currentTarget = event?.currentTarget;\n\n    if (currentTarget && 'scrollLeft' in currentTarget) {\n        return (currentTarget as HTMLElement).scrollLeft;\n    }\n\n    const target = event?.target;\n\n    if (target && 'scrollLeft' in target) {\n        return (target as HTMLElement).scrollLeft;\n    }\n\n    return 0;\n};\n\ntype UseHorizontalSectionSyncProps = {\n    enabled: boolean;\n    hasFooterCells?: boolean;\n};\n\nexport const useHorizontalSectionSync = ({ enabled, hasFooterCells = true }: UseHorizontalSectionSyncProps) => {\n    const tableHeadRowRef = useRef<HTMLDivElement>(null);\n    const tableFooterRowRef = useRef<HTMLDivElement>(null);\n    const previousScrollLeftRef = useRef(0);\n\n    const [hasHorizontalScrollStartOffset, setHasHorizontalScrollStartOffset] = useState(false);\n    const [hasHorizontalScrollEndOffset, setHasHorizontalScrollEndOffset] = useState(false);\n\n    const syncHorizontalSections = useCallback(\n        (scrollLeft: number) => {\n            const applyTransform = (element: HTMLDivElement | null) => {\n                if (!element) {\n                    return;\n                }\n\n                if (scrollLeft === 0) {\n                    element.style.removeProperty('transform');\n                    return;\n                }\n\n                element.style.transform = `translateX(-${scrollLeft}px)`;\n            };\n\n            applyTransform(tableHeadRowRef.current);\n\n            if (hasFooterCells) {\n                applyTransform(tableFooterRowRef.current);\n            } else if (tableFooterRowRef.current) {\n                tableFooterRowRef.current.style.removeProperty('transform');\n            }\n        },\n        [hasFooterCells]\n    );\n\n    const handleBodyScroll = useCallback(\n        (event: UIEvent<HTMLElement> | undefined) => {\n            const currentTarget = event?.currentTarget as HTMLElement | undefined;\n            const scrollLeft = getScrollLeftFromEvent(event);\n            const maxScrollLeft = currentTarget\n                ? Math.max(currentTarget.scrollWidth - currentTarget.clientWidth, 0)\n                : 0;\n            const remainingScrollLeft = Math.max(maxScrollLeft - scrollLeft, 0);\n\n            setHasHorizontalScrollStartOffset(scrollLeft > 0);\n            setHasHorizontalScrollEndOffset(remainingScrollLeft > 1);\n\n            if (enabled) {\n                syncHorizontalSections(scrollLeft);\n            }\n\n            if (scrollLeft !== previousScrollLeftRef.current) {\n                previousScrollLeftRef.current = scrollLeft;\n                window.dispatchEvent(new CustomEvent(TABLE_HORIZONTAL_SCROLL_EVENT));\n            }\n        },\n        [enabled, syncHorizontalSections]\n    );\n\n    useEffect(() => {\n        if (!enabled) {\n            previousScrollLeftRef.current = 0;\n            setHasHorizontalScrollStartOffset(false);\n            setHasHorizontalScrollEndOffset(false);\n            syncHorizontalSections(0);\n        }\n    }, [enabled, syncHorizontalSections]);\n\n    return {\n        handleBodyScroll,\n        hasHorizontalScrollEndOffset,\n        hasHorizontalScrollStartOffset,\n        tableFooterRowRef,\n        tableHeadRowRef,\n    };\n};\n"],"names":["TABLE_HORIZONTAL_SCROLL_EVENT","getScrollLeftFromEvent","event","currentTarget","target","useHorizontalSectionSync","enabled","hasFooterCells","tableHeadRowRef","useRef","tableFooterRowRef","previousScrollLeftRef","hasHorizontalScrollStartOffset","setHasHorizontalScrollStartOffset","useState","hasHorizontalScrollEndOffset","setHasHorizontalScrollEndOffset","syncHorizontalSections","useCallback","scrollLeft","applyTransform","element","handleBodyScroll","maxScrollLeft","remainingScrollLeft","useEffect"],"mappings":";AAEO,MAAMA,IAAgC,2BAEvCC,IAAyB,CAACC,MAA4C;AACxE,QAAMC,IAAgBD,GAAO;AAE7B,MAAIC,KAAiB,gBAAgBA;AACjC,WAAQA,EAA8B;AAG1C,QAAMC,IAASF,GAAO;AAEtB,SAAIE,KAAU,gBAAgBA,IAClBA,EAAuB,aAG5B;AACX,GAOaC,IAA2B,CAAC,EAAE,SAAAC,GAAS,gBAAAC,IAAiB,SAA0C;AAC3G,QAAMC,IAAkBC,EAAuB,IAAI,GAC7CC,IAAoBD,EAAuB,IAAI,GAC/CE,IAAwBF,EAAO,CAAC,GAEhC,CAACG,GAAgCC,CAAiC,IAAIC,EAAS,EAAK,GACpF,CAACC,GAA8BC,CAA+B,IAAIF,EAAS,EAAK,GAEhFG,IAAyBC;AAAA,IAC3B,CAACC,MAAuB;AACpB,YAAMC,IAAiB,CAACC,MAAmC;AACvD,YAAKA,GAIL;AAAA,cAAIF,MAAe,GAAG;AAClB,YAAAE,EAAQ,MAAM,eAAe,WAAW;AACxC;AAAA,UACJ;AAEA,UAAAA,EAAQ,MAAM,YAAY,eAAeF,CAAU;AAAA;AAAA,MACvD;AAEA,MAAAC,EAAeZ,EAAgB,OAAO,GAElCD,IACAa,EAAeV,EAAkB,OAAO,IACjCA,EAAkB,WACzBA,EAAkB,QAAQ,MAAM,eAAe,WAAW;AAAA,IAElE;AAAA,IACA,CAACH,CAAc;AAAA,EAAA,GAGbe,IAAmBJ;AAAA,IACrB,CAAChB,MAA4C;AACzC,YAAMC,IAAgBD,GAAO,eACvBiB,IAAalB,EAAuBC,CAAK,GACzCqB,IAAgBpB,IAChB,KAAK,IAAIA,EAAc,cAAcA,EAAc,aAAa,CAAC,IACjE,GACAqB,IAAsB,KAAK,IAAID,IAAgBJ,GAAY,CAAC;AAElE,MAAAN,EAAkCM,IAAa,CAAC,GAChDH,EAAgCQ,IAAsB,CAAC,GAEnDlB,KACAW,EAAuBE,CAAU,GAGjCA,MAAeR,EAAsB,YACrCA,EAAsB,UAAUQ,GAChC,OAAO,cAAc,IAAI,YAAYnB,CAA6B,CAAC;AAAA,IAE3E;AAAA,IACA,CAACM,GAASW,CAAsB;AAAA,EAAA;AAGpC,SAAAQ,EAAU,MAAM;AACZ,IAAKnB,MACDK,EAAsB,UAAU,GAChCE,EAAkC,EAAK,GACvCG,EAAgC,EAAK,GACrCC,EAAuB,CAAC;AAAA,EAEhC,GAAG,CAACX,GAASW,CAAsB,CAAC,GAE7B;AAAA,IACH,kBAAAK;AAAA,IACA,8BAAAP;AAAA,IACA,gCAAAH;AAAA,IACA,mBAAAF;AAAA,IACA,iBAAAF;AAAA,EAAA;AAER;"}
+{"version":3,"file":"useHorizontalSectionSync.js","names":[],"sources":["../../../../src/components/table/layout/useHorizontalSectionSync.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState, type UIEvent } from 'react';\n\nexport const TABLE_HORIZONTAL_SCROLL_EVENT = 'table-horizontal-scroll';\n\nconst getScrollLeftFromEvent = (event: UIEvent<HTMLElement> | undefined) => {\n    const currentTarget = event?.currentTarget;\n\n    if (currentTarget && 'scrollLeft' in currentTarget) {\n        return (currentTarget as HTMLElement).scrollLeft;\n    }\n\n    const target = event?.target;\n\n    if (target && 'scrollLeft' in target) {\n        return (target as HTMLElement).scrollLeft;\n    }\n\n    return 0;\n};\n\ntype UseHorizontalSectionSyncProps = {\n    enabled: boolean;\n    hasFooterCells?: boolean;\n};\n\nexport const useHorizontalSectionSync = ({ enabled, hasFooterCells = true }: UseHorizontalSectionSyncProps) => {\n    const tableHeadRowRef = useRef<HTMLDivElement>(null);\n    const tableFooterRowRef = useRef<HTMLDivElement>(null);\n    const previousScrollLeftRef = useRef(0);\n\n    const [hasHorizontalScrollStartOffset, setHasHorizontalScrollStartOffset] = useState(false);\n    const [hasHorizontalScrollEndOffset, setHasHorizontalScrollEndOffset] = useState(false);\n\n    const syncHorizontalSections = useCallback(\n        (scrollLeft: number) => {\n            const applyTransform = (element: HTMLDivElement | null) => {\n                if (!element) {\n                    return;\n                }\n\n                if (scrollLeft === 0) {\n                    element.style.removeProperty('transform');\n                    return;\n                }\n\n                element.style.transform = `translateX(-${scrollLeft}px)`;\n            };\n\n            applyTransform(tableHeadRowRef.current);\n\n            if (hasFooterCells) {\n                applyTransform(tableFooterRowRef.current);\n            } else if (tableFooterRowRef.current) {\n                tableFooterRowRef.current.style.removeProperty('transform');\n            }\n        },\n        [hasFooterCells]\n    );\n\n    const handleBodyScroll = useCallback(\n        (event: UIEvent<HTMLElement> | undefined) => {\n            const currentTarget = event?.currentTarget as HTMLElement | undefined;\n            const scrollLeft = getScrollLeftFromEvent(event);\n            const maxScrollLeft = currentTarget\n                ? Math.max(currentTarget.scrollWidth - currentTarget.clientWidth, 0)\n                : 0;\n            const remainingScrollLeft = Math.max(maxScrollLeft - scrollLeft, 0);\n\n            setHasHorizontalScrollStartOffset(scrollLeft > 0);\n            setHasHorizontalScrollEndOffset(remainingScrollLeft > 1);\n\n            if (enabled) {\n                syncHorizontalSections(scrollLeft);\n            }\n\n            if (scrollLeft !== previousScrollLeftRef.current) {\n                previousScrollLeftRef.current = scrollLeft;\n                window.dispatchEvent(new CustomEvent(TABLE_HORIZONTAL_SCROLL_EVENT));\n            }\n        },\n        [enabled, syncHorizontalSections]\n    );\n\n    useEffect(() => {\n        if (!enabled) {\n            previousScrollLeftRef.current = 0;\n            setHasHorizontalScrollStartOffset(false);\n            setHasHorizontalScrollEndOffset(false);\n            syncHorizontalSections(0);\n        }\n    }, [enabled, syncHorizontalSections]);\n\n    return {\n        handleBodyScroll,\n        hasHorizontalScrollEndOffset,\n        hasHorizontalScrollStartOffset,\n        tableFooterRowRef,\n        tableHeadRowRef,\n    };\n};\n"],"mappings":";;AAEA,IAAa,IAAgC,2BAEvC,KAA0B,MAA4C;CACxE,IAAM,IAAgB,GAAO;CAE7B,IAAI,KAAiB,gBAAgB,GACjC,OAAQ,EAA8B;CAG1C,IAAM,IAAS,GAAO;CAMtB,OAJI,KAAU,gBAAgB,IAClB,EAAuB,aAG5B;AACX,GAOa,KAA4B,EAAE,YAAS,oBAAiB,SAA0C;CAC3G,IAAM,IAAkB,EAAuB,IAAI,GAC7C,IAAoB,EAAuB,IAAI,GAC/C,IAAwB,EAAO,CAAC,GAEhC,CAAC,GAAgC,KAAqC,EAAS,EAAK,GACpF,CAAC,GAA8B,KAAmC,EAAS,EAAK,GAEhF,IAAyB,GAC1B,MAAuB;EACpB,IAAM,KAAkB,MAAmC;GAClD,OAIL;QAAI,MAAe,GAAG;KAClB,EAAQ,MAAM,eAAe,WAAW;KACxC;IACJ;IAEA,EAAQ,MAAM,YAAY,eAAe,EAAW;GAFpD;EAGJ;EAIA,AAFA,EAAe,EAAgB,OAAO,GAElC,IACA,EAAe,EAAkB,OAAO,IACjC,EAAkB,WACzB,EAAkB,QAAQ,MAAM,eAAe,WAAW;CAElE,GACA,CAAC,CAAc,CACnB,GAEM,IAAmB,GACpB,MAA4C;EACzC,IAAM,IAAgB,GAAO,eACvB,IAAa,EAAuB,CAAK,GACzC,IAAgB,IAChB,KAAK,IAAI,EAAc,cAAc,EAAc,aAAa,CAAC,IACjE,GACA,IAAsB,KAAK,IAAI,IAAgB,GAAY,CAAC;EASlE,AAPA,EAAkC,IAAa,CAAC,GAChD,EAAgC,IAAsB,CAAC,GAEnD,KACA,EAAuB,CAAU,GAGjC,MAAe,EAAsB,YACrC,EAAsB,UAAU,GAChC,OAAO,cAAc,IAAI,YAAY,CAA6B,CAAC;CAE3E,GACA,CAAC,GAAS,CAAsB,CACpC;CAWA,OATA,QAAgB;EACZ,AAAK,MACD,EAAsB,UAAU,GAChC,EAAkC,EAAK,GACvC,EAAgC,EAAK,GACrC,EAAuB,CAAC;CAEhC,GAAG,CAAC,GAAS,CAAsB,CAAC,GAE7B;EACH;EACA;EACA;EACA;EACA;CACJ;AACJ"}

package/components/table/layout/useMeasuredColumnMaxWidths.js

@@ -1,83 +1,67 @@
-import { useState as A, useRef as z, useMemo as F, useLayoutEffect as N } from "react";
-import a from "../../../hooks/useResizeObserver.js";
-const j = 1, x = (t) => {
-  const e = t?.trim().match(/^(-?\d+(?:\.\d+)?)px$/);
-  return e ? Number(e[1]) : void 0;
-}, C = (t) => {
-  const e = t.getBoundingClientRect().width;
-  return e > 0 ? Math.ceil(e) : t.scrollWidth;
-}, P = (t) => {
-  if (!t)
-    return 0;
-  const e = window.getComputedStyle(t), n = Number.parseFloat(e.columnGap || e.gap || "0");
-  return Number.isFinite(n) ? Math.ceil(n) : 0;
-}, T = (t) => {
-  const e = t.querySelector(".table-head-label");
-  if (e) {
-    const o = t.querySelector(".sort-arrows");
-    return C(e) + (o ? C(o) : 0) + (o ? P(t.querySelector(".table-head-button")) : 0);
-  }
-  return (t.querySelector(".table-cell-content, .table-head-button-label") ?? t).scrollWidth;
-}, _ = (t, e) => Object.fromEntries(
-  Object.entries(e).map(([n, o]) => {
-    const u = t[n], i = x(u), r = x(o);
-    return [
-      n,
-      i !== void 0 && r !== void 0 && Math.abs(i - r) <= j ? u : o
-    ];
-  })
-), D = (t) => {
-  const { columns: e, enabled: n, tableWrapperRef: o } = t, [u, i] = A({}), r = z(""), c = z({}), g = F(
-    () => e.map((l) => `${l.key}:${l.width === void 0 ? "auto" : String(l.width)}`).join("|"),
-    [e]
-  ), s = o.current, v = s?.querySelector(".table-head") ?? null, w = s?.querySelector(".table-body") ?? null, R = s?.querySelector(".table-footer") ?? null, q = s?.querySelector(".table-scroll-content") ?? null, [, , b] = a(s), [, , S] = a(v), [, , M] = a(w), [, , f] = a(R), [, , p] = a(q);
-  return N(() => {
-    if (!n || !s) {
-      r.current && (r.current = "", c.current = {}, i({}));
-      return;
-    }
-    if (e.length === 0) {
-      r.current && (r.current = "", c.current = {}, i({}));
-      return;
-    }
-    const l = e.filter((d) => d.width === void 0);
-    if (l.length === 0) {
-      r.current && (r.current = "", c.current = {}, i({}));
-      return;
-    }
-    (() => {
-      const d = Array.from(s.querySelectorAll("[data-column]")), k = Object.fromEntries(
-        l.flatMap((E) => {
-          const y = d.filter((h) => h.dataset.column === E.key).reduce(
-            (h, O) => Math.max(h, T(O)),
-            0
-          );
-          return y > 0 ? [[E.key, `${Math.ceil(y)}px`]] : [];
-        })
-      ), m = _(
-        c.current,
-        k
-      ), W = JSON.stringify(m);
-      W !== r.current && (r.current = W, c.current = m, i(m));
-    })();
-  }, [
-    g,
-    n,
-    s,
-    b.blockSize,
-    b.inlineSize,
-    S.blockSize,
-    S.inlineSize,
-    M.blockSize,
-    M.inlineSize,
-    f.blockSize,
-    f.inlineSize,
-    p.blockSize,
-    p.inlineSize
-  ]), u;
+import e from "../../../hooks/useResizeObserver.js";
+import "../../../useResizeObserver.js";
+import { useLayoutEffect as t, useMemo as n, useRef as r, useState as i } from "react";
+//#region src/components/table/layout/useMeasuredColumnMaxWidths.ts
+var a = 1, o = (e) => {
+	let t = e?.trim().match(/^(-?\d+(?:\.\d+)?)px$/);
+	return t ? Number(t[1]) : void 0;
+}, s = (e) => {
+	let t = e.getBoundingClientRect().width;
+	return t > 0 ? Math.ceil(t) : e.scrollWidth;
+}, c = (e) => {
+	if (!e) return 0;
+	let t = window.getComputedStyle(e), n = Number.parseFloat(t.columnGap || t.gap || "0");
+	return Number.isFinite(n) ? Math.ceil(n) : 0;
+}, l = (e) => {
+	let t = e.querySelector(".table-head-label");
+	if (t) {
+		let n = e.querySelector(".sort-arrows");
+		return s(t) + (n ? s(n) : 0) + (n ? c(e.querySelector(".table-head-button")) : 0);
+	}
+	return (e.querySelector(".table-cell-content, .table-head-button-label") ?? e).scrollWidth;
+}, u = (e, t) => Object.fromEntries(Object.entries(t).map(([t, n]) => {
+	let r = e[t], i = o(r), s = o(n);
+	return [t, i !== void 0 && s !== void 0 && Math.abs(i - s) <= a ? r : n];
+})), d = (a) => {
+	let { columns: o, enabled: s, tableWrapperRef: c } = a, [d, f] = i({}), p = r(""), m = r({}), h = n(() => o.map((e) => `${e.key}:${e.width === void 0 ? "auto" : String(e.width)}`).join("|"), [o]), g = c.current, _ = g?.querySelector(".table-head") ?? null, v = g?.querySelector(".table-body") ?? null, y = g?.querySelector(".table-footer") ?? null, b = g?.querySelector(".table-scroll-content") ?? null, [, , x] = e(g), [, , S] = e(_), [, , C] = e(v), [, , w] = e(y), [, , T] = e(b);
+	return t(() => {
+		if (!s || !g) {
+			p.current && (p.current = "", m.current = {}, f({}));
+			return;
+		}
+		if (o.length === 0) {
+			p.current && (p.current = "", m.current = {}, f({}));
+			return;
+		}
+		let e = o.filter((e) => e.width === void 0);
+		if (e.length === 0) {
+			p.current && (p.current = "", m.current = {}, f({}));
+			return;
+		}
+		(() => {
+			let t = Array.from(g.querySelectorAll("[data-column]")), n = Object.fromEntries(e.flatMap((e) => {
+				let n = t.filter((t) => t.dataset.column === e.key).reduce((e, t) => Math.max(e, l(t)), 0);
+				return n > 0 ? [[e.key, `${Math.ceil(n)}px`]] : [];
+			})), r = u(m.current, n), i = JSON.stringify(r);
+			i !== p.current && (p.current = i, m.current = r, f(r));
+		})();
+	}, [
+		h,
+		s,
+		g,
+		x.blockSize,
+		x.inlineSize,
+		S.blockSize,
+		S.inlineSize,
+		C.blockSize,
+		C.inlineSize,
+		w.blockSize,
+		w.inlineSize,
+		T.blockSize,
+		T.inlineSize
+	]), d;
 };
-export {
-  _ as stabilizeMeasuredColumnMaxWidths,
-  D as useMeasuredColumnMaxWidths
-};
-//# sourceMappingURL=useMeasuredColumnMaxWidths.js.map
+//#endregion
+export { u as stabilizeMeasuredColumnMaxWidths, d as useMeasuredColumnMaxWidths };
+
+//# sourceMappingURL=useMeasuredColumnMaxWidths.js.map

package/components/table/layout/useMeasuredColumnMaxWidths.js.map

@@ -1 +1 @@
-{"version":3,"file":"useMeasuredColumnMaxWidths.js","sources":["../../../../src/components/table/layout/useMeasuredColumnMaxWidths.ts"],"sourcesContent":["import { useLayoutEffect, useMemo, useRef, useState, type RefObject } from 'react';\n\nimport useResizeObserver from '../../../useResizeObserver';\nimport type { TableColumnDefinition, TableRowData } from '../Table.types';\n\nconst MEASURED_WIDTH_JITTER_TOLERANCE_PX = 1;\n\nconst parsePixelWidth = (width?: string) => {\n    const match = width?.trim().match(/^(-?\\d+(?:\\.\\d+)?)px$/);\n\n    return match ? Number(match[1]) : undefined;\n};\n\nconst measureRenderedWidth = (element: HTMLElement) => {\n    const renderedWidth = element.getBoundingClientRect().width;\n\n    return renderedWidth > 0 ? Math.ceil(renderedWidth) : element.scrollWidth;\n};\n\nconst resolveFlexGapWidth = (element: HTMLElement | null) => {\n    if (!element) {\n        return 0;\n    }\n\n    const styles = window.getComputedStyle(element);\n    const gap = Number.parseFloat(styles.columnGap || styles.gap || '0');\n\n    return Number.isFinite(gap) ? Math.ceil(gap) : 0;\n};\n\nconst measureColumnContentWidth = (element: HTMLElement) => {\n    const headerLabelElement = element.querySelector<HTMLElement>('.table-head-label');\n\n    if (headerLabelElement) {\n        const sortArrowsElement = element.querySelector<HTMLElement>('.sort-arrows');\n\n        return (\n            measureRenderedWidth(headerLabelElement) +\n            (sortArrowsElement ? measureRenderedWidth(sortArrowsElement) : 0) +\n            (sortArrowsElement ? resolveFlexGapWidth(element.querySelector<HTMLElement>('.table-head-button')) : 0)\n        );\n    }\n\n    const contentElement =\n        element.querySelector<HTMLElement>('.table-cell-content, .table-head-button-label') ?? element;\n\n    return contentElement.scrollWidth;\n};\n\nexport const stabilizeMeasuredColumnMaxWidths = (\n    previousMeasuredColumnMaxWidths: Record<string, string>,\n    nextMeasuredColumnMaxWidths: Record<string, string>\n) =>\n    Object.fromEntries(\n        Object.entries(nextMeasuredColumnMaxWidths).map(([columnKey, nextMeasuredWidth]) => {\n            const previousMeasuredWidth = previousMeasuredColumnMaxWidths[columnKey];\n            const previousMeasuredWidthPx = parsePixelWidth(previousMeasuredWidth);\n            const nextMeasuredWidthPx = parsePixelWidth(nextMeasuredWidth);\n\n            return [\n                columnKey,\n                previousMeasuredWidthPx !== undefined &&\n                nextMeasuredWidthPx !== undefined &&\n                Math.abs(previousMeasuredWidthPx - nextMeasuredWidthPx) <= MEASURED_WIDTH_JITTER_TOLERANCE_PX\n                    ? previousMeasuredWidth\n                    : nextMeasuredWidth,\n            ];\n        })\n    );\n\ntype UseMeasuredColumnMaxWidthsProps<RowType extends TableRowData> = {\n    columns: TableColumnDefinition<RowType>[];\n    enabled: boolean;\n    tableWrapperRef: RefObject<HTMLDivElement | null>;\n};\n\nexport const useMeasuredColumnMaxWidths = <RowType extends TableRowData>(\n    props: UseMeasuredColumnMaxWidthsProps<RowType>\n) => {\n    const { columns, enabled, tableWrapperRef } = props;\n    const [measuredColumnMaxWidths, setMeasuredColumnMaxWidths] = useState<Record<string, string>>({});\n    const previousMeasuredWidthsRef = useRef('');\n    const previousMeasuredColumnMaxWidthsRef = useRef<Record<string, string>>({});\n    const columnsSignature = useMemo(\n        () =>\n            columns\n                .map(column => `${column.key}:${column.width === undefined ? 'auto' : String(column.width)}`)\n                .join('|'),\n        [columns]\n    );\n    const wrapperElement = tableWrapperRef.current;\n    const tableHeadElement = wrapperElement?.querySelector<HTMLDivElement>('.table-head') ?? null;\n    const tableBodyElement = wrapperElement?.querySelector<HTMLDivElement>('.table-body') ?? null;\n    const tableFooterElement = wrapperElement?.querySelector<HTMLDivElement>('.table-footer') ?? null;\n    const tableScrollContentElement = wrapperElement?.querySelector<HTMLDivElement>('.table-scroll-content') ?? null;\n    const [, , wrapperSize] = useResizeObserver(wrapperElement);\n    const [, , tableHeadSize] = useResizeObserver(tableHeadElement);\n    const [, , tableBodySize] = useResizeObserver(tableBodyElement);\n    const [, , tableFooterSize] = useResizeObserver(tableFooterElement);\n    const [, , tableScrollContentSize] = useResizeObserver(tableScrollContentElement);\n\n    useLayoutEffect(() => {\n        if (!enabled || !wrapperElement) {\n            if (previousMeasuredWidthsRef.current) {\n                previousMeasuredWidthsRef.current = '';\n                previousMeasuredColumnMaxWidthsRef.current = {};\n                setMeasuredColumnMaxWidths({});\n            }\n\n            return;\n        }\n\n        if (columns.length === 0) {\n            if (previousMeasuredWidthsRef.current) {\n                previousMeasuredWidthsRef.current = '';\n                previousMeasuredColumnMaxWidthsRef.current = {};\n                setMeasuredColumnMaxWidths({});\n            }\n\n            return;\n        }\n\n        const columnsWithoutWidth = columns.filter(column => column.width === undefined);\n\n        if (columnsWithoutWidth.length === 0) {\n            if (previousMeasuredWidthsRef.current) {\n                previousMeasuredWidthsRef.current = '';\n                previousMeasuredColumnMaxWidthsRef.current = {};\n                setMeasuredColumnMaxWidths({});\n            }\n\n            return;\n        }\n\n        const measureColumnMaxWidths = () => {\n            const columnElements = Array.from(wrapperElement.querySelectorAll<HTMLElement>('[data-column]'));\n            const nextMeasuredColumnMaxWidths = Object.fromEntries(\n                columnsWithoutWidth.flatMap(column => {\n                    const matchingElements = columnElements.filter(element => element.dataset.column === column.key);\n                    const measuredWidth = matchingElements.reduce(\n                        (largestWidth, element) => Math.max(largestWidth, measureColumnContentWidth(element)),\n                        0\n                    );\n\n                    return measuredWidth > 0 ? [[column.key, `${Math.ceil(measuredWidth)}px`]] : [];\n                })\n            );\n            const stabilizedMeasuredColumnMaxWidths = stabilizeMeasuredColumnMaxWidths(\n                previousMeasuredColumnMaxWidthsRef.current,\n                nextMeasuredColumnMaxWidths\n            );\n            const serializedMeasuredWidths = JSON.stringify(stabilizedMeasuredColumnMaxWidths);\n\n            if (serializedMeasuredWidths !== previousMeasuredWidthsRef.current) {\n                previousMeasuredWidthsRef.current = serializedMeasuredWidths;\n                previousMeasuredColumnMaxWidthsRef.current = stabilizedMeasuredColumnMaxWidths;\n                setMeasuredColumnMaxWidths(stabilizedMeasuredColumnMaxWidths);\n            }\n        };\n\n        measureColumnMaxWidths();\n    }, [\n        columnsSignature,\n        enabled,\n        wrapperElement,\n        wrapperSize.blockSize,\n        wrapperSize.inlineSize,\n        tableHeadSize.blockSize,\n        tableHeadSize.inlineSize,\n        tableBodySize.blockSize,\n        tableBodySize.inlineSize,\n        tableFooterSize.blockSize,\n        tableFooterSize.inlineSize,\n        tableScrollContentSize.blockSize,\n        tableScrollContentSize.inlineSize,\n    ]);\n\n    return measuredColumnMaxWidths;\n};\n"],"names":["MEASURED_WIDTH_JITTER_TOLERANCE_PX","parsePixelWidth","width","match","measureRenderedWidth","element","renderedWidth","resolveFlexGapWidth","styles","gap","measureColumnContentWidth","headerLabelElement","sortArrowsElement","stabilizeMeasuredColumnMaxWidths","previousMeasuredColumnMaxWidths","nextMeasuredColumnMaxWidths","columnKey","nextMeasuredWidth","previousMeasuredWidth","previousMeasuredWidthPx","nextMeasuredWidthPx","useMeasuredColumnMaxWidths","props","columns","enabled","tableWrapperRef","measuredColumnMaxWidths","setMeasuredColumnMaxWidths","useState","previousMeasuredWidthsRef","useRef","previousMeasuredColumnMaxWidthsRef","columnsSignature","useMemo","column","wrapperElement","tableHeadElement","tableBodyElement","tableFooterElement","tableScrollContentElement","wrapperSize","useResizeObserver","tableHeadSize","tableBodySize","tableFooterSize","tableScrollContentSize","useLayoutEffect","columnsWithoutWidth","columnElements","measuredWidth","largestWidth","stabilizedMeasuredColumnMaxWidths","serializedMeasuredWidths"],"mappings":"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"}
+{"version":3,"file":"useMeasuredColumnMaxWidths.js","names":[],"sources":["../../../../src/components/table/layout/useMeasuredColumnMaxWidths.ts"],"sourcesContent":["import { useLayoutEffect, useMemo, useRef, useState, type RefObject } from 'react';\n\nimport useResizeObserver from '../../../useResizeObserver';\nimport type { TableColumnDefinition, TableRowData } from '../Table.types';\n\nconst MEASURED_WIDTH_JITTER_TOLERANCE_PX = 1;\n\nconst parsePixelWidth = (width?: string) => {\n    const match = width?.trim().match(/^(-?\\d+(?:\\.\\d+)?)px$/);\n\n    return match ? Number(match[1]) : undefined;\n};\n\nconst measureRenderedWidth = (element: HTMLElement) => {\n    const renderedWidth = element.getBoundingClientRect().width;\n\n    return renderedWidth > 0 ? Math.ceil(renderedWidth) : element.scrollWidth;\n};\n\nconst resolveFlexGapWidth = (element: HTMLElement | null) => {\n    if (!element) {\n        return 0;\n    }\n\n    const styles = window.getComputedStyle(element);\n    const gap = Number.parseFloat(styles.columnGap || styles.gap || '0');\n\n    return Number.isFinite(gap) ? Math.ceil(gap) : 0;\n};\n\nconst measureColumnContentWidth = (element: HTMLElement) => {\n    const headerLabelElement = element.querySelector<HTMLElement>('.table-head-label');\n\n    if (headerLabelElement) {\n        const sortArrowsElement = element.querySelector<HTMLElement>('.sort-arrows');\n\n        return (\n            measureRenderedWidth(headerLabelElement) +\n            (sortArrowsElement ? measureRenderedWidth(sortArrowsElement) : 0) +\n            (sortArrowsElement ? resolveFlexGapWidth(element.querySelector<HTMLElement>('.table-head-button')) : 0)\n        );\n    }\n\n    const contentElement =\n        element.querySelector<HTMLElement>('.table-cell-content, .table-head-button-label') ?? element;\n\n    return contentElement.scrollWidth;\n};\n\nexport const stabilizeMeasuredColumnMaxWidths = (\n    previousMeasuredColumnMaxWidths: Record<string, string>,\n    nextMeasuredColumnMaxWidths: Record<string, string>\n) =>\n    Object.fromEntries(\n        Object.entries(nextMeasuredColumnMaxWidths).map(([columnKey, nextMeasuredWidth]) => {\n            const previousMeasuredWidth = previousMeasuredColumnMaxWidths[columnKey];\n            const previousMeasuredWidthPx = parsePixelWidth(previousMeasuredWidth);\n            const nextMeasuredWidthPx = parsePixelWidth(nextMeasuredWidth);\n\n            return [\n                columnKey,\n                previousMeasuredWidthPx !== undefined &&\n                nextMeasuredWidthPx !== undefined &&\n                Math.abs(previousMeasuredWidthPx - nextMeasuredWidthPx) <= MEASURED_WIDTH_JITTER_TOLERANCE_PX\n                    ? previousMeasuredWidth\n                    : nextMeasuredWidth,\n            ];\n        })\n    );\n\ntype UseMeasuredColumnMaxWidthsProps<RowType extends TableRowData> = {\n    columns: TableColumnDefinition<RowType>[];\n    enabled: boolean;\n    tableWrapperRef: RefObject<HTMLDivElement | null>;\n};\n\nexport const useMeasuredColumnMaxWidths = <RowType extends TableRowData>(\n    props: UseMeasuredColumnMaxWidthsProps<RowType>\n) => {\n    const { columns, enabled, tableWrapperRef } = props;\n    const [measuredColumnMaxWidths, setMeasuredColumnMaxWidths] = useState<Record<string, string>>({});\n    const previousMeasuredWidthsRef = useRef('');\n    const previousMeasuredColumnMaxWidthsRef = useRef<Record<string, string>>({});\n    const columnsSignature = useMemo(\n        () =>\n            columns\n                .map(column => `${column.key}:${column.width === undefined ? 'auto' : String(column.width)}`)\n                .join('|'),\n        [columns]\n    );\n    const wrapperElement = tableWrapperRef.current;\n    const tableHeadElement = wrapperElement?.querySelector<HTMLDivElement>('.table-head') ?? null;\n    const tableBodyElement = wrapperElement?.querySelector<HTMLDivElement>('.table-body') ?? null;\n    const tableFooterElement = wrapperElement?.querySelector<HTMLDivElement>('.table-footer') ?? null;\n    const tableScrollContentElement = wrapperElement?.querySelector<HTMLDivElement>('.table-scroll-content') ?? null;\n    const [, , wrapperSize] = useResizeObserver(wrapperElement);\n    const [, , tableHeadSize] = useResizeObserver(tableHeadElement);\n    const [, , tableBodySize] = useResizeObserver(tableBodyElement);\n    const [, , tableFooterSize] = useResizeObserver(tableFooterElement);\n    const [, , tableScrollContentSize] = useResizeObserver(tableScrollContentElement);\n\n    useLayoutEffect(() => {\n        if (!enabled || !wrapperElement) {\n            if (previousMeasuredWidthsRef.current) {\n                previousMeasuredWidthsRef.current = '';\n                previousMeasuredColumnMaxWidthsRef.current = {};\n                setMeasuredColumnMaxWidths({});\n            }\n\n            return;\n        }\n\n        if (columns.length === 0) {\n            if (previousMeasuredWidthsRef.current) {\n                previousMeasuredWidthsRef.current = '';\n                previousMeasuredColumnMaxWidthsRef.current = {};\n                setMeasuredColumnMaxWidths({});\n            }\n\n            return;\n        }\n\n        const columnsWithoutWidth = columns.filter(column => column.width === undefined);\n\n        if (columnsWithoutWidth.length === 0) {\n            if (previousMeasuredWidthsRef.current) {\n                previousMeasuredWidthsRef.current = '';\n                previousMeasuredColumnMaxWidthsRef.current = {};\n                setMeasuredColumnMaxWidths({});\n            }\n\n            return;\n        }\n\n        const measureColumnMaxWidths = () => {\n            const columnElements = Array.from(wrapperElement.querySelectorAll<HTMLElement>('[data-column]'));\n            const nextMeasuredColumnMaxWidths = Object.fromEntries(\n                columnsWithoutWidth.flatMap(column => {\n                    const matchingElements = columnElements.filter(element => element.dataset.column === column.key);\n                    const measuredWidth = matchingElements.reduce(\n                        (largestWidth, element) => Math.max(largestWidth, measureColumnContentWidth(element)),\n                        0\n                    );\n\n                    return measuredWidth > 0 ? [[column.key, `${Math.ceil(measuredWidth)}px`]] : [];\n                })\n            );\n            const stabilizedMeasuredColumnMaxWidths = stabilizeMeasuredColumnMaxWidths(\n                previousMeasuredColumnMaxWidthsRef.current,\n                nextMeasuredColumnMaxWidths\n            );\n            const serializedMeasuredWidths = JSON.stringify(stabilizedMeasuredColumnMaxWidths);\n\n            if (serializedMeasuredWidths !== previousMeasuredWidthsRef.current) {\n                previousMeasuredWidthsRef.current = serializedMeasuredWidths;\n                previousMeasuredColumnMaxWidthsRef.current = stabilizedMeasuredColumnMaxWidths;\n                setMeasuredColumnMaxWidths(stabilizedMeasuredColumnMaxWidths);\n            }\n        };\n\n        measureColumnMaxWidths();\n    }, [\n        columnsSignature,\n        enabled,\n        wrapperElement,\n        wrapperSize.blockSize,\n        wrapperSize.inlineSize,\n        tableHeadSize.blockSize,\n        tableHeadSize.inlineSize,\n        tableBodySize.blockSize,\n        tableBodySize.inlineSize,\n        tableFooterSize.blockSize,\n        tableFooterSize.inlineSize,\n        tableScrollContentSize.blockSize,\n        tableScrollContentSize.inlineSize,\n    ]);\n\n    return measuredColumnMaxWidths;\n};\n"],"mappings":"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"}

package/components/table/layout/useResizableColumns.js

@@ -1,132 +1,106 @@
-import { useState as z, useRef as R, useLayoutEffect as L, useEffect as I, useMemo as X } from "react";
-import { DEFAULT_MIN_RESIZE_WIDTH_PX as g, MIN_COLUMN_WIDTH_PX as b, DEFAULT_MAX_RESIZE_WIDTH_PX as D } from "../tableSizing.constants.js";
-const E = (l) => {
-  const u = (typeof l == "number" ? `${l}px` : l?.trim())?.match(/^(-?\d+(?:\.\d+)?)(px|%)$/);
-  if (u)
-    return {
-      unit: u[2],
-      value: Number(u[1])
-    };
-}, f = (l, r) => {
-  if (l === r)
-    return !0;
-  const u = E(l), h = E(r);
-  return u !== void 0 && h !== void 0 && u.unit === h.unit ? u.value === h.value : !1;
-}, P = (l) => {
-  const { columns: r, enabled: u, onColumnResize: h } = l, [C, W] = z({}), [c, p] = z(void 0), m = R({}), y = R({}), w = R(!1);
-  r.forEach((e) => {
-    e.key in m.current || (m.current[e.key] = e.width);
-  }), L(() => {
-    const e = Object.fromEntries(r.map((t) => [t.key, t.width]));
-    if (r.length === 0)
-      return;
-    if (!w.current) {
-      y.current = e, w.current = !0;
-      return;
-    }
-    const i = y.current, a = new Set(r.map((t) => t.key)), s = Object.keys(i);
-    (r.some((t) => !f(t.width, i[t.key])) || s.some((t) => !a.has(t))) && (W((t) => {
-      let n = t;
-      return r.forEach((d) => {
-        const S = y.current[d.key];
-        if (f(d.width, S))
-          return;
-        const _ = m.current[d.key];
-        if (f(d.width, _)) {
-          if (!(d.key in n))
-            return;
-          n = { ...n }, delete n[d.key];
-          return;
-        }
-        n[d.key] !== d.width && (n = {
-          ...n,
-          [d.key]: d.width
-        });
-      }), Object.keys(n).forEach((d) => {
-        a.has(d) || (n === t && (n = { ...n }), delete n[d]);
-      }), n;
-    }), y.current = e);
-  }, [r]), I(() => {
-    if (!c)
-      return;
-    const e = document.body.style.cursor, i = document.body.style.userSelect;
-    document.body.style.cursor = "col-resize", document.body.style.userSelect = "none";
-    const a = (o) => {
-      const t = Math.min(
-        c.maxResizeWidth,
-        Math.max(
-          c.minResizeWidth,
-          Math.round(c.startWidth + o.clientX - c.startX)
-        )
-      );
-      h?.(c.columnKey, t), W(
-        (n) => n[c.columnKey] === t ? n : {
-          ...n,
-          [c.columnKey]: t
-        }
-      );
-    }, s = () => {
-      p(void 0);
-    };
-    return window.addEventListener("pointermove", a), window.addEventListener("pointerup", s), window.addEventListener("pointercancel", s), () => {
-      document.body.style.cursor = e, document.body.style.userSelect = i, window.removeEventListener("pointermove", a), window.removeEventListener("pointerup", s), window.removeEventListener("pointercancel", s);
-    };
-  }, [h, c]);
-  const k = (e, i) => {
-    if (!u || i.button !== 0)
-      return;
-    const a = r.find((n) => n.key === e), s = i.currentTarget.closest(".table-head-cell");
-    if (!a || !s)
-      return;
-    i.preventDefault(), i.stopPropagation();
-    const o = Math.max(a.minResizeWidth ?? g, b), t = Math.max(a.maxResizeWidth ?? D, o);
-    p({
-      columnKey: e,
-      maxResizeWidth: t,
-      minResizeWidth: o,
-      startWidth: s.getBoundingClientRect().width,
-      startX: i.clientX
-    });
-  }, v = (e) => {
-    const i = r.find((o) => o.key === e), s = m.current[e] ?? (i?.minResizeWidth !== void 0 ? Math.max(i.minResizeWidth, b) : void 0);
-    p(void 0), h?.(e, s), W((o) => {
-      if (s === void 0) {
-        if (!(e in o))
-          return o;
-        const t = { ...o };
-        return delete t[e], t;
-      }
-      return o[e] === s ? o : {
-        ...o,
-        [e]: s
-      };
-    });
-  }, M = r.map((e) => {
-    const i = C[e.key];
-    return i === void 0 ? e : {
-      ...e,
-      width: i
-    };
-  }), x = X(
-    () => /* @__PURE__ */ new Set([
-      ...r.flatMap(
-        (e) => f(e.width, m.current[e.key]) ? [] : [e.key]
-      ),
-      ...Object.entries(C).flatMap(
-        ([e, i]) => f(i, m.current[e]) ? [] : [e]
-      )
-    ]),
-    [r, C]
-  );
-  return {
-    handleColumnResizeReset: v,
-    handleColumnResizeStart: k,
-    lastResizableColumnKey: r.at(-1)?.key,
-    resettableColumnKeys: x,
-    resizedColumns: M
-  };
+import "../tableSizing.constants.js";
+import { useEffect as e, useLayoutEffect as t, useMemo as n, useRef as r, useState as i } from "react";
+//#region src/components/table/layout/useResizableColumns.ts
+var a = (e) => {
+	let t = (typeof e == "number" ? `${e}px` : e?.trim())?.match(/^(-?\d+(?:\.\d+)?)(px|%)$/);
+	if (t) return {
+		unit: t[2],
+		value: Number(t[1])
+	};
+}, o = (e, t) => {
+	if (e === t) return !0;
+	let n = a(e), r = a(t);
+	return n !== void 0 && r !== void 0 && n.unit === r.unit && n.value === r.value;
+}, s = (a) => {
+	let { columns: s, enabled: c, onColumnResize: l } = a, [u, d] = i({}), [f, p] = i(void 0), m = r({}), h = r({}), g = r(!1);
+	s.forEach((e) => {
+		e.key in m.current || (m.current[e.key] = e.width);
+	}), t(() => {
+		let e = Object.fromEntries(s.map((e) => [e.key, e.width]));
+		if (s.length === 0) return;
+		if (!g.current) {
+			h.current = e, g.current = !0;
+			return;
+		}
+		let t = h.current, n = new Set(s.map((e) => e.key)), r = Object.keys(t);
+		(s.some((e) => !o(e.width, t[e.key])) || r.some((e) => !n.has(e))) && (d((e) => {
+			let t = e;
+			return s.forEach((e) => {
+				let n = h.current[e.key];
+				if (o(e.width, n)) return;
+				let r = m.current[e.key];
+				if (o(e.width, r)) {
+					if (!(e.key in t)) return;
+					t = { ...t }, delete t[e.key];
+					return;
+				}
+				t[e.key] !== e.width && (t = {
+					...t,
+					[e.key]: e.width
+				});
+			}), Object.keys(t).forEach((r) => {
+				n.has(r) || (t === e && (t = { ...t }), delete t[r]);
+			}), t;
+		}), h.current = e);
+	}, [s]), e(() => {
+		if (!f) return;
+		let e = document.body.style.cursor, t = document.body.style.userSelect;
+		document.body.style.cursor = "col-resize", document.body.style.userSelect = "none";
+		let n = (e) => {
+			let t = Math.min(f.maxResizeWidth, Math.max(f.minResizeWidth, Math.round(f.startWidth + e.clientX - f.startX)));
+			l?.(f.columnKey, t), d((e) => e[f.columnKey] === t ? e : {
+				...e,
+				[f.columnKey]: t
+			});
+		}, r = () => {
+			p(void 0);
+		};
+		return window.addEventListener("pointermove", n), window.addEventListener("pointerup", r), window.addEventListener("pointercancel", r), () => {
+			document.body.style.cursor = e, document.body.style.userSelect = t, window.removeEventListener("pointermove", n), window.removeEventListener("pointerup", r), window.removeEventListener("pointercancel", r);
+		};
+	}, [l, f]);
+	let _ = (e, t) => {
+		if (!c || t.button !== 0) return;
+		let n = s.find((t) => t.key === e), r = t.currentTarget.closest(".table-head-cell");
+		if (!n || !r) return;
+		t.preventDefault(), t.stopPropagation();
+		let i = Math.max(n.minResizeWidth ?? 50, 50), a = Math.max(n.maxResizeWidth ?? 1e3, i);
+		p({
+			columnKey: e,
+			maxResizeWidth: a,
+			minResizeWidth: i,
+			startWidth: r.getBoundingClientRect().width,
+			startX: t.clientX
+		});
+	}, v = (e) => {
+		let t = s.find((t) => t.key === e), n = m.current[e] ?? (t?.minResizeWidth === void 0 ? void 0 : Math.max(t.minResizeWidth, 50));
+		p(void 0), l?.(e, n), d((t) => {
+			if (n === void 0) {
+				if (!(e in t)) return t;
+				let n = { ...t };
+				return delete n[e], n;
+			}
+			return t[e] === n ? t : {
+				...t,
+				[e]: n
+			};
+		});
+	}, y = s.map((e) => {
+		let t = u[e.key];
+		return t === void 0 ? e : {
+			...e,
+			width: t
+		};
+	}), b = n(() => /* @__PURE__ */ new Set([...s.flatMap((e) => o(e.width, m.current[e.key]) ? [] : [e.key]), ...Object.entries(u).flatMap(([e, t]) => o(t, m.current[e]) ? [] : [e])]), [s, u]);
+	return {
+		handleColumnResizeReset: v,
+		handleColumnResizeStart: _,
+		lastResizableColumnKey: s.at(-1)?.key,
+		resettableColumnKeys: b,
+		resizedColumns: y
+	};
 };
-export {
-  P as useResizableColumns
-};
-//# sourceMappingURL=useResizableColumns.js.map
+//#endregion
+export { s as useResizableColumns };
+
+//# sourceMappingURL=useResizableColumns.js.map