@tarojs/components-advanced 4.1.12-beta.3 → 4.1.12-beta.5

package/dist/components/index.js

@@ -3,6 +3,7 @@ export { VirtualList } from './virtual-list/index.js';
 export { VirtualWaterfall } from './virtual-waterfall/index.js';
 import './water-flow/index.js';
 export { ListItem } from './list/ListItem.js';
+export { NoMore } from './list/NoMore.js';
 export { StickyHeader } from './list/StickyHeader.js';
 export { StickySection } from './list/StickySection.js';
 export { FlowItem, useFlowItemPositioner } from './water-flow/flow-item.js';

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/list/NoMore.d.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+/**
+ * NoMore 组件 - 底部"没有更多"提示
+ *
+ * 这是一个标记组件，不直接渲染内容，仅用于向 List 组件传递配置。
+ * 实际渲染由 List 组件内部处理。
+ *
+ * @example
+ * ```tsx
+ * <List>
+ *   <ListItem>Item 1</ListItem>
+ *   <NoMore visible={!hasMore} text="没有更多了" />
+ * </List>
+ * ```
+ */
+export interface NoMoreProps {
+    /** 是否显示（默认 true） */
+    visible?: boolean;
+    /** 提示文字（默认 "没有更多了"） */
+    text?: string;
+    /** 自定义样式 */
+    style?: React.CSSProperties;
+    /** 自定义内容（优先级高于 text） */
+    children?: React.ReactNode;
+    /** NoMore 区域高度（用于动态高度计算，默认 60） */
+    height?: number;
+}
+declare const NoMore: React.FC<NoMoreProps>;
+export { NoMore };
+export default NoMore;

package/dist/components/list/NoMore.js

@@ -0,0 +1,10 @@
+const NoMore = () => {
+    // 标记组件，不实际渲染
+    // 实际渲染由 List 组件内部的 renderNoMoreContent() 处理
+    return null;
+};
+// 设置 displayName 便于调试
+NoMore.displayName = 'NoMore';
+
+export { NoMore, NoMore as default };
+//# sourceMappingURL=NoMore.js.map

