@seakoi/native-ui 1.1.2 → 1.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (224) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/dist/commonjs/components/base/carousel/carousel-indicator.js +56 -0
  3. package/dist/commonjs/components/base/carousel/carousel-slides.js +140 -0
  4. package/dist/commonjs/components/base/carousel/carousel.js +114 -122
  5. package/dist/commonjs/components/base/carousel/hooks/index.js +0 -14
  6. package/dist/commonjs/components/base/carousel/hooks/use-carousel-index.js +16 -13
  7. package/dist/commonjs/components/base/carousel/hooks/use-carousel-lifecycle.js +6 -2
  8. package/dist/commonjs/components/base/carousel/hooks/use-carousel-pan-responder.js +40 -12
  9. package/dist/commonjs/components/base/carousel/hooks/use-carousel-position.js +6 -2
  10. package/dist/commonjs/components/base/carousel/index.js +1 -15
  11. package/dist/commonjs/components/base/carousel/style/index.js +12 -0
  12. package/dist/commonjs/components/base/date-picker/date-picker.js +56 -44
  13. package/dist/commonjs/components/base/date-picker/date-range-picker.js +142 -50
  14. package/dist/commonjs/components/base/date-picker/style/index.js +15 -0
  15. package/dist/commonjs/components/base/date-picker-view/date-picker-view.js +19 -53
  16. package/dist/commonjs/components/base/date-picker-view/index.js +0 -22
  17. package/dist/commonjs/components/base/index.js +30 -8
  18. package/dist/commonjs/components/base/picker/index.js +26 -4
  19. package/dist/commonjs/components/base/picker/picker-content.js +60 -0
  20. package/dist/commonjs/components/base/picker/picker-context.js +9 -0
  21. package/dist/commonjs/components/base/picker/picker-field.js +37 -0
  22. package/dist/commonjs/components/base/picker/picker.js +22 -96
  23. package/dist/commonjs/components/base/picker/style/index.js +1 -3
  24. package/dist/commonjs/components/base/picker-backup/base-picker-container.js +50 -0
  25. package/dist/commonjs/components/base/picker-backup/index.js +27 -0
  26. package/dist/commonjs/components/base/picker-backup/picker-backup.js +75 -0
  27. package/dist/commonjs/components/base/picker-backup/picker-copy.js +106 -0
  28. package/dist/commonjs/components/base/{picker → picker-backup}/picker-trigger.js +5 -5
  29. package/dist/commonjs/components/base/picker-backup/style/index.js +19 -0
  30. package/dist/commonjs/components/base/picker-backup/utils.js +53 -0
  31. package/dist/commonjs/components/base/picker-view/picker-view-column.js +15 -0
  32. package/dist/commonjs/components/base/picker-view/picker-view.js +4 -4
  33. package/dist/commonjs/components/base/tag/index.js +20 -0
  34. package/dist/commonjs/components/base/tag/style/index.js +89 -0
  35. package/dist/commonjs/components/base/tag/tag-context.js +12 -0
  36. package/dist/commonjs/components/base/tag/tag-group.js +35 -0
  37. package/dist/commonjs/components/base/tag/tag.js +47 -0
  38. package/dist/commonjs/components/base/tag/types.js +5 -0
  39. package/dist/module/components/base/carousel/carousel-indicator.js +51 -0
  40. package/dist/module/components/base/carousel/carousel-slides.js +135 -0
  41. package/dist/module/components/base/carousel/carousel.js +116 -124
  42. package/dist/module/components/base/carousel/hooks/index.js +0 -2
  43. package/dist/module/components/base/carousel/hooks/use-carousel-index.js +15 -11
  44. package/dist/module/components/base/carousel/hooks/use-carousel-lifecycle.js +6 -2
  45. package/dist/module/components/base/carousel/hooks/use-carousel-pan-responder.js +40 -11
  46. package/dist/module/components/base/carousel/hooks/use-carousel-position.js +5 -1
  47. package/dist/module/components/base/carousel/index.js +1 -5
  48. package/dist/module/components/base/carousel/style/index.js +12 -0
  49. package/dist/module/components/base/date-picker/date-picker.js +60 -48
  50. package/dist/module/components/base/date-picker/date-range-picker.js +146 -54
  51. package/dist/module/components/base/date-picker/style/index.js +11 -0
  52. package/dist/module/components/base/date-picker-view/date-picker-view.js +23 -57
  53. package/dist/module/components/base/date-picker-view/index.js +1 -3
  54. package/dist/module/components/base/index.js +2 -0
  55. package/dist/module/components/base/picker/index.js +9 -1
  56. package/dist/module/components/base/picker/picker-content.js +54 -0
  57. package/dist/module/components/base/picker/picker-context.js +4 -0
  58. package/dist/module/components/base/picker/picker-field.js +32 -0
  59. package/dist/module/components/base/picker/picker.js +25 -99
  60. package/dist/module/components/base/picker/style/index.js +1 -3
  61. package/dist/module/components/base/picker-backup/base-picker-container.js +44 -0
  62. package/dist/module/components/base/picker-backup/index.js +4 -0
  63. package/dist/module/components/base/picker-backup/picker-backup.js +69 -0
  64. package/dist/module/components/base/picker-backup/picker-copy.js +101 -0
  65. package/dist/module/components/base/{picker → picker-backup}/picker-trigger.js +2 -2
  66. package/dist/module/components/base/picker-backup/style/index.js +15 -0
  67. package/dist/module/components/base/picker-backup/utils.js +48 -0
  68. package/dist/module/components/base/picker-view/picker-view-column.js +15 -0
  69. package/dist/module/components/base/picker-view/picker-view.js +4 -4
  70. package/dist/module/components/base/tag/index.js +5 -0
  71. package/dist/module/components/base/tag/style/index.js +85 -0
  72. package/dist/module/components/base/tag/tag-context.js +8 -0
  73. package/dist/module/components/base/tag/tag-group.js +29 -0
  74. package/dist/module/components/base/tag/tag.js +41 -0
  75. package/dist/module/components/base/tag/types.js +3 -0
  76. package/dist/typescript/components/base/carousel/carousel-indicator.d.ts +42 -0
  77. package/dist/typescript/components/base/carousel/carousel-indicator.d.ts.map +1 -0
  78. package/dist/typescript/components/base/carousel/carousel-slides.d.ts +49 -0
  79. package/dist/typescript/components/base/carousel/carousel-slides.d.ts.map +1 -0
  80. package/dist/typescript/components/base/carousel/carousel.d.ts +16 -11
  81. package/dist/typescript/components/base/carousel/carousel.d.ts.map +1 -1
  82. package/dist/typescript/components/base/carousel/hooks/index.d.ts +0 -2
  83. package/dist/typescript/components/base/carousel/hooks/index.d.ts.map +1 -1
  84. package/dist/typescript/components/base/carousel/hooks/use-carousel-index.d.ts.map +1 -1
  85. package/dist/typescript/components/base/carousel/hooks/use-carousel-lifecycle.d.ts.map +1 -1
  86. package/dist/typescript/components/base/carousel/hooks/use-carousel-pan-responder.d.ts.map +1 -1
  87. package/dist/typescript/components/base/carousel/hooks/use-carousel-position.d.ts.map +1 -1
  88. package/dist/typescript/components/base/carousel/index.d.ts +1 -4
  89. package/dist/typescript/components/base/carousel/index.d.ts.map +1 -1
  90. package/dist/typescript/components/base/carousel/style/index.d.ts +12 -0
  91. package/dist/typescript/components/base/carousel/style/index.d.ts.map +1 -1
  92. package/dist/typescript/components/base/carousel/types.d.ts +8 -17
  93. package/dist/typescript/components/base/carousel/types.d.ts.map +1 -1
  94. package/dist/typescript/components/base/date-picker/date-picker.d.ts +4 -2
  95. package/dist/typescript/components/base/date-picker/date-picker.d.ts.map +1 -1
  96. package/dist/typescript/components/base/date-picker/date-range-picker.d.ts +12 -3
  97. package/dist/typescript/components/base/date-picker/date-range-picker.d.ts.map +1 -1
  98. package/dist/typescript/components/base/date-picker/style/index.d.ts +9 -0
  99. package/dist/typescript/components/base/date-picker/style/index.d.ts.map +1 -0
  100. package/dist/typescript/components/base/date-picker-view/date-picker-view.d.ts +1 -6
  101. package/dist/typescript/components/base/date-picker-view/date-picker-view.d.ts.map +1 -1
  102. package/dist/typescript/components/base/date-picker-view/index.d.ts +0 -2
  103. package/dist/typescript/components/base/date-picker-view/index.d.ts.map +1 -1
  104. package/dist/typescript/components/base/date-picker-view/types.d.ts +1 -1
  105. package/dist/typescript/components/base/index.d.ts +2 -0
  106. package/dist/typescript/components/base/index.d.ts.map +1 -1
  107. package/dist/typescript/components/base/picker/index.d.ts +7 -1
  108. package/dist/typescript/components/base/picker/index.d.ts.map +1 -1
  109. package/dist/typescript/components/base/picker/picker-content.d.ts +15 -0
  110. package/dist/typescript/components/base/picker/picker-content.d.ts.map +1 -0
  111. package/dist/typescript/components/base/picker/picker-context.d.ts +18 -0
  112. package/dist/typescript/components/base/picker/picker-context.d.ts.map +1 -0
  113. package/dist/typescript/components/base/picker/picker-field.d.ts +10 -0
  114. package/dist/typescript/components/base/picker/picker-field.d.ts.map +1 -0
  115. package/dist/typescript/components/base/picker/picker.d.ts +13 -11
  116. package/dist/typescript/components/base/picker/picker.d.ts.map +1 -1
  117. package/dist/typescript/components/base/picker/style/index.d.ts +0 -2
  118. package/dist/typescript/components/base/picker/style/index.d.ts.map +1 -1
  119. package/dist/typescript/components/base/picker-backup/base-picker-container.d.ts +15 -0
  120. package/dist/typescript/components/base/picker-backup/base-picker-container.d.ts.map +1 -0
  121. package/dist/typescript/components/base/picker-backup/index.d.ts +3 -0
  122. package/dist/typescript/components/base/picker-backup/index.d.ts.map +1 -0
  123. package/dist/typescript/components/base/picker-backup/picker-backup.d.ts +26 -0
  124. package/dist/typescript/components/base/picker-backup/picker-backup.d.ts.map +1 -0
  125. package/dist/typescript/components/base/picker-backup/picker-copy.d.ts +13 -0
  126. package/dist/typescript/components/base/picker-backup/picker-copy.d.ts.map +1 -0
  127. package/dist/typescript/components/base/picker-backup/picker-trigger.d.ts.map +1 -0
  128. package/dist/typescript/components/base/picker-backup/style/index.d.ts +13 -0
  129. package/dist/typescript/components/base/picker-backup/style/index.d.ts.map +1 -0
  130. package/dist/typescript/components/base/picker-backup/utils.d.ts +8 -0
  131. package/dist/typescript/components/base/picker-backup/utils.d.ts.map +1 -0
  132. package/dist/typescript/components/base/picker-view/picker-view-column.d.ts.map +1 -1
  133. package/dist/typescript/components/base/picker-view/utils/picker.d.ts +3 -3
  134. package/dist/typescript/components/base/picker-view/utils/picker.d.ts.map +1 -1
  135. package/dist/typescript/components/base/tag/index.d.ts +5 -0
  136. package/dist/typescript/components/base/tag/index.d.ts.map +1 -0
  137. package/dist/typescript/components/base/tag/style/index.d.ts +61 -0
  138. package/dist/typescript/components/base/tag/style/index.d.ts.map +1 -0
  139. package/dist/typescript/components/base/tag/tag-context.d.ts +3 -0
  140. package/dist/typescript/components/base/tag/tag-context.d.ts.map +1 -0
  141. package/dist/typescript/components/base/tag/tag-group.d.ts +4 -0
  142. package/dist/typescript/components/base/tag/tag-group.d.ts.map +1 -0
  143. package/dist/typescript/components/base/tag/tag.d.ts +4 -0
  144. package/dist/typescript/components/base/tag/tag.d.ts.map +1 -0
  145. package/dist/typescript/components/base/tag/types.d.ts +48 -0
  146. package/dist/typescript/components/base/tag/types.d.ts.map +1 -0
  147. package/package.json +12 -4
  148. package/src/components/base/carousel/carousel-indicator.tsx +80 -0
  149. package/src/components/base/carousel/carousel-slides.tsx +177 -0
  150. package/src/components/base/carousel/carousel.tsx +108 -118
  151. package/src/components/base/carousel/hooks/index.ts +0 -2
  152. package/src/components/base/carousel/hooks/use-carousel-index.ts +13 -9
  153. package/src/components/base/carousel/hooks/use-carousel-lifecycle.ts +4 -3
  154. package/src/components/base/carousel/hooks/use-carousel-pan-responder.ts +40 -16
  155. package/src/components/base/carousel/hooks/use-carousel-position.ts +4 -1
  156. package/src/components/base/carousel/index.ts +1 -3
  157. package/src/components/base/carousel/style/index.ts +12 -0
  158. package/src/components/base/carousel/types.ts +8 -21
  159. package/src/components/base/date-picker/date-picker.tsx +64 -61
  160. package/src/components/base/date-picker/date-range-picker.tsx +178 -70
  161. package/src/components/base/date-picker/style/index.ts +10 -0
  162. package/src/components/base/date-picker-view/date-picker-view.tsx +21 -68
  163. package/src/components/base/date-picker-view/index.ts +0 -2
  164. package/src/components/base/date-picker-view/types.ts +1 -1
  165. package/src/components/base/index.ts +2 -0
  166. package/src/components/base/picker/index.ts +11 -1
  167. package/src/components/base/picker/picker-content.tsx +75 -0
  168. package/src/components/base/picker/picker-context.ts +19 -0
  169. package/src/components/base/picker/picker-field.tsx +50 -0
  170. package/src/components/base/picker/picker.tsx +38 -114
  171. package/src/components/base/picker/style/index.ts +0 -2
  172. package/src/components/base/picker-backup/base-picker-container.tsx +55 -0
  173. package/src/components/base/picker-backup/index.ts +2 -0
  174. package/src/components/base/picker-backup/picker-backup.tsx +110 -0
  175. package/src/components/base/picker-backup/picker-copy.tsx +125 -0
  176. package/src/components/base/{picker → picker-backup}/picker-trigger.tsx +2 -2
  177. package/src/components/base/picker-backup/style/index.ts +14 -0
  178. package/src/components/base/picker-backup/utils.ts +62 -0
  179. package/src/components/base/picker-view/picker-view-column.tsx +20 -0
  180. package/src/components/base/picker-view/picker-view.tsx +4 -4
  181. package/src/components/base/picker-view/utils/picker.ts +3 -5
  182. package/src/components/base/tag/index.ts +5 -0
  183. package/src/components/base/tag/style/index.tsx +84 -0
  184. package/src/components/base/tag/tag-context.ts +9 -0
  185. package/src/components/base/tag/tag-group.tsx +31 -0
  186. package/src/components/base/tag/tag.tsx +50 -0
  187. package/src/components/base/tag/types.ts +71 -0
  188. package/dist/commonjs/components/base/carousel/carousel-item.js +0 -45
  189. package/dist/commonjs/components/base/carousel/constants.js +0 -25
  190. package/dist/commonjs/components/base/carousel/hooks/use-carousel-indicator.js +0 -63
  191. package/dist/commonjs/components/base/carousel/hooks/use-carousel-slides.js +0 -95
  192. package/dist/commonjs/components/base/carousel/utils.js +0 -63
  193. package/dist/commonjs/components/base/date-picker-view/date-range-picker-view.js +0 -145
  194. package/dist/commonjs/components/base/date-picker-view/date-time-picker.js +0 -39
  195. package/dist/module/components/base/carousel/carousel-item.js +0 -40
  196. package/dist/module/components/base/carousel/constants.js +0 -21
  197. package/dist/module/components/base/carousel/hooks/use-carousel-indicator.js +0 -58
  198. package/dist/module/components/base/carousel/hooks/use-carousel-slides.js +0 -90
  199. package/dist/module/components/base/carousel/utils.js +0 -55
  200. package/dist/module/components/base/date-picker-view/date-range-picker-view.js +0 -138
  201. package/dist/module/components/base/date-picker-view/date-time-picker.js +0 -34
  202. package/dist/typescript/components/base/carousel/carousel-item.d.ts +0 -26
  203. package/dist/typescript/components/base/carousel/carousel-item.d.ts.map +0 -1
  204. package/dist/typescript/components/base/carousel/constants.d.ts +0 -17
  205. package/dist/typescript/components/base/carousel/constants.d.ts.map +0 -1
  206. package/dist/typescript/components/base/carousel/hooks/use-carousel-indicator.d.ts +0 -37
  207. package/dist/typescript/components/base/carousel/hooks/use-carousel-indicator.d.ts.map +0 -1
  208. package/dist/typescript/components/base/carousel/hooks/use-carousel-slides.d.ts +0 -51
  209. package/dist/typescript/components/base/carousel/hooks/use-carousel-slides.d.ts.map +0 -1
  210. package/dist/typescript/components/base/carousel/utils.d.ts +0 -25
  211. package/dist/typescript/components/base/carousel/utils.d.ts.map +0 -1
  212. package/dist/typescript/components/base/date-picker-view/date-range-picker-view.d.ts +0 -26
  213. package/dist/typescript/components/base/date-picker-view/date-range-picker-view.d.ts.map +0 -1
  214. package/dist/typescript/components/base/date-picker-view/date-time-picker.d.ts +0 -3
  215. package/dist/typescript/components/base/date-picker-view/date-time-picker.d.ts.map +0 -1
  216. package/dist/typescript/components/base/picker/picker-trigger.d.ts.map +0 -1
  217. package/src/components/base/carousel/carousel-item.tsx +0 -35
  218. package/src/components/base/carousel/constants.ts +0 -19
  219. package/src/components/base/carousel/hooks/use-carousel-indicator.tsx +0 -84
  220. package/src/components/base/carousel/hooks/use-carousel-slides.tsx +0 -131
  221. package/src/components/base/carousel/utils.ts +0 -55
  222. package/src/components/base/date-picker-view/date-range-picker-view.tsx +0 -191
  223. package/src/components/base/date-picker-view/date-time-picker.tsx +0 -34
  224. /package/dist/typescript/components/base/{picker → picker-backup}/picker-trigger.d.ts +0 -0
