@react-aria/virtualizer 4.1.12 → 4.2.0

package/dist/utils.main.js

@@ -1,80 +0,0 @@
-
-function $parcel$export(e, n, v, s) {
-  Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
-}
-
-$parcel$export(module.exports, "getRTLOffsetType", () => $efdd61e59e023a1d$export$faf7630257ad4304);
-$parcel$export(module.exports, "getScrollLeft", () => $efdd61e59e023a1d$export$1389d168952b34b5);
-$parcel$export(module.exports, "setScrollLeft", () => $efdd61e59e023a1d$export$ed5fd5ffe5ab0ac);
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */ let $efdd61e59e023a1d$var$cachedRTLResult = null;
-function $efdd61e59e023a1d$export$faf7630257ad4304(recalculate = false) {
-    if ($efdd61e59e023a1d$var$cachedRTLResult === null || recalculate) {
-        const outerDiv = document.createElement('div');
-        const outerStyle = outerDiv.style;
-        outerStyle.width = '50px';
-        outerStyle.height = '50px';
-        outerStyle.overflow = 'scroll';
-        outerStyle.direction = 'rtl';
-        const innerDiv = document.createElement('div');
-        const innerStyle = innerDiv.style;
-        innerStyle.width = '100px';
-        innerStyle.height = '100px';
-        outerDiv.appendChild(innerDiv);
-        document.body.appendChild(outerDiv);
-        if (outerDiv.scrollLeft > 0) $efdd61e59e023a1d$var$cachedRTLResult = 'positive-descending';
-        else {
-            outerDiv.scrollLeft = 1;
-            if (outerDiv.scrollLeft === 0) $efdd61e59e023a1d$var$cachedRTLResult = 'negative';
-            else $efdd61e59e023a1d$var$cachedRTLResult = 'positive-ascending';
-        }
-        document.body.removeChild(outerDiv);
-        return $efdd61e59e023a1d$var$cachedRTLResult;
-    }
-    return $efdd61e59e023a1d$var$cachedRTLResult;
-}
-function $efdd61e59e023a1d$export$1389d168952b34b5(node, direction) {
-    let { scrollLeft: scrollLeft } = node;
-    // scrollLeft in rtl locales differs across browsers, so normalize.
-    // See comment by getRTLOffsetType below for details.
-    if (direction === 'rtl') {
-        let { scrollWidth: scrollWidth, clientWidth: clientWidth } = node;
-        switch($efdd61e59e023a1d$export$faf7630257ad4304()){
-            case 'negative':
-                scrollLeft = -scrollLeft;
-                break;
-            case 'positive-descending':
-                scrollLeft = scrollWidth - clientWidth - scrollLeft;
-                break;
-        }
-    }
-    return scrollLeft;
-}
-function $efdd61e59e023a1d$export$ed5fd5ffe5ab0ac(node, direction, scrollLeft) {
-    if (direction === 'rtl') switch($efdd61e59e023a1d$export$faf7630257ad4304()){
-        case 'negative':
-            scrollLeft = -scrollLeft;
-            break;
-        case 'positive-ascending':
-            break;
-        default:
-            {
-                const { clientWidth: clientWidth, scrollWidth: scrollWidth } = node;
-                scrollLeft = scrollWidth - clientWidth - scrollLeft;
-                break;
-            }
-    }
-    node.scrollLeft = scrollLeft;
-}
-
-
-//# sourceMappingURL=utils.main.js.map

package/dist/utils.main.js.map

