@aiquants/virtualscroll 1.0.0 → 1.2.0

package/dist/index.js

@@ -1,16 +1,16 @@
-import { jsx as $, jsxs as Se, Fragment as Je } from "react/jsx-runtime";
-import { forwardRef as ke, useState as de, useRef as k, useCallback as A, useImperativeHandle as Oe, useMemo as xe, useEffect as se, useReducer as st, useLayoutEffect as Ee, useId as ot } from "react";
-import { twMerge as we } from "tailwind-merge";
-const Ke = {
+import { jsx as H, jsxs as Se, Fragment as rt } from "react/jsx-runtime";
+import { forwardRef as ke, useState as pe, useRef as F, useCallback as y, useImperativeHandle as Ye, useMemo as Te, useEffect as se, useReducer as bt, useLayoutEffect as Ae, useId as Tt } from "react";
+import { twMerge as Ie } from "tailwind-merge";
+const Ze = {
   active: !1,
   offsetX: 0,
   offsetY: 0,
   distance: 0,
   direction: 0
-}, qe = 6, it = ({ dragState: o, normalizedDistance: e }) => {
-  const t = 1 + e * 0.18, n = 0.16 + e * 0.24, r = 0.38 + e * 0.28, i = o.active ? "80ms ease-out" : "220ms ease";
-  return /* @__PURE__ */ Se(Je, { children: [
-    /* @__PURE__ */ $(
+}, Je = 6, yt = ({ dragState: s, normalizedDistance: e }) => {
+  const t = 1 + e * 0.18, n = 0.16 + e * 0.24, r = 0.38 + e * 0.28, o = s.active ? "80ms ease-out" : "220ms ease";
+  return /* @__PURE__ */ Se(rt, { children: [
+    /* @__PURE__ */ H(
       "div",
       {
         className: "absolute inset-0 rounded-full",
@@ -18,11 +18,11 @@ const Ke = {
           background: "linear-gradient(140deg, rgba(255,255,255,0.62), rgba(72,72,72,0.48))",
           boxShadow: `0 0 0 1px rgba(255,255,255,0.28), 0 10px 22px rgba(0,0,0,${n})`,
           transform: `scale(${t})`,
-          transition: `${i}, ${o.active ? "80ms" : "260ms"} box-shadow ease`
+          transition: `${o}, ${s.active ? "80ms" : "260ms"} box-shadow ease`
         }
       }
     ),
-    /* @__PURE__ */ $(
+    /* @__PURE__ */ H(
       "div",
       {
         className: "absolute inset-[18%] rounded-full",
@@ -30,693 +30,767 @@ const Ke = {
           background: "linear-gradient(140deg, rgba(255,255,255,0.72), rgba(28,28,28,0.58))",
           boxShadow: "inset 0 4px 10px rgba(0,0,0,0.24), inset 0 0 2px rgba(255,255,255,0.55)",
           opacity: r,
-          transition: o.active ? "120ms opacity ease-out" : "220ms opacity ease"
+          transition: s.active ? "120ms opacity ease-out" : "220ms opacity ease"
         }
       }
     )
   ] });
-}, Qe = ke(({ onDragChange: o, className: e, maxVisualDistance: t = 160, size: n = 40, style: r, opacity: i = 1, renderVisual: l }, a) => {
-  const [h, u] = de(Ke), d = k(null), p = k({ x: 0, y: 0 }), R = k(null), V = A((m) => {
-    u(m), o(m);
-  }, [o]), X = A(
-    (m, D, f = !1) => {
-      const { x: F, y: g } = p.current, N = m - F, L = D - g, C = Math.abs(L), M = C < qe ? 0 : L < 0 ? -1 : 1;
-      V({
-        active: f || C >= qe,
-        offsetX: N,
-        offsetY: L,
-        distance: C,
-        direction: M
+}, st = ke(({ onDragChange: s, className: e, maxVisualDistance: t = 160, size: n = 40, style: r, opacity: o = 1, renderVisual: i }, a) => {
+  const [f, c] = pe(Ze), u = F(null), p = F({ x: 0, y: 0 }), E = F(null), A = y((d) => {
+    c(d), s(d);
+  }, [s]), O = y(
+    (d, M, z = !1) => {
+      const { x: Z, y: h } = p.current, _ = d - Z, g = M - h, P = Math.abs(g), R = P < Je ? 0 : g < 0 ? -1 : 1;
+      A({
+        active: z || P >= Je,
+        offsetX: _,
+        offsetY: g,
+        distance: P,
+        direction: R
       });
     },
-    [V]
-  ), ee = A((m) => {
-    if (m === null)
+    [A]
+  ), te = y((d) => {
+    if (d === null)
       return;
-    const D = R.current;
-    D?.hasPointerCapture(m) && D.releasePointerCapture(m);
-  }, []), b = A(
-    (m = !1) => {
-      m && ee(d.current), d.current = null, V(Ke);
+    const M = E.current;
+    M?.hasPointerCapture(d) && M.releasePointerCapture(d);
+  }, []), X = y(
+    (d = !1) => {
+      d && te(u.current), u.current = null, A(Ze);
     },
-    [V, ee]
-  ), ae = A(
-    (m) => {
-      m.preventDefault(), m.stopPropagation();
-      const D = R.current ?? m.currentTarget, { left: f, top: F, width: g, height: N } = D.getBoundingClientRect();
-      p.current = { x: f + g / 2, y: F + N / 2 }, d.current = m.pointerId, D.setPointerCapture(m.pointerId), X(m.clientX, m.clientY, !0);
+    [A, te]
+  ), ne = y(
+    (d) => {
+      d.preventDefault(), d.stopPropagation();
+      const M = E.current ?? d.currentTarget, { left: z, top: Z, width: h, height: _ } = M.getBoundingClientRect();
+      p.current = { x: z + h / 2, y: Z + _ / 2 }, u.current = d.pointerId, M.setPointerCapture(d.pointerId), O(d.clientX, d.clientY, !0);
     },
-    [X]
-  ), le = A(
-    (m) => {
-      d.current === m.pointerId && (m.preventDefault(), X(m.clientX, m.clientY));
+    [O]
+  ), S = y(
+    (d) => {
+      u.current === d.pointerId && (d.preventDefault(), O(d.clientX, d.clientY));
     },
-    [X]
-  ), Z = A(
-    (m) => {
-      d.current === m.pointerId && (m.preventDefault(), m.stopPropagation(), b(!0));
+    [O]
+  ), ce = y(
+    (d) => {
+      u.current === d.pointerId && (d.preventDefault(), d.stopPropagation(), X(!0));
     },
-    [b]
+    [X]
   );
-  Oe(
+  Ye(
     a,
     () => ({
       reset: () => {
-        b(!0);
+        X(!0);
       },
-      getElement: () => R.current
+      getElement: () => E.current
     }),
-    [b]
+    [X]
   );
-  const _ = Math.min(Math.max(i, 0), 1), U = n / 64, O = Math.min(h.distance, t) / t, x = h.direction * O * 10 * U, P = l ?? it, w = {
-    dragState: h,
-    normalizedDistance: O,
-    sizeScale: U,
+  const le = Math.min(Math.max(o, 0), 1), G = n / 64, C = Math.min(f.distance, t) / t, K = f.direction * C * 10 * G, I = i ?? yt, x = {
+    dragState: f,
+    normalizedDistance: C,
+    sizeScale: G,
     size: n,
-    opacity: _
-  }, H = {
+    opacity: le
+  }, $ = {
     ...r,
     width: n,
     height: n,
-    transform: `translateY(${x}px)`
+    transform: `translateY(${K}px)`
   };
-  return H.opacity = _, /* @__PURE__ */ $(
+  return $.opacity = le, /* @__PURE__ */ H(
     "div",
     {
-      ref: R,
-      className: we(
+      ref: E,
+      className: Ie(
         "relative flex touch-none select-none items-center justify-center",
         "transition-transform duration-100 ease-out",
         e
       ),
-      style: H,
-      onPointerDown: ae,
-      onPointerMove: le,
-      onPointerUp: Z,
-      onPointerCancel: Z,
+      style: $,
+      onPointerDown: ne,
+      onPointerMove: S,
+      onPointerUp: ce,
+      onPointerCancel: ce,
       role: "presentation",
-      children: P(w)
+      children: I(x)
     }
   );
 });
-Qe.displayName = "TapScrollCircle";
-const G = (o, e, t) => Math.min(t, Math.max(e, o)), je = (o, e, t) => {
-  const n = "touches" in o.nativeEvent, r = n ? o.nativeEvent.touches[0] : o.nativeEvent, i = (a) => {
+st.displayName = "TapScrollCircle";
+const W = (s, e, t) => Math.min(t, Math.max(e, s)), Qe = (s, e, t) => {
+  const n = "touches" in s.nativeEvent, r = n ? s.nativeEvent.touches[0] : s.nativeEvent, o = (a) => {
     n && a.cancelable && a.preventDefault();
-    const h = "touches" in a ? a.touches[0] : a;
+    const f = "touches" in a ? a.touches[0] : a;
     e({
-      deltaX: h.clientX - r.clientX,
-      deltaY: h.clientY - r.clientY
+      deltaX: f.clientX - r.clientX,
+      deltaY: f.clientY - r.clientY
     });
-  }, l = () => {
-    n ? (document.removeEventListener("touchmove", i), document.removeEventListener("touchend", l)) : (document.removeEventListener("mousemove", i), document.removeEventListener("mouseup", l)), t?.();
+  }, i = () => {
+    n ? (document.removeEventListener("touchmove", o), document.removeEventListener("touchend", i)) : (document.removeEventListener("mousemove", o), document.removeEventListener("mouseup", i)), t?.();
   };
-  n ? (document.addEventListener("touchmove", i, { passive: !1 }), document.addEventListener("touchend", l)) : (document.addEventListener("mousemove", i), document.addEventListener("mouseup", l));
-}, Ne = "virtualscroll:tap-scroll-cancel", We = 20, at = 250, lt = 60, ct = 20, ut = 20, dt = 220, Be = { active: !1, offsetX: 0, offsetY: 0, distance: 0, direction: 0 }, De = 2.2, ft = 8, ht = 120, pe = {
+  n ? (document.addEventListener("touchmove", o, { passive: !1 }), document.addEventListener("touchend", i)) : (document.addEventListener("mousemove", o), document.addEventListener("mouseup", i));
+}, ze = "virtualscroll:tap-scroll-cancel", Be = 20, St = 250, wt = 60, It = 20, Mt = 20, Pt = 220, et = { active: !1, offsetX: 0, offsetY: 0, distance: 0, direction: 0 }, Oe = 2.2, Vt = 8, Et = 120, me = {
   enabled: !0,
   size: 40,
   offsetX: -80,
   offsetY: 0,
   className: void 0,
-  maxVisualDistance: dt,
+  maxVisualDistance: Pt,
+  minSpeedMultiplier: 0.2,
   opacity: 1,
-  renderVisual: void 0
-}, mt = (o) => {
-  if (!o || o <= 0)
-    return De;
-  const e = Math.max(1, o), t = Math.log10(e), n = De + t * ft;
-  return G(n, De, ht);
-}, pt = ({ contentSize: o, viewportSize: e, scrollPosition: t, onScroll: n, enableThumbDrag: r = !0, enableTrackClick: i = !0, enableArrowButtons: l = !0, horizontal: a = !1, scrollBarWidth: h = 12, className: u, ariaControls: d, tapScrollCircleOptions: p, itemCount: R }) => {
-  const [V, X] = de(!1), [ee, b] = de(!1), [ae, le] = de(!1), Z = k(null), _ = k(t), U = k(null), O = k(null), x = k(Be), P = k(null), w = k(null), H = k(null), m = xe(() => {
-    const s = p?.maxSpeedMultiplier, v = typeof s == "number" ? s : mt(R);
-    return {
-      enabled: p?.enabled ?? pe.enabled,
-      size: p?.size ?? pe.size,
-      offsetX: p?.offsetX ?? pe.offsetX,
-      offsetY: p?.offsetY ?? pe.offsetY,
-      className: p?.className ?? pe.className,
-      maxVisualDistance: p?.maxVisualDistance ?? pe.maxVisualDistance,
-      maxSpeedMultiplier: v,
-      opacity: G(p?.opacity ?? pe.opacity, 0, 1),
-      renderVisual: p?.renderVisual ?? pe.renderVisual
-    };
-  }, [R, p]), {
-    enabled: D,
-    size: f,
-    offsetX: F,
-    offsetY: g,
-    className: N,
-    maxVisualDistance: L,
-    maxSpeedMultiplier: C,
-    opacity: M,
-    renderVisual: y
-  } = m, I = a ? "width" : "height", T = a ? "height" : "width", S = a ? "left" : "top", E = a ? "clientX" : "clientY", q = (s, v) => a ? s : v, oe = (s) => s[E], j = a ? ["Scroll left", "Scroll right"] : ["Scroll up", "Scroll down"], W = a ? ["◀", "▶"] : ["▲", "▼"], ne = a ? "flex flex-row items-stretch" : "flex flex-col items-stretch", B = Math.max(L, 1), fe = e / o, Y = h, c = Math.max(e - Y * 2, 0), J = fe * c, Q = Math.min(Math.max(We, J || 0), c || We), z = o - e, ie = Math.max(c - Q, 0), ge = z <= 0 || ie <= 0 ? 0 : t / z * ie, he = o > e, Ye = he && l;
+  renderVisual: void 0,
+  maxSpeedCurve: void 0
+}, Ct = (s) => s ? {
+  mainSizeKey: "width",
+  crossSizeKey: "height",
+  positionKey: "left",
+  selectDelta: (e, t) => e,
+  getPointerCoordinate: ({ clientX: e }) => e,
+  arrowLabels: ["Scroll left", "Scroll right"],
+  arrowIcons: ["◀", "▶"],
+  directionClass: "flex flex-row items-stretch",
+  orientation: "horizontal"
+} : {
+  mainSizeKey: "height",
+  crossSizeKey: "width",
+  positionKey: "top",
+  selectDelta: (e, t) => t,
+  getPointerCoordinate: ({ clientY: e }) => e,
+  arrowLabels: ["Scroll up", "Scroll down"],
+  arrowIcons: ["▲", "▼"],
+  directionClass: "flex flex-col items-stretch",
+  orientation: "vertical"
+}, At = (s, e) => {
+  const t = s?.maxSpeedMultiplier, n = typeof t == "number" ? t : Ft(e);
+  return {
+    enabled: s?.enabled ?? me.enabled,
+    size: s?.size ?? me.size,
+    offsetX: s?.offsetX ?? me.offsetX,
+    offsetY: s?.offsetY ?? me.offsetY,
+    className: s?.className ?? me.className,
+    maxVisualDistance: s?.maxVisualDistance ?? me.maxVisualDistance,
+    maxSpeedMultiplier: n,
+    minSpeedMultiplier: Math.max(s?.minSpeedMultiplier ?? me.minSpeedMultiplier, 0),
+    opacity: W(s?.opacity ?? me.opacity, 0, 1),
+    renderVisual: s?.renderVisual ?? me.renderVisual,
+    maxSpeedCurve: s?.maxSpeedCurve ?? me.maxSpeedCurve
+  };
+}, _t = ({ thumbRef: s, isDragging: e, isThumbHovered: t, enableThumbDrag: n, horizontal: r }) => {
   se(() => {
-    _.current = t;
-  }, [t]), se(() => {
-    r || b(!1);
-  }, [r]), se(() => {
-    const s = Z.current;
-    if (!s)
+    const o = s.current;
+    if (!o)
       return;
-    const v = a ? "scaleY(1.06)" : "scaleX(1.06)", K = a ? "scaleY(1.12)" : "scaleX(1.12)";
-    if (!r) {
-      s.style.removeProperty("transform"), s.style.backgroundColor = "#7F7F7F", s.style.removeProperty("transition");
+    const i = r ? "scaleY(1.06)" : "scaleX(1.06)", a = r ? "scaleY(1.12)" : "scaleX(1.12)";
+    if (!n) {
+      o.style.removeProperty("transform"), o.style.backgroundColor = "#7F7F7F", o.style.removeProperty("transition");
       return;
     }
-    if (V) {
-      s.style.transform = K, s.style.backgroundColor = "#4F4F4F", s.style.transition = "transform 60ms ease-out";
+    if (e) {
+      o.style.transform = a, o.style.backgroundColor = "#4F4F4F", o.style.transition = "transform 60ms ease-out";
       return;
     }
-    s.style.transition = "transform 80ms ease-out", ee ? (s.style.transform = v, s.style.backgroundColor = "#5F5F5F") : (s.style.removeProperty("transform"), s.style.backgroundColor = "#7F7F7F");
-  }, [r, a, V, ee]);
-  const Ie = A(() => {
-    U.current !== null && (window.clearInterval(U.current), U.current = null), O.current !== null && (window.clearTimeout(O.current), O.current = null);
-  }, []), ce = A(() => {
-    w.current !== null && (window.cancelAnimationFrame(w.current), w.current = null), H.current = null;
-  }, []), ue = A(() => {
-    x.current = { ...Be }, le(!1), P.current?.reset(), ce();
-  }, [ce]), Ve = A(
-    (s) => {
-      const v = x.current;
-      if (!v.active || v.direction === 0) {
-        ce();
+    o.style.transition = "transform 80ms ease-out", t ? (o.style.transform = i, o.style.backgroundColor = "#5F5F5F") : (o.style.removeProperty("transform"), o.style.backgroundColor = "#7F7F7F");
+  }, [n, r, e, t, s]);
+}, Rt = ({ canUseArrowButtons: s, enableArrowButtons: e, resetTapScroll: t, scrollByStep: n }) => {
+  const r = F(null), o = F(null), i = y(() => {
+    r.current !== null && (window.clearInterval(r.current), r.current = null), o.current !== null && (window.clearTimeout(o.current), o.current = null);
+  }, []), a = y(() => {
+    i();
+  }, [i]), f = y(
+    (u) => (p) => {
+      s && (p.preventDefault(), p.stopPropagation(), t(), i(), n(u), o.current = window.setTimeout(() => {
+        r.current = window.setInterval(() => {
+          n(u);
+        }, wt);
+      }, St));
+    },
+    [s, i, t, n]
+  ), c = y(
+    (u) => (p) => {
+      e && (p.key === "Enter" || p.key === " " || p.key === "Spacebar") && (p.preventDefault(), n(u));
+    },
+    [e, n]
+  );
+  return se(() => () => {
+    i();
+  }, [i]), { handleArrowPointerDown: f, handleArrowPointerUp: a, handleArrowKeyDown: c };
+}, Ft = (s) => {
+  if (!s || s <= 0)
+    return Oe;
+  const e = Math.max(1, s), t = Math.log10(e), n = Oe + t * Vt;
+  return W(n, Oe, Et);
+}, Lt = ({
+  contentSize: s,
+  viewportSize: e,
+  scrollPosition: t,
+  onScroll: n,
+  enableThumbDrag: r = !0,
+  enableTrackClick: o = !0,
+  enableArrowButtons: i = !0,
+  horizontal: a = !1,
+  scrollBarWidth: f = 12,
+  className: c,
+  ariaControls: u,
+  tapScrollCircleOptions: p,
+  itemCount: E,
+  renderThumbOverlay: A
+}) => {
+  const [O, te] = pe(!1), [X, ne] = pe(!1), [S, ce] = pe(!1), le = F(null), G = F(t), C = F(et), K = F(null), I = F(null), x = F(null), $ = Te(() => At(p, E), [E, p]), d = Te(() => Ct(a), [a]), {
+    enabled: M,
+    size: z,
+    offsetX: Z,
+    offsetY: h,
+    className: _,
+    maxVisualDistance: g,
+    maxSpeedMultiplier: P,
+    minSpeedMultiplier: R,
+    opacity: k,
+    renderVisual: L,
+    maxSpeedCurve: v
+  } = $, { mainSizeKey: w, crossSizeKey: b, positionKey: T, selectDelta: V, getPointerCoordinate: J, arrowLabels: oe, arrowIcons: q, directionClass: Q, orientation: ie } = d, j = Math.max(g, 1), ge = e / s, D = f, l = Math.max(e - D * 2, 0), B = ge * l, U = Math.min(Math.max(Be, B || 0), l || Be), N = s - e, ue = Math.max(l - U, 0), xe = N <= 0 || ue <= 0 ? 0 : t / N * ue, ot = xe + U / 2, de = s > e, He = de && i;
+  se(() => {
+    G.current = t;
+  }, [t]), se(() => {
+    r || ne(!1);
+  }, [r]), _t({ thumbRef: le, isDragging: O, isThumbHovered: X, enableThumbDrag: r, horizontal: a });
+  const fe = y(() => {
+    I.current !== null && (window.cancelAnimationFrame(I.current), I.current = null), x.current = null;
+  }, []), he = y(() => {
+    C.current = { ...et }, ce(!1), K.current?.reset(), fe();
+  }, [fe]), Me = y(
+    (m) => {
+      const Y = C.current;
+      if (!Y.active || Y.direction === 0) {
+        fe();
         return;
       }
-      if (!he || z <= 0) {
-        ce();
+      if (!de || N <= 0) {
+        fe();
         return;
       }
-      const K = H.current ?? s, te = Math.max((s - K) / 1e3, 0);
-      if (H.current = s, te <= 0) {
-        w.current = window.requestAnimationFrame(Ve);
+      const ee = x.current ?? m, re = Math.max((m - ee) / 1e3, 0);
+      if (x.current = m, re <= 0) {
+        I.current = window.requestAnimationFrame(Me);
         return;
       }
-      const _e = (Math.min(v.distance, B) / B) ** 1.1, be = Math.max(e * 0.2, 40), Fe = Math.max(e * C, 1200), Le = be + (Fe - be) * _e, Te = _.current, Ce = G(Te + v.direction * Le * te, 0, z);
-      if (Ce === Te) {
-        ce();
+      const ve = Math.min(Y.distance, j) / j, Re = ve ** 1.1, Ve = typeof p?.maxSpeedMultiplier == "number", ye = Math.max(e * R, 40), Fe = Ve ? ye : 1200;
+      let Le = Math.max(e * P, Fe);
+      if (v) {
+        const Ee = Math.max(v.exponentialSteepness, 0), pt = Math.max(v.exponentialScale ?? P, 0), gt = Ee === 0 ? ve : Math.expm1(Ee * ve), Ge = Ee === 0 ? 1 : Math.expm1(Ee) || 1, xt = Ge === 0 ? ve : Math.min(Math.max(gt / Ge, 0), 1), vt = e * pt * xt;
+        Le = Math.min(Le, Math.max(vt, ye));
+      }
+      const dt = Math.max(Le, ye), ft = Math.max(v?.easedOffset ?? 0, 0), ht = Math.min(1, Re + ft), mt = ye + (dt - ye) * ht, De = G.current, Ne = W(De + Y.direction * mt * re, 0, N);
+      if (Ne === De) {
+        fe();
         return;
       }
-      _.current = Ce, n?.(Ce, Te), w.current = window.requestAnimationFrame(Ve);
+      G.current = Ne, n?.(Ne, De), I.current = window.requestAnimationFrame(Me);
     },
-    [B, z, n, he, ce, C, e]
-  ), ze = A(() => {
-    w.current === null && (H.current = null, w.current = window.requestAnimationFrame(Ve));
-  }, [Ve]);
+    [j, N, n, de, fe, v, P, R, p, e]
+  ), $e = y(() => {
+    I.current === null && (x.current = null, I.current = window.requestAnimationFrame(Me));
+  }, [Me]);
   se(() => () => {
-    Ie(), ce();
-  }, [Ie, ce]);
-  const et = A(
-    (s) => {
-      x.current = s, le(s.active), s.active && s.direction !== 0 ? ze() : ce();
+    fe();
+  }, [fe]);
+  const it = y(
+    (m) => {
+      C.current = m, ce(m.active), m.active && m.direction !== 0 ? $e() : fe();
     },
-    [ze, ce]
+    [$e, fe]
   );
   se(() => {
-    D || ue();
-  }, [ue, D]), se(() => {
-    const s = (v) => {
-      const te = v.detail?.paneId;
-      te && d && te !== d || ue();
+    M || he();
+  }, [he, M]), se(() => {
+    const m = (Y) => {
+      const re = Y.detail?.paneId;
+      re && u && re !== u || he();
     };
-    return window.addEventListener(Ne, s), () => {
-      window.removeEventListener(Ne, s);
+    return window.addEventListener(ze, m), () => {
+      window.removeEventListener(ze, m);
     };
-  }, [d, ue]), se(() => {
-    if (!D)
+  }, [u, he]), se(() => {
+    if (!M)
       return;
-    const s = (v) => {
-      if (!x.current.active)
+    const m = (Y) => {
+      if (!C.current.active)
         return;
-      const K = v.target;
-      if (!(K instanceof Node)) {
-        ue();
+      const ee = Y.target;
+      if (!(ee instanceof Node)) {
+        he();
         return;
       }
-      P.current?.getElement()?.contains(K) || ue();
+      K.current?.getElement()?.contains(ee) || he();
     };
-    return document.addEventListener("pointerdown", s, !0), () => {
-      document.removeEventListener("pointerdown", s, !0);
+    return document.addEventListener("pointerdown", m, !0), () => {
+      document.removeEventListener("pointerdown", m, !0);
     };
-  }, [ue, D]);
-  const Ae = (s) => {
-    if (!he || ie <= 0 || z <= 0)
+  }, [he, M]);
+  const _e = (m) => {
+    if (!de || ue <= 0 || N <= 0)
       return 0;
-    const v = G(s, 0, ie);
-    return G(v / ie * z, 0, z);
-  }, Re = (s) => {
-    if (!he || z <= 0)
+    const Y = W(m, 0, ue);
+    return W(Y / ue * N, 0, N);
+  }, at = (m) => {
+    if (!de || N <= 0)
       return;
-    const v = Math.max(Math.round(e / ut), ct), K = _.current, te = G(K + s * v, 0, z);
-    te !== K && (_.current = te, n?.(te, K));
-  }, Pe = () => {
-    Ie();
-  }, He = (s) => (v) => {
-    Ye && (v.preventDefault(), v.stopPropagation(), ue(), Ie(), Re(s), O.current = window.setTimeout(() => {
-      U.current = window.setInterval(() => {
-        Re(s);
-      }, lt);
-    }, at));
-  }, tt = (s) => (v) => {
-    l && (v.key === "Enter" || v.key === " " || v.key === "Spacebar") && (v.preventDefault(), Re(s));
-  }, $e = (s) => {
-    if (!he)
+    const Y = Math.max(Math.round(e / Mt), It), ee = G.current, re = W(ee + m * Y, 0, N);
+    re !== ee && (G.current = re, n?.(re, ee));
+  }, { handleArrowPointerDown: Xe, handleArrowPointerUp: Pe, handleArrowKeyDown: lt } = Rt({
+    canUseArrowButtons: He,
+    enableArrowButtons: i,
+    resetTapScroll: he,
+    scrollByStep: at
+  }), Ue = (m) => {
+    if (!de)
       return;
     if (!r) {
-      s.preventDefault(), s.stopPropagation();
+      m.preventDefault(), m.stopPropagation();
       return;
     }
-    if ("button" in s && s.button !== 0 || s.ctrlKey)
+    if ("button" in m && m.button !== 0 || m.ctrlKey)
       return;
-    s.stopPropagation(), ue();
-    const v = ge;
-    X(!0), b(!0), je(
-      s,
-      ({ deltaX: K, deltaY: te }) => {
-        const ve = q(K, te);
-        n?.(Ae(v + ve), ge);
+    m.stopPropagation(), he();
+    const Y = xe;
+    te(!0), ne(!0), Qe(
+      m,
+      ({ deltaX: ee, deltaY: re }) => {
+        const ve = V(ee, re);
+        n?.(_e(Y + ve), xe);
       },
       () => {
-        X(!1), Z.current && !Z.current.matches(":hover") && b(!1);
+        te(!1), le.current && !le.current.matches(":hover") && ne(!1);
       }
     );
-  }, Xe = (s) => {
-    if (!he)
+  }, Ke = (m) => {
+    if (!de)
       return;
-    if (!i) {
-      s.preventDefault(), s.stopPropagation();
+    if (!o) {
+      m.preventDefault(), m.stopPropagation();
       return;
     }
-    if ("button" in s && s.button !== 0 || s.ctrlKey)
+    if ("button" in m && m.button !== 0 || m.ctrlKey)
       return;
-    const K = "touches" in s.nativeEvent ? s.nativeEvent.touches[0] : s.nativeEvent, te = oe(K), ve = s.currentTarget.getBoundingClientRect(), _e = te - (a ? ve.left : ve.top);
-    ue();
-    const be = _e - Q / 2;
-    n?.(Ae(be), ge), je(s, ({ deltaX: Fe, deltaY: Le }) => {
-      const Te = q(Fe, Le);
-      n?.(Ae(be + Te), ge);
+    const ee = "touches" in m.nativeEvent ? m.nativeEvent.touches[0] : m.nativeEvent, re = J(ee), ve = m.currentTarget.getBoundingClientRect(), Re = re - (a ? ve.left : ve.top);
+    he();
+    const Ve = Re - U / 2;
+    n?.(_e(Ve), xe), Qe(m, ({ deltaX: ye, deltaY: Fe }) => {
+      const We = V(ye, Fe);
+      n?.(_e(Ve + We), xe);
     });
-  }, nt = xe(() => G((ae ? 1 : 0.8) * M, 0, 1), [ae, M]), rt = xe(() => {
-    const v = `calc(50% - ${f / 2}px + ${g}px)`;
+  }, ct = Te(() => W((S ? 1 : 0.8) * k, 0, 1), [S, k]), ut = Te(() => {
+    const Y = `calc(50% - ${z / 2}px + ${h}px)`;
     return {
-      left: F,
-      top: v
+      left: Z,
+      top: Y
     };
-  }, [F, g, f]), Ue = (s, v, K) => /* @__PURE__ */ $(
+  }, [Z, h, z]), qe = (m, Y, ee) => /* @__PURE__ */ H(
     "button",
     {
       type: "button",
       className: "flex items-center justify-center text-[#313131] text-xs transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-[#60a5fa] focus-visible:ring-offset-1 disabled:cursor-not-allowed disabled:opacity-50",
       style: {
-        [I]: Y,
-        [T]: h,
+        [w]: D,
+        [b]: f,
         backgroundColor: "#E0E0E0"
       },
-      "aria-label": v,
-      onMouseDown: He(s),
-      onTouchStart: He(s),
+      "aria-label": Y,
+      onMouseDown: Xe(m),
+      onTouchStart: Xe(m),
       onMouseUp: Pe,
       onMouseLeave: Pe,
       onTouchEnd: Pe,
       onTouchCancel: Pe,
-      onKeyDown: tt(s),
-      "aria-disabled": !l,
-      disabled: !Ye,
-      children: /* @__PURE__ */ $("span", { "aria-hidden": "true", children: K })
+      onKeyDown: lt(m),
+      "aria-disabled": !i,
+      disabled: !He,
+      children: /* @__PURE__ */ H("span", { "aria-hidden": "true", children: ee })
     }
-  );
+  ), je = A && de ? {
+    orientation: ie,
+    scrollPosition: t,
+    maxScrollPosition: N,
+    contentSize: s,
+    viewportSize: e,
+    thumbSize: U,
+    thumbPosition: xe,
+    thumbCenter: ot,
+    trackSize: l,
+    isDragging: O,
+    isTapScrollActive: S
+  } : null;
   return /* @__PURE__ */ Se(
     "div",
     {
-      className: we(
-        "group relative cursor-default select-none",
-        ne,
-        u
-      ),
+      className: Ie("group relative cursor-default select-none", Q, c),
       style: {
-        [I]: e,
-        [T]: h,
+        [w]: e,
+        [b]: f,
         backgroundColor: "white",
         userSelect: "none",
         position: "relative"
       },
       role: "scrollbar",
       tabIndex: -1,
-      "aria-controls": d,
+      "aria-controls": u,
       "aria-valuenow": t,
       "aria-valuemin": 0,
-      "aria-valuemax": z,
+      "aria-valuemax": N,
       "aria-orientation": a ? "horizontal" : "vertical",
       children: [
-        !a && he && D && /* @__PURE__ */ $(
-          Qe,
+        !a && de && M && /* @__PURE__ */ H(
+          st,
           {
-            ref: P,
-            className: we(
-              "pointer-events-auto absolute transition-opacity duration-150",
-              N
-            ),
-            size: f,
-            maxVisualDistance: B,
-            style: rt,
-            opacity: nt,
-            renderVisual: y,
-            onDragChange: et
+            ref: K,
+            className: Ie("pointer-events-auto absolute transition-opacity duration-150", _),
+            size: z,
+            maxVisualDistance: j,
+            style: ut,
+            opacity: ct,
+            renderVisual: L,
+            onDragChange: it
           }
         ),
-        Ue(-1, j[0], W[0]),
-        /* @__PURE__ */ $(
+        qe(-1, oe[0], q[0]),
+        /* @__PURE__ */ Se(
           "div",
           {
             className: "relative flex-1",
             style: {
               backgroundColor: "#F5F5F5",
-              borderRadius: h / 2
+              borderRadius: f / 2
             },
-            onMouseDown: Xe,
-            onTouchStart: Xe,
-            "aria-disabled": !i,
-            children: he && // スクロールバーのつまみの当たり判定を広げるためのラッパー
-            /* @__PURE__ */ $(
-              "div",
-              {
-                className: "group absolute",
-                style: {
-                  [I]: Q,
-                  [S]: ge,
-                  ...a ? { top: 0, bottom: 0 } : { left: 0, right: 0 }
-                },
-                onMouseDown: $e,
-                onTouchStart: $e,
-                role: "slider",
-                "aria-orientation": a ? "horizontal" : "vertical",
-                "aria-valuenow": t,
-                "aria-valuemin": 0,
-                "aria-valuemax": z,
-                "aria-disabled": !r,
-                tabIndex: r ? 0 : -1,
-                children: /* @__PURE__ */ $(
-                  "div",
-                  {
-                    ref: Z,
-                    className: we(
-                      "absolute",
-                      a ? `inset-x-0 inset-y-[1.5px] group-hover:inset-y-[-0.5px] ${V ? "-inset-y-0.5" : "group-active:-inset-y-0.5"}` : `inset-x-[1.5px] inset-y-0 group-hover:inset-x-[-0.5px] ${V ? "-inset-x-0.5" : "group-active:-inset-x-0.5"}`
-                    ),
-                    style: {
-                      backgroundColor: "#7F7F7F",
-                      borderRadius: h - 1,
-                      cursor: r ? "pointer" : "default",
-                      ...a ? {
-                        left: 0,
-                        right: 0,
-                        top: 1.5,
-                        bottom: 1.5
-                      } : {
-                        top: 0,
-                        bottom: 0,
-                        left: 1.5,
-                        right: 1.5
+            onMouseDown: Ke,
+            onTouchStart: Ke,
+            "aria-disabled": !o,
+            children: [
+              je && /* @__PURE__ */ H("div", { className: "pointer-events-none absolute inset-0", "aria-hidden": !0, children: A?.(je) }),
+              de && // スクロールバーのつまみの当たり判定を広げるためのラッパー
+              /* @__PURE__ */ H(
+                "div",
+                {
+                  className: "group absolute",
+                  style: {
+                    [w]: U,
+                    [T]: xe,
+                    ...a ? { top: 0, bottom: 0 } : { left: 0, right: 0 }
+                  },
+                  onMouseDown: Ue,
+                  onTouchStart: Ue,
+                  role: "slider",
+                  "aria-orientation": a ? "horizontal" : "vertical",
+                  "aria-valuenow": t,
+                  "aria-valuemin": 0,
+                  "aria-valuemax": N,
+                  "aria-disabled": !r,
+                  tabIndex: r ? 0 : -1,
+                  children: /* @__PURE__ */ H(
+                    "div",
+                    {
+                      ref: le,
+                      className: Ie(
+                        "absolute",
+                        a ? `inset-x-0 inset-y-[1.5px] group-hover:inset-y-[-0.5px] ${O ? "-inset-y-0.5" : "group-active:-inset-y-0.5"}` : `inset-x-[1.5px] inset-y-0 group-hover:inset-x-[-0.5px] ${O ? "-inset-x-0.5" : "group-active:-inset-x-0.5"}`
+                      ),
+                      style: {
+                        backgroundColor: "#7F7F7F",
+                        borderRadius: f - 1,
+                        cursor: r ? "pointer" : "default",
+                        ...a ? {
+                          left: 0,
+                          right: 0,
+                          top: 1.5,
+                          bottom: 1.5
+                        } : {
+                          top: 0,
+                          bottom: 0,
+                          left: 1.5,
+                          right: 1.5
+                        }
+                      },
+                      onMouseEnter: () => {
+                        r && ne(!0);
+                      },
+                      onMouseLeave: () => {
+                        r && ne(!1);
                       }
-                    },
-                    onMouseEnter: () => {
-                      r && b(!0);
-                    },
-                    onMouseLeave: () => {
-                      r && b(!1);
                     }
-                  }
-                )
-              }
-            )
+                  )
+                }
+              )
+            ]
           }
         ),
-        Ue(1, j[1], W[1])
+        qe(1, oe[1], q[1])
       ]
     }
   );
-}, re = {
-  debug(o, ...e) {
-    typeof window < "u" && window.localStorage?.getItem("debug") === "true" && console.debug(`[VirtualScroll] ${o}`, ...e);
+}, ae = {
+  debug(s, ...e) {
+    typeof window < "u" && window.localStorage?.getItem("debug") === "true" && console.debug(`[VirtualScroll] ${s}`, ...e);
   },
-  warn(o, ...e) {
-    console.warn(`[VirtualScroll] ${o}`, ...e);
+  warn(s, ...e) {
+    console.warn(`[VirtualScroll] ${s}`, ...e);
   },
-  error(o, ...e) {
-    console.error(`[VirtualScroll] ${o}`, ...e);
+  error(s, ...e) {
+    console.error(`[VirtualScroll] ${s}`, ...e);
   }
-}, ye = {
+}, we = {
   maxVelocity: 6,
   minVelocity: 0.02,
   deceleration: 25e-4,
   velocitySampleWindow: 90,
   startVelocityThreshold: 0.04
-}, Me = (o, e, t) => {
-  for (const [n, r, i] of e)
-    t === "add" ? o.addEventListener(n, r, i) : o.removeEventListener(n, r, i);
-}, gt = ke(({ children: o, contentSize: e, viewportSize: t, scrollBarWidth: n = 12, enableThumbDrag: r = !0, enableTrackClick: i = !0, enableArrowButtons: l = !0, enablePointerDrag: a = !0, onScroll: h, className: u, style: d, background: p, tapScrollCircleOptions: R, inertiaOptions: V, itemCount: X }, ee) => {
-  const b = k(0), [ae, le] = st((f) => f + 1, 0), Z = k(null), _ = k(null), U = k({
+}, Ce = (s, e, t) => {
+  for (const [n, r, o] of e)
+    t === "add" ? s.addEventListener(n, r, o) : s.removeEventListener(n, r, o);
+}, Dt = ke(({ children: s, contentSize: e, viewportSize: t, scrollBarWidth: n = 12, enableThumbDrag: r = !0, enableTrackClick: o = !0, enableArrowButtons: i = !0, enablePointerDrag: a = !0, onScroll: f, className: c, style: u, background: p, tapScrollCircleOptions: E, inertiaOptions: A, itemCount: O, renderThumbOverlay: te, wheelSpeedMultiplier: X = 1 }, ne) => {
+  const S = F(0), [ce, le] = bt((h) => h + 1, 0), G = F(null), C = F(null), K = F({
     frame: null,
     velocity: 0,
     lastTimestamp: null
-  }), O = xe(
+  }), I = Te(
     () => ({
-      maxVelocity: V?.maxVelocity ?? ye.maxVelocity,
-      minVelocity: V?.minVelocity ?? ye.minVelocity,
-      deceleration: V?.deceleration ?? ye.deceleration,
-      velocitySampleWindow: V?.velocitySampleWindow ?? ye.velocitySampleWindow,
-      startVelocityThreshold: V?.startVelocityThreshold ?? ye.startVelocityThreshold
+      maxVelocity: A?.maxVelocity ?? we.maxVelocity,
+      minVelocity: A?.minVelocity ?? we.minVelocity,
+      deceleration: A?.deceleration ?? we.deceleration,
+      velocitySampleWindow: A?.velocitySampleWindow ?? we.velocitySampleWindow,
+      startVelocityThreshold: A?.startVelocityThreshold ?? we.startVelocityThreshold
     }),
-    [V]
+    [A]
   );
-  re.debug("[ScrollPane] ScrollPane rendered", { contentSize: e, viewportSize: t, scrollBarWidth: n, className: u, style: d, tapScrollCircleOptions: R, inertiaOptions: V, enablePointerDrag: a });
-  const x = k({ contentSize: e, viewportSize: t }), P = xe(() => e > t, [e, t]), w = A(
-    (f) => {
-      const { contentSize: F, viewportSize: g } = x.current, N = F > g, L = b.current;
-      if (re.debug("[ScrollPane] scrollTo called", { newPosition: f, contentSize: F, viewportSize: g, currentIsScrollable: N, prevPosition: L }), !N) {
-        b.current !== 0 && (b.current = 0, h?.(0, L));
+  ae.debug("[ScrollPane] ScrollPane rendered", { contentSize: e, viewportSize: t, scrollBarWidth: n, className: c, style: u, tapScrollCircleOptions: E, inertiaOptions: A, enablePointerDrag: a });
+  const x = F({ contentSize: e, viewportSize: t }), $ = Te(() => e > t, [e, t]), d = y(
+    (h) => {
+      const { contentSize: _, viewportSize: g } = x.current, P = _ > g, R = S.current;
+      if (ae.debug("[ScrollPane] scrollTo called", { newPosition: h, contentSize: _, viewportSize: g, currentIsScrollable: P, prevPosition: R }), !P) {
+        S.current !== 0 && (S.current = 0, f?.(0, R));
         return;
       }
-      const C = typeof f == "function" ? f(b.current) : f, M = G(C, 0, F - g);
-      b.current !== M && (b.current = M, h?.(M, L));
+      const k = typeof h == "function" ? h(S.current) : h, L = W(k, 0, _ - g);
+      S.current !== L && (S.current = L, f?.(L, R));
     },
-    [h]
-  ), H = A(() => {
-    const f = U.current;
-    f.frame !== null && cancelAnimationFrame(f.frame), f.frame = null, f.velocity = 0, f.lastTimestamp = null;
-  }, []), m = A(
-    (f) => {
-      if (!P)
+    [f]
+  ), M = y(() => {
+    const h = K.current;
+    h.frame !== null && cancelAnimationFrame(h.frame), h.frame = null, h.velocity = 0, h.lastTimestamp = null;
+  }, []), z = y(
+    (h) => {
+      if (!$)
         return;
-      const { maxVelocity: F, minVelocity: g, deceleration: N, startVelocityThreshold: L } = O, C = G(f, -F, F);
-      if (Math.abs(C) < L)
+      const { maxVelocity: _, minVelocity: g, deceleration: P, startVelocityThreshold: R } = I, k = W(h, -_, _);
+      if (Math.abs(k) < R)
         return;
-      H(), U.current.velocity = C, U.current.lastTimestamp = null;
-      const M = (y) => {
-        const I = U.current;
-        if (I.lastTimestamp === null) {
-          I.lastTimestamp = y, I.frame = requestAnimationFrame(M);
+      M(), K.current.velocity = k, K.current.lastTimestamp = null;
+      const L = (v) => {
+        const w = K.current;
+        if (w.lastTimestamp === null) {
+          w.lastTimestamp = v, w.frame = requestAnimationFrame(L);
           return;
         }
-        const T = y - I.lastTimestamp;
-        if (I.lastTimestamp = y, T <= 0) {
-          I.frame = requestAnimationFrame(M);
+        const b = v - w.lastTimestamp;
+        if (w.lastTimestamp = v, b <= 0) {
+          w.frame = requestAnimationFrame(L);
           return;
         }
-        const S = I.velocity;
-        let E = S;
-        const q = N * T;
-        S > 0 ? E = Math.max(0, S - q) : S < 0 && (E = Math.min(0, S + q));
-        const j = (S + E) / 2 * T, W = b.current;
-        j !== 0 && w((J) => J + j);
-        const ne = b.current, { contentSize: B, viewportSize: fe } = x.current, Y = Math.max(B - fe, 0);
-        I.velocity = E;
-        const c = ne === W || ne <= 0 && E <= 0 || ne >= Y && E >= 0;
-        if (Math.abs(E) < g || c) {
-          H();
+        const T = w.velocity;
+        let V = T;
+        const J = P * b;
+        T > 0 ? V = Math.max(0, T - J) : T < 0 && (V = Math.min(0, T + J));
+        const q = (T + V) / 2 * b, Q = S.current;
+        q !== 0 && d((B) => B + q);
+        const ie = S.current, { contentSize: j, viewportSize: ge } = x.current, D = Math.max(j - ge, 0);
+        w.velocity = V;
+        const l = ie === Q || ie <= 0 && V <= 0 || ie >= D && V >= 0;
+        if (Math.abs(V) < g || l) {
+          M();
           return;
         }
-        I.frame = requestAnimationFrame(M);
+        w.frame = requestAnimationFrame(L);
       };
-      U.current.frame = requestAnimationFrame(M);
+      K.current.frame = requestAnimationFrame(L);
     },
-    [P, O, w, H]
+    [$, I, d, M]
   );
-  Ee(() => {
+  Ae(() => {
     x.current = { contentSize: e, viewportSize: t };
-  }, [e, t]), Ee(() => {
-    if (P) {
-      re.debug("[ScrollPane] Adjusting scroll position due to content or viewport size change", { contentSize: e, viewportSize: t, scrollPosition: b.current });
-      const f = G(e - t, 0, e);
-      b.current > f && w(f);
+  }, [e, t]), Ae(() => {
+    if ($) {
+      ae.debug("[ScrollPane] Adjusting scroll position due to content or viewport size change", { contentSize: e, viewportSize: t, scrollPosition: S.current });
+      const h = W(e - t, 0, e);
+      S.current > h && d(h);
     } else
-      w(0);
-  }, [P, w, e, t]), se(() => {
-    const f = (g) => {
-      if (!P)
+      d(0);
+  }, [$, d, e, t]), se(() => {
+    const h = (g) => {
+      if (!$)
         return;
-      g.preventDefault(), H();
-      let N = g.deltaY;
-      g.deltaMode === 1 ? N *= 16 : g.deltaMode === 2 && (N *= t), re.debug("[ScrollPane] wheel event", { deltaY: N, scrollPosition: b.current }), w((L) => L + N);
-    }, F = Z.current;
-    return F && F.addEventListener("wheel", f, { passive: !1 }), () => {
-      F && F.removeEventListener("wheel", f);
+      g.preventDefault(), M();
+      let P = g.deltaY;
+      g.deltaMode === 1 ? P *= 16 : g.deltaMode === 2 && (P *= t), X !== 1 && (P *= X), ae.debug("[ScrollPane] wheel event", { deltaY: P, scrollPosition: S.current, wheelSpeedMultiplier: X }), d((R) => R + P);
+    }, _ = G.current;
+    return _ && _.addEventListener("wheel", h, { passive: !1 }), () => {
+      _ && _.removeEventListener("wheel", h);
     };
-  }, [P, w, H, t]), Oe(
-    ee,
+  }, [$, d, M, t, X]), Ye(
+    ne,
     () => ({
-      scrollTo: w,
-      getScrollPosition: () => b.current,
+      scrollTo: d,
+      getScrollPosition: () => S.current,
       getContentSize: () => e,
       getViewportSize: () => t
     }),
-    [w, e, t]
+    [d, e, t]
   );
-  const D = ot();
+  const Z = Tt();
   return se(() => {
-    const f = _.current;
-    if (!f)
+    const h = C.current;
+    if (!h)
       return;
     if (!a) {
-      H();
+      M();
       return;
     }
-    const F = 6;
-    let g = null, N = 0, L = 0, C = !1, M = !1, y = null, I = [];
-    const T = () => {
-      g = null, N = 0, L = 0, C = !1, I = [];
-    }, S = (c) => {
-      const J = performance.now();
-      I.push({ clientY: c, time: J }), I = I.filter((Q) => J - Q.time <= O.velocitySampleWindow);
-    }, E = (c) => c instanceof HTMLElement && c.closest("[data-scrollpane-ignore-drag='true']") !== null, q = (c) => {
-      M && (c.preventDefault(), c.stopPropagation(), M = !1);
-    }, oe = (c) => {
-      C || (C = !0, M = !0, f.hasPointerCapture(c.pointerId) || f.setPointerCapture(c.pointerId), S(c.clientY));
-    }, j = (c) => {
-      if (g !== c.pointerId || !C && (Math.abs(c.clientY - N) < F || (oe(c), !C)))
+    const _ = 6;
+    let g = null, P = 0, R = 0, k = !1, L = !1, v = null, w = [];
+    const b = () => {
+      g = null, P = 0, R = 0, k = !1, w = [];
+    }, T = (l) => {
+      const B = performance.now();
+      w.push({ clientY: l, time: B }), w = w.filter((U) => B - U.time <= I.velocitySampleWindow);
+    }, V = (l) => l instanceof HTMLElement && l.closest("[data-scrollpane-ignore-drag='true']") !== null, J = (l) => {
+      L && (l.preventDefault(), l.stopPropagation(), L = !1);
+    }, oe = (l) => {
+      k || (k = !0, L = !0, h.hasPointerCapture(l.pointerId) || h.setPointerCapture(l.pointerId), T(l.clientY));
+    }, q = (l) => {
+      if (g !== l.pointerId || !k && (Math.abs(l.clientY - P) < _ || (oe(l), !k)))
         return;
-      S(c.clientY);
-      const J = c.clientY - N, Q = L - J;
-      w(Q), c.cancelable && c.preventDefault();
-    }, W = (c) => {
-      if (g !== c.pointerId)
+      T(l.clientY);
+      const B = l.clientY - P, U = R - B;
+      d(U), l.cancelable && l.preventDefault();
+    }, Q = (l) => {
+      if (g !== l.pointerId)
         return;
-      C && M && c.cancelable && (c.preventDefault(), c.stopPropagation()), f.hasPointerCapture(c.pointerId) && f.releasePointerCapture(c.pointerId);
-      let J = 0;
-      if (C && I.length >= 2) {
-        const Q = I[I.length - 1], z = I.find((ie) => Q.time - ie.time <= O.velocitySampleWindow) ?? I[0];
-        if (Q && z && Q.time !== z.time) {
-          const ie = Q.clientY - z.clientY, ge = Q.time - z.time;
-          J = -(ie / ge);
+      k && L && l.cancelable && (l.preventDefault(), l.stopPropagation()), h.hasPointerCapture(l.pointerId) && h.releasePointerCapture(l.pointerId);
+      let B = 0;
+      if (k && w.length >= 2) {
+        const U = w[w.length - 1], N = w.find((ue) => U.time - ue.time <= I.velocitySampleWindow) ?? w[0];
+        if (U && N && U.time !== N.time) {
+          const ue = U.clientY - N.clientY, xe = U.time - N.time;
+          B = -(ue / xe);
         }
       }
-      T(), y !== null && window.clearTimeout(y), M && (y = window.setTimeout(() => {
-        M = !1, y = null;
-      }, 0)), Math.abs(J) >= O.startVelocityThreshold && m(J);
-    }, ne = (c) => {
-      P && (c.button !== 0 && c.pointerType === "mouse" || c.ctrlKey || c.metaKey || c.altKey || E(c.target) || (window.dispatchEvent(new CustomEvent(Ne, { detail: { paneId: D } })), H(), g = c.pointerId, N = c.clientY, L = b.current, C = !1, M = !1, I = []));
-    }, B = (c) => {
-      g === c.pointerId && (M = !1, f.hasPointerCapture(c.pointerId) && f.releasePointerCapture(c.pointerId), y !== null && (window.clearTimeout(y), y = null), T());
-    }, fe = [
-      ["click", q, !0],
-      ["pointerdown", ne, { passive: !1 }],
-      ["pointermove", j, { passive: !1 }],
-      ["pointerup", W, void 0],
-      ["pointercancel", B, void 0]
-    ], Y = [
-      ["pointermove", j, { passive: !1 }],
-      ["pointerup", W, void 0],
-      ["pointercancel", B, void 0]
+      b(), v !== null && window.clearTimeout(v), L && (v = window.setTimeout(() => {
+        L = !1, v = null;
+      }, 0)), Math.abs(B) >= I.startVelocityThreshold && z(B);
+    }, ie = (l) => {
+      $ && (l.button !== 0 && l.pointerType === "mouse" || l.ctrlKey || l.metaKey || l.altKey || V(l.target) || (window.dispatchEvent(new CustomEvent(ze, { detail: { paneId: Z } })), M(), g = l.pointerId, P = l.clientY, R = S.current, k = !1, L = !1, w = []));
+    }, j = (l) => {
+      g === l.pointerId && (L = !1, h.hasPointerCapture(l.pointerId) && h.releasePointerCapture(l.pointerId), v !== null && (window.clearTimeout(v), v = null), b());
+    }, ge = [
+      ["click", J, !0],
+      ["pointerdown", ie, { passive: !1 }],
+      ["pointermove", q, { passive: !1 }],
+      ["pointerup", Q, void 0],
+      ["pointercancel", j, void 0]
+    ], D = [
+      ["pointermove", q, { passive: !1 }],
+      ["pointerup", Q, void 0],
+      ["pointercancel", j, void 0]
     ];
-    return Me(f, fe, "add"), Me(window, Y, "add"), () => {
-      Me(f, fe, "remove"), Me(window, Y, "remove"), g !== null && f.hasPointerCapture(g) && f.releasePointerCapture(g), y !== null && window.clearTimeout(y), H();
+    return Ce(h, ge, "add"), Ce(window, D, "add"), () => {
+      Ce(h, ge, "remove"), Ce(window, D, "remove"), g !== null && h.hasPointerCapture(g) && h.releasePointerCapture(g), v !== null && window.clearTimeout(v), M();
     };
-  }, [a, D, P, O, w, m, H]), /* @__PURE__ */ Se("div", { ref: Z, className: we("flex", u), style: d, children: [
+  }, [a, Z, $, I, d, z, M]), /* @__PURE__ */ Se("div", { ref: G, className: Ie("flex", c), style: u, children: [
     /* @__PURE__ */ Se(
       "div",
       {
-        ref: _,
+        ref: C,
         className: "relative h-full flex-1 overflow-hidden",
         style: { height: t, ...a ? { touchAction: "none" } : {} },
-        id: D,
+        id: Z,
         children: [
           p,
-          o(b.current)
+          s(S.current)
         ]
       }
     ),
-    P && /* @__PURE__ */ $(
-      pt,
+    $ && /* @__PURE__ */ H(
+      Lt,
       {
         contentSize: e,
         viewportSize: t,
-        scrollPosition: b.current,
-        onScroll: w,
+        scrollPosition: S.current,
+        onScroll: d,
         enableThumbDrag: r,
-        enableTrackClick: i,
-        enableArrowButtons: l,
+        enableTrackClick: o,
+        enableArrowButtons: i,
         scrollBarWidth: n,
-        ariaControls: D,
-        tapScrollCircleOptions: R,
-        itemCount: X
+        ariaControls: Z,
+        tapScrollCircleOptions: E,
+        itemCount: O,
+        renderThumbOverlay: te
       }
     )
   ] });
-}), Ge = (o, e, t) => Math.min(Math.max(o, e), t), Mt = ({ dragState: o, normalizedDistance: e, sizeScale: t, size: n }) => {
-  const r = Math.max(n / 2, 1), i = 1 + e * 0.65, l = Math.max(0.65, 1 - e * 0.25), a = o.direction * e * 26 * t, h = 0.8 + e * 0.18, u = 3 * t, d = 6 * t, p = 22 * t, R = Math.abs(a) + d, V = a > 0 ? u : -Math.abs(a) - u, X = Math.max(2.5, 3 * t), ee = Ge(o.offsetX, -r, r), b = Ge(o.offsetY, -r, r), ae = r * 0.35, le = ee / r * ae, Z = b / r * ae, _ = le * 0.45, U = Z * 0.45, O = Math.max(p * 0.38, 6), x = 0.65 + e * 0.2, P = o.active;
-  return /* @__PURE__ */ Se(Je, { children: [
-    /* @__PURE__ */ $(
+}), tt = (s, e, t) => Math.min(Math.max(s, e), t), qt = ({ dragState: s, normalizedDistance: e, sizeScale: t, size: n }) => {
+  const r = Math.max(n / 2, 1), o = 1 + e * 0.65, i = Math.max(0.65, 1 - e * 0.25), a = s.direction * e * 26 * t, f = 0.8 + e * 0.18, c = 3 * t, u = 6 * t, p = 22 * t, E = Math.abs(a) + u, A = a > 0 ? c : -Math.abs(a) - c, O = Math.max(2.5, 3 * t), te = tt(s.offsetX, -r, r), X = tt(s.offsetY, -r, r), ne = r * 0.35, S = te / r * ne, ce = X / r * ne, le = S * 0.45, G = ce * 0.45, C = Math.max(p * 0.38, 6), K = 0.65 + e * 0.2, I = s.active;
+  return /* @__PURE__ */ Se(rt, { children: [
+    /* @__PURE__ */ H(
       "div",
       {
         className: "absolute inset-0 rounded-full border border-white/40 bg-linear-to-br from-[#1d4ed8]/60 via-[#60a5fa]/55 to-[#bfdbfe]/40 shadow-md",
         style: {
-          transform: `scale(${l}, ${i})`,
-          transition: P ? "40ms transform ease-out" : "200ms ease transform"
+          transform: `scale(${i}, ${o})`,
+          transition: I ? "40ms transform ease-out" : "200ms ease transform"
         }
       }
     ),
-    /* @__PURE__ */ $(
+    /* @__PURE__ */ H(
       "div",
       {
         className: "absolute top-1/2 left-1/2 rounded-full border border-white/50 bg-white/85",
         style: {
           width: p,
           height: p,
-          transform: `translate(calc(-50% + ${le}px), calc(-50% + ${Z}px)) scale(${l}, ${h * i})`,
-          transition: P ? "70ms transform ease-out" : "200ms ease transform"
+          transform: `translate(calc(-50% + ${S}px), calc(-50% + ${ce}px)) scale(${i}, ${f * o})`,
+          transition: I ? "70ms transform ease-out" : "200ms ease transform"
         }
       }
     ),
-    /* @__PURE__ */ $(
+    /* @__PURE__ */ H(
       "div",
       {
         className: "absolute top-1/2 left-1/2 rounded-full bg-white/80",
         style: {
-          width: O,
-          height: O,
-          transform: `translate(calc(-50% + ${_}px), calc(-50% + ${U}px)) scale(${l}, ${i})`,
-          opacity: x,
+          width: C,
+          height: C,
+          transform: `translate(calc(-50% + ${le}px), calc(-50% + ${G}px)) scale(${i}, ${o})`,
+          opacity: K,
           boxShadow: "0 0 8px rgba(255,255,255,0.45)",
-          transition: P ? "120ms opacity 150ms, 120ms transform ease-out ease-out" : "220ms ease transform, 240ms opacity ease"
+          transition: I ? "120ms opacity 150ms, 120ms transform ease-out ease-out" : "220ms ease transform, 240ms opacity ease"
         }
       }
     ),
-    /* @__PURE__ */ $(
+    /* @__PURE__ */ H(
       "div",
       {
         className: "absolute top-1/2 left-1/2 rounded-full bg-white/50",
         style: {
-          width: X,
-          height: R,
-          transform: `translate(-50%, ${V}px)`,
+          width: O,
+          height: E,
+          transform: `translate(-50%, ${A}px)`,
           opacity: e,
-          transition: P ? "40ms height, 60ms opacity ease-out ease-out" : "200ms ease height, 120ms ease opacity"
+          transition: I ? "40ms height, 60ms opacity ease-out ease-out" : "200ms ease height, 120ms ease opacity"
         }
       }
     )
   ] });
 };
-class xt {
+class Nt {
   /**
    * @private
    * @property {Map<number, number>} tree - The Map storing the Fenwick tree structure, specifically the sums of deltas. It is 1-indexed.
@@ -770,17 +844,17 @@ class xt {
   reset(e, t, n) {
     if (this.size = e, this.tree = /* @__PURE__ */ new Map(), this.deltas = /* @__PURE__ */ new Map(), this.total = void 0, typeof t == "function") {
       if (this.valueFn = t, this.size > 0) {
-        const i = n?.sampleRange ?? {
+        const o = n?.sampleRange ?? {
           from: 0,
           to: Math.min(99, this.size - 1)
-        }, { mode: l, materializedValues: a } = this._calculateMode(i.from, i.to);
-        if (this.baseValue = l, n?.materialize)
-          for (let h = 0; h < a.length; h++) {
-            const u = a[h], d = i.from + h;
-            if (d >= this.size)
+        }, { mode: i, materializedValues: a } = this._calculateMode(o.from, o.to);
+        if (this.baseValue = i, n?.materialize)
+          for (let f = 0; f < a.length; f++) {
+            const c = a[f], u = o.from + f;
+            if (u >= this.size)
               break;
-            const p = u - this.baseValue;
-            this.deltas.set(d, p), this._updateTree(d, p);
+            const p = c - this.baseValue;
+            this.deltas.set(u, p), this._updateTree(u, p);
           }
       } else
         this.baseValue = 0;
@@ -810,29 +884,29 @@ class xt {
     if (!this.valueFn)
       return { mode: 0, materializedValues: [] };
     const n = [];
-    for (let u = e; u <= t && !(u >= this.size); u++)
-      n.push(this.valueFn(u));
+    for (let c = e; c <= t && !(c >= this.size); c++)
+      n.push(this.valueFn(c));
     const r = [...n];
     if (n.length === 0)
       return { mode: 0, materializedValues: [] };
-    n.sort((u, d) => u - d);
-    const i = Math.floor(n.length / 2);
-    let l;
-    n.length % 2 === 0 ? l = Math.floor((n[i - 1] + n[i]) / 2) : l = n[i];
+    n.sort((c, u) => c - u);
+    const o = Math.floor(n.length / 2);
+    let i;
+    n.length % 2 === 0 ? i = Math.floor((n[o - 1] + n[o]) / 2) : i = n[o];
     const a = /* @__PURE__ */ new Map();
-    let h = 0;
-    for (const u of n) {
-      const d = (a.get(u) ?? 0) + 1;
-      a.set(u, d), d > h && (h = d);
+    let f = 0;
+    for (const c of n) {
+      const u = (a.get(c) ?? 0) + 1;
+      a.set(c, u), u > f && (f = u);
     }
-    if (h > 1) {
-      const u = [];
-      for (const [p, R] of a.entries())
-        R === h && u.push(p);
-      const d = u.reduce((p, R) => p + R, 0);
-      l = Math.floor(d / u.length);
+    if (f > 1) {
+      const c = [];
+      for (const [p, E] of a.entries())
+        E === f && c.push(p);
+      const u = c.reduce((p, E) => p + E, 0);
+      i = Math.floor(u / c.length);
     }
-    return { mode: l, materializedValues: r };
+    return { mode: i, materializedValues: r };
   }
   /**
    * @method update
@@ -910,8 +984,8 @@ class xt {
         throw new Error(`Index ${n} out of bounds`);
       if (r < 0)
         throw new Error("Value cannot be negative.");
-      const i = this.deltas.has(n) ? (this.deltas.get(n) ?? 0) + this.baseValue : this.baseValue, l = r - i;
-      l !== 0 && t.push({ index: n, change: l });
+      const o = this.deltas.has(n) ? (this.deltas.get(n) ?? 0) + this.baseValue : this.baseValue, i = r - o;
+      i !== 0 && t.push({ index: n, change: i });
     }
     return t;
   }
@@ -925,10 +999,10 @@ class xt {
    */
   _materialize(e, t = !0) {
     if (this.valueFn) {
-      const n = this.deltas.get(e) ?? 0, i = this.valueFn(e) - this.baseValue;
-      if (i !== n && (this.deltas.set(e, i), t)) {
-        const l = i - n;
-        this._updateTree(e, l);
+      const n = this.deltas.get(e) ?? 0, o = this.valueFn(e) - this.baseValue;
+      if (o !== n && (this.deltas.set(e, o), t)) {
+        const i = o - n;
+        this._updateTree(e, i);
       }
     }
   }
@@ -947,9 +1021,9 @@ class xt {
     const r = e.ranges;
     if (r && r.length > 0) {
       for (const a of r) {
-        const h = a.from, u = Math.min(a.to, this.size - 1);
-        for (let d = h; d <= u; d++)
-          this._materialize(d);
+        const f = a.from, c = Math.min(a.to, this.size - 1);
+        for (let u = f; u <= c; u++)
+          this._materialize(u);
       }
       if (t === void 0)
         return;
@@ -957,8 +1031,8 @@ class xt {
         this._materialize(t);
         return;
       }
-      const i = r[0].from, l = r[r.length - 1].to;
-      t >= i && t <= l && this._materialize(t);
+      const o = r[0].from, i = r[r.length - 1].to;
+      t >= o && t <= i && this._materialize(t);
       return;
     }
     t !== void 0 && this._materialize(t);
@@ -976,12 +1050,12 @@ class xt {
   _findIndex(e, t = {}, n) {
     if (this.size === 0)
       return { index: -1, total: this.total ?? 0, cumulative: void 0, currentValue: void 0, safeIndex: void 0 };
-    let r = 0, i = this.size - 1, l = -1, a, h = this.total;
-    for (; r <= i; ) {
-      const u = Math.floor((r + i) / 2);
-      a = this.prefixSum(u, t), h = a.total, (n ? a.cumulative >= e : a.cumulative <= e) ? (l = u, n ? i = u - 1 : r = u + 1) : n ? r = u + 1 : i = u - 1;
+    let r = 0, o = this.size - 1, i = -1, a, f = this.total;
+    for (; r <= o; ) {
+      const c = Math.floor((r + o) / 2);
+      a = this.prefixSum(c, t), f = a.total, (n ? a.cumulative >= e : a.cumulative <= e) ? (i = c, n ? o = c - 1 : r = c + 1) : n ? r = c + 1 : o = c - 1;
     }
-    return { index: l, total: h, cumulative: a?.cumulative, currentValue: a?.currentValue, safeIndex: a?.safeIndex };
+    return { index: i, total: f, cumulative: a?.cumulative, currentValue: a?.currentValue, safeIndex: a?.safeIndex };
   }
   /**
    * @method prefixSum
@@ -994,15 +1068,15 @@ class xt {
   prefixSum(e, t) {
     if (e < 0)
       return { cumulative: 0, total: this.total, currentValue: 0, safeIndex: 0 };
-    const n = G(e, 0, this.size - 1), r = t?.materializeOption;
+    const n = W(e, 0, this.size - 1), r = t?.materializeOption;
     this._materializeRanges(r, n, !0);
-    let i = 0, l = n + 1;
-    for (; l > 0; ) {
-      const h = this.tree.get(l) ?? 0;
-      i += h, l -= l & -l;
+    let o = 0, i = n + 1;
+    for (; i > 0; ) {
+      const f = this.tree.get(i) ?? 0;
+      o += f, i -= i & -i;
     }
     const a = r?.materialize ? this.get(n) : (this.deltas.get(n) || 0) + this.baseValue;
-    return { cumulative: i + this.baseValue * (n + 1), total: this.total, currentValue: a, safeIndex: n };
+    return { cumulative: o + this.baseValue * (n + 1), total: this.total, currentValue: a, safeIndex: n };
   }
   /**
    * @method get
@@ -1032,8 +1106,8 @@ class xt {
         this.total = 0;
       else {
         let n = this.baseValue * this.size;
-        for (const i of this.deltas.values())
-          n += i;
+        for (const o of this.deltas.values())
+          n += o;
         this.total = n;
         const r = this.prefixSum(this.getSize() - 1);
         console.assert(r.cumulative === r.total, "Inconsistent Fenwick Tree state");
@@ -1050,17 +1124,17 @@ class xt {
   rebuildTree(e) {
     if (e?.materialize && this.valueFn) {
       const r = this.valueFn;
-      this.reset(this.size, (i) => r(i), { materialize: !0 });
+      this.reset(this.size, (o) => r(o), { materialize: !0 });
       return;
     }
     const t = /* @__PURE__ */ new Map();
     let n = this.baseValue * this.size;
-    for (const [r, i] of this.deltas.entries()) {
-      if (n += i, i === 0)
+    for (const [r, o] of this.deltas.entries()) {
+      if (n += o, o === 0)
         continue;
-      let l = r + 1;
-      for (; l <= this.size; )
-        t.set(l, (t.get(l) ?? 0) + i), l += l & -l;
+      let i = r + 1;
+      for (; i <= this.size; )
+        t.set(i, (t.get(i) ?? 0) + o), i += i & -i;
     }
     this.tree = t, this.total = n;
   }
@@ -1133,11 +1207,11 @@ class xt {
     return this._findIndex(e, t ?? {}, !1);
   }
 }
-const vt = (o, e, t) => {
-  const n = Math.max(0, o), r = k(null), i = xe(() => new xt(n, e, t), [n, e, t]);
-  return Object.is(r.current, i) || console.warn("[useFenwickMapTree] instance changed"), r.current = i, i;
+const Ot = (s, e, t) => {
+  const n = Math.max(0, s), r = F(null), o = Te(() => new Nt(n, e, t), [n, e, t]);
+  return Object.is(r.current, o) || console.warn("[useFenwickMapTree] instance changed"), r.current = o, o;
 };
-class bt {
+class zt {
   key;
   value;
   prev = null;
@@ -1146,7 +1220,7 @@ class bt {
     this.key = e, this.value = t;
   }
 }
-class Ze {
+class nt {
   head = null;
   tail = null;
   /**
@@ -1187,193 +1261,195 @@ class Ze {
     this.remove(e), this.addToTail(e);
   }
 }
-function Tt(o) {
-  const e = k(/* @__PURE__ */ new Map()), t = k(new Ze());
+function kt(s) {
+  const e = F(/* @__PURE__ */ new Map()), t = F(new nt());
   se(() => {
-    for (; e.current.size > o; ) {
-      const u = t.current.removeHead();
-      if (u)
-        e.current.delete(u.key);
+    for (; e.current.size > s; ) {
+      const c = t.current.removeHead();
+      if (c)
+        e.current.delete(c.key);
       else
         break;
     }
-  }, [o]);
-  const n = A((u) => {
-    const d = e.current.get(u);
-    if (d)
-      return t.current.moveToTail(d), d.value;
-  }, []), r = A(
-    (u, d) => {
-      if (o <= 0)
+  }, [s]);
+  const n = y((c) => {
+    const u = e.current.get(c);
+    if (u)
+      return t.current.moveToTail(u), u.value;
+  }, []), r = y(
+    (c, u) => {
+      if (s <= 0)
         return;
-      let p = e.current.get(u);
+      let p = e.current.get(c);
       if (p)
-        p.value = d, t.current.moveToTail(p);
+        p.value = u, t.current.moveToTail(p);
       else {
-        if (e.current.size >= o) {
-          const R = t.current.removeHead();
-          R && e.current.delete(R.key);
+        if (e.current.size >= s) {
+          const E = t.current.removeHead();
+          E && e.current.delete(E.key);
         }
-        p = new bt(u, d), e.current.set(u, p), t.current.addToTail(p);
+        p = new zt(c, u), e.current.set(c, p), t.current.addToTail(p);
       }
     },
-    [o]
-  ), i = A((u) => e.current.has(u), []), l = A(() => {
-    e.current.clear(), t.current = new Ze();
-  }, []), [a, h] = de(() => ({ get: n, set: r, has: i, clear: l }));
-  return se(() => h({ get: n, set: r, has: i, clear: l }), [n, r, i, l]), a;
+    [s]
+  ), o = y((c) => e.current.has(c), []), i = y(() => {
+    e.current.clear(), t.current = new nt();
+  }, []), [a, f] = pe(() => ({ get: n, set: r, has: o, clear: i }));
+  return se(() => f({ get: n, set: r, has: o, clear: i }), [n, r, o, i]), a;
 }
-const yt = 1e4, Et = () => {
-  const { get: o, set: e, has: t, clear: n } = Tt(yt);
-  return { get: o, set: e, has: t, clear: n };
-}, me = (o, e) => e <= 0 ? 0 : G(o, 0, e - 1), wt = (o, e, t, n, r, i) => {
+const Yt = 1e4, jt = () => {
+  const { get: s, set: e, has: t, clear: n } = kt(Yt);
+  return { get: s, set: e, has: t, clear: n };
+}, be = (s, e) => e <= 0 ? 0 : W(s, 0, e - 1), Ht = (s, e, t, n, r, o) => {
   if (n === 0)
     return { renderingStartIndex: 0, renderingEndIndex: 0, visibleStartIndex: 0, visibleEndIndex: 0 };
-  const { index: l, cumulative: a, currentValue: h } = i.findIndexAtOrAfter(o, { materializeOption: { materialize: !1 } }), u = l === -1 ? 0 : l, d = l !== -1 && (a ?? 0) < o + (h ?? 0) ? u + 1 : u, p = me(d, n), R = me(p - t, n);
-  let V = 0, X = p;
-  for (; X < n && V < e; )
-    V += r(X), X++;
-  const ee = me(X - 1, n), b = me(ee + t, n);
-  return { renderingStartIndex: R, renderingEndIndex: b, visibleStartIndex: p, visibleEndIndex: ee };
+  const { index: i, cumulative: a, currentValue: f } = o.findIndexAtOrAfter(s, { materializeOption: { materialize: !1 } }), c = i === -1 ? 0 : i, u = i !== -1 && (a ?? 0) < s + (f ?? 0) ? c + 1 : c, p = be(u, n), E = be(p - t, n);
+  let A = 0, O = p;
+  for (; O < n && A < e; )
+    A += r(O), O++;
+  const te = be(O - 1, n), X = be(te + t, n);
+  return { renderingStartIndex: E, renderingEndIndex: X, visibleStartIndex: p, visibleEndIndex: te };
 };
-function St({ itemCount: o, getItem: e, getItemHeight: t, viewportSize: n, overscanCount: r = 5, className: i, onScroll: l, onRangeChange: a, children: h, background: u, initialScrollIndex: d, initialScrollOffset: p, tapScrollCircleOptions: R, scrollBarWidth: V, enableThumbDrag: X, enableTrackClick: ee, enableArrowButtons: b, enablePointerDrag: ae, inertiaOptions: le }, Z) {
-  const _ = k(null), U = k(!1);
-  se(() => (U.current = !0, () => {
-    U.current = !1;
+function $t({ itemCount: s, getItem: e, getItemHeight: t, viewportSize: n, overscanCount: r = 5, className: o, onScroll: i, onRangeChange: a, children: f, background: c, initialScrollIndex: u, initialScrollOffset: p, tapScrollCircleOptions: E, scrollBarWidth: A, enableThumbDrag: O, enableTrackClick: te, enableArrowButtons: X, enablePointerDrag: ne, inertiaOptions: S, renderThumbOverlay: ce, wheelSpeedMultiplier: le }, G) {
+  const C = F(null), K = F(!1);
+  se(() => (K.current = !0, () => {
+    K.current = !1;
   }), []);
-  const O = k({ size: o, valueOrFn: t, options: { sampleRange: { from: 0, to: 100 } } }), x = vt(O.current.size, O.current.valueOrFn, O.current.options), [P] = de(() => {
-    let T = 0, S = 0;
-    if (typeof d == "number") {
-      const E = G(d, 0, o - 1), q = G(E - r * 2, 0, o - 1), oe = G(E + r * 2, 0, o - 1), j = d > 0 ? { materializeOption: { materialize: !0, ranges: [{ from: q, to: oe }] } } : void 0, { cumulative: W, total: ne, currentValue: B } = x.prefixSum(d, j);
-      T = W - B, S = ne ?? x.getTotal();
-    } else typeof p == "number" && (T = p), S = x.getTotal();
-    return { position: T, total: S };
-  }), [w, H] = de(P.position), [m, D] = de(P.total), [f, F] = de(P.position), [g, N] = de(o);
-  Ee(() => {
-    x.setValueFn(t), g !== o && (x.changeSize(o), N(o));
-    const T = x.getTotal();
-    m !== T && D(T);
-  }, [x, g, o, m, t]), Ee(() => {
-    f !== null && _.current && (re.debug("[VirtualScroll] Scrolling to position:", f), _.current.scrollTo(f), F(null));
-  }, [f]);
-  const L = A(
-    (T) => {
-      if (!_.current)
+  const I = F({ size: s, valueOrFn: t, options: { sampleRange: { from: 0, to: 100 } } }), x = Ot(I.current.size, I.current.valueOrFn, I.current.options), [$] = pe(() => {
+    let b = 0, T = 0;
+    if (typeof u == "number") {
+      const V = W(u, 0, s - 1), J = W(V - r * 2, 0, s - 1), oe = W(V + r * 2, 0, s - 1), q = u > 0 ? { materializeOption: { materialize: !0, ranges: [{ from: J, to: oe }] } } : void 0, { cumulative: Q, total: ie, currentValue: j } = x.prefixSum(u, q);
+      b = Q - j, T = ie ?? x.getTotal();
+    } else typeof p == "number" && (b = p), T = x.getTotal();
+    return { position: b, total: T };
+  }), [d, M] = pe($.position), [z, Z] = pe($.total), [h, _] = pe($.position), [g, P] = pe(s);
+  Ae(() => {
+    x.setValueFn(t), g !== s && (x.changeSize(s), P(s));
+    const b = x.getTotal();
+    z !== b && Z(b);
+  }, [x, g, s, z, t]), Ae(() => {
+    h !== null && C.current && (ae.debug("[VirtualScroll] Scrolling to position:", h), C.current.scrollTo(h), _(null));
+  }, [h]);
+  const R = y(
+    (b) => {
+      if (!C.current)
         return;
-      const S = me(T, g), E = me(S - r * 2, g), q = me(S + r * 2, g), { cumulative: oe, total: j, currentValue: W } = x.prefixSum(S, { materializeOption: { materialize: !0, ranges: [{ from: E, to: q }] } });
-      re.debug("[VirtualScroll] Scrolling to index:", S, "Offset:", oe, "Total height:", j, "Current value:", W, "safeIndexFrom:", E, "safeIndexTo:", q), j && (D(j), F(oe - W), re.debug("[VirtualScroll] Setting scroll position to:", oe - W));
+      const T = be(b, g), V = be(T - r * 2, g), J = be(T + r * 2, g), { cumulative: oe, total: q, currentValue: Q } = x.prefixSum(T, { materializeOption: { materialize: !0, ranges: [{ from: V, to: J }] } });
+      ae.debug("[VirtualScroll] Scrolling to index:", T, "Offset:", oe, "Total height:", q, "Current value:", Q, "safeIndexFrom:", V, "safeIndexTo:", J), q && (Z(q), _(oe - Q), ae.debug("[VirtualScroll] Setting scroll position to:", oe - Q));
     },
     [x, r, g]
-  ), C = A(
-    (T) => {
-      if (!_.current)
+  ), k = y(
+    (b) => {
+      if (!C.current)
         return;
-      const S = x.getTotal(), E = G(Math.floor(T), 0, S), q = x.findIndexAtOrAfter(E, { materializeOption: { materialize: !1 } }).index;
-      L(q);
+      const T = x.getTotal(), V = W(Math.floor(b), 0, T), J = x.findIndexAtOrAfter(V, { materializeOption: { materialize: !1 } }).index;
+      R(J);
     },
-    [x, L]
-  ), M = A(
-    (T, S) => {
-      re.debug("[VirtualScroll] Scroll position changed:", T), H(T);
-      const E = x.getTotal();
-      l?.(T, E);
+    [x, R]
+  ), L = y(
+    (b, T) => {
+      ae.debug("[VirtualScroll] Scroll position changed:", b), M(b);
+      const V = x.getTotal();
+      i?.(b, V);
     },
-    [x, l]
-  ), y = xe(() => {
-    const T = wt(w, n, r, g, t, x);
-    return re.debug("[VirtualScroll] Calculated rendering range:", {
-      ...T,
-      scrollPosition: w,
+    [x, i]
+  ), v = Te(() => {
+    const b = Ht(d, n, r, g, t, x);
+    return ae.debug("[VirtualScroll] Calculated rendering range:", {
+      ...b,
+      scrollPosition: d,
       renderingContentSize: x.getTotal(),
       overscanCount: r,
       viewportSize: n
-    }), T;
-  }, [w, n, r, g, t, x]);
+    }), b;
+  }, [d, n, r, g, t, x]);
   se(() => {
-    const T = _.current?.getScrollPosition() ?? 0;
-    re.debug("[VirtualScroll] Range change effect triggered", {
-      renderingStartIndex: y.renderingStartIndex,
-      renderingEndIndex: y.renderingEndIndex,
-      visibleStartIndex: y.visibleStartIndex,
-      visibleEndIndex: y.visibleEndIndex,
-      scrollPosition: w,
-      contentSize: m,
-      scrollPaneScrollPosition: T
-    }), a?.(y.renderingStartIndex, y.renderingEndIndex, y.visibleStartIndex, y.visibleEndIndex, w, m);
-  }, [y.renderingStartIndex, y.renderingEndIndex, y.visibleStartIndex, y.visibleEndIndex, a, w, m]);
-  const I = A(
-    (T) => {
-      const { renderingStartIndex: S, renderingEndIndex: E } = y;
-      if (re.debug("[VirtualScroll] Rendering visible items", { currentScrollPosition: T, renderingStartIndex: S, renderingEndIndex: E, fenwickSize: g, viewportSize: n }), g === 0)
-        return /* @__PURE__ */ $("div", { className: "absolute w-full", style: { top: 0 }, children: /* @__PURE__ */ $("div", { className: "text-center text-gray-500", children: "No items" }) });
-      const q = me(S, g), { cumulative: oe, currentValue: j } = x.prefixSum(q, { materializeOption: { materialize: !1 } }), W = oe - j, ne = [], B = [];
-      for (let Y = S; Y <= E; Y++) {
-        const c = t(Y);
-        ne.push({ item: e(Y), height: c, index: Y }), x.get(Y) !== c && B.push({ index: Y, value: c });
+    const b = C.current?.getScrollPosition() ?? 0;
+    ae.debug("[VirtualScroll] Range change effect triggered", {
+      renderingStartIndex: v.renderingStartIndex,
+      renderingEndIndex: v.renderingEndIndex,
+      visibleStartIndex: v.visibleStartIndex,
+      visibleEndIndex: v.visibleEndIndex,
+      scrollPosition: d,
+      contentSize: z,
+      scrollPaneScrollPosition: b
+    }), a?.(v.renderingStartIndex, v.renderingEndIndex, v.visibleStartIndex, v.visibleEndIndex, d, z);
+  }, [v.renderingStartIndex, v.renderingEndIndex, v.visibleStartIndex, v.visibleEndIndex, a, d, z]);
+  const w = y(
+    (b) => {
+      const { renderingStartIndex: T, renderingEndIndex: V } = v;
+      if (ae.debug("[VirtualScroll] Rendering visible items", { currentScrollPosition: b, renderingStartIndex: T, renderingEndIndex: V, fenwickSize: g, viewportSize: n }), g === 0)
+        return /* @__PURE__ */ H("div", { className: "absolute w-full", style: { top: 0 }, children: /* @__PURE__ */ H("div", { className: "text-center text-gray-500", children: "No items" }) });
+      const J = be(T, g), { cumulative: oe, currentValue: q } = x.prefixSum(J, { materializeOption: { materialize: !1 } }), Q = oe - q, ie = [], j = [];
+      for (let D = T; D <= V; D++) {
+        const l = t(D);
+        ie.push({ item: e(D), height: l, index: D }), x.get(D) !== l && j.push({ index: D, value: l });
       }
-      B.length > 0 && Promise.resolve().then(() => {
-        const Y = x.updates(B);
-        Y && (D(Y), re.debug("[VirtualScroll] Updated heights for items", B, "New total height:", Y));
+      j.length > 0 && Promise.resolve().then(() => {
+        const D = x.updates(j);
+        D && (Z(D), ae.debug("[VirtualScroll] Updated heights for items", j, "New total height:", D));
       });
-      const fe = m < n ? 0 : W - T;
-      return re.debug("[VirtualScroll] Rendering items", { visibleItems: ne, containerTop: fe }), /* @__PURE__ */ $("div", { className: "absolute w-full", style: { top: fe }, children: ne.map(({ item: Y, index: c }) => {
-        const J = me(c, g), { cumulative: Q, currentValue: z } = x.prefixSum(J, { materializeOption: { materialize: !1 } }), ie = Q - z;
-        return /* @__PURE__ */ $(
+      const ge = z < n ? 0 : Q - b;
+      return ae.debug("[VirtualScroll] Rendering items", { visibleItems: ie, containerTop: ge }), /* @__PURE__ */ H("div", { className: "absolute w-full", style: { top: ge }, children: ie.map(({ item: D, index: l }) => {
+        const B = be(l, g), { cumulative: U, currentValue: N } = x.prefixSum(B, { materializeOption: { materialize: !1 } }), ue = U - N;
+        return /* @__PURE__ */ H(
           "div",
           {
-            "data-index": c,
+            "data-index": l,
             style: {
               position: "absolute",
-              top: ie - W,
+              top: ue - Q,
               width: "100%"
             },
-            children: h(Y, c)
+            children: f(D, l)
           },
-          c
+          l
         );
       }) });
     },
-    [e, h, m, n, y, x, g, t]
+    [e, f, z, n, v, x, g, t]
   );
-  return Oe(Z, () => ({
-    getScrollPosition: () => _.current?.getScrollPosition() ?? -1,
-    getContentSize: () => _.current?.getContentSize() ?? -1,
-    getViewportSize: () => _.current?.getViewportSize() ?? -1,
-    scrollTo: C,
-    scrollToIndex: L,
+  return Ye(G, () => ({
+    getScrollPosition: () => C.current?.getScrollPosition() ?? -1,
+    getContentSize: () => C.current?.getContentSize() ?? -1,
+    getViewportSize: () => C.current?.getViewportSize() ?? -1,
+    scrollTo: k,
+    scrollToIndex: R,
     getFenwickTreeTotalHeight: () => x.getTotal(),
     getFenwickSize: () => x.getSize()
-  }), [C, L, x]), /* @__PURE__ */ $(
-    gt,
+  }), [k, R, x]), /* @__PURE__ */ H(
+    Dt,
     {
-      ref: _,
-      contentSize: m,
+      ref: C,
+      contentSize: z,
       viewportSize: n,
-      className: i,
-      onScroll: M,
-      background: u,
-      tapScrollCircleOptions: R,
-      inertiaOptions: le,
-      itemCount: o,
-      scrollBarWidth: V,
-      enableThumbDrag: X,
-      enableTrackClick: ee,
-      enableArrowButtons: b,
-      enablePointerDrag: ae,
-      children: I
+      className: o,
+      onScroll: L,
+      background: c,
+      tapScrollCircleOptions: E,
+      inertiaOptions: S,
+      itemCount: s,
+      scrollBarWidth: A,
+      enableThumbDrag: O,
+      enableTrackClick: te,
+      enableArrowButtons: X,
+      enablePointerDrag: ne,
+      renderThumbOverlay: ce,
+      wheelSpeedMultiplier: le,
+      children: w
     }
   );
 }
-const At = ke(St);
+const Wt = ke($t);
 export {
-  xt as FenwickMapTree,
-  pt as ScrollBar,
-  gt as ScrollPane,
-  At as VirtualScroll,
-  G as minmax,
-  Mt as tapScrollCircleSampleVisual,
-  vt as useFenwickMapTree,
-  Et as useHeightCache,
-  Tt as useLruCache
+  Nt as FenwickMapTree,
+  Lt as ScrollBar,
+  Dt as ScrollPane,
+  Wt as VirtualScroll,
+  W as minmax,
+  qt as tapScrollCircleSampleVisual,
+  Ot as useFenwickMapTree,
+  jt as useHeightCache,
+  kt as useLruCache
 };
 //# sourceMappingURL=index.js.map