@@ -7,7 +7,15 @@ exports.useCarouselPanResponder = void 0;
7
7
  var _lodashEs = require("lodash-es");
8
8
  var _react = require("react");
9
9
  var _reactNative = require("react-native");
10
- var _constants = require("../constants.js");
10
+ /**
11
+ * 手势识别最小移动距离(像素)
12
+ */
13
+ const GESTURE_MIN_DISTANCE = 5;
14
+
15
+ /**
16
+ * 速度投影系数(用于计算惯性滑动距离)
17
+ */
18
+ const VELOCITY_PROJECTION_FACTOR = 2000;
11
19
  /**
12
20
  * 轮播图手势响应 Hook
13
21
  *
@@ -54,6 +62,26 @@ const useCarouselPanResponder = params => {
54
62
  getBoundedPosition,
55
63
  swipeToExtIndex
56
64
  } = params;
65
+
66
+ // 使用 ref 存储回调,减少 PanResponder 重建
67
+ const callbacksRef = (0, _react.useRef)({
68
+ setDragging,
69
+ setAnimating,
70
+ updateCurrent,
71
+ getIndexFromExtIndex,
72
+ getBoundedPosition,
73
+ swipeToExtIndex
74
+ });
75
+
76
+ // 更新回调 ref
77
+ callbacksRef.current = {
78
+ setDragging,
79
+ setAnimating,
80
+ updateCurrent,
81
+ getIndexFromExtIndex,
82
+ getBoundedPosition,
83
+ swipeToExtIndex
84
+ };
57
85
  return (0, _react.useMemo)(() => {
58
86
  if (!allowTouchMove) return null;
59
87
  if (total <= 1) return null;
@@ -62,13 +90,13 @@ const useCarouselPanResponder = params => {
62
90
  const axis = direction === 'horizontal' ? 'x' : 'y';
63
91
  const shouldSet = (_, gestureState) => {
64
92
  const primary = axis === 'x' ? gestureState.dx : gestureState.dy;
65
- return Math.abs(primary) >= _constants.GESTURE_MIN_DISTANCE;
93
+ return Math.abs(primary) >= GESTURE_MIN_DISTANCE;
66
94
  };
67
95
  return _reactNative.PanResponder.create({
68
96
  onMoveShouldSetPanResponder: shouldSet,
69
97
  onPanResponderGrant: () => {
70
- setDragging(true);
71
- setAnimating(false);
98
+ callbacksRef.current.setDragging(true);
99
+ callbacksRef.current.setAnimating(false);
72
100
  position.current.stopAnimation();
73
101
  startPosition = positionValueRef.current;
74
102
  },
@@ -91,33 +119,33 @@ const useCarouselPanResponder = params => {
91
119
  startPosition -= totalPixels;
92
120
  }
93
121
  }
94
- const bounded = getBoundedPosition(nextPosition);
122
+ const bounded = callbacksRef.current.getBoundedPosition(nextPosition);
95
123
  position.current.setValue(bounded);
96
124
  positionValueRef.current = bounded;
97
125
  const nextExtIndex = (0, _lodashEs.clamp)(Math.round(bounded / slidePixels), 0, extTotal - 1);
98
126
  extIndexRef.current = nextExtIndex;
99
- updateCurrent(getIndexFromExtIndex(nextExtIndex));
127
+ callbacksRef.current.updateCurrent(callbacksRef.current.getIndexFromExtIndex(nextExtIndex));
100
128
  },
101
129
  onPanResponderRelease: (_evt, gestureState) => {
102
- setDragging(false);
130
+ callbacksRef.current.setDragging(false);
103
131
  const velocity = axis === 'x' ? gestureState.vx : gestureState.vy;
104
132
  position.current.stopAnimation(value => {
105
133
  const baseIndex = value / slidePixels;
106
- const projectedIndex = (value - velocity * _constants.VELOCITY_PROJECTION_FACTOR) / slidePixels;
134
+ const projectedIndex = (value - velocity * VELOCITY_PROJECTION_FACTOR) / slidePixels;
107
135
  const minAdj = Math.floor(baseIndex);
108
136
  const maxAdj = minAdj + 1;
109
137
  const rounded = Math.round(projectedIndex);
110
138
  const adjacent = (0, _lodashEs.clamp)(rounded, minAdj, maxAdj);
111
- swipeToExtIndex(adjacent);
139
+ callbacksRef.current.swipeToExtIndex(adjacent);
112
140
  });
113
141
  },
114
142
  onPanResponderTerminate: () => {
115
- setDragging(false);
116
- swipeToExtIndex(extIndexRef.current);
143
+ callbacksRef.current.setDragging(false);
144
+ callbacksRef.current.swipeToExtIndex(extIndexRef.current);
117
145
  },
118
146
  onPanResponderTerminationRequest: () => false,
119
147
  onShouldBlockNativeResponder: () => blockNativeResponder
120
148
  });
121
- }, [allowTouchMove, blockNativeResponder, clonesBefore, direction, extTotal, extIndexRef, getBoundedPosition, getIndexFromExtIndex, position, positionValueRef, setAnimating, setDragging, slidePixels, swipeToExtIndex, total, updateCurrent]);
149
+ }, [allowTouchMove, blockNativeResponder, clonesBefore, direction, extTotal, extIndexRef, position, positionValueRef, slidePixels, total]);
122
150
  };
123
151
  exports.useCarouselPanResponder = useCarouselPanResponder;
@@ -6,7 +6,11 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.useCarouselPosition = void 0;
7
7
  var _react = require("react");
8
8
  var _reactNative = require("react-native");
9
- var _constants = require("../constants.js");
9
+ /**
10
+ * 轮播图动画时长(毫秒)
11
+ */
12
+ const CAROUSEL_ANIMATION_DURATION = 300;
13
+
10
14
  /**
11
15
  * 轮播图位置和动画控制 Hook
12
16
  *
@@ -30,7 +34,7 @@ const useCarouselPosition = () => {
30
34
  });
31
35
  _reactNative.Animated.timing(position.current, {
32
36
  toValue,
33
- duration: _constants.CAROUSEL_ANIMATION_DURATION,
37
+ duration: CAROUSEL_ANIMATION_DURATION,
34
38
  easing: _reactNative.Easing.out(_reactNative.Easing.cubic),
35
39
  useNativeDriver: true
36
40
  }).start(({
@@ -19,18 +19,4 @@ Object.keys(_carousel).forEach(function (key) {
19
19
  }
20
20
  });
21
21
  });
22
- var _carouselItem = require("./carousel-item.js");
23
- Object.keys(_carouselItem).forEach(function (key) {
24
- if (key === "default" || key === "__esModule") return;
25
- if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
26
- if (key in exports && exports[key] === _carouselItem[key]) return;
27
- Object.defineProperty(exports, key, {
28
- enumerable: true,
29
- get: function () {
30
- return _carouselItem[key];
31
- }
32
- });
33
- });
34
- const Carousel = exports.Carousel = Object.assign(_carousel.Carousel, {
35
- Item: _carouselItem.CarouselItem
36
- });
22
+ const Carousel = exports.Carousel = _carousel.Carousel;
@@ -20,6 +20,18 @@ const useCarouselStyles = exports.useCarouselStyles = (0, _index.createThemedSty
20
20
  flexGrow: 0,
21
21
  flexShrink: 0
22
22
  },
23
+ trackInnerHorizontal: {
24
+ flexDirection: 'row',
25
+ height: '100%',
26
+ flexGrow: 0,
27
+ flexShrink: 0
28
+ },
29
+ trackInnerVertical: {
30
+ flexDirection: 'column',
31
+ width: '100%',
32
+ flexGrow: 0,
33
+ flexShrink: 0
34
+ },
23
35
  slide: {
24
36
  flexGrow: 0,
25
37
  flexShrink: 0,
@@ -8,67 +8,79 @@ var _ahooks = require("ahooks");
8
8
  var _dayjs = _interopRequireDefault(require("dayjs"));
9
9
  var _react = _interopRequireWildcard(require("react"));
10
10
  var _index = require("./../index.js");
11
+ var _index2 = require("./style/index.js");
11
12
  var _jsxRuntime = require("react/jsx-runtime");
12
13
  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); }
13
14
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
14
15
  const DatePicker = ({
15
16
  placeholder = '请选择日期',
16
- disabled = false,
17
17
  formatter = 'YYYY/MM/DD',
18
- style,
19
- children,
20
18
  mode = 'Y-D',
21
- title,
22
- confirmText,
19
+ headerTitle,
20
+ confirmText = '确定',
23
21
  ...restProps
24
22
  }) => {
25
- const [value, setValue] = (0, _ahooks.useControllableValue)(restProps, {
26
- defaultValue: restProps.defaultValue
27
- });
28
- const [visible, setVisible] = (0, _react.useState)(false);
23
+ const [draftValue, setDraftValue] = (0, _react.useState)();
24
+ const styles = (0, _index2.useDatePickerStyles)();
25
+ const committedValueRef = (0, _react.useRef)(new Date());
26
+ const handleOpen = (0, _react.useCallback)(() => {
27
+ setDraftValue(committedValueRef.current);
28
+ }, []);
29
29
 
30
30
  /** 格式化显示文案 */