@@ -1 +0,0 @@
-{"mappings":";;;;;;;;AAAA;;;;;;;;;;CAUC,GASD,IAAI,wCAAwC;AAarC,SAAS,0CAAiB,cAAuB,KAAK;IAC3D,IAAI,0CAAoB,QAAQ,aAAa;QAC3C,MAAM,WAAW,SAAS,aAAa,CAAC;QACxC,MAAM,aAAa,SAAS,KAAK;QACjC,WAAW,KAAK,GAAG;QACnB,WAAW,MAAM,GAAG;QACpB,WAAW,QAAQ,GAAG;QACtB,WAAW,SAAS,GAAG;QAEvB,MAAM,WAAW,SAAS,aAAa,CAAC;QACxC,MAAM,aAAa,SAAS,KAAK;QACjC,WAAW,KAAK,GAAG;QACnB,WAAW,MAAM,GAAG;QAEpB,SAAS,WAAW,CAAC;QAErB,SAAS,IAAI,CAAC,WAAW,CAAC;QAE1B,IAAI,SAAS,UAAU,GAAG,GACxB,wCAAkB;aACb;YACL,SAAS,UAAU,GAAG;YACtB,IAAI,SAAS,UAAU,KAAK,GAC1B,wCAAkB;iBAElB,wCAAkB;QAEtB;QAEA,SAAS,IAAI,CAAC,WAAW,CAAC;QAE1B,OAAO;IACT;IAEA,OAAO;AACT;AAEO,SAAS,0CAAc,IAAa,EAAE,SAAoB;IAC/D,IAAI,cAAC,UAAU,EAAC,GAAG;IAEnB,mEAAmE;IACnE,qDAAqD;IACrD,IAAI,cAAc,OAAO;QACvB,IAAI,eAAC,WAAW,eAAE,WAAW,EAAC,GAAG;QACjC,OAAQ;YACN,KAAK;gBACH,aAAa,CAAC;gBACd;YACF,KAAK;gBACH,aAAa,cAAc,cAAc;gBACzC;QACJ;IACF;IAEA,OAAO;AACT;AAEO,SAAS,yCAAc,IAAa,EAAE,SAAoB,EAAE,UAAkB;IACnF,IAAI,cAAc,OAChB,OAAQ;QACN,KAAK;YACH,aAAa,CAAC;YACd;QACF,KAAK;YACH;QACF;YAAS;gBACP,MAAM,eAAC,WAAW,eAAE,WAAW,EAAC,GAAG;gBACnC,aAAa,cAAc,cAAc;gBACzC;YACF;IACF;IAGF,KAAK,UAAU,GAAG;AACpB","sources":["packages/@react-aria/virtualizer/src/utils.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Direction} from '@react-types/shared';\n\nexport type RTLOffsetType =\n  | 'negative'\n  | 'positive-descending'\n  | 'positive-ascending';\n\nlet cachedRTLResult: RTLOffsetType | null = null;\n\n\n// Original licensing for the following methods can be found in the\n// NOTICE file in the root directory of this source tree.\n// See https://github.com/bvaughn/react-window/blob/master/src/createGridComponent.js\n\n// According to the spec, scrollLeft should be negative for RTL aligned elements.\n// Chrome does not seem to adhere; its scrollLeft values are positive (measured relative to the left).\n// Safari's elastic bounce makes detecting this even more complicated wrt potential false positives.\n// The safest way to check this is to intentionally set a negative offset,\n// and then verify that the subsequent \"scroll\" event matches the negative offset.\n// If it does not match, then we can assume a non-standard RTL scroll implementation.\nexport function getRTLOffsetType(recalculate: boolean = false): RTLOffsetType {\n  if (cachedRTLResult === null || recalculate) {\n    const outerDiv = document.createElement('div');\n    const outerStyle = outerDiv.style;\n    outerStyle.width = '50px';\n    outerStyle.height = '50px';\n    outerStyle.overflow = 'scroll';\n    outerStyle.direction = 'rtl';\n\n    const innerDiv = document.createElement('div');\n    const innerStyle = innerDiv.style;\n    innerStyle.width = '100px';\n    innerStyle.height = '100px';\n\n    outerDiv.appendChild(innerDiv);\n\n    document.body.appendChild(outerDiv);\n\n    if (outerDiv.scrollLeft > 0) {\n      cachedRTLResult = 'positive-descending';\n    } else {\n      outerDiv.scrollLeft = 1;\n      if (outerDiv.scrollLeft === 0) {\n        cachedRTLResult = 'negative';\n      } else {\n        cachedRTLResult = 'positive-ascending';\n      }\n    }\n\n    document.body.removeChild(outerDiv);\n\n    return cachedRTLResult;\n  }\n\n  return cachedRTLResult;\n}\n\nexport function getScrollLeft(node: Element, direction: Direction): number {\n  let {scrollLeft} = node;\n\n  // scrollLeft in rtl locales differs across browsers, so normalize.\n  // See comment by getRTLOffsetType below for details.\n  if (direction === 'rtl') {\n    let {scrollWidth, clientWidth} = node;\n    switch (getRTLOffsetType()) {\n      case 'negative':\n        scrollLeft = -scrollLeft;\n        break;\n      case 'positive-descending':\n        scrollLeft = scrollWidth - clientWidth - scrollLeft;\n        break;\n    }\n  }\n\n  return scrollLeft;\n}\n\nexport function setScrollLeft(node: Element, direction: Direction, scrollLeft: number): void {\n  if (direction === 'rtl') {\n    switch (getRTLOffsetType()) {\n      case 'negative':\n        scrollLeft = -scrollLeft;\n        break;\n      case 'positive-ascending':\n        break;\n      default: {\n        const {clientWidth, scrollWidth} = node;\n        scrollLeft = scrollWidth - clientWidth - scrollLeft;\n        break;\n      }\n    }\n  }\n\n  node.scrollLeft = scrollLeft;\n}\n"],"names":[],"version":3,"file":"utils.main.js.map"}

