@seakoi/native-ui 1.1.0 → 1.1.1

package/dist/commonjs/components/base/carousel/hooks/index.js

@@ -0,0 +1,61 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "useCarouselAutoplay", {
+  enumerable: true,
+  get: function () {
+    return _useCarouselAutoplay.useCarouselAutoplay;
+  }
+});
+Object.defineProperty(exports, "useCarouselIndex", {
+  enumerable: true,
+  get: function () {
+    return _useCarouselIndex.useCarouselIndex;
+  }
+});
+Object.defineProperty(exports, "useCarouselIndicator", {
+  enumerable: true,
+  get: function () {
+    return _useCarouselIndicator.useCarouselIndicator;
+  }
+});
+Object.defineProperty(exports, "useCarouselLifecycle", {
+  enumerable: true,
+  get: function () {
+    return _useCarouselLifecycle.useCarouselLifecycle;
+  }
+});
+Object.defineProperty(exports, "useCarouselPanResponder", {
+  enumerable: true,
+  get: function () {
+    return _useCarouselPanResponder.useCarouselPanResponder;
+  }
+});
+Object.defineProperty(exports, "useCarouselPosition", {
+  enumerable: true,
+  get: function () {
+    return _useCarouselPosition.useCarouselPosition;
+  }
+});
+Object.defineProperty(exports, "useCarouselSlides", {
+  enumerable: true,
+  get: function () {
+    return _useCarouselSlides.useCarouselSlides;
+  }
+});
+Object.defineProperty(exports, "useCarouselSwipe", {
+  enumerable: true,
+  get: function () {
+    return _useCarouselSwipe.useCarouselSwipe;
+  }
+});
+var _useCarouselAutoplay = require("./use-carousel-autoplay.js");
+var _useCarouselIndex = require("./use-carousel-index.js");
+var _useCarouselIndicator = require("./use-carousel-indicator.js");
+var _useCarouselLifecycle = require("./use-carousel-lifecycle.js");
+var _useCarouselPanResponder = require("./use-carousel-pan-responder.js");
+var _useCarouselPosition = require("./use-carousel-position.js");
+var _useCarouselSlides = require("./use-carousel-slides.js");
+var _useCarouselSwipe = require("./use-carousel-swipe.js");

package/dist/commonjs/components/base/carousel/hooks/use-carousel-autoplay.js

@@ -0,0 +1,47 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCarouselAutoplay = void 0;
+var _react = require("react");
+/**
+ * 轮播图自动轮播 Hook
+ *
+ * 管理轮播图的自动轮播功能，根据配置自动切换到下一项或上一项。
+ * 在拖动时暂停自动轮播，拖动结束后恢复。
+ * 支持正向和反向自动轮播。
+ *
+ * @param params - Hook 参数配置
+ * @param params.autoplay - 自动轮播配置（false/true/'reverse'）
+ * @param params.autoplayInterval - 自动轮播间隔（毫秒）
+ * @param params.total - 轮播项总数
+ * @param params.dragging - 是否正在拖动
+ * @param params.current - 当前索引（用于触发重新计时）
+ * @param params.swipeNext - 切换到下一项的方法
+ * @param params.swipePrev - 切换到上一项的方法
+ */
+const useCarouselAutoplay = params => {
+  const {
+    autoplay,
+    autoplayInterval,
+    total,
+    dragging,
+    current,
+    swipeNext,
+    swipePrev
+  } = params;
+  (0, _react.useEffect)(() => {
+    if (!autoplay) return;
+    if (total <= 1) return;
+    if (dragging) return;
+    if (autoplayInterval <= 0) return;
+    const timer = setTimeout(() => {
+      if (autoplay === 'reverse') swipePrev();else swipeNext();
+    }, autoplayInterval);
+    return () => {
+      clearTimeout(timer);
+    };
+  }, [autoplay, autoplayInterval, dragging, swipeNext, swipePrev, total, current]);
+};
+exports.useCarouselAutoplay = useCarouselAutoplay;

package/dist/commonjs/components/base/carousel/hooks/use-carousel-index.js