31
- const displayText = (0, _react.useMemo)(() => {
32
- if (!value) return '';
31
+ const _renderValue = (0, _ahooks.useMemoizedFn)(value => {
32
+ if (!value) return;
33
33
  if (typeof formatter === 'string') {
34
34
  return (0, _dayjs.default)(value).format(formatter);
35
35
  }
36
36
  return formatter(value);
37
- }, [value, mode, formatter]);
38
- const handleOpen = (0, _ahooks.useMemoizedFn)(() => {
39
- setVisible(true);
40
- });
41
- const handleChange = (0, _ahooks.useMemoizedFn)(date => {
42
- setValue(date);
43
- setVisible(false);
44
- });
45
- const handleClose = (0, _ahooks.useMemoizedFn)(() => {
46
- setVisible(false);
47
37
  });
48
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
49
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.PickerTrigger, {
50
- displayText: displayText,
38
+ const _headerTitle = (0, _react.useMemo)(() => {
39
+ if (headerTitle) {
40
+ return headerTitle;
41
+ }
42
+ switch (mode) {
43
+ case 'Y':
44
+ return '请选择年';
45
+ case 'Y-M':
46
+ return '请选择年月';
47
+ case 'Y-D':
48
+ return '请选择年月日';
49
+ default:
50
+ return '请选择日期';
51
+ }
52
+ }, [mode, headerTitle]);
53
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Picker, {
54
+ ...restProps,
55
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Picker.Field, {
51
56
  placeholder: placeholder,
52
- disabled: disabled,
53
- style: style,
54
- onPress: handleOpen,
55
- children: children
56
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Portal, {
57
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Modal, {
58
- visible: visible,
59
- position: "bottom",
60
- safeAreaInsetBottom: true,
61
- contentHeight: '50%',
62
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.DatePickerView, {
63
- ...restProps,
64
- mode: mode,
65
- title: title,
66
- confirmText: confirmText,
67
- value: value,
68
- onChange: handleChange,
69
- onClose: handleClose
70
- })
71
- })
57
+ renderValue: _renderValue
58
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Picker.Content, {
59
+ headerTitle: _headerTitle,
60
+ onOpen: handleOpen,
61
+ children: ({
62
+ onChange,
63
+ value: contextValue
64
+ }) => {
65
+ // 同步 ref:始终保持最新的已提交值
66
+ committedValueRef.current = contextValue ?? new Date();
67
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Flex, {
68
+ vertical: true,
69
+ align: "stretch",
70
+ style: styles.container,
71
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.DatePickerView, {
72
+ mode: mode,
73
+ value: draftValue,
74
+ onChange: setDraftValue
75
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Button, {
76
+ text: confirmText,
77
+ size: "large",
78
+ onPress: () => {
79
+ onChange?.(draftValue);
80
+ }
81
+ })]
82
+ });
83
+ }
72
84
  })]
