react-window 2.0.0 → 2.0.2-alpha.0

package/dist/react-window.js

@@ -1,6 +1,6 @@
-import { jsx as D } from "react/jsx-runtime";
-import { useState as E, useLayoutEffect as J, useEffect as K, useMemo as W, useRef as q, useCallback as V, memo as _, useImperativeHandle as N, createElement as ee } from "react";
-function ie(e) {
+import { jsx as J, jsxs as C } from "react/jsx-runtime";
+import { useState as j, useLayoutEffect as Q, useEffect as X, useMemo as A, useRef as Y, useCallback as V, memo as ee, useImperativeHandle as te, createElement as se } from "react";
+function ce(e) {
   let t = e;
   for (; t; ) {
     if (t.dir)
@@ -9,14 +9,14 @@ function ie(e) {
   }
   return !1;
 }
-function le(e, t) {
-  const [s, r] = E(t === "rtl");
-  return J(() => {
-    e && (t || r(ie(e)));
-  }, [t, e]), s;
+function fe(e, t) {
+  const [r, s] = j(t === "rtl");
+  return Q(() => {
+    e && (t || s(ce(e)));
+  }, [t, e]), r;
 }
-const Y = typeof window < "u" ? J : K;
-function Q(e) {
+const D = typeof window < "u" ? Q : X;
+function Z(e) {
   if (e !== void 0)
     switch (typeof e) {
       case "number":
@@ -28,686 +28,716 @@ function Q(e) {
       }
     }
 }
-function ne({
+function ue({
   box: e,
   defaultHeight: t,
-  defaultWidth: s,
-  disabled: r,
+  defaultWidth: r,
+  disabled: s,
   element: o,
   mode: i,
-  style: n
+  style: l
 }) {
-  const { styleHeight: c, styleWidth: l } = W(
+  const { styleHeight: c, styleWidth: n } = A(
     () => ({
-      styleHeight: Q(n?.height),
-      styleWidth: Q(n?.width)
+      styleHeight: Z(l?.height),
+      styleWidth: Z(l?.width)
     }),
-    [n?.height, n?.width]
-  ), [f, a] = E({
+    [l?.height, l?.width]
+  ), [f, g] = j({
     height: t,
-    width: s
-  }), I = r || i === "only-height" && c !== void 0 || i === "only-width" && l !== void 0 || c !== void 0 && l !== void 0;
-  return Y(() => {
+    width: r
+  }), I = s || i === "only-height" && c !== void 0 || i === "only-width" && n !== void 0 || c !== void 0 && n !== void 0;
+  return D(() => {
     if (o === null || I)
       return;
-    const v = new ResizeObserver((k) => {
-      for (const x of k) {
-        const { contentRect: w, target: z } = x;
-        o === z && a((g) => g.height === w.height && g.width === w.width ? g : {
+    const x = new ResizeObserver((S) => {
+      for (const h of S) {
+        const { contentRect: w, target: z } = h;
+        o === z && g((v) => v.height === w.height && v.width === w.width ? v : {
           height: w.height,
           width: w.width
         });
       }
     });
-    return v.observe(o, { box: e }), () => {
-      v?.unobserve(o);
+    return x.observe(o, { box: e }), () => {
+      x?.unobserve(o);
     };
-  }, [e, I, o, c, l]), W(
+  }, [e, I, o, c, n]), A(
     () => ({
       height: c ?? f.height,
-      width: l ?? f.width
+      width: n ?? f.width
     }),
-    [f, c, l]
+    [f, c, n]
   );
 }
-function ce(e) {
-  const t = q(() => {
+function de(e) {
+  const t = Y(() => {
     throw new Error("Cannot call an event handler while rendering.");
   });
-  return Y(() => {
+  return D(() => {
     t.current = e;
-  }, [e]), V((s) => t.current?.(s), [t]);
+  }, [e]), V((r) => t.current?.(r), [t]);
 }
-let j = null;
-function fe(e = !1) {
-  if (j === null || e) {
-    const t = document.createElement("div"), s = t.style;
-    s.width = "50px", s.height = "50px", s.overflow = "scroll", s.direction = "rtl";
-    const r = document.createElement("div"), o = r.style;
-    return o.width = "100px", o.height = "100px", t.appendChild(r), document.body.appendChild(t), t.scrollLeft > 0 ? j = "positive-descending" : (t.scrollLeft = 1, t.scrollLeft === 0 ? j = "negative" : j = "positive-ascending"), document.body.removeChild(t), j;
+let G = null;
+function ae(e = !1) {
+  if (G === null || e) {
+    const t = document.createElement("div"), r = t.style;
+    r.width = "50px", r.height = "50px", r.overflow = "scroll", r.direction = "rtl";
+    const s = document.createElement("div"), o = s.style;
+    return o.width = "100px", o.height = "100px", t.appendChild(s), document.body.appendChild(t), t.scrollLeft > 0 ? G = "positive-descending" : (t.scrollLeft = 1, t.scrollLeft === 0 ? G = "negative" : G = "positive-ascending"), document.body.removeChild(t), G;
   }
-  return j;
+  return G;
 }
-function A({
+function q({
   containerElement: e,
   direction: t,
-  isRtl: s,
-  scrollOffset: r
+  isRtl: r,
+  scrollOffset: s
 }) {
-  if (t === "horizontal" && s)
-    switch (fe()) {
+  if (t === "horizontal" && r)
+    switch (ae()) {
       case "negative":
-        return -r;
+        return -s;
       case "positive-descending": {
         if (e) {
-          const { clientWidth: o, scrollLeft: i, scrollWidth: n } = e;
-          return n - o - i;
+          const { clientWidth: o, scrollLeft: i, scrollWidth: l } = e;
+          return l - o - i;
         }
         break;
       }
     }
-  return r;
+  return s;
 }
-function R(e, t = "Assertion error") {
+function W(e, t = "Assertion error") {
   if (!e)
     throw console.error(t), Error(t);
 }
-function te({
+function re({
   cachedBounds: e,
   itemCount: t,
-  itemSize: s
+  itemSize: r
 }) {
   if (t === 0)
     return 0;
-  if (typeof s == "number")
-    return t * s;
+  if (typeof r == "number")
+    return t * r;
   {
-    const r = e.get(
+    const s = e.get(
       e.size === 0 ? 0 : e.size - 1
     );
-    R(r !== void 0, "Unexpected bounds cache miss");
-    const o = (r.scrollOffset + r.size) / e.size;
+    W(s !== void 0, "Unexpected bounds cache miss");
+    const o = (s.scrollOffset + s.size) / e.size;
     return t * o;
   }
 }
-function de({
+function he({
   align: e,
   cachedBounds: t,
-  index: s,
-  itemCount: r,
+  index: r,
+  itemCount: s,
   itemSize: o,
   containerScrollOffset: i,
-  containerSize: n
+  containerSize: l
 }) {
-  const c = te({
+  const c = re({
     cachedBounds: t,
-    itemCount: r,
+    itemCount: s,
     itemSize: o
-  }), l = t.get(s), f = Math.max(
+  }), n = t.get(r), f = Math.max(
     0,
-    Math.min(c - n, l.scrollOffset)
-  ), a = Math.max(
+    Math.min(c - l, n.scrollOffset)
+  ), g = Math.max(
     0,
-    l.scrollOffset - n + l.size
+    n.scrollOffset - l + n.size
   );
-  switch (e === "smart" && (i >= a && i <= f ? e = "auto" : e = "center"), e) {
+  switch (e === "smart" && (i >= g && i <= f ? e = "auto" : e = "center"), e) {
     case "start":
       return f;
     case "end":
-      return a;
+      return g;
     case "center":
-      return l.scrollOffset <= n / 2 ? 0 : l.scrollOffset + l.size / 2 >= c - n / 2 ? c - n : l.scrollOffset + l.size / 2 - n / 2;
+      return n.scrollOffset <= l / 2 ? 0 : n.scrollOffset + n.size / 2 >= c - l / 2 ? c - l : n.scrollOffset + n.size / 2 - l / 2;
     case "auto":
     default:
-      return i >= a && i <= f ? i : i < a ? a : f;
+      return i >= g && i <= f ? i : i < g ? g : f;
   }
 }
-function X({
+function _({
   cachedBounds: e,
   containerScrollOffset: t,
-  containerSize: s,
-  itemCount: r,
+  containerSize: r,
+  itemCount: s,
   overscanCount: o
 }) {
-  const i = r - 1;
-  let n = 0, c = -1, l = 0;
-  for (; l < i; ) {
-    const f = e.get(l);
+  const i = s - 1;
+  let l = 0, c = -1, n = 0;
+  for (; n < i; ) {
+    const f = e.get(n);
     if (f.scrollOffset + f.size > t)
       break;
-    l++;
+    n++;
   }
-  for (n = l, n = Math.max(0, n - o); l < i; ) {
-    const f = e.get(l);
-    if (f.scrollOffset + f.size >= t + s)
+  for (l = n, l = Math.max(0, l - o); n < i; ) {
+    const f = e.get(n);
+    if (f.scrollOffset + f.size >= t + r)
       break;
-    l++;
+    n++;
   }
-  return c = Math.min(i, l), c = Math.min(r - 1, c + o), n < 0 ? [0, -1] : [n, c];
+  return c = Math.min(i, n), c = Math.min(s - 1, c + o), l < 0 ? [0, -1] : [l, c];
 }
-function ue({
+function pe({
   itemCount: e,
   itemProps: t,
-  itemSize: s
+  itemSize: r
 }) {
-  const r = /* @__PURE__ */ new Map();
+  const s = /* @__PURE__ */ new Map();
   return {
     get(o) {
-      for (R(o < e, `Invalid index ${o}`); r.size - 1 < o; ) {
-        const n = r.size;
+      for (W(o < e, `Invalid index ${o}`); s.size - 1 < o; ) {
+        const l = s.size;
         let c;
-        switch (typeof s) {
+        switch (typeof r) {
           case "function": {
-            c = s(n, t);
+            c = r(l, t);
             break;
           }
           case "number": {
-            c = s;
+            c = r;
             break;
           }
         }
-        if (n === 0)
-          r.set(n, {
+        if (l === 0)
+          s.set(l, {
             size: c,
             scrollOffset: 0
           });
         else {
-          const l = r.get(n - 1);
-          R(
-            l !== void 0,
+          const n = s.get(l - 1);
+          W(
+            n !== void 0,
             `Unexpected bounds cache miss for index ${o}`
-          ), r.set(n, {
-            scrollOffset: l.scrollOffset + l.size,
+          ), s.set(l, {
+            scrollOffset: n.scrollOffset + n.size,
             size: c
           });
         }
       }
-      const i = r.get(o);
-      return R(
+      const i = s.get(o);
+      return W(
         i !== void 0,
         `Unexpected bounds cache miss for index ${o}`
       ), i;
     },
     set(o, i) {
-      r.set(o, i);
+      s.set(o, i);
     },
     get size() {
-      return r.size;
+      return s.size;
     }
   };
 }
-function he({
+function ge({
   itemCount: e,
   itemProps: t,
-  itemSize: s
+  itemSize: r
 }) {
-  return W(
-    () => ue({
+  return A(
+    () => pe({
       itemCount: e,
       itemProps: t,
-      itemSize: s
+      itemSize: r
     }),
-    [e, t, s]
+    [e, t, r]
   );
 }
-function ae({
+function xe({
   containerSize: e,
   itemSize: t
 }) {
-  let s;
+  let r;
   switch (typeof t) {
     case "string": {
-      R(
+      W(
         t.endsWith("%"),
         `Invalid item size: "${t}"; string values must be percentages (e.g. "100%")`
-      ), R(
+      ), W(
         e !== void 0,
         "Container size must be defined if a percentage item size is specified"
-      ), s = e * parseInt(t) / 100;
+      ), r = e * parseInt(t) / 100;
       break;
     }
     default: {
-      s = t;
+      r = t;
       break;
     }
   }
-  return s;
+  return r;
 }
-function C({
+function K({
   containerElement: e,
   containerStyle: t,
-  defaultContainerSize: s = 0,
-  direction: r,
+  defaultContainerSize: r = 0,
+  direction: s,
   isRtl: o = !1,
   itemCount: i,
-  itemProps: n,
+  itemProps: l,
   itemSize: c,
-  onResize: l,
+  onResize: n,
   overscanCount: f
 }) {
-  const [a, I] = E([0, -1]), [v, k] = [
-    Math.min(i - 1, a[0]),
-    Math.min(i - 1, a[1])
-  ], { height: x = s, width: w = s } = ne({
-    defaultHeight: r === "vertical" ? s : void 0,
-    defaultWidth: r === "horizontal" ? s : void 0,
+  const [g, I] = j([0, -1]), [x, S] = [
+    Math.min(i - 1, g[0]),
+    Math.min(i - 1, g[1])
+  ], { height: h = r, width: w = r } = ue({
+    defaultHeight: s === "vertical" ? r : void 0,
+    defaultWidth: s === "horizontal" ? r : void 0,
     element: e,
-    mode: r === "vertical" ? "only-height" : "only-width",
+    mode: s === "vertical" ? "only-height" : "only-width",
     style: t
-  }), z = q({
+  }), z = Y({
     height: 0,
     width: 0
-  }), g = r === "vertical" ? x : w, u = ae({ containerSize: g, itemSize: c });
-  J(() => {
-    if (typeof l == "function") {
-      const d = z.current;
-      (d.height !== x || d.width !== w) && (l({ height: x, width: w }, { ...d }), d.height = x, d.width = w);
+  }), v = s === "vertical" ? h : w, d = xe({ containerSize: v, itemSize: c });
+  Q(() => {
+    if (typeof n == "function") {
+      const u = z.current;
+      (u.height !== h || u.width !== w) && (n({ height: h, width: w }, { ...u }), u.height = h, u.width = w);
     }
-  }, [x, l, w]);
-  const h = he({
+  }, [h, n, w]);
+  const a = ge({
     itemCount: i,
-    itemProps: n,
-    itemSize: u
+    itemProps: l,
+    itemSize: d
   }), y = V(
-    (d) => h.get(d),
-    [h]
+    (u) => a.get(u),
+    [a]
   ), B = V(
-    () => te({
-      cachedBounds: h,
+    () => re({
+      cachedBounds: a,
       itemCount: i,
-      itemSize: u
+      itemSize: d
     }),
-    [h, i, u]
+    [a, i, d]
   ), T = V(
-    (d) => {
-      const m = A({
+    (u) => {
+      const m = q({
         containerElement: e,
-        direction: r,
+        direction: s,
         isRtl: o,
-        scrollOffset: d
+        scrollOffset: u
       });
-      return X({
-        cachedBounds: h,
+      return _({
+        cachedBounds: a,
         containerScrollOffset: m,
-        containerSize: g,
+        containerSize: v,
         itemCount: i,
         overscanCount: f
       });
     },
     [
-      h,
+      a,
       e,
-      g,
-      r,
+      v,
+      s,
       o,
       i,
       f
     ]
   );
-  Y(() => {
-    const d = (r === "vertical" ? e?.scrollTop : e?.scrollLeft) ?? 0;
-    I(T(d));
-  }, [e, r, T]), Y(() => {
+  D(() => {
+    const u = (s === "vertical" ? e?.scrollTop : e?.scrollLeft) ?? 0;
+    I(T(u));
+  }, [e, s, T]), D(() => {
     if (!e)
       return;
-    const d = () => {
+    const u = () => {
       I((m) => {
-        const { scrollLeft: H, scrollTop: G } = e, b = A({
+        const { scrollLeft: H, scrollTop: k } = e, O = q({
           containerElement: e,
-          direction: r,
+          direction: s,
           isRtl: o,
-          scrollOffset: r === "vertical" ? G : H
-        }), O = X({
-          cachedBounds: h,
-          containerScrollOffset: b,
-          containerSize: g,
+          scrollOffset: s === "vertical" ? k : H
+        }), $ = _({
+          cachedBounds: a,
+          containerScrollOffset: O,
+          containerSize: v,
           itemCount: i,
           overscanCount: f
         });
-        return O[0] === m[0] && O[1] === m[1] ? m : O;
+        return $[0] === m[0] && $[1] === m[1] ? m : $;
       });
     };
-    return e.addEventListener("scroll", d), () => {
-      e.removeEventListener("scroll", d);
+    return e.addEventListener("scroll", u), () => {
+      e.removeEventListener("scroll", u);
     };
   }, [
-    h,
+    a,
     e,
-    g,
-    r,
+    v,
+    s,
     i,
     f
   ]);
-  const p = ce(
+  const p = de(
     ({
-      align: d = "auto",
-      behavior: m = "auto",
-      containerScrollOffset: H,
-      index: G
+      align: u = "auto",
+      containerScrollOffset: m,
+      index: H
     }) => {
-      let b = de({
-        align: d,
-        cachedBounds: h,
-        containerScrollOffset: H,
-        containerSize: g,
-        index: G,
+      let k = he({
+        align: u,
+        cachedBounds: a,
+        containerScrollOffset: m,
+        containerSize: v,
+        index: H,
         itemCount: i,
-        itemSize: u
+        itemSize: d
       });
-      if (e)
-        if (b = A({
+      if (e) {
+        if (k = q({
           containerElement: e,
-          direction: r,
+          direction: s,
           isRtl: o,
-          scrollOffset: b
-        }), typeof e.scrollTo == "function")
-          r === "horizontal" ? e.scrollTo({
-            left: b,
-            behavior: m || void 0
-          }) : e.scrollTo({
-            behavior: m || void 0,
-            top: b
-          });
-        else {
-          const O = T(b);
-          (O[0] !== v || O[1] !== k) && I(O);
+          scrollOffset: k
+        }), typeof e.scrollTo != "function") {
+          const O = T(k);
+          (O[0] !== x || O[1] !== S) && I(O);
         }
+        return k;
+      }
     }
   );
   return {
     getCellBounds: y,
     getEstimatedSize: B,
     scrollToIndex: p,
-    startIndex: v,
-    stopIndex: k
+    startIndex: x,
+    stopIndex: S
   };
 }
-function se(e) {
-  return W(() => e, Object.values(e));
+function oe(e) {
+  return A(() => e, Object.values(e));
 }
-function Z(e, t) {
+function N(e, t) {
   if (e === t)
     return !0;
-  if (!!e != !!t || (R(e !== void 0), R(t !== void 0), Object.keys(e).length !== Object.keys(t).length))
+  if (!!e != !!t || (W(e !== void 0), W(t !== void 0), Object.keys(e).length !== Object.keys(t).length))
     return !1;
-  for (const s in e)
-    if (!Object.is(t[s], e[s]))
+  for (const r in e)
+    if (!Object.is(t[r], e[r]))
       return !1;
   return !0;
 }
-function re(e, t) {
-  const { style: s, ...r } = e, { style: o, ...i } = t;
-  return Z(s, o) && Z(r, i);
+function ie(e, t) {
+  const {
+    ariaAttributes: r,
+    style: s,
+    ...o
+  } = e, {
+    ariaAttributes: i,
+    style: l,
+    ...c
+  } = t;
+  return N(r, i) && N(s, l) && N(o, c);
 }
-function ve({
+function we({
   cellComponent: e,
   cellProps: t,
-  className: s,
-  columnCount: r,
+  className: r,
+  columnCount: s,
   columnWidth: o,
   defaultHeight: i = 0,
-  defaultWidth: n = 0,
+  defaultWidth: l = 0,
   dir: c,
-  gridRef: l,
+  gridRef: n,
   onCellsRendered: f,
-  onResize: a,
+  onResize: g,
   overscanCount: I = 3,
-  rowCount: v,
-  rowHeight: k,
-  style: x,
+  rowCount: x,
+  rowHeight: S,
+  style: h,
   ...w
 }) {
-  const z = se(t), g = W(
-    () => _(e, re),
+  const z = oe(t), v = A(
+    () => ee(e, ie),
     [e]
-  ), [u, h] = E(null), y = le(u, c), {
+  ), [d, a] = j(null), y = fe(d, c), {
     getCellBounds: B,
     getEstimatedSize: T,
     startIndex: p,
-    scrollToIndex: d,
+    scrollToIndex: u,
     stopIndex: m
-  } = C({
-    containerElement: u,
-    defaultContainerSize: n,
+  } = K({
+    containerElement: d,
+    defaultContainerSize: l,
     direction: "horizontal",
     isRtl: y,
-    itemCount: r,
+    itemCount: s,
     itemProps: z,
     itemSize: o,
-    onResize: a,
+    onResize: g,
     overscanCount: I
   }), {
     getCellBounds: H,
-    getEstimatedSize: G,
-    startIndex: b,
-    scrollToIndex: O,
+    getEstimatedSize: k,
+    startIndex: O,
+    scrollToIndex: $,
     stopIndex: F
-  } = C({
-    containerElement: u,
+  } = K({
+    containerElement: d,
     defaultContainerSize: i,
     direction: "vertical",
-    itemCount: v,
+    itemCount: x,
     itemProps: z,
-    itemSize: k,
-    onResize: a,
+    itemSize: S,
+    onResize: g,
     overscanCount: I
   });
-  N(
-    l,
+  te(
+    n,
     () => ({
       get element() {
-        return u;
+        return d;
       },
       scrollToCell({
         behavior: L = "auto",
-        columnAlign: S = "auto",
-        columnIndex: M,
-        rowAlign: $ = "auto",
-        rowIndex: U
+        columnAlign: b = "auto",
+        columnIndex: E,
+        rowAlign: M = "auto",
+        rowIndex: R
       }) {
-        O({
-          align: $,
-          behavior: L,
-          containerScrollOffset: u?.scrollTop ?? 0,
-          index: U
-        }), d({
-          align: S,
+        const U = u({
+          align: b,
+          containerScrollOffset: d?.scrollLeft ?? 0,
+          index: E
+        }), le = $({
+          align: M,
+          containerScrollOffset: d?.scrollTop ?? 0,
+          index: R
+        });
+        typeof d?.scrollTo == "function" && d.scrollTo({
           behavior: L,
-          containerScrollOffset: u?.scrollLeft ?? 0,
-          index: M
+          left: U,
+          top: le
         });
       },
       scrollToColumn({
         align: L = "auto",
-        behavior: S = "auto",
-        index: M
+        behavior: b = "auto",
+        index: E
       }) {
-        d({
+        const M = u({
           align: L,
-          behavior: S,
-          containerScrollOffset: u?.scrollLeft ?? 0,
-          index: M
+          containerScrollOffset: d?.scrollLeft ?? 0,
+          index: E
+        });
+        typeof d?.scrollTo == "function" && d.scrollTo({
+          behavior: b,
+          left: M
         });
       },
       scrollToRow({
         align: L = "auto",
-        behavior: S = "auto",
-        index: M
+        behavior: b = "auto",
+        index: E
       }) {
-        O({
+        const M = $({
           align: L,
-          behavior: S,
-          containerScrollOffset: u?.scrollTop ?? 0,
-          index: M
+          containerScrollOffset: d?.scrollTop ?? 0,
+          index: E
+        });
+        typeof d?.scrollTo == "function" && d.scrollTo({
+          behavior: b,
+          top: M
         });
       }
     }),
-    [u, d, O]
-  ), K(() => {
-    p >= 0 && m >= 0 && b >= 0 && F >= 0 && f && f({
+    [d, u, $]
+  ), X(() => {
+    p >= 0 && m >= 0 && O >= 0 && F >= 0 && f && f({
       columnStartIndex: p,
       columnStopIndex: m,
-      rowStartIndex: b,
+      rowStartIndex: O,
       rowStopIndex: F
     });
   }, [
     f,
     p,
     m,
-    b,
+    O,
     F
   ]);
-  const oe = W(() => {
+  const ne = A(() => {
     const L = [];
-    if (r > 0 && v > 0)
-      for (let S = b; S <= F; S++) {
-        const M = H(S);
-        for (let $ = p; $ <= m; $++) {
-          const U = B($);
-          L.push(
-            /* @__PURE__ */ ee(
-              g,
+    if (s > 0 && x > 0)
+      for (let b = O; b <= F; b++) {
+        const E = H(b), M = [];
+        for (let R = p; R <= m; R++) {
+          const U = B(R);
+          M.push(
+            /* @__PURE__ */ se(
+              v,
               {
                 ...z,
-                columnIndex: $,
-                key: `${S}-${$}`,
-                rowIndex: S,
+                ariaAttributes: {
+                  "aria-colindex": R + 1,
+                  role: "gridcell"
+                },
+                columnIndex: R,
+                key: R,
+                rowIndex: b,
                 style: {
                   position: "absolute",
                   left: y ? void 0 : 0,
                   right: y ? 0 : void 0,
-                  transform: `translate(${y ? -U.scrollOffset : U.scrollOffset}px, ${M.scrollOffset}px)`,
-                  height: v > 1 ? M.size : "100%",
+                  transform: `translate(${y ? -U.scrollOffset : U.scrollOffset}px, ${E.scrollOffset}px)`,
+                  height: x > 1 ? E.size : "100%",
                   width: U.size
                 }
               }
             )
           );
         }
+        L.push(
+          /* @__PURE__ */ J("div", { role: "row", "aria-rowindex": b + 1, children: M }, b)
+        );
       }
     return L;
   }, [
-    g,
+    v,
     z,
-    r,
+    s,
     p,
     m,
     B,
     H,
     y,
-    v,
-    b,
+    x,
+    O,
     F
   ]);
-  return /* @__PURE__ */ D(
+  return /* @__PURE__ */ C(
     "div",
     {
+      "aria-colcount": s,
+      "aria-rowcount": x,
       role: "grid",
       ...w,
-      className: s,
+      className: r,
       dir: c,
-      ref: h,
+      ref: a,
       style: {
+        position: "relative",
         width: "100%",
         height: "100%",
-        ...x,
         maxHeight: "100%",
         maxWidth: "100%",
         flexGrow: 1,
-        overflow: "auto"
+        overflow: "auto",
+        ...h
       },
-      children: /* @__PURE__ */ D(
-        "div",
-        {
-          className: s,
-          style: {
-            position: "relative",
-            height: G(),
-            width: T()
-          },
-          children: oe
-        }
-      )
+      children: [
+        ne,
+        /* @__PURE__ */ J(
+          "div",
+          {
+            "aria-hidden": !0,
+            style: {
+              height: k(),
+              width: T(),
+              zIndex: -1
+            }
+          }
+        )
+      ]
     }
   );
 }
-const xe = E, we = q;
-function me({
+const ye = j, be = Y;
+function Ie({
   className: e,
   defaultHeight: t = 0,
-  listRef: s,
-  onResize: r,
+  listRef: r,
+  onResize: s,
   onRowsRendered: o,
   overscanCount: i = 3,
-  rowComponent: n,
+  rowComponent: l,
   rowCount: c,
-  rowHeight: l,
+  rowHeight: n,
   rowProps: f,
-  style: a,
+  style: g,
   ...I
 }) {
-  const v = se(f), k = W(
-    () => _(n, re),
-    [n]
-  ), [x, w] = E(null), {
+  const x = oe(f), S = A(
+    () => ee(l, ie),
+    [l]
+  ), [h, w] = j(null), {
     getCellBounds: z,
-    getEstimatedSize: g,
-    scrollToIndex: u,
-    startIndex: h,
+    getEstimatedSize: v,
+    scrollToIndex: d,
+    startIndex: a,
     stopIndex: y
-  } = C({
-    containerElement: x,
+  } = K({
+    containerElement: h,
     defaultContainerSize: t,
     direction: "vertical",
     itemCount: c,
-    itemProps: v,
-    itemSize: l,
-    onResize: r,
+    itemProps: x,
+    itemSize: n,
+    onResize: s,
     overscanCount: i
   });
-  N(
-    s,
+  te(
+    r,
     () => ({
       get element() {
-        return x;
+        return h;
       },
       scrollToRow({
         align: T = "auto",
         behavior: p = "auto",
-        index: d
+        index: u
       }) {
-        u({
+        const m = d({
           align: T,
+          containerScrollOffset: h?.scrollTop ?? 0,
+          index: u
+        });
+        typeof h?.scrollTo == "function" && h.scrollTo({
           behavior: p,
-          containerScrollOffset: x?.scrollTop ?? 0,
-          index: d
+          top: m
         });
       }
     }),
-    [x, u]
-  ), K(() => {
-    h >= 0 && y >= 0 && o && o({
-      startIndex: h,
+    [h, d]
+  ), X(() => {
+    a >= 0 && y >= 0 && o && o({
+      startIndex: a,
       stopIndex: y
     });
-  }, [o, h, y]);
-  const B = W(() => {
+  }, [o, a, y]);
+  const B = A(() => {
     const T = [];
     if (c > 0)
-      for (let p = h; p <= y; p++) {
-        const d = z(p);
+      for (let p = a; p <= y; p++) {
+        const u = z(p);
         T.push(
-          /* @__PURE__ */ ee(
-            k,
+          /* @__PURE__ */ se(
+            S,
             {
-              ...v,
+              ...x,
+              ariaAttributes: {
+                "aria-posinset": p + 1,
+                "aria-setsize": c,
+                role: "listitem"
+              },
               key: p,
               index: p,
               style: {
                 position: "absolute",
                 left: 0,
-                transform: `translateY(${d.scrollOffset}px)`,
-                height: d.size,
+                transform: `translateY(${u.scrollOffset}px)`,
+                height: u.size,
                 width: "100%"
               }
             }
@@ -715,8 +745,8 @@ function me({
         );
       }
     return T;
-  }, [k, z, c, v, h, y]);
-  return /* @__PURE__ */ D(
+  }, [S, z, c, x, a, y]);
+  return /* @__PURE__ */ C(
     "div",
     {
       role: "list",
@@ -724,42 +754,45 @@ function me({
       className: e,
       ref: w,
       style: {
-        ...a,
+        position: "relative",
         maxHeight: "100%",
         flexGrow: 1,
-        overflowY: "auto"
+        overflowY: "auto",
+        ...g
       },
-      children: /* @__PURE__ */ D(
-        "div",
-        {
-          className: e,
-          style: {
-            height: g(),
-            position: "relative",
-            width: "100%"
-          },
-          children: B
-        }
-      )
+      children: [
+        B,
+        /* @__PURE__ */ J(
+          "div",
+          {
+            "aria-hidden": !0,
+            style: {
+              height: v(),
+              width: "100%",
+              zIndex: -1
+            }
+          }
+        )
+      ]
     }
   );
 }
-const ye = E, be = q;
+const ze = j, Oe = Y;
 let P = -1;
-function Ie(e = !1) {
+function Te(e = !1) {
   if (P === -1 || e) {
-    const t = document.createElement("div"), s = t.style;
-    s.width = "50px", s.height = "50px", s.overflow = "scroll", document.body.appendChild(t), P = t.offsetWidth - t.clientWidth, document.body.removeChild(t);
+    const t = document.createElement("div"), r = t.style;
+    r.width = "50px", r.height = "50px", r.overflow = "scroll", document.body.appendChild(t), P = t.offsetWidth - t.clientWidth, document.body.removeChild(t);
   }
   return P;
 }
 export {
-  ve as Grid,
-  me as List,
-  Ie as getScrollbarSize,
-  xe as useGridCallbackRef,
-  we as useGridRef,
-  ye as useListCallbackRef,
-  be as useListRef
+  we as Grid,
+  Ie as List,
+  Te as getScrollbarSize,
+  ye as useGridCallbackRef,
+  be as useGridRef,
+  ze as useListCallbackRef,
+  Oe as useListRef
 };
 //# sourceMappingURL=react-window.js.map