@@ -0,0 +1,129 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCarouselIndex = void 0;
+var _ahooks = require("ahooks");
+var _lodashEs = require("lodash-es");
+var _react = require("react");
+var _constants = require("../constants.js");
+var _utils = require("../utils.js");
+/**
+ * 轮播图索引管理 Hook
+ *
+ * 管理轮播图的索引状态和索引转换逻辑，包括：
+ * - 当前索引状态管理
+ * - 逻辑索引与扩展索引（包含克隆项）之间的转换
+ * - 目标索引计算（处理循环边界）
+ * - 位置边界限制（橡皮筋效果）
+ * - 索引变化回调
+ *
+ * @param params - Hook 参数配置
+ * @param params.total - 轮播项总数
+ * @param params.loopEnabled - 是否启用循环播放
+ * @param params.clonesBefore - 循环播放时前置克隆节点数量
+ * @param params.slidePixels - 单个滑块的像素大小
+ * @param params.normalizedSlideSize - 归一化的滑块大小百分比
+ * @param params.normalizedTrackOffset - 归一化的轨道偏移百分比
+ * @param params.stuckAtBoundary - 是否在边界处卡住
+ * @param params.rubberband - 是否开启橡皮筋效果
+ * @param params.onIndexChange - 索引变化回调
+ *
+ * @returns Hook 返回值
+ * @returns current - 当前索引
+ * @returns updateCurrent - 更新当前索引的方法
+ * @returns extIndexRef - 扩展索引的引用
+ * @returns reportIndexRef - 已报告索引的引用
+ * @returns maybeReportIndex - 可能触发索引变化回调的方法
+ * @returns getExtIndexFromIndex - 从逻辑索引获取扩展索引
+ * @returns getIndexFromExtIndex - 从扩展索引获取逻辑索引
+ * @returns getTargetExtIndexForIndex - 获取目标扩展索引（处理循环边界）
+ * @returns getBoundedPosition - 获取边界限制后的位置（橡皮筋效果）
+ */
+const useCarouselIndex = params => {
+  const {
+    total,
+    loopEnabled,
+    clonesBefore,
+    slidePixels,
+    normalizedSlideSize,
+    normalizedTrackOffset,
+    stuckAtBoundary,
+    rubberband,
+    onIndexChange
+  } = params;
+  const [current, setCurrent] = (0, _react.useState)(0);
+  const extIndexRef = (0, _react.useRef)(0);
+  const reportIndexRef = (0, _react.useRef)(null);
+  const updateCurrent = (0, _react.useCallback)(next => {
+    const normalized = total > 0 ? (0, _lodashEs.clamp)(next, 0, total - 1) : 0;
+    setCurrent(normalized);
+  }, [total]);
+  const maybeReportIndex = (0, _ahooks.useMemoizedFn)(index => {
+    if (!onIndexChange) return;
+    if (reportIndexRef.current === index) return;
+    reportIndexRef.current = index;
+    onIndexChange(index);
+  });
+  const getExtIndexFromIndex = (0, _react.useCallback)(index => {
+    if (!loopEnabled) return index;
+    return (0, _lodashEs.clamp)(index, 0, total - 1) + clonesBefore;
+  }, [clonesBefore, loopEnabled, total]);
+  const getIndexFromExtIndex = (0, _react.useCallback)(extIndex => {
+    if (!loopEnabled) return (0, _lodashEs.clamp)(extIndex, 0, total - 1);
+    if (extIndex < clonesBefore) {
+      return ((extIndex - clonesBefore) % total + total) % total;
+    }
+    if (extIndex >= clonesBefore + total) {
+      return (extIndex - clonesBefore - total) % total;
+    }
+    return extIndex - clonesBefore;
+  }, [clonesBefore, loopEnabled, total]);
+  const getTargetExtIndexForIndex = (0, _react.useCallback)(targetIndex => {
+    if (!loopEnabled) return (0, _lodashEs.clamp)(targetIndex, 0, total - 1);
+    const currentExt = extIndexRef.current;
+    const normalizedTarget = (0, _lodashEs.clamp)(targetIndex, 0, total - 1);
+    const targetExt = normalizedTarget + clonesBefore;
+    if (currentExt === clonesBefore && normalizedTarget === total - 1) return clonesBefore - 1;
+    if (currentExt === clonesBefore + total - 1 && normalizedTarget === 0) return clonesBefore + total;
+    return targetExt;
+  }, [clonesBefore, loopEnabled, total]);
+  const getBoundedPosition = (0, _ahooks.useMemoizedFn)(nextPosition => {
+    if (loopEnabled) return nextPosition;
+    if (slidePixels <= 0) return nextPosition;
+    if (total <= 0) return 0;
+    const {
+      min,
+      max
+    } = (0, _utils.getBoundaryIndexRange)({
+      total,
+      slideSize: normalizedSlideSize,
+      trackOffset: normalizedTrackOffset,
+      stuckAtBoundary
+    });
+    const minPos = min * slidePixels;
+    const maxPos = max * slidePixels;
+    if (nextPosition < minPos) {
+      if (!rubberband) return minPos;
+      return minPos - (minPos - nextPosition) * _constants.RUBBERBAND_DAMPING;
+    }
+    if (nextPosition > maxPos) {
+      if (!rubberband) return maxPos;
+      return maxPos + (nextPosition - maxPos) * _constants.RUBBERBAND_DAMPING;
+    }
+    return nextPosition;
+  });
+  return {
+    current,
+    updateCurrent,
+    extIndexRef,
+    reportIndexRef,
+    maybeReportIndex,
+    getExtIndexFromIndex,
+    getIndexFromExtIndex,
+    getTargetExtIndexForIndex,
+    getBoundedPosition
+  };
+};
+exports.useCarouselIndex = useCarouselIndex;