73
85
  });
74
86
  };
@@ -8,72 +8,164 @@ var _ahooks = require("ahooks");
8
8
  var _dayjs = _interopRequireDefault(require("dayjs"));
9
9
  var _react = _interopRequireWildcard(require("react"));
10
10
  var _index = require("./../index.js");
11
+ var _index2 = require("../date-picker-view/style/index.js");
12
+ var _utils = require("../date-picker-view/utils.js");
11
13
  var _jsxRuntime = require("react/jsx-runtime");
12
14
  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); }
13
15
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
14
16
  const DateRangePicker = ({
15
17
  placeholder = '请选择日期范围',
16
- disabled = false,
17
18
  formatter = 'YYYY/MM/DD',
18
- style,
19
19
  separator = ' ~ ',
20
- children,
21
- title,
22
- confirmText,
23
- resetText,
24
- startText,
25
- endText,
20
+ headerTitle,
21
+ startText = '请选择开始时间',
22
+ endText = '请选择结束时间',
23
+ confirmText = '确定',
24
+ resetText = '重置',
25
+ min,
26
+ max,
26
27
  ...restProps
27
28
  }) => {
28
- const [value, setValue] = (0, _ahooks.useControllableValue)(restProps, {
29
- defaultValue: restProps.defaultValue
30
- });
31
- const [visible, setVisible] = (0, _react.useState)(false);
32
- const openModal = () => {
33
- setVisible(true);
34
- };
35
- const closeModal = () => {
36
- setVisible(false);
37
- };
29
+ const styles = (0, _index2.useDateRangePickerStyles)();
30
+
31
+ /** 当前编辑的是 start 还是 end */
32
+ const [selected, setSelected] = (0, _react.useState)('start');
33
+
34
+ /**
35
+ * 草稿值:用户在弹窗内选择时的临时值
36
+ * - 弹窗打开时重置为已提交的值(通过 onOpen)
37
+ */
38
+ const [draft, setDraft] = (0, _react.useState)([]);
39
+
40
+ /**
41
+ * 追踪 Picker context 中的已提交值
42
+ * 非受控模式下 restProps.value 始终是 undefined,真正的值在 Picker context 内
43
+ */
44
+ const committedValueRef = (0, _react.useRef)(undefined);
45
+
46
+ /**
47
+ * 弹窗打开时,将草稿值重置为已提交的值
48
+ */
49
+ const handleOpen = (0, _react.useCallback)(() => {
50
+ if (committedValueRef.current) {
51
+ setDraft((0, _utils.sortRange)(committedValueRef.current));
52
+ } else {
53
+ setDraft([new Date(), undefined]);
54
+ }
55
+ setSelected('start');
56
+ }, []);
38
57
 
39
58
  /** 格式化显示文案 */
40
- const displayText = (0, _react.useMemo)(() => {
41
- if (!value) return '';
59
+ const _renderValue = (0, _ahooks.useMemoizedFn)(value => {
60
+ if (!value) return;
42
61
  if (typeof formatter === 'string') {
43
62
  return (0, _dayjs.default)(value[0]).format(formatter) + separator + (0, _dayjs.default)(value[1]).format(formatter);
44
63
  }
45
64
  return formatter(value);
46
- }, [value, formatter, separator]);
47
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
48
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.PickerTrigger, {
49
- displayText: displayText,
65
+ });
66
+
67
+ /** Picker 当前值 */
68
+ const pickerValue = (selected === 'start' ? draft[0] : draft[1]) ?? new Date();
69
+
70
+ /** Picker 可选范围 */
71
+ const minDate = (0, _react.useMemo)(() => {
72
+ return selected === 'end' ? draft[0] ?? min : min;
73
+ }, [selected, draft, min]);
74
+ const maxDate = (0, _react.useMemo)(() => {
75
+ return selected === 'start' ? draft[1] ?? max : max;
76
+ }, [selected, draft, max]);
77
+
78
+ /** Picker 改 draft */
79
+ const onChangePicker = (0, _react.useCallback)(date => {
80
+ setDraft(prev => {
81
+ const index = selected === 'start' ? 0 : 1;
82
+ if (prev[index]?.getTime() === date.getTime()) {
83
+ return prev;
84
+ }
85
+ const next = [prev[0], prev[1]];
86
+ next[index] = date;
87
+ return next;
88
+ });
89
+ }, [selected]);
90
+ const changeSelected = (0, _react.useCallback)(nextSelected => {
91
+ setSelected(nextSelected);
92
+ setDraft(prev => {
93
+ const next = [prev[0], prev[1]];
94
+ const index = nextSelected === 'start' ? 0 : 1;
95
+ next[index] ??= new Date();
96
+ return next;
97
+ });
98
+ }, []);
99
+
100
+ /** 重置 */
101
+ const onReset = (0, _react.useCallback)(() => {
102
+ setDraft([new Date(), undefined]);
103
+ setSelected('start');
104
+ }, []);
105
+
106
+ /** 是否可以确定 */
107
+ const canConfirm = Boolean(draft[0] && draft[1]);
108
+ const _startText = draft[0] && (0, _dayjs.default)(draft[0]).format(typeof formatter === 'string' ? formatter : 'YYYY/MM/DD') || startText;
109
+ const _endText = draft[1] && (0, _dayjs.default)(draft[1]).format(typeof formatter === 'string' ? formatter : 'YYYY/MM/DD') || endText;
110
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Picker, {
111
+ ...restProps,
112
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Picker.Field, {
50
113
  placeholder: placeholder,
51
- disabled: disabled,
52
- style: style,
53
- onPress: openModal,
54
- children: children
55
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Portal, {
56
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Modal, {
57
- visible: visible,
58
- position: "bottom",
59
- safeAreaInsetBottom: true,
60
- contentHeight: 490,
61
- children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.DateRangePickerView, {
62
- ...restProps,
63
- title: title,
64
- confirmText: confirmText,
65
- resetText: resetText,
66
- startText: startText,
67
- endText: endText,
68
- value: value,
69
- onChange: range => {
70
- setValue(range);
71
- closeModal();
72
- },
73
- onClose: closeModal,
74
- formatter: formatter
75
- })
76
- })
114
+ renderValue: _renderValue
115
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Picker.Content, {
116
+ headerTitle: headerTitle,
117
+ contentHeight: 490,
118
+ onOpen: handleOpen,
119
+ children: ({
120
+ onChange,
121
+ value: contextValue
122
+ }) => {
123
+ // 同步 ref:始终保持最新的已提交值
124
+ committedValueRef.current = contextValue;
125
+ return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Flex, {
126
+ vertical: true,
127
+ align: "stretch",
128
+ style: styles.container,
129
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Flex, {
130
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Button, {
131
+ variant: "outline",
132
+ theme: selected === 'start' ? 'primary' : 'default',
133
+ block: true,
134
+ text: _startText,
135
+ onPress: () => changeSelected('start')
136
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Text, {
137
+ children: "\u2014"
138
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Button, {
139
+ variant: "outline",
140
+ theme: selected === 'end' ? 'primary' : 'default',
141
+ block: true,
142
+ text: _endText,
143
+ onPress: () => changeSelected('end')
144
+ })]
145
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.DatePickerView, {
146
+ value: pickerValue,
147
+ min: minDate,
148
+ max: maxDate,
149
+ onChange: onChangePicker
150
+ }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Button.Group, {
151
+ block: true,
152
+ children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Button, {
153
+ size: "large",
154
+ text: resetText,
155
+ theme: "secondary",
156
+ onPress: onReset
157
+ }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Button, {
158
+ size: "large",
159
+ text: confirmText,
160
+ onPress: () => {
161
+ if (!draft[0] || !draft[1]) return;
162
+ onChange?.((0, _utils.sortRange)([draft[0], draft[1]]));
163
+ },
164
+ disabled: !canConfirm
165
+ })]
166
+ })]
167
+ });
168
+ }
77
169
  })]
