@tarojs/components-advanced 3.6.0-beta.2 → 3.6.0-beta.4

package/dist/components/index.d.ts

@@ -1 +1 @@
-export * from './virtual-list';
+export * from "./virtual-list/index";

package/dist/components/index.js

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

package/dist/components/index.js.map

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

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

@@ -1 +1,2 @@
-export declare const IS_SCROLLING_DEBOUNCE_INTERVAL = 200;
+declare const IS_SCROLLING_DEBOUNCE_INTERVAL = 200;
+export { IS_SCROLLING_DEBOUNCE_INTERVAL };

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

@@ -1 +1,4 @@
-export var IS_SCROLLING_DEBOUNCE_INTERVAL = 200;
+const IS_SCROLLING_DEBOUNCE_INTERVAL = 200;
+
+export { IS_SCROLLING_DEBOUNCE_INTERVAL };
+//# sourceMappingURL=constants.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../src/components/virtual-list/constants.ts"],"sourcesContent":["export const IS_SCROLLING_DEBOUNCE_INTERVAL = 200\n"],"names":[],"mappings":"AAAO,MAAM,8BAA8B,GAAG;;;;"}

package/dist/components/virtual-list/dom-helpers.d.ts

@@ -1 +1,2 @@
-export declare function getRTLOffsetType(recalculate?: boolean): any;
+declare function getRTLOffsetType(recalculate?: boolean): any;
+export { getRTLOffsetType };

package/dist/components/virtual-list/dom-helpers.js

@@ -4,35 +4,38 @@
 // The safest way to check this is to intentionally set a negative offset,
 // and then verify that the subsequent "scroll" event matches the negative offset.
 // If it does not match, then we can assume a non-standard RTL scroll implementation.
