@aiquants/virtualscroll 0.5.0 → 1.0.0

package/dist/index.js

@@ -1,426 +1,449 @@
-import { jsxs as xe, jsx as j } from "react/jsx-runtime";
-import { forwardRef as Ve, useState as le, useRef as N, useCallback as z, useImperativeHandle as Me, useMemo as O, useEffect as re, useReducer as ze, useLayoutEffect as ve, useId as ke } from "react";
-import { twMerge as he } from "tailwind-merge";
-const J = {
-  debug(c, ...e) {
-    typeof window < "u" && window.localStorage?.getItem("debug") === "true" && console.debug(`[VirtualScroll] ${c}`, ...e);
-  },
-  warn(c, ...e) {
-    console.warn(`[VirtualScroll] ${c}`, ...e);
-  },
-  error(c, ...e) {
-    console.error(`[VirtualScroll] ${c}`, ...e);
-  }
-}, C = (c, e, n) => Math.min(n, Math.max(e, c)), ye = {
+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 = {
   active: !1,
+  offsetX: 0,
   offsetY: 0,
   distance: 0,
   direction: 0
-}, Le = 6, Re = Ve(({ onDragChange: c, className: e, maxVisualDistance: n = 160, size: t = 64, style: r, opacity: o = 1 }, s) => {
-  const [m, d] = le(ye), f = N(null), g = N({ x: 0, y: 0 }), y = N(null), w = z(
-    (x, T = !1) => {
-      const { y: M } = g.current, h = x - M, p = Math.abs(h), I = p < Le ? 0 : h < 0 ? -1 : 1, v = {
-        active: T || p >= Le,
-        offsetY: h,
-        distance: p,
-        direction: I
-      };
-      d(v), c(v);
-    },
-    [c]
-  ), ie = z(
-    (x = !1) => {
-      if (x && f.current !== null) {
-        const T = y.current;
-        T?.hasPointerCapture(f.current) && T.releasePointerCapture(f.current);
+}, 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__ */ $(
+      "div",
+      {
+        className: "absolute inset-0 rounded-full",
+        style: {
+          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`
+        }
+      }
+    ),
+    /* @__PURE__ */ $(
+      "div",
+      {
+        className: "absolute inset-[18%] rounded-full",
+        style: {
+          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"
+        }
       }
-      f.current = null, d(ye), c(ye);
+    )
+  ] });
+}, 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
+      });
     },
-    [c]
-  ), ae = z(
-    (x) => {
-      x.preventDefault(), x.stopPropagation();
-      const T = y.current ?? x.currentTarget, M = T.getBoundingClientRect();
-      g.current = {
-        x: M.left + M.width / 2,
-        y: M.top + M.height / 2
-      }, f.current = x.pointerId, T.setPointerCapture(x.pointerId), w(x.clientY, !0);
+    [V]
+  ), ee = A((m) => {
+    if (m === 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);
+    },
+    [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);
     },
-    [w]
-  ), Y = z(
-    (x) => {
-      f.current === x.pointerId && (x.preventDefault(), w(x.clientY));
+    [X]
+  ), le = A(
+    (m) => {
+      d.current === m.pointerId && (m.preventDefault(), X(m.clientX, m.clientY));
     },
-    [w]
-  ), Q = z(
-    (x) => {
-      f.current === x.pointerId && (x.preventDefault(), x.stopPropagation(), ie(!0));
+    [X]
+  ), Z = A(
+    (m) => {
+      d.current === m.pointerId && (m.preventDefault(), m.stopPropagation(), b(!0));
     },
-    [ie]
+    [b]
   );
-  Me(
-    s,
+  Oe(
+    a,
     () => ({
       reset: () => {
-        ie(!0);
+        b(!0);
       },
-      getElement: () => y.current
+      getElement: () => R.current
     }),
-    [ie]
+    [b]
   );
-  const D = O(() => Math.min(m.distance, n) / n, [m.distance, n]), u = O(() => t / 64, [t]), ee = O(() => 1 + D * 0.4, [D]), E = O(() => m.direction * D * 10 * u, [m.direction, D, u]), P = O(() => m.direction * D * 26 * u, [m.direction, D, u]), F = O(() => 22 * u, [u]), W = O(() => Math.max(2.5, 3 * u), [u]), q = O(() => 6 * u, [u]), se = O(() => 3 * u, [u]), i = O(() => Math.min(Math.max(o, 0), 1), [o]), $ = O(() => {
-    const x = {
-      ...r,
-      width: t,
-      height: t,
-      transform: `translateY(${E}px)`
-    };
-    return x.opacity = i, x;
-  }, [i, E, t, r]), k = O(() => Math.abs(P) + q, [q, P]), A = O(() => P > 0 ? se : -Math.abs(P) - se, [se, P]);
-  return /* @__PURE__ */ xe(
+  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,
+    size: n,
+    opacity: _
+  }, H = {
+    ...r,
+    width: n,
+    height: n,
+    transform: `translateY(${x}px)`
+  };
+  return H.opacity = _, /* @__PURE__ */ $(
     "div",
     {
-      ref: y,
-      className: he(
-        "relative flex items-center justify-center touch-none select-none",
+      ref: R,
+      className: we(
+        "relative flex touch-none select-none items-center justify-center",
         "transition-transform duration-100 ease-out",
         e
       ),
-      style: $,
+      style: H,
       onPointerDown: ae,
-      onPointerMove: Y,
-      onPointerUp: Q,
-      onPointerCancel: Q,
+      onPointerMove: le,
+      onPointerUp: Z,
+      onPointerCancel: Z,
       role: "presentation",
-      children: [
-        /* @__PURE__ */ j(
-          "div",
-          {
-            className: "absolute inset-0 rounded-full border border-white/40 bg-gradient-to-br from-[#1d4ed8]/60 via-[#60a5fa]/55 to-[#bfdbfe]/40 shadow-md",
-            style: {
-              transform: `scaleY(${ee})`,
-              transition: m.active ? "transform 40ms ease-out" : "transform 200ms ease"
-            }
-          }
-        ),
-        /* @__PURE__ */ j(
-          "div",
-          {
-            className: "absolute left-1/2 top-1/2 h-6 w-6 -translate-x-1/2 -translate-y-1/2 rounded-full border border-white/50 bg-white/85",
-            style: {
-              width: F,
-              height: F,
-              transform: `translate(-50%, calc(-50% + ${P * 0.3}px)) scale(${1 + D * 0.2})`,
-              transition: m.active ? "transform 40ms ease-out" : "transform 200ms ease"
-            }
-          }
-        ),
-        /* @__PURE__ */ j(
-          "div",
-          {
-            className: "absolute left-1/2 top-1/2 w-1 rounded-full bg-white/50",
-            style: {
-              width: W,
-              height: k,
-              transform: `translate(-50%, ${A}px)`,
-              opacity: D,
-              transition: m.active ? "height 40ms ease-out, opacity 60ms" : "height 200ms ease, opacity 120ms"
-            }
-          }
-        )
-      ]
+      children: P(w)
     }
   );
 });
-Re.displayName = "TapScrollCircle";
-const Ae = (c, e, n) => {
-  const t = "touches" in c.nativeEvent, r = t ? c.nativeEvent.touches[0] : c.nativeEvent, o = (m) => {
-    t && m.cancelable && m.preventDefault();
-    const d = "touches" in m ? m.touches[0] : m;
+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) => {
+    n && a.cancelable && a.preventDefault();
+    const h = "touches" in a ? a.touches[0] : a;
     e({
-      deltaX: d.clientX - r.clientX,
-      deltaY: d.clientY - r.clientY
+      deltaX: h.clientX - r.clientX,
+      deltaY: h.clientY - r.clientY
     });
-  }, s = () => {
-    t ? (document.removeEventListener("touchmove", o), document.removeEventListener("touchend", s)) : (document.removeEventListener("mousemove", o), document.removeEventListener("mouseup", s)), n?.();
+  }, l = () => {
+    n ? (document.removeEventListener("touchmove", i), document.removeEventListener("touchend", l)) : (document.removeEventListener("mousemove", i), document.removeEventListener("mouseup", l)), t?.();
   };
-  t ? (document.addEventListener("touchmove", o, { passive: !1 }), document.addEventListener("touchend", s)) : (document.addEventListener("mousemove", o), document.addEventListener("mouseup", s));
-}, Ee = "virtualscroll:tap-scroll-cancel", De = 20, Oe = 250, Ye = 60, He = 20, Ue = 20, $e = 220, _e = { active: !1, offsetY: 0, distance: 0, direction: 0 }, Se = 2.2, Xe = 8, qe = 120, ce = {
+  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 = {
   enabled: !0,
-  size: 64,
+  size: 40,
   offsetX: -80,
   offsetY: 0,
   className: void 0,
-  maxVisualDistance: $e,
-  opacity: 1
-}, je = (c) => {
-  if (!c || c <= 0)
-    return Se;
-  const e = Math.max(1, c), n = Math.log10(e), t = Se + n * Xe;
-  return C(t, Se, qe);
-}, Ke = ({ contentSize: c, viewportSize: e, scrollPosition: n, onScroll: t, horizontal: r = !1, scrollBarWidth: o = 12, className: s, ariaControls: m, tapScrollCircleOptions: d, itemCount: f }) => {
-  const [g, y] = le(!1), [w, ie] = le(!1), ae = N(null), Y = N(n), Q = N(null), D = N(null), u = N(_e), ee = N(null), E = N(null), P = N(null), F = O(() => {
-    const l = d?.maxSpeedMultiplier, L = typeof l == "number" ? l : je(f);
+  maxVisualDistance: dt,
+  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: d?.enabled ?? ce.enabled,
-      size: d?.size ?? ce.size,
-      offsetX: d?.offsetX ?? ce.offsetX,
-      offsetY: d?.offsetY ?? ce.offsetY,
-      className: d?.className ?? ce.className,
-      maxVisualDistance: d?.maxVisualDistance ?? ce.maxVisualDistance,
-      maxSpeedMultiplier: L,
-      opacity: C(d?.opacity ?? ce.opacity, 0, 1)
+      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
     };
-  }, [f, d]), {
-    enabled: W,
-    size: q,
-    offsetX: se,
-    offsetY: i,
-    className: $,
-    maxVisualDistance: k,
-    maxSpeedMultiplier: A,
-    opacity: x
-  } = F, T = Math.max(k, 1), M = e / c, h = o, p = Math.max(e - h * 2, 0), I = M * p, v = Math.min(Math.max(De, I || 0), p || De), b = c - e, _ = Math.max(p - v, 0), H = b <= 0 || _ <= 0 ? 0 : n / b * _, V = c > e;
-  re(() => {
-    Y.current = n;
-  }, [n]), re(() => {
-    ae.current && (g ? ae.current.style.backgroundColor = "#4F4F4F" : ae.current.style.backgroundColor = "#7F7F7F");
-  }, [g]);
-  const X = z(() => {
-    Q.current !== null && (window.clearInterval(Q.current), Q.current = null), D.current !== null && (window.clearTimeout(D.current), D.current = null);
-  }, []), R = z(() => {
-    E.current !== null && (window.cancelAnimationFrame(E.current), E.current = null), P.current = null;
-  }, []), S = z(() => {
-    u.current = { ..._e }, ie(!1), ee.current?.reset(), R();
-  }, [R]), K = z(
-    (l) => {
-      const L = u.current;
-      if (!L.active || L.direction === 0) {
-        R();
+  }, [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;
+  se(() => {
+    _.current = t;
+  }, [t]), se(() => {
+    r || b(!1);
+  }, [r]), se(() => {
+    const s = Z.current;
+    if (!s)
+      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");
+      return;
+    }
+    if (V) {
+      s.style.transform = K, s.style.backgroundColor = "#4F4F4F", s.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();
         return;
       }
-      if (!V || b <= 0) {
-        R();
+      if (!he || z <= 0) {
+        ce();
         return;
       }
-      const Z = P.current ?? l, B = Math.max((l - Z) / 1e3, 0);
-      if (P.current = l, B <= 0) {
-        E.current = window.requestAnimationFrame(K);
+      const K = H.current ?? s, te = Math.max((s - K) / 1e3, 0);
+      if (H.current = s, te <= 0) {
+        w.current = window.requestAnimationFrame(Ve);
         return;
       }
-      const Te = (Math.min(L.distance, T) / T) ** 1.1, de = Math.max(e * 0.2, 40), be = Math.max(e * A, 1200), we = de + (be - de) * Te, ge = Y.current, Ie = C(ge + L.direction * we * B, 0, b);
-      if (Ie === ge) {
-        R();
+      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();
         return;
       }
-      Y.current = Ie, t?.(Ie, ge), E.current = window.requestAnimationFrame(K);
+      _.current = Ce, n?.(Ce, Te), w.current = window.requestAnimationFrame(Ve);
     },
-    [T, b, t, V, R, A, e]
-  ), oe = z(() => {
-    E.current === null && (P.current = null, E.current = window.requestAnimationFrame(K));
-  }, [K]);
-  re(() => () => {
-    X(), R();
-  }, [X, R]);
-  const te = z(
-    (l) => {
-      u.current = l, ie(l.active), l.active && l.direction !== 0 ? oe() : R();
+    [B, z, n, he, ce, C, e]
+  ), ze = A(() => {
+    w.current === null && (H.current = null, w.current = window.requestAnimationFrame(Ve));
+  }, [Ve]);
+  se(() => () => {
+    Ie(), ce();
+  }, [Ie, ce]);
+  const et = A(
+    (s) => {
+      x.current = s, le(s.active), s.active && s.direction !== 0 ? ze() : ce();
     },
-    [oe, R]
+    [ze, ce]
   );
-  re(() => {
-    W || S();
-  }, [S, W]), re(() => {
-    const l = (L) => {
-      const B = L.detail?.paneId;
-      B && m && B !== m || S();
+  se(() => {
+    D || ue();
+  }, [ue, D]), se(() => {
+    const s = (v) => {
+      const te = v.detail?.paneId;
+      te && d && te !== d || ue();
     };
-    return window.addEventListener(Ee, l), () => {
-      window.removeEventListener(Ee, l);
+    return window.addEventListener(Ne, s), () => {
+      window.removeEventListener(Ne, s);
     };
-  }, [m, S]), re(() => {
-    if (!W)
+  }, [d, ue]), se(() => {
+    if (!D)
       return;
-    const l = (L) => {
-      if (!u.current.active)
+    const s = (v) => {
+      if (!x.current.active)
         return;
-      const Z = L.target;
-      if (!(Z instanceof Node)) {
-        S();
+      const K = v.target;
+      if (!(K instanceof Node)) {
+        ue();
         return;
       }
-      ee.current?.getElement()?.contains(Z) || S();
+      P.current?.getElement()?.contains(K) || ue();
     };
-    return document.addEventListener("pointerdown", l, !0), () => {
-      document.removeEventListener("pointerdown", l, !0);
+    return document.addEventListener("pointerdown", s, !0), () => {
+      document.removeEventListener("pointerdown", s, !0);
     };
-  }, [S, W]);
-  const a = (l) => {
-    if (!V || _ <= 0 || b <= 0)
+  }, [ue, D]);
+  const Ae = (s) => {
+    if (!he || ie <= 0 || z <= 0)
       return 0;
-    const L = C(l, 0, _);
-    return C(L / _ * b, 0, b);
-  }, G = (l) => {
-    if (!V || b <= 0)
+    const v = G(s, 0, ie);
+    return G(v / ie * z, 0, z);
+  }, Re = (s) => {
+    if (!he || z <= 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)
+      return;
+    if (!r) {
+      s.preventDefault(), s.stopPropagation();
       return;
-    const L = Math.max(Math.round(e / Ue), He), Z = Y.current, B = C(Z + l * L, 0, b);
-    B !== Z && (Y.current = B, t?.(B, Z));
-  }, U = () => {
-    X();
-  }, ne = (l) => (L) => {
-    V && (L.preventDefault(), L.stopPropagation(), S(), X(), G(l), D.current = window.setTimeout(() => {
-      Q.current = window.setInterval(() => {
-        G(l);
-      }, Ye);
-    }, Oe));
-  }, ue = (l) => (L) => {
-    (L.key === "Enter" || L.key === " " || L.key === "Spacebar") && (L.preventDefault(), G(l));
-  }, me = (l) => {
-    if (!V || "button" in l && l.button !== 0 || l.ctrlKey)
+    }
+    if ("button" in s && s.button !== 0 || s.ctrlKey)
       return;
-    l.stopPropagation(), S();
-    const L = H;
-    y(!0), Ae(
-      l,
-      ({ deltaX: Z, deltaY: B }) => {
-        t?.(a(L + (r ? Z : B)), H);
+    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);
       },
       () => {
-        y(!1);
+        X(!1), Z.current && !Z.current.matches(":hover") && b(!1);
       }
     );
-  }, Pe = (l) => {
-    if (!V || "button" in l && l.button !== 0 || l.ctrlKey)
+  }, Xe = (s) => {
+    if (!he)
+      return;
+    if (!i) {
+      s.preventDefault(), s.stopPropagation();
+      return;
+    }
+    if ("button" in s && s.button !== 0 || s.ctrlKey)
       return;
-    const Z = "touches" in l.nativeEvent ? l.nativeEvent.touches[0] : l.nativeEvent, B = r ? Z.clientX : Z.clientY, pe = l.currentTarget.getBoundingClientRect(), Te = r ? B - pe.left : B - pe.top;
-    S();
-    const de = Te - v / 2;
-    t?.(a(de), H), Ae(l, ({ deltaX: be, deltaY: we }) => {
-      t?.(a(de + (r ? be : we)), H);
+    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);
     });
-  }, Ce = O(() => C((w ? 1 : 0.8) * x, 0, 1), [w, x]), Ne = O(() => {
-    const L = `calc(50% - ${q / 2}px + ${i}px)`;
+  }, nt = xe(() => G((ae ? 1 : 0.8) * M, 0, 1), [ae, M]), rt = xe(() => {
+    const v = `calc(50% - ${f / 2}px + ${g}px)`;
     return {
-      left: se,
-      top: L
+      left: F,
+      top: v
     };
-  }, [se, i, q]);
-  return /* @__PURE__ */ xe(
+  }, [F, g, f]), Ue = (s, v, K) => /* @__PURE__ */ $(
+    "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,
+        backgroundColor: "#E0E0E0"
+      },
+      "aria-label": v,
+      onMouseDown: He(s),
+      onTouchStart: He(s),
+      onMouseUp: Pe,
+      onMouseLeave: Pe,
+      onTouchEnd: Pe,
+      onTouchCancel: Pe,
+      onKeyDown: tt(s),
+      "aria-disabled": !l,
+      disabled: !Ye,
+      children: /* @__PURE__ */ $("span", { "aria-hidden": "true", children: K })
+    }
+  );
+  return /* @__PURE__ */ Se(
     "div",
     {
-      className: he(
+      className: we(
         "group relative cursor-default select-none",
-        r ? "flex flex-row items-stretch" : "flex flex-col items-stretch",
-        s
+        ne,
+        u
       ),
       style: {
-        [r ? "width" : "height"]: e,
-        [r ? "height" : "width"]: o,
+        [I]: e,
+        [T]: h,
         backgroundColor: "white",
         userSelect: "none",
         position: "relative"
       },
       role: "scrollbar",
       tabIndex: -1,
-      "aria-controls": m,
-      "aria-valuenow": n,
+      "aria-controls": d,
+      "aria-valuenow": t,
       "aria-valuemin": 0,
-      "aria-valuemax": b,
-      "aria-orientation": r ? "horizontal" : "vertical",
+      "aria-valuemax": z,
+      "aria-orientation": a ? "horizontal" : "vertical",
       children: [
-        !r && V && W && /* @__PURE__ */ j(
-          Re,
+        !a && he && D && /* @__PURE__ */ $(
+          Qe,
           {
-            ref: ee,
-            className: he(
+            ref: P,
+            className: we(
               "pointer-events-auto absolute transition-opacity duration-150",
-              $
+              N
             ),
-            size: q,
-            maxVisualDistance: T,
-            style: Ne,
-            opacity: Ce,
-            onDragChange: te
+            size: f,
+            maxVisualDistance: B,
+            style: rt,
+            opacity: nt,
+            renderVisual: y,
+            onDragChange: et
           }
         ),
-        /* @__PURE__ */ j(
-          "button",
-          {
-            type: "button",
-            className: "flex items-center justify-center text-xs text-[#313131] 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: {
-              [r ? "width" : "height"]: h,
-              [r ? "height" : "width"]: o,
-              backgroundColor: "#E0E0E0"
-            },
-            "aria-label": r ? "Scroll left" : "Scroll up",
-            onMouseDown: ne(-1),
-            onTouchStart: ne(-1),
-            onMouseUp: U,
-            onMouseLeave: U,
-            onTouchEnd: U,
-            onTouchCancel: U,
-            onKeyDown: ue(-1),
-            disabled: !V,
-            children: /* @__PURE__ */ j("span", { "aria-hidden": "true", children: r ? "◀" : "▲" })
-          }
-        ),
-        /* @__PURE__ */ j(
+        Ue(-1, j[0], W[0]),
+        /* @__PURE__ */ $(
           "div",
           {
             className: "relative flex-1",
             style: {
               backgroundColor: "#F5F5F5",
-              borderRadius: o / 2
+              borderRadius: h / 2
             },
-            onMouseDown: Pe,
-            onTouchStart: Pe,
-            children: c > e && // スクロールバーのつまみの当たり判定を広げるためのラッパー
-            /* @__PURE__ */ j(
+            onMouseDown: Xe,
+            onTouchStart: Xe,
+            "aria-disabled": !i,
+            children: he && // スクロールバーのつまみの当たり判定を広げるためのラッパー
+            /* @__PURE__ */ $(
               "div",
               {
                 className: "group absolute",
                 style: {
-                  [r ? "width" : "height"]: v,
-                  [r ? "left" : "top"]: H,
-                  ...r ? { top: 0, bottom: 0 } : { left: 0, right: 0 }
+                  [I]: Q,
+                  [S]: ge,
+                  ...a ? { top: 0, bottom: 0 } : { left: 0, right: 0 }
                 },
-                onMouseDown: me,
-                onTouchStart: me,
+                onMouseDown: $e,
+                onTouchStart: $e,
                 role: "slider",
-                "aria-orientation": r ? "horizontal" : "vertical",
-                "aria-valuenow": n,
+                "aria-orientation": a ? "horizontal" : "vertical",
+                "aria-valuenow": t,
                 "aria-valuemin": 0,
-                "aria-valuemax": b,
-                tabIndex: 0,
-                children: /* @__PURE__ */ j(
+                "aria-valuemax": z,
+                "aria-disabled": !r,
+                tabIndex: r ? 0 : -1,
+                children: /* @__PURE__ */ $(
                   "div",
                   {
-                    ref: ae,
-                    className: he(
+                    ref: Z,
+                    className: we(
                       "absolute",
-                      r ? `inset-x-0 inset-y-[1.5px] group-hover:inset-y-[-0.5px] ${g ? "inset-y-[-2px]" : "group-active:inset-y-[-2px]"}` : `inset-x-[1.5px] inset-y-0 group-hover:inset-x-[-0.5px] ${g ? "inset-x-[-2px]" : "group-active:inset-x-[-2px]"}`
+                      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: o - 1,
-                      ...r ? {
+                      borderRadius: h - 1,
+                      cursor: r ? "pointer" : "default",
+                      ...a ? {
                         left: 0,
                         right: 0,
-                        top: g ? -2 : 1.5,
-                        bottom: g ? -2 : 1.5
+                        top: 1.5,
+                        bottom: 1.5
                       } : {
                         top: 0,
                         bottom: 0,
-                        left: g ? -2 : 1.5,
-                        right: g ? -2 : 1.5
+                        left: 1.5,
+                        right: 1.5
                       }
                     },
-                    onMouseEnter: (l) => {
-                      r ? (l.currentTarget.style.top = "-0.5px", l.currentTarget.style.bottom = "-0.5px") : (l.currentTarget.style.left = "-0.5px", l.currentTarget.style.right = "-0.5px"), g || (l.currentTarget.style.backgroundColor = "#5F5F5F");
+                    onMouseEnter: () => {
+                      r && b(!0);
                     },
-                    onMouseLeave: (l) => {
-                      r ? (l.currentTarget.style.top = g ? "-2px" : "1.5px", l.currentTarget.style.bottom = g ? "-2px" : "1.5px") : (l.currentTarget.style.left = g ? "-2px" : "1.5px", l.currentTarget.style.right = g ? "-2px" : "1.5px"), g || (l.currentTarget.style.backgroundColor = "#7F7F7F");
+                    onMouseLeave: () => {
+                      r && b(!1);
                     }
                   }
                 )
@@ -428,209 +451,272 @@ const Ae = (c, e, n) => {
             )
           }
         ),
-        /* @__PURE__ */ j(
-          "button",
-          {
-            type: "button",
-            className: "flex items-center justify-center text-xs text-[#313131] 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: {
-              [r ? "width" : "height"]: h,
-              [r ? "height" : "width"]: o,
-              backgroundColor: "#E0E0E0"
-            },
-            "aria-label": r ? "Scroll right" : "Scroll down",
-            onMouseDown: ne(1),
-            onTouchStart: ne(1),
-            onMouseUp: U,
-            onMouseLeave: U,
-            onTouchEnd: U,
-            onTouchCancel: U,
-            onKeyDown: ue(1),
-            disabled: !V,
-            children: /* @__PURE__ */ j("span", { "aria-hidden": "true", children: r ? "▶" : "▼" })
-          }
-        )
+        Ue(1, j[1], W[1])
       ]
     }
   );
-}, fe = {
+}, re = {
+  debug(o, ...e) {
+    typeof window < "u" && window.localStorage?.getItem("debug") === "true" && console.debug(`[VirtualScroll] ${o}`, ...e);
+  },
+  warn(o, ...e) {
+    console.warn(`[VirtualScroll] ${o}`, ...e);
+  },
+  error(o, ...e) {
+    console.error(`[VirtualScroll] ${o}`, ...e);
+  }
+}, ye = {
   maxVelocity: 6,
   minVelocity: 0.02,
   deceleration: 25e-4,
   velocitySampleWindow: 90,
   startVelocityThreshold: 0.04
-}, Be = Ve(({ children: c, contentSize: e, viewportSize: n, scrollBarWidth: t = 12, onScroll: r, className: o, style: s, background: m, tapScrollCircleOptions: d, inertiaOptions: f, itemCount: g }, y) => {
-  const w = N(0), [ie, ae] = ze((i) => i + 1, 0), Y = N(null), Q = N(null), D = N({
+}, 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({
     frame: null,
     velocity: 0,
     lastTimestamp: null
-  }), u = O(
+  }), O = xe(
     () => ({
-      maxVelocity: f?.maxVelocity ?? fe.maxVelocity,
-      minVelocity: f?.minVelocity ?? fe.minVelocity,
-      deceleration: f?.deceleration ?? fe.deceleration,
-      velocitySampleWindow: f?.velocitySampleWindow ?? fe.velocitySampleWindow,
-      startVelocityThreshold: f?.startVelocityThreshold ?? fe.startVelocityThreshold
+      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
     }),
-    [f]
+    [V]
   );
-  J.debug("[ScrollPane] ScrollPane rendered", { contentSize: e, viewportSize: n, scrollBarWidth: t, className: o, style: s, tapScrollCircleOptions: d, inertiaOptions: f });
-  const ee = N({ contentSize: e, viewportSize: n }), E = O(() => e > n, [e, n]), P = z(
-    (i) => {
-      const { contentSize: $, viewportSize: k } = ee.current, A = $ > k, x = w.current;
-      if (J.debug("[ScrollPane] scrollTo called", { newPosition: i, contentSize: $, viewportSize: k, currentIsScrollable: A, prevPosition: x }), !A) {
-        w.current !== 0 && (w.current = 0, r?.(0, x));
+  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));
         return;
       }
-      const T = typeof i == "function" ? i(w.current) : i, M = C(T, 0, $ - k);
-      w.current !== M && (w.current = M, r?.(M, x));
+      const C = typeof f == "function" ? f(b.current) : f, M = G(C, 0, F - g);
+      b.current !== M && (b.current = M, h?.(M, L));
     },
-    [r]
-  ), F = z(() => {
-    const i = D.current;
-    i.frame !== null && cancelAnimationFrame(i.frame), i.frame = null, i.velocity = 0, i.lastTimestamp = null;
-  }, []), W = z(
-    (i) => {
-      if (!E)
+    [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)
         return;
-      const { maxVelocity: $, minVelocity: k, deceleration: A, startVelocityThreshold: x } = u, T = C(i, -$, $);
-      if (Math.abs(T) < x)
+      const { maxVelocity: F, minVelocity: g, deceleration: N, startVelocityThreshold: L } = O, C = G(f, -F, F);
+      if (Math.abs(C) < L)
         return;
-      F(), D.current.velocity = T, D.current.lastTimestamp = null;
-      const M = (h) => {
-        const p = D.current;
-        if (p.lastTimestamp === null) {
-          p.lastTimestamp = h, p.frame = requestAnimationFrame(M);
+      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);
           return;
         }
-        const I = h - p.lastTimestamp;
-        if (p.lastTimestamp = h, I <= 0) {
-          p.frame = requestAnimationFrame(M);
+        const T = y - I.lastTimestamp;
+        if (I.lastTimestamp = y, T <= 0) {
+          I.frame = requestAnimationFrame(M);
           return;
         }
-        const v = p.velocity;
-        let b = v;
-        const _ = A * I;
-        v > 0 ? b = Math.max(0, v - _) : v < 0 && (b = Math.min(0, v + _));
-        const V = (v + b) / 2 * I, X = w.current;
-        V !== 0 && P((a) => a + V);
-        const R = w.current, { contentSize: S, viewportSize: K } = ee.current, oe = Math.max(S - K, 0);
-        p.velocity = b;
-        const te = R === X || R <= 0 && b <= 0 || R >= oe && b >= 0;
-        if (Math.abs(b) < k || te) {
-          F();
+        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();
           return;
         }
-        p.frame = requestAnimationFrame(M);
+        I.frame = requestAnimationFrame(M);
       };
-      D.current.frame = requestAnimationFrame(M);
+      U.current.frame = requestAnimationFrame(M);
     },
-    [E, u, P, F]
+    [P, O, w, H]
   );
-  ve(() => {
-    ee.current = { contentSize: e, viewportSize: n };
-  }, [e, n]), ve(() => {
-    if (E) {
-      J.debug("[ScrollPane] Adjusting scroll position due to content or viewport size change", { contentSize: e, viewportSize: n, scrollPosition: w.current });
-      const i = C(e - n, 0, e);
-      w.current > i && P(i);
+  Ee(() => {
+    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);
     } else
-      P(0);
-  }, [E, P, e, n]), re(() => {
-    const i = (k) => {
-      if (!E)
+      w(0);
+  }, [P, w, e, t]), se(() => {
+    const f = (g) => {
+      if (!P)
         return;
-      k.preventDefault(), F();
-      let A = k.deltaY;
-      k.deltaMode === 1 ? A *= 16 : k.deltaMode === 2 && (A *= n), J.debug("[ScrollPane] wheel event", { deltaY: A, scrollPosition: w.current }), P((x) => x + A);
-    }, $ = Y.current;
-    return $ && $.addEventListener("wheel", i, { passive: !1 }), () => {
-      $ && $.removeEventListener("wheel", i);
+      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);
     };
-  }, [E, P, F, n]), Me(
-    y,
+  }, [P, w, H, t]), Oe(
+    ee,
     () => ({
-      scrollTo: P,
-      getScrollPosition: () => w.current,
+      scrollTo: w,
+      getScrollPosition: () => b.current,
       getContentSize: () => e,
-      getViewportSize: () => n
+      getViewportSize: () => t
     }),
-    [P, e, n]
+    [w, e, t]
   );
-  const q = ke(), se = O(() => /* @__PURE__ */ xe("div", { ref: Y, className: he("flex", o), style: s, children: [
-    /* @__PURE__ */ xe("div", { ref: Q, className: "relative h-full flex-1 overflow-hidden", style: { height: n, touchAction: "none" }, id: q, children: [
-      m,
-      c(w.current)
-    ] }),
-    E && /* @__PURE__ */ j(
-      Ke,
+  const D = ot();
+  return se(() => {
+    const f = _.current;
+    if (!f)
+      return;
+    if (!a) {
+      H();
+      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)))
+        return;
+      S(c.clientY);
+      const J = c.clientY - N, Q = L - J;
+      w(Q), c.cancelable && c.preventDefault();
+    }, W = (c) => {
+      if (g !== c.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);
+        }
+      }
+      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]
+    ];
+    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();
+    };
+  }, [a, D, P, O, w, m, H]), /* @__PURE__ */ Se("div", { ref: Z, className: we("flex", u), style: d, children: [
+    /* @__PURE__ */ Se(
+      "div",
+      {
+        ref: _,
+        className: "relative h-full flex-1 overflow-hidden",
+        style: { height: t, ...a ? { touchAction: "none" } : {} },
+        id: D,
+        children: [
+          p,
+          o(b.current)
+        ]
+      }
+    ),
+    P && /* @__PURE__ */ $(
+      pt,
       {
         contentSize: e,
-        viewportSize: n,
-        scrollPosition: w.current,
-        onScroll: P,
-        scrollBarWidth: t,
-        ariaControls: q,
-        tapScrollCircleOptions: d,
-        itemCount: g
+        viewportSize: t,
+        scrollPosition: b.current,
+        onScroll: w,
+        enableThumbDrag: r,
+        enableTrackClick: i,
+        enableArrowButtons: l,
+        scrollBarWidth: n,
+        ariaControls: D,
+        tapScrollCircleOptions: R,
+        itemCount: X
       }
     )
-  ] }), [c, e, n, t, o, s, E, P, q, m, d, g]);
-  return re(() => {
-    const i = Q.current;
-    if (!i)
-      return;
-    const $ = 6, k = "input, textarea, select, button, a[href], [role='button']";
-    let A = null, x = 0, T = 0, M = !1, h = !1, p = !1, I = null, v = [];
-    const b = () => {
-      A = null, x = 0, T = 0, M = !1, h = !1, v = [];
-    }, _ = (a) => {
-      const G = performance.now();
-      v.push({ clientY: a, time: G }), v = v.filter((U) => G - U.time <= u.velocitySampleWindow);
-    }, H = (a) => a instanceof HTMLElement ? a.closest("[data-scrollpane-ignore-drag='true']") !== null : !1, V = (a) => a instanceof HTMLElement ? a.closest(k) !== null : !1, X = (a) => {
-      p && (a.preventDefault(), a.stopPropagation(), p = !1);
-    }, R = (a) => {
-      M || (M = !0, h = !1, p = !0, i.hasPointerCapture(a.pointerId) || i.setPointerCapture(a.pointerId), _(a.clientY));
-    }, S = (a) => {
-      if (A !== a.pointerId)
-        return;
-      if (!M) {
-        const ne = Math.abs(a.clientY - x);
-        if (h && ne < $)
-          return;
-        R(a);
+  ] });
+}), 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__ */ $(
+      "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"
+        }
       }
-      if (!M)
-        return;
-      _(a.clientY);
-      const G = a.clientY - x, U = T - G;
-      P(U), a.cancelable && a.preventDefault();
-    }, K = (a) => {
-      if (A !== a.pointerId)
-        return;
-      M && p && a.cancelable && (a.preventDefault(), a.stopPropagation()), i.hasPointerCapture(a.pointerId) && i.releasePointerCapture(a.pointerId);
-      let G = 0;
-      if (M && v.length >= 2) {
-        const U = v[v.length - 1], ne = v.find((ue) => U.time - ue.time <= u.velocitySampleWindow) ?? v[0];
-        if (U && ne && U.time !== ne.time) {
-          const ue = U.clientY - ne.clientY, me = U.time - ne.time;
-          G = -(ue / me);
+    ),
+    /* @__PURE__ */ $(
+      "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"
         }
       }
-      b(), I !== null && window.clearTimeout(I), p && (I = window.setTimeout(() => {
-        p = !1, I = null;
-      }, 0)), Math.abs(G) >= u.startVelocityThreshold && W(G);
-    }, oe = (a) => {
-      E && (a.button !== 0 && a.pointerType === "mouse" || a.ctrlKey || a.metaKey || a.altKey || H(a.target) || (window.dispatchEvent(new CustomEvent(Ee, { detail: { paneId: q } })), F(), A = a.pointerId, x = a.clientY, T = w.current, h = V(a.target), M = !1, p = !1, v = [], h || (p = !0, R(a), _(a.clientY), a.cancelable && a.preventDefault())));
-    }, te = (a) => {
-      A === a.pointerId && (p = !1, i.hasPointerCapture(a.pointerId) && i.releasePointerCapture(a.pointerId), I !== null && (window.clearTimeout(I), I = null), b());
-    };
-    return i.addEventListener("click", X, !0), i.addEventListener("pointerdown", oe, { passive: !1 }), i.addEventListener("pointermove", S, { passive: !1 }), i.addEventListener("pointerup", K), i.addEventListener("pointercancel", te), window.addEventListener("pointermove", S, { passive: !1 }), window.addEventListener("pointerup", K), window.addEventListener("pointercancel", te), () => {
-      i.removeEventListener("click", X, !0), i.removeEventListener("pointerdown", oe), i.removeEventListener("pointermove", S), i.removeEventListener("pointerup", K), i.removeEventListener("pointercancel", te), window.removeEventListener("pointermove", S), window.removeEventListener("pointerup", K), window.removeEventListener("pointercancel", te), A !== null && i.hasPointerCapture(A) && i.releasePointerCapture(A), I !== null && window.clearTimeout(I), F();
-    };
-  }, [q, E, u, P, W, F]), se;
-});
-class We {
+    ),
+    /* @__PURE__ */ $(
+      "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,
+          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"
+        }
+      }
+    ),
+    /* @__PURE__ */ $(
+      "div",
+      {
+        className: "absolute top-1/2 left-1/2 rounded-full bg-white/50",
+        style: {
+          width: X,
+          height: R,
+          transform: `translate(-50%, ${V}px)`,
+          opacity: e,
+          transition: P ? "40ms height, 60ms opacity ease-out ease-out" : "200ms ease height, 120ms ease opacity"
+        }
+      }
+    )
+  ] });
+};
+class xt {
   /**
    * @private
    * @property {Map<number, number>} tree - The Map storing the Fenwick tree structure, specifically the sums of deltas. It is 1-indexed.
@@ -670,8 +756,8 @@ class We {
    * @param {number | ((index: number) => number)} valueOrFn - The value for all elements, or a function to generate values.
    * @param {{ sampleRange?: { from: number; to: number }, materialize?: boolean }} [options] - Optional settings for initialization.
    */
-  constructor(e, n, t) {
-    this.reset(e, n, t);
+  constructor(e, t, n) {
+    this.reset(e, t, n);
   }
   /**
    * @method reset
@@ -681,26 +767,26 @@ class We {
    * @param {number | ((index: number) => number)} valueOrFn - The value for all elements, or a function to generate values.
    * @param {{ sampleRange?: { from: number; to: number }, materialize?: boolean }} [options] - Optional settings for initialization.
    */
-  reset(e, n, t) {
-    if (this.size = e, this.tree = /* @__PURE__ */ new Map(), this.deltas = /* @__PURE__ */ new Map(), this.total = void 0, typeof n == "function") {
-      if (this.valueFn = n, this.size > 0) {
-        const o = t?.sampleRange ?? {
+  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 ?? {
           from: 0,
           to: Math.min(99, this.size - 1)
-        }, { mode: s, materializedValues: m } = this._calculateMode(o.from, o.to);
-        if (this.baseValue = s, t?.materialize)
-          for (let d = 0; d < m.length; d++) {
-            const f = m[d], g = o.from + d;
-            if (g >= this.size)
+        }, { 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)
               break;
-            const y = f - this.baseValue;
-            this.deltas.set(g, y), this._updateTree(g, y);
+            const p = u - this.baseValue;
+            this.deltas.set(d, p), this._updateTree(d, p);
           }
       } else
         this.baseValue = 0;
       this.total = this.getTotal();
     } else
-      this.valueFn = void 0, this.baseValue = n, this.total = this.baseValue * this.size;
+      this.valueFn = void 0, this.baseValue = t, this.total = this.baseValue * this.size;
   }
   /**
    * @method setValueFn
@@ -720,33 +806,33 @@ class We {
    * @param {number} to - The ending index of the range (inclusive).
    * @returns {{ mode: number; materializedValues: number[] }} An object containing the calculated mode and the array of generated values.
    */
-  _calculateMode(e, n) {
+  _calculateMode(e, t) {
     if (!this.valueFn)
       return { mode: 0, materializedValues: [] };
-    const t = [];
-    for (let f = e; f <= n && !(f >= this.size); f++)
-      t.push(this.valueFn(f));
-    const r = [...t];
-    if (t.length === 0)
+    const n = [];
+    for (let u = e; u <= t && !(u >= this.size); u++)
+      n.push(this.valueFn(u));
+    const r = [...n];
+    if (n.length === 0)
       return { mode: 0, materializedValues: [] };
-    t.sort((f, g) => f - g);
-    const o = Math.floor(t.length / 2);
-    let s;
-    t.length % 2 === 0 ? s = Math.floor((t[o - 1] + t[o]) / 2) : s = t[o];
-    const m = /* @__PURE__ */ new Map();
-    let d = 0;
-    for (const f of t) {
-      const g = (m.get(f) ?? 0) + 1;
-      m.set(f, g), g > d && (d = g);
+    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];
+    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);
     }
-    if (d > 1) {
-      const f = [];
-      for (const [y, w] of m.entries())
-        w === d && f.push(y);
-      const g = f.reduce((y, w) => y + w, 0);
-      s = Math.floor(g / f.length);
+    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);
     }
-    return { mode: s, materializedValues: r };
+    return { mode: l, materializedValues: r };
   }
   /**
    * @method update
@@ -755,25 +841,18 @@ class We {
    * @param {number} index - The 0-based index to update.
    * @param {number} value - The new value.
    */
-  update(e, n) {
-    return this.updates([{ index: e, value: n }]);
+  update(e, t) {
+    return this.updates([{ index: e, value: t }]);
   }
   /**
    * @method updates
    * @description Updates the values at given indices.
    * @description 指定されたインデックスの値を更新。
-   * @param {{ index: number; value: number }[]} updates - An array of updates, each with an index and the new value.
+  * @param {ValueUpdate[]} updates - An array of updates, each with an index and the new value.
    */
   updates(e) {
-    const n = e.map(({ index: t, value: r }) => {
-      if (t < 0 || t >= this.size)
-        throw new Error(`Index ${t} out of bounds`);
-      if (r < 0)
-        throw new Error("Value cannot be negative.");
-      const o = this.deltas.has(t) ? (this.deltas.get(t) ?? 0) + this.baseValue : this.baseValue, s = r - o;
-      return { index: t, change: s };
-    }).filter((t) => t.change !== 0);
-    return n.length > 0 ? this.updateDeltas(n) : this.total;
+    const t = this._buildDeltaUpdates(e);
+    return t.length > 0 ? this.updateDeltas(t) : this.total;
   }
   /**
    * @method updateDelta
@@ -782,21 +861,21 @@ class We {
    * @param {number} index - The 0-based index to update.
    * @param {number} change - The value to add to the delta at the given index.
    */
-  updateDelta(e, n) {
-    return this.updateDeltas([{ index: e, change: n }]);
+  updateDelta(e, t) {
+    return this.updateDeltas([{ index: e, change: t }]);
   }
   /**
    * @method updateDeltas
    * @description Updates the deltas at given indices and propagates the changes through the tree.
    * @description 指定されたインデックスのデルタを更新し、変更をツリーに伝播させる。
-   * @param {{ index: number; change: number }[]} updates - An array of updates, each with an index and the change to apply.
+  * @param {DeltaUpdate[]} updates - An array of updates, each with an index and the change to apply.
    */
   updateDeltas(e) {
-    for (const { index: n, change: t } of e) {
-      if (n < 0 || n >= this.size)
-        throw new Error(`Index ${n} out of bounds`);
-      const r = this.deltas.get(n) ?? 0;
-      this.deltas.set(n, r + t), this._updateTree(n, t);
+    for (const { index: t, change: n } of e) {
+      if (t < 0 || t >= this.size)
+        throw new Error(`Index ${t} out of bounds`);
+      const r = this.deltas.get(t) ?? 0;
+      this.deltas.set(t, r + n), this._updateTree(t, n);
     }
     return this.total;
   }
@@ -808,13 +887,33 @@ class We {
    * @param {number} index - The 0-based index that changed.
    * @param {number} change - The change in value.
    */
-  _updateTree(e, n) {
-    if (n === 0)
+  _updateTree(e, t) {
+    if (t === 0)
       return;
-    let t = e + 1;
-    for (; t <= this.size; )
-      this.tree.set(t, (this.tree.get(t) ?? 0) + n), t += t & -t;
-    this.total !== void 0 && (this.total += n);
+    let n = e + 1;
+    for (; n <= this.size; )
+      this.tree.set(n, (this.tree.get(n) ?? 0) + t), n += n & -n;
+    this.total !== void 0 && (this.total += t);
+  }
+  /**
+   * @private
+   * @method _buildDeltaUpdates
+   * @description Converts value updates into delta updates while preserving validation logic.
+   * @description 値更新入力を検証しつつデルタ更新へ変換する。
+   * @param {ValueUpdate[]} updates - Requested value updates.
+   * @returns {DeltaUpdate[]} Sanitized delta updates ready to apply.
+   */
+  _buildDeltaUpdates(e) {
+    const t = [];
+    for (const { index: n, value: r } of e) {
+      if (n < 0 || n >= this.size)
+        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 });
+    }
+    return t;
   }
   /**
    * @private
@@ -824,106 +923,120 @@ class We {
    * @param {number} index - The 0-based index to materialize.
    * @param {boolean} [updateTree=true] - Whether to update the Fenwick tree after materialization.
    */
-  _materialize(e, n = !0) {
+  _materialize(e, t = !0) {
     if (this.valueFn) {
-      const t = this.deltas.get(e) ?? 0, o = this.valueFn(e) - this.baseValue;
-      if (o !== t && (this.deltas.set(e, o), n)) {
-        const s = o - t;
-        this._updateTree(e, s);
+      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);
       }
     }
   }
+  /**
+   * @private
+   * @method _materializeRanges
+   * @description Materializes values for provided ranges and optionally a target index, keeping existing semantics for each caller.
+   * @description 指定された範囲とターゲットインデックスを既存仕様通りに具現化する。
+   * @param {MaterializeOption | undefined} option - Materialization option wrapper.
+   * @param {number | undefined} index - Target index for materialization.
+   * @param {boolean} [forceIndex=false] - When true, materializes the index even if it is outside the provided ranges.
+   */
+  _materializeRanges(e, t, n = !1) {
+    if (!(e?.materialize && this.valueFn))
+      return;
+    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);
+      }
+      if (t === void 0)
+        return;
+      if (n) {
+        this._materialize(t);
+        return;
+      }
+      const i = r[0].from, l = r[r.length - 1].to;
+      t >= i && t <= l && this._materialize(t);
+      return;
+    }
+    t !== void 0 && this._materialize(t);
+  }
+  /**
+   * @private
+   * @method _findIndex
+   * @description Executes a binary search over prefix sums to find the first index satisfying a boundary condition.
+   * @description 累積和に対する二分探索を行い、境界条件を満たす最初のインデックスを求める。
+   * @param {number} target - Target cumulative value.
+   * @param {MaterializeConfig} options - Materialization setting wrapper.
+   * @param {boolean} chooseLowerBound - When true, finds the smallest index meeting or exceeding the target; otherwise finds the largest index not exceeding it.
+   * @returns {{ index: number; total: number | undefined; cumulative: number | undefined; currentValue: number | undefined; safeIndex: number | undefined }} Binary search result.
+   */
+  _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;
+    }
+    return { index: l, total: h, cumulative: a?.cumulative, currentValue: a?.currentValue, safeIndex: a?.safeIndex };
+  }
   /**
    * @method prefixSum
    * @description Calculates the cumulative sum up to a given index (inclusive) in O(log n) time.
    * @description 指定されたインデックスまでの累積和を O(log n) で計算。
    * @param {number} index - The 0-based index to prefixSum up to.
-   * @param {object} [options] - Optional settings for materializing values.
-   * @param {object} [options.materializeOption] - Options to control materialization.
-   * @param {boolean} [options.materializeOption.materialize=false] - Whether to materialize values.
-   * @param {object[]} [options.materializeOption.ranges] - An optional array of ranges to materialize values for.
-   * @param {number} options.materializeOption.ranges.from - The starting index of the range.
-   * @param {number} options.materializeOption.ranges.to - The ending index of the range.
+   * @param {MaterializeConfig} [options] - Optional settings for materializing values.
    * @returns {{ cumulative: number; total: number | undefined; currentValue: number; safeIndex: number }} The cumulative sum of values from index 0 to the given index, the total sum, and the value at the given index.
    */
-  prefixSum(e, n) {
+  prefixSum(e, t) {
     if (e < 0)
       return { cumulative: 0, total: this.total, currentValue: 0, safeIndex: 0 };
-    const t = C(e, 0, this.size - 1), r = n?.materializeOption;
-    if (r?.materialize && this.valueFn) {
-      if (r.ranges)
-        for (const d of r.ranges) {
-          const f = d.from, g = Math.min(d.to, this.size - 1);
-          for (let y = f; y <= g; y++)
-            this._materialize(y);
-        }
-      this._materialize(t);
-    }
-    let o = 0, s = t + 1;
-    for (; s > 0; ) {
-      const d = this.tree.get(s) ?? 0;
-      o += d, s -= s & -s;
+    const n = G(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;
     }
-    const m = r?.materialize ? this.get(t) : (this.deltas.get(t) || 0) + this.baseValue;
-    return { cumulative: o + this.baseValue * (t + 1), total: this.total, currentValue: m, safeIndex: t };
+    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 };
   }
   /**
    * @method get
    * @description Gets the value at a specific index.
    * @description 特定のインデックスの値を取得。
    * @param {number} index - The 0-based index to get.
-   * @param {object} [options] - Optional settings for materializing values.
-   * @param {object} [options.materializeOption] - Options to control materialization.
-   * @param {boolean} [options.materializeOption.materialize=false] - Whether to materialize values.
-   * @param {object[]} [options.materializeOption.ranges] - An optional array of ranges to materialize values for.
-   * @param {number} options.materializeOption.ranges.from - The starting index of the range.
-   * @param {number} options.materializeOption.ranges.to - The ending index of the range.
+   * @param {MaterializeConfig} [options] - Optional settings for materializing values.
    * @returns {number} The value at the given index.
    */
-  get(e, n) {
+  get(e, t) {
     if (e < 0 || e >= this.size)
       throw new Error("Index out of bounds");
-    const t = n?.materializeOption;
-    if (t?.materialize && this.valueFn)
-      if (t.ranges) {
-        for (const r of t.ranges) {
-          const o = r.from, s = Math.min(r.to, this.size - 1);
-          for (let m = o; m <= s; m++)
-            this._materialize(m);
-        }
-        e >= t.ranges[0].from && e <= t.ranges[t.ranges.length - 1].to && this._materialize(e);
-      } else
-        this._materialize(e);
-    return (this.deltas.get(e) ?? 0) + this.baseValue;
+    const n = t?.materializeOption;
+    return this._materializeRanges(n, e), (this.deltas.get(e) ?? 0) + this.baseValue;
   }
   /**
    * @method getTotal
    * @description Gets the total sum of all values in the tree.
    * @description ツリー内のすべての値の合計を取得。
-   * @param {object} [options] - Optional settings for materializing values.
-   * @param {object} [options.materializeOption] - Options to control materialization.
-   * @param {boolean} [options.materializeOption.materialize=false] - Whether to materialize values.
-   * @param {object[]} [options.materializeOption.ranges] - An optional array of ranges to materialize values for.
-   * @param {number} options.materializeOption.ranges.from - The starting index of the range.
-   * @param {number} options.materializeOption.ranges.to - The ending index of the range.
+   * @param {MaterializeConfig} [options] - Optional settings for materializing values.
    * @returns {number} The total sum of all values.
    */
   getTotal(e) {
-    const n = e?.materializeOption;
-    if (n?.materialize && this.valueFn && n.ranges)
-      for (const t of n.ranges) {
-        const r = t.from, o = Math.min(t.to, this.size - 1);
-        for (let s = r; s <= o; s++)
-          this._materialize(s);
-      }
-    if (this.total === void 0)
+    const t = e?.materializeOption;
+    if (this._materializeRanges(t), this.total === void 0)
       if (this.size === 0)
         this.total = 0;
       else {
-        let t = this.baseValue * this.size;
-        for (const r of this.deltas.values())
-          t += r;
-        this.total = t, console.assert(this.prefixSum(this.getSize() - 1).cumulative === this.prefixSum(this.getSize() - 1).total, "Inconsistent Fenwick Tree state");
+        let n = this.baseValue * this.size;
+        for (const i of this.deltas.values())
+          n += i;
+        this.total = n;
+        const r = this.prefixSum(this.getSize() - 1);
+        console.assert(r.cumulative === r.total, "Inconsistent Fenwick Tree state");
       }
     return this.total;
   }
@@ -937,19 +1050,19 @@ class We {
   rebuildTree(e) {
     if (e?.materialize && this.valueFn) {
       const r = this.valueFn;
-      this.reset(this.size, (o) => r(o), { materialize: !0 });
+      this.reset(this.size, (i) => r(i), { materialize: !0 });
       return;
     }
-    const n = /* @__PURE__ */ new Map();
-    let t = this.baseValue * this.size;
-    for (const [r, o] of this.deltas.entries()) {
-      if (t += o, o === 0)
+    const t = /* @__PURE__ */ new Map();
+    let n = this.baseValue * this.size;
+    for (const [r, i] of this.deltas.entries()) {
+      if (n += i, i === 0)
         continue;
-      let s = r + 1;
-      for (; s <= this.size; )
-        n.set(s, (n.get(s) ?? 0) + o), s += s & -s;
+      let l = r + 1;
+      for (; l <= this.size; )
+        t.set(l, (t.get(l) ?? 0) + i), l += l & -l;
     }
-    this.tree = n, this.total = t;
+    this.tree = t, this.total = n;
   }
   /**
    * @method calculateAccumulatedError
@@ -961,8 +1074,8 @@ class We {
     if (this.total === void 0)
       return 0;
     let e = this.baseValue * this.size;
-    for (const n of this.deltas.values())
-      e += n;
+    for (const t of this.deltas.values())
+      e += t;
     return this.total - e;
   }
   /**
@@ -972,13 +1085,15 @@ class We {
    * @param {number} newSize - The new size of the tree.
    */
   changeSize(e) {
-    const n = this.size;
-    if (e !== n) {
-      if (e < n)
-        for (const t of this.deltas.keys())
-          t >= e && this.deltas.delete(t);
-      this.size = e, this.rebuildTree(), console.assert(this.prefixSum(this.getSize() - 1).cumulative === this.prefixSum(this.getSize() - 1).total, "Inconsistent Fenwick Tree state");
-    }
+    const t = this.size;
+    if (e === t)
+      return;
+    if (e < t)
+      for (const r of this.deltas.keys())
+        r >= e && this.deltas.delete(r);
+    this.size = e, this.rebuildTree();
+    const n = this.prefixSum(this.getSize() - 1);
+    console.assert(n.cumulative === n.total, "Inconsistent Fenwick Tree state");
   }
   /**
    * @method getSize
@@ -994,206 +1109,44 @@ class We {
    * @description Finds the first index where the cumulative sum is greater than or equal to a target value.
    * @description 累積和がターゲット値以上になる最初のインデックスを検索。
    * @param {number} target - The target cumulative sum.
-   * @param {object} [options] - Optional settings for materializing values.
-   * @param {object} [options.materializeOption] - Options to control materialization.
-   * @param {boolean} [options.materializeOption.materialize=false] - Whether to materialize values.
-   * @param {object[]} [options.materializeOption.ranges] - An optional array of ranges to materialize values for.
-   * @param {number} options.materializeOption.ranges.from - The starting index of the range.
-   * @param {number} options.materializeOption.ranges.to - The ending index of the range.
+  * @param {MaterializeConfig} [options] - Optional settings for materializing values.
+  * @param {MaterializeOption} [options.materializeOption] - Options to control materialization.
+  * @param {boolean} [options.materializeOption.materialize=false] - Whether to materialize values.
+  * @param {MaterializeRange[]} [options.materializeOption.ranges] - Optional ranges for eager materialization.
    * @returns {{ index: number, total: number | undefined, cumulative: number | undefined, currentValue: number | undefined, safeIndex: number | undefined }} The 0-based index and the total sum, or -1 if not found.
    */
-  findIndexAtOrAfter(e, n) {
-    if (this.size === 0)
-      return { index: -1, total: this.total ?? 0, cumulative: void 0, currentValue: void 0, safeIndex: void 0 };
-    let t = 0, r = this.size - 1, o = -1, s, m = this.total;
-    for (; t <= r; ) {
-      const d = Math.floor((t + r) / 2);
-      s = this.prefixSum(d, n), m = s.total, s.cumulative >= e ? (o = d, r = d - 1) : t = d + 1;
-    }
-    return { index: o, total: m, cumulative: s?.cumulative, currentValue: s?.currentValue, safeIndex: s?.safeIndex };
+  findIndexAtOrAfter(e, t) {
+    return this._findIndex(e, t ?? {}, !0);
   }
   /**
    * @method findIndexAtOrBefore
    * @description Finds the last index where the cumulative sum is less than or equal to a target value.
    * @description 累積和がターゲット値以下になる最後のインデックスを検索。
    * @param {number} target - The target cumulative sum.
-   * @param {object} [options] - Optional settings for materializing values.
-   * @param {object} [options.materializeOption] - Options to control materialization.
-   * @param {boolean} [options.materializeOption.materialize=false] - Whether to materialize values.
-   * @param {object[]} [options.materializeOption.ranges] - An optional array of ranges to materialize values for.
-   * @param {number} options.materializeOption.ranges.from - The starting index of the range.
-   * @param {number} options.materializeOption.ranges.to - The ending index of the range.
+  * @param {MaterializeConfig} [options] - Optional settings for materializing values.
+  * @param {MaterializeOption} [options.materializeOption] - Options to control materialization。
+  * @param {boolean} [options.materializeOption.materialize=false] - Whether to materialize values。
+  * @param {MaterializeRange[]} [options.materializeOption.ranges] - Optional ranges for eager materialization。
    * @returns {{ index: number, total: number | undefined, cumulative: number | undefined, currentValue: number | undefined, safeIndex: number | undefined }} The 0-based index and the total sum, or -1 if not found.
    */
-  findIndexAtOrBefore(e, n) {
-    if (this.size === 0)
-      return { index: -1, total: this.total ?? 0, cumulative: void 0, currentValue: void 0, safeIndex: void 0 };
-    let t = 0, r = this.size - 1, o = -1, s, m = this.total;
-    for (; t <= r; ) {
-      const d = Math.floor((t + r) / 2);
-      s = this.prefixSum(d, n), m = s.total, s.cumulative <= e ? (o = d, t = d + 1) : r = d - 1;
-    }
-    return { index: o, total: m, cumulative: s?.cumulative, currentValue: s?.currentValue, safeIndex: s?.safeIndex };
+  findIndexAtOrBefore(e, t) {
+    return this._findIndex(e, t ?? {}, !1);
   }
 }
-const Ge = (c, e, n) => {
-  const t = Math.max(0, c), r = N(null), o = O(() => new We(t, e, n), [t, e, n]);
-  return Object.is(r.current, o) || console.warn("[useFenwickMapTree] instance changed"), r.current = o, o;
+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;
 };
-function Ze({ itemCount: c, getItem: e, getItemHeight: n, viewportSize: t, overscanCount: r = 5, className: o, onScroll: s, onRangeChange: m, children: d, background: f, initialScrollIndex: g, initialScrollOffset: y, tapScrollCircleOptions: w, inertiaOptions: ie }, ae) {
-  const Y = N(null), Q = N(!1);
-  re(() => (Q.current = !0, () => {
-    Q.current = !1;
-  }), []);
-  const D = N({ size: c, valueOrFn: n, options: { sampleRange: { from: 0, to: 100 } } }), u = Ge(D.current.size, D.current.valueOrFn, D.current.options), [ee] = le(() => {
-    let h = 0, p = 0;
-    if (typeof g == "number") {
-      const I = C(g, 0, c - 1), v = C(I - r * 2, 0, c - 1), b = C(I + r * 2, 0, c - 1), _ = g > 0 ? { materializeOption: { materialize: !0, ranges: [{ from: v, to: b }] } } : void 0, { cumulative: H, total: V, currentValue: X } = u.prefixSum(g, _);
-      h = H - X, p = V ?? u.getTotal();
-    } else typeof y == "number" && (h = y), p = u.getTotal();
-    return { position: h, total: p };
-  }), [E, P] = le(ee.position), [F, W] = le(ee.total), [q, se] = le(ee.position), [i, $] = le(c);
-  ve(() => {
-    u.setValueFn(n), i !== c && (u.changeSize(c), $(c));
-    const h = u.getTotal();
-    F !== h && W(h);
-  }, [u, i, c, F, n]), ve(() => {
-    q !== null && Y.current && (J.debug("[VirtualScroll] Scrolling to position:", q), Y.current.scrollTo(q), se(null));
-  }, [q]);
-  const k = z(
-    (h) => {
-      if (Y.current) {
-        J.debug("[VirtualScroll] Scrolling to index:", h);
-        const p = C(h, 0, i - 1), I = C(p - r * 2, 0, i - 1), v = C(p + r * 2, 0, i - 1), { cumulative: b, total: _, currentValue: H } = u.prefixSum(p, { materializeOption: { materialize: !0, ranges: [{ from: I, to: v }] } });
-        J.debug("[VirtualScroll] Scrolling to index:", h, "Offset:", b, "Total height:", _, "Current value:", H, "safeIndex:", p, "safeIndexFrom:", I, "safeIndexTo:", v), _ && (W(_), se(b - H)), J.debug("[VirtualScroll] Setting scroll position to:", b - H);
-      }
-    },
-    [u, r, i]
-  ), A = z(
-    (h) => {
-      if (Y.current) {
-        const p = u.getTotal(), I = C(Math.floor(h), 0, p), v = u.findIndexAtOrAfter(I, { materializeOption: { materialize: !1 } }).index;
-        k(v);
-      }
-    },
-    [u, k]
-  ), x = z(
-    (h, p) => {
-      J.debug("[VirtualScroll] Scroll position changed:", h), P(h);
-      const I = u.getTotal();
-      s?.(h, I);
-    },
-    [u, s]
-  ), T = O(() => {
-    if (i === 0)
-      return { renderingStartIndex: 0, renderingEndIndex: 0, visibleStartIndex: 0, visibleEndIndex: 0 };
-    const { index: h, cumulative: p, currentValue: I } = u.findIndexAtOrAfter(E, { materializeOption: { materialize: !1 } });
-    let v = 0;
-    h === -1 ? v = 0 : (p ?? 0) < E + (I ?? 0) ? v = 1 : v = 0;
-    const b = h === -1 ? 0 : h + v, _ = C(b - r, 0, i - 1);
-    let H = 0, V = h === -1 ? 0 : h + v;
-    for (; V < i && H < t; ) {
-      const R = n(V);
-      H += R, V++;
-    }
-    V -= 1;
-    const X = C(V + r, 0, i - 1);
-    return J.debug("[VirtualScroll] Calculated rendering range:", {
-      renderingStartIndex: _,
-      renderingEndIndex: X,
-      visibleStartIndex: b,
-      visibleEndIndex: V,
-      scrollPosition: E,
-      renderingContentSize: u.getTotal(),
-      overscanCount: r,
-      viewportSize: t
-    }), { renderingStartIndex: _, renderingEndIndex: X, visibleStartIndex: b, visibleEndIndex: V };
-  }, [E, r, t, n, u, i]);
-  re(() => {
-    const h = Y.current?.getScrollPosition() ?? 0;
-    J.debug("[VirtualScroll] Range change effect triggered", {
-      renderingStartIndex: T.renderingStartIndex,
-      renderingEndIndex: T.renderingEndIndex,
-      visibleStartIndex: T.visibleStartIndex,
-      visibleEndIndex: T.visibleEndIndex,
-      scrollPosition: E,
-      contentSize: F,
-      scrollPaneScrollPosition: h
-    }), m?.(T.renderingStartIndex, T.renderingEndIndex, T.visibleStartIndex, T.visibleEndIndex, E, F);
-  }, [T.renderingStartIndex, T.renderingEndIndex, T.visibleStartIndex, T.visibleEndIndex, m, E, F]);
-  const M = z(
-    (h) => {
-      const { renderingStartIndex: p, renderingEndIndex: I } = T;
-      if (J.debug("[VirtualScroll] Rendering visible items", { currentScrollPosition: h, renderingStartIndex: p, renderingEndIndex: I, fenwickSize: i, viewportSize: t }), i === 0)
-        return /* @__PURE__ */ j("div", { className: "absolute w-full", style: { top: 0 }, children: /* @__PURE__ */ j("div", { className: "text-center text-gray-500", children: "No items" }) });
-      const v = C(p, 0, i - 1), { cumulative: b, currentValue: _ } = u.prefixSum(v, { materializeOption: { materialize: !1 } }), H = b - _, V = [], X = [];
-      for (let S = p; S <= I; S++) {
-        const K = n(S);
-        V.push({ item: e(S), height: K }), u.get(S) !== K && X.push({ index: S, value: K });
-      }
-      X.length > 0 && Promise.resolve().then(() => {
-        const S = u.updates(X);
-        S && (W(S), J.debug("[VirtualScroll] Updated heights for items", X, "New total height:", S));
-      });
-      const R = F < t ? 0 : H - h;
-      return J.debug("[VirtualScroll] Rendering items", { visibleItems: V, containerTop: R }), /* @__PURE__ */ j("div", { className: "absolute w-full", style: { top: R }, children: V.map(({ item: S, height: K }, oe) => {
-        const te = p + oe, a = C(te, 0, i - 1), { cumulative: G, currentValue: U } = u.prefixSum(a, { materializeOption: { materialize: !1 } }), ne = G - U;
-        return /* @__PURE__ */ j(
-          "div",
-          {
-            "data-index": te,
-            style: {
-              position: "absolute",
-              top: ne - H,
-              width: "100%"
-            },
-            children: d(S, te)
-          },
-          te
-        );
-      }) });
-    },
-    [e, d, F, t, T, u, i, n]
-  );
-  return Me(
-    ae,
-    () => ({
-      getScrollPosition: () => Y.current?.getScrollPosition() ?? -1,
-      getContentSize: () => Y.current?.getContentSize() ?? -1,
-      getViewportSize: () => Y.current?.getViewportSize() ?? -1,
-      scrollTo: (h) => A(h),
-      scrollToIndex: (h) => k(h),
-      getFenwickTreeTotalHeight: () => u.getTotal(),
-      getFenwickSize: () => u.getSize()
-    }),
-    [k, u, A]
-  ), /* @__PURE__ */ j(
-    Be,
-    {
-      ref: Y,
-      contentSize: F,
-      viewportSize: t,
-      className: o,
-      onScroll: x,
-      background: f,
-      tapScrollCircleOptions: w,
-      inertiaOptions: ie,
-      itemCount: c,
-      children: M
-    }
-  );
-}
-const st = Ve(Ze);
-class Je {
+class bt {
   key;
   value;
   prev = null;
   next = null;
-  constructor(e, n) {
-    this.key = e, this.value = n;
+  constructor(e, t) {
+    this.key = e, this.value = t;
   }
 }
-class Fe {
+class Ze {
   head = null;
   tail = null;
   /**
@@ -1234,54 +1187,193 @@ class Fe {
     this.remove(e), this.addToTail(e);
   }
 }
-function Qe(c) {
-  const e = N(/* @__PURE__ */ new Map()), n = N(new Fe());
-  re(() => {
-    for (; e.current.size > c; ) {
-      const f = n.current.removeHead();
-      if (f)
-        e.current.delete(f.key);
+function Tt(o) {
+  const e = k(/* @__PURE__ */ new Map()), t = k(new Ze());
+  se(() => {
+    for (; e.current.size > o; ) {
+      const u = t.current.removeHead();
+      if (u)
+        e.current.delete(u.key);
       else
         break;
     }
-  }, [c]);
-  const t = z((f) => {
-    const g = e.current.get(f);
-    if (g)
-      return n.current.moveToTail(g), g.value;
-  }, []), r = z(
-    (f, g) => {
-      if (c <= 0)
+  }, [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)
         return;
-      let y = e.current.get(f);
-      if (y)
-        y.value = g, n.current.moveToTail(y);
+      let p = e.current.get(u);
+      if (p)
+        p.value = d, t.current.moveToTail(p);
       else {
-        if (e.current.size >= c) {
-          const w = n.current.removeHead();
-          w && e.current.delete(w.key);
+        if (e.current.size >= o) {
+          const R = t.current.removeHead();
+          R && e.current.delete(R.key);
         }
-        y = new Je(f, g), e.current.set(f, y), n.current.addToTail(y);
+        p = new bt(u, d), e.current.set(u, p), t.current.addToTail(p);
       }
     },
-    [c]
-  ), o = z((f) => e.current.has(f), []), s = z(() => {
-    e.current.clear(), n.current = new Fe();
-  }, []), [m, d] = le(() => ({ get: t, set: r, has: o, clear: s }));
-  return re(() => d({ get: t, set: r, has: o, clear: s }), [t, r, o, s]), m;
+    [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;
 }
-const et = 1e4, it = () => {
-  const { get: c, set: e, has: n, clear: t } = Qe(et);
-  return { get: c, set: e, has: n, clear: t };
+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) => {
+  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 };
 };
+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;
+  }), []);
+  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)
+        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));
+    },
+    [x, r, g]
+  ), C = A(
+    (T) => {
+      if (!_.current)
+        return;
+      const S = x.getTotal(), E = G(Math.floor(T), 0, S), q = x.findIndexAtOrAfter(E, { materializeOption: { materialize: !1 } }).index;
+      L(q);
+    },
+    [x, L]
+  ), M = A(
+    (T, S) => {
+      re.debug("[VirtualScroll] Scroll position changed:", T), H(T);
+      const E = x.getTotal();
+      l?.(T, E);
+    },
+    [x, l]
+  ), y = xe(() => {
+    const T = wt(w, n, r, g, t, x);
+    return re.debug("[VirtualScroll] Calculated rendering range:", {
+      ...T,
+      scrollPosition: w,
+      renderingContentSize: x.getTotal(),
+      overscanCount: r,
+      viewportSize: n
+    }), T;
+  }, [w, 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 });
+      }
+      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));
+      });
+      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__ */ $(
+          "div",
+          {
+            "data-index": c,
+            style: {
+              position: "absolute",
+              top: ie - W,
+              width: "100%"
+            },
+            children: h(Y, c)
+          },
+          c
+        );
+      }) });
+    },
+    [e, h, m, n, y, x, g, t]
+  );
+  return Oe(Z, () => ({
+    getScrollPosition: () => _.current?.getScrollPosition() ?? -1,
+    getContentSize: () => _.current?.getContentSize() ?? -1,
+    getViewportSize: () => _.current?.getViewportSize() ?? -1,
+    scrollTo: C,
+    scrollToIndex: L,
+    getFenwickTreeTotalHeight: () => x.getTotal(),
+    getFenwickSize: () => x.getSize()
+  }), [C, L, x]), /* @__PURE__ */ $(
+    gt,
+    {
+      ref: _,
+      contentSize: m,
+      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
+    }
+  );
+}
+const At = ke(St);
 export {
-  We as FenwickMapTree,
-  Ke as ScrollBar,
-  Be as ScrollPane,
-  st as VirtualScroll,
-  C as minmax,
-  Ge as useFenwickMapTree,
-  it as useHeightCache,
-  Qe as useLruCache
+  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
 };
 //# sourceMappingURL=index.js.map