package/dist/commonjs/components/base/carousel/hooks/use-carousel-indicator.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCarouselIndicator = void 0;
+var _ahooks = require("ahooks");
+var _reactNative = require("react-native");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * 轮播图指示器渲染 Hook
+ *
+ * 负责渲染轮播图底部的指示器（小圆点），支持自定义指示器或使用默认样式。
+ * 当轮播项总数小于等于 1 时，不显示指示器。
+ *
+ * @param params - Hook 参数配置
+ * @param params.indicator - 指示器配置（false 表示不显示，函数表示自定义渲染）
+ * @param params.indicatorProps - 指示器属性配置（颜色、样式）
+ * @param params.total - 轮播项总数
+ * @param params.current - 当前激活的索引
+ * @param params.activeColor - 激活状态的指示器颜色
+ * @param params.inactiveColor - 非激活状态的指示器颜色
+ * @param params.styles - 指示器样式对象
+ *
+ * @returns Hook 返回值
+ * @returns renderIndicator - 渲染指示器的方法，返回 ReactNode 或 null
+ */
+const useCarouselIndicator = params => {
+  const {
+    indicator,
+    indicatorProps,
+    total,
+    current,
+    activeColor,
+    inactiveColor,
+    styles
+  } = params;
+  const renderIndicator = (0, _ahooks.useMemoizedFn)(() => {
+    if (indicator === false) return null;
+    if (total <= 1) return null;
+    if (typeof indicator === 'function') {
+      return indicator(total, current);
+    }
+    const dotActiveColor = indicatorProps?.color ?? activeColor;
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: _reactNative.StyleSheet.flatten([styles.indicatorContainer, indicatorProps?.style]),
+      children: Array.from({
+        length: total
+      }, (_, i) => {
+        const isActive = i === current;
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+          style: _reactNative.StyleSheet.flatten([styles.indicatorDot, {
+            backgroundColor: isActive ? dotActiveColor : inactiveColor
+          }, isActive && styles.indicatorDotActive])
+        }, i);
+      })
+    });
+  });
+  return {
+    renderIndicator
+  };
+};
+exports.useCarouselIndicator = useCarouselIndicator;

package/dist/commonjs/components/base/carousel/hooks/use-carousel-lifecycle.js