-
-var cachedRTLResult = null;
-export function getRTLOffsetType() {
-  var recalculate = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
-  if (cachedRTLResult === null || recalculate) {
-    var outerDiv = document.createElement('div');
-    var outerStyle = outerDiv.style;
-    outerStyle.width = '50px';
-    outerStyle.height = '50px';
-    outerStyle.overflow = 'scroll';
-    outerStyle.direction = 'rtl';
-    var innerDiv = document.createElement('div');
-    var innerStyle = innerDiv.style;
-    innerStyle.width = '100px';
-    innerStyle.height = '100px';
-    outerDiv.appendChild(innerDiv);
-    document.body.appendChild(outerDiv);
-    if (outerDiv.scrollLeft > 0) {
-      cachedRTLResult = 'positive-descending';
-    } else {
-      outerDiv.scrollLeft = 1;
-      if (outerDiv.scrollLeft === 0) {
-        cachedRTLResult = 'negative';
-      } else {
-        cachedRTLResult = 'positive-ascending';
-      }
+let cachedRTLResult = null;
+function getRTLOffsetType(recalculate = false) {
+    if (cachedRTLResult === null || recalculate) {
+        const outerDiv = document.createElement('div');
+        const outerStyle = outerDiv.style;
+        outerStyle.width = '50px';
+        outerStyle.height = '50px';
+        outerStyle.overflow = 'scroll';
+        outerStyle.direction = 'rtl';
+        const innerDiv = document.createElement('div');
+        const innerStyle = innerDiv.style;
+        innerStyle.width = '100px';
+        innerStyle.height = '100px';
+        outerDiv.appendChild(innerDiv);
+        document.body.appendChild(outerDiv);
+        if (outerDiv.scrollLeft > 0) {
+            cachedRTLResult = 'positive-descending';
+        }
+        else {
+            outerDiv.scrollLeft = 1;
+            if (outerDiv.scrollLeft === 0) {
+                cachedRTLResult = 'negative';
+            }
+            else {
+                cachedRTLResult = 'positive-ascending';
+            }
+        }
+        document.body.removeChild(outerDiv);
+        return cachedRTLResult;
     }
-    document.body.removeChild(outerDiv);
     return cachedRTLResult;
-  }
-  return cachedRTLResult;
-}
+}
+
+export { getRTLOffsetType };
+//# sourceMappingURL=dom-helpers.js.map

package/dist/components/virtual-list/dom-helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dom-helpers.js","sources":["../../../src/components/virtual-list/dom-helpers.ts"],"sourcesContent":["// TRICKY According to the spec, scrollLeft should be negative for RTL aligned elements.\n// Chrome does not seem to adhere; its scrollLeft values are positive (measured relative to the left).\n// Safari's elastic bounce makes detecting this even more complicated wrt potential false positives.\n// The safest way to check this is to intentionally set a negative offset,\n// and then verify that the subsequent \"scroll\" event matches the negative offset.\n// If it does not match, then we can assume a non-standard RTL scroll implementation.\n\nlet cachedRTLResult = null\n\nexport function getRTLOffsetType (recalculate = false) {\n  if (cachedRTLResult === null || recalculate) {\n    const outerDiv = document.createElement('div')\n    const outerStyle = outerDiv.style\n    outerStyle.width = '50px'\n    outerStyle.height = '50px'\n    outerStyle.overflow = 'scroll'\n    outerStyle.direction = 'rtl'\n    const innerDiv = document.createElement('div')\n    const innerStyle = innerDiv.style\n    innerStyle.width = '100px'\n    innerStyle.height = '100px'\n    outerDiv.appendChild(innerDiv)\n    document.body.appendChild(outerDiv)\n\n    if (outerDiv.scrollLeft > 0) {\n      cachedRTLResult = 'positive-descending'\n    } else {\n      outerDiv.scrollLeft = 1\n\n      if (outerDiv.scrollLeft === 0) {\n        cachedRTLResult = 'negative'\n      } else {\n        cachedRTLResult = 'positive-ascending'\n      }\n    }\n\n    document.body.removeChild(outerDiv)\n    return cachedRTLResult\n  }\n\n  return cachedRTLResult\n}\n"],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AAEA,IAAI,eAAe,GAAG,IAAI,CAAA;AAEV,SAAA,gBAAgB,CAAE,WAAW,GAAG,KAAK,EAAA;AACnD,IAAA,IAAI,eAAe,KAAK,IAAI,IAAI,WAAW,EAAE;QAC3C,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;AAC9C,QAAA,MAAM,UAAU,GAAG,QAAQ,CAAC,KAAK,CAAA;AACjC,QAAA,UAAU,CAAC,KAAK,GAAG,MAAM,CAAA;AACzB,QAAA,UAAU,CAAC,MAAM,GAAG,MAAM,CAAA;AAC1B,QAAA,UAAU,CAAC,QAAQ,GAAG,QAAQ,CAAA;AAC9B,QAAA,UAAU,CAAC,SAAS,GAAG,KAAK,CAAA;QAC5B,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;AAC9C,QAAA,MAAM,UAAU,GAAG,QAAQ,CAAC,KAAK,CAAA;AACjC,QAAA,UAAU,CAAC,KAAK,GAAG,OAAO,CAAA;AAC1B,QAAA,UAAU,CAAC,MAAM,GAAG,OAAO,CAAA;AAC3B,QAAA,QAAQ,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAA;AAC9B,QAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAA;AAEnC,QAAA,IAAI,QAAQ,CAAC,UAAU,GAAG,CAAC,EAAE;YAC3B,eAAe,GAAG,qBAAqB,CAAA;AACxC,SAAA;AAAM,aAAA;AACL,YAAA,QAAQ,CAAC,UAAU,GAAG,CAAC,CAAA;AAEvB,YAAA,IAAI,QAAQ,CAAC,UAAU,KAAK,CAAC,EAAE;gBAC7B,eAAe,GAAG,UAAU,CAAA;AAC7B,aAAA;AAAM,iBAAA;gBACL,eAAe,GAAG,oBAAoB,CAAA;AACvC,aAAA;AACF,SAAA;AAED,QAAA,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAA;AACnC,QAAA,OAAO,eAAe,CAAA;AACvB,KAAA;AAED,IAAA,OAAO,eAAe,CAAA;AACxB;;;;"}

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

@@ -1,5 +1,5 @@
-import type { BaseEventOrig, BaseEventOrigFunction, ScrollViewProps, StandardProps } from '@tarojs/components';
-import type { Component, ComponentType, CSSProperties, ReactNode } from 'react';
+import { BaseEventOrig, BaseEventOrigFunction, ScrollViewProps, StandardProps } from '@tarojs/components';
+import { Component, ComponentType, CSSProperties, ReactNode } from 'react';
 interface VirtualListProps extends Omit<StandardProps, 'children'> {
     /** 列表的高度。 */
     height: string | number;
@@ -185,5 +185,4 @@ declare namespace VirtualListProps {
 declare class VirtualListComponent extends Component<VirtualListProps> {
 }
 declare const VirtualList: typeof VirtualListComponent;
-export { VirtualList, VirtualListProps };
-export default VirtualList;
+export { VirtualList as default, VirtualList, VirtualListProps };

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

@@ -1,103 +1,6 @@
-/** 虚拟列表
- * @classification viewContainer
- * @supported weapp, swan, alipay, tt, qq, jd, h5
- * @example_react
- * ```tsx
- * import VirtualList from `@tarojs/components/virtual-list`
- *
- * function buildData (offset = 0) {
- *   return Array(100).fill(0).map((_, i) => i + offset);
- * }
- *
- * const Row = React.memo(({ id, index, style, data }) => {
- *   return (
- *     <View id={id} className={index % 2 ? 'ListItemOdd' : 'ListItemEven'} style={style}>
- *       Row {index}
- *     </View>
- *   );
- * })
- *
- * export default class Index extends Component {
- *   state = {
- *     data: buildData(0),
- *   }
- *
- *   render() {
- *     const { data } = this.state
- *     const dataLen = data.length
- *     return (
- *       <VirtualList
- *         height={500} // 列表的高度
- *         width='100%' // 列表的宽度
- *         item={Row} // 列表单项组件，这里只能传入一个组件
- *         itemData={data} // 渲染列表的数据
- *         itemCount={dataLen} // 渲染列表的长度
- *         itemSize={100} // 列表单项的高度
- *       />
- *     );
- *   }
- * }
- * ```
- * @example_vue
- * ```js
- * // app.js 入口文件
- * import Vue from 'vue'
- * import VirtualList from '@tarojs/components/virtual-list'
- *
- * Vue.use(VirtualList)
- * ```
- * ```js
- * <! –– row.vue 单项组件 ––>
- * <template>
- *   <view
- *     :class="index % 2 ? 'ListItemOdd' : 'ListItemEven'"
- *     :style="css"
- *   >
- *     Row {{ index }} : {{ data[index] }}
- *   </view>
- * </template>
- *
- * <script>
- * export default {
- *   props: ['index', 'data', 'css']
- * }
- * </script>
- * ```
- * ```js
- * <! –– page.vue 页面组件 ––>
- * <template>
- *   <virtual-list
- *     wclass="List"
- *     :height="500"
- *     :item-data="list"
- *     :item-count="list.length"
- *     :item-size="100"
- *     :item="Row"
- *     width="100%"
- *   />
- * </template>
- *
- * <script>
- * import Row from './row.vue'
- * import { markRaw } from 'vue'
- *
- * function buildData (offset = 0) {
- *   return Array(100).fill(0).map((_, i) => i + offset)
- * }
- *
- * export default {
- *   data() {
- *     return {
- *       Row: markRaw(Row),
- *       list: buildData(0)
- *     }
- *   },
- * }
- * </script>
- * ```
- * @see https://taro-docs.jd.com/docs/virtual-list
- */
+const VirtualList = (process.env.FRAMEWORK === 'vue' || process.env.FRAMEWORK === 'vue3')
+    ? require('./vue').default
+    : require('./react').default;
 
-var VirtualList = process.env.FRAMEWORK === 'vue' || process.env.FRAMEWORK === 'vue3' ? require('./vue').default : require('./react').default;
-export { VirtualList };
-export default VirtualList;
+export { VirtualList, VirtualList as default };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +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 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  /** 顶部区域 */\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\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":"AA8LA,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.d.ts

@@ -1,6 +1,6 @@
-import type { IProps } from './preset';
-declare type TProps = Pick<IProps, 'width' | 'height' | 'unlimitedSize' | 'itemCount' | 'itemData' | 'itemSize' | 'overscanCount' | 'direction' | 'layout'>;
-export default class ListSet {
+import { IProps } from "./preset";
+type TProps = Pick<IProps, 'width' | 'height' | 'unlimitedSize' | 'itemCount' | 'itemData' | 'itemSize' | 'overscanCount' | 'direction' | 'layout'>;
+declare class ListSet {
     protected props: TProps;
     protected refresh?: TFunc;
     list: number[];
@@ -24,4 +24,4 @@ export default class ListSet {
     getOffsetForIndexAndAlignment(index: number, align: string, scrollOffset: number): number;
     compareSize(i?: number, size?: number): boolean;
 }
-export {};
+export { ListSet as default };