@pdanpdan/virtual-scroll 0.1.0

package/dist/index.js

@@ -0,0 +1,961 @@
+import { ref as P, reactive as ot, computed as E, watch as ie, getCurrentInstance as ut, onMounted as it, nextTick as Ke, onUnmounted as nt, defineComponent as rt, createBlock as xe, openBlock as se, resolveDynamicComponent as Me, unref as ye, normalizeStyle as We, normalizeClass as $e, withCtx as Ce, createCommentVNode as Ae, createElementBlock as Ze, renderSlot as Ve, createElementVNode as ct, Fragment as st, renderList as dt, toDisplayString as Je } from "vue";
+class Qe {
+  tree;
+  values;
+  constructor(a) {
+    this.tree = new Float64Array(a + 1), this.values = new Float64Array(a);
+  }
+  /**
+   * Update the value at a specific index and propagate changes.
+   * @param index 0-based index
+   * @param delta The change in value (new value - old value)
+   */
+  update(a, g) {
+    if (!(a < 0 || a >= this.values.length))
+      for (this.values[a] = this.values[a] + g, a++; a < this.tree.length; )
+        this.tree[a] = this.tree[a] + g, a += a & -a;
+  }
+  /**
+   * Get the prefix sum up to a specific index (exclusive).
+   * @param index 0-based index. query(n) returns sum of values from 0 to n-1.
+   * @returns Sum of values in range [0, index)
+   */
+  query(a) {
+    let g = 0;
+    for (; a > 0; )
+      g += this.tree[a] || 0, a -= a & -a;
+    return g;
+  }
+  /**
+   * Set the individual value at an index without updating the tree.
+   * Call rebuild() after multiple sets to update the tree efficiently.
+   */
+  set(a, g) {
+    a < 0 || a >= this.values.length || (this.values[a] = g);
+  }
+  /**
+   * Get the number of items in the tree.
+   */
+  get length() {
+    return this.values.length;
+  }
+  /**
+   * Get the individual value at an index.
+   */
+  get(a) {
+    return this.values[a] || 0;
+  }
+  /**
+   * Get the underlying values array.
+   */
+  getValues() {
+    return this.values;
+  }
+  /**
+   * Find the largest index such that the prefix sum is less than or equal to the given value.
+   * Useful for finding which item is at a specific scroll offset.
+   * @param value The prefix sum value to search for
+   * @returns The 0-based index
+   */
+  findLowerBound(a) {
+    let g = 0;
+    const n = this.tree.length;
+    let W = 1 << Math.floor(Math.log2(n - 1));
+    for (; W > 0; ) {
+      const Z = g + W;
+      if (Z < n) {
+        const U = this.tree[Z] || 0;
+        U <= a && (g = Z, a -= U);
+      }
+      W >>= 1;
+    }
+    return g;
+  }
+  /**
+   * Rebuild the entire tree from the current values array in O(N).
+   * Useful after bulk updates to the values array.
+   */
+  rebuild() {
+    this.tree.fill(0);
+    for (let a = 0; a < this.values.length; a++)
+      this.tree[a + 1] = this.values[a] || 0;
+    for (let a = 1; a < this.tree.length; a++) {
+      const g = a + (a & -a);
+      g < this.tree.length && (this.tree[g] = this.tree[g] + this.tree[a]);
+    }
+  }
+  /**
+   * Resize the tree while preserving existing values.
+   * @param size New size of the tree
+   */
+  resize(a) {
+    if (a === this.values.length)
+      return;
+    const g = new Float64Array(a);
+    g.set(this.values.subarray(0, Math.min(a, this.values.length))), this.values = g, this.tree = new Float64Array(a + 1), this.rebuild();
+  }
+  /**
+   * Shift values by a given offset and rebuild the tree.
+   * Useful when items are prepended to the list.
+   * @param offset Number of positions to shift (positive for prepending)
+   */
+  shift(a) {
+    if (a === 0)
+      return;
+    const g = this.values.length, n = new Float64Array(g);
+    a > 0 ? n.set(this.values.subarray(0, Math.min(g - a, this.values.length)), a) : n.set(this.values.subarray(-a)), this.values = n, this.rebuild();
+  }
+}
+function pe(e) {
+  return !!e && "getBoundingClientRect" in e;
+}
+function _e(e) {
+  return !!e && "scrollLeft" in e;
+}
+function et(e) {
+  return typeof e == "object" && e !== null && ("align" in e || "behavior" in e || "isCorrection" in e);
+}
+function we(e, a) {
+  return typeof e == "object" && e !== null ? e.x || 0 : a === "horizontal" && e || 0;
+}
+function Se(e, a) {
+  return typeof e == "object" && e !== null ? e.y || 0 : (a === "vertical" || a === "both") && e || 0;
+}
+const vt = 50, tt = 150, lt = 5;
+function ft(e) {
+  const a = P(0), g = P(0), n = P(!1), W = P(!1), Z = P(!1), U = P(!1), j = P(0), te = P(0), N = ot({ x: 0, y: 0 });
+  let ne;
+  const ce = P(!1), R = new Qe(e.value.items.length), x = new Qe(e.value.items.length), T = new Qe(e.value.columnCount || 0), L = P(0);
+  let ae = new Uint8Array(0), J = new Uint8Array(0), A = new Uint8Array(0);
+  const Q = P(null), de = P(0), ve = P(0), be = P(!1);
+  let _ = [];
+  const Ee = E(
+    () => e.value.itemSize === void 0 || e.value.itemSize === null || e.value.itemSize === 0
+  ), Pe = E(
+    () => e.value.columnWidth === void 0 || e.value.columnWidth === null || e.value.columnWidth === 0
+  ), D = E(
+    () => typeof e.value.itemSize == "number" && e.value.itemSize > 0 ? e.value.itemSize : null
+  ), fe = E(() => D.value || e.value.defaultItemSize || vt), ze = E(
+    () => [...e.value.stickyIndices || []].sort((l, t) => l - t)
+  ), p = E(() => {
+    if (L.value, !W.value && e.value.ssrRange && !U.value) {
+      const { start: l = 0, end: t = 0, colStart: u = 0, colEnd: o = 0 } = e.value.ssrRange, s = e.value.columnCount || 0;
+      if (e.value.direction === "both" && s > 0)
+        return T.query(o || s) - T.query(u);
+      if (e.value.direction === "horizontal")
+        return D.value !== null ? (t - l) * (D.value + (e.value.columnGap || 0)) : R.query(t) - R.query(l);
+    }
+    return e.value.direction === "both" && e.value.columnCount ? T.query(e.value.columnCount) : e.value.direction === "vertical" ? 0 : D.value !== null ? e.value.items.length * (D.value + (e.value.columnGap || 0)) : R.query(e.value.items.length);
+  }), oe = E(() => {
+    if (L.value, !W.value && e.value.ssrRange && !U.value) {
+      const { start: l, end: t } = e.value.ssrRange;
+      if (e.value.direction === "vertical" || e.value.direction === "both")
+        return D.value !== null ? (t - l) * (D.value + (e.value.gap || 0)) : x.query(t) - x.query(l);
+    }
+    return e.value.direction === "horizontal" ? 0 : D.value !== null ? e.value.items.length * (D.value + (e.value.gap || 0)) : x.query(e.value.items.length);
+  }), M = E(() => {
+    const t = e.value.direction === "horizontal" || e.value.direction === "both" ? we(e.value.scrollPaddingStart, e.value.direction) : 0;
+    return Math.max(0, a.value + t - N.x);
+  }), B = E(() => {
+    const t = e.value.direction === "vertical" || e.value.direction === "both" ? Se(e.value.scrollPaddingStart, e.value.direction) : 0;
+    return Math.max(0, g.value + t - N.y);
+  }), He = (l) => {
+    L.value;
+    const t = e.value.columnWidth;
+    return typeof t == "number" && t > 0 ? t : Array.isArray(t) && t.length > 0 ? t[l % t.length] || tt : typeof t == "function" ? t(l) : T.get(l) || e.value.defaultColumnWidth || tt;
+  }, ke = (l, t, u) => {
+    const o = typeof u == "object" && u !== null && "isCorrection" in u ? u.isCorrection : !1;
+    o || (Q.value = { rowIndex: l, colIndex: t, options: u });
+    const s = e.value.container || window, m = D.value, S = e.value.gap || 0, d = e.value.columnGap || 0;
+    let v, f;
+    et(u) ? (v = u.align, f = u.behavior) : v = u;
+    const y = (typeof v == "object" ? v.x : v) || "auto", b = (typeof v == "object" ? v.y : v) || "auto", w = we(e.value.scrollPaddingStart, e.value.direction), h = we(e.value.scrollPaddingEnd, e.value.direction), z = Se(e.value.scrollPaddingStart, e.value.direction), q = Se(e.value.scrollPaddingEnd, e.value.direction), X = e.value.direction === "vertical" || e.value.direction === "both", k = e.value.direction === "horizontal" || e.value.direction === "both", K = j.value - (k ? w + h : 0), ge = te.value - (X ? z + q : 0);
+    let O = M.value, I = B.value, le = 0, ue = 0;
+    if (l != null && (l >= e.value.items.length ? (I = oe.value, ue = 0) : (I = m !== null ? l * (m + S) : x.query(l), ue = m !== null ? m : x.get(l) - S), b === "start" || (b === "center" ? I -= (ge - ue) / 2 : b === "end" ? I -= ge - ue : I >= B.value && I + ue <= B.value + ge || I < B.value || (I -= ge - ue))), t != null) {
+      const V = e.value.columnCount || 0;
+      t >= V && V > 0 ? (O = p.value, le = 0) : e.value.direction === "horizontal" ? (O = m !== null ? t * (m + d) : R.query(t), le = m !== null ? m : R.get(t) - d) : (O = T.query(t), le = T.get(t)), y === "start" || (y === "center" ? O -= (K - le) / 2 : y === "end" ? O -= K - le : O >= M.value && O + le <= M.value + K || O < M.value || (O -= K - le));
+    }
+    O = Math.max(0, Math.min(O, Math.max(0, p.value - K))), I = Math.max(0, Math.min(I, Math.max(0, oe.value - ge)));
+    const F = O + N.x - (k ? w : 0), ee = I + N.y - (X ? z : 0), Y = 1;
+    let $ = t == null || Math.abs(M.value - O) < Y, re = l == null || Math.abs(B.value - I) < Y;
+    if (!$ || !re) {
+      let V = 0, Te = 0, Le = 0, De = 0, Ge = 0, Ie = 0;
+      if (typeof window < "u") {
+        if (s === window ? (V = window.scrollX, Te = window.scrollY, Le = document.documentElement.scrollWidth, De = document.documentElement.scrollHeight, Ge = window.innerWidth, Ie = window.innerHeight) : pe(s) && (V = s.scrollLeft, Te = s.scrollTop, Le = s.scrollWidth, De = s.scrollHeight, Ge = s.clientWidth, Ie = s.clientHeight), !$ && t !== null && t !== void 0) {
+          const je = V <= Y && F <= Y, Ne = V >= Le - Ge - Y && F >= Le - Ge - Y;
+          (je || Ne) && ($ = !0);
+        }
+        if (!re && l !== null && l !== void 0) {
+          const je = Te <= Y && ee <= Y, Ne = Te >= De - Ie - Y && ee >= De - Ie - Y;
+          (je || Ne) && (re = !0);
+        }
+      }
+    }
+    const Oe = o ? "auto" : f || "smooth";
+    if (ce.value = !0, typeof window < "u" && s === window)
+      window.scrollTo({
+        left: t == null ? void 0 : Math.max(0, F),
+        top: l == null ? void 0 : Math.max(0, ee),
+        behavior: Oe
+      });
+    else if (_e(s)) {
+      const V = {
+        behavior: Oe
+      };
+      t != null && (V.left = Math.max(0, F)), l != null && (V.top = Math.max(0, ee)), typeof s.scrollTo == "function" ? s.scrollTo(V) : (V.left !== void 0 && (s.scrollLeft = V.left), V.top !== void 0 && (s.scrollTop = V.top));
+    }
+    (Oe === "auto" || Oe === void 0) && (t != null && (a.value = Math.max(0, F)), l != null && (g.value = Math.max(0, ee))), $ && re && !n.value && (Q.value = null);
+  }, Xe = (l, t, u) => {
+    const o = e.value.container || window;
+    ce.value = !0;
+    const s = e.value.direction === "vertical" || e.value.direction === "both", m = e.value.direction === "horizontal" || e.value.direction === "both", S = we(e.value.scrollPaddingStart, e.value.direction), d = Se(e.value.scrollPaddingStart, e.value.direction), v = typeof window < "u" && o === window ? window.scrollX : o.scrollLeft, f = typeof window < "u" && o === window ? window.scrollY : o.scrollTop, y = l != null ? l + N.x - (m ? S : 0) : v, b = t != null ? t + N.y - (s ? d : 0) : f;
+    if (typeof window < "u" && o === window)
+      window.scrollTo({
+        left: l != null ? y : void 0,
+        top: t != null ? b : void 0,
+        behavior: u?.behavior || "auto"
+      });
+    else if (_e(o)) {
+      const w = {
+        behavior: u?.behavior || "auto"
+      };
+      l != null && (w.left = y), t != null && (w.top = b), typeof o.scrollTo == "function" ? o.scrollTo(w) : (w.left !== void 0 && (o.scrollLeft = w.left), w.top !== void 0 && (o.scrollTop = w.top));
+    }
+    (u?.behavior === "auto" || u?.behavior === void 0) && (l != null && (a.value = y), t != null && (g.value = b));
+  }, Ye = () => {
+    const l = e.value.items, t = l.length, u = e.value.columnCount || 0;
+    if (R.resize(t), x.resize(t), T.resize(u), J.length !== t) {
+      const d = new Uint8Array(t);
+      d.set(J.subarray(0, Math.min(t, J.length))), J = d;
+    }
+    if (A.length !== t) {
+      const d = new Uint8Array(t);
+      d.set(A.subarray(0, Math.min(t, A.length))), A = d;
+    }
+    if (ae.length !== u) {
+      const d = new Uint8Array(u);
+      d.set(ae.subarray(0, Math.min(u, ae.length))), ae = d;
+    }
+    let o = 0;
+    if (e.value.restoreScrollOnPrepend && _.length > 0 && t > _.length) {
+      const d = _[0];
+      if (d !== void 0) {
+        for (let v = 1; v <= t - _.length; v++)
+          if (l[v] === d) {
+            o = v;
+            break;
+          }
+      }
+    }
+    if (o > 0) {
+      R.shift(o), x.shift(o), Q.value && Q.value.rowIndex !== null && Q.value.rowIndex !== void 0 && (Q.value.rowIndex += o);
+      const d = new Uint8Array(t), v = new Uint8Array(t);
+      d.set(J.subarray(0, Math.min(t - o, J.length)), o), v.set(A.subarray(0, Math.min(t - o, A.length)), o), J = d, A = v;
+      const f = e.value.gap || 0, y = e.value.columnGap || 0;
+      let b = 0, w = 0;
+      for (let h = 0; h < o; h++) {
+        const z = typeof e.value.itemSize == "function" ? e.value.itemSize(l[h], h) : fe.value;
+        e.value.direction === "horizontal" ? b += z + y : w += z + f;
+      }
+      (b > 0 || w > 0) && Ke(() => {
+        Xe(
+          b > 0 ? M.value + b : null,
+          w > 0 ? B.value + w : null,
+          { behavior: "auto" }
+        );
+      });
+    }
+    if (u > 0) {
+      const d = e.value.columnGap || 0;
+      let v = !1;
+      for (let f = 0; f < u; f++) {
+        const y = He(f), b = T.get(f);
+        if (!Pe.value || b === 0) {
+          const w = y + d;
+          Math.abs(b - w) > 0.5 && (T.set(f, w), v = !0);
+        }
+      }
+      v && T.rebuild();
+    }
+    const s = e.value.gap || 0, m = e.value.columnGap || 0;
+    let S = !1;
+    for (let d = 0; d < t; d++) {
+      const v = e.value.items[d], f = R.get(d), y = x.get(d);
+      if (Ee.value && (f > 0 || y > 0))
+        continue;
+      const b = typeof e.value.itemSize == "function" ? e.value.itemSize(v, d) : fe.value, w = e.value.direction === "vertical", h = e.value.direction === "horizontal", z = e.value.direction === "both", q = h ? b + m : 0, X = w || z ? b + s : 0;
+      Math.abs(f - q) > 0.5 && (R.set(d, q), S = !0), Math.abs(y - X) > 0.5 && (x.set(d, X), S = !0);
+      const k = h ? b : z ? Math.max(b, j.value) : 0, K = w || z ? b : 0;
+      k > de.value && (de.value = k), K > ve.value && (ve.value = K);
+    }
+    S && (R.rebuild(), x.rebuild()), _ = [...l], be.value = !0, L.value++;
+  }, he = () => {
+    if (e.value.hostElement && typeof window < "u") {
+      const l = e.value.hostElement.getBoundingClientRect(), t = e.value.container || window;
+      let u = 0, o = 0;
+      if (t === window)
+        u = l.left + window.scrollX, o = l.top + window.scrollY;
+      else if (t === e.value.hostElement)
+        u = 0, o = 0;
+      else if (pe(t)) {
+        const s = t.getBoundingClientRect();
+        u = l.left - s.left + t.scrollLeft, o = l.top - s.top + t.scrollTop;
+      }
+      (Math.abs(N.x - u) > 0.1 || Math.abs(N.y - o) > 0.1) && (N.x = u, N.y = o);
+    }
+  };
+  ie([
+    () => e.value.items.length,
+    () => e.value.columnCount,
+    () => e.value.columnWidth,
+    () => e.value.itemSize,
+    () => e.value.gap,
+    () => e.value.columnGap
+  ], Ye, { immediate: !0 }), ie(() => [e.value.container, e.value.hostElement], () => {
+    he();
+  });
+  const Be = E(() => {
+    if (L.value, (!W.value || Z.value) && e.value.ssrRange)
+      return {
+        start: e.value.ssrRange.start,
+        end: e.value.ssrRange.end
+      };
+    const l = e.value.direction || "vertical", t = e.value.ssrRange && !n.value ? 0 : e.value.bufferBefore ?? lt, u = e.value.bufferAfter ?? lt, o = e.value.gap || 0, s = e.value.columnGap || 0, m = D.value, S = we(e.value.scrollPaddingStart, l), d = we(e.value.scrollPaddingEnd, l), v = Se(e.value.scrollPaddingStart, l), f = Se(e.value.scrollPaddingEnd, l), y = l === "vertical" || l === "both", b = l === "horizontal" || l === "both", w = j.value - (b ? S + d : 0), h = te.value - (y ? v + f : 0);
+    let z = 0, q = e.value.items.length;
+    if (y)
+      if (m !== null)
+        z = Math.floor(B.value / (m + o)), q = Math.ceil((B.value + h) / (m + o));
+      else {
+        z = x.findLowerBound(B.value);
+        let X = x.query(z), k = z;
+        for (; k < e.value.items.length && X < B.value + h; )
+          X = x.query(++k);
+        q = k;
+      }
+    else if (m !== null)
+      z = Math.floor(M.value / (m + s)), q = Math.ceil((M.value + w) / (m + s));
+    else {
+      z = R.findLowerBound(M.value);
+      let X = R.query(z), k = z;
+      for (; k < e.value.items.length && X < M.value + w; )
+        X = R.query(++k);
+      q = k;
+    }
+    return {
+      start: Math.max(0, z - t),
+      end: Math.min(e.value.items.length, q + u)
+    };
+  }), qe = E(() => {
+    L.value;
+    const l = D.value, t = e.value.gap || 0, u = e.value.columnGap || 0;
+    return e.value.direction === "horizontal" ? l !== null ? Math.floor(M.value / (l + u)) : R.findLowerBound(M.value) : l !== null ? Math.floor(B.value / (l + t)) : x.findLowerBound(B.value);
+  }), i = E(() => {
+    L.value;
+    const { start: l, end: t } = Be.value, u = [], o = D.value, s = e.value.gap || 0, m = e.value.columnGap || 0, S = ze.value, d = /* @__PURE__ */ new Set();
+    for (let h = l; h < t; h++)
+      d.add(h);
+    if (W.value || !e.value.ssrRange) {
+      const h = qe.value;
+      let z, q = 0, X = S.length - 1;
+      for (; q <= X; ) {
+        const k = q + X >>> 1;
+        S[k] < h ? (z = S[k], q = k + 1) : X = k - 1;
+      }
+      z !== void 0 && d.add(z);
+      for (const k of S)
+        k >= l && k < t && d.add(k);
+    }
+    const v = Array.from(d).sort((h, z) => h - z), f = e.value.ssrRange?.start || 0, y = e.value.ssrRange?.colStart || 0;
+    let b = 0, w = 0;
+    !W.value && e.value.ssrRange && (w = e.value.direction === "vertical" || e.value.direction === "both" ? o !== null ? f * (o + s) : x.query(f) : 0, e.value.direction === "horizontal" ? b = o !== null ? y * (o + m) : R.query(y) : e.value.direction === "both" && (b = T.query(y)));
+    for (const h of v) {
+      const z = e.value.items[h];
+      if (z === void 0)
+        continue;
+      let q = 0, X = 0, k = 0, K = 0;
+      e.value.direction === "horizontal" ? (q = o !== null ? h * (o + m) : R.query(h), k = o !== null ? o : R.get(h) - m, K = te.value) : (X = (e.value.direction === "vertical" || e.value.direction === "both") && o !== null ? h * (o + s) : x.query(h), K = o !== null ? o : x.get(h) - s, k = e.value.direction === "both" ? p.value : j.value);
+      const ge = S.includes(h), O = q, I = X;
+      let le = !1;
+      const ue = { x: 0, y: 0 };
+      if (ge) {
+        if (e.value.direction === "vertical" || e.value.direction === "both") {
+          if (B.value > I) {
+            le = !0;
+            let F, ee = 0, Y = S.length - 1;
+            for (; ee <= Y; ) {
+              const $ = ee + Y >>> 1;
+              S[$] > h ? (F = S[$], Y = $ - 1) : ee = $ + 1;
+            }
+            if (F !== void 0) {
+              const re = (o !== null ? F * (o + s) : x.query(F)) - B.value;
+              re < K && (ue.y = -(K - re));
+            }
+          }
+        } else if (e.value.direction === "horizontal" && M.value > O) {
+          le = !0;
+          let F, ee = 0, Y = S.length - 1;
+          for (; ee <= Y; ) {
+            const $ = ee + Y >>> 1;
+            S[$] > h ? (F = S[$], Y = $ - 1) : ee = $ + 1;
+          }
+          if (F !== void 0) {
+            const re = (o !== null ? F * (o + m) : R.query(F)) - M.value;
+            re < k && (ue.x = -(k - re));
+          }
+        }
+      }
+      u.push({
+        item: z,
+        index: h,
+        offset: { x: O - b, y: I - w },
+        size: { width: k, height: K },
+        originalX: O,
+        originalY: I,
+        isSticky: ge,
+        isStickyActive: le,
+        stickyOffset: ue
+      });
+    }
+    return u;
+  }), r = E(() => {
+    L.value;
+    const l = e.value.columnCount || 0;
+    if (!l)
+      return { start: 0, end: 0, padStart: 0, padEnd: 0 };
+    if ((!W.value || Z.value) && e.value.ssrRange) {
+      const { colStart: d = 0, colEnd: v = 0 } = e.value.ssrRange, f = Math.max(0, d), y = Math.min(l, v || l);
+      return {
+        start: f,
+        end: y,
+        padStart: 0,
+        padEnd: 0
+      };
+    }
+    const t = T.findLowerBound(M.value);
+    let u = T.query(t), o = t;
+    for (; o < l && u < M.value + j.value; )
+      u = T.query(++o);
+    const s = e.value.ssrRange && !n.value ? 0 : 2, m = Math.max(0, t - s), S = Math.min(l, o + s);
+    return {
+      start: m,
+      end: S,
+      padStart: T.query(m),
+      padEnd: T.query(l) - T.query(S)
+    };
+  }), c = E(() => {
+    L.value;
+    const l = D.value, t = e.value.columnGap || 0;
+    let u = 0;
+    return (e.value.direction === "horizontal" || e.value.direction === "both") && (l !== null ? u = Math.floor(M.value / (l + t)) : u = R.findLowerBound(M.value)), {
+      items: i.value,
+      currentIndex: qe.value,
+      currentColIndex: u,
+      scrollOffset: { x: M.value, y: B.value },
+      viewportSize: { width: j.value, height: te.value },
+      totalSize: { width: p.value, height: oe.value },
+      isScrolling: n.value,
+      isProgrammaticScroll: ce.value,
+      range: Be.value,
+      columnRange: r.value
+    };
+  }), C = () => {
+    ce.value = !1, Q.value = null;
+  }, G = (l) => {
+    const t = l.target;
+    typeof window > "u" || (t === window || t === document ? (a.value = window.scrollX, g.value = window.scrollY) : _e(t) && (a.value = t.scrollLeft, g.value = t.scrollTop), n.value || (ce.value || (Q.value = null), n.value = !0), clearTimeout(ne), ne = setTimeout(() => {
+      n.value = !1, ce.value = !1;
+    }, 250));
+  }, H = (l) => {
+    let t = !1;
+    const u = e.value.gap || 0, o = e.value.columnGap || 0;
+    for (const { index: s, inlineSize: m, blockSize: S, element: d } of l) {
+      if (Ee.value) {
+        if (m > de.value && (de.value = m), S > ve.value && (ve.value = S), e.value.direction === "horizontal") {
+          const v = R.get(s), f = m + o;
+          Math.abs(v - f) > 0.5 && (f > v || !J[s]) && (R.update(s, f - v), J[s] = 1, t = !0);
+        }
+        if (e.value.direction === "vertical" || e.value.direction === "both") {
+          const v = x.get(s), f = S + u;
+          e.value.direction === "both" ? (f > v || !A[s]) && (x.update(s, f - v), A[s] = 1, t = !0) : Math.abs(v - f) > 0.5 && (f > v || !A[s]) && (x.update(s, f - v), A[s] = 1, t = !0);
+        }
+      }
+      if (e.value.direction === "both" && d && e.value.columnCount && Pe.value) {
+        const v = d.dataset.colIndex !== void 0 ? [d] : Array.from(d.querySelectorAll("[data-col-index]"));
+        for (const f of v) {
+          const y = Number.parseInt(f.dataset.colIndex, 10);
+          if (y >= 0 && y < (e.value.columnCount || 0)) {
+            const b = f.offsetWidth, w = T.get(y), h = b + o;
+            (h > w || !ae[y]) && (T.update(y, h - w), ae[y] = 1, t = !0);
+          }
+        }
+      }
+    }
+    t && L.value++;
+  }, me = (l, t, u, o) => {
+    H([{ index: l, inlineSize: t, blockSize: u, element: o }]);
+  }, Re = () => {
+    if (Q.value && !Z.value) {
+      const { rowIndex: l, colIndex: t, options: u } = Q.value, o = et(u) ? { ...u, isCorrection: !0 } : { align: u, isCorrection: !0 };
+      ke(l, t, o);
+    }
+  };
+  ie(L, Re), ie(n, (l) => {
+    l || Re();
+  });
+  let Fe = null;
+  const at = (l) => {
+    if (!l || typeof window > "u")
+      return;
+    const t = l === window ? document : l;
+    if (t.addEventListener("scroll", G, { passive: !0 }), l === window) {
+      j.value = window.innerWidth, te.value = window.innerHeight, a.value = window.scrollX, g.value = window.scrollY;
+      const u = () => {
+        j.value = window.innerWidth, te.value = window.innerHeight, he();
+      };
+      return window.addEventListener("resize", u), () => {
+        t.removeEventListener("scroll", G), window.removeEventListener("resize", u);
+      };
+    } else
+      return j.value = l.clientWidth, te.value = l.clientHeight, a.value = l.scrollLeft, g.value = l.scrollTop, Fe = new ResizeObserver((u) => {
+        for (const o of u)
+          o.target === l && (j.value = l.clientWidth, te.value = l.clientHeight, he());
+      }), Fe.observe(l), () => {
+        t.removeEventListener("scroll", G), Fe?.disconnect();
+      };
+  };
+  let Ue;
+  return ut() && (it(() => {
+    U.value = !0, ie(() => e.value.container, (l) => {
+      Ue?.(), Ue = at(l || null);
+    }, { immediate: !0 }), he(), e.value.ssrRange || e.value.initialScrollIndex !== void 0 ? Ke(() => {
+      he();
+      const l = e.value.initialScrollIndex !== void 0 ? e.value.initialScrollIndex : e.value.ssrRange?.start, t = e.value.initialScrollAlign || "start";
+      l != null && ke(l, e.value.ssrRange?.colStart, { align: t, behavior: "auto" }), W.value = !0, Z.value = !0, Ke(() => {
+        Z.value = !1;
+      });
+    }) : W.value = !0;
+  }), nt(() => {
+    Ue?.();
+  })), {
+    /**
+     * Array of items to be rendered with their calculated offsets and sizes.
+     */
+    renderedItems: i,
+    /**
+     * Total calculated width of all items including gaps.
+     */
+    totalWidth: p,
+    /**
+     * Total calculated height of all items including gaps.
+     */
+    totalHeight: oe,
+    /**
+     * Detailed information about the current scroll state.
+     * Includes currentIndex, scrollOffset, viewportSize, totalSize, and isScrolling.
+     */
+    scrollDetails: c,
+    /**
+     * Programmatically scroll to a specific row and/or column.
+     * @param rowIndex - The row index to scroll to
+     * @param colIndex - The column index to scroll to
+     * @param options - Alignment and behavior options
+     */
+    scrollToIndex: ke,
+    /**
+     * Programmatically scroll to a specific pixel offset.
+     * @param x - The pixel offset to scroll to on the X axis
+     * @param y - The pixel offset to scroll to on the Y axis
+     * @param options - Behavior options
+     */
+    scrollToOffset: Xe,
+    /**
+     * Stops any currently active programmatic scroll and clears pending corrections.
+     */
+    stopProgrammaticScroll: C,
+    /**
+     * Updates the stored size of an item. Should be called when an item is measured (e.g., via ResizeObserver).
+     * @param index - The item index
+     * @param width - The measured width
+     * @param height - The measured height
+     * @param element - The measured element (optional, used for grid column detection)
+     */
+    updateItemSize: me,
+    /**
+     * Updates the stored size of multiple items. Should be called when items are measured (e.g., via ResizeObserver).
+     * @param updates - Array of item updates
+     */
+    updateItemSizes: H,
+    /**
+     * Recalculates the host element's offset relative to the scroll container.
+     */
+    updateHostOffset: he,
+    /**
+     * Information about the current visible range of columns.
+     */
+    columnRange: r,
+    /**
+     * Helper to get the width of a specific column based on current configuration.
+     * @param index - The column index
+     */
+    getColumnWidth: He,
+    /**
+     * Resets all dynamic measurements and re-initializes from props.
+     */
+    refresh: () => {
+      R.resize(0), x.resize(0), T.resize(0), ae.fill(0), J.fill(0), A.fill(0), de.value = 0, ve.value = 0, Ye();
+    },
+    /**
+     * Whether the component has finished its first client-side mount and hydration.
+     */
+    isHydrated: W
+  };
+}
+const ht = {
+  key: 0,
+  class: "virtual-scroll-debug-info"
+}, gt = /* @__PURE__ */ rt({
+  __name: "VirtualScroll",
+  props: {
+    items: {},
+    itemSize: {},
+    direction: { default: "vertical" },
+    bufferBefore: { default: 5 },
+    bufferAfter: { default: 5 },
+    container: {},
+    ssrRange: {},
+    columnCount: { default: 0 },
+    columnWidth: {},
+    containerTag: { default: "div" },
+    wrapperTag: { default: "div" },
+    itemTag: { default: "div" },
+    scrollPaddingStart: { default: 0 },
+    scrollPaddingEnd: { default: 0 },
+    stickyHeader: { type: Boolean, default: !1 },
+    stickyFooter: { type: Boolean, default: !1 },
+    gap: { default: 0 },
+    columnGap: { default: 0 },
+    stickyIndices: { default: () => [] },
+    loadDistance: { default: 50 },
+    loading: { type: Boolean, default: !1 },
+    restoreScrollOnPrepend: { type: Boolean, default: !1 },
+    initialScrollIndex: {},
+    initialScrollAlign: {},
+    defaultItemSize: {},
+    defaultColumnWidth: {},
+    debug: { type: Boolean, default: !1 }
+  },
+  emits: ["scroll", "load", "visibleRangeChange"],
+  setup(e, { expose: a, emit: g }) {
+    const n = e, W = g, Z = E(() => n.debug), U = P(null), j = P(null), te = P(null), N = P(null), ne = /* @__PURE__ */ new Map(), ce = P(0), R = P(0), x = E(() => {
+      const i = n.container === void 0 ? U.value : n.container;
+      return i === U.value || typeof window < "u" && (i === window || i === null);
+    }), T = E(() => {
+      const i = n.scrollPaddingStart, r = n.scrollPaddingEnd, c = typeof i == "object" ? i.x || 0 : n.direction === "horizontal" && i || 0, C = typeof i == "object" ? i.y || 0 : n.direction !== "horizontal" && i || 0, G = typeof r == "object" ? r.x || 0 : n.direction === "horizontal" && r || 0, H = typeof r == "object" ? r.y || 0 : n.direction !== "horizontal" && r || 0;
+      return {
+        items: n.items,
+        itemSize: n.itemSize,
+        direction: n.direction,
+        bufferBefore: n.bufferBefore,
+        bufferAfter: n.bufferAfter,
+        container: n.container === void 0 ? U.value : n.container,
+        hostElement: j.value,
+        ssrRange: n.ssrRange,
+        columnCount: n.columnCount,
+        columnWidth: n.columnWidth,
+        scrollPaddingStart: {
+          x: c,
+          y: C + (n.stickyHeader && x.value ? ce.value : 0)
+        },
+        scrollPaddingEnd: {
+          x: G,
+          y: H + (n.stickyFooter && x.value ? R.value : 0)
+        },
+        gap: n.gap,
+        columnGap: n.columnGap,
+        stickyIndices: n.stickyIndices,
+        loadDistance: n.loadDistance,
+        loading: n.loading,
+        restoreScrollOnPrepend: n.restoreScrollOnPrepend,
+        initialScrollIndex: n.initialScrollIndex,
+        initialScrollAlign: n.initialScrollAlign,
+        defaultItemSize: n.defaultItemSize,
+        defaultColumnWidth: n.defaultColumnWidth,
+        debug: Z.value
+      };
+    }), {
+      isHydrated: L,
+      columnRange: ae,
+      renderedItems: J,
+      scrollDetails: A,
+      totalHeight: Q,
+      totalWidth: de,
+      getColumnWidth: ve,
+      scrollToIndex: be,
+      scrollToOffset: _,
+      updateHostOffset: Ee,
+      updateItemSizes: Pe,
+      refresh: D,
+      stopProgrammaticScroll: fe
+    } = ft(T);
+    ie(A, (i, r) => {
+      L.value && (W("scroll", i), (!r || i.range.start !== r.range.start || i.range.end !== r.range.end || i.columnRange.start !== r.columnRange.start || i.columnRange.end !== r.columnRange.end) && W("visibleRangeChange", {
+        start: i.range.start,
+        end: i.range.end,
+        colStart: i.columnRange.start,
+        colEnd: i.columnRange.end
+      }), !n.loading && (n.direction !== "horizontal" && i.totalSize.height - (i.scrollOffset.y + i.viewportSize.height) <= n.loadDistance && W("load", "vertical"), n.direction !== "vertical" && i.totalSize.width - (i.scrollOffset.x + i.viewportSize.width) <= n.loadDistance && W("load", "horizontal")));
+    }), ie(L, (i) => {
+      i && W("visibleRangeChange", {
+        start: A.value.range.start,
+        end: A.value.range.end,
+        colStart: A.value.columnRange.start,
+        colEnd: A.value.columnRange.end
+      });
+    }, { once: !0 });
+    const ze = typeof window > "u" ? null : new ResizeObserver(Ee), p = typeof window > "u" ? null : new ResizeObserver((i) => {
+      const r = [];
+      for (const c of i) {
+        const C = c.target, G = Number(C.dataset.index);
+        if (C.dataset.colIndex !== void 0)
+          r.push({ index: -1, inlineSize: 0, blockSize: 0, element: C });
+        else if (!Number.isNaN(G)) {
+          let me = c.contentRect.width, Re = c.contentRect.height;
+          c.borderBoxSize && c.borderBoxSize.length > 0 ? (me = c.borderBoxSize[0].inlineSize, Re = c.borderBoxSize[0].blockSize) : (me = C.offsetWidth, Re = C.offsetHeight), r.push({ index: G, inlineSize: me, blockSize: Re, element: C });
+        }
+      }
+      r.length > 0 && Pe(r);
+    }), oe = typeof window > "u" ? null : new ResizeObserver(() => {
+      ce.value = te.value?.offsetHeight || 0, R.value = N.value?.offsetHeight || 0, Ee();
+    });
+    ie(te, (i, r) => {
+      r && oe?.unobserve(r), i && oe?.observe(i);
+    }, { immediate: !0 }), ie(N, (i, r) => {
+      r && oe?.unobserve(r), i && oe?.observe(i);
+    }, { immediate: !0 });
+    const M = E(() => J.value[0]?.index);
+    ie(M, (i, r) => {
+      if (n.direction === "both") {
+        if (r !== void 0) {
+          const c = ne.get(r);
+          c && c.querySelectorAll("[data-col-index]").forEach((C) => p?.unobserve(C));
+        }
+        if (i !== void 0) {
+          const c = ne.get(i);
+          c && c.querySelectorAll("[data-col-index]").forEach((C) => p?.observe(C));
+        }
+      }
+    }, { flush: "post" }), it(() => {
+      U.value && ze?.observe(U.value);
+      for (const i of ne.values())
+        p?.observe(i);
+      if (M.value !== void 0) {
+        const i = ne.get(M.value);
+        i && i.querySelectorAll("[data-col-index]").forEach((r) => p?.observe(r));
+      }
+    }), ie([U, j], ([i], [r]) => {
+      r && ze?.unobserve(r), i && ze?.observe(i);
+    });
+    function B(i, r) {
+      if (i)
+        ne.set(r, i), p?.observe(i);
+      else {
+        const c = ne.get(r);
+        c && (p?.unobserve(c), ne.delete(r));
+      }
+    }
+    function He(i) {
+      fe();
+      const { viewportSize: r, scrollOffset: c } = A.value, C = n.direction !== "vertical", G = n.direction !== "horizontal";
+      if (i.key === "Home") {
+        i.preventDefault(), be(0, 0, "start");
+        return;
+      }
+      if (i.key === "End") {
+        i.preventDefault();
+        const H = n.items.length - 1, me = (n.columnCount || 0) > 0 ? n.columnCount - 1 : 0;
+        C && G ? be(H, me, "end") : be(0, H, "end");
+        return;
+      }
+      if (i.key === "ArrowUp") {
+        i.preventDefault(), _(null, c.y - 40);
+        return;
+      }
+      if (i.key === "ArrowDown") {
+        i.preventDefault(), _(null, c.y + 40);
+        return;
+      }
+      if (i.key === "ArrowLeft") {
+        i.preventDefault(), _(c.x - 40, null);
+        return;
+      }
+      if (i.key === "ArrowRight") {
+        i.preventDefault(), _(c.x + 40, null);
+        return;
+      }
+      if (i.key === "PageUp") {
+        i.preventDefault(), _(
+          C ? c.x - r.width : null,
+          G ? c.y - r.height : null
+        );
+        return;
+      }
+      i.key === "PageDown" && (i.preventDefault(), _(
+        C ? c.x + r.width : null,
+        G ? c.y + r.height : null
+      ));
+    }
+    nt(() => {
+      ze?.disconnect(), p?.disconnect(), oe?.disconnect();
+    });
+    const ke = E(() => {
+      const i = n.container;
+      return i === null || typeof window < "u" && i === window ? !0 : i && typeof i == "object" && "tagName" in i ? i.tagName === "BODY" : !1;
+    }), Xe = E(() => ke.value ? {
+      ...n.direction !== "vertical" ? { whiteSpace: "nowrap" } : {}
+    } : n.containerTag === "table" ? {
+      minInlineSize: n.direction === "vertical" ? "100%" : "auto"
+    } : {
+      ...n.direction !== "vertical" ? { whiteSpace: "nowrap" } : {}
+    }), Ye = E(() => ({
+      inlineSize: n.direction === "vertical" ? "100%" : `${de.value}px`,
+      blockSize: n.direction === "horizontal" ? "100%" : `${Q.value}px`
+    })), he = E(() => {
+      const i = n.direction === "horizontal";
+      return {
+        display: i ? "inline-block" : "block",
+        ...i ? { blockSize: "100%", verticalAlign: "top" } : { inlineSize: "100%" }
+      };
+    }), Be = E(() => ({
+      inlineSize: n.direction === "vertical" ? "1px" : `${de.value}px`,
+      blockSize: n.direction === "horizontal" ? "1px" : `${Q.value}px`
+    }));
+    function qe(i) {
+      const r = n.direction === "vertical", c = n.direction === "horizontal", C = n.direction === "both", G = n.itemSize === void 0 || n.itemSize === null || n.itemSize === 0, H = {
+        blockSize: c ? "100%" : G ? "auto" : `${i.size.height}px`
+      };
+      return r && n.containerTag === "table" ? H.minInlineSize = "100%" : H.inlineSize = r ? "100%" : G ? "auto" : `${i.size.width}px`, G && (r || (H.minInlineSize = `${i.size.width}px`), c || (H.minBlockSize = `${i.size.height}px`)), L.value && (i.isStickyActive ? ((r || C) && (H.insetBlockStart = `${Se(n.scrollPaddingStart, n.direction)}px`), (c || C) && (H.insetInlineStart = `${we(n.scrollPaddingStart, n.direction)}px`), H.transform = `translate(${i.stickyOffset.x}px, ${i.stickyOffset.y}px)`) : H.transform = `translate(${i.offset.x}px, ${i.offset.y}px)`), H;
+    }
+    return a({
+      scrollDetails: A,
+      columnRange: ae,
+      getColumnWidth: ve,
+      scrollToIndex: be,
+      scrollToOffset: _,
+      refresh: D,
+      stopProgrammaticScroll: fe
+    }), (i, r) => (se(), xe(Me(e.containerTag), {
+      ref_key: "hostRef",
+      ref: U,
+      class: $e(["virtual-scroll-container", [
+        `virtual-scroll--${e.direction}`,
+        {
+          "virtual-scroll--hydrated": ye(L),
+          "virtual-scroll--window": ke.value,
+          "virtual-scroll--table": e.containerTag === "table"
+        }
+      ]]),
+      style: We(Xe.value),
+      tabindex: "0",
+      onKeydown: He,
+      onWheelPassive: ye(fe),
+      onPointerdownPassive: ye(fe),
+      onTouchstartPassive: ye(fe)
+    }, {
+      default: Ce(() => [
+        i.$slots.header ? (se(), xe(Me(e.containerTag === "table" ? "thead" : "div"), {
+          key: 0,
+          ref_key: "headerRef",
+          ref: te,
+          class: $e(["virtual-scroll-header", { "virtual-scroll--sticky": e.stickyHeader }])
+        }, {
+          default: Ce(() => [
+            Ve(i.$slots, "header", {}, void 0, !0)
+          ]),
+          _: 3
+        }, 8, ["class"])) : Ae("", !0),
+        (se(), xe(Me(e.wrapperTag), {
+          ref_key: "wrapperRef",
+          ref: j,
+          class: "virtual-scroll-wrapper",
+          style: We(Ye.value)
+        }, {
+          default: Ce(() => [
+            e.containerTag === "table" ? (se(), xe(Me(e.itemTag), {
+              key: 0,
+              class: "virtual-scroll-spacer",
+              style: We(Be.value)
+            }, {
+              default: Ce(() => [...r[0] || (r[0] = [
+                ct("td", { style: { padding: "0", border: "none", "block-size": "inherit" } }, null, -1)
+              ])]),
+              _: 1
+            }, 8, ["style"])) : Ae("", !0),
+            (se(!0), Ze(st, null, dt(ye(J), (c) => (se(), xe(Me(e.itemTag), {
+              key: c.index,
+              ref_for: !0,
+              ref: (C) => B(C, c.index),
+              "data-index": c.index,
+              class: $e(["virtual-scroll-item", {
+                "virtual-scroll--sticky": c.isStickyActive,
+                "virtual-scroll--debug": Z.value
+              }]),
+              style: We(qe(c))
+            }, {
+              default: Ce(() => [
+                Ve(i.$slots, "item", {
+                  item: c.item,
+                  index: c.index,
+                  columnRange: ye(ae),
+                  getColumnWidth: ye(ve),
+                  isSticky: c.isSticky,
+                  isStickyActive: c.isStickyActive
+                }, void 0, !0),
+                Z.value ? (se(), Ze("div", ht, " #" + Je(c.index) + " (" + Je(Math.round(c.offset.x)) + ", " + Je(Math.round(c.offset.y)) + ") ", 1)) : Ae("", !0)
+              ]),
+              _: 2
+            }, 1032, ["data-index", "class", "style"]))), 128))
+          ]),
+          _: 3
+        }, 8, ["style"])),
+        e.loading && i.$slots.loading ? (se(), Ze("div", {
+          key: 1,
+          class: "virtual-scroll-loading",
+          style: We(he.value)
+        }, [
+          Ve(i.$slots, "loading", {}, void 0, !0)
+        ], 4)) : Ae("", !0),
+        i.$slots.footer ? (se(), xe(Me(e.containerTag === "table" ? "tfoot" : "div"), {
+          key: 2,
+          ref_key: "footerRef",
+          ref: N,
+          class: $e(["virtual-scroll-footer", { "virtual-scroll--sticky": e.stickyFooter }])
+        }, {
+          default: Ce(() => [
+            Ve(i.$slots, "footer", {}, void 0, !0)
+          ]),
+          _: 3
+        }, 8, ["class"])) : Ae("", !0)
+      ]),
+      _: 3
+    }, 40, ["class", "style", "onWheelPassive", "onPointerdownPassive", "onTouchstartPassive"]));
+  }
+}), mt = (e, a) => {
+  const g = e.__vccOpts || e;
+  for (const [n, W] of a)
+    g[n] = W;
+  return g;
+}, St = /* @__PURE__ */ mt(gt, [["__scopeId", "data-v-654a1d54"]]);
+export {
+  lt as DEFAULT_BUFFER,
+  tt as DEFAULT_COLUMN_WIDTH,
+  vt as DEFAULT_ITEM_SIZE,
+  Qe as FenwickTree,
+  St as VirtualScroll,
+  we as getPaddingX,
+  Se as getPaddingY,
+  pe as isElement,
+  et as isScrollToIndexOptions,
+  _e as isScrollableElement,
+  ft as useVirtualScroll
+};
+//# sourceMappingURL=index.js.map