@@ -0,0 +1,67 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCarouselLifecycle = void 0;
+var _lodashEs = require("lodash-es");
+var _react = require("react");
+/**
+ * 轮播图生命周期管理 Hook
+ *
+ * 管理轮播图的初始化和响应式更新：
+ * - 初始化时设置默认索引和位置
+ * - 响应 slidePixels 变化时更新位置
+ * - 确保位置和索引状态的一致性
+ *
+ * @param params - Hook 参数配置
+ * @param params.total - 轮播项总数
+ * @param params.defaultIndex - 初始展示的索引
+ * @param params.slidePixels - 单个滑块的像素大小
+ * @param params.extIndexRef - 扩展索引的引用
+ * @param params.reportIndexRef - 已报告索引的引用
+ * @param params.getExtIndexFromIndex - 从逻辑索引获取扩展索引
+ * @param params.getBoundedPosition - 获取边界限制后的位置
+ * @param params.updateCurrent - 更新当前索引
+ * @param params.setPositionImmediate - 立即设置位置
+ */
+const useCarouselLifecycle = params => {
+  const {
+    total,
+    defaultIndex,
+    slidePixels,
+    extIndexRef,
+    reportIndexRef,
+    getExtIndexFromIndex,
+    getBoundedPosition,
+    updateCurrent,
+    setPositionImmediate
+  } = params;
+
+  // 初始化位置
+  (0, _react.useEffect)(() => {
+    if (total <= 0) {
+      updateCurrent(0);
+      reportIndexRef.current = null;
+      extIndexRef.current = 0;
+      setPositionImmediate(0);
+      return;
+    }
+    const normalizedDefault = (0, _lodashEs.clamp)(Math.round(defaultIndex), 0, total - 1);
+    updateCurrent(normalizedDefault);
+    reportIndexRef.current = normalizedDefault;
+    const extIndex = getExtIndexFromIndex(normalizedDefault);
+    extIndexRef.current = extIndex;
+    if (slidePixels > 0) {
+      setPositionImmediate(getBoundedPosition(extIndex * slidePixels));
+    }
+  }, [defaultIndex, getExtIndexFromIndex, getBoundedPosition, setPositionImmediate, slidePixels, total, updateCurrent, reportIndexRef, extIndexRef]);
+
+  // 响应 slidePixels 变化
+  (0, _react.useEffect)(() => {
+    if (slidePixels <= 0) return;
+    const extIndex = extIndexRef.current;
+    setPositionImmediate(getBoundedPosition(extIndex * slidePixels));
+  }, [getBoundedPosition, setPositionImmediate, slidePixels, extIndexRef]);
+};
+exports.useCarouselLifecycle = useCarouselLifecycle;

package/dist/commonjs/components/base/carousel/hooks/use-carousel-pan-responder.js