package/dist/utils.mjs

@@ -1,73 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */ let $ce415dc67314b753$var$cachedRTLResult = null;
-function $ce415dc67314b753$export$faf7630257ad4304(recalculate = false) {
-    if ($ce415dc67314b753$var$cachedRTLResult === null || recalculate) {
-        const outerDiv = document.createElement('div');
-        const outerStyle = outerDiv.style;
-        outerStyle.width = '50px';
-        outerStyle.height = '50px';
-        outerStyle.overflow = 'scroll';
-        outerStyle.direction = 'rtl';
-        const innerDiv = document.createElement('div');
-        const innerStyle = innerDiv.style;
-        innerStyle.width = '100px';
-        innerStyle.height = '100px';
-        outerDiv.appendChild(innerDiv);
-        document.body.appendChild(outerDiv);
-        if (outerDiv.scrollLeft > 0) $ce415dc67314b753$var$cachedRTLResult = 'positive-descending';
-        else {
-            outerDiv.scrollLeft = 1;
-            if (outerDiv.scrollLeft === 0) $ce415dc67314b753$var$cachedRTLResult = 'negative';
-            else $ce415dc67314b753$var$cachedRTLResult = 'positive-ascending';
-        }
-        document.body.removeChild(outerDiv);
-        return $ce415dc67314b753$var$cachedRTLResult;
-    }
-    return $ce415dc67314b753$var$cachedRTLResult;
-}
-function $ce415dc67314b753$export$1389d168952b34b5(node, direction) {
-    let { scrollLeft: scrollLeft } = node;
-    // scrollLeft in rtl locales differs across browsers, so normalize.
-    // See comment by getRTLOffsetType below for details.
-    if (direction === 'rtl') {
-        let { scrollWidth: scrollWidth, clientWidth: clientWidth } = node;
-        switch($ce415dc67314b753$export$faf7630257ad4304()){
-            case 'negative':
-                scrollLeft = -scrollLeft;
-                break;
-            case 'positive-descending':
-                scrollLeft = scrollWidth - clientWidth - scrollLeft;
-                break;
-        }
-    }
-    return scrollLeft;
-}
-function $ce415dc67314b753$export$ed5fd5ffe5ab0ac(node, direction, scrollLeft) {
-    if (direction === 'rtl') switch($ce415dc67314b753$export$faf7630257ad4304()){
-        case 'negative':
-            scrollLeft = -scrollLeft;
-            break;
-        case 'positive-ascending':
-            break;
-        default:
-            {
-                const { clientWidth: clientWidth, scrollWidth: scrollWidth } = node;
-                scrollLeft = scrollWidth - clientWidth - scrollLeft;
-                break;
-            }
-    }
-    node.scrollLeft = scrollLeft;
-}
-
-
-export {$ce415dc67314b753$export$faf7630257ad4304 as getRTLOffsetType, $ce415dc67314b753$export$1389d168952b34b5 as getScrollLeft, $ce415dc67314b753$export$ed5fd5ffe5ab0ac as setScrollLeft};
-//# sourceMappingURL=utils.module.js.map

package/dist/utils.module.js

