react-window 2.0.0-alpha.0 → 2.0.0-alpha.2

package/dist/react-window.js

@@ -1,812 +1,582 @@
-import Ee, { useLayoutEffect as ce, useEffect as Q, useMemo as y, useState as K, useSyncExternalStore as ge, memo as ae, useImperativeHandle as ue, createElement as fe, useRef as he } from "react";
-var G = { exports: {} }, D = {};
-/**
- * @license React
- * react-jsx-runtime.production.js
- *
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-var re;
-function xe() {
-  if (re) return D;
-  re = 1;
-  var i = Symbol.for("react.transitional.element"), t = Symbol.for("react.fragment");
-  function n(o, r, s) {
-    var c = null;
-    if (s !== void 0 && (c = "" + s), r.key !== void 0 && (c = "" + r.key), "key" in r) {
-      s = {};
-      for (var a in r)
-        a !== "key" && (s[a] = r[a]);
-    } else s = r;
-    return r = s.ref, {
-      $$typeof: i,
-      type: o,
-      key: c,
-      ref: r !== void 0 ? r : null,
-      props: s
-    };
-  }
-  return D.Fragment = t, D.jsx = n, D.jsxs = n, D;
-}
-var U = {};
-/**
- * @license React
- * react-jsx-runtime.development.js
- *
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-var se;
-function Te() {
-  return se || (se = 1, process.env.NODE_ENV !== "production" && function() {
-    function i(e) {
-      if (e == null) return null;
-      if (typeof e == "function")
-        return e.$$typeof === C ? null : e.displayName || e.name || null;
-      if (typeof e == "string") return e;
-      switch (e) {
-        case T:
-          return "Fragment";
-        case b:
-          return "Profiler";
-        case S:
-          return "StrictMode";
-        case I:
-          return "Suspense";
-        case f:
-          return "SuspenseList";
-        case Y:
-          return "Activity";
-      }
-      if (typeof e == "object")
-        switch (typeof e.tag == "number" && console.error(
-          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
-        ), e.$$typeof) {
-          case w:
-            return "Portal";
-          case P:
-            return (e.displayName || "Context") + ".Provider";
-          case A:
-            return (e._context.displayName || "Context") + ".Consumer";
-          case W:
-            var l = e.render;
-            return e = e.displayName, e || (e = l.displayName || l.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
-          case v:
-            return l = e.displayName || null, l !== null ? l : i(e.type) || "Memo";
-          case $:
-            l = e._payload, e = e._init;
-            try {
-              return i(e(l));
-            } catch {
-            }
-        }
-      return null;
-    }
-    function t(e) {
-      return "" + e;
-    }
-    function n(e) {
-      try {
-        t(e);
-        var l = !1;
-      } catch {
-        l = !0;
-      }
-      if (l) {
-        l = console;
-        var u = l.error, h = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
-        return u.call(
-          l,
-          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
-          h
-        ), t(e);
-      }
-    }
-    function o(e) {
-      if (e === T) return "<>";
-      if (typeof e == "object" && e !== null && e.$$typeof === $)
-        return "<...>";
-      try {
-        var l = i(e);
-        return l ? "<" + l + ">" : "<...>";
-      } catch {
-        return "<...>";
-      }
-    }
-    function r() {
-      var e = N.A;
-      return e === null ? null : e.getOwner();
-    }
-    function s() {
-      return Error("react-stack-top-frame");
-    }
-    function c(e) {
-      if (V.call(e, "key")) {
-        var l = Object.getOwnPropertyDescriptor(e, "key").get;
-        if (l && l.isReactWarning) return !1;
-      }
-      return e.key !== void 0;
-    }
-    function a(e, l) {
-      function u() {
-        _ || (_ = !0, console.error(
-          "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
-          l
-        ));
-      }
-      u.isReactWarning = !0, Object.defineProperty(e, "key", {
-        get: u,
-        configurable: !0
-      });
-    }
-    function g() {
-      var e = i(this.type);
-      return j[e] || (j[e] = !0, console.error(
-        "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
-      )), e = this.props.ref, e !== void 0 ? e : null;
-    }
-    function R(e, l, u, h, M, z, H, J) {
-      return u = z.ref, e = {
-        $$typeof: O,
-        type: e,
-        key: l,
-        props: z,
-        _owner: M
-      }, (u !== void 0 ? u : null) !== null ? Object.defineProperty(e, "ref", {
-        enumerable: !1,
-        get: g
-      }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
-        configurable: !1,
-        enumerable: !1,
-        writable: !0,
-        value: 0
-      }), Object.defineProperty(e, "_debugInfo", {
-        configurable: !1,
-        enumerable: !1,
-        writable: !0,
-        value: null
-      }), Object.defineProperty(e, "_debugStack", {
-        configurable: !1,
-        enumerable: !1,
-        writable: !0,
-        value: H
-      }), Object.defineProperty(e, "_debugTask", {
-        configurable: !1,
-        enumerable: !1,
-        writable: !0,
-        value: J
-      }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
-    }
-    function k(e, l, u, h, M, z, H, J) {
-      var d = l.children;
-      if (d !== void 0)
-        if (h)
-          if (p(d)) {
-            for (h = 0; h < d.length; h++)
-              m(d[h]);
-            Object.freeze && Object.freeze(d);
-          } else
-            console.error(
-              "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
-            );
-        else m(d);
-      if (V.call(l, "key")) {
-        d = i(e);
-        var L = Object.keys(l).filter(function(pe) {
-          return pe !== "key";
-        });
-        h = 0 < L.length ? "{key: someKey, " + L.join(": ..., ") + ": ...}" : "{key: someKey}", te[d + h] || (L = 0 < L.length ? "{" + L.join(": ..., ") + ": ...}" : "{}", console.error(
-          `A props object containing a "key" prop is being spread into JSX:
-  let props = %s;
-  <%s {...props} />
-React keys must be passed directly to JSX without using spread:
-  let props = %s;
-  <%s key={someKey} {...props} />`,
-          h,
-          d,
-          L,
-          d
-        ), te[d + h] = !0);
-      }
-      if (d = null, u !== void 0 && (n(u), d = "" + u), c(l) && (n(l.key), d = "" + l.key), "key" in l) {
-        u = {};
-        for (var X in l)
-          X !== "key" && (u[X] = l[X]);
-      } else u = l;
-      return d && a(
-        u,
-        typeof e == "function" ? e.displayName || e.name || "Unknown" : e
-      ), R(
-        e,
-        d,
-        z,
-        M,
-        r(),
-        u,
-        H,
-        J
-      );
-    }
-    function m(e) {
-      typeof e == "object" && e !== null && e.$$typeof === O && e._store && (e._store.validated = 1);
-    }
-    var x = Ee, O = Symbol.for("react.transitional.element"), w = Symbol.for("react.portal"), T = Symbol.for("react.fragment"), S = Symbol.for("react.strict_mode"), b = Symbol.for("react.profiler"), A = Symbol.for("react.consumer"), P = Symbol.for("react.context"), W = Symbol.for("react.forward_ref"), I = Symbol.for("react.suspense"), f = Symbol.for("react.suspense_list"), v = Symbol.for("react.memo"), $ = Symbol.for("react.lazy"), Y = Symbol.for("react.activity"), C = Symbol.for("react.client.reference"), N = x.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, V = Object.prototype.hasOwnProperty, p = Array.isArray, E = console.createTask ? console.createTask : function() {
-      return null;
-    };
-    x = {
-      "react-stack-bottom-frame": function(e) {
-        return e();
-      }
-    };
-    var _, j = {}, F = x["react-stack-bottom-frame"].bind(
-      x,
-      s
-    )(), ee = E(o(s)), te = {};
-    U.Fragment = T, U.jsx = function(e, l, u, h, M) {
-      var z = 1e4 > N.recentlyCreatedOwnerStacks++;
-      return k(
-        e,
-        l,
-        u,
-        !1,
-        h,
-        M,
-        z ? Error("react-stack-top-frame") : F,
-        z ? E(o(e)) : ee
-      );
-    }, U.jsxs = function(e, l, u, h, M) {
-      var z = 1e4 > N.recentlyCreatedOwnerStacks++;
-      return k(
-        e,
-        l,
-        u,
-        !0,
-        h,
-        M,
-        z ? Error("react-stack-top-frame") : F,
-        z ? E(o(e)) : ee
-      );
-    };
-  }()), U;
-}
-var ne;
-function we() {
-  return ne || (ne = 1, process.env.NODE_ENV === "production" ? G.exports = xe() : G.exports = Te()), G.exports;
-}
-var q = we();
-function oe(i) {
-  if (i !== void 0)
-    switch (typeof i) {
+import { jsx as j } from "react/jsx-runtime";
+import { useLayoutEffect as J, useEffect as P, useMemo as M, useState as $, useCallback as R, memo as V, useImperativeHandle as U, createElement as F, useRef as Y } from "react";
+const q = typeof window < "u" ? J : P;
+function W(t) {
+  if (t !== void 0)
+    switch (typeof t) {
       case "number":
-        return i;
+        return t;
       case "string": {
-        if (i.endsWith("px"))
-          return parseFloat(i);
+        if (t.endsWith("px"))
+          return parseFloat(t);
         break;
       }
     }
 }
-const Re = typeof window < "u" ? ce : Q;
-function de({
-  box: i,
-  defaultHeight: t,
-  defaultWidth: n,
-  disabled: o,
-  element: r,
-  mode: s,
-  style: c
+function K({
+  box: t,
+  defaultHeight: r,
+  defaultWidth: l,
+  disabled: s,
+  element: e,
+  mode: i,
+  style: n
 }) {
-  const { styleHeight: a, styleWidth: g } = y(
+  const { styleHeight: c, styleWidth: o } = M(
     () => ({
-      styleHeight: oe(c?.height),
-      styleWidth: oe(c?.width)
+      styleHeight: W(n?.height),
+      styleWidth: W(n?.width)
     }),
-    [c?.height, c?.width]
-  ), [R, k] = K({
-    height: t,
-    width: n
-  }), m = o || s === "only-height" && a !== void 0 || s === "only-width" && g !== void 0 || a !== void 0 && g !== void 0;
-  return Re(() => {
-    if (r === null || m)
+    [n?.height, n?.width]
+  ), [f, p] = $({
+    height: r,
+    width: l
+  }), I = s || i === "only-height" && c !== void 0 || i === "only-width" && o !== void 0 || c !== void 0 && o !== void 0;
+  return q(() => {
+    if (e === null || I)
       return;
-    const x = new ResizeObserver((O) => {
-      for (const w of O) {
-        const { contentRect: T, target: S } = w;
-        r === S && k((b) => b.height === T.height && b.width === T.width ? b : {
-          height: T.height,
-          width: T.width
+    const b = new ResizeObserver((y) => {
+      for (const w of y) {
+        const { contentRect: d, target: x } = w;
+        e === x && p((z) => z.height === d.height && z.width === d.width ? z : {
+          height: d.height,
+          width: d.width
         });
       }
     });
-    return x.observe(r, { box: i }), () => {
-      x?.unobserve(r);
+    return b.observe(e, { box: t }), () => {
+      b?.unobserve(e);
     };
-  }, [i, m, r, a, g]), y(
+  }, [t, I, e, c, o]), M(
     () => ({
-      height: a ?? R.height,
-      width: g ?? R.width
+      height: c ?? f.height,
+      width: o ?? f.width
     }),
-    [R, a, g]
+    [f, c, o]
   );
 }
-function me(i) {
-  return y(() => i, Object.values(i));
+function E(t, r = "Assertion error") {
+  if (!t)
+    throw console.error(r), Error(r);
 }
-function B(i, t = "Assertion error") {
-  if (!i)
-    throw console.error(t), Error(t);
+function Q({
+  cachedBounds: t,
+  itemCount: r,
+  itemSize: l
+}) {
+  if (typeof l == "number")
+    return r * l;
+  if (t.size > 0) {
+    const s = t.get(t.size - 1);
+    E(s !== void 0, "Unexpected bounds cache miss");
+    const e = (s.scrollOffset + s.size) / t.size;
+    return r * e;
+  } else
+    return 0;
 }
-class Oe {
-  #e;
-  #l;
-  #s;
-  #c;
-  #o;
-  #r;
-  #u;
-  #t = 0;
-  #n = 0;
-  #i = 0;
-  #a = -1;
-  constructor({
-    count: t,
-    defaultSize: n,
-    direction: o,
-    element: r,
-    itemSize: s,
-    overscanCount: c
-  }) {
-    B(r), this.#e = /* @__PURE__ */ new Map(), this.#l = /* @__PURE__ */ new Set(), this.#s = t, this.#c = o, this.#o = r, this.#r = s, this.#u = c, this.#n = n ?? 0, this.#o.addEventListener("scroll", this.#h);
-  }
-  getEstimatedHeight() {
-    if (typeof this.#r == "number")
-      return this.#s * this.#r;
-    if (this.#e.size > 0) {
-      const t = this.#e.get(this.#e.size - 1);
-      B(t !== void 0, "Unexpected bounds cache miss");
-      const n = (t.scrollOffset + t.size) / this.#e.size;
-      return this.#s * n;
-    } else
-      return 0;
-  }
-  getIndices() {
-    return this.#i < 0 ? [0, -1] : [this.#i, this.#a];
-  }
-  getItemBounds(t) {
-    if (typeof this.#r == "number")
-      return {
-        scrollOffset: t * this.#r,
-        size: this.#r
-      };
-    for (; this.#e.size - 1 < t; ) {
-      const o = this.#e.size, r = typeof this.#r == "number" ? this.#r : this.#r(o);
-      if (o === 0)
-        this.#e.set(o, {
-          size: r,
-          scrollOffset: 0
-        });
-      else {
-        const s = this.#e.get(o - 1);
-        B(
-          s !== void 0,
-          `Unexpected bounds cache miss for index ${t}`
-        ), this.#e.set(o, {
-          scrollOffset: s.scrollOffset + s.size,
-          size: r
-        });
-      }
+function X({
+  align: t,
+  cachedBounds: r,
+  index: l,
+  itemCount: s,
+  containerScrollOffset: e,
+  containerSize: i
+}) {
+  const n = r.get(s - 1).scrollOffset, c = n + n - i, o = Math.max(
+    0,
+    r.get(l + 1).scrollOffset - i
+  ), f = Math.min(
+    n,
+    r.get(l).scrollOffset
+  );
+  switch (t === "smart" && (e >= o && e <= f ? t = "auto" : t = "center"), t) {
+    case "start":
+      return Math.min(c, f);
+    case "end":
+      return o;
+    case "center": {
+      const p = Math.round(
+        o + (f - o) / 2
+      );
+      return p < Math.ceil(i / 2) ? 0 : p > c ? c : p;
     }
-    const n = this.#e.get(t);
-    return B(
-      n !== void 0,
-      `Unexpected bounds cache miss for index ${t}`
-    ), n;
-  }
-  resize(t) {
-    this.#n = t, this.#f();
+    case "auto":
+    default:
+      return e >= o && e <= f ? e : e < o ? o : f;
   }
-  subscribe = (t) => (this.#l.add(t), () => {
-    this.#l.delete(t);
-  });
-  version = () => `${this.#i}-${this.#a}`;
-  scrollToIndex({
-    align: t = "auto",
-    behavior: n,
-    index: o
-  }) {
-    const r = this.#d(o, t);
-    this.#c === "horizontal" ? this.#o?.scrollTo({
-      left: r,
-      behavior: n || void 0
-    }) : this.#o?.scrollTo({
-      behavior: n || void 0,
-      top: r
-    });
+}
+function Z({
+  cachedBounds: t,
+  containerScrollOffset: r,
+  containerSize: l,
+  itemCount: s,
+  overscanCount: e
+}) {
+  const i = s - 1;
+  let n = 0, c = -1, o = 0;
+  for (; o < i; ) {
+    const f = t.get(o);
+    if (f.scrollOffset + f.size > r)
+      break;
+    o++;
   }
-  scrollForTest(t) {
-    this.#t = t, this.#f();
+  for (n = o, n = Math.max(0, n - e); o < i; ) {
+    const f = t.get(o);
+    if (f.scrollOffset + f.size >= r + l)
+      break;
+    o++;
   }
-  #h = () => {
-    const { clientHeight: t, scrollHeight: n, scrollLeft: o, scrollTop: r, scrollWidth: s } = this.#o, c = this.#c === "vertical" ? r : o, a = this.#c === "vertical" ? n : s;
-    this.#t !== c && (this.#t = Math.max(
-      0,
-      Math.min(c, a - t)
-    ), this.#f());
-  };
-  #d(t, n) {
-    const o = this.getItemBounds(this.#s - 1).scrollOffset, r = o + this.getItemBounds(this.#s - 1).scrollOffset - this.#n, s = Math.max(
-      0,
-      this.getItemBounds(t + 1).scrollOffset - this.#n
-    ), c = Math.min(
-      o,
-      this.getItemBounds(t).scrollOffset
-    );
-    switch (n === "smart" && (this.#t >= s && this.#t <= c ? n = "auto" : n = "center"), n) {
-      case "start":
-        return Math.min(r, c);
-      case "end":
-        return s;
-      case "center": {
-        const a = Math.round(
-          s + (c - s) / 2
-        );
-        return a < Math.ceil(this.#n / 2) ? 0 : a > r ? r : a;
+  return c = Math.min(i, o), c = Math.min(s - 1, c + e), n < 0 ? [0, -1] : [n, c];
+}
+function _({
+  itemCount: t,
+  itemProps: r,
+  itemSize: l
+}) {
+  const s = /* @__PURE__ */ new Map();
+  return {
+    get(e) {
+      for (E(e < t, `Invalid index ${e}`); s.size - 1 < e; ) {
+        const n = s.size, c = typeof l == "number" ? l : l(n, r);
+        if (n === 0)
+          s.set(n, {
+            size: c,
+            scrollOffset: 0
+          });
+        else {
+          const o = s.get(n - 1);
+          E(
+            o !== void 0,
+            `Unexpected bounds cache miss for index ${e}`
+          ), s.set(n, {
+            scrollOffset: o.scrollOffset + o.size,
+            size: c
+          });
+        }
       }
-      case "auto":
-      default:
-        return this.#t >= s && this.#t <= c ? this.#t : this.#t < s ? s : c;
-    }
-  }
-  #m() {
-    this.#l.forEach((t) => t());
-  }
-  #f() {
-    const t = this.#s - 1;
-    let n = 0, o = -1, r = 0;
-    for (; r < t; ) {
-      const s = this.getItemBounds(r);
-      if (s.scrollOffset + s.size > this.#t)
-        break;
-      r++;
+      const i = s.get(e);
+      return E(
+        i !== void 0,
+        `Unexpected bounds cache miss for index ${e}`
+      ), i;
+    },
+    set(e, i) {
+      s.set(e, i);
+    },
+    get size() {
+      return s.size;
     }
-    for (n = r, n = Math.max(0, n - this.#u); r < t; ) {
-      const s = this.getItemBounds(r);
-      if (s.scrollOffset + s.size >= this.#t + this.#n)
-        break;
-      r++;
-    }
-    o = Math.min(t, r), o = Math.min(this.#s - 1, o + this.#u), (this.#i !== n || this.#a !== o) && (this.#i = n, this.#a = o, this.#m());
-  }
+  };
 }
-function Z({
-  count: i,
-  defaultSize: t,
-  direction: n,
-  element: o,
-  itemSize: r,
-  overscanCount: s,
-  size: c
+function N({
+  itemCount: t,
+  itemProps: r,
+  itemSize: l
 }) {
-  const a = y(
-    () => o ? new Oe({
-      count: i,
-      defaultSize: t,
-      direction: n,
-      element: o,
-      itemSize: r,
-      overscanCount: s
-    }) : null,
-    [i, t, n, o, r, s]
+  return M(
+    () => _({
+      itemCount: t,
+      itemProps: r,
+      itemSize: l
+    }),
+    [t, r, l]
   );
-  return ce(() => {
-    c !== void 0 && a?.resize(c);
-  }, [c, a]), ge(
-    a?.subscribe ?? be,
-    a?.version ?? ie,
-    a?.version ?? ie
-  ), a;
 }
-function be() {
-  return be;
+function G({
+  containerElement: t,
+  containerStyle: r,
+  defaultContainerSize: l = 0,
+  direction: s,
+  itemCount: e,
+  itemProps: i,
+  itemSize: n,
+  overscanCount: c
+}) {
+  const [o, f] = $([0, -1]), [p, I] = [
+    Math.min(e - 1, o[0]),
+    Math.min(e - 1, o[1])
+  ], { height: b = l, width: y = l } = K({
+    defaultHeight: s === "vertical" ? l : void 0,
+    defaultWidth: s === "horizontal" ? l : void 0,
+    element: t,
+    mode: s === "vertical" ? "only-height" : "only-width",
+    style: r
+  }), w = s === "vertical" ? b : y, d = N({
+    itemCount: e,
+    itemProps: i,
+    itemSize: n
+  }), x = R(
+    (u) => d.get(u),
+    [d]
+  ), z = R(
+    () => Q({
+      cachedBounds: d,
+      itemCount: e,
+      itemSize: n
+    }),
+    [d, e, n]
+  ), h = R(
+    (u) => Z({
+      cachedBounds: d,
+      containerScrollOffset: u,
+      containerSize: w,
+      itemCount: e,
+      overscanCount: c
+    }),
+    [d, w, e, c]
+  );
+  q(() => {
+    const u = (s === "vertical" ? t?.scrollTop : t?.scrollLeft) ?? 0;
+    f(h(u));
+  }, [t, s, h]);
+  const a = R(
+    ({
+      align: u = "auto",
+      behavior: O = "auto",
+      containerScrollOffset: m,
+      index: g
+    }) => {
+      const S = X({
+        align: u,
+        cachedBounds: d,
+        containerScrollOffset: m,
+        containerSize: w,
+        index: g,
+        itemCount: e
+      });
+      s === "horizontal" ? t?.scrollTo({
+        left: S,
+        behavior: O || void 0
+      }) : t?.scrollTo({
+        behavior: O || void 0,
+        top: S
+      });
+    },
+    [d, t, w, s, e]
+  );
+  return {
+    getCellBounds: x,
+    getEstimatedHeight: z,
+    onScroll: () => {
+      const u = h(
+        (s === "vertical" ? t?.scrollTop : t?.scrollLeft) ?? 0
+      );
+      (u[0] !== p || u[1] !== I) && f(u);
+    },
+    scrollToIndex: a,
+    startIndex: p,
+    stopIndex: I
+  };
 }
-function ie() {
-  return "";
+function A(t) {
+  return M(() => t, Object.values(t));
 }
-function le(i, t) {
-  if (i === t)
+function B(t, r) {
+  if (t === r)
     return !0;
-  if (!!i != !!t || (B(i !== void 0), B(t !== void 0), Object.keys(i).length !== Object.keys(t).length))
+  if (!!t != !!r || (E(t !== void 0), E(r !== void 0), Object.keys(t).length !== Object.keys(r).length))
     return !1;
-  for (const n in i)
-    if (!Object.is(t[n], i[n]))
+  for (const l in t)
+    if (!Object.is(r[l], t[l]))
       return !1;
   return !0;
 }
-function ve(i, t) {
-  const { style: n, ...o } = i, { style: r, ...s } = t;
-  return le(n, r) && le(o, s);
+function D(t, r) {
+  const { style: l, ...s } = t, { style: e, ...i } = r;
+  return B(l, e) && B(s, i);
 }
-function _e({
-  cellComponent: i,
-  cellProps: t,
-  className: n,
-  columnCount: o,
-  columnWidth: r,
-  defaultHeight: s,
-  defaultWidth: c,
-  gridRef: a,
-  onCellsRendered: g,
-  overscanCount: R = 3,
-  rowCount: k,
-  rowHeight: m,
-  style: x,
-  ...O
+function et({
+  cellComponent: t,
+  cellProps: r,
+  className: l,
+  columnCount: s,
+  columnWidth: e,
+  defaultHeight: i = 0,
+  defaultWidth: n = 0,
+  gridRef: c,
+  onCellsRendered: o,
+  overscanCount: f = 3,
+  rowCount: p,
+  rowHeight: I,
+  style: b,
+  ...y
 }) {
-  const w = me(t), T = y(
-    () => ae(i, ve),
-    [i]
-  ), [S, b] = K(null), { height: A = 0, width: P = 0 } = de({
-    defaultHeight: s,
-    defaultWidth: c,
-    element: S,
-    style: x
-  }), W = y(() => typeof r == "number" ? r : (p) => r(p, w), [r, w]), I = y(() => typeof m == "number" ? m : (p) => m(p, w), [m, w]), f = Z({
-    count: o,
-    defaultSize: c,
+  const w = A(r), d = M(
+    () => V(t, D),
+    [t]
+  ), [x, z] = $(null), h = G({
+    containerElement: x,
+    defaultContainerSize: n,
     direction: "horizontal",
-    element: S,
-    itemSize: W,
-    overscanCount: R,
-    size: P
-  }), v = Z({
-    count: k,
-    defaultSize: s,
+    itemCount: s,
+    itemProps: w,
+    itemSize: e,
+    overscanCount: f
+  }), a = G({
+    containerElement: x,
+    defaultContainerSize: i,
     direction: "vertical",
-    element: S,
+    itemCount: p,
+    itemProps: w,
     itemSize: I,
-    overscanCount: R,
-    size: A
-  }), [$, Y] = f?.getIndices() ?? [-1, 0], [C, N] = v?.getIndices() ?? [-1, 0];
-  ue(
-    a,
+    overscanCount: f
+  }), { startIndex: u, stopIndex: O } = h, { startIndex: m, stopIndex: g } = a;
+  U(
+    c,
     () => ({
       get element() {
-        return S;
+        return x;
       },
       scrollToCell({
-        behavior: p = "auto",
-        columnAlign: E = "auto",
-        columnIndex: _,
-        rowAlign: j = "auto",
-        rowIndex: F
+        behavior: T = "auto",
+        columnAlign: v = "auto",
+        columnIndex: H,
+        rowAlign: k = "auto",
+        rowIndex: L
       }) {
-        v?.scrollToIndex({
-          align: j,
-          behavior: p,
-          index: F
-        }), f?.scrollToIndex({
-          behavior: p,
-          align: E,
-          index: _
+        a?.scrollToIndex({
+          align: k,
+          behavior: T,
+          containerScrollOffset: x?.scrollTop ?? 0,
+          index: L
+        }), h?.scrollToIndex({
+          align: v,
+          behavior: T,
+          containerScrollOffset: x?.scrollLeft ?? 0,
+          index: H
         });
       },
       scrollToColumn({
-        align: p = "auto",
-        behavior: E = "auto",
-        index: _
+        align: T = "auto",
+        behavior: v = "auto",
+        index: H
       }) {
-        f?.scrollToIndex({
-          align: p,
-          behavior: E,
-          index: _
+        h?.scrollToIndex({
+          align: T,
+          behavior: v,
+          containerScrollOffset: x?.scrollLeft ?? 0,
+          index: H
         });
       },
       scrollToRow({
-        align: p = "auto",
-        behavior: E = "auto",
-        index: _
+        align: T = "auto",
+        behavior: v = "auto",
+        index: H
       }) {
-        v?.scrollToIndex({ align: p, behavior: E, index: _ });
+        a?.scrollToIndex({
+          align: T,
+          behavior: v,
+          containerScrollOffset: x?.scrollTop ?? 0,
+          index: H
+        });
       }
     }),
-    [f, S, v]
-  ), Q(() => {
-    $ >= 0 && Y >= 0 && C >= 0 && N >= 0 && g && g({
-      columnStartIndex: $,
-      columnStopIndex: Y,
-      rowStartIndex: C,
-      rowStopIndex: N
+    [h, x, a]
+  ), P(() => {
+    u >= 0 && O >= 0 && m >= 0 && g >= 0 && o && o({
+      columnStartIndex: u,
+      columnStopIndex: O,
+      rowStartIndex: m,
+      rowStopIndex: g
     });
   }, [
-    g,
-    $,
-    Y,
-    C,
-    N
+    o,
+    u,
+    O,
+    m,
+    g
   ]);
-  const V = y(() => {
-    const p = [];
-    if (f && o > 0 && v && k > 0)
-      for (let E = C; E <= N; E++) {
-        const _ = v.getItemBounds(E);
-        for (let j = $; j <= Y; j++) {
-          const F = f.getItemBounds(j);
-          p.push(
-            /* @__PURE__ */ fe(
-              T,
+  const S = M(() => {
+    const T = [];
+    if (h && s > 0 && a && p > 0)
+      for (let v = m; v <= g; v++) {
+        const H = a.getCellBounds(v);
+        for (let k = u; k <= O; k++) {
+          const L = h.getCellBounds(k);
+          T.push(
+            /* @__PURE__ */ F(
+              d,
               {
                 ...w,
-                columnIndex: j,
-                key: `${E}-${j}`,
-                rowIndex: E,
+                columnIndex: k,
+                key: `${v}-${k}`,
+                rowIndex: v,
                 style: {
                   position: "absolute",
                   left: 0,
-                  transform: `translate(${F.scrollOffset}px, ${_.scrollOffset}px)`,
-                  height: _.size,
-                  width: F.size
+                  transform: `translate(${L.scrollOffset}px, ${H.scrollOffset}px)`,
+                  height: H.size,
+                  width: L.size
                 }
               }
             )
           );
         }
       }
-    return p;
+    return T;
   }, [
-    T,
+    d,
     w,
-    o,
-    $,
-    Y,
-    f,
-    k,
-    C,
-    N,
-    v
+    s,
+    u,
+    O,
+    h,
+    p,
+    m,
+    g,
+    a
   ]);
-  return /* @__PURE__ */ q.jsx(
+  return /* @__PURE__ */ j(
     "div",
     {
       role: "grid",
-      ...O,
-      className: n,
-      ref: b,
+      ...y,
+      className: l,
+      onScroll: () => {
+        h.onScroll(), a.onScroll();
+      },
+      ref: z,
       style: {
-        ...x,
+        ...b,
         maxHeight: "100%",
         maxWidth: "100%",
         flexGrow: 1,
         overflow: "auto"
       },
-      children: /* @__PURE__ */ q.jsx(
+      children: /* @__PURE__ */ j(
         "div",
         {
-          className: n,
+          className: l,
           style: {
             position: "relative",
-            height: v?.getEstimatedHeight(),
-            width: f?.getEstimatedHeight()
+            height: a?.getEstimatedHeight(),
+            width: h?.getEstimatedHeight()
           },
-          children: V
+          children: S
         }
       )
     }
   );
 }
-const ye = he;
-function ke({
-  className: i,
-  defaultHeight: t = 0,
-  listRef: n,
-  onRowsRendered: o,
-  overscanCount: r = 3,
-  rowComponent: s,
-  rowCount: c,
-  rowHeight: a,
-  rowProps: g,
-  style: R,
-  ...k
+const st = $, ot = Y;
+function rt({
+  className: t,
+  defaultHeight: r = 0,
+  listRef: l,
+  onRowsRendered: s,
+  overscanCount: e = 3,
+  rowComponent: i,
+  rowCount: n,
+  rowHeight: c,
+  rowProps: o,
+  style: f,
+  ...p
 }) {
-  const m = me(g), x = y(
-    () => ae(s, ve),
-    [s]
-  ), [O, w] = K(null), { height: T = 0 } = de({
-    defaultHeight: t,
-    element: O,
-    mode: "only-height",
-    style: R
-  }), S = y(() => typeof a == "number" ? a : (I) => a(I, m), [a, m]), b = Z({
-    count: c,
-    defaultSize: t,
+  const I = A(o), b = M(
+    () => V(i, D),
+    [i]
+  ), [y, w] = $(null), {
+    getCellBounds: d,
+    getEstimatedHeight: x,
+    onScroll: z,
+    scrollToIndex: h,
+    startIndex: a,
+    stopIndex: u
+  } = G({
+    containerElement: y,
+    defaultContainerSize: r,
     direction: "vertical",
-    element: O,
-    itemSize: S,
-    overscanCount: r,
-    size: T
-  }), [A, P] = b?.getIndices() ?? [-1, 0];
-  ue(
-    n,
+    itemCount: n,
+    itemProps: I,
+    itemSize: c,
+    overscanCount: e
+  });
+  U(
+    l,
     () => ({
       get element() {
-        return O;
+        return y;
       },
       scrollToRow({
-        align: I = "auto",
-        behavior: f = "auto",
-        index: v
+        align: m = "auto",
+        behavior: g = "auto",
+        index: S
       }) {
-        b?.scrollToIndex({ align: I, behavior: f, index: v });
+        h({
+          align: m,
+          behavior: g,
+          containerScrollOffset: y?.scrollTop ?? 0,
+          index: S
+        });
       }
     }),
-    [O, b]
-  ), Q(() => {
-    A >= 0 && P >= 0 && o && o({
-      startIndex: A,
-      stopIndex: P
+    [y, h]
+  ), P(() => {
+    a >= 0 && u >= 0 && s && s({
+      startIndex: a,
+      stopIndex: u
     });
-  }, [o, A, P]);
-  const W = y(() => {
-    const I = [];
-    if (b && c > 0)
-      for (let f = A; f <= P; f++) {
-        const v = b.getItemBounds(f);
-        I.push(
-          /* @__PURE__ */ fe(
-            x,
+  }, [s, a, u]);
+  const O = M(() => {
+    const m = [];
+    if (n > 0)
+      for (let g = a; g <= u; g++) {
+        const S = d(g);
+        m.push(
+          /* @__PURE__ */ F(
+            b,
             {
-              ...m,
-              key: f,
-              index: f,
+              ...I,
+              key: g,
+              index: g,
               style: {
                 position: "absolute",
                 left: 0,
-                transform: `translateY(${v.scrollOffset}px)`,
-                height: v.size,
+                transform: `translateY(${S.scrollOffset}px)`,
+                height: S.size,
                 width: "100%"
               }
             }
           )
         );
       }
-    return I;
-  }, [x, c, m, A, P, b]);
-  return /* @__PURE__ */ q.jsx(
+    return m;
+  }, [b, d, n, I, a, u]);
+  return /* @__PURE__ */ j(
     "div",
     {
       role: "list",
-      ...k,
-      className: i,
+      ...p,
+      className: t,
+      onScroll: z,
       ref: w,
       style: {
-        ...R,
+        ...f,
         maxHeight: "100%",
         flexGrow: 1,
         overflowY: "auto"
       },
-      children: /* @__PURE__ */ q.jsx(
+      children: /* @__PURE__ */ j(
         "div",
         {
-          className: i,
+          className: t,
           style: {
-            height: b?.getEstimatedHeight(),
+            height: x(),
             position: "relative",
             width: "100%"
           },
-          children: W
+          children: O
         }
       )
     }
   );
 }
-const Ie = he;
+const lt = $, nt = Y;
 export {
-  _e as Grid,
-  ke as List,
-  ye as useGridRef,
-  Ie as useListRef
+  et as Grid,
+  rt as List,
+  st as useGridCallbackRef,
+  ot as useGridRef,
+  lt as useListCallbackRef,
+  nt as useListRef
 };