@@ -0,0 +1,123 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCarouselPanResponder = void 0;
+var _lodashEs = require("lodash-es");
+var _react = require("react");
+var _reactNative = require("react-native");
+var _constants = require("../constants.js");
+/**
+ * 轮播图手势响应 Hook
+ *
+ * 创建并管理 PanResponder，处理用户的拖动手势，实现轮播图的滑动交互。
+ * 支持水平和垂直方向的滑动，处理循环播放时的边界循环逻辑，
+ * 并根据滑动速度和距离计算最终停留位置。
+ *
+ * @param params - Hook 参数配置
+ * @param params.allowTouchMove - 是否允许手势滑动
+ * @param params.total - 轮播项总数
+ * @param params.slidePixels - 单个滑块的像素大小
+ * @param params.direction - 滑动方向（horizontal/vertical）
+ * @param params.extTotal - 扩展总数（包含克隆项）
+ * @param params.clonesBefore - 循环播放时前置克隆节点数量
+ * @param params.blockNativeResponder - 是否阻断原生手势响应
+ * @param params.position - Animated.Value 位置引用
+ * @param params.positionValueRef - 当前位置值的引用
+ * @param params.extIndexRef - 扩展索引的引用
+ * @param params.setDragging - 设置拖动状态
+ * @param params.setAnimating - 设置动画状态
+ * @param params.updateCurrent - 更新当前索引
+ * @param params.getIndexFromExtIndex - 从扩展索引获取逻辑索引
+ * @param params.getBoundedPosition - 获取边界限制后的位置
+ * @param params.swipeToExtIndex - 切换到扩展索引
+ *
+ * @returns PanResponderInstance 或 null（当不允许滑动或轮播项少于 2 个时）
+ */
+const useCarouselPanResponder = params => {
+  const {
+    allowTouchMove,
+    total,
+    slidePixels,
+    direction,
+    extTotal,
+    clonesBefore,
+    blockNativeResponder,
+    position,
+    positionValueRef,
+    extIndexRef,
+    setDragging,
+    setAnimating,
+    updateCurrent,
+    getIndexFromExtIndex,
+    getBoundedPosition,
+    swipeToExtIndex
+  } = params;
+  return (0, _react.useMemo)(() => {
+    if (!allowTouchMove) return null;
+    if (total <= 1) return null;
+    if (slidePixels <= 0) return null;
+    let startPosition = 0;
+    const axis = direction === 'horizontal' ? 'x' : 'y';
+    const shouldSet = (_, gestureState) => {
+      const primary = axis === 'x' ? gestureState.dx : gestureState.dy;
+      return Math.abs(primary) >= _constants.GESTURE_MIN_DISTANCE;
+    };
+    return _reactNative.PanResponder.create({
+      onMoveShouldSetPanResponder: shouldSet,
+      onPanResponderGrant: () => {
+        setDragging(true);
+        setAnimating(false);
+        position.current.stopAnimation();
+        startPosition = positionValueRef.current;
+      },
+      onPanResponderMove: (_evt, gestureState) => {
+        const delta = axis === 'x' ? gestureState.dx : gestureState.dy;
+        let nextPosition = startPosition - delta;
+
+        // loop 开启时,拖动到最外层有效克隆中心之外则循环偏移,保证视口内始终有内容
+        // minPos/maxPos 是 outermost before/after clone 的中心位置,由 clonesBefore 公式保证此范围内视口始终被覆盖
+        if (extTotal > total && slidePixels > 0) {
+          const totalPixels = total * slidePixels;
+          const minPos = (clonesBefore - 1) * slidePixels;
+          const maxPos = (clonesBefore + total) * slidePixels;
+          while (nextPosition < minPos) {
+            nextPosition += totalPixels;
+            startPosition += totalPixels;
+          }
+          while (nextPosition > maxPos) {
+            nextPosition -= totalPixels;
+            startPosition -= totalPixels;
+          }
+        }
+        const bounded = getBoundedPosition(nextPosition);
+        position.current.setValue(bounded);
+        positionValueRef.current = bounded;
+        const nextExtIndex = (0, _lodashEs.clamp)(Math.round(bounded / slidePixels), 0, extTotal - 1);
+        extIndexRef.current = nextExtIndex;
+        updateCurrent(getIndexFromExtIndex(nextExtIndex));
+      },
+      onPanResponderRelease: (_evt, gestureState) => {
+        setDragging(false);
+        const velocity = axis === 'x' ? gestureState.vx : gestureState.vy;
+        position.current.stopAnimation(value => {
+          const baseIndex = value / slidePixels;
+          const projectedIndex = (value - velocity * _constants.VELOCITY_PROJECTION_FACTOR) / slidePixels;
+          const minAdj = Math.floor(baseIndex);
+          const maxAdj = minAdj + 1;
+          const rounded = Math.round(projectedIndex);
+          const adjacent = (0, _lodashEs.clamp)(rounded, minAdj, maxAdj);
+          swipeToExtIndex(adjacent);
+        });
+      },
+      onPanResponderTerminate: () => {
+        setDragging(false);
+        swipeToExtIndex(extIndexRef.current);
+      },
+      onPanResponderTerminationRequest: () => false,
+      onShouldBlockNativeResponder: () => blockNativeResponder
+    });
+  }, [allowTouchMove, blockNativeResponder, clonesBefore, direction, extTotal, extIndexRef, getBoundedPosition, getIndexFromExtIndex, position, positionValueRef, setAnimating, setDragging, slidePixels, swipeToExtIndex, total, updateCurrent]);
+};
+exports.useCarouselPanResponder = useCarouselPanResponder;

package/dist/commonjs/components/base/carousel/hooks/use-carousel-position.js

@@ -0,0 +1,58 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCarouselPosition = void 0;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _constants = require("../constants.js");
+/**
+ * 轮播图位置和动画控制 Hook
+ *
+ * 管理轮播图的位置状态和动画执行，提供平滑的动画过渡和即时位置设置功能。
+ * 使用 Animated.Value 实现原生驱动的动画，确保流畅的性能。
+ *
+ * @returns Hook 返回值
+ * @returns position - Animated.Value 位置引用，用于动画变换
+ * @returns positionValueRef - 当前位置值的引用，用于同步读取位置
+ * @returns animateTo - 执行动画到指定位置的方法
+ * @returns setPositionImmediate - 立即设置位置（无动画）的方法
+ */
+const useCarouselPosition = () => {
+  const position = (0, _react.useRef)(new _reactNative.Animated.Value(0));
+  const positionValueRef = (0, _react.useRef)(0);
+  const animateTo = (0, _react.useCallback)((toValue, onFinished) => {
+    const listenerId = position.current.addListener(({
+      value
+    }) => {
+      positionValueRef.current = value;
+    });
+    _reactNative.Animated.timing(position.current, {
+      toValue,
+      duration: _constants.CAROUSEL_ANIMATION_DURATION,
+      easing: _reactNative.Easing.out(_reactNative.Easing.cubic),
+      useNativeDriver: true
+    }).start(({
+      finished
+    }) => {
+      position.current.removeListener(listenerId);
+      if (finished) {
+        positionValueRef.current = toValue;
+        onFinished?.();
+      }
+    });
+  }, []);
+  const setPositionImmediate = (0, _react.useCallback)(toValue => {
+    position.current.stopAnimation();
+    position.current.setValue(toValue);
+    positionValueRef.current = toValue;
+  }, []);
+  return {
+    position,
+    positionValueRef,
+    animateTo,
+    setPositionImmediate
+  };
+};
+exports.useCarouselPosition = useCarouselPosition;

