@tarojs/components-advanced 3.6.9-alpha.13 → 3.6.9-alpha.15

package/dist/components/index.d.ts

@@ -1,2 +1 @@
 export * from "./virtual-list/index.js";
-export * from "./virtual-waterfall/index.js";

package/dist/components/index.js

@@ -1,3 +1,2 @@
 export { VirtualList } from './virtual-list/index.js';
-export { VirtualWaterfall } from './virtual-waterfall/index.js';
 //# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

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

@@ -1,6 +1,6 @@
 import { BaseEventOrig, BaseEventOrigFunction, ScrollViewProps, StandardProps } from '@tarojs/components';
 import { Component, ComponentType, CSSProperties, ReactNode } from 'react';
-interface VirtualListProps<T = any> extends Omit<StandardProps, 'children'> {
+interface VirtualListProps extends Omit<StandardProps, 'children'> {
     /** 列表的高度。 */
     height: string | number;
     /** 列表的宽度。 */
@@ -12,7 +12,7 @@ interface VirtualListProps<T = any> extends Omit<StandardProps, 'children'> {
         /** 单项的样式，样式必须传入组件的 style 中 */
         style?: CSSProperties;
         /** 组件渲染的数据 */
-        data: T[];
+        data: any;
         /** 组件渲染数据的索引 */
         index: number;
         /** 组件是否正在滚动，当 useIsScrolling 值为 true 时返回布尔值，否则返回 undefined */
@@ -21,14 +21,14 @@ interface VirtualListProps<T = any> extends Omit<StandardProps, 'children'> {
     /** 列表的长度 */
     itemCount: number;
     /** 渲染数据 */
-    itemData: T[];
+    itemData: any[];
     /** 列表单项的大小，垂直滚动时为高度，水平滚动时为宽度。
      *
      * > Note:
      * >  - unlimitedSize 模式下如果传入函数，只会调用一次用于设置初始值
      * >  - 非 unlimitedSize 模式下如果传入函数，为避免性能问题，每个节点只会调用一次用于设置初始值
      */
-    itemSize: number | ((index?: number, itemData?: T[]) => number);
+    itemSize: number | ((index?: number, itemData?: any[]) => number);
     /** 解开高度列表单项大小限制，默认值使用: itemSize (请注意，初始高度与实际高度差异过大会导致隐患)。
      *
      * > Note: 通过 itemSize 设置的初始高度与子节点实际高度差异过大会导致隐患
@@ -39,43 +39,35 @@ interface VirtualListProps<T = any> extends Omit<StandardProps, 'children'> {
      * @default "absolute"
      */
     position?: 'absolute' | 'relative';
-    /** 滚动方向。vertical 为垂直滚动，horizontal 为平行滚动。
-     * @default "vertical"
-     */
-    layout?: 'vertical' | 'horizontal';
     /** 初始滚动偏移值，水平滚动影响 scrollLeft，垂直滚动影响 scrollTop。 */
     initialScrollOffset?: number;
-    /** 在可视区域之外渲染的列表单项数量，值设置得越高，快速滚动时出现白屏的概率就越小，相应地，每次滚动的性能会变得越差。 */
-    overscanCount?: number;
-    /** 上下滚动预占位节点 */
-    placeholderCount?: number;
-    /** 是否注入 isScrolling 属性到 item 组件。这个参数一般用于实现滚动骨架屏（或其它 placeholder） 时比较有用。 */
-    useIsScrolling?: boolean;
+    /** 列表内部容器组件类型。
+     * @default View
+     */
+    innerElementType?: ComponentType;
     /** 通过 ScrollViewContext 优化组件滚动性能
      * @default false
      * @note 部分平台不支持，使用时请注意甄别
      */
     enhanced?: boolean;
-    /** 列表外部容器组件类型。
-     * @default ScrollView
-     */
-    outerElementType?: ComponentType | string;
-    /** 列表内部容器组件类型。
-     * @default View
-     */
-    innerElementType?: ComponentType | string;
-    /** 列表子节点容器组件类型。
-     * @default View
-     */
-    itemElementType?: ComponentType | string;
     /** 顶部区域 */
     renderTop?: ReactNode;
     /** 底部区域 */
     renderBottom?: ReactNode;
+    /** 滚动方向。vertical 为垂直滚动，horizontal 为平行滚动。
+     * @default "vertical"
+     */
+    layout?: 'vertical' | 'horizontal';
     /** 列表滚动时调用函数 */
     onScroll?: (event: VirtualListProps.IVirtualListEvent<VirtualListProps.IVirtualListEventDetail>) => void;
     /** 调用平台原生的滚动监听函数。 */
     onScrollNative?: BaseEventOrigFunction<ScrollViewProps.onScrollDetail>;
+    /** 在可视区域之外渲染的列表单项数量，值设置得越高，快速滚动时出现白屏的概率就越小，相应地，每次滚动的性能会变得越差。 */
+    overscanCount?: number;
+    /** 上下滚动预占位节点 */
+    placeholderCount?: number;
+    /** 是否注入 isScrolling 属性到 item 组件。这个参数一般用于实现滚动骨架屏（或其它 placeholder） 时比较有用。 */
+    useIsScrolling?: boolean;
     style?: CSSProperties;
 }
 declare namespace VirtualListProps {
@@ -84,9 +76,6 @@ declare namespace VirtualListProps {
         scrollTop: number;
         scrollHeight: number;
         scrollWidth: number;
-        clientHeight: number;
-        clientWidth: number;
-        diffOffset: number;
     }
     interface IVirtualListEvent<T extends ScrollViewProps.onScrollDetail = ScrollViewProps.onScrollDetail> extends BaseEventOrig {
         /** 滚动方向，可能值为 forward 往前， backward 往后。 */
@@ -95,7 +84,7 @@ declare namespace VirtualListProps {
         scrollOffset: number;
         /** 当滚动是由 scrollTo() 或 scrollToItem() 调用时返回 true，否则返回 false */
         scrollUpdateWasRequested: boolean;
-        /** 滚动信息 */
+        /** 当前只有 React 支持 */
         detail: T;
     }
 }

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/virtual-list/index.ts"],"sourcesContent":["import type { BaseEventOrig, BaseEventOrigFunction, ScrollViewProps, StandardProps } from '@tarojs/components'\nimport type { Component, ComponentType, CSSProperties, ReactNode } from 'react'\n\ninterface VirtualListProps<T = any> extends Omit<StandardProps, 'children'> {\n  /** 列表的高度。 */\n  height: string | number\n  /** 列表的宽度。 */\n  width: string | number\n  /** 子组件 */\n  item: ComponentType<{\n    /** 组件 ID */\n    id: string\n    /** 单项的样式，样式必须传入组件的 style 中 */\n    style?: CSSProperties\n    /** 组件渲染的数据 */\n    data: T[]\n    /** 组件渲染数据的索引 */\n    index: number\n    /** 组件是否正在滚动，当 useIsScrolling 值为 true 时返回布尔值，否则返回 undefined */\n    isScrolling?: boolean\n  }>\n  /** 列表的长度 */\n  itemCount: number\n  /** 渲染数据 */\n  itemData: T[]\n  /** 列表单项的大小，垂直滚动时为高度，水平滚动时为宽度。\n   *\n   * > Note:\n   * >  - unlimitedSize 模式下如果传入函数，只会调用一次用于设置初始值\n   * >  - 非 unlimitedSize 模式下如果传入函数，为避免性能问题，每个节点只会调用一次用于设置初始值\n   */\n  itemSize: number | ((index?: number, itemData?: T[]) => number)\n  /** 解开高度列表单项大小限制，默认值使用: itemSize (请注意，初始高度与实际高度差异过大会导致隐患)。\n   *\n   * > Note: 通过 itemSize 设置的初始高度与子节点实际高度差异过大会导致隐患\n   * @default false\n   */\n  unlimitedSize?: boolean\n  /** 布局方式\n   * @default \"absolute\"\n   */\n  position?: 'absolute' | 'relative'\n  /** 滚动方向。vertical 为垂直滚动，horizontal 为平行滚动。\n   * @default \"vertical\"\n   */\n  layout?: 'vertical' | 'horizontal'\n  /** 初始滚动偏移值，水平滚动影响 scrollLeft，垂直滚动影响 scrollTop。 */\n  initialScrollOffset?: number\n  /** 在可视区域之外渲染的列表单项数量，值设置得越高，快速滚动时出现白屏的概率就越小，相应地，每次滚动的性能会变得越差。 */\n  overscanCount?: number\n  /** 上下滚动预占位节点 */\n  placeholderCount?: number\n  /** 是否注入 isScrolling 属性到 item 组件。这个参数一般用于实现滚动骨架屏（或其它 placeholder） 时比较有用。 */\n  useIsScrolling?: boolean\n  /** 通过 ScrollViewContext 优化组件滚动性能\n   * @default false\n   * @note 部分平台不支持，使用时请注意甄别\n   */\n  enhanced?: boolean\n  /** 列表外部容器组件类型。\n   * @default ScrollView\n   */\n  outerElementType?: ComponentType | string\n  /** 列表内部容器组件类型。\n   * @default View\n   */\n  innerElementType?: ComponentType | string\n  /** 列表子节点容器组件类型。\n   * @default View\n   */\n  itemElementType?: ComponentType | string\n  /** 顶部区域 */\n  renderTop?: ReactNode\n  /** 底部区域 */\n  renderBottom?: ReactNode\n  /** 列表滚动时调用函数 */\n  onScroll?: (event: VirtualListProps.IVirtualListEvent<VirtualListProps.IVirtualListEventDetail>) => void\n  /** 调用平台原生的滚动监听函数。 */\n  onScrollNative?: BaseEventOrigFunction<ScrollViewProps.onScrollDetail>\n  style?: CSSProperties\n}\n\ndeclare namespace VirtualListProps {\n  interface IVirtualListEventDetail extends ScrollViewProps.onScrollDetail {\n    scrollLeft: number\n    scrollTop: number\n    scrollHeight: number\n    scrollWidth: number\n    clientHeight: number\n    clientWidth: number\n    diffOffset: number\n  }\n\n  interface IVirtualListEvent<T extends ScrollViewProps.onScrollDetail = ScrollViewProps.onScrollDetail> extends BaseEventOrig {\n    /** 滚动方向，可能值为 forward 往前， backward 往后。 */\n    scrollDirection: 'forward' | 'backward'\n    /** 滚动距离 */\n    scrollOffset: number\n    /** 当滚动是由 scrollTo() 或 scrollToItem() 调用时返回 true，否则返回 false */\n    scrollUpdateWasRequested: boolean\n    /** 滚动信息 */\n    detail: T\n  }\n}\n\n/** 虚拟列表\n * @classification viewContainer\n * @supported weapp, swan, alipay, tt, qq, jd, h5\n * @example_react\n * ```tsx\n * import VirtualList from `@tarojs/components/virtual-list`\n *\n * function buildData (offset = 0) {\n *   return Array(100).fill(0).map((_, i) => i + offset);\n * }\n *\n * const Row = React.memo(({ id, index, style, data }) => {\n *   return (\n *     <View id={id} className={index % 2 ? 'ListItemOdd' : 'ListItemEven'} style={style}>\n *       Row {index}\n *     </View>\n *   );\n * })\n *\n * export default class Index extends Component {\n *   state = {\n *     data: buildData(0),\n *   }\n *\n *   render() {\n *     const { data } = this.state\n *     const dataLen = data.length\n *     return (\n *       <VirtualList\n *         height={500} // 列表的高度\n *         width='100%' // 列表的宽度\n *         item={Row} // 列表单项组件，这里只能传入一个组件\n *         itemData={data} // 渲染列表的数据\n *         itemCount={dataLen} // 渲染列表的长度\n *         itemSize={100} // 列表单项的高度\n *       />\n *     );\n *   }\n * }\n * ```\n * @example_vue\n * ```js\n * // app.js 入口文件\n * import Vue from 'vue'\n * import VirtualList from '@tarojs/components/virtual-list'\n *\n * Vue.use(VirtualList)\n * ```\n * ```js\n * <! –– row.vue 单项组件 ––>\n * <template>\n *   <view\n *     :class=\"index % 2 ? 'ListItemOdd' : 'ListItemEven'\"\n *     :style=\"css\"\n *   >\n *     Row {{ index }} : {{ data[index] }}\n *   </view>\n * </template>\n *\n * <script>\n * export default {\n *   props: ['index', 'data', 'css']\n * }\n * </script>\n * ```\n * ```js\n * <! –– page.vue 页面组件 ––>\n * <template>\n *   <virtual-list\n *     wclass=\"List\"\n *     :height=\"500\"\n *     :item-data=\"list\"\n *     :item-count=\"list.length\"\n *     :item-size=\"100\"\n *     :item=\"Row\"\n *     width=\"100%\"\n *   />\n * </template>\n *\n * <script>\n * import Row from './row.vue'\n * import { markRaw } from 'vue'\n *\n * function buildData (offset = 0) {\n *   return Array(100).fill(0).map((_, i) => i + offset)\n * }\n *\n * export default {\n *   data() {\n *     return {\n *       Row: markRaw(Row),\n *       list: buildData(0)\n *     }\n *   },\n * }\n * </script>\n * ```\n * @see https://taro-docs.jd.com/docs/virtual-list\n */\ndeclare class VirtualListComponent extends Component<VirtualListProps> {\n  /**\n   * 滚动到指定的地点。\n   */\n  public scrollTo(scrollOffset: number): void\n\n  /** 滚动到指定的条目。\n   * @param index 指定条目的索引。\n   * @param align 滚动到指定条目时，指定条目的位置。默认值为 auto。\n   *\n   * - start：指定条目在可视区域的顶部。\n   * - end：指定条目在可视区域的底部。\n   * - center：指定条目在可视区域的中间。\n   * - auto：尽可能滚动距离最小保证条目在可视区域中，如果已经在可视区域，就不滚动。\n   * - smart：条目如果已经在可视区域，就不滚动；如果有部分在可视区域，尽可能滚动距离最小保证条目在可视区域中；如果条目完全不在可视区域，那就滚动到条目在可视区域居中显示。\n   */\n  public scrollToItem(index: number, align: 'start' | 'end' | 'center' | 'auto' | 'smart'): void\n}\n\ndeclare type VirtualList = VirtualListComponent\nconst VirtualList: typeof VirtualListComponent = (process.env.FRAMEWORK === 'vue' || process.env.FRAMEWORK === 'vue3')\n  ? require('./vue').default\n  : require('./react').default\n\nexport { VirtualList, VirtualListProps }\nexport default VirtualList\n"],"names":[],"mappings":"AAgOA,MAAM,WAAW,GAAgC,CAAC,OAAO,CAAC,GAAG,CAAC,SAAS,KAAK,KAAK,IAAI,OAAO,CAAC,GAAG,CAAC,SAAS,KAAK,MAAM;AACnH,MAAE,OAAO,CAAC,OAAO,CAAC,CAAC,OAAO;AAC1B,MAAE,OAAO,CAAC,SAAS,CAAC,CAAC;;;;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/virtual-list/index.ts"],"sourcesContent":["import type { BaseEventOrig, BaseEventOrigFunction, ScrollViewProps, StandardProps } from '@tarojs/components'\nimport type { Component, ComponentType, CSSProperties, ReactNode } from 'react'\n\ninterface VirtualListProps extends Omit<StandardProps, 'children'> {\n  /** 列表的高度。 */\n  height: string | number\n  /** 列表的宽度。 */\n  width: string | number\n  /** 子组件 */\n  item: ComponentType<{\n    /** 组件 ID */\n    id: string\n    /** 单项的样式，样式必须传入组件的 style 中 */\n    style?: CSSProperties\n    /** 组件渲染的数据 */\n    data: any\n    /** 组件渲染数据的索引 */\n    index: number\n    /** 组件是否正在滚动，当 useIsScrolling 值为 true 时返回布尔值，否则返回 undefined */\n    isScrolling?: boolean\n  }>\n  /** 列表的长度 */\n  itemCount: number\n  /** 渲染数据 */\n  itemData: any[]\n  /** 列表单项的大小，垂直滚动时为高度，水平滚动时为宽度。\n   *\n   * > Note:\n   * >  - unlimitedSize 模式下如果传入函数，只会调用一次用于设置初始值\n   * >  - 非 unlimitedSize 模式下如果传入函数，为避免性能问题，每个节点只会调用一次用于设置初始值\n   */\n  itemSize: number | ((index?: number, itemData?: any[]) => number)\n  /** 解开高度列表单项大小限制，默认值使用: itemSize (请注意，初始高度与实际高度差异过大会导致隐患)。\n   *\n   * > Note: 通过 itemSize 设置的初始高度与子节点实际高度差异过大会导致隐患\n   * @default false\n   */\n  unlimitedSize?: boolean\n  /** 布局方式\n   * @default \"absolute\"\n   */\n  position?: 'absolute' | 'relative'\n  /** 初始滚动偏移值，水平滚动影响 scrollLeft，垂直滚动影响 scrollTop。 */\n  initialScrollOffset?: number\n  /** 列表内部容器组件类型。\n   * @default View\n   */\n  innerElementType?: ComponentType\n  /** 通过 ScrollViewContext 优化组件滚动性能\n   * @default false\n   * @note 部分平台不支持，使用时请注意甄别\n   */\n  enhanced?: boolean\n  /** 顶部区域 */\n  renderTop?: ReactNode\n  /** 底部区域 */\n  renderBottom?: ReactNode\n  /** 滚动方向。vertical 为垂直滚动，horizontal 为平行滚动。\n   * @default \"vertical\"\n   */\n  layout?: 'vertical' | 'horizontal'\n  /** 列表滚动时调用函数 */\n  onScroll?: (event: VirtualListProps.IVirtualListEvent<VirtualListProps.IVirtualListEventDetail>) => void\n  /** 调用平台原生的滚动监听函数。 */\n  onScrollNative?: BaseEventOrigFunction<ScrollViewProps.onScrollDetail>\n  /** 在可视区域之外渲染的列表单项数量，值设置得越高，快速滚动时出现白屏的概率就越小，相应地，每次滚动的性能会变得越差。 */\n  overscanCount?: number\n  /** 上下滚动预占位节点 */\n  placeholderCount?: number\n  /** 是否注入 isScrolling 属性到 item 组件。这个参数一般用于实现滚动骨架屏（或其它 placeholder） 时比较有用。 */\n  useIsScrolling?: boolean\n  style?: CSSProperties\n}\n\ndeclare namespace VirtualListProps {\n  interface IVirtualListEventDetail extends ScrollViewProps.onScrollDetail {\n    scrollLeft: number\n    scrollTop: number\n    scrollHeight: number\n    scrollWidth: number\n  }\n\n  interface IVirtualListEvent<T extends ScrollViewProps.onScrollDetail = ScrollViewProps.onScrollDetail> extends BaseEventOrig {\n    /** 滚动方向，可能值为 forward 往前， backward 往后。 */\n    scrollDirection: 'forward' | 'backward'\n    /** 滚动距离 */\n    scrollOffset: number\n    /** 当滚动是由 scrollTo() 或 scrollToItem() 调用时返回 true，否则返回 false */\n    scrollUpdateWasRequested: boolean\n    /** 当前只有 React 支持 */\n    detail: T\n  }\n}\n\n/** 虚拟列表\n * @classification viewContainer\n * @supported weapp, swan, alipay, tt, qq, jd, h5\n * @example_react\n * ```tsx\n * import VirtualList from `@tarojs/components/virtual-list`\n *\n * function buildData (offset = 0) {\n *   return Array(100).fill(0).map((_, i) => i + offset);\n * }\n *\n * const Row = React.memo(({ id, index, style, data }) => {\n *   return (\n *     <View id={id} className={index % 2 ? 'ListItemOdd' : 'ListItemEven'} style={style}>\n *       Row {index}\n *     </View>\n *   );\n * })\n *\n * export default class Index extends Component {\n *   state = {\n *     data: buildData(0),\n *   }\n *\n *   render() {\n *     const { data } = this.state\n *     const dataLen = data.length\n *     return (\n *       <VirtualList\n *         height={500} // 列表的高度\n *         width='100%' // 列表的宽度\n *         item={Row} // 列表单项组件，这里只能传入一个组件\n *         itemData={data} // 渲染列表的数据\n *         itemCount={dataLen} // 渲染列表的长度\n *         itemSize={100} // 列表单项的高度\n *       />\n *     );\n *   }\n * }\n * ```\n * @example_vue\n * ```js\n * // app.js 入口文件\n * import Vue from 'vue'\n * import VirtualList from '@tarojs/components/virtual-list'\n *\n * Vue.use(VirtualList)\n * ```\n * ```js\n * <! –– row.vue 单项组件 ––>\n * <template>\n *   <view\n *     :class=\"index % 2 ? 'ListItemOdd' : 'ListItemEven'\"\n *     :style=\"css\"\n *   >\n *     Row {{ index }} : {{ data[index] }}\n *   </view>\n * </template>\n *\n * <script>\n * export default {\n *   props: ['index', 'data', 'css']\n * }\n * </script>\n * ```\n * ```js\n * <! –– page.vue 页面组件 ––>\n * <template>\n *   <virtual-list\n *     wclass=\"List\"\n *     :height=\"500\"\n *     :item-data=\"list\"\n *     :item-count=\"list.length\"\n *     :item-size=\"100\"\n *     :item=\"Row\"\n *     width=\"100%\"\n *   />\n * </template>\n *\n * <script>\n * import Row from './row.vue'\n * import { markRaw } from 'vue'\n *\n * function buildData (offset = 0) {\n *   return Array(100).fill(0).map((_, i) => i + offset)\n * }\n *\n * export default {\n *   data() {\n *     return {\n *       Row: markRaw(Row),\n *       list: buildData(0)\n *     }\n *   },\n * }\n * </script>\n * ```\n * @see https://taro-docs.jd.com/docs/virtual-list\n */\ndeclare class VirtualListComponent extends Component<VirtualListProps> {\n  /**\n   * 滚动到指定的地点。\n   */\n  public scrollTo(scrollOffset: number): void\n\n  /** 滚动到指定的条目。\n   * @param index 指定条目的索引。\n   * @param align 滚动到指定条目时，指定条目的位置。默认值为 auto。\n   *\n   * - start：指定条目在可视区域的顶部。\n   * - end：指定条目在可视区域的底部。\n   * - center：指定条目在可视区域的中间。\n   * - auto：尽可能滚动距离最小保证条目在可视区域中，如果已经在可视区域，就不滚动。\n   * - smart：条目如果已经在可视区域，就不滚动；如果有部分在可视区域，尽可能滚动距离最小保证条目在可视区域中；如果条目完全不在可视区域，那就滚动到条目在可视区域居中显示。\n   */\n  public scrollToItem(index: number, align: 'start' | 'end' | 'center' | 'auto' | 'smart'): void\n}\n\ndeclare type VirtualList = VirtualListComponent\nconst VirtualList: typeof VirtualListComponent = (process.env.FRAMEWORK === 'vue' || process.env.FRAMEWORK === 'vue3')\n  ? require('./vue').default\n  : require('./react').default\n\nexport { VirtualList, VirtualListProps }\nexport default VirtualList\n"],"names":[],"mappings":"AAqNA,MAAM,WAAW,GAAgC,CAAC,OAAO,CAAC,GAAG,CAAC,SAAS,KAAK,KAAK,IAAI,OAAO,CAAC,GAAG,CAAC,SAAS,KAAK,MAAM;AACnH,MAAE,OAAO,CAAC,OAAO,CAAC,CAAC,OAAO;AAC1B,MAAE,OAAO,CAAC,SAAS,CAAC,CAAC;;;;"}

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

@@ -1,7 +1,5 @@
 import { isFunction } from '@tarojs/shared';
-import '../../utils/index.js';
 import { isHorizontalFunc } from './utils.js';
-import { getOffsetForIndexAndAlignment } from '../../utils/helper.js';
 
 class ListSet {
     constructor(props, refresh) {
@@ -128,14 +126,51 @@ class ListSet {
         ];
     }
     getOffsetForIndexAndAlignment(index, align, scrollOffset) {
-        return getOffsetForIndexAndAlignment({
-            align,
-            containerSize: this.wrapperSize,
-            currentOffset: scrollOffset,
-            scrollSize: this.getOffsetSize(this.length),
-            slideSize: this.getSize(index),
-            targetOffset: this.getOffsetSize(index),
-        });
+        const wrapperSize = this.wrapperSize;
+        const itemSize = this.getSize(index);
+        const lastItemOffset = Math.max(0, this.getOffsetSize(this.props.itemCount) - wrapperSize);
+        const maxOffset = Math.min(lastItemOffset, this.getOffsetSize(index));
+        const minOffset = Math.max(0, this.getOffsetSize(index) - wrapperSize + itemSize);
+        if (align === 'smart') {
+            if (scrollOffset >= minOffset - wrapperSize && scrollOffset <= maxOffset + wrapperSize) {
+                align = 'auto';
+            }
+            else {
+                align = 'center';
+            }
+        }
+        switch (align) {
+            case 'start':
+                return maxOffset;
+            case 'end':
+                return minOffset;
+            case 'center':
+                {
+                    // "Centered" offset is usually the average of the min and max.
+                    // But near the edges of the list, this doesn't hold true.
+                    const middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2);
+                    if (middleOffset < Math.ceil(wrapperSize / 2)) {
+                        return 0; // near the beginning
+                    }
+                    else if (middleOffset > lastItemOffset + Math.floor(wrapperSize / 2)) {
+                        return lastItemOffset; // near the end
+                    }
+                    else {
+                        return middleOffset;
+                    }
+                }
+            case 'auto':
+            default:
+                if (scrollOffset >= minOffset && scrollOffset <= maxOffset) {
+                    return scrollOffset;
+                }
+                else if (scrollOffset < minOffset) {
+                    return minOffset;
+                }
+                else {
+                    return maxOffset;
+                }
+        }
     }
     compareSize(i = 0, size = 0) {
         if (this.isNormalMode)

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

@@ -1 +1 @@
-{"version":3,"file":"list-set.js","sources":["../../../src/components/virtual-list/list-set.ts"],"sourcesContent":["import { isFunction } from '@tarojs/shared'\n\nimport { getOffsetForIndexAndAlignment } from '../../utils'\nimport { isHorizontalFunc } from './utils'\n\nimport type { IProps } from './preset'\n\ntype TProps = Pick<IProps, 'width' | 'height' | 'unlimitedSize' | 'itemCount' | 'itemData' | 'itemSize' | 'overscanCount' | 'direction' | 'layout'>\n\nexport default class ListSet {\n  list: number[] = []\n  mode?: 'normal' | 'function' | 'unlimited'\n  defaultSize = 1\n\n  constructor (protected props: TProps, protected refresh?: TFunc) {\n    this.update(props)\n\n    // Note: 不考虑列表模式切换情况，可能会导致列表抖动体验过差\n    if (this.props.unlimitedSize) {\n      this.mode = 'unlimited'\n    } else if (isFunction(this.props.itemSize)) {\n      this.mode = 'function'\n    } else {\n      this.mode = 'normal'\n    }\n\n    this.defaultSize = (isFunction(this.props.itemSize) ? this.props.itemSize() : this.props.itemSize) || 1\n\n    if (!this.isNormalMode) {\n      this.list = new Array(this.length).fill(-1)\n    }\n  }\n\n  get isNormalMode () {\n    return this.mode === 'normal'\n  }\n\n  get isFunctionMode () {\n    return this.mode === 'function'\n  }\n\n  get isUnlimitedMode () {\n    return this.mode === 'unlimited'\n  }\n\n  get length () {\n    return this.props.itemCount || 100\n  }\n\n  get overscan () {\n    return this.props.overscanCount || 0\n  }\n\n  get wrapperSize () {\n    const { height, width } = this.props\n    const isHorizontal = isHorizontalFunc(this.props)\n    const size = (isHorizontal ? width : height) as number\n    if (process.env.NODE_ENV !== 'production' && typeof size !== 'number') {\n      console.warn(`In mode ${isHorizontal ? 'horizontal, width' : 'vertical, height'} parameter should be a number, but got ${typeof size}.`)\n    }\n    return size\n  }\n\n  update (props: TProps) {\n    this.props = props\n\n    if (this.length > this.list.length) {\n      const arr = new Array(this.length - this.list.length).fill(-1)\n      this.list.push(...arr)\n    } else if (this.length < this.list.length) {\n      this.list.length = this.length\n    }\n  }\n\n  setSize (i = 0, size = this.defaultSize) {\n    this.list[i] = size\n    this.refresh?.()\n  }\n\n  getSize (i = 0) {\n    const size = this.props.itemSize\n    const item = this.list[i]\n    if (item >= 0) return item\n\n    if (this.isFunctionMode && isFunction(size)) {\n      const itemSize = size(i, this.props.itemData)\n      this.setSize(i, itemSize)\n      return itemSize\n    }\n    return this.defaultSize\n  }\n\n  getOffsetSize (i = this.list.length) {\n    if (this.isNormalMode) return i * this.defaultSize\n    return this.list.slice(0, i).reduce((sum, _, idx) => sum + this.getSize(idx), 0)\n  }\n\n  getSizeCount (offset = 0) {\n    if (offset === 0) {\n      return 0\n    }\n    // if (this.isNormalMode) {\n    //   return Math.min(this.length - 1, Math.floor(offset / this.length))\n    // }\n    let offsetSize = 0\n    const count = this.list.reduce((sum, _, idx) => {\n      if (offsetSize < offset) {\n        offsetSize += this.getSize(idx)\n        return ++sum\n      }\n      return sum\n    }, 0)\n    return count - 1\n  }\n\n  getStartIndex (scrollOffset = 0) {\n    return Math.max(0, this.getSizeCount(scrollOffset) - 1)\n  }\n\n  getStopIndex (wrapperSize = 0, scrollOffset = 0, startIndex = 0) {\n    // const visibleOffset = this.getOffsetSize(startIndex)\n    // if (this.isNormalMode) {\n    //   const numVisibleItems = Math.ceil((wrapperSize + scrollOffset - visibleOffset) / this.length)\n    //   /** -1 is because stop index is inclusive */\n    //   return Math.max(startIndex, Math.min(this.length - 1, startIndex + numVisibleItems - 1))\n    // }\n    return Math.max(startIndex, Math.min(this.length - 1, this.getSizeCount(wrapperSize + scrollOffset)))\n  }\n\n  getRangeToRender (direction: 'forward' | 'backward', scrollOffset = 0, block = false) {\n    if (this.length === 0) {\n      return [0, 0, 0, 0]\n    }\n\n    const wrapperSize = this.wrapperSize\n    const startIndex = this.getStartIndex(scrollOffset)\n    const stopIndex = this.getStopIndex(wrapperSize, scrollOffset, startIndex)\n\n    // Overscan by one item in each direction so that tab/focus works. If there isn't at least one extra item, tab loops back around.\n    const overscanBackward = !block || direction === 'backward' ? Math.max(1, this.overscan) : 1\n    const overscanForward = !block || direction === 'forward' ? Math.max(1, this.overscan) : 1\n    return [\n      Math.max(0, startIndex - overscanBackward),\n      Math.max(0, Math.min(this.length - 1, stopIndex + overscanForward)),\n      startIndex,\n      stopIndex\n    ]\n  }\n\n  getOffsetForIndexAndAlignment (index: number, align: string, scrollOffset: number) {\n    return getOffsetForIndexAndAlignment({\n      align,\n      containerSize: this.wrapperSize,\n      currentOffset: scrollOffset,\n      scrollSize: this.getOffsetSize(this.length),\n      slideSize: this.getSize(index),\n      targetOffset: this.getOffsetSize(index),\n    })\n  }\n\n  compareSize (i = 0, size = 0) {\n    if (this.isNormalMode) return true\n    return this.getSize(i) === size\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"list-set.js","sources":["../../../src/components/virtual-list/list-set.ts"],"sourcesContent":["import { isFunction } from '@tarojs/shared'\n\nimport { isHorizontalFunc } from './utils'\n\nimport type { IProps } from './preset'\n\ntype TProps = Pick<IProps, 'width' | 'height' | 'unlimitedSize' | 'itemCount' | 'itemData' | 'itemSize' | 'overscanCount' | 'direction' | 'layout'>\n\nexport default class ListSet {\n  list: number[] = []\n  mode?: 'normal' | 'function' | 'unlimited'\n  defaultSize = 1\n\n  constructor (protected props: TProps, protected refresh?: TFunc) {\n    this.update(props)\n\n    // Note: 不考虑列表模式切换情况，可能会导致列表抖动体验过差\n    if (this.props.unlimitedSize) {\n      this.mode = 'unlimited'\n    } else if (isFunction(this.props.itemSize)) {\n      this.mode = 'function'\n    } else {\n      this.mode = 'normal'\n    }\n\n    this.defaultSize = (isFunction(this.props.itemSize) ? this.props.itemSize() : this.props.itemSize) || 1\n\n    if (!this.isNormalMode) {\n      this.list = new Array(this.length).fill(-1)\n    }\n  }\n\n  get isNormalMode () {\n    return this.mode === 'normal'\n  }\n\n  get isFunctionMode () {\n    return this.mode === 'function'\n  }\n\n  get isUnlimitedMode () {\n    return this.mode === 'unlimited'\n  }\n\n  get length () {\n    return this.props.itemCount || 100\n  }\n\n  get overscan () {\n    return this.props.overscanCount || 0\n  }\n\n  get wrapperSize () {\n    const { height, width } = this.props\n    const isHorizontal = isHorizontalFunc(this.props)\n    const size = (isHorizontal ? width : height) as number\n    if (process.env.NODE_ENV !== 'production' && typeof size !== 'number') {\n      console.warn(`In mode ${isHorizontal ? 'horizontal, width' : 'vertical, height'} parameter should be a number, but got ${typeof size}.`)\n    }\n    return size\n  }\n\n  update (props: TProps) {\n    this.props = props\n\n    if (this.length > this.list.length) {\n      const arr = new Array(this.length - this.list.length).fill(-1)\n      this.list.push(...arr)\n    } else if (this.length < this.list.length) {\n      this.list.length = this.length\n    }\n  }\n\n  setSize (i = 0, size = this.defaultSize) {\n    this.list[i] = size\n    this.refresh?.()\n  }\n\n  getSize (i = 0) {\n    const size = this.props.itemSize\n    const item = this.list[i]\n    if (item >= 0) return item\n\n    if (this.isFunctionMode && isFunction(size)) {\n      const itemSize = size(i, this.props.itemData)\n      this.setSize(i, itemSize)\n      return itemSize\n    }\n    return this.defaultSize\n  }\n\n  getOffsetSize (i = this.list.length) {\n    if (this.isNormalMode) return i * this.defaultSize\n    return this.list.slice(0, i).reduce((sum, _, idx) => sum + this.getSize(idx), 0)\n  }\n\n  getSizeCount (offset = 0) {\n    if (offset === 0) {\n      return 0\n    }\n    // if (this.isNormalMode) {\n    //   return Math.min(this.length - 1, Math.floor(offset / this.length))\n    // }\n    let offsetSize = 0\n    const count = this.list.reduce((sum, _, idx) => {\n      if (offsetSize < offset) {\n        offsetSize += this.getSize(idx)\n        return ++sum\n      }\n      return sum\n    }, 0)\n    return count - 1\n  }\n\n  getStartIndex (scrollOffset = 0) {\n    return Math.max(0, this.getSizeCount(scrollOffset) - 1)\n  }\n\n  getStopIndex (wrapperSize = 0, scrollOffset = 0, startIndex = 0) {\n    // const visibleOffset = this.getOffsetSize(startIndex)\n    // if (this.isNormalMode) {\n    //   const numVisibleItems = Math.ceil((wrapperSize + scrollOffset - visibleOffset) / this.length)\n    //   /** -1 is because stop index is inclusive */\n    //   return Math.max(startIndex, Math.min(this.length - 1, startIndex + numVisibleItems - 1))\n    // }\n    return Math.max(startIndex, Math.min(this.length - 1, this.getSizeCount(wrapperSize + scrollOffset)))\n  }\n\n  getRangeToRender (direction: 'forward' | 'backward', scrollOffset = 0, block = false) {\n    if (this.length === 0) {\n      return [0, 0, 0, 0]\n    }\n\n    const wrapperSize = this.wrapperSize\n    const startIndex = this.getStartIndex(scrollOffset)\n    const stopIndex = this.getStopIndex(wrapperSize, scrollOffset, startIndex)\n\n    // Overscan by one item in each direction so that tab/focus works. If there isn't at least one extra item, tab loops back around.\n    const overscanBackward = !block || direction === 'backward' ? Math.max(1, this.overscan) : 1\n    const overscanForward = !block || direction === 'forward' ? Math.max(1, this.overscan) : 1\n    return [\n      Math.max(0, startIndex - overscanBackward),\n      Math.max(0, Math.min(this.length - 1, stopIndex + overscanForward)),\n      startIndex,\n      stopIndex\n    ]\n  }\n\n  getOffsetForIndexAndAlignment (index: number, align: string, scrollOffset: number) {\n    const wrapperSize = this.wrapperSize\n    const itemSize = this.getSize(index)\n    const lastItemOffset = Math.max(0, this.getOffsetSize(this.props.itemCount) - wrapperSize)\n    const maxOffset = Math.min(lastItemOffset, this.getOffsetSize(index))\n    const minOffset = Math.max(0, this.getOffsetSize(index) - wrapperSize + itemSize)\n\n    if (align === 'smart') {\n      if (scrollOffset >= minOffset - wrapperSize && scrollOffset <= maxOffset + wrapperSize) {\n        align = 'auto'\n      } else {\n        align = 'center'\n      }\n    }\n\n    switch (align) {\n      case 'start':\n        return maxOffset\n\n      case 'end':\n        return minOffset\n\n      case 'center':\n      {\n        // \"Centered\" offset is usually the average of the min and max.\n        // But near the edges of the list, this doesn't hold true.\n        const middleOffset = Math.round(minOffset + (maxOffset - minOffset) / 2)\n\n        if (middleOffset < Math.ceil(wrapperSize / 2)) {\n          return 0 // near the beginning\n        } else if (middleOffset > lastItemOffset + Math.floor(wrapperSize / 2)) {\n          return lastItemOffset // near the end\n        } else {\n          return middleOffset\n        }\n      }\n\n      case 'auto':\n      default:\n        if (scrollOffset >= minOffset && scrollOffset <= maxOffset) {\n          return scrollOffset\n        } else if (scrollOffset < minOffset) {\n          return minOffset\n        } else {\n          return maxOffset\n        }\n    }\n  }\n\n  compareSize (i = 0, size = 0) {\n    if (this.isNormalMode) return true\n    return this.getSize(i) === size\n  }\n}\n"],"names":[],"mappings":"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"}

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

@@ -1,5 +1,5 @@
-import { defaultItemKey } from "../../utils/index.js";
 import ListSet from "./list-set.js";
+import { defaultItemKey } from "./utils.js";
 import { VirtualListProps } from "./index.js";
 interface IProps extends Partial<VirtualListProps> {
     children?: VirtualListProps['item'];
@@ -8,6 +8,8 @@ interface IProps extends Partial<VirtualListProps> {
     itemTagName?: string;
     innerTagName?: string;
     outerTagName?: string;
+    itemElementType?: React.ComponentType | string;
+    outerElementType?: React.ComponentType | string;
     innerRef?: React.Ref<HTMLElement> | string;
     outerRef?: React.Ref<HTMLElement> | string;
     onItemsRendered?: TFunc;
@@ -35,9 +37,9 @@ declare class Preset {
     get isRtl(): boolean;
     get isRelative(): boolean;
     get placeholderCount(): number;
-    get outerElement(): string | import("react").ComponentType<{}>;
-    get innerElement(): string | import("react").ComponentType<{}>;
-    get itemElement(): string | import("react").ComponentType<{}>;
+    get outerTagName(): string | import("react").ComponentType<{}>;
+    get innerTagName(): string | import("react").ComponentType<{}>;
+    get itemTagName(): string | import("react").ComponentType<{}>;
     get field(): Record<string, number>;
     set field(o: Record<string, number>);
     isShaking(diff?: number): boolean;

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

@@ -49,13 +49,13 @@ class Preset {
     get placeholderCount() {
         return this.props.placeholderCount >= 0 ? this.props.placeholderCount : this.props.overscanCount;
     }
-    get outerElement() {
+    get outerTagName() {
         return this.props.outerElementType || this.props.outerTagName || 'div';
     }
-    get innerElement() {
+    get innerTagName() {
         return this.props.innerElementType || this.props.innerTagName || 'div';
     }
-    get itemElement() {
+    get itemTagName() {
         return this.props.itemElementType || this.props.itemTagName || 'div';
     }
     get field() {

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, defaultItemKey, isCosDistributing } from '../../utils'\nimport ListSet from './list-set'\nimport { 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  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 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  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 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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"}

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

@@ -1,4 +1,4 @@
 import React from 'react';
 import { VirtualListProps } from "../index.js";
-declare const VirtualList: React.ForwardRefExoticComponent<Omit<VirtualListProps<any>, "ref"> & React.RefAttributes<unknown>>;
+declare const VirtualList: React.ForwardRefExoticComponent<Omit<VirtualListProps, "ref"> & React.RefAttributes<unknown>>;
 export { VirtualList as default };

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

@@ -25,9 +25,8 @@ 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), { outerElementType: OuterScrollView, itemElementType,
-        innerElementType,
-        direction,
+    return React.createElement(List, Object.assign(Object.assign({ ref }, rest), { itemElementType,
+        innerElementType, outerElementType: OuterScrollView, direction,
         initialScrollOffset,
         overscanCount }));
 });

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    outerElementType: OuterScrollView,\n    itemElementType,\n    innerElementType,\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;AACD,IAAA,OAAO,KAAK,CAAC,aAAa,CAAC,IAAI,EAC7B,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,MAAA,CAAA,EAAA,GAAG,EACA,EAAA,IAAI,CACP,EAAA,EAAA,gBAAgB,EAAE,eAAe,EACjC,eAAe;QACf,gBAAgB;QAChB,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 { 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;;;;"}

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

@@ -20,7 +20,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, startIndex: any, stopIndex: any) => any>;
+    _callOnItemsRendered: import("memoize-one").MemoizedFn<(this: any, overscanStartIndex: any, overscanStopIndex: any, visibleStartIndex: any, visibleStopIndex: 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>;

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

@@ -1,16 +1,14 @@
 import { __rest } from '../../../node_modules/.pnpm/registry.npmjs.org_tslib@2.5.0/node_modules/tslib/tslib.es6.js';
 import memoizeOne from 'memoize-one';
 import React from 'react';
-import '../../../utils/index.js';
+import { convertNumber2PX } from '../../../utils/convert.js';
+import { omit } from '../../../utils/lodash.js';
+import { cancelTimeout, requestTimeout } from '../../../utils/timer.js';
 import { IS_SCROLLING_DEBOUNCE_INTERVAL } from '../constants.js';
 import { getRTLOffsetType } from '../dom-helpers.js';
 import Preset from '../preset.js';
+import { getRectSize, getScrollViewContextNode, defaultItemKey } from '../utils.js';
 import { validateListProps } from './validate.js';
-import { getRectSize, getScrollViewContextNode } from '../../../utils/dom.js';
-import { cancelTimeout, requestTimeout } from '../../../utils/timer.js';
-import { omit } from '../../../utils/lodash.js';
-import { defaultItemKey } from '../../../utils/helper.js';
-import { convertNumber2PX } from '../../../utils/convert.js';
 
 class List extends React.PureComponent {
     static getDerivedStateFromProps(nextProps, prevState) {
@@ -30,11 +28,11 @@ class List extends React.PureComponent {
         };
         this._outerRef = undefined;
         this._resetIsScrollingTimeoutId = null;
-        this._callOnItemsRendered = memoizeOne((overscanStartIndex, overscanStopIndex, startIndex, stopIndex) => this.props.onItemsRendered({
+        this._callOnItemsRendered = memoizeOne((overscanStartIndex, overscanStopIndex, visibleStartIndex, visibleStopIndex) => this.props.onItemsRendered({
             overscanStartIndex,
             overscanStopIndex,
-            startIndex,
-            stopIndex
+            visibleStartIndex,
+            visibleStopIndex
         }));
         this._callOnScroll = memoizeOne((scrollDirection, scrollOffset, scrollUpdateWasRequested, detail) => this.props.onScroll({
             scrollDirection,
@@ -175,15 +173,15 @@ class List extends React.PureComponent {
                 ? this.props.initialScrollOffset
                 : 0,
             scrollUpdateWasRequested: false,
-            refreshCount: 0,
+            refreshCount: 0
         };
     }
     _callPropsCallbacks(prevProps = {}, prevState = {}) {
         if (typeof this.props.onItemsRendered === 'function') {
             if (this.props.itemCount > 0) {
                 if (prevProps && prevProps.itemCount !== this.props.itemCount) {
-                    const [overscanStartIndex, overscanStopIndex, startIndex, stopIndex] = this._getRangeToRender();
-                    this._callOnItemsRendered(overscanStartIndex, overscanStopIndex, startIndex, stopIndex);
+                    const [overscanStartIndex, overscanStopIndex, visibleStartIndex, visibleStopIndex] = this._getRangeToRender();
+                    this._callOnItemsRendered(overscanStartIndex, overscanStopIndex, visibleStartIndex, visibleStopIndex);
                 }
             }
         }
@@ -308,13 +306,13 @@ class List extends React.PureComponent {
         const items = [];
         if (itemCount > 0) {
             const prevPlaceholder = startIndex < placeholderCount ? startIndex : placeholderCount;
-            items.push(new Array(prevPlaceholder).fill(-1).map((_, index) => React.createElement(this.preset.itemElement, {
+            items.push(new Array(prevPlaceholder).fill(-1).map((_, index) => React.createElement(this.preset.itemTagName, {
                 key: itemKey(index + startIndex - prevPlaceholder, itemData),
                 style: { display: 'none' }
             })));
             for (let index = startIndex; index <= stopIndex; index++) {
                 const style = this.preset.getItemStyle(index);
-                items.push(React.createElement(this.preset.itemElement, {
+                items.push(React.createElement(this.preset.itemTagName, {
                     key: itemKey(index, itemData),
                     style
                 }, React.createElement(item, {
@@ -327,7 +325,7 @@ class List extends React.PureComponent {
             let restCount = itemCount - stopIndex;
             restCount = restCount > 0 ? restCount : 0;
             const postPlaceholder = restCount < placeholderCount ? restCount : placeholderCount;
-            items.push(new Array(postPlaceholder).fill(-1).map((_, index) => React.createElement(this.preset.itemElement, {
+            items.push(new Array(postPlaceholder).fill(-1).map((_, index) => React.createElement(this.preset.itemTagName, {
                 key: itemKey(1 + index + stopIndex, itemData),
                 style: { display: 'none' }
             })));
@@ -335,28 +333,28 @@ class List extends React.PureComponent {
         // Read this value AFTER items have been created,
         // So their actual sizes (if variable) are taken into consideration.
         const estimatedTotalSize = convertNumber2PX(this.itemList.getOffsetSize());
-        const outerProps = Object.assign(Object.assign({}, rest), { id,
+        const outerElementProps = Object.assign(Object.assign({}, rest), { id,
             className,
             onScroll, ref: this._outerRefSetter, layout,
             enhanced, style: Object.assign({ position: 'relative', height: convertNumber2PX(height), width: convertNumber2PX(width), overflow: 'auto', WebkitOverflowScrolling: 'touch', willChange: 'transform', direction }, style) });
         if (!enhanced) {
             if (isHorizontal) {
-                outerProps.scrollLeft = scrollUpdateWasRequested ? scrollOffset : this.preset.field.scrollLeft;
+                outerElementProps.scrollLeft = scrollUpdateWasRequested ? scrollOffset : this.preset.field.scrollLeft;
             }
             else {
-                outerProps.scrollTop = scrollUpdateWasRequested ? scrollOffset : this.preset.field.scrollTop;
+                outerElementProps.scrollTop = scrollUpdateWasRequested ? scrollOffset : this.preset.field.scrollTop;
             }
         }
         if (this.preset.isRelative) {
             const pre = convertNumber2PX(this.itemList.getOffsetSize(startIndex));
-            return React.createElement(this.preset.outerElement, outerProps, renderTop, React.createElement(this.preset.itemElement, {
+            return React.createElement(this.preset.outerTagName, outerElementProps, renderTop, React.createElement(this.preset.itemTagName, {
                 key: `${id}-pre`,
                 id: `${id}-pre`,
                 style: {
                     height: isHorizontal ? '100%' : pre,
                     width: !isHorizontal ? '100%' : pre
                 }
-            }), React.createElement(this.preset.innerElement, {
+            }), React.createElement(this.preset.innerTagName, {
                 ref: innerRef,
                 key: `${id}-inner`,
                 id: `${id}-inner`,
@@ -367,7 +365,7 @@ class List extends React.PureComponent {
             }, items), renderBottom);
         }
         else {
-            return React.createElement(this.preset.outerElement, outerProps, renderTop, React.createElement(this.preset.innerElement, {
+            return React.createElement(this.preset.outerTagName, outerElementProps, renderTop, React.createElement(this.preset.innerTagName, {
                 ref: innerRef,
                 key: `${id}-inner`,
                 id: `${id}-inner`,