@tarojs/components-advanced 3.7.0-alpha.2 → 3.7.0-alpha.20

package/dist/components/virtual-list/preset.js

@@ -1,15 +1,21 @@
+import { isWebPlatform } from '@tarojs/shared';
+import { createSelectorQuery, getCurrentInstance, createIntersectionObserver } from '@tarojs/taro';
 import memoizeOne from 'memoize-one';
 import '../../utils/index.js';
 import ListSet from './list-set.js';
 import { isHorizontalFunc, isRtlFunc } from './utils.js';
-import { isCosDistributing } from '../../utils/math.js';
 import { convertNumber2PX } from '../../utils/convert.js';
+import { getRectSizeSync } from '../../utils/dom.js';
+import { isCosDistributing } from '../../utils/math.js';
+import { throttle } from '../../utils/lodash.js';
 
+const isWeb = isWebPlatform();
 let INSTANCE_ID = 0;
 class Preset {
     constructor(props, refresh) {
         this.props = props;
         this.refresh = refresh;
+        this._observer = {};
         this.wrapperField = {
             scrollLeft: 0,
             scrollTop: 0,
@@ -20,9 +26,28 @@ class Preset {
             diffOffset: 0
         };
         this.diffList = [0, 0, 0];
-        this.getItemStyleCache = memoizeOne((_itemSize, _layout, _direction) => {
-            // TODO: Cache of item styles, keyed by item index.
-            return {};
+        this.getItemStyleCache = memoizeOne((itemIndex, itemSize, _flag = this.itemList.refreshCounter) => {
+            itemSize = itemSize || this.itemList.getSize(itemIndex);
+            const style = this.isRelative ? {} : {
+                position: 'absolute',
+            };
+            const offset = convertNumber2PX(this.itemList.getOffsetSizeCache(itemIndex));
+            const size = convertNumber2PX(this.itemList.getSize(itemIndex));
+            const isHorizontal = this.isHorizontal;
+            const isRtl = this.isRtl;
+            style.height = !isHorizontal ? size : '100%';
+            style.width = isHorizontal ? size : '100%';
+            if (!this.isRelative) {
+                const offsetHorizontal = isHorizontal ? offset : 0;
+                style.top = !isHorizontal ? offset : 0;
+                if (isRtl) {
+                    style.right = offsetHorizontal;
+                }
+                else {
+                    style.left = offsetHorizontal;
+                }
+            }
+            return style;
         });
         this.init(this.props);
         this.itemList = new ListSet(props, refresh);
@@ -34,8 +59,33 @@ class Preset {
         this.props = props;
         this.itemList.update(props);
     }
+    async updateWrapper(id) {
+        var _a;
+        var _b, _c;
+        this.id = id;
+        const { width = 0, height = 0 } = this.props;
+        const validWidth = typeof width === 'number' && width > 0;
+        const validHeight = typeof height === 'number' && height > 0;
+        if (validWidth) {
+            this.itemList.wrapperWidth = width;
+        }
+        if (validHeight) {
+            this.itemList.wrapperHeight = height;
+        }
+        if (!validHeight || !validWidth) {
+            const res = await getRectSizeSync(`#${id}`, 100);
+            (_b = this.itemList).wrapperWidth || (_b.wrapperWidth = res.width);
+            (_c = this.itemList).wrapperHeight || (_c.wrapperHeight = res.height);
+            (_a = this.refresh) === null || _a === void 0 ? void 0 : _a.call(this);
+        }
+        this.itemList.update(this.props);
+    }
+    set id(id) {
+        this._id = id;
+    }
     get id() {
-        return `virtual-list-${INSTANCE_ID++}`;
+        this._id || (this._id = `virtual-waterfall-${INSTANCE_ID++}`);
+        return this._id;
     }
     get isHorizontal() {
         return isHorizontalFunc(this.props);
@@ -44,18 +94,21 @@ class Preset {
         return isRtlFunc(this.props);
     }
     get isRelative() {
-        return this.props.position === 'relative';
+        return this.props.position && this.props.position !== 'absolute';
+    }
+    get isBrick() {
+        return this.props.position === 'brick';
     }
     get placeholderCount() {
         return this.props.placeholderCount >= 0 ? this.props.placeholderCount : this.props.overscanCount;
     }
-    get outerTagName() {
+    get outerElement() {
         return this.props.outerElementType || this.props.outerTagName || 'div';
     }
-    get innerTagName() {
+    get innerElement() {
         return this.props.innerElementType || this.props.innerTagName || 'div';
     }
-    get itemTagName() {
+    get itemElement() {
         return this.props.itemElementType || this.props.itemTagName || 'div';
     }
     get field() {
@@ -69,65 +122,68 @@ class Preset {
         //   }
         // })
     }
+    get enhanced() {
+        return this.props.enhanced || true;
+    }
     isShaking(diff) {
+        if (isWeb || this.props.enhanced)
+            return false;
         const list = this.diffList.slice(-3);
         this.diffList.push(diff);
         return list.findIndex(e => Math.abs(e) === Math.abs(diff)) !== -1 || isCosDistributing(this.diffList.slice(-4));
     }
+    resetCache() {
+        this.itemList.refreshCounter++;
+    }
     getItemStyle(index) {
-        const { direction, itemSize, layout, shouldResetStyleCacheOnItemSizeChange } = this.props;
-        const itemStyleCache = this.getItemStyleCache(shouldResetStyleCacheOnItemSizeChange ? itemSize : false, shouldResetStyleCacheOnItemSizeChange ? layout : false, shouldResetStyleCacheOnItemSizeChange ? direction : false);
-        let style;
-        const offset = convertNumber2PX(this.itemList.getOffsetSize(index));
-        const size = convertNumber2PX(this.itemList.getSize(index));
-        const isHorizontal = this.isHorizontal;
-        const isRtl = this.isRtl;
-        if (itemStyleCache.hasOwnProperty(index)) {
-            // Note: style is frozen.
-            style = Object.assign({}, itemStyleCache[index]);
-            if (isHorizontal) {
-                style.width = size;
-                if (!this.isRelative) {
-                    if (isRtl) {
-                        style.right = offset;
-                    }
-                    else {
-                        style.left = offset;
-                    }
-                }
-            }
-            else {
-                style.height = size;
-                if (!this.isRelative) {
-                    style.top = offset;
-                }
-            }
-        }
-        else {
-            if (this.isRelative) {
-                itemStyleCache[index] = style = {
-                    height: !isHorizontal ? size : '100%',
-                    width: isHorizontal ? size : '100%'
-                };
-            }
-            else {
-                const offsetHorizontal = isHorizontal ? offset : 0;
-                itemStyleCache[index] = style = {
-                    position: 'absolute',
-                    left: !isRtl ? offsetHorizontal : undefined,
-                    right: isRtl ? offsetHorizontal : undefined,
-                    top: !isHorizontal ? offset : 0,
-                    height: !isHorizontal ? size : '100%',
-                    width: isHorizontal ? size : '100%'
-                };
+        const { shouldResetStyleCacheOnItemSizeChange } = this.props;
+        return this.getItemStyleCache(index, shouldResetStyleCacheOnItemSizeChange ? this.itemList.getSize(index) : false);
+    }
+    boundaryDetection() {
+        if ([typeof this.props.onScrollToUpper, typeof this.props.onScrollToLower].every(e => e !== 'function'))
+            return;
+        createSelectorQuery().select(`#${this.id}`).node().exec(() => {
+            const upperObserver = this.boundaryDetectionHelper({
+                event: typeof this.props.onScrollToUpper === 'function' ? () => {
+                    if (this.field.diffOffset >= 0)
+                        this.props.onScrollToUpper();
+                } : undefined,
+                id: `${this.id}-${this.isHorizontal ? this.isRtl ? 'right' : 'left' : 'top'}`,
+            });
+            if (upperObserver) {
+                this._observer.top = upperObserver;
             }
-        }
-        for (const k in style) {
-            if (style.hasOwnProperty(k)) {
-                style[k] = convertNumber2PX(style[k]);
+            const lowerObserver = this.boundaryDetectionHelper({
+                event: typeof this.props.onScrollToLower === 'function' ? () => {
+                    if (this.field.diffOffset <= 0)
+                        this.props.onScrollToLower();
+                } : undefined,
+                id: `${this.id}-${this.isHorizontal ? this.isRtl ? 'left' : 'right' : 'bottom'}`,
+            });
+            if (lowerObserver) {
+                this._observer.bottom = lowerObserver;
             }
-        }
-        return style;
+        });
+    }
+    boundaryDetectionHelper({ component, event, id, }) {
+        if (typeof event !== 'function')
+            return;
+        const eventFunc = throttle(event);
+        component || (component = getCurrentInstance().page);
+        const observer = createIntersectionObserver(component, {
+            thresholds: [0.4],
+        });
+        observer
+            .relativeTo(`#${this.id}`, {
+            top: typeof this.props.lowerThreshold === 'number' ? this.props.lowerThreshold : 50,
+            bottom: typeof this.props.upperThreshold === 'number' ? this.props.upperThreshold : 50,
+        })
+            .observe(`#${id}`, eventFunc);
+        return observer;
+    }
+    dispose() {
+        Object.values(this._observer).forEach(e => { var _a; return (_a = e.disconnect) === null || _a === void 0 ? void 0 : _a.call(e); });
+        this._observer = {};
     }
 }
 

package/dist/components/virtual-list/preset.js.map

@@ -1 +1 @@
-{"version":3,"file":"preset.js","sources":["../../../src/components/virtual-list/preset.ts"],"sourcesContent":["import memoizeOne from 'memoize-one'\n\nimport { convertNumber2PX, isCosDistributing } from '../../utils'\nimport ListSet from './list-set'\nimport { defaultItemKey, isHorizontalFunc, isRtlFunc } from './utils'\n\nimport type { VirtualListProps } from './'\n\nlet INSTANCE_ID = 0\n\nexport interface IProps extends Partial<VirtualListProps> {\n  children?: VirtualListProps['item']\n  direction?: 'ltr' | 'rtl' | 'horizontal' | 'vertical'\n  itemKey?: typeof defaultItemKey\n  itemTagName?: string\n  innerTagName?: string\n  outerTagName?: string\n  itemElementType?: React.ComponentType | string\n  outerElementType?: React.ComponentType | string\n  innerRef?: React.Ref<HTMLElement> | string\n  outerRef?: React.Ref<HTMLElement> | string\n  onItemsRendered?: TFunc\n  shouldResetStyleCacheOnItemSizeChange?: boolean\n}\n\nexport default class Preset {\n  itemList: ListSet\n\n  constructor (protected props: IProps, protected refresh?: TFunc) {\n    this.init(this.props)\n    this.itemList = new ListSet(props, refresh)\n  }\n\n  wrapperField = {\n    scrollLeft: 0,\n    scrollTop: 0,\n    scrollHeight: 0,\n    scrollWidth: 0,\n    clientHeight: 0,\n    clientWidth: 0,\n    diffOffset: 0\n  }\n\n  diffList: number[] = [0, 0, 0]\n\n  init (props: IProps) {\n    this.props = props\n  }\n\n  update (props: IProps) {\n    this.props = props\n    this.itemList.update(props)\n  }\n\n  get id () {\n    return `virtual-list-${INSTANCE_ID++}`\n  }\n\n  get isHorizontal () {\n    return isHorizontalFunc(this.props)\n  }\n\n  get isRtl () {\n    return isRtlFunc(this.props)\n  }\n\n  get isRelative () {\n    return this.props.position === 'relative'\n  }\n\n  get placeholderCount () {\n    return this.props.placeholderCount >= 0 ? this.props.placeholderCount : this.props.overscanCount\n  }\n\n  get outerTagName () {\n    return this.props.outerElementType || this.props.outerTagName || 'div'\n  }\n\n  get innerTagName () {\n    return this.props.innerElementType || this.props.innerTagName || 'div'\n  }\n\n  get itemTagName () {\n    return this.props.itemElementType || this.props.itemTagName || 'div'\n  }\n\n  get field () {\n    return this.wrapperField\n  }\n\n  set field (o: Record<string, number>) {\n    Object.assign(this.wrapperField, o)\n    // Object.keys(o).forEach(key => {\n    //   if (typeof o[key] === 'number' && typeof this.wrapperField[key] === 'number') {\n    //     this.wrapperField[key] = o[key]\n    //   }\n    // })\n  }\n\n  isShaking (diff?: number) {\n    const list = this.diffList.slice(-3)\n    this.diffList.push(diff)\n    return list.findIndex(e => Math.abs(e) === Math.abs(diff)) !== -1 || isCosDistributing(this.diffList.slice(-4))\n  }\n\n  getItemStyleCache = memoizeOne((\n    _itemSize?: IProps['itemSize'] | false,\n    _layout?: IProps['layout'] | false,\n    _direction?: IProps['direction'] | false\n  ) => {\n    // TODO: Cache of item styles, keyed by item index.\n    return {}\n  })\n\n  getItemStyle (index: number) {\n    const {\n      direction,\n      itemSize,\n      layout,\n      shouldResetStyleCacheOnItemSizeChange\n    } = this.props\n\n    const itemStyleCache = this.getItemStyleCache(\n      shouldResetStyleCacheOnItemSizeChange ? itemSize : false,\n      shouldResetStyleCacheOnItemSizeChange ? layout : false,\n      shouldResetStyleCacheOnItemSizeChange ? direction : false\n    )\n\n    let style\n\n    const offset = convertNumber2PX(this.itemList.getOffsetSize(index))\n    const size = convertNumber2PX(this.itemList.getSize(index))\n    const isHorizontal = this.isHorizontal\n    const isRtl = this.isRtl\n    if (itemStyleCache.hasOwnProperty(index)) {\n      // Note: style is frozen.\n      style = { ...itemStyleCache[index] }\n      if (isHorizontal) {\n        style.width = size\n        if (!this.isRelative) {\n          if (isRtl) {\n            style.right = offset\n          } else {\n            style.left = offset\n          }\n        }\n      } else {\n        style.height = size\n        if (!this.isRelative) {\n          style.top = offset\n        }\n      }\n    } else {\n      if (this.isRelative) {\n        itemStyleCache[index] = style = {\n          height: !isHorizontal ? size : '100%',\n          width: isHorizontal ? size : '100%'\n        }\n      } else {\n        const offsetHorizontal = isHorizontal ? offset : 0\n        itemStyleCache[index] = style = {\n          position: 'absolute',\n          left: !isRtl ? offsetHorizontal : undefined,\n          right: isRtl ? offsetHorizontal : undefined,\n          top: !isHorizontal ? offset : 0,\n          height: !isHorizontal ? size : '100%',\n          width: isHorizontal ? size : '100%'\n        }\n      }\n    }\n\n    for (const k in style) {\n      if (style.hasOwnProperty(k)) {\n        style[k] = convertNumber2PX(style[k])\n      }\n    }\n\n    return style\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"preset.js","sources":["../../../src/components/virtual-list/preset.ts"],"sourcesContent":["import { isWebPlatform } from '@tarojs/shared'\nimport { type IntersectionObserver, createIntersectionObserver, createSelectorQuery, getCurrentInstance } from '@tarojs/taro'\nimport * as CSS from 'csstype'\nimport memoizeOne from 'memoize-one'\n\nimport { convertNumber2PX, defaultItemKey, getRectSizeSync, isCosDistributing, throttle } from '../../utils'\nimport ListSet from './list-set'\nimport { isHorizontalFunc, isRtlFunc } from './utils'\n\nimport type { VirtualListProps } from './'\n\nconst isWeb = isWebPlatform()\n\nlet INSTANCE_ID = 0\n\nexport interface IProps extends Partial<VirtualListProps> {\n  children?: VirtualListProps['item']\n  direction?: 'ltr' | 'rtl' | 'horizontal' | 'vertical'\n  itemKey?: typeof defaultItemKey\n  itemTagName?: string\n  innerTagName?: string\n  outerTagName?: string\n  innerRef?: React.Ref<HTMLElement> | string\n  outerRef?: React.Ref<HTMLElement> | string\n  onItemsRendered?: TFunc\n  shouldResetStyleCacheOnItemSizeChange?: boolean\n  outerWrapper?: React.FC\n}\n\nexport default class Preset {\n  itemList: ListSet\n  _id: string\n  _observer: Record<string, IntersectionObserver> = {}\n\n  constructor (protected props: IProps, protected refresh?: TFunc) {\n    this.init(this.props)\n    this.itemList = new ListSet(props, refresh)\n  }\n\n  wrapperField = {\n    scrollLeft: 0,\n    scrollTop: 0,\n    scrollHeight: 0,\n    scrollWidth: 0,\n    clientHeight: 0,\n    clientWidth: 0,\n    diffOffset: 0\n  }\n\n  diffList: number[] = [0, 0, 0]\n\n  init (props: IProps) {\n    this.props = props\n  }\n\n  update (props: IProps) {\n    this.props = props\n    this.itemList.update(props)\n  }\n\n  async updateWrapper (id: string) {\n    this.id = id\n    const { width = 0, height = 0 } = this.props\n    const validWidth = typeof width === 'number' && width > 0\n    const validHeight = typeof height === 'number' && height > 0\n    if (validWidth) {\n      this.itemList.wrapperWidth = width\n    }\n    if (validHeight) {\n      this.itemList.wrapperHeight = height\n    }\n\n    if (!validHeight || !validWidth) {\n      const res = await getRectSizeSync(`#${id}`, 100)\n      this.itemList.wrapperWidth ||= res.width\n      this.itemList.wrapperHeight ||= res.height\n      this.refresh?.()\n    }\n\n    this.itemList.update(this.props)\n  }\n\n  set id (id: string) {\n    this._id = id\n  }\n\n  get id () {\n    this._id ||= `virtual-waterfall-${INSTANCE_ID++}`\n    return this._id\n  }\n\n  get isHorizontal () {\n    return isHorizontalFunc(this.props)\n  }\n\n  get isRtl () {\n    return isRtlFunc(this.props)\n  }\n\n  get isRelative () {\n    return this.props.position && this.props.position !== 'absolute'\n  }\n\n  get isBrick () {\n    return this.props.position === 'brick'\n  }\n\n  get placeholderCount () {\n    return this.props.placeholderCount >= 0 ? this.props.placeholderCount : this.props.overscanCount\n  }\n\n  get outerElement () {\n    return this.props.outerElementType || this.props.outerTagName || 'div'\n  }\n\n  get innerElement () {\n    return this.props.innerElementType || this.props.innerTagName || 'div'\n  }\n\n  get itemElement () {\n    return this.props.itemElementType || this.props.itemTagName || 'div'\n  }\n\n  get field () {\n    return this.wrapperField\n  }\n\n  set field (o: Record<string, number>) {\n    Object.assign(this.wrapperField, o)\n    // Object.keys(o).forEach(key => {\n    //   if (typeof o[key] === 'number' && typeof this.wrapperField[key] === 'number') {\n    //     this.wrapperField[key] = o[key]\n    //   }\n    // })\n  }\n\n  get enhanced () {\n    return this.props.enhanced || true\n  }\n\n  isShaking (diff?: number) {\n    if (isWeb || this.props.enhanced) return false\n    const list = this.diffList.slice(-3)\n    this.diffList.push(diff)\n    return list.findIndex(e => Math.abs(e) === Math.abs(diff)) !== -1 || isCosDistributing(this.diffList.slice(-4))\n  }\n\n  resetCache () {\n    this.itemList.refreshCounter++\n  }\n\n  getItemStyleCache = memoizeOne((\n    itemIndex?: number,\n    itemSize?: IProps['itemSize'] | false,\n    _flag = this.itemList.refreshCounter\n  ) => {\n    itemSize = itemSize || this.itemList.getSize(itemIndex)\n    const style: CSS.Properties<string | number> = this.isRelative ? {} : {\n      position: 'absolute',\n    }\n    const offset = convertNumber2PX(this.itemList.getOffsetSizeCache(itemIndex))\n    const size = convertNumber2PX(this.itemList.getSize(itemIndex))\n    const isHorizontal = this.isHorizontal\n    const isRtl = this.isRtl\n    style.height = !isHorizontal ? size : '100%'\n    style.width = isHorizontal ? size : '100%'\n    if (!this.isRelative) {\n      const offsetHorizontal = isHorizontal ? offset : 0\n      style.top = !isHorizontal ? offset : 0\n      if (isRtl) {\n        style.right = offsetHorizontal\n      } else {\n        style.left = offsetHorizontal\n      }\n    }\n\n    return style\n  })\n\n  getItemStyle (index: number) {\n    const {\n      shouldResetStyleCacheOnItemSizeChange\n    } = this.props\n\n    return this.getItemStyleCache(\n      index,\n      shouldResetStyleCacheOnItemSizeChange ? this.itemList.getSize(index) : false,\n    )\n  }\n\n  boundaryDetection () {\n    if ([typeof this.props.onScrollToUpper, typeof this.props.onScrollToLower].every(e => e !== 'function')) return\n\n    createSelectorQuery().select(`#${this.id}`).node().exec(() => {\n      const upperObserver = this.boundaryDetectionHelper({\n        event: typeof this.props.onScrollToUpper === 'function' ? () => {\n          if (this.field.diffOffset >= 0) this.props.onScrollToUpper()\n        } : undefined,\n        id: `${this.id}-${this.isHorizontal ? this.isRtl ? 'right' : 'left' : 'top'}`,\n      })\n      if (upperObserver) {\n        this._observer.top = upperObserver\n      }\n\n      const lowerObserver = this.boundaryDetectionHelper({\n        event: typeof this.props.onScrollToLower === 'function' ? () => {\n          if (this.field.diffOffset <= 0) this.props.onScrollToLower()\n        } : undefined,\n        id: `${this.id}-${this.isHorizontal ? this.isRtl ? 'left' : 'right' : 'bottom'}`,\n      })\n      if (lowerObserver) {\n        this._observer.bottom = lowerObserver\n      }\n    })\n  }\n\n  boundaryDetectionHelper ({\n    component,\n    event,\n    id,\n  }: {\n    component?: TaroGeneral.IAnyObject\n    event?: () => void\n    id: string\n  }) {\n    if (typeof event !== 'function') return\n    const eventFunc = throttle(event)\n\n    component ||= getCurrentInstance().page\n    const observer = createIntersectionObserver(component, {\n      thresholds: [0.4],\n    })\n\n    observer\n      .relativeTo(`#${this.id}`, {\n        top: typeof this.props.lowerThreshold === 'number' ? this.props.lowerThreshold : 50,\n        bottom: typeof this.props.upperThreshold === 'number' ? this.props.upperThreshold : 50,\n      })\n      .observe(`#${id}`, eventFunc)\n\n    return observer\n  }\n\n  dispose () {\n    Object.values(this._observer).forEach(e => e.disconnect?.())\n    this._observer = {}\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/components/virtual-list/react/index.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
-import { VirtualListProps } from "../index";
-declare const VirtualList: React.ForwardRefExoticComponent<Pick<VirtualListProps, "id" | "className" | "style" | "key" | "hidden" | "animation" | "dangerouslySetInnerHTML" | "onTouchStart" | "onTouchMove" | "onTouchCancel" | "onTouchEnd" | "onClick" | "onLongPress" | "onLongClick" | "onTransitionEnd" | "onAnimationStart" | "onAnimationIteration" | "onAnimationEnd" | "onTouchForceChange" | "height" | "width" | "item" | "itemCount" | "itemData" | "itemSize" | "unlimitedSize" | "position" | "initialScrollOffset" | "innerElementType" | "enhanced" | "renderTop" | "renderBottom" | "layout" | "onScroll" | "onScrollNative" | "overscanCount" | "placeholderCount" | "useIsScrolling"> & React.RefAttributes<unknown>>;
+import { VirtualListProps } from "../index.js";
+declare const VirtualList: React.ForwardRefExoticComponent<Omit<VirtualListProps<any>, "ref"> & React.RefAttributes<unknown>>;
 export { VirtualList as default };

package/dist/components/virtual-list/react/index.js

@@ -1,22 +1,11 @@
 import { __rest } from '../../../node_modules/.pnpm/registry.npmjs.org_tslib@2.5.0/node_modules/tslib/tslib.es6.js';
 import { ScrollView, View } from '@tarojs/components';
 import React from 'react';
-import { convertPX2Int } from '../../../utils/convert.js';
 import List from './list.js';
+import outerWrapper from './wrapper.js';
 
-const OuterScrollView = React.forwardRef(function OuterScrollView(props, ref) {
-    const _a = props, { style, onScroll, onScrollNative, layout } = _a, rest = __rest(_a, ["style", "onScroll", "onScrollNative", "layout"]);
-    const handleScroll = (event) => {
-        onScroll(Object.assign(Object.assign({}, event), { currentTarget: Object.assign(Object.assign({}, event.detail), { clientWidth: convertPX2Int(style.width), clientHeight: convertPX2Int(style.height) }) }));
-        if (typeof onScrollNative === 'function') {
-            onScrollNative(event);
-        }
-    };
-    return React.createElement(ScrollView, Object.assign({ ref,
-        style, scrollY: layout === 'vertical', scrollX: layout === 'horizontal', onScroll: handleScroll }, rest));
-});
 const VirtualList = React.forwardRef(function VirtualList(props, ref) {
-    const _a = props, { direction = 'ltr', innerElementType = View, itemElementType = View, initialScrollOffset = 0, overscanCount = 1 } = _a, rest = __rest(_a, ["direction", "innerElementType", "itemElementType", "initialScrollOffset", "overscanCount"]);
+    const _a = props, { direction = 'ltr', outerElementType = ScrollView, innerElementType = View, itemElementType = View, initialScrollOffset = 0, overscanCount = 1 } = _a, rest = __rest(_a, ["direction", "outerElementType", "innerElementType", "itemElementType", "initialScrollOffset", "overscanCount"]);
     if ('children' in rest) {
         console.warn('Taro(VirtualList): children props have been deprecated. ' + 'Please use the item props instead.');
         rest.item = rest.children;
@@ -25,10 +14,13 @@ const VirtualList = React.forwardRef(function VirtualList(props, ref) {
         console.warn('Taro(VirtualList): item should not be an array');
         rest.item = rest.item[0];
     }
-    return React.createElement(List, Object.assign(Object.assign({ ref }, rest), { itemElementType,
-        innerElementType, outerElementType: OuterScrollView, direction,
+    return React.createElement(List, Object.assign(Object.assign({ ref }, rest), { outerElementType,
+        itemElementType,
+        innerElementType,
+        direction,
         initialScrollOffset,
-        overscanCount }));
+        overscanCount,
+        outerWrapper }));
 });
 
 export { VirtualList as default };

package/dist/components/virtual-list/react/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/virtual-list/react/index.ts"],"sourcesContent":["import { ScrollView, View } from '@tarojs/components'\nimport React from 'react'\n\nimport { convertPX2Int } from '../../../utils/convert'\nimport List from './list'\n\nimport type { BaseEventOrig } from '@tarojs/components'\nimport type { VirtualListProps } from '../'\nimport type { IProps } from '../preset'\n\nconst OuterScrollView = React.forwardRef(\n  function OuterScrollView (props, ref) {\n    const { style, onScroll, onScrollNative, layout, ...rest } = props as IProps\n    const handleScroll = (event: BaseEventOrig<VirtualListProps.IVirtualListEventDetail>) => {\n      onScroll({\n        ...event as any,\n        currentTarget: {\n          ...event.detail,\n          clientWidth: convertPX2Int(style.width),\n          clientHeight: convertPX2Int(style.height)\n        } as any\n      })\n\n      if (typeof onScrollNative === 'function') {\n        onScrollNative(event)\n      }\n    }\n\n    return React.createElement<any>(ScrollView, {\n      ref,\n      style,\n      scrollY: layout === 'vertical',\n      scrollX: layout === 'horizontal',\n      onScroll: handleScroll,\n      ...rest\n    })\n  }\n)\n\nconst VirtualList = React.forwardRef(function VirtualList (props: VirtualListProps, ref) {\n  const {\n    direction = 'ltr',\n    innerElementType = View,\n    itemElementType = View,\n    initialScrollOffset = 0,\n    overscanCount = 1,\n    ...rest\n  } = props as IProps\n\n  if ('children' in rest) {\n    console.warn('Taro(VirtualList): children props have been deprecated. ' + 'Please use the item props instead.')\n    rest.item = rest.children as IProps['item']\n  }\n  if (rest.item instanceof Array) {\n    console.warn('Taro(VirtualList): item should not be an array')\n    rest.item = rest.item[0]\n  }\n  return React.createElement(List, {\n    ref,\n    ...rest,\n    itemElementType,\n    innerElementType,\n    outerElementType: OuterScrollView,\n    direction,\n    initialScrollOffset,\n    overscanCount\n  })\n})\n\nexport default VirtualList\n"],"names":[],"mappings":";;;;;;AAUA,MAAM,eAAe,GAAG,KAAK,CAAC,UAAU,CACtC,SAAS,eAAe,CAAE,KAAK,EAAE,GAAG,EAAA;AAClC,IAAA,MAAM,KAAuD,KAAe,EAAtE,EAAE,KAAK,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,EAA6B,GAAA,EAAA,EAAxB,IAAI,GAAlD,MAAA,CAAA,EAAA,EAAA,CAAA,OAAA,EAAA,UAAA,EAAA,gBAAA,EAAA,QAAA,CAAoD,CAAkB,CAAA;AAC5E,IAAA,MAAM,YAAY,GAAG,CAAC,KAA8D,KAAI;AACtF,QAAA,QAAQ,CACH,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,KAAY,CACf,EAAA,EAAA,aAAa,EAAE,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,EACV,KAAK,CAAC,MAAM,CAAA,EAAA,EACf,WAAW,EAAE,aAAa,CAAC,KAAK,CAAC,KAAK,CAAC,EACvC,YAAY,EAAE,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,EAAA,CACnC,IACR,CAAA;AAEF,QAAA,IAAI,OAAO,cAAc,KAAK,UAAU,EAAE;YACxC,cAAc,CAAC,KAAK,CAAC,CAAA;AACtB,SAAA;AACH,KAAC,CAAA;AAED,IAAA,OAAO,KAAK,CAAC,aAAa,CAAM,UAAU,kBACxC,GAAG;AACH,QAAA,KAAK,EACL,OAAO,EAAE,MAAM,KAAK,UAAU,EAC9B,OAAO,EAAE,MAAM,KAAK,YAAY,EAChC,QAAQ,EAAE,YAAY,EACnB,EAAA,IAAI,EACP,CAAA;AACJ,CAAC,CACF,CAAA;AAEK,MAAA,WAAW,GAAG,KAAK,CAAC,UAAU,CAAC,SAAS,WAAW,CAAE,KAAuB,EAAE,GAAG,EAAA;AACrF,IAAA,MAAM,EAOF,GAAA,KAAe,EAPb,EACJ,SAAS,GAAG,KAAK,EACjB,gBAAgB,GAAG,IAAI,EACvB,eAAe,GAAG,IAAI,EACtB,mBAAmB,GAAG,CAAC,EACvB,aAAa,GAAG,CAAC,EAAA,GAAA,EAEA,EADd,IAAI,GANH,MAAA,CAAA,EAAA,EAAA,CAAA,WAAA,EAAA,kBAAA,EAAA,iBAAA,EAAA,qBAAA,EAAA,eAAA,CAOL,CAAkB,CAAA;IAEnB,IAAI,UAAU,IAAI,IAAI,EAAE;AACtB,QAAA,OAAO,CAAC,IAAI,CAAC,0DAA0D,GAAG,oCAAoC,CAAC,CAAA;AAC/G,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,QAA0B,CAAA;AAC5C,KAAA;AACD,IAAA,IAAI,IAAI,CAAC,IAAI,YAAY,KAAK,EAAE;AAC9B,QAAA,OAAO,CAAC,IAAI,CAAC,gDAAgD,CAAC,CAAA;QAC9D,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAA;AACzB,KAAA;IACD,OAAO,KAAK,CAAC,aAAa,CAAC,IAAI,gCAC7B,GAAG,EAAA,EACA,IAAI,CAAA,EAAA,EACP,eAAe;AACf,QAAA,gBAAgB,EAChB,gBAAgB,EAAE,eAAe,EACjC,SAAS;QACT,mBAAmB;AACnB,QAAA,aAAa,IACb,CAAA;AACJ,CAAC;;;;"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/virtual-list/react/index.ts"],"sourcesContent":["import { ScrollView, View } from '@tarojs/components'\nimport React from 'react'\n\nimport List from './list'\nimport outerWrapper from './wrapper'\n\nimport type { VirtualListProps } from '../'\nimport type { IProps } from '../preset'\n\nconst VirtualList = React.forwardRef(function VirtualList (props: VirtualListProps, ref) {\n  const {\n    direction = 'ltr',\n    outerElementType = ScrollView,\n    innerElementType = View,\n    itemElementType = View,\n    initialScrollOffset = 0,\n    overscanCount = 1,\n    ...rest\n  } = props as IProps\n\n  if ('children' in rest) {\n    console.warn('Taro(VirtualList): children props have been deprecated. ' + 'Please use the item props instead.')\n    rest.item = rest.children as IProps['item']\n  }\n  if (rest.item instanceof Array) {\n    console.warn('Taro(VirtualList): item should not be an array')\n    rest.item = rest.item[0]\n  }\n  return React.createElement(List, {\n    ref,\n    ...rest,\n    outerElementType,\n    itemElementType,\n    innerElementType,\n    direction,\n    initialScrollOffset,\n    overscanCount,\n    outerWrapper,\n  })\n})\n\nexport default VirtualList\n"],"names":[],"mappings":";;;;;;AASM,MAAA,WAAW,GAAG,KAAK,CAAC,UAAU,CAAC,SAAS,WAAW,CAAE,KAAuB,EAAE,GAAG,EAAA;AACrF,IAAA,MAAM,EAQF,GAAA,KAAe,EARb,EACJ,SAAS,GAAG,KAAK,EACjB,gBAAgB,GAAG,UAAU,EAC7B,gBAAgB,GAAG,IAAI,EACvB,eAAe,GAAG,IAAI,EACtB,mBAAmB,GAAG,CAAC,EACvB,aAAa,GAAG,CAAC,OAEA,EADd,IAAI,GAPH,MAAA,CAAA,EAAA,EAAA,CAAA,WAAA,EAAA,kBAAA,EAAA,kBAAA,EAAA,iBAAA,EAAA,qBAAA,EAAA,eAAA,CAQL,CAAkB,CAAA;IAEnB,IAAI,UAAU,IAAI,IAAI,EAAE;AACtB,QAAA,OAAO,CAAC,IAAI,CAAC,0DAA0D,GAAG,oCAAoC,CAAC,CAAA;AAC/G,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,QAA0B,CAAA;AAC5C,KAAA;AACD,IAAA,IAAI,IAAI,CAAC,IAAI,YAAY,KAAK,EAAE;AAC9B,QAAA,OAAO,CAAC,IAAI,CAAC,gDAAgD,CAAC,CAAA;QAC9D,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAA;AACzB,KAAA;IACD,OAAO,KAAK,CAAC,aAAa,CAAC,IAAI,gCAC7B,GAAG,EAAA,EACA,IAAI,CAAA,EAAA,EACP,gBAAgB;QAChB,eAAe;QACf,gBAAgB;QAChB,SAAS;QACT,mBAAmB;QACnB,aAAa;AACb,QAAA,YAAY,IACZ,CAAA;AACJ,CAAC;;;;"}

package/dist/components/virtual-list/react/list.d.ts

@@ -1,9 +1,8 @@
 import React from 'react';
-import ListSet from "../list-set";
-import Preset from "../preset";
-import { IProps } from "../preset";
+import ListSet from "../list-set.js";
+import Preset from "../preset.js";
+import { IProps } from "../preset.js";
 interface IState {
-    id: string;
     instance: List;
     isScrolling: boolean;
     scrollDirection: 'forward' | 'backward';
@@ -20,7 +19,7 @@ declare class List extends React.PureComponent<IProps, IState> {
     refresh: () => void;
     _outerRef: any;
     _resetIsScrollingTimeoutId: any;
-    _callOnItemsRendered: import("memoize-one").MemoizedFn<(this: any, overscanStartIndex: any, overscanStopIndex: any, visibleStartIndex: any, visibleStopIndex: any) => any>;
+    _callOnItemsRendered: import("memoize-one").MemoizedFn<(this: any, overscanStartIndex: any, overscanStopIndex: any, startIndex: any, stopIndex: any) => any>;
     _callOnScroll: import("memoize-one").MemoizedFn<(this: any, scrollDirection: any, scrollOffset: any, scrollUpdateWasRequested: any, detail: any) => void>;
     _callPropsCallbacks(prevProps?: any, prevState?: any): void;
     _getSizeUploadSync: (index: number, isHorizontal: boolean) => Promise<unknown>;
@@ -34,11 +33,13 @@ declare class List extends React.PureComponent<IProps, IState> {
     _outerRefSetter: (ref: any) => void;
     _resetIsScrollingDebounced: () => void;
     _resetIsScrolling: () => void;
-    scrollTo(scrollOffset?: number): Promise<any>;
-    scrollToItem(index: number, align?: string): void;
+    scrollTo(scrollOffset?: number, enhanced?: true): Promise<any>;
+    scrollToItem(index: number, align?: string, enhanced?: true): void;
     componentDidMount(): void;
     componentDidUpdate(prevProps: IProps, prevState: IState): void;
     componentWillUnmount(): void;
+    getRenderItemNode(index: number, type?: 'node' | 'placeholder'): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    getRenderColumnNode(): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
     render(): React.ReactElement<{}, string | React.JSXElementConstructor<any>>;
 }
 export { IState, List as default };