@@ -1,73 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */ let $ce415dc67314b753$var$cachedRTLResult = null;
-function $ce415dc67314b753$export$faf7630257ad4304(recalculate = false) {
-    if ($ce415dc67314b753$var$cachedRTLResult === null || recalculate) {
-        const outerDiv = document.createElement('div');
-        const outerStyle = outerDiv.style;
-        outerStyle.width = '50px';
-        outerStyle.height = '50px';
-        outerStyle.overflow = 'scroll';
-        outerStyle.direction = 'rtl';
-        const innerDiv = document.createElement('div');
-        const innerStyle = innerDiv.style;
-        innerStyle.width = '100px';
-        innerStyle.height = '100px';
-        outerDiv.appendChild(innerDiv);
-        document.body.appendChild(outerDiv);
-        if (outerDiv.scrollLeft > 0) $ce415dc67314b753$var$cachedRTLResult = 'positive-descending';
-        else {
-            outerDiv.scrollLeft = 1;
-            if (outerDiv.scrollLeft === 0) $ce415dc67314b753$var$cachedRTLResult = 'negative';
-            else $ce415dc67314b753$var$cachedRTLResult = 'positive-ascending';
-        }
-        document.body.removeChild(outerDiv);
-        return $ce415dc67314b753$var$cachedRTLResult;
-    }
-    return $ce415dc67314b753$var$cachedRTLResult;
-}
-function $ce415dc67314b753$export$1389d168952b34b5(node, direction) {
-    let { scrollLeft: scrollLeft } = node;
-    // scrollLeft in rtl locales differs across browsers, so normalize.
-    // See comment by getRTLOffsetType below for details.
-    if (direction === 'rtl') {
-        let { scrollWidth: scrollWidth, clientWidth: clientWidth } = node;
-        switch($ce415dc67314b753$export$faf7630257ad4304()){
-            case 'negative':
-                scrollLeft = -scrollLeft;
-                break;
-            case 'positive-descending':
-                scrollLeft = scrollWidth - clientWidth - scrollLeft;
-                break;
-        }
-    }
-    return scrollLeft;
-}
-function $ce415dc67314b753$export$ed5fd5ffe5ab0ac(node, direction, scrollLeft) {
-    if (direction === 'rtl') switch($ce415dc67314b753$export$faf7630257ad4304()){
-        case 'negative':
-            scrollLeft = -scrollLeft;
-            break;
-        case 'positive-ascending':
-            break;
-        default:
-            {
-                const { clientWidth: clientWidth, scrollWidth: scrollWidth } = node;
-                scrollLeft = scrollWidth - clientWidth - scrollLeft;
-                break;
-            }
-    }
-    node.scrollLeft = scrollLeft;
-}
-
-
-export {$ce415dc67314b753$export$faf7630257ad4304 as getRTLOffsetType, $ce415dc67314b753$export$1389d168952b34b5 as getScrollLeft, $ce415dc67314b753$export$ed5fd5ffe5ab0ac as setScrollLeft};
-//# sourceMappingURL=utils.module.js.map

package/dist/utils.module.js.map