package/dist/commonjs/components/base/carousel/hooks/use-carousel-slides.js

@@ -0,0 +1,95 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useCarouselSlides = void 0;
+var _ahooks = require("ahooks");
+var _lodashEs = require("lodash-es");
+var _react = require("react");
+var _reactNative = require("react-native");
+var _utils = require("../utils.js");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * 轮播图滑块渲染 Hook
+ *
+ * 负责渲染轮播图的滑块内容，支持静态子组件和 render prop 两种方式。
+ * 实现虚拟渲染优化，仅渲染可见范围内的滑块，并处理循环播放时的克隆逻辑。
+ * 为虚拟渲染添加前后占位空间，确保滚动位置正确。
+ *
+ * @param params - Hook 参数配置
+ * @param params.children - 轮播项内容（静态子组件或 render prop 函数）
+ * @param params.total - 轮播项总数
+ * @param params.virtualRange - 虚拟渲染范围（start、end、isVirtual）
+ * @param params.loopEnabled - 是否启用循环播放
+ * @param params.clonesBefore - 循环播放时前置克隆节点数量
+ * @param params.slideWrapperStyle - 滑块包装器样式
+ * @param params.spacerStyles - 虚拟渲染占位空间样式
+ * @param params.slideStyles - 滑块样式对象
+ *
+ * @returns Hook 返回值
+ * @returns staticSlides - 静态滑块数组（仅在非 render prop 模式下有值）
+ * @returns renderSlides - 渲染滑块的方法，返回 ReactNode 或 null
+ */
+const useCarouselSlides = params => {
+  const {
+    children,
+    total,
+    virtualRange,
+    loopEnabled,
+    clonesBefore,
+    slideWrapperStyle,
+    spacerStyles,
+    slideStyles
+  } = params;
+  const staticSlides = (0, _react.useMemo)(() => {
+    if ((0, _utils.isRenderPropChildren)(children)) return [];
+    return (0, _utils.normalizeChildren)(children, total);
+  }, [children, total]);
+  const getIndexFromExtIndex = (0, _ahooks.useMemoizedFn)(extIndex => {
+    if (!loopEnabled) return (0, _lodashEs.clamp)(extIndex, 0, total - 1);
+    if (extIndex < clonesBefore) {
+      return ((extIndex - clonesBefore) % total + total) % total;
+    }
+    if (extIndex >= clonesBefore + total) {
+      return (extIndex - clonesBefore - total) % total;
+    }
+    return extIndex - clonesBefore;
+  });
+  const renderSlides = (0, _ahooks.useMemoizedFn)(() => {
+    if (!virtualRange) return null;
+    const {
+      start,
+      end,
+      isVirtual
+    } = virtualRange;
+    const getElementForExtIndex = extIndex => {
+      const logicalIndex = loopEnabled ? getIndexFromExtIndex(extIndex) : (0, _lodashEs.clamp)(extIndex, 0, total - 1);
+      if ((0, _utils.isRenderPropChildren)(children)) return children(logicalIndex);
+      return staticSlides[logicalIndex];
+    };
+    const slideElements = [];
+    for (let extIndex = start; extIndex <= end; extIndex += 1) {
+      const element = getElementForExtIndex(extIndex);
+      if (!element) continue;
+      slideElements.push(/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: [slideStyles.slide, slideWrapperStyle],
+        children: element
+      }, extIndex));
+    }
+    const leadSpacer = isVirtual && spacerStyles && spacerStyles.leadingSize > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: spacerStyles.leading
+    }) : null;
+    const trailSpacer = isVirtual && spacerStyles && spacerStyles.trailingSize > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: spacerStyles.trailing
+    }) : null;
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+      children: [leadSpacer, slideElements, trailSpacer]
+    });
+  });
+  return {
+    staticSlides,
+    renderSlides
+  };
+};
+exports.useCarouselSlides = useCarouselSlides;