package/dist/components/list/NoMore.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NoMore.js","sources":["../../../src/components/list/NoMore.tsx"],"sourcesContent":["import React from 'react'\n\n/**\n * NoMore 组件 - 底部\"没有更多\"提示\n *\n * 这是一个标记组件，不直接渲染内容，仅用于向 List 组件传递配置。\n * 实际渲染由 List 组件内部处理。\n *\n * @example\n * ```tsx\n * <List>\n *   <ListItem>Item 1</ListItem>\n *   <NoMore visible={!hasMore} text=\"没有更多了\" />\n * </List>\n * ```\n */\n\nexport interface NoMoreProps {\n  /** 是否显示（默认 true） */\n  visible?: boolean\n\n  /** 提示文字（默认 \"没有更多了\"） */\n  text?: string\n\n  /** 自定义样式 */\n  style?: React.CSSProperties\n\n  /** 自定义内容（优先级高于 text） */\n  children?: React.ReactNode\n\n  /** NoMore 区域高度（用于动态高度计算，默认 60） */\n  height?: number\n}\n\nconst NoMore: React.FC<NoMoreProps> = () => {\n  // 标记组件，不实际渲染\n  // 实际渲染由 List 组件内部的 renderNoMoreContent() 处理\n  return null\n}\n\n// 设置 displayName 便于调试\nNoMore.displayName = 'NoMore'\n\nexport { NoMore }\nexport default NoMore\n"],"names":[],"mappings":"AAkCM,MAAA,MAAM,GAA0B,MAAK;;;AAGzC,IAAA,OAAO,IAAI;AACb;AAEA;AACA,MAAM,CAAC,WAAW,GAAG,QAAQ;;;;"}

package/dist/components/list/hooks/useItemSizeCache.d.ts

@@ -0,0 +1,13 @@
+interface UseItemSizeCacheOptions {
+    isHorizontal: boolean;
+    estimatedItemSize: number;
+    itemCount: number;
+}
+interface UseItemSizeCacheReturn {
+    /** 获取项的尺寸（高度或宽度） */
+    getItemSize: (index: number) => number;
+    /** 设置项的尺寸 */
+    setItemSize: (index: number, size: number) => void;
+}
+export declare function useItemSizeCache(options: UseItemSizeCacheOptions): UseItemSizeCacheReturn;
+export {};

package/dist/components/list/hooks/useItemSizeCache.js

@@ -0,0 +1,40 @@
+import { useRef, useCallback } from 'react';
+
+function useItemSizeCache(options) {
+    const { estimatedItemSize } = options;
+    // 缓存 Map：key = 索引，value = 尺寸信息
+    const cacheRef = useRef(new Map());
+    /**
+     * 获取项的尺寸
+     * 优先返回实际测量值，否则返回估算值
+     */
+    const getItemSize = useCallback((index) => {
+        const cached = cacheRef.current.get(index);
+        if ((cached === null || cached === void 0 ? void 0 : cached.isMeasured) && cached.measuredSize !== null) {
+            return cached.measuredSize;
+        }
+        return estimatedItemSize;
+    }, [estimatedItemSize]);
+    /**
+     * 设置项的尺寸（实际测量后调用）
+     */
+    const setItemSize = useCallback((index, size) => {
+        const cached = cacheRef.current.get(index);
+        // 尺寸变化小于 1px，忽略（避免微小抖动）
+        if ((cached === null || cached === void 0 ? void 0 : cached.measuredSize) && Math.abs(cached.measuredSize - size) < 1) {
+            return;
+        }
+        cacheRef.current.set(index, {
+            measuredSize: size,
+            estimatedSize: estimatedItemSize,
+            isMeasured: true
+        });
+    }, [estimatedItemSize]);
+    return {
+        getItemSize,
+        setItemSize
+    };
+}
+
+export { useItemSizeCache };
+//# sourceMappingURL=useItemSizeCache.js.map

package/dist/components/list/hooks/useItemSizeCache.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useItemSizeCache.js","sources":["../../../../src/components/list/hooks/useItemSizeCache.ts"],"sourcesContent":["import { useCallback, useRef } from 'react'\n\n/**\n * useItemSizeCache Hook - 动态尺寸缓存管理\n *\n * 支持垂直滚动（高度）和水平滚动（宽度）两种模式\n */\n\n/** 单个项的尺寸缓存 */\ninterface ItemMeasureCache {\n  measuredSize: number | null // 实际测量尺寸\n  estimatedSize: number // 估算尺寸\n  isMeasured: boolean // 是否已测量\n}\n\ninterface UseItemSizeCacheOptions {\n  isHorizontal: boolean // 是否水平滚动\n  estimatedItemSize: number // 估算尺寸\n  itemCount: number // 项总数\n}\n\ninterface UseItemSizeCacheReturn {\n  /** 获取项的尺寸（高度或宽度） */\n  getItemSize: (index: number) => number\n\n  /** 设置项的尺寸 */\n  setItemSize: (index: number, size: number) => void\n}\n\nexport function useItemSizeCache(\n  options: UseItemSizeCacheOptions\n): UseItemSizeCacheReturn {\n  const { estimatedItemSize } = options\n\n  // 缓存 Map：key = 索引，value = 尺寸信息\n  const cacheRef = useRef<Map<number, ItemMeasureCache>>(new Map())\n\n  /**\n   * 获取项的尺寸\n   * 优先返回实际测量值，否则返回估算值\n   */\n  const getItemSize = useCallback((index: number): number => {\n    const cached = cacheRef.current.get(index)\n\n    if (cached?.isMeasured && cached.measuredSize !== null) {\n      return cached.measuredSize\n    }\n\n    return estimatedItemSize\n  }, [estimatedItemSize])\n\n  /**\n   * 设置项的尺寸（实际测量后调用）\n   */\n  const setItemSize = useCallback((index: number, size: number) => {\n    const cached = cacheRef.current.get(index)\n\n    // 尺寸变化小于 1px，忽略（避免微小抖动）\n    if (cached?.measuredSize && Math.abs(cached.measuredSize - size) < 1) {\n      return\n    }\n\n    cacheRef.current.set(index, {\n      measuredSize: size,\n      estimatedSize: estimatedItemSize,\n      isMeasured: true\n    })\n  }, [estimatedItemSize])\n\n  return {\n    getItemSize,\n    setItemSize\n  }\n}\n"],"names":[],"mappings":";;AA6BM,SAAU,gBAAgB,CAC9B,OAAgC,EAAA;AAEhC,IAAA,MAAM,EAAE,iBAAiB,EAAE,GAAG,OAAO;;IAGrC,MAAM,QAAQ,GAAG,MAAM,CAAgC,IAAI,GAAG,EAAE,CAAC;AAEjE;;;AAGG;AACH,IAAA,MAAM,WAAW,GAAG,WAAW,CAAC,CAAC,KAAa,KAAY;QACxD,MAAM,MAAM,GAAG,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC;AAE1C,QAAA,IAAI,CAAA,MAAM,KAAN,IAAA,IAAA,MAAM,uBAAN,MAAM,CAAE,UAAU,KAAI,MAAM,CAAC,YAAY,KAAK,IAAI,EAAE;YACtD,OAAO,MAAM,CAAC,YAAY;;AAG5B,QAAA,OAAO,iBAAiB;AAC1B,KAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC;AAEvB;;AAEG;IACH,MAAM,WAAW,GAAG,WAAW,CAAC,CAAC,KAAa,EAAE,IAAY,KAAI;QAC9D,MAAM,MAAM,GAAG,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,CAAC;;QAG1C,IAAI,CAAA,MAAM,KAAN,IAAA,IAAA,MAAM,uBAAN,MAAM,CAAE,YAAY,KAAI,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE;YACpE;;AAGF,QAAA,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,EAAE;AAC1B,YAAA,YAAY,EAAE,IAAI;AAClB,YAAA,aAAa,EAAE,iBAAiB;AAChC,YAAA,UAAU,EAAE;AACb,SAAA,CAAC;AACJ,KAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC;IAEvB,OAAO;QACL,WAAW;QACX;KACD;AACH;;;;"}

package/dist/components/list/hooks/useRefresher.d.ts

@@ -0,0 +1,72 @@
+import React from 'react';
+/**
+ * List 组件内部的 refresher 配置类型（独立于 Refresher 组件）
+ * 与 ScrollView refresher 相关属性语义对齐
+ */
+export interface ListRefresherConfig {
+    refresherEnabled?: boolean;
+    refresherThreshold?: number;
+    refresherDefaultStyle?: 'black' | 'white' | 'none';
+    refresherBackground?: string;
+    refresherTriggered?: boolean;
+    /** 自定义刷新内容（来自 Refresher 子组件的 children） */
+    children?: React.ReactNode;
+    onRefresherPulling?: (e?: {
+        detail?: {
+            deltaY?: number;
+        };
+    }) => void;
+    onRefresherRefresh?: () => void | Promise<void>;
+    onRefresherRestore?: () => void;
+    onRefresherAbort?: () => void;
+    onRefresherWillRefresh?: () => void;
+    onRefresherStatusChange?: (e?: {
+        detail?: {
+            status?: number;
+            dy?: number;
+        };
+    }) => void;
+}
+/** 默认刷新层高度（对齐 Dynamic），无自定义 children 时使用 */
+export declare const DEFAULT_REFRESHER_HEIGHT = 50;
+/** 下拉刷新状态枚举（对齐微信小程序 RefreshStatus） */
+export declare const enum RefreshStatus {
+    /** 空闲 */
+    Idle = 0,
+    /** 超过下拉刷新阈值 */
+    CanRefresh = 1,
+    /** 刷新中 */
+    Refreshing = 2,
+    /** 刷新完成 */
+    Completed = 3,
+    /** 刷新失败 */
+    Failed = 4
+}
+interface UseRefresherReturn {
+    scrollViewRefresherProps: {
+        refresherEnabled?: boolean;
+        refresherThreshold?: number;
+        refresherDefaultStyle?: string;
+        refresherBackground?: string;
+        refresherTriggered?: boolean;
+    };
+    scrollViewRefresherHandlers: {
+        onRefresherPulling?: (e: any) => void;
+        onRefresherRefresh?: (e: any) => void;
+        onRefresherRestore?: () => void;
+        onRefresherAbort?: () => void;
+    };
+    h5RefresherProps: {
+        touchHandlers: Record<string, unknown>;
+        pullDistance: number;
+        isRefreshing: boolean;
+        /** H5 单结构下恒为 true，仅兼容旧类型 */
+        showRefresherLayer: boolean;
+    };
+    addImperativeTouchListeners?: (el: HTMLElement) => () => void;
+    renderRefresherContent: () => React.ReactNode | null;
+}
+export declare function useRefresher(config: ListRefresherConfig | null, 
+/** 列表逻辑顶部对应的 scrollTop，用于触顶判断；H5「顶栏悬浮+只滚列表」时传 0，imperative 内以 DOM scrollTop 为准 */
+scrollTopAtLogicalTop: number): UseRefresherReturn;
+export {};