@seakoi/native-ui 1.1.3 → 1.3.0

package/CHANGELOG.md

@@ -2,6 +2,58 @@
 
 本文档记录了项目的所有重要变更。
 
+# [1.3.0](https://gitlab.seakoi.net/digiziting_client/native-ui/compare/@seakoi/native-ui@1.2.0...@seakoi/native-ui@1.3.0) (2026-03-17)
+
+
+### ♻️Code Refactoring
+
+* **native-ui:** overflow code-review (By [@caoguizhi](https://gitlab.seakoi.net/caoguizhi)) ([7df2a0a4](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/7df2a0a4584298a0928f98fc4dce47f436fbffb9))
+* **native-ui:** overflow 优化新增内容时的闪烁 (By [@caoguizhi](https://gitlab.seakoi.net/caoguizhi)) ([03af9b89](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/03af9b89c9582696ab27ebd0684d0203723ac639))
+* **root:** 优化 docs-writer 技能 (By [@dengrenshan](https://gitlab.seakoi.net/dengrenshan)) ([83548f7c](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/83548f7c317179f5630f3af824938720f2d57814))
+* **native-ui:** 优化 Picker 取值逻辑 (By [@dengrenshan](https://gitlab.seakoi.net/dengrenshan)) ([2eed1672](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/2eed16721aedaef315ee4df7a47a49b2bb5a59a3))
+* **root:** 重构 create-component 技能 (By [@dengrenshan](https://gitlab.seakoi.net/dengrenshan)) ([3b45d12a](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/3b45d12a49ec9d3a21718c06b9c321498a10b637))
+* **native-ui:** 重构 Overflow 组件架构 (By [@caoguizhi](https://gitlab.seakoi.net/caoguizhi)) ([9c91647b](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/9c91647b6f00df2b8a45cfc6ad2deb578e6778c8))
+* **native-ui:** 重构 Select 组件 API 为扁平化结构 (By [@caoguizhi](https://gitlab.seakoi.net/caoguizhi)) ([07f6b042](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/07f6b042a3e154b59cf56d1fa771376088d99d88))
+* **native-ui:** 重构 Select 组件样式系统和 Props 结构、修复受控与非受控模式 (By [@caoguizhi](https://gitlab.seakoi.net/caoguizhi)) ([e7cee1b6](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/e7cee1b6fc1bd20b927fcaceffa063859e799f09))
+
+
+### ⚡Performance Improvements
+
+* **native-ui:** 修复 Select 组件代码审查问题 (By [@caoguizhi](https://gitlab.seakoi.net/caoguizhi)) ([912357c8](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/912357c8db91e14fd50600d2e4865b65f7c53883))
+
+
+### ✨Features
+
+* **native-ui:** 增强 Portal 组件样式自定义能力 (By [@caoguizhi](https://gitlab.seakoi.net/caoguizhi)) ([0c0967da](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/0c0967dac6730b717af1f0624e22303a516d4bc7))
+* **native-ui:** 实现 Tabs 组件均分模式和徽标功能 (By [@xuzhijun](https://gitlab.seakoi.net/xuzhijun)) ([36d50faa](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/36d50faaf4b243c555487e81c9e724fcf88c7575))
+* **native-ui:** 扩展共享工具函数 (By [@caoguizhi](https://gitlab.seakoi.net/caoguizhi)) ([0b872987](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/0b872987a840b8e0d7bc90b3b631e577bde7d640))
+* **native-ui:** 新增 Overflow 溢出处理组件 (By [@caoguizhi](https://gitlab.seakoi.net/caoguizhi)) ([34b850f5](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/34b850f56e319e3e941ce2aba5829f86441eeeb4))
+* **native-ui:** 新增 Select 选择器组件 (By [@caoguizhi](https://gitlab.seakoi.net/caoguizhi)) ([0adbc6d7](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/0adbc6d7d1c9ad25923d98c4781d5dcd618956d0))
+* **root:** 添加 OpenSpec 工作流技能 (By [@dengrenshan](https://gitlab.seakoi.net/dengrenshan)) ([5f5da26c](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/5f5da26c17dde4ae39b29edb9dc2963a3cb2b030))
+
+
+### 🐛Bug Fixes
+
+* **native-ui:** 修复 BaseInput 组件失去焦点后的值处理 (By [@caoguizhi](https://gitlab.seakoi.net/caoguizhi)) ([3c1afbb5](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/3c1afbb524c0c0ac8a02f9b7927fe8f2c34b1c2d))
+* **example:** 更新tabs的示例 (By [@xuzhijun](https://gitlab.seakoi.net/xuzhijun)) ([7e5531ff](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/7e5531ffeb5ea5014e12b5cb247d5dd68dfca254))
+
+# [1.2.0](https://gitlab.seakoi.net/digiziting_client/native-ui/compare/@seakoi/native-ui@1.1.3...@seakoi/native-ui@1.2.0) (2026-03-05)
+
+
+### ♻️Code Refactoring
+
+* **wip:**  调整 Picker 组件功能 (By [@dengrenshan](https://gitlab.seakoi.net/dengrenshan)) ([d93633a9](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/d93633a91a98e5ba1ece4f9cf3f747ecac795770))
+* **native-ui, website, example:** 重构选择器组件架构，统一日期选择器实现 (By [@xuzhijun](https://gitlab.seakoi.net/xuzhijun)) ([4c84b452](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/4c84b4522503931fef32af7baa9987875b410f9f))
+
+
+### ✨Features
+
+* **native-ui:** carousel 代码重构，仅支持 data + renderItem 方式 (By [@caoguizhi](https://gitlab.seakoi.net/caoguizhi)) ([31218fe5](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/31218fe54ea5dd7f21fcba5ce84073798af4c9e4))
+* 增加一个tag组件 (By [@gtian](https://gitlab.seakoi.net/gtian)) ([69999695](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/69999695bdfe974db0b3f70f1fd6e4ae1a55cb5c))
+* **example,native-ui:** 支持自定义字段名映射 (By [@xuzhijun](https://gitlab.seakoi.net/xuzhijun)) ([40ee0370](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/40ee03702c9bbac65eab10dce41294e2b5707ff6))
+* 新增tag组件 (By [@gtian](https://gitlab.seakoi.net/gtian)) ([65e9d743](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/65e9d743e72be4f5cd9bdf99eb6355b1c8b2784f))
+* **picker:** 重构 Picker 组件以使用基础容器抽象 (By [@xuzhijun](https://gitlab.seakoi.net/xuzhijun)) ([749a6263](https://gitlab.seakoi.net/digiziting_client/native-ui/commit/749a62634803081b799ba0f2bc21f6ca3b82e98d))
+
 ## [1.1.3](https://gitlab.seakoi.net/digiziting_client/native-ui/compare/@seakoi/native-ui@1.1.2...@seakoi/native-ui@1.1.3) (2026-03-02)
 
 

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

@@ -0,0 +1,56 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CarouselIndicator = void 0;
+var _reactNative = require("react-native");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * 轮播图指示器渲染组件
+ *
+ * 负责渲染轮播图底部的指示器（小圆点），支持自定义指示器或使用默认样式。
+ * 当轮播项总数小于等于 1 时，不显示指示器。
+ *
+ * @param props - 组件属性配置
+ * @param props.indicator - 指示器配置（false 表示不显示，函数表示自定义渲染）
+ * @param props.indicatorProps - 指示器属性配置（颜色、样式）
+ * @param props.total - 轮播项总数
+ * @param props.current - 当前激活的索引
+ * @param props.activeColor - 激活状态的指示器颜色
+ * @param props.inactiveColor - 非激活状态的指示器颜色
+ * @param props.styles - 指示器样式对象
+ *
+ * @returns 渲染的指示器内容或 null
+ */
+const CarouselIndicator = props => {
+  const {
+    indicator,
+    indicatorProps,
+    total,
+    current,
+    activeColor,
+    inactiveColor,
+    styles
+  } = props;
+  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: [styles.indicatorContainer, indicatorProps?.style],
+    children: Array.from({
+      length: total
+    }, (_, i) => {
+      const isActive = i === current;
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: [styles.indicatorDot, {
+          backgroundColor: isActive ? dotActiveColor : inactiveColor
+        }, isActive && styles.indicatorDotActive]
+      }, i);
+    })
+  });
+};
+exports.CarouselIndicator = CarouselIndicator;

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

@@ -0,0 +1,140 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CarouselSlides = void 0;
+var _ahooks = require("ahooks");
+var _lodashEs = require("lodash-es");
+var _react = require("react");
+var _reactNative = require("react-native");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * 轮播图滑块渲染组件
+ *
+ * 负责渲染轮播图的滑块内容，使用 data + renderItem 模式。
+ * 实现虚拟渲染优化，仅渲染可见范围内的滑块，并处理循环播放时的克隆逻辑。
+ * 为虚拟渲染添加前后占位空间，确保滚动位置正确。
+ *
+ * @template Data - 数据项类型
+ * @param props - 组件属性配置
+ * @param props.data - 数据源数组
+ * @param props.renderItem - 渲染每一项的函数
+ * @param props.total - 轮播项总数
+ * @param props.virtualRange - 虚拟渲染范围（start、end、isVirtual）
+ * @param props.loopEnabled - 是否启用循环播放
+ * @param props.clonesBefore - 循环播放时前置克隆节点数量
+ * @param props.direction - 滑动方向
+ * @param props.slidePixels - 单个滑块的像素大小
+ * @param props.extTotal - 扩展后的总数（包含克隆节点）
+ *
+ * @returns 渲染的滑块内容或 null
+ */
+const CarouselSlides = props => {
+  const {
+    data,
+    renderItem,
+    total,
+    virtualRange,
+    loopEnabled,
+    clonesBefore,
+    direction,
+    slidePixels,
+    extTotal
+  } = props;
+
+  // 计算滑块包装器样式
+  const slideWrapperStyle = (0, _react.useMemo)(() => {
+    return direction === 'horizontal' ? {
+      width: slidePixels,
+      height: '100%'
+    } : {
+      height: slidePixels,
+      width: '100%'
+    };
+  }, [direction, slidePixels]);
+
+  // 计算虚拟渲染的占位空间样式
+  const spacerStyles = (0, _react.useMemo)(() => {
+    if (!virtualRange) return null;
+    const {
+      start,
+      end
+    } = virtualRange;
+    const leadingSize = start * slidePixels;
+    const trailingSize = (extTotal - end - 1) * slidePixels;
+    return {
+      leading: direction === 'horizontal' ? {
+        width: leadingSize
+      } : {
+        height: leadingSize
+      },
+      trailing: direction === 'horizontal' ? {
+        width: trailingSize
+      } : {
+        height: trailingSize
+      },
+      leadingSize,
+      trailingSize
+    };
+  }, [virtualRange, slidePixels, extTotal, direction]);
+  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 slideElements = (0, _react.useMemo)(() => {
+    if (!virtualRange) return null;
+    const {
+      start,
+      end
+    } = virtualRange;
+    const elements = [];
+    const getElementForExtIndex = extIndex => {
+      const logicalIndex = loopEnabled ? getIndexFromExtIndex(extIndex) : (0, _lodashEs.clamp)(extIndex, 0, total - 1);
+      const item = data[logicalIndex];
+      return renderItem(item, logicalIndex);
+    };
+    for (let extIndex = start; extIndex <= end; extIndex += 1) {
+      const element = getElementForExtIndex(extIndex);
+      if (!element) continue;
+      elements.push(/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+        style: slideWrapperStyle,
+        children: element
+      }, extIndex));
+    }
+    return elements;
+  }, [virtualRange, loopEnabled, total, data, renderItem, slideWrapperStyle, getIndexFromExtIndex]);
+
+  // 前置占位空间
+  const leadSpacer = (0, _react.useMemo)(() => {
+    if (!virtualRange?.isVirtual || !spacerStyles || spacerStyles.leadingSize <= 0) {
+      return null;
+    }
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: spacerStyles.leading
+    });
+  }, [virtualRange?.isVirtual, spacerStyles]);
+
+  // 后置占位空间
+  const trailSpacer = (0, _react.useMemo)(() => {
+    if (!virtualRange?.isVirtual || !spacerStyles || spacerStyles.trailingSize <= 0) {
+      return null;
+    }
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: spacerStyles.trailing
+    });
+  }, [virtualRange?.isVirtual, spacerStyles]);
+  if (!virtualRange) return null;
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [leadSpacer, slideElements, trailSpacer]
+  });
+};
+exports.CarouselSlides = CarouselSlides;

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

@@ -8,11 +8,18 @@ var _lodashEs = require("lodash-es");
 var _react = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
 var _index = require("../../../native-provider/index.js");
+var _carouselIndicator = require("./carousel-indicator.js");
+var _carouselSlides = require("./carousel-slides.js");
 var _index2 = require("./hooks/index.js");
 var _index3 = require("./style/index.js");
-var _utils = require("./utils.js");
 var _jsxRuntime = require("react/jsx-runtime");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
+/**
+ * 虚拟渲染触发阈值
+ * 当轮播项数量超过此值时启用虚拟渲染优化
+ */
+const VIRTUAL_RENDER_THRESHOLD = 10;
+
 /**
  * 轮播图组件
  *
@@ -21,20 +28,25 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
  * @example
  * ```tsx
  * // 基础用法
- * <Carousel>
- *   <Carousel.Item><View /></Carousel.Item>
- *   <Carousel.Item><View /></Carousel.Item>
- * </Carousel>
+ * <Carousel
+ *   data={[1, 2, 3]}
+ *   renderItem={(item) => <View><Text>{item}</Text></View>}
+ * />
  *
  * // 循环播放和自动轮播
- * <Carousel loop autoplay autoplayInterval={3000}>
- *   {items.map(item => <Carousel.Item key={item.id}>{item.content}</Carousel.Item>)}
- * </Carousel>
+ * <Carousel
+ *   data={items}
+ *   renderItem={(item) => <View>{item.content}</View>}
+ *   loop
+ *   autoplay
+ *   autoplayInterval={3000}
+ * />
  *
  * // 虚拟渲染（大量数据）
- * <Carousel total={1000}>
- *   {(index) => <Carousel.Item><Text>{index}</Text></Carousel.Item>}
- * </Carousel>
+ * <Carousel
+ *   data={largeDataArray}
+ *   renderItem={(item, index) => <View><Text>{index}: {item}</Text></View>}
+ * />
  * ```
  *
  * @param props - 组件属性
@@ -56,35 +68,43 @@ const Carousel = props => {
     stuckAtBoundary = true,
     rubberband = true,
     virtualOverscan = 2,
-    total: totalProp,
-    children,
+    data,
+    renderItem,
     style,
     blockNativeResponder = true,
     ref
   } = props;
   const styles = (0, _index3.useCarouselStyles)();
   const theme = (0, _index.useTheme)();
+
+  // 使用 state 存储 layout，使依赖更明确
   const [layout, setLayout] = (0, _react.useState)({
     width: 0,
     height: 0
   });
-  const [dragging, setDragging] = (0, _react.useState)(false);
-  const [animating, setAnimating] = (0, _react.useState)(false);
-  const normalizedSlideSize = (0, _react.useMemo)(() => {
-    if (!Number.isFinite(slideSize)) return 100;
-    return (0, _lodashEs.clamp)(slideSize, 0, 100);
-  }, [slideSize]);
-  const normalizedTrackOffset = (0, _react.useMemo)(() => {
+
+  // 分离拖动和动画状态，避免状态冲突
+  const [isDragging, setIsDragging] = (0, _react.useState)(false);
+  const [isAnimating, setIsAnimating] = (0, _react.useState)(false);
+
+  // 合并归一化计算，减少 useMemo 调用
+  const {
+    normalizedSlideSize,
+    normalizedTrackOffset
+  } = (0, _react.useMemo)(() => {
+    const slideSize_ = Number.isFinite(slideSize) ? (0, _lodashEs.clamp)(slideSize, 0, 100) : 100;
+    let trackOffset_;
     if (stuckAtBoundary) {
-      return 100 - normalizedSlideSize;
+      trackOffset_ = 100 - slideSize_;
+    } else {
+      trackOffset_ = Number.isFinite(trackOffset) ? (0, _lodashEs.clamp)(trackOffset, 0, 100 - slideSize_) : 0;
     }
-    if (!Number.isFinite(trackOffset)) return 0;
-    return (0, _lodashEs.clamp)(trackOffset, 0, 100 - normalizedSlideSize);
-  }, [normalizedSlideSize, trackOffset, stuckAtBoundary]);
-  const total = (0, _react.useMemo)(() => {
-    const normalizedDefault = (0, _utils.getDefaultTotal)(children);
-    return totalProp ?? normalizedDefault;
-  }, [children, totalProp]);
+    return {
+      normalizedSlideSize: slideSize_,
+      normalizedTrackOffset: trackOffset_
+    };
+  }, [slideSize, trackOffset, stuckAtBoundary]);
+  const total = data.length;
   const loopEnabled = loop && total > 1;
 
   // 计算循环播放时需要克隆的前置节点数量
@@ -105,16 +125,22 @@ const Carousel = props => {
     return Math.max(1, trailingSlides + 1);
   }, [loopEnabled, normalizedSlideSize, normalizedTrackOffset]);
   const extTotal = loopEnabled ? total + clonesBefore + clonesAfter : total;
-  const slidePixels = (0, _react.useMemo)(() => {
-    const trackSize = direction === 'horizontal' ? layout.width : layout.height;
-    if (trackSize <= 0) return 0;
-    return trackSize * (normalizedSlideSize / 100);
-  }, [direction, layout.height, layout.width, normalizedSlideSize]);
-  const trackOffsetPixels = (0, _react.useMemo)(() => {
+
+  // 合并像素计算，减少重复的 trackSize 获取
+  const {
+    slidePixels,
+    trackOffsetPixels
+  } = (0, _react.useMemo)(() => {
     const trackSize = direction === 'horizontal' ? layout.width : layout.height;
-    if (trackSize <= 0) return 0;
-    return trackSize * (normalizedTrackOffset / 100);
-  }, [direction, layout.height, layout.width, normalizedTrackOffset]);
+    if (trackSize <= 0) return {
+      slidePixels: 0,
+      trackOffsetPixels: 0
+    };
+    return {
+      slidePixels: trackSize * (normalizedSlideSize / 100),
+      trackOffsetPixels: trackSize * (normalizedTrackOffset / 100)
+    };
+  }, [direction, layout, normalizedSlideSize, normalizedTrackOffset]);
   const {
     current,
     updateCurrent,
@@ -145,6 +171,14 @@ const Carousel = props => {
     setPositionImmediate
   } = (0, _index2.useCarouselPosition)();
 
+  // 状态设置函数
+  const setDragging = (0, _react.useCallback)(dragging => {
+    setIsDragging(dragging);
+  }, []);
+  const setAnimating = (0, _react.useCallback)(animating => {
+    setIsAnimating(animating);
+  }, []);
+
   // 切换逻辑
   const {
     swipeNext,
@@ -173,7 +207,7 @@ const Carousel = props => {
     autoplay,
     autoplayInterval,
     total,
-    dragging,
+    dragging: isDragging,
     current,
     swipeNext,
     swipePrev
@@ -197,11 +231,13 @@ const Carousel = props => {
       height
     } = e.nativeEvent.layout;
     setLayout(prev => {
-      if (prev.width === width && prev.height === height) return prev;
-      return {
-        width,
-        height
-      };
+      if (prev.width !== width || prev.height !== height) {
+        return {
+          width,
+          height
+        };
+      }
+      return prev;
     });
   }, []);
   const panResponder = (0, _index2.useCarouselPanResponder)({
@@ -236,15 +272,17 @@ const Carousel = props => {
   }, [direction, position, trackOffsetPixels]);
 
   // 计算虚拟渲染的范围
-  // 注意: extIndexRef 的变化不会触发重新计算，
-  // 通过 dragging 和 animating 状态的变化来触发虚拟范围的更新
+  // 使用 current 状态而不是 extIndexRef，确保虚拟范围与当前索引同步
   const virtualRange = (0, _react.useMemo)(() => {
     if (total <= 0 || slidePixels <= 0) {
       return null;
     }
-    const isVirtual = (0, _utils.isRenderPropChildren)(children) && typeof totalProp === 'number';
-    const effectiveOverscan = isVirtual ? Math.max(virtualOverscan, dragging || animating ? 1 : 0) : virtualOverscan;
-    const currentExtIndex = extIndexRef.current;
+    const isVirtual = total > VIRTUAL_RENDER_THRESHOLD;
+    const isInteracting = isDragging || isAnimating;
+    const effectiveOverscan = isVirtual ? Math.max(virtualOverscan, isInteracting ? 1 : 0) : virtualOverscan;
+
+    // 使用 current 计算 extIndex，确保响应式更新
+    const currentExtIndex = loopEnabled ? current + clonesBefore : current;
     const start = isVirtual ? (0, _lodashEs.clamp)(currentExtIndex - effectiveOverscan, 0, extTotal - 1) : 0;
     const end = isVirtual ? (0, _lodashEs.clamp)(currentExtIndex + effectiveOverscan, 0, extTotal - 1) : extTotal - 1;
     return {
@@ -252,87 +290,41 @@ const Carousel = props => {
       end,
       isVirtual
     };
-  }, [total, slidePixels, children, totalProp, virtualOverscan, dragging, animating, extIndexRef,
-  // 保留以表明依赖关系，虽然不会触发更新
-  extTotal]);
+  }, [total, slidePixels, virtualOverscan, isDragging, isAnimating, current, loopEnabled, clonesBefore, extTotal]);
+  const trackInnerStyle = direction === 'horizontal' ? styles.trackInnerHorizontal : styles.trackInnerVertical;
 
-  // 计算滑块包装器样式
-  const slideWrapperStyle = (0, _react.useMemo)(() => {
-    return direction === 'horizontal' ? {
-      width: slidePixels,
-      height: '100%'
-    } : {
-      height: slidePixels,
-      width: '100%'
-    };
-  }, [direction, slidePixels]);
-
-  // 计算虚拟渲染的占位空间样式
-  const spacerStyles = (0, _react.useMemo)(() => {
-    if (!virtualRange) return null;
-    const {
-      start,
-      end
-    } = virtualRange;
-    const leadingSize = start * slidePixels;
-    const trailingSize = (extTotal - end - 1) * slidePixels;
-    return {
-      leading: direction === 'horizontal' ? {
-        width: leadingSize
-      } : {
-        height: leadingSize
-      },
-      trailing: direction === 'horizontal' ? {
-        width: trailingSize
-      } : {
-        height: trailingSize
-      },
-      leadingSize,
-      trailingSize
-    };
-  }, [virtualRange, slidePixels, extTotal, direction]);
-  const {
-    renderSlides
-  } = (0, _index2.useCarouselSlides)({
-    children,
-    total,
-    virtualRange,
-    loopEnabled,
-    clonesBefore,
-    slideWrapperStyle,
-    spacerStyles,
-    slideStyles: styles
-  });
-  const {
-    renderIndicator
-  } = (0, _index2.useCarouselIndicator)({
-    indicator,
-    indicatorProps,
-    total,
-    current,
-    activeColor: theme.palette.brand7,
-    inactiveColor: theme.palette.fontGray5,
-    styles
-  });
-  const trackInnerStyle = (0, _react.useMemo)(() => {
-    return direction === 'horizontal' ? {
-      flexDirection: 'row',
-      height: '100%'
-    } : {
-      flexDirection: 'column',
-      width: '100%'
-    };
-  }, [direction]);
+  // 边界情况处理：空数据
+  if (!data || data.length === 0) {
+    return null;
+  }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    style: _reactNative.StyleSheet.flatten([styles.container, style]),
+    style: [styles.container, style],
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
       style: styles.track,
       onLayout: onLayoutTrack,
       ...panResponder?.panHandlers,
       children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Animated.View, {
-        style: _reactNative.StyleSheet.flatten([styles.trackInner, trackInnerStyle, trackTransformStyle]),
-        children: renderSlides()
-      }), renderIndicator()]
+        style: [styles.trackInner, trackInnerStyle, trackTransformStyle],
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_carouselSlides.CarouselSlides, {
+          data: data,
+          renderItem: renderItem,
+          total: total,
+          virtualRange: virtualRange,
+          loopEnabled: loopEnabled,
+          clonesBefore: clonesBefore,
+          direction: direction,
+          slidePixels: slidePixels,
+          extTotal: extTotal
+        })
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_carouselIndicator.CarouselIndicator, {
+        indicator: indicator,
+        indicatorProps: indicatorProps,
+        total: total,
+        current: current,
+        activeColor: theme.palette.brand7,
+        inactiveColor: theme.palette.fontGray5,
+        styles: styles
+      })]
     })
   });
 };

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

@@ -15,12 +15,6 @@ Object.defineProperty(exports, "useCarouselIndex", {
     return _useCarouselIndex.useCarouselIndex;
   }
 });
-Object.defineProperty(exports, "useCarouselIndicator", {
-  enumerable: true,
-  get: function () {
-    return _useCarouselIndicator.useCarouselIndicator;
-  }
-});
 Object.defineProperty(exports, "useCarouselLifecycle", {
   enumerable: true,
   get: function () {
@@ -39,12 +33,6 @@ Object.defineProperty(exports, "useCarouselPosition", {
     return _useCarouselPosition.useCarouselPosition;
   }
 });
-Object.defineProperty(exports, "useCarouselSlides", {
-  enumerable: true,
-  get: function () {
-    return _useCarouselSlides.useCarouselSlides;
-  }
-});
 Object.defineProperty(exports, "useCarouselSwipe", {
   enumerable: true,
   get: function () {
@@ -53,9 +41,7 @@ Object.defineProperty(exports, "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-index.js

@@ -7,8 +7,10 @@ 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");
+/**
+ * 橡皮筋效果阻尼系数
+ */
+const RUBBERBAND_DAMPING = 0.35;
 /**
  * 轮播图索引管理 Hook
  *
@@ -93,24 +95,25 @@ const useCarouselIndex = params => {
     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
-    });
+
+    // 计算轮播边界索引范围
+    let min = 0;
+    let max = total - 1;
+    if (stuckAtBoundary) {
+      const slideRatio = normalizedSlideSize / 100;
+      const offsetRatio = normalizedTrackOffset / 100;
+      min = 0 + offsetRatio / (slideRatio || 1);
+      max = total - 1 - (1 - slideRatio - offsetRatio) / (slideRatio || 1);
+    }
     const minPos = min * slidePixels;
     const maxPos = max * slidePixels;
     if (nextPosition < minPos) {
       if (!rubberband) return minPos;
-      return minPos - (minPos - nextPosition) * _constants.RUBBERBAND_DAMPING;
+      return minPos - (minPos - nextPosition) * RUBBERBAND_DAMPING;
     }
     if (nextPosition > maxPos) {
       if (!rubberband) return maxPos;
-      return maxPos + (nextPosition - maxPos) * _constants.RUBBERBAND_DAMPING;
+      return maxPos + (nextPosition - maxPos) * RUBBERBAND_DAMPING;
     }
     return nextPosition;
   });