@@ -1 +0,0 @@
-{"mappings":"AAAA;;;;;;;;;;CAUC,GASD,IAAI,wCAAwC;AAarC,SAAS,0CAAiB,cAAuB,KAAK;IAC3D,IAAI,0CAAoB,QAAQ,aAAa;QAC3C,MAAM,WAAW,SAAS,aAAa,CAAC;QACxC,MAAM,aAAa,SAAS,KAAK;QACjC,WAAW,KAAK,GAAG;QACnB,WAAW,MAAM,GAAG;QACpB,WAAW,QAAQ,GAAG;QACtB,WAAW,SAAS,GAAG;QAEvB,MAAM,WAAW,SAAS,aAAa,CAAC;QACxC,MAAM,aAAa,SAAS,KAAK;QACjC,WAAW,KAAK,GAAG;QACnB,WAAW,MAAM,GAAG;QAEpB,SAAS,WAAW,CAAC;QAErB,SAAS,IAAI,CAAC,WAAW,CAAC;QAE1B,IAAI,SAAS,UAAU,GAAG,GACxB,wCAAkB;aACb;YACL,SAAS,UAAU,GAAG;YACtB,IAAI,SAAS,UAAU,KAAK,GAC1B,wCAAkB;iBAElB,wCAAkB;QAEtB;QAEA,SAAS,IAAI,CAAC,WAAW,CAAC;QAE1B,OAAO;IACT;IAEA,OAAO;AACT;AAEO,SAAS,0CAAc,IAAa,EAAE,SAAoB;IAC/D,IAAI,cAAC,UAAU,EAAC,GAAG;IAEnB,mEAAmE;IACnE,qDAAqD;IACrD,IAAI,cAAc,OAAO;QACvB,IAAI,eAAC,WAAW,eAAE,WAAW,EAAC,GAAG;QACjC,OAAQ;YACN,KAAK;gBACH,aAAa,CAAC;gBACd;YACF,KAAK;gBACH,aAAa,cAAc,cAAc;gBACzC;QACJ;IACF;IAEA,OAAO;AACT;AAEO,SAAS,yCAAc,IAAa,EAAE,SAAoB,EAAE,UAAkB;IACnF,IAAI,cAAc,OAChB,OAAQ;QACN,KAAK;YACH,aAAa,CAAC;YACd;QACF,KAAK;YACH;QACF;YAAS;gBACP,MAAM,eAAC,WAAW,eAAE,WAAW,EAAC,GAAG;gBACnC,aAAa,cAAc,cAAc;gBACzC;YACF;IACF;IAGF,KAAK,UAAU,GAAG;AACpB","sources":["packages/@react-aria/virtualizer/src/utils.ts"],"sourcesContent":["/*\n * Copyright 2020 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {Direction} from '@react-types/shared';\n\nexport type RTLOffsetType =\n  | 'negative'\n  | 'positive-descending'\n  | 'positive-ascending';\n\nlet cachedRTLResult: RTLOffsetType | null = null;\n\n\n// Original licensing for the following methods can be found in the\n// NOTICE file in the root directory of this source tree.\n// See https://github.com/bvaughn/react-window/blob/master/src/createGridComponent.js\n\n// According to the spec, scrollLeft should be negative for RTL aligned elements.\n// Chrome does not seem to adhere; its scrollLeft values are positive (measured relative to the left).\n// Safari's elastic bounce makes detecting this even more complicated wrt potential false positives.\n// The safest way to check this is to intentionally set a negative offset,\n// and then verify that the subsequent \"scroll\" event matches the negative offset.\n// If it does not match, then we can assume a non-standard RTL scroll implementation.\nexport function getRTLOffsetType(recalculate: boolean = false): RTLOffsetType {\n  if (cachedRTLResult === null || recalculate) {\n    const outerDiv = document.createElement('div');\n    const outerStyle = outerDiv.style;\n    outerStyle.width = '50px';\n    outerStyle.height = '50px';\n    outerStyle.overflow = 'scroll';\n    outerStyle.direction = 'rtl';\n\n    const innerDiv = document.createElement('div');\n    const innerStyle = innerDiv.style;\n    innerStyle.width = '100px';\n    innerStyle.height = '100px';\n\n    outerDiv.appendChild(innerDiv);\n\n    document.body.appendChild(outerDiv);\n\n    if (outerDiv.scrollLeft > 0) {\n      cachedRTLResult = 'positive-descending';\n    } else {\n      outerDiv.scrollLeft = 1;\n      if (outerDiv.scrollLeft === 0) {\n        cachedRTLResult = 'negative';\n      } else {\n        cachedRTLResult = 'positive-ascending';\n      }\n    }\n\n    document.body.removeChild(outerDiv);\n\n    return cachedRTLResult;\n  }\n\n  return cachedRTLResult;\n}\n\nexport function getScrollLeft(node: Element, direction: Direction): number {\n  let {scrollLeft} = node;\n\n  // scrollLeft in rtl locales differs across browsers, so normalize.\n  // See comment by getRTLOffsetType below for details.\n  if (direction === 'rtl') {\n    let {scrollWidth, clientWidth} = node;\n    switch (getRTLOffsetType()) {\n      case 'negative':\n        scrollLeft = -scrollLeft;\n        break;\n      case 'positive-descending':\n        scrollLeft = scrollWidth - clientWidth - scrollLeft;\n        break;\n    }\n  }\n\n  return scrollLeft;\n}\n\nexport function setScrollLeft(node: Element, direction: Direction, scrollLeft: number): void {\n  if (direction === 'rtl') {\n    switch (getRTLOffsetType()) {\n      case 'negative':\n        scrollLeft = -scrollLeft;\n        break;\n      case 'positive-ascending':\n        break;\n      default: {\n        const {clientWidth, scrollWidth} = node;\n        scrollLeft = scrollWidth - clientWidth - scrollLeft;\n        break;\n      }\n    }\n  }\n\n  node.scrollLeft = scrollLeft;\n}\n"],"names":[],"version":3,"file":"utils.module.js.map"}

package/src/ScrollView.tsx