78
170
  });
79
171
  };
@@ -0,0 +1,15 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useDatePickerStyles = void 0;
7
+ var _index = require("../../../../native-provider/index.js");
8
+ const useDatePickerStyles = exports.useDatePickerStyles = (0, _index.createThemedStyles)(theme => ({
9
+ container: {
10
+ backgroundColor: theme.palette.white,
11
+ padding: 16,
12
+ rowGap: 16,
13
+ flex: 1
14
+ }
15
+ }));
@@ -7,67 +7,33 @@ exports.DatePickerView = void 0;
7
7
  var _ahooks = require("ahooks");
8
8
  var _react = require("react");
9
9
  var _index = require("./../index.js");
10
- var _index2 = require("./style/index.js");
10
+ var _useDateTimePicker = require("./hooks/use-date-time-picker.js");
11
11
  var _jsxRuntime = require("react/jsx-runtime");
12
12
  const DatePickerView = ({
13
13
  mode = 'Y-D',
14
- onChange,
15
- onClose,
16
- title,
17
- confirmText = '确定',
14
+ min,
15
+ max,
18
16
  ...restProps
19
17
  }) => {
20
- const styles = (0, _index2.useDatePickerStyles)();
21
-
22
- // 内部状态用于管理滚动时的临时值
23
- const [localValue, setLocalValue] = (0, _react.useState)(restProps.value ?? restProps.defaultValue ?? new Date());
24
- const lastValueRef = (0, _react.useRef)(restProps.value);
25
- if (restProps.value !== undefined && restProps.value !== lastValueRef.current) {
26
- lastValueRef.current = restProps.value;
27
- setLocalValue(restProps.value);
28
- }
29
- const _title = (0, _react.useMemo)(() => {
30
- if (title) {
31
- return title;
32
- }
33
- switch (mode) {
34
- case 'Y':
35
- return '请选择年';
36
- case 'Y-M':
37
- return '请选择年月';
38
- case 'Y-D':
39
- return '请选择年月日';
40
- default:
41
- return '请选择日期';
42
- }
43
- }, [mode, title]);
44
-
45
- // 滚动时只更新内部状态,不触发外部 onChange
46
- const onChangePicker = (0, _ahooks.useMemoizedFn)(value => {
47
- setLocalValue(value);
18
+ // 确保有一个稳定的默认日期值
19
+ const defaultDate = (0, _react.useMemo)(() => new Date(), []);
20
+ const [value, onChange] = (0, _ahooks.useControllableValue)(restProps, {
21
+ defaultValue: defaultDate
48
22
  });
49
23
 
50
- // 只在点击确定按钮时才调用外部 onChange
51
- const onConfirm = (0, _ahooks.useMemoizedFn)(() => {
52
- onChange?.(localValue);
24
+ // 确保 value 始终有值,避免 undefined 传递给 hook
25
+ const safeValue = value ?? defaultDate;
26
+ const [values, columns, onChangePicker] = (0, _useDateTimePicker.useDateTimePicker)({
27
+ mode,
28
+ value: safeValue,
29
+ onChange,
30
+ min,
31
+ max
53
32
  });
54
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_index.Flex, {
55
- vertical: true,
56
- align: "stretch",
57
- style: styles.container,
58
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_index.ModalHeader, {
59
- title: _title,
60
- onClose: onClose
61
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.DateTimePicker, {
62
- ...restProps,
63
- mode: mode,
64
- value: localValue,
65
- onChange: onChangePicker
66
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.Button, {
67
- text: confirmText,
68
- size: "large",
69
- onPress: onConfirm
70
- })]
33
+ return /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.PickerView, {
34
+ columns: columns,
35
+ value: values,
36
+ onChange: onChangePicker
71
37
  });
72
38
  };
73
39
  exports.DatePickerView = DatePickerView;
@@ -13,26 +13,4 @@ Object.keys(_datePickerView).forEach(function (key) {
13
13
  return _datePickerView[key];
14
14
  }
15
15
  });
16
- });
17
- var _dateRangePickerView = require("./date-range-picker-view.js");
18
- Object.keys(_dateRangePickerView).forEach(function (key) {
19
- if (key === "default" || key === "__esModule") return;
20
- if (key in exports && exports[key] === _dateRangePickerView[key]) return;
21
- Object.defineProperty(exports, key, {
22
- enumerable: true,
23
- get: function () {
24
- return _dateRangePickerView[key];
25
- }
26
- });
27
- });
28
- var _dateTimePicker = require("./date-time-picker.js");
29
- Object.keys(_dateTimePicker).forEach(function (key) {
30
- if (key === "default" || key === "__esModule") return;
31
- if (key in exports && exports[key] === _dateTimePicker[key]) return;
32
- Object.defineProperty(exports, key, {
33
- enumerable: true,
34
- get: function () {
35
- return _dateTimePicker[key];
36
- }
37
- });
38
16
  });