@@ -1,282 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-// @ts-ignore
-import {flushSync} from 'react-dom';
-import {getScrollLeft} from './utils';
-import React, {
-  CSSProperties,
-  ForwardedRef,
-  HTMLAttributes,
-  ReactNode,
-  RefObject,
-  useCallback,
-  useEffect,
-  useRef,
-  useState
-} from 'react';
-import {Rect, Size} from '@react-stately/virtualizer';
-import {useEffectEvent, useEvent, useLayoutEffect, useObjectRef, useResizeObserver} from '@react-aria/utils';
-import {useLocale} from '@react-aria/i18n';
-
-interface ScrollViewProps extends HTMLAttributes<HTMLElement> {
-  contentSize: Size,
-  onVisibleRectChange: (rect: Rect) => void,
-  children?: ReactNode,
-  innerStyle?: CSSProperties,
-  onScrollStart?: () => void,
-  onScrollEnd?: () => void,
-  scrollDirection?: 'horizontal' | 'vertical' | 'both'
-}
-
-function ScrollView(props: ScrollViewProps, ref: ForwardedRef<HTMLDivElement | null>) {
-  ref = useObjectRef(ref);
-  let {scrollViewProps, contentProps} = useScrollView(props, ref);
-
-  return (
-    <div role="presentation" {...scrollViewProps} ref={ref}>
-      <div {...contentProps}>
-        {props.children}
-      </div>
-    </div>
-  );
-}
-
-const ScrollViewForwardRef:
-  React.ForwardRefExoticComponent<ScrollViewProps & React.RefAttributes<HTMLDivElement | null>> =
-React.forwardRef(ScrollView);
-export {ScrollViewForwardRef as ScrollView};
-
-interface ScrollViewAria {
-  isScrolling: boolean,
-  scrollViewProps: HTMLAttributes<HTMLElement>,
-  contentProps: HTMLAttributes<HTMLElement>
-}
-
-export function useScrollView(props: ScrollViewProps, ref: RefObject<HTMLElement | null>): ScrollViewAria {
-  let {
-    contentSize,
-    onVisibleRectChange,
-    innerStyle,
-    onScrollStart,
-    onScrollEnd,
-    scrollDirection = 'both',
-    ...otherProps
-  } = props;
-
-  let state = useRef({
-    scrollTop: 0,
-    scrollLeft: 0,
-    scrollEndTime: 0,
-    scrollTimeout: null as ReturnType<typeof setTimeout> | null,
-    width: 0,
-    height: 0,
-    isScrolling: false
-  }).current;
-  let {direction} = useLocale();
-
-  let [isScrolling, setScrolling] = useState(false);
-
-  let onScroll = useCallback((e) => {
-    if (e.target !== e.currentTarget) {
-      return;
-    }
-
-    if (props.onScroll) {
-      props.onScroll(e);
-    }
-
-    flushSync(() => {
-      let scrollTop = e.currentTarget.scrollTop;
-      let scrollLeft = getScrollLeft(e.currentTarget, direction);
-
-      // Prevent rubber band scrolling from shaking when scrolling out of bounds
-      state.scrollTop = Math.max(0, Math.min(scrollTop, contentSize.height - state.height));
-      state.scrollLeft = Math.max(0, Math.min(scrollLeft, contentSize.width - state.width));
-      onVisibleRectChange(new Rect(state.scrollLeft, state.scrollTop, state.width, state.height));
-
-      if (!state.isScrolling) {
-        state.isScrolling = true;
-        setScrolling(true);
-
-        // Pause typekit MutationObserver during scrolling.
-        window.dispatchEvent(new Event('tk.disconnect-observer'));
-        if (onScrollStart) {
-          onScrollStart();
-        }
-      }
-
-      // So we don't constantly call clearTimeout and setTimeout,
-      // keep track of the current timeout time and only reschedule
-      // the timer when it is getting close.
-      let now = Date.now();
-      if (state.scrollEndTime <= now + 50) {
-        state.scrollEndTime = now + 300;
-
-        if (state.scrollTimeout != null) {
-          clearTimeout(state.scrollTimeout);
-        }
-
-        state.scrollTimeout = setTimeout(() => {
-          state.isScrolling = false;
-          setScrolling(false);
-          state.scrollTimeout = null;
-
-          window.dispatchEvent(new Event('tk.connect-observer'));
-          if (onScrollEnd) {
-            onScrollEnd();
-          }
-        }, 300);
-      }
-    });
-  }, [props, direction, state, contentSize, onVisibleRectChange, onScrollStart, onScrollEnd]);
-
-  // Attach event directly to ref so RAC Virtualizer doesn't need to send props upward.
-  useEvent(ref, 'scroll', onScroll);
-
-  useEffect(() => {
-    return () => {
-      if (state.scrollTimeout != null) {
-        clearTimeout(state.scrollTimeout);
-      }
-
-      if (state.isScrolling) {
-        window.dispatchEvent(new Event('tk.connect-observer'));
-      }
-    };
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  let isUpdatingSize = useRef(false);
-  let updateSize = useCallback((flush: typeof flushSync) => {
-    let dom = ref.current;
-    if (!dom || isUpdatingSize.current) {
-      return;
-    }
-
-    // Prevent reentrancy when resize observer fires, triggers re-layout that results in
-    // content size update, causing below layout effect to fire. This avoids infinite loops.
-    isUpdatingSize.current = true;
-
-    let isTestEnv = process.env.NODE_ENV === 'test' && !process.env.VIRT_ON;
-    let isClientWidthMocked = Object.getOwnPropertyNames(window.HTMLElement.prototype).includes('clientWidth');
-    let isClientHeightMocked = Object.getOwnPropertyNames(window.HTMLElement.prototype).includes('clientHeight');
-    let clientWidth = dom.clientWidth;
-    let clientHeight = dom.clientHeight;
-    let w = isTestEnv && !isClientWidthMocked ? Infinity : clientWidth;
-    let h = isTestEnv && !isClientHeightMocked ? Infinity : clientHeight;
-
-    if (state.width !== w || state.height !== h) {
-      state.width = w;
-      state.height = h;
-      flush(() => {
-        onVisibleRectChange(new Rect(state.scrollLeft, state.scrollTop, w, h));
-      });
-
-      // If the clientWidth or clientHeight changed, scrollbars appeared or disappeared as
-      // a result of the layout update. In this case, re-layout again to account for the
-      // adjusted space. In very specific cases this might result in the scrollbars disappearing
-      // again, resulting in extra padding. We stop after a maximum of two layout passes to avoid
-      // an infinite loop. This matches how browsers behavior with native CSS grid layout.
-      if (!isTestEnv && clientWidth !== dom.clientWidth || clientHeight !== dom.clientHeight) {
-        state.width = dom.clientWidth;
-        state.height = dom.clientHeight;
-        flush(() => {
-          onVisibleRectChange(new Rect(state.scrollLeft, state.scrollTop, state.width, state.height));
-        });
-      }
-    }
-
-    isUpdatingSize.current = false;
-  }, [ref, state, onVisibleRectChange]);
-  let updateSizeEvent = useEffectEvent(updateSize);
-
-  // Update visible rect when the content size changes, in case scrollbars need to appear or disappear.
-  let lastContentSize = useRef<Size | null>(null);
-  let [update, setUpdate] = useState({});
-  // We only contain a call to setState in here for testing environments.
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  useLayoutEffect(() => {
-    if (!isUpdatingSize.current && (lastContentSize.current == null || !contentSize.equals(lastContentSize.current))) {
-      // React doesn't allow flushSync inside effects, so queue a microtask.
-      // We also need to wait until all refs are set (e.g. when passing a ref down from a parent).
-      // If we are in an `act` environment, update immediately without a microtask so you don't need
-      // to mock timers in tests. In this case, the update is synchronous already.
-      // IS_REACT_ACT_ENVIRONMENT is used by React 18. Previous versions checked for the `jest` global.
-      // https://github.com/reactwg/react-18/discussions/102
-      // @ts-ignore
-      if (typeof IS_REACT_ACT_ENVIRONMENT === 'boolean' ? IS_REACT_ACT_ENVIRONMENT : typeof jest !== 'undefined') {
-        // This is so we update size in a separate render but within the same act. Needs to be setState instead of refs
-        // due to strict mode.
-        setUpdate({});
-        lastContentSize.current = contentSize;
-        return;
-      } else {
-        queueMicrotask(() => updateSizeEvent(flushSync));
-      }
-    }
-
-    lastContentSize.current = contentSize;
-  });
-
-  // Will only run in tests, needs to be in separate effect so it is properly run in the next render in strict mode.
-  useLayoutEffect(() => {
-    updateSizeEvent(fn => fn());
-  }, [update]);
-
-  let onResize = useCallback(() => {
-    updateSize(flushSync);
-  }, [updateSize]);
-
-  // Watch border-box instead of of content-box so that we don't go into
-  // an infinite loop when scrollbars appear or disappear.
-  useResizeObserver({ref, box: 'border-box', onResize});
-
-  let style: React.CSSProperties = {
-    // Reset padding so that relative positioning works correctly. Padding will be done in JS layout.
-    padding: 0,
-    ...otherProps.style
-  };
-
-  if (scrollDirection === 'horizontal') {
-    style.overflowX = 'auto';
-    style.overflowY = 'hidden';
-  } else if (scrollDirection === 'vertical' || contentSize.width === state.width) {
-    // Set overflow-x: hidden if content size is equal to the width of the scroll view.
-    // This prevents horizontal scrollbars from flickering during resizing due to resize observer
-    // firing slower than the frame rate, which may cause an infinite re-render loop.
-    style.overflowY = 'auto';
-    style.overflowX = 'hidden';
-  } else {
-    style.overflow = 'auto';
-  }
-
-  innerStyle = {
-    width: Number.isFinite(contentSize.width) ? contentSize.width : undefined,
-    height: Number.isFinite(contentSize.height) ? contentSize.height : undefined,
-    pointerEvents: isScrolling ? 'none' : 'auto',
-    position: 'relative',
-    ...innerStyle
-  };
-
-  return {
-    isScrolling,
-    scrollViewProps: {
-      ...otherProps,
-      style
-    },
-    contentProps: {
-      role: 'presentation',
-      style: innerStyle
-    }
-  };
-}

package/src/Virtualizer.tsx

@@ -1,113 +0,0 @@
-/*
- * Copyright 2020 Adobe. All rights reserved.
- * This file is licensed to you under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License. You may obtain a copy
- * of the License at http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software distributed under
- * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
- * OF ANY KIND, either express or implied. See the License for the specific language
- * governing permissions and limitations under the License.
- */
-
-import {Collection, Key, RefObject} from '@react-types/shared';
-import {Layout, Rect, ReusableView, useVirtualizerState} from '@react-stately/virtualizer';
-import {mergeProps, useLoadMore, useObjectRef} from '@react-aria/utils';
-import React, {ForwardedRef, HTMLAttributes, ReactElement, ReactNode, useCallback} from 'react';
-import {ScrollView} from './ScrollView';
-import {VirtualizerItem} from './VirtualizerItem';
-
-type RenderWrapper<T extends object, V> = (
-  parent: ReusableView<T, V> | null,
-  reusableView: ReusableView<T, V>,
-  children: ReusableView<T, V>[],
-  renderChildren: (views: ReusableView<T, V>[]) => ReactElement[]
-) => ReactElement | null;
-
-interface VirtualizerProps<T extends object, V, O> extends Omit<HTMLAttributes<HTMLElement>, 'children'> {
-  children: (type: string, content: T) => V,
-  renderWrapper?: RenderWrapper<T, V>,
-  layout: Layout<T, O>,
-  collection: Collection<T>,
-  persistedKeys?: Set<Key> | null,
-  scrollDirection?: 'horizontal' | 'vertical' | 'both',
-  isLoading?: boolean,
-  onLoadMore?: () => void,
-  layoutOptions?: O
-}
-
-// forwardRef doesn't support generic parameters, so cast the result to the correct type
-// https://stackoverflow.com/questions/58469229/react-with-typescript-generics-while-using-react-forwardref
-export const Virtualizer = React.forwardRef(function Virtualizer<T extends object, V extends ReactNode, O>(props: VirtualizerProps<T, V, O>, forwardedRef: ForwardedRef<HTMLDivElement | null>) {
-  let {
-    children: renderView,
-    renderWrapper,
-    layout,
-    collection,
-    scrollDirection,
-    isLoading,
-    onLoadMore,
-    persistedKeys,
-    layoutOptions,
-    ...otherProps
-  } = props;
-
-  let ref = useObjectRef(forwardedRef);
-
-  let state = useVirtualizerState({
-    layout,
-    collection,
-    renderView,
-    onVisibleRectChange(rect) {
-      if (ref.current) {
-        ref.current.scrollLeft = rect.x;
-        ref.current.scrollTop = rect.y;
-      }
-    },
-    persistedKeys,
-    layoutOptions
-  });
-
-  useLoadMore({isLoading, onLoadMore, scrollOffset: 1}, ref);
-  let onVisibleRectChange = useCallback((rect: Rect) => {
-    state.setVisibleRect(rect);
-  }, [state]);
-
-  return (
-    <ScrollView
-      {...mergeProps(otherProps, {onVisibleRectChange})}
-      ref={ref}
-      contentSize={state.contentSize}
-      onScrollStart={state.startScrolling}
-      onScrollEnd={state.endScrolling}
-      scrollDirection={scrollDirection}>
-      {renderChildren(null, state.visibleViews, renderWrapper || defaultRenderWrapper)}
-    </ScrollView>
-  );
-}) as <T extends object, V, O>(props: VirtualizerProps<T, V, O> & {ref?: RefObject<HTMLDivElement | null>}) => ReactElement;
-
-function renderChildren<T extends object, V>(parent: ReusableView<T, V> | null, views: ReusableView<T, V>[], renderWrapper: RenderWrapper<T, V>) {
-  return views.map(view => {
-    return renderWrapper(
-      parent,
-      view,
-      view.children ? Array.from(view.children) : [],
-      childViews => renderChildren(view, childViews, renderWrapper)
-    );
-  });
-}
-
-function defaultRenderWrapper<T extends object, V extends ReactNode>(
-  parent: ReusableView<T, V> | null,
-  reusableView: ReusableView<T, V>
-) {
-  return (
-    <VirtualizerItem
-      key={reusableView.key}
-      layoutInfo={reusableView.layoutInfo!}
-      virtualizer={reusableView.virtualizer}
-      parent={parent?.layoutInfo}>
-      {reusableView.rendered}
-    </VirtualizerItem>
-  );
-}