@arco-design/mobile-react 2.26.0 → 2.27.1

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 (238) hide show
  1. package/CHANGELOG.md +29 -0
  2. package/README.en-US.md +2 -2
  3. package/README.md +2 -2
  4. package/cjs/form/form-item.js +4 -2
  5. package/cjs/icon/IconHeart/index.js +1 -1
  6. package/cjs/icon/IconKeyboard/index.d.ts +7 -0
  7. package/cjs/icon/IconKeyboard/index.js +48 -0
  8. package/cjs/icon/IconKeyboardDelete/index.d.ts +7 -0
  9. package/cjs/icon/IconKeyboardDelete/index.js +44 -0
  10. package/cjs/icon/IconMinus/index.js +1 -1
  11. package/cjs/icon/IconMore/index.js +1 -1
  12. package/cjs/icon/IconNotice/index.js +1 -1
  13. package/cjs/icon/IconNoticeOff/index.js +1 -1
  14. package/cjs/icon/IconPlay/index.js +1 -1
  15. package/cjs/icon/IconSetting/index.js +2 -2
  16. package/cjs/icon/IconSound/index.js +1 -1
  17. package/cjs/icon/IconStar/index.js +1 -1
  18. package/cjs/icon/IconStarFill/index.js +1 -1
  19. package/cjs/icon/IconTriDown/index.js +1 -1
  20. package/cjs/icon/IconTriUp/index.js +1 -1
  21. package/cjs/icon/IconUpload/index.js +1 -1
  22. package/cjs/icon/IconWarnCircle/index.js +1 -1
  23. package/cjs/icon/IconWarnCircleFill/index.js +1 -1
  24. package/cjs/icon/index.d.ts +2 -0
  25. package/cjs/icon/index.js +12 -2
  26. package/cjs/image-picker/style/css/index.d.ts +1 -0
  27. package/cjs/image-picker/style/css/index.js +2 -0
  28. package/cjs/image-picker/style/index.d.ts +1 -0
  29. package/cjs/image-picker/style/index.js +2 -0
  30. package/cjs/index-bar/context.d.ts +3 -0
  31. package/cjs/index-bar/context.js +15 -0
  32. package/cjs/index-bar/demo/style/css/mobile.css +23 -0
  33. package/cjs/index-bar/demo/style/mobile.less +26 -0
  34. package/cjs/index-bar/group.d.ts +3 -0
  35. package/cjs/index-bar/group.js +101 -0
  36. package/cjs/index-bar/index.d.ts +15 -0
  37. package/cjs/index-bar/index.js +274 -0
  38. package/cjs/index-bar/side-bar.d.ts +3 -0
  39. package/cjs/index-bar/side-bar.js +102 -0
  40. package/cjs/index-bar/style/css/index.css +164 -0
  41. package/cjs/index-bar/style/css/index.d.ts +3 -0
  42. package/cjs/index-bar/style/css/index.js +7 -0
  43. package/cjs/index-bar/style/index.d.ts +3 -0
  44. package/cjs/index-bar/style/index.js +7 -0
  45. package/cjs/index-bar/style/index.less +122 -0
  46. package/cjs/index-bar/type.d.ts +195 -0
  47. package/cjs/index-bar/type.js +3 -0
  48. package/cjs/index-bar/utils.d.ts +6 -0
  49. package/cjs/index-bar/utils.js +68 -0
  50. package/cjs/index.d.ts +2 -0
  51. package/cjs/index.js +9 -1
  52. package/cjs/keyboard/demo/style/css/mobile.css +4 -0
  53. package/cjs/keyboard/demo/style/mobile.less +8 -0
  54. package/cjs/keyboard/index.d.ts +13 -0
  55. package/cjs/keyboard/index.js +270 -0
  56. package/cjs/keyboard/style/css/index.css +93 -0
  57. package/cjs/keyboard/style/css/index.d.ts +3 -0
  58. package/cjs/keyboard/style/css/index.js +7 -0
  59. package/cjs/keyboard/style/index.d.ts +3 -0
  60. package/cjs/keyboard/style/index.js +7 -0
  61. package/cjs/keyboard/style/index.less +80 -0
  62. package/cjs/keyboard/type.d.ts +102 -0
  63. package/cjs/keyboard/type.js +3 -0
  64. package/cjs/picker/index.js +3 -39
  65. package/cjs/picker/type.d.ts +1 -1
  66. package/cjs/picker-view/components/cascader.d.ts +2 -3
  67. package/cjs/picker-view/components/cascader.js +8 -6
  68. package/cjs/picker-view/components/multi-picker.d.ts +2 -3
  69. package/cjs/picker-view/components/multi-picker.js +31 -35
  70. package/cjs/picker-view/components/picker-cell.d.ts +1 -1
  71. package/cjs/picker-view/components/picker-cell.js +5 -7
  72. package/cjs/picker-view/index.d.ts +1 -1
  73. package/cjs/picker-view/index.js +9 -20
  74. package/cjs/picker-view/type.d.ts +2 -2
  75. package/cjs/slider/hooks/useSliderEvents.js +20 -20
  76. package/cjs/sticky/index.js +2 -2
  77. package/cjs/style.d.ts +2 -0
  78. package/cjs/style.js +4 -0
  79. package/dist/index.js +1172 -444
  80. package/dist/index.min.js +5 -5
  81. package/dist/style.css +215 -1
  82. package/dist/style.min.css +1 -1
  83. package/esm/form/form-item.js +4 -2
  84. package/esm/icon/IconHeart/index.js +1 -1
  85. package/esm/icon/IconKeyboard/index.d.ts +7 -0
  86. package/esm/icon/IconKeyboard/index.js +37 -0
  87. package/esm/icon/IconKeyboardDelete/index.d.ts +7 -0
  88. package/esm/icon/IconKeyboardDelete/index.js +33 -0
  89. package/esm/icon/IconMinus/index.js +1 -1
  90. package/esm/icon/IconMore/index.js +1 -1
  91. package/esm/icon/IconNotice/index.js +1 -1
  92. package/esm/icon/IconNoticeOff/index.js +1 -1
  93. package/esm/icon/IconPlay/index.js +1 -1
  94. package/esm/icon/IconSetting/index.js +2 -2
  95. package/esm/icon/IconSound/index.js +1 -1
  96. package/esm/icon/IconStar/index.js +1 -1
  97. package/esm/icon/IconStarFill/index.js +1 -1
  98. package/esm/icon/IconTriDown/index.js +1 -1
  99. package/esm/icon/IconTriUp/index.js +1 -1
  100. package/esm/icon/IconUpload/index.js +1 -1
  101. package/esm/icon/IconWarnCircle/index.js +1 -1
  102. package/esm/icon/IconWarnCircleFill/index.js +1 -1
  103. package/esm/icon/index.d.ts +2 -0
  104. package/esm/icon/index.js +2 -0
  105. package/esm/image-picker/style/css/index.d.ts +1 -0
  106. package/esm/image-picker/style/css/index.js +1 -0
  107. package/esm/image-picker/style/index.d.ts +1 -0
  108. package/esm/image-picker/style/index.js +1 -0
  109. package/esm/index-bar/context.d.ts +3 -0
  110. package/esm/index-bar/context.js +8 -0
  111. package/esm/index-bar/demo/style/css/mobile.css +23 -0
  112. package/esm/index-bar/demo/style/mobile.less +26 -0
  113. package/esm/index-bar/group.d.ts +3 -0
  114. package/esm/index-bar/group.js +83 -0
  115. package/esm/index-bar/index.d.ts +15 -0
  116. package/esm/index-bar/index.js +253 -0
  117. package/esm/index-bar/side-bar.d.ts +3 -0
  118. package/esm/index-bar/side-bar.js +90 -0
  119. package/esm/index-bar/style/css/index.css +164 -0
  120. package/esm/index-bar/style/css/index.d.ts +3 -0
  121. package/esm/index-bar/style/css/index.js +3 -0
  122. package/esm/index-bar/style/index.d.ts +3 -0
  123. package/esm/index-bar/style/index.js +3 -0
  124. package/esm/index-bar/style/index.less +122 -0
  125. package/esm/index-bar/type.d.ts +195 -0
  126. package/esm/index-bar/type.js +1 -0
  127. package/esm/index-bar/utils.d.ts +6 -0
  128. package/esm/index-bar/utils.js +53 -0
  129. package/esm/index.d.ts +2 -0
  130. package/esm/index.js +2 -0
  131. package/esm/keyboard/demo/style/css/mobile.css +4 -0
  132. package/esm/keyboard/demo/style/mobile.less +8 -0
  133. package/esm/keyboard/index.d.ts +13 -0
  134. package/esm/keyboard/index.js +243 -0
  135. package/esm/keyboard/style/css/index.css +93 -0
  136. package/esm/keyboard/style/css/index.d.ts +3 -0
  137. package/esm/keyboard/style/css/index.js +3 -0
  138. package/esm/keyboard/style/index.d.ts +3 -0
  139. package/esm/keyboard/style/index.js +3 -0
  140. package/esm/keyboard/style/index.less +80 -0
  141. package/esm/keyboard/type.d.ts +102 -0
  142. package/esm/keyboard/type.js +1 -0
  143. package/esm/picker/index.js +3 -40
  144. package/esm/picker/type.d.ts +1 -1
  145. package/esm/picker-view/components/cascader.d.ts +2 -3
  146. package/esm/picker-view/components/cascader.js +8 -6
  147. package/esm/picker-view/components/multi-picker.d.ts +2 -3
  148. package/esm/picker-view/components/multi-picker.js +31 -34
  149. package/esm/picker-view/components/picker-cell.d.ts +1 -1
  150. package/esm/picker-view/components/picker-cell.js +5 -7
  151. package/esm/picker-view/index.d.ts +1 -1
  152. package/esm/picker-view/index.js +10 -21
  153. package/esm/picker-view/type.d.ts +2 -2
  154. package/esm/slider/hooks/useSliderEvents.js +20 -20
  155. package/esm/sticky/index.js +2 -2
  156. package/esm/style.d.ts +2 -0
  157. package/esm/style.js +2 -0
  158. package/package.json +3 -3
  159. package/tokens/app/arcodesign/default/css-variables.less +43 -0
  160. package/tokens/app/arcodesign/default/index.d.ts +43 -0
  161. package/tokens/app/arcodesign/default/index.js +43 -0
  162. package/tokens/app/arcodesign/default/index.json +516 -0
  163. package/tokens/app/arcodesign/default/index.less +43 -0
  164. package/umd/form/form-item.js +4 -2
  165. package/umd/icon/IconHeart/index.js +1 -1
  166. package/umd/icon/IconKeyboard/index.d.ts +7 -0
  167. package/umd/icon/IconKeyboard/index.js +56 -0
  168. package/umd/icon/IconKeyboardDelete/index.d.ts +7 -0
  169. package/umd/icon/IconKeyboardDelete/index.js +52 -0
  170. package/umd/icon/IconMinus/index.js +1 -1
  171. package/umd/icon/IconMore/index.js +1 -1
  172. package/umd/icon/IconNotice/index.js +1 -1
  173. package/umd/icon/IconNoticeOff/index.js +1 -1
  174. package/umd/icon/IconPlay/index.js +1 -1
  175. package/umd/icon/IconSetting/index.js +2 -2
  176. package/umd/icon/IconSound/index.js +1 -1
  177. package/umd/icon/IconStar/index.js +1 -1
  178. package/umd/icon/IconStarFill/index.js +1 -1
  179. package/umd/icon/IconTriDown/index.js +1 -1
  180. package/umd/icon/IconTriUp/index.js +1 -1
  181. package/umd/icon/IconUpload/index.js +1 -1
  182. package/umd/icon/IconWarnCircle/index.js +1 -1
  183. package/umd/icon/IconWarnCircleFill/index.js +1 -1
  184. package/umd/icon/index.d.ts +2 -0
  185. package/umd/icon/index.js +12 -6
  186. package/umd/image-picker/style/css/index.d.ts +1 -0
  187. package/umd/image-picker/style/css/index.js +4 -4
  188. package/umd/image-picker/style/index.d.ts +1 -0
  189. package/umd/image-picker/style/index.js +4 -4
  190. package/umd/index-bar/context.d.ts +3 -0
  191. package/umd/index-bar/context.js +26 -0
  192. package/umd/index-bar/demo/style/css/mobile.css +23 -0
  193. package/umd/index-bar/demo/style/mobile.less +26 -0
  194. package/umd/index-bar/group.d.ts +3 -0
  195. package/umd/index-bar/group.js +107 -0
  196. package/umd/index-bar/index.d.ts +15 -0
  197. package/umd/index-bar/index.js +274 -0
  198. package/umd/index-bar/side-bar.d.ts +3 -0
  199. package/umd/index-bar/side-bar.js +113 -0
  200. package/umd/index-bar/style/css/index.css +164 -0
  201. package/umd/index-bar/style/css/index.d.ts +3 -0
  202. package/umd/index-bar/style/css/index.js +15 -0
  203. package/umd/index-bar/style/index.d.ts +3 -0
  204. package/umd/index-bar/style/index.js +15 -0
  205. package/umd/index-bar/style/index.less +122 -0
  206. package/umd/index-bar/type.d.ts +195 -0
  207. package/umd/index-bar/type.js +17 -0
  208. package/umd/index-bar/utils.d.ts +6 -0
  209. package/umd/index-bar/utils.js +78 -0
  210. package/umd/index.d.ts +2 -0
  211. package/umd/index.js +9 -5
  212. package/umd/keyboard/demo/style/css/mobile.css +4 -0
  213. package/umd/keyboard/demo/style/mobile.less +8 -0
  214. package/umd/keyboard/index.d.ts +13 -0
  215. package/umd/keyboard/index.js +271 -0
  216. package/umd/keyboard/style/css/index.css +93 -0
  217. package/umd/keyboard/style/css/index.d.ts +3 -0
  218. package/umd/keyboard/style/css/index.js +15 -0
  219. package/umd/keyboard/style/index.d.ts +3 -0
  220. package/umd/keyboard/style/index.js +15 -0
  221. package/umd/keyboard/style/index.less +80 -0
  222. package/umd/keyboard/type.d.ts +102 -0
  223. package/umd/keyboard/type.js +17 -0
  224. package/umd/picker/index.js +3 -39
  225. package/umd/picker/type.d.ts +1 -1
  226. package/umd/picker-view/components/cascader.d.ts +2 -3
  227. package/umd/picker-view/components/cascader.js +8 -6
  228. package/umd/picker-view/components/multi-picker.d.ts +2 -3
  229. package/umd/picker-view/components/multi-picker.js +31 -35
  230. package/umd/picker-view/components/picker-cell.d.ts +1 -1
  231. package/umd/picker-view/components/picker-cell.js +5 -7
  232. package/umd/picker-view/index.d.ts +1 -1
  233. package/umd/picker-view/index.js +9 -20
  234. package/umd/picker-view/type.d.ts +2 -2
  235. package/umd/slider/hooks/useSliderEvents.js +20 -20
  236. package/umd/sticky/index.js +2 -2
  237. package/umd/style.d.ts +2 -0
  238. package/umd/style.js +4 -4
package/dist/index.js CHANGED
@@ -997,6 +997,9 @@
997
997
  minusButtonName: '减少',
998
998
  addButtonName: '增加'
999
999
  },
1000
+ Keyboard: {
1001
+ confirm: '完成'
1002
+ },
1000
1003
  Form: {
1001
1004
  required: '%s 为必填项',
1002
1005
  type: {
@@ -2969,9 +2972,13 @@
2969
2972
  var level = 0;
2970
2973
 
2971
2974
  do {
2972
- var foundItem = children.filter(function (item) {
2975
+ var foundItem = children.find(function (item) {
2973
2976
  return filterFn(item, level);
2974
- })[0];
2977
+ });
2978
+
2979
+ if (!foundItem && options.fallbackChildIndex !== undefined) {
2980
+ foundItem = children[options.fallbackChildIndex];
2981
+ }
2975
2982
 
2976
2983
  if (!foundItem) {
2977
2984
  break;
@@ -5409,7 +5416,7 @@
5409
5416
  * @name_en ActionSheet
5410
5417
  */
5411
5418
 
5412
- var index$n = componentWrapper(ActionSheet, methodsGenerator$5(ActionSheetWithGlobalContext));
5419
+ var index$o = componentWrapper(ActionSheet, methodsGenerator$5(ActionSheetWithGlobalContext));
5413
5420
 
5414
5421
  /**
5415
5422
  * 增强版的 img 标签,提供多种图片填充模式,支持图片加载中提示、加载失败提示。
@@ -5939,7 +5946,7 @@
5939
5946
  * @name_en Avatar
5940
5947
  */
5941
5948
 
5942
- var index$m = componentWrapper(Avatar, {
5949
+ var index$n = componentWrapper(Avatar, {
5943
5950
  Group: Group$4
5944
5951
  });
5945
5952
 
@@ -7171,7 +7178,7 @@
7171
7178
  * @name_en Cell
7172
7179
  */
7173
7180
 
7174
- var index$l = componentWrapper(Cell, {
7181
+ var index$m = componentWrapper(Cell, {
7175
7182
  Group: Group$3
7176
7183
  });
7177
7184
 
@@ -8146,7 +8153,7 @@
8146
8153
  * @name_en Collapse
8147
8154
  */
8148
8155
 
8149
- var index$k = componentWrapper(Collapse, {
8156
+ var index$l = componentWrapper(Collapse, {
8150
8157
  Group: Group$1
8151
8158
  });
8152
8159
 
@@ -8528,59 +8535,56 @@
8528
8535
  function MultiPicker(props) {
8529
8536
  var prefixCls = props.prefixCls,
8530
8537
  onValueChange = props.onValueChange,
8531
- onPickerChange = props.onPickerChange,
8532
8538
  children = props.children,
8533
8539
  itemHeight = props.itemHeight,
8534
8540
  selectedValue = props.selectedValue,
8535
8541
  data = props.data;
8536
8542
 
8537
- function getValue() {
8538
- if (selectedValue && selectedValue.length) {
8539
- return selectedValue;
8540
- }
8541
-
8542
- if (data) {
8543
- return data.map(function (item) {
8544
- return item && item[0] && item[0].value;
8545
- });
8546
- }
8547
-
8548
- if (!children) {
8549
- return [];
8550
- }
8551
-
8552
- return React__default["default"].Children.map(children, function (child) {
8553
- var childrenArray = React__default["default"].Children.toArray(child.children || child.props.children);
8554
- return childrenArray && childrenArray[0] && childrenArray[0].props.value;
8543
+ function getCurrentData() {
8544
+ return (data || []).map(function (item, itemIndex) {
8545
+ var curSelected = selectedValue === null || selectedValue === void 0 ? void 0 : selectedValue[itemIndex];
8546
+ var cur = curSelected ? (item || []).find(function (i) {
8547
+ return i.value === curSelected;
8548
+ }) : undefined;
8549
+ return cur || (item === null || item === void 0 ? void 0 : item[0]);
8555
8550
  });
8556
8551
  }
8557
8552
 
8558
- function onChange(index, value, callback) {
8559
- var newValue = getValue().concat();
8553
+ function onChange(_a) {
8554
+ var index = _a.index,
8555
+ value = _a.value,
8556
+ changedData = _a.changedData,
8557
+ callback = _a.callback;
8558
+ var newData = getCurrentData().concat();
8559
+ newData[index] = changedData;
8560
+ var newValue = newData.map(function (d) {
8561
+ return d === null || d === void 0 ? void 0 : d.value;
8562
+ });
8560
8563
  newValue[index] = value;
8561
8564
 
8562
8565
  if (callback) {
8563
- callback(newValue, index);
8566
+ callback(newValue, index, newData);
8564
8567
  }
8565
8568
  }
8566
8569
 
8567
- function _onValueChange(value, index) {
8568
- onChange(index, value, onValueChange);
8569
- }
8570
-
8571
- function _onScrollChange(value, index) {
8572
- onChange(index, value, onPickerChange);
8570
+ function _onValueChange(value, index, changedData) {
8571
+ onChange({
8572
+ index: index,
8573
+ value: value,
8574
+ callback: onValueChange,
8575
+ changedData: changedData
8576
+ });
8573
8577
  }
8574
8578
 
8575
8579
  function renderChild() {
8576
- var value = getValue();
8580
+ var curData = getCurrentData();
8581
+ var value = curData.map(function (d) {
8582
+ return d === null || d === void 0 ? void 0 : d.value;
8583
+ });
8577
8584
  return React__default["default"].Children.map(children, function (col, index) {
8578
8585
  return /*#__PURE__*/React__default["default"].cloneElement(col, {
8579
- onScrollChange: function onScrollChange(val) {
8580
- return _onScrollChange(val, index);
8581
- },
8582
- onValueChange: function onValueChange(val) {
8583
- return _onValueChange(val, index);
8586
+ onValueChange: function onValueChange(val, changedData) {
8587
+ return _onValueChange(val, index, changedData);
8584
8588
  },
8585
8589
  selectedValue: value[index]
8586
8590
  });
@@ -8663,17 +8667,15 @@
8663
8667
  // index有改变时再抛出
8664
8668
  // @en Throws again when index changes
8665
8669
  if (currentIndex !== nowItemIndex) {
8666
- setCurrentIndex(nowItemIndex);
8667
- var newValue = data[nowItemIndex] && data[nowItemIndex].value;
8670
+ setCurrentIndex(Math.max(nowItemIndex, 0));
8671
+ var newData = data[nowItemIndex];
8672
+ var newValue = newData === null || newData === void 0 ? void 0 : newData.value;
8668
8673
 
8669
8674
  if (newValue !== currentValue) {
8670
- // if (!('selectedValue' in props)) {
8671
- // setCurrentValue(newValue);
8672
- // }
8673
8675
  setCurrentValue(newValue);
8674
8676
 
8675
8677
  if (onValueChange) {
8676
- onValueChange(newValue);
8678
+ onValueChange(newValue, newData);
8677
8679
  }
8678
8680
  }
8679
8681
  }
@@ -8918,7 +8920,7 @@
8918
8920
  var curIndex = data.findIndex(function (item) {
8919
8921
  return item.value === selectedValue;
8920
8922
  });
8921
- setCurrentIndex(curIndex);
8923
+ setCurrentIndex(Math.max(curIndex, 0));
8922
8924
 
8923
8925
  if (curIndex >= 0) {
8924
8926
  _scrollToIndexWithChange(curIndex);
@@ -8970,7 +8972,6 @@
8970
8972
  wrapperHeight = props.wrapperHeight,
8971
8973
  rows = props.rows,
8972
8974
  hideEmptyCols = props.hideEmptyCols,
8973
- onPickerChange = props.onPickerChange,
8974
8975
  onValueChange = props.onValueChange,
8975
8976
  _a = props.selectedValue,
8976
8977
  selectedValue = _a === void 0 ? [] : _a,
@@ -8995,7 +8996,7 @@
8995
8996
  });
8996
8997
  }
8997
8998
 
8998
- function _onValueChange(value, index) {
8999
+ function _onValueChange(value, index, newData) {
8999
9000
  var children = arrayTreeFilter(data, function (item, level) {
9000
9001
  return level <= index && item.value === value[level];
9001
9002
  });
@@ -9005,15 +9006,19 @@
9005
9006
  for (i = index + 1; i < cols && child && child.children; i++) {
9006
9007
  child = child.children[0];
9007
9008
  value[i] = child.value;
9009
+ newData[i] = child;
9008
9010
  }
9009
9011
 
9010
9012
  value.length = i;
9011
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(value, index);
9013
+ newData.length = i;
9014
+ onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(value, index, newData);
9012
9015
  }
9013
9016
 
9014
9017
  function _formatData() {
9015
9018
  var childrenTree = arrayTreeFilter(data, function (item, level) {
9016
- return item.value === selectedValue[level];
9019
+ return item.value === (selectedValue === null || selectedValue === void 0 ? void 0 : selectedValue[level]);
9020
+ }, {
9021
+ fallbackChildIndex: 0
9017
9022
  }).map(function (item) {
9018
9023
  return item.children;
9019
9024
  });
@@ -9038,8 +9043,7 @@
9038
9043
  data: formatData,
9039
9044
  selectedValue: selectedValue,
9040
9045
  itemHeight: itemHeight,
9041
- onValueChange: _onValueChange,
9042
- onPickerChange: onPickerChange
9046
+ onValueChange: _onValueChange
9043
9047
  }, formatData.map(function (item, index) {
9044
9048
  return /*#__PURE__*/React__default["default"].createElement(PickerCell, {
9045
9049
  key: index + "_picker_cell_cascader",
@@ -9097,7 +9101,7 @@
9097
9101
  var wrapperRef = React.useRef(null);
9098
9102
  var domRef = React.useRef(null);
9099
9103
  var barRef = React.useRef(null);
9100
- var scrollValueRef = React.useRef(value);
9104
+ var scrollValueRef = useLatestRef(scrollValue);
9101
9105
  var pickerCellsRef = React.useRef([]);
9102
9106
  var cascaderRef = React.useRef(null);
9103
9107
  var innerData = React.useMemo(function () {
@@ -9130,20 +9134,19 @@
9130
9134
 
9131
9135
  return newData;
9132
9136
  }, [data]);
9133
- React.useEffect(function () {
9134
- scrollValueRef.current = scrollValue;
9135
- }, [scrollValue]);
9136
9137
 
9137
9138
  var getAllColumnValues = function getAllColumnValues() {
9138
- return scrollValueRef.current;
9139
+ return scrollValueRef.current || [];
9139
9140
  };
9140
9141
 
9141
9142
  function getColumnValue(index) {
9143
+ var _a;
9144
+
9142
9145
  if (index === void 0) {
9143
9146
  index = 0;
9144
9147
  }
9145
9148
 
9146
- return scrollValueRef.current[index];
9149
+ return (_a = scrollValueRef.current) === null || _a === void 0 ? void 0 : _a[index];
9147
9150
  }
9148
9151
 
9149
9152
  function getCellMovingStatus() {
@@ -9179,25 +9182,17 @@
9179
9182
  };
9180
9183
  });
9181
9184
 
9182
- function _onPickerChange(val, index) {
9183
- setScrollValue(val);
9184
-
9185
- if (onPickerChange) {
9186
- onPickerChange(val, index);
9187
- }
9188
- }
9189
-
9190
- function _onValueChange(val, index) {
9185
+ function _onValueChange(val, index, newData) {
9191
9186
  setScrollValue(val);
9192
9187
 
9193
9188
  if (onPickerChange) {
9194
- onPickerChange(val, index);
9189
+ onPickerChange(val, index, newData);
9195
9190
  }
9196
9191
  }
9197
9192
 
9198
9193
  React.useEffect(function () {
9199
9194
  setScrollValue(value);
9200
- }, [value, setScrollValue]);
9195
+ }, [value]);
9201
9196
  var updateWrapperHeight = React.useCallback(function () {
9202
9197
  if (wrapperRef && wrapperRef.current) {
9203
9198
  setWrapperHeight(wrapperRef.current.offsetHeight);
@@ -9242,7 +9237,6 @@
9242
9237
  data: data,
9243
9238
  selectedValue: scrollValue,
9244
9239
  onValueChange: _onValueChange,
9245
- onPickerChange: _onPickerChange,
9246
9240
  clickable: clickable,
9247
9241
  itemHeight: itemHeight,
9248
9242
  wrapperHeight: wrapperHeight,
@@ -9256,8 +9250,7 @@
9256
9250
  data: innerData,
9257
9251
  itemHeight: itemHeight,
9258
9252
  selectedValue: scrollValue,
9259
- onValueChange: _onValueChange,
9260
- onPickerChange: _onPickerChange
9253
+ onValueChange: _onValueChange
9261
9254
  }, innerData.map(function (item, index) {
9262
9255
  return /*#__PURE__*/React__default["default"].createElement(PickerCell, {
9263
9256
  key: index + "_picker_cell_normal",
@@ -9299,42 +9292,6 @@
9299
9292
 
9300
9293
  var PickerView$1 = componentWrapper(PickerView, 'PickerView');
9301
9294
 
9302
- var getInitialValue = function getInitialValue(value, data, cascade) {
9303
- var _a;
9304
-
9305
- if (value && value.length) {
9306
- return value;
9307
- }
9308
-
9309
- var computedValue = [];
9310
-
9311
- if (!cascade) {
9312
- if (!(data[0] instanceof Array)) {
9313
- return ((_a = data[0]) === null || _a === void 0 ? void 0 : _a.value) ? [data[0].value] : [];
9314
- }
9315
-
9316
- data.map(function (column) {
9317
- computedValue.push(typeof column[0] === 'object' ? column[0].value : column[0]);
9318
- });
9319
- } else {
9320
- var cascadePickerData = data;
9321
-
9322
- if (!cascadePickerData || !cascadePickerData.length) {
9323
- return computedValue;
9324
- }
9325
-
9326
- computedValue.push(cascadePickerData[0].value);
9327
- var traverse = cascadePickerData[0].children;
9328
-
9329
- while (traverse) {
9330
- computedValue.push(traverse[0].value);
9331
- traverse = traverse[0].children;
9332
- }
9333
- }
9334
-
9335
- return computedValue;
9336
- };
9337
-
9338
9295
  var Picker = /*#__PURE__*/React.forwardRef(function (props, ref) {
9339
9296
  var className = props.className,
9340
9297
  itemStyle = props.itemStyle,
@@ -9372,7 +9329,7 @@
9372
9329
  gestureOutOfControl = _l === void 0 ? true : _l,
9373
9330
  otherProps = __rest$1(props, ["className", "itemStyle", "cascade", "cols", "rows", "data", "okText", "dismissText", "disabled", "clickable", "hideEmptyCols", "title", "visible", "value", "needBottomOffset", "onDismiss", "onOk", "onChange", "maskClosable", "onHide", "onPickerChange", "touchToStop", "gestureOutOfControl"]);
9374
9331
 
9375
- var _m = React.useState(getInitialValue(value, data, cascade)),
9332
+ var _m = React.useState(value),
9376
9333
  scrollValue = _m[0],
9377
9334
  setScrollValue = _m[1];
9378
9335
 
@@ -9426,7 +9383,7 @@
9426
9383
  nextTick(function () {
9427
9384
  var _a;
9428
9385
 
9429
- var val = ((_a = pickerViewRef.current) === null || _a === void 0 ? void 0 : _a.getAllColumnValues()) || scrollValue;
9386
+ var val = ((_a = pickerViewRef.current) === null || _a === void 0 ? void 0 : _a.getAllColumnValues()) || scrollValue || [];
9430
9387
 
9431
9388
  if (onOk) {
9432
9389
  onOk(val);
@@ -9489,7 +9446,7 @@
9489
9446
  cols: cols,
9490
9447
  rows: rows,
9491
9448
  disabled: disabled,
9492
- value: getInitialValue(value, data, cascade),
9449
+ value: value,
9493
9450
  onPickerChange: onPickerChange,
9494
9451
  itemStyle: itemStyle,
9495
9452
  clickable: clickable,
@@ -9865,7 +9822,7 @@
9865
9822
  * @displayName DatePicker
9866
9823
  */
9867
9824
 
9868
- var index$j = componentWrapper(DatePicker, 'DatePicker');
9825
+ var index$k = componentWrapper(DatePicker, 'DatePicker');
9869
9826
 
9870
9827
  /**
9871
9828
  * 划分内容的装饰线
@@ -10104,7 +10061,7 @@
10104
10061
  * @name_en Dialog
10105
10062
  */
10106
10063
 
10107
- var index$i = componentWrapper(Dialog, methodsGenerator$4(DialogWithGlobalContext));
10064
+ var index$j = componentWrapper(Dialog, methodsGenerator$4(DialogWithGlobalContext));
10108
10065
 
10109
10066
  function IconCheck(props) {
10110
10067
  var _a = props.className,
@@ -10675,7 +10632,7 @@
10675
10632
  fill: useCurrentColor ? 'currentColor' : '#000',
10676
10633
  viewBox: "0 0 1024 1024",
10677
10634
  xmlns: "http://www.w3.org/2000/svg"
10678
- }, other), /*#__PURE__*/React__default["default"].createElement("defs", null, /*#__PURE__*/React__default["default"].createElement("style", null)), /*#__PURE__*/React__default["default"].createElement("path", {
10635
+ }, other), /*#__PURE__*/React__default["default"].createElement("defs", null), /*#__PURE__*/React__default["default"].createElement("path", {
10679
10636
  d: "M195.456 341.333h633.088a21.333 21.333 0 0116.235 35.158L528.256 748.885a21.333 21.333 0 01-32.512 0L179.221 376.491a21.333 21.333 0 0116.235-35.158z"
10680
10637
  }));
10681
10638
  });
@@ -11875,7 +11832,7 @@
11875
11832
  };
11876
11833
  });
11877
11834
 
11878
- var index$h = (function () {
11835
+ var index$i = (function () {
11879
11836
  // Export existing implementation if available.
11880
11837
  if (typeof global$1.ResizeObserver !== 'undefined') {
11881
11838
  return global$1.ResizeObserver;
@@ -12106,7 +12063,7 @@
12106
12063
  React.useEffect(function () {
12107
12064
  if (domRef.current && reflowOnResize) {
12108
12065
  if (!observerRef.current && ellipsis) {
12109
- observerRef.current = new index$h(reflow);
12066
+ observerRef.current = new index$i(reflow);
12110
12067
  observerRef.current.observe(domRef.current);
12111
12068
  }
12112
12069
  }
@@ -12631,7 +12588,8 @@
12631
12588
 
12632
12589
  var _c = _this.props,
12633
12590
  children = _c.children,
12634
- trigger = _c.trigger;
12591
+ _d = _c.trigger,
12592
+ trigger = _d === void 0 ? 'onChange' : _d;
12635
12593
 
12636
12594
  if (trigger && ((_a = children.props) === null || _a === void 0 ? void 0 : _a[trigger])) {
12637
12595
  (_b = children.props) === null || _b === void 0 ? void 0 : _b[trigger].apply(_b, __spreadArrays$1([_, value], args));
@@ -12651,7 +12609,8 @@
12651
12609
 
12652
12610
  var _c = _this.props,
12653
12611
  children = _c.children,
12654
- trigger = _c.trigger;
12612
+ _d = _c.trigger,
12613
+ trigger = _d === void 0 ? 'onChange' : _d;
12655
12614
 
12656
12615
  if (trigger && ((_a = children.props) === null || _a === void 0 ? void 0 : _a[trigger])) {
12657
12616
  (_b = children.props) === null || _b === void 0 ? void 0 : _b[trigger].apply(_b, __spreadArrays$1([value], args));
@@ -13031,7 +12990,7 @@
13031
12990
  * @name_en Form
13032
12991
  */
13033
12992
 
13034
- var index$g = componentWrapper(Form, {
12993
+ var index$h = componentWrapper(Form, {
13035
12994
  Item: Item$1
13036
12995
  });
13037
12996
 
@@ -13404,7 +13363,7 @@
13404
13363
  * @displayName Input
13405
13364
  */
13406
13365
 
13407
- var index$f = componentWrapper(Input, 'Input');
13366
+ var index$g = componentWrapper(Input, 'Input');
13408
13367
 
13409
13368
  var Textarea = /*#__PURE__*/React.forwardRef(function (props, ref) {
13410
13369
  var id = props.id,
@@ -13551,7 +13510,7 @@
13551
13510
  * @displayName Textarea
13552
13511
  */
13553
13512
 
13554
- var index$e = componentWrapper(Textarea, 'Textarea');
13513
+ var index$f = componentWrapper(Textarea, 'Textarea');
13555
13514
 
13556
13515
  var RadioGroupContext = /*#__PURE__*/React__default["default"].createContext({
13557
13516
  isGroup: false,
@@ -13669,7 +13628,7 @@
13669
13628
  * @displayName Radio
13670
13629
  */
13671
13630
 
13672
- var index$d = componentWrapper(Radio, 'Radio', {
13631
+ var index$e = componentWrapper(Radio, 'Radio', {
13673
13632
  Group: Group
13674
13633
  });
13675
13634
 
@@ -13691,7 +13650,7 @@
13691
13650
  fill: useCurrentColor ? 'currentColor' : '#000',
13692
13651
  viewBox: "0 0 1024 1024",
13693
13652
  xmlns: "http://www.w3.org/2000/svg"
13694
- }, other), /*#__PURE__*/React__default["default"].createElement("defs", null, /*#__PURE__*/React__default["default"].createElement("style", null)), /*#__PURE__*/React__default["default"].createElement("path", {
13653
+ }, other), /*#__PURE__*/React__default["default"].createElement("defs", null), /*#__PURE__*/React__default["default"].createElement("path", {
13695
13654
  d: "M497.371 826.514L270.63 936.23c-18.286 7.314-40.229 0-47.543-18.286-3.657-3.657-7.315-10.972-3.657-18.286l25.6-248.686c0-10.971-3.658-18.285-7.315-29.257L69.486 435.2c-14.629-14.629-10.972-36.571 3.657-51.2 3.657-3.657 10.971-7.314 14.628-7.314l245.029-51.2c10.971-3.657 18.286-7.315 21.943-18.286l128-219.429C490.057 73.143 512 65.83 530.286 76.8c3.657 3.657 10.971 7.314 14.628 14.629l128 219.428c3.657 7.314 14.629 14.629 21.943 18.286l245.029 51.2c18.285 3.657 32.914 21.943 25.6 43.886 0 7.314-3.657 10.971-7.315 14.628L789.943 621.714c-7.314 7.315-10.972 18.286-7.314 29.257l25.6 248.686c3.657 18.286-10.972 36.572-32.915 40.229-7.314 0-14.628 0-18.285-3.657L530.286 826.514c-10.972-7.314-25.6-7.314-32.915 0z"
13696
13655
  }));
13697
13656
  });
@@ -13897,7 +13856,7 @@
13897
13856
  * @displayName Rate
13898
13857
  */
13899
13858
 
13900
- var index$c = componentWrapper(Rate, 'Rate');
13859
+ var index$d = componentWrapper(Rate, 'Rate');
13901
13860
 
13902
13861
  var useSliderIcon = function useSliderIcon(_a) {
13903
13862
  var valueGroup = _a.valueGroup;
@@ -14254,30 +14213,30 @@
14254
14213
  return function (realTimeValue) {
14255
14214
  setValueGroup(realTimeValue);
14256
14215
  };
14257
- } else {
14258
- var index_1 = Math.abs(valueGroup[0] - start) < Math.abs(valueGroup[1] - start) ? 0 : 1;
14216
+ }
14259
14217
 
14260
- var handleValue = function handleValue(realTimeValue) {
14261
- setValueGroup(function (passValueGroup) {
14262
- if (typeof passValueGroup === 'number') {
14263
- return [passValueGroup, realTimeValue];
14264
- }
14218
+ var index = Math.abs(valueGroup[0] - start) < Math.abs(valueGroup[1] - start) ? 0 : 1;
14265
14219
 
14266
- var newValueGroup = __spreadArrays$1(passValueGroup);
14220
+ var handleValue = function handleValue(realTimeValue) {
14221
+ setValueGroup(function (passValueGroup) {
14222
+ if (typeof passValueGroup === 'number') {
14223
+ return [passValueGroup, realTimeValue];
14224
+ }
14267
14225
 
14268
- newValueGroup[index_1] = realTimeValue;
14269
- return newValueGroup;
14270
- });
14271
- };
14226
+ var newValueGroup = __spreadArrays$1(passValueGroup);
14272
14227
 
14273
- if (isTouching) {
14274
- setCommonIsTouching(index_1);
14275
- handleValue(start);
14276
- setIsTouching(IsTouchingStatus.Moving);
14277
- }
14228
+ newValueGroup[index] = realTimeValue;
14229
+ return newValueGroup;
14230
+ });
14231
+ };
14278
14232
 
14279
- return handleValue;
14233
+ if (isTouching) {
14234
+ setCommonIsTouching(index);
14235
+ handleValue(start);
14236
+ setIsTouching(IsTouchingStatus.Moving);
14280
14237
  }
14238
+
14239
+ return handleValue;
14281
14240
  }, [touchStartPosition, getValueFromPosition]);
14282
14241
  React.useEffect(function () {
14283
14242
  var _a;
@@ -14663,7 +14622,7 @@
14663
14622
  * @displayName Slider
14664
14623
  */
14665
14624
 
14666
- var index$b = componentWrapper(SliderWrapper, 'Slider');
14625
+ var index$c = componentWrapper(SliderWrapper, 'Slider');
14667
14626
 
14668
14627
  /**
14669
14628
  * 宫格可以在水平方向上把页面分隔成等宽度的区块,用于展示内容或进行页面导航。
@@ -16856,7 +16815,7 @@
16856
16815
  fill: useCurrentColor ? 'currentColor' : '#000',
16857
16816
  viewBox: "0 0 1024 1024",
16858
16817
  xmlns: "http://www.w3.org/2000/svg"
16859
- }, other), /*#__PURE__*/React__default["default"].createElement("defs", null, /*#__PURE__*/React__default["default"].createElement("style", null)), /*#__PURE__*/React__default["default"].createElement("path", {
16818
+ }, other), /*#__PURE__*/React__default["default"].createElement("defs", null), /*#__PURE__*/React__default["default"].createElement("path", {
16860
16819
  d: "M115.2 467.2h819.2c6.4 0 6.4 6.4 6.4 6.4V544c0 6.4-6.4 6.4-6.4 6.4H96c-6.4 0-6.4-6.4-6.4-6.4v-64c0-6.4 6.4-6.4 6.4-6.4 6.4-6.4 6.4-6.4 19.2-6.4z"
16861
16820
  }));
16862
16821
  });
@@ -16981,7 +16940,7 @@
16981
16940
  }, other), /*#__PURE__*/React__default["default"].createElement("path", {
16982
16941
  d: "M12 24C5.4 24 0 18.6 0 12S5.4 0 12 0s12 5.4 12 12-5.4 12-12 12zm0-22.5C6.2 1.5 1.5 6.2 1.5 12S6.2 22.5 12 22.5 22.5 17.8 22.5 12 17.8 1.5 12 1.5z"
16983
16942
  }), /*#__PURE__*/React__default["default"].createElement("path", {
16984
- d: "M11.8 15.2h.3c.4 0 .7-.3.7-.7V7.2c0-.4-.3-.7-.7-.7h-.3c-.4 0-.7.3-.7.7v7.3c0 .4.3.7.7.7zm.4 1.3h-.3c-.4 0-.7.3-.7.7v.3c0 .4.3.7.7.7h.3c.4 0 .7-.3.7-.7v-.3c0-.4-.3-.7-.7-.7z"
16943
+ d: "M11.8 15.2h.3c.4 0 .7-.3.7-.7V7.2c0-.4-.3-.7-.7-.7h-.3c-.4 0-.7.3-.7.7v7.3c0 .4.3.7.7.7zM12.2 16.5h-.3c-.4 0-.7.3-.7.7v.3c0 .4.3.7.7.7h.3c.4 0 .7-.3.7-.7v-.3c0-.4-.3-.7-.7-.7z"
16985
16944
  }));
16986
16945
  });
16987
16946
  }
@@ -17068,6 +17027,68 @@
17068
17027
  });
17069
17028
  }
17070
17029
 
17030
+ function IconKeyboard(props) {
17031
+ var _a = props.className,
17032
+ className = _a === void 0 ? '' : _a,
17033
+ _b = props.useCurrentColor,
17034
+ useCurrentColor = _b === void 0 ? true : _b,
17035
+ style = props.style,
17036
+ other = __rest$1(props, ["className", "useCurrentColor", "style"]);
17037
+
17038
+ return /*#__PURE__*/React__default["default"].createElement(ContextLayout, null, function (_a) {
17039
+ var prefixCls = _a.prefixCls;
17040
+ return /*#__PURE__*/React__default["default"].createElement("svg", __assign$2({
17041
+ className: prefixCls + "-icon " + prefixCls + "-icon-keyboard " + className,
17042
+ width: "1em",
17043
+ height: "1em",
17044
+ style: style,
17045
+ version: "1.1",
17046
+ xmlns: "http://www.w3.org/2000/svg",
17047
+ x: "0",
17048
+ y: "0",
17049
+ viewBox: "0 0 26 26",
17050
+ xmlSpace: "preserve"
17051
+ }, other), /*#__PURE__*/React__default["default"].createElement("path", {
17052
+ d: "M15.9 21.7l-2.5 2.5c-.2.2-.5.2-.7 0l-2.5-2.5c-.3-.3-.1-.9.4-.9h5C16 20.9 16.2 21.4 15.9 21.7zM23.1 19.5H2.9c-1.1 0-2-.9-2-2V4.8c0-1.1.9-2 2-2h20.1c1.1 0 2 .9 2 2v12.7C25.1 18.6 24.2 19.5 23.1 19.5zM2.9 4.8L2.9 4.8v12.7h20.1V4.8H2.9z",
17053
+ fill: useCurrentColor ? 'currentColor' : '#1d2129'
17054
+ }), /*#__PURE__*/React__default["default"].createElement("path", {
17055
+ d: "M10.6,6.6H8.2V9h2.4V6.6z M4.5,6.6H7V9H4.5V6.6z M8.8,10.2H6.4v2.4h2.4V10.2z M16,10.2h-2.4v2.4H16V10.2z M10,10.2h2.4v2.4H10V10.2z M19.6,10.2h-2.4v2.4h2.4V10.2z M11.8,6.6h2.4V9h-2.4V6.6z M17.8,6.6h-2.4V9h2.4V6.6z M19,6.6h2.4V9H19\tV6.6z M17.8,13.8H8.2v1.8h9.7V13.8z",
17056
+ fillRule: "evenodd",
17057
+ clipRule: "evenodd",
17058
+ fill: useCurrentColor ? 'currentColor' : '#1d2129'
17059
+ }));
17060
+ });
17061
+ }
17062
+
17063
+ function IconKeyboardDelete(props) {
17064
+ var _a = props.className,
17065
+ className = _a === void 0 ? '' : _a,
17066
+ _b = props.useCurrentColor,
17067
+ useCurrentColor = _b === void 0 ? true : _b,
17068
+ style = props.style,
17069
+ other = __rest$1(props, ["className", "useCurrentColor", "style"]);
17070
+
17071
+ return /*#__PURE__*/React__default["default"].createElement(ContextLayout, null, function (_a) {
17072
+ var prefixCls = _a.prefixCls;
17073
+ return /*#__PURE__*/React__default["default"].createElement("svg", __assign$2({
17074
+ className: prefixCls + "-icon " + prefixCls + "-icon-keyboard-delete " + className,
17075
+ width: "1em",
17076
+ height: "1em",
17077
+ style: style,
17078
+ xmlns: "http://www.w3.org/2000/svg",
17079
+ viewBox: "0 0 26 26"
17080
+ }, other), /*#__PURE__*/React__default["default"].createElement("path", {
17081
+ d: "M23.1,21.4H8.3c-0.6,0-1.2-0.3-1.6-0.8l-4.9-6.4c-0.5-0.7-0.5-1.7,0-2.4l4.9-6.4c0.4-0.5,1-0.8,1.6-0.8h14.8\tc1.1,0,2,0.9,2,2v12.7C25.1,20.5,24.2,21.4,23.1,21.4z M8.3,6.6L3.4,13l4.9,6.4h14.8V6.6H8.3z",
17082
+ fill: useCurrentColor ? 'currentColor' : '#1d2129'
17083
+ }), /*#__PURE__*/React__default["default"].createElement("path", {
17084
+ d: "M11.3,9.4c0.4-0.4,1-0.4,1.3,0l2.5,2.5l2.5-2.5c0.4-0.4,1-0.4,1.3,0c0.4,0.4,0.4,1,0,1.3l-2.5,2.5l2.3,2.3\tc0.4,0.4,0.4,1,0,1.3c-0.4,0.4-1,0.4-1.3,0l-2.3-2.3L12.7,17c-0.4,0.4-1,0.4-1.3,0c-0.4-0.4-0.4-1,0-1.3l2.4-2.4l-2.5-2.5\tC10.9,10.4,10.9,9.8,11.3,9.4z",
17085
+ fillRule: "evenodd",
17086
+ clipRule: "evenodd",
17087
+ fill: useCurrentColor ? 'currentColor' : '#1d2129'
17088
+ }));
17089
+ });
17090
+ }
17091
+
17071
17092
  function AddIcon() {
17072
17093
  return /*#__PURE__*/React__default["default"].createElement("svg", {
17073
17094
  width: "30",
@@ -17379,10 +17400,10 @@
17379
17400
  * @displayName ImagePicker
17380
17401
  */
17381
17402
 
17382
- var index$a = componentWrapper(ImagePicker, 'ImagePicker');
17403
+ var index$b = componentWrapper(ImagePicker, 'ImagePicker');
17383
17404
 
17384
17405
  /*!
17385
- * @arco-design/transformable v1.0.1
17406
+ * @arco-design/transformable v1.0.2
17386
17407
  * (c) 2022 ludan.kibbon
17387
17408
  */
17388
17409
  function _defineProperty(obj, key, value) {
@@ -20575,111 +20596,1006 @@
20575
20596
  * @name_en ImagePreview
20576
20597
  */
20577
20598
 
20578
- var index$9 = componentWrapper(ImagePreview, methodsGenerator$3(ImagePreviewWithGlobalContext));
20599
+ var index$a = componentWrapper(ImagePreview, methodsGenerator$3(ImagePreviewWithGlobalContext));
20600
+
20601
+ var IndexBarContext = /*#__PURE__*/React.createContext({
20602
+ sticky: true,
20603
+ getScrollContainer: function getScrollContainer() {
20604
+ return null;
20605
+ },
20606
+ updateRef: function updateRef() {}
20607
+ });
20579
20608
 
20580
20609
  /**
20581
- * 上拉加载组件,支持`scroll`和`click`两种触发加载方式,支持滚动监听。支持受控与不受控两种形式。<br>如果引入组件后发现仅触发了初始的`getData`,请确认是否在`getData`方法内没有调用`callback`移除 loading 状态,且未设置`blockWhenLoading`属性为 false。
20582
- * @en Pull-up loading component, supports `scroll` and `click` two trigger loading methods, supports scroll monitoring. Both controlled and uncontrolled forms are supported. <br>If only the initial `getData` is triggered after the component is introduced, please make sure that the `callback` is not called in the `getData` method to remove the loading state, and the `blockWhenLoading` property is not set to false.
20583
- * @type 反馈
20584
- * @type_en Feedback
20585
- * @name 加载更多
20586
- * @name_en LoadMore
20610
+ * 粘性布局组件,元素相对于窗口或指定容器的吸顶效果。
20611
+ * @en Sticky layout component, The sticky-to-top effect of the element relative to the window or specified container
20612
+ * @type 布局
20613
+ * @type_en Layout
20614
+ * @name 粘性布局
20615
+ * @name_en Sticky
20587
20616
  */
20588
20617
 
20589
- var LoadMore = /*#__PURE__*/React.forwardRef(function (props, ref) {
20590
- var _a = props.className,
20591
- className = _a === void 0 ? '' : _a,
20618
+ var Sticky = /*#__PURE__*/React.forwardRef(function (props, ref) {
20619
+ var _a = props.position,
20620
+ position = _a === void 0 ? 'top' : _a,
20621
+ _b = props.topOffset,
20622
+ topOffset = _b === void 0 ? 0 : _b,
20623
+ _c = props.bottomOffset,
20624
+ bottomOffset = _c === void 0 ? 0 : _c,
20625
+ _d = props.followOffset,
20626
+ followOffset = _d === void 0 ? 0 : _d,
20627
+ children = props.children,
20628
+ className = props.className,
20592
20629
  style = props.style,
20593
- beforeReadyArea = props.beforeReadyArea,
20594
- loadingArea = props.loadingArea,
20595
- noMoreArea = props.noMoreArea,
20596
- prepareArea = props.prepareArea,
20597
- retryArea = props.retryArea,
20598
- _b = props.defaultStatus,
20599
- defaultStatus = _b === void 0 ? 'prepare' : _b,
20600
- status = props.status,
20630
+ _e = props.zIndex,
20631
+ zIndex = _e === void 0 ? 100 : _e,
20632
+ _f = props.portalWhenSticky,
20633
+ portalWhenSticky = _f === void 0 ? false : _f,
20634
+ _g = props.stickyStyle,
20635
+ stickyStyle = _g === void 0 ? 'fixed' : _g,
20636
+ userSetStickyCssStyle = props.stickyCssStyle,
20637
+ getPortalContainer = props.getPortalContainer,
20638
+ getContainer = props.getContainer,
20601
20639
  getScrollContainer = props.getScrollContainer,
20602
- _c = props.trigger,
20603
- trigger = _c === void 0 ? 'scroll' : _c,
20604
- _d = props.threshold,
20605
- threshold = _d === void 0 ? 200 : _d,
20606
- _e = props.throttle,
20607
- throttle = _e === void 0 ? 0 : _e,
20608
- _f = props.getDataAtFirst,
20609
- getDataAtFirst = _f === void 0 ? true : _f,
20610
- getData = props.getData,
20611
- _g = props.blockWhenLoading,
20612
- blockWhenLoading = _g === void 0 ? true : _g,
20613
- onStatusChange = props.onStatusChange,
20614
- onClick = props.onClick,
20615
- onEndReached = props.onEndReached;
20616
- var domRef = React.useRef(null);
20617
- var requestAtFirst = trigger === 'scroll' ? getDataAtFirst : false;
20640
+ onStickyStateChange = props.onStickyStateChange,
20641
+ onTopChange = props.onTopChange;
20618
20642
 
20619
- var _h = React.useState(defaultStatus),
20620
- innerStatus = _h[0],
20621
- setInnerStatus = _h[1];
20643
+ var _h = useRefState(false),
20644
+ isSticky = _h[0],
20645
+ isStickyRef = _h[1],
20646
+ setIsSticky = _h[2];
20622
20647
 
20623
- var lastScrollEndRef = React.useRef(false);
20624
- var nowStatus = status || innerStatus;
20625
- var statusRef = React.useRef(nowStatus);
20626
- var changeStatus = React.useCallback(function (st, scene) {
20627
- setInnerStatus(st);
20628
- onStatusChange && onStatusChange(st, scene);
20629
- }, [onStatusChange]);
20630
- var triggerGetData = React.useCallback(function (scene) {
20631
- if (blockWhenLoading && statusRef.current === 'loading') {
20632
- return;
20633
- }
20648
+ var _j = useRefState(false),
20649
+ wasSticky = _j[0],
20650
+ wasStickyRef = _j[1],
20651
+ setWasSticky = _j[2];
20634
20652
 
20635
- changeStatus('loading', scene);
20636
- getData === null || getData === void 0 ? void 0 : getData(function (st) {
20637
- lastScrollEndRef.current = false;
20638
- changeStatus(st, 'manual');
20639
- });
20640
- }, [blockWhenLoading, changeStatus, getData]);
20641
- React.useEffect(function () {
20642
- statusRef.current = nowStatus;
20643
- }, [nowStatus]);
20644
- useUpdateEffect(function () {
20645
- // 当状态被设置为 prepare ,且页面总长度不足一屏时,再触发一次 getData
20646
- // @en When the state is set to prepare and the total page length is less than one screen, trigger getData again
20647
- if (trigger === 'scroll' && nowStatus === 'prepare' && checkNeedTrigger(0, threshold)) {
20648
- triggerGetData('pageEnd');
20649
- }
20650
- }, [nowStatus]);
20651
- React.useEffect(function () {
20652
- if (requestAtFirst) {
20653
- if (statusRef.current === 'prepare') {
20654
- triggerGetData('requestAtFirst');
20655
- }
20656
- }
20657
- }, [trigger]);
20658
- var handleContainerScroll = React.useCallback(function () {
20659
- var scrollTop = getScrollContainerAttribute('scrollTop', getScrollContainer);
20653
+ var _k = React.useState({}),
20654
+ stickyStateStyle = _k[0],
20655
+ setStickyStateStyle = _k[1];
20660
20656
 
20661
- if (checkNeedTrigger(scrollTop, threshold + 1)) {
20662
- if (!lastScrollEndRef.current) {
20663
- lastScrollEndRef.current = true;
20664
- onEndReached && onEndReached();
20657
+ var contentRef = React.useRef(null);
20658
+ var placeholderRef = React.useRef(null);
20659
+ var contentCalculateHeightRef = React.useRef(0);
20660
+ var containerRef = React.useRef(null);
20661
+ var scrollContainerRef = React.useRef(null);
20662
+ var framePendingRef = React.useRef(false);
20663
+ var containerEventHandler = React.useCallback(function (_a) {
20664
+ var followTop = _a.followTop,
20665
+ followBottom = _a.followBottom;
20665
20666
 
20666
- if (!['nomore', 'retry', 'before-ready'].includes(statusRef.current)) {
20667
- triggerGetData('scrollEnd');
20668
- }
20669
- }
20670
- } else {
20671
- lastScrollEndRef.current = false;
20667
+ if (!contentRef.current) {
20668
+ return;
20672
20669
  }
20673
- }, [getScrollContainer, threshold, triggerGetData, onEndReached]);
20674
- React.useEffect(function () {
20675
- var binded = null;
20676
- var scrollFunc = throttle ? lodash_throttle(handleContainerScroll, throttle) : handleContainerScroll;
20677
-
20678
- if (trigger === 'scroll') {
20679
- var container = getValidScrollContainer(getScrollContainer);
20680
20670
 
20681
- if (container) {
20682
- container.addEventListener('scroll', scrollFunc);
20671
+ var needTop = position === 'top' || position === 'both';
20672
+ var needBottom = position === 'bottom' || position === 'both';
20673
+ var placeholderClientRect = placeholderRef.current.getBoundingClientRect();
20674
+ var contentClientRect = contentRef.current.getBoundingClientRect();
20675
+ var calculatedHeight = contentClientRect.height;
20676
+ contentCalculateHeightRef.current = contentClientRect.height;
20677
+ var containerRect = getScrollContainerRect(scrollContainerRef.current).containerRect;
20678
+ var containerTop = containerRect.top,
20679
+ containerBottom = containerRect.bottom,
20680
+ containerHeight = containerRect.height;
20681
+ var disFromTop = Math.round(placeholderClientRect.top - containerTop);
20682
+ var disFromBottom = Math.round(placeholderClientRect.top + calculatedHeight - containerBottom);
20683
+ var topFollowDifference = followBottom - followOffset - calculatedHeight - topOffset - containerTop;
20684
+ var bottomFollowDifference = containerHeight - followTop - followOffset - calculatedHeight - bottomOffset;
20685
+ setWasSticky(Boolean(isStickyRef.current));
20686
+ var isTopSticky = needTop ? disFromTop <= topOffset && followBottom > containerTop + followOffset : false;
20687
+ var isBottomSticky = needBottom ? disFromBottom >= -bottomOffset && followTop < containerBottom - followOffset : false;
20688
+ var newStickyState = isTopSticky || isBottomSticky;
20689
+ var cssTop = (stickyStyle === 'absolute' ? 0 : containerTop) + topOffset;
20690
+ var cssBottom = (stickyStyle === 'absolute' ? 0 : window.innerHeight - containerBottom) + bottomOffset;
20691
+ var stickyCssStyle = {};
20692
+
20693
+ if (newStickyState) {
20694
+ stickyCssStyle = __assign$2(__assign$2(__assign$2(__assign$2({
20695
+ transform: 'translateZ(0)',
20696
+ WebkitTransform: 'translateZ(0)',
20697
+ position: stickyStyle === 'absolute' ? 'absolute' : 'fixed',
20698
+ zIndex: zIndex
20699
+ }, isTopSticky ? {
20700
+ top: topFollowDifference > 0 ? cssTop : cssTop + topFollowDifference
20701
+ } : {}), isBottomSticky ? {
20702
+ bottom: bottomFollowDifference > 0 ? cssBottom : cssBottom + bottomFollowDifference
20703
+ } : {}), {
20704
+ left: placeholderClientRect.left,
20705
+ width: placeholderClientRect.width
20706
+ }), userSetStickyCssStyle || {});
20707
+ }
20708
+
20709
+ onTopChange === null || onTopChange === void 0 ? void 0 : onTopChange(Math.max(0, contentClientRect.top - containerTop - topOffset));
20710
+ setIsSticky(newStickyState);
20711
+ setStickyStateStyle(stickyCssStyle);
20712
+
20713
+ if (newStickyState !== wasStickyRef.current) {
20714
+ onStickyStateChange && onStickyStateChange({
20715
+ isTopSticky: isTopSticky,
20716
+ isBottomSticky: isBottomSticky,
20717
+ isSticky: newStickyState,
20718
+ wasSticky: wasStickyRef.current
20719
+ });
20720
+ }
20721
+ }, [position, topOffset, bottomOffset, followOffset, zIndex, stickyStyle, onStickyStateChange, onTopChange, userSetStickyCssStyle]);
20722
+ var recalculatePosition = React.useCallback(function () {
20723
+ if (framePendingRef.current) {
20724
+ return;
20725
+ }
20726
+
20727
+ execRAF(function () {
20728
+ framePendingRef.current = false;
20729
+
20730
+ if (containerRef.current) {
20731
+ var _a = containerRef.current.getBoundingClientRect(),
20732
+ top_1 = _a.top,
20733
+ bottom = _a.bottom;
20734
+
20735
+ containerEventHandler({
20736
+ followTop: top_1,
20737
+ followBottom: bottom
20738
+ });
20739
+ }
20740
+ });
20741
+ framePendingRef.current = true;
20742
+ }, [containerEventHandler]);
20743
+ React.useEffect(function () {
20744
+ var containerEle = getActualContainer(getContainer);
20745
+ containerRef.current = containerEle || document.body;
20746
+ var eventTarget = getScrollContainer ? getActualContainer(getScrollContainer) : window;
20747
+ if (!eventTarget) return;
20748
+ scrollContainerRef.current = eventTarget;
20749
+
20750
+ var attachEventListeners = function attachEventListeners(target) {
20751
+ target.addEventListener('scroll', recalculatePosition);
20752
+ };
20753
+
20754
+ var removeEventListeners = function removeEventListeners(target) {
20755
+ target.removeEventListener('scroll', recalculatePosition);
20756
+ };
20757
+
20758
+ attachEventListeners(eventTarget);
20759
+ recalculatePosition();
20760
+ return function () {
20761
+ removeEventListeners(eventTarget);
20762
+ };
20763
+ }, [getContainer, getScrollContainer, recalculatePosition]);
20764
+ React.useEffect(function () {
20765
+ if (placeholderRef.current) {
20766
+ // 当元素吸顶时,默认有一个占位的元素占住该元素的位置,避免布局产生抖动
20767
+ // @en When an element is sticky to the top, a placeholder element occupies the element's position by default to avoid jitter in the layout
20768
+ placeholderRef.current.style.height = (isStickyRef.current ? contentCalculateHeightRef.current : 0) + "px";
20769
+ }
20770
+ }, [isSticky, wasSticky]);
20771
+ React.useImperativeHandle(ref, function () {
20772
+ return {
20773
+ dom: contentRef.current,
20774
+ recalculatePosition: recalculatePosition
20775
+ };
20776
+ }, [recalculatePosition]);
20777
+ var computedStyle = React.useMemo(function () {
20778
+ return __assign$2(__assign$2({}, style || {}), stickyStateStyle);
20779
+ }, [stickyStateStyle, style]);
20780
+
20781
+ function renderSticky(prefixCls) {
20782
+ return /*#__PURE__*/React__default["default"].createElement("div", {
20783
+ className: cls(prefixCls + "-sticky", className),
20784
+ ref: contentRef,
20785
+ style: computedStyle
20786
+ }, children);
20787
+ }
20788
+
20789
+ return /*#__PURE__*/React__default["default"].createElement(ContextLayout, null, function (_a) {
20790
+ var prefixCls = _a.prefixCls;
20791
+ return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("div", {
20792
+ ref: placeholderRef
20793
+ }), portalWhenSticky && isSticky ? /*#__PURE__*/React__default["default"].createElement(Portal, {
20794
+ getContainer: getPortalContainer
20795
+ }, renderSticky(prefixCls)) : renderSticky(prefixCls));
20796
+ });
20797
+ });
20798
+
20799
+ var IndexBarGroup = /*#__PURE__*/React.forwardRef(function (props, ref) {
20800
+ var groupIndex = props.index,
20801
+ list = props.list,
20802
+ className = props.className,
20803
+ style = props.style,
20804
+ children = props.children,
20805
+ listKey = props.listKey,
20806
+ onGroupItemClick = props.onGroupItemClick,
20807
+ renderGroupItem = props.renderGroupItem,
20808
+ renderStickyItem = props.renderStickyItem;
20809
+ var prefixCls = React.useContext(GlobalContext).prefixCls; // 有可能是IndexBar.Group的写法,因此sticky从context中获得
20810
+
20811
+ var _a = React.useContext(IndexBarContext),
20812
+ sticky = _a.sticky,
20813
+ getScrollContainer = _a.getScrollContainer,
20814
+ activeIndex = _a.activeIndex,
20815
+ updateRef = _a.updateRef;
20816
+
20817
+ var domRef = React.useRef(null);
20818
+ React.useImperativeHandle(ref, function () {
20819
+ return {
20820
+ dom: domRef.current
20821
+ };
20822
+ }); // 用户自定义列表元素vnode的key
20823
+
20824
+ var formatGetListKey = function formatGetListKey(data, index) {
20825
+ var _a;
20826
+
20827
+ return (_a = listKey === null || listKey === void 0 ? void 0 : listKey(data, index)) !== null && _a !== void 0 ? _a : index;
20828
+ };
20829
+
20830
+ var renderChildren = function renderChildren() {
20831
+ var _a;
20832
+
20833
+ return (_a = children !== null && children !== void 0 ? children : list === null || list === void 0 ? void 0 : list.map(function (data, index) {
20834
+ return /*#__PURE__*/React__default["default"].createElement("div", {
20835
+ className: prefixCls + "-index-bar-group-item",
20836
+ key: formatGetListKey(data, index),
20837
+ onClick: function onClick() {
20838
+ return onGroupItemClick === null || onGroupItemClick === void 0 ? void 0 : onGroupItemClick(groupIndex, data, index);
20839
+ }
20840
+ }, renderGroupItem ? renderGroupItem(groupIndex, data, index) : data.content);
20841
+ })) !== null && _a !== void 0 ? _a : null;
20842
+ };
20843
+
20844
+ var renderIndexTitle = function renderIndexTitle() {
20845
+ var _a;
20846
+
20847
+ if (renderStickyItem) {
20848
+ return renderStickyItem(groupIndex);
20849
+ }
20850
+
20851
+ var titleDom = /*#__PURE__*/React__default["default"].createElement("div", {
20852
+ className: cls(prefixCls + "-index-bar-group-title", (_a = {}, _a[prefixCls + "-index-bar-group-active"] = activeIndex === groupIndex, _a))
20853
+ }, groupIndex);
20854
+ var groupDom = domRef.current;
20855
+ return sticky ? /*#__PURE__*/React__default["default"].createElement(Sticky, {
20856
+ getContainer: function getContainer() {
20857
+ return groupDom;
20858
+ },
20859
+ stickyStyle: "absolute",
20860
+ getScrollContainer: getScrollContainer,
20861
+ ref: function ref(stickyRef) {
20862
+ return stickyRef && updateRef(groupIndex, stickyRef);
20863
+ }
20864
+ }, titleDom) : titleDom;
20865
+ };
20866
+
20867
+ return /*#__PURE__*/React__default["default"].createElement("div", {
20868
+ className: cls(prefixCls + "-index-bar-group", className),
20869
+ style: style,
20870
+ "data-index": groupIndex,
20871
+ ref: domRef
20872
+ }, renderIndexTitle(), renderChildren());
20873
+ });
20874
+
20875
+ function IndexBarSideBar(props) {
20876
+ var _a;
20877
+
20878
+ var indexes = props.indexes,
20879
+ prefixCls = props.prefixCls,
20880
+ onTouching = props.onTouching,
20881
+ onClick = props.onClick,
20882
+ activeIndex = props.activeIndex,
20883
+ tipType = props.tipType,
20884
+ renderSideBar = props.renderSideBar,
20885
+ _b = props.renderSideBarItem,
20886
+ renderSideBarItem = _b === void 0 ? function (index) {
20887
+ return index;
20888
+ } : _b,
20889
+ propsRenderTip = props.renderTip;
20890
+
20891
+ var _c = React.useState(false),
20892
+ isTouching = _c[0],
20893
+ originSetIsTouching = _c[1];
20894
+
20895
+ var setIsTouching = function setIsTouching(touching) {
20896
+ originSetIsTouching(touching);
20897
+ onTouching(touching);
20898
+ };
20899
+
20900
+ var handleTouchingStart = function handleTouchingStart() {
20901
+ return setIsTouching(true);
20902
+ };
20903
+
20904
+ var handleTouchingStop = function handleTouchingStop() {
20905
+ return setIsTouching(false);
20906
+ };
20907
+
20908
+ var handleTouchMove = function handleTouchMove(e) {
20909
+ var _a, _b;
20910
+
20911
+ if (!isTouching || !((_a = e.touches) === null || _a === void 0 ? void 0 : _a.length)) {
20912
+ return;
20913
+ }
20914
+
20915
+ var _c = e.touches[0],
20916
+ clientX = _c.clientX,
20917
+ clientY = _c.clientY;
20918
+ var target = document.elementFromPoint(clientX, clientY);
20919
+
20920
+ if (target && ((_b = target.dataset) === null || _b === void 0 ? void 0 : _b.index)) {
20921
+ onClick(target.dataset.index);
20922
+ }
20923
+ };
20924
+
20925
+ var renderSideBarTip = function renderSideBarTip(index, type) {
20926
+ if (propsRenderTip) {
20927
+ return propsRenderTip(index);
20928
+ }
20929
+
20930
+ return /*#__PURE__*/React__default["default"].createElement("div", {
20931
+ className: prefixCls + "-index-bar-sidebar-" + type
20932
+ }, index);
20933
+ };
20934
+
20935
+ var node = /*#__PURE__*/React__default["default"].createElement("div", {
20936
+ className: cls(prefixCls + "-index-bar-sidebar", (_a = {}, _a[prefixCls + "-index-bar-sidebar-touching"] = isTouching, _a)),
20937
+ onTouchStart: function onTouchStart() {
20938
+ return handleTouchingStart();
20939
+ },
20940
+ onTouchEnd: function onTouchEnd() {
20941
+ return handleTouchingStop();
20942
+ },
20943
+ onTouchCancel: function onTouchCancel() {
20944
+ return handleTouchingStop();
20945
+ },
20946
+ onTouchMove: handleTouchMove
20947
+ }, tipType === 'toast' && isTouching && activeIndex && renderSideBarTip(activeIndex, 'toast'), indexes.map(function (index) {
20948
+ var _a;
20949
+
20950
+ return /*#__PURE__*/React__default["default"].createElement("div", {
20951
+ className: cls(prefixCls + "-index-bar-sidebar-item", (_a = {}, _a[prefixCls + "-index-bar-sidebar-active"] = activeIndex === index, _a)),
20952
+ key: index,
20953
+ onTouchStart: function onTouchStart() {
20954
+ return onClick(index);
20955
+ },
20956
+ "data-index": index
20957
+ }, tipType === 'sweat' && isTouching && activeIndex === index && renderSideBarTip(index, 'sweat'), /*#__PURE__*/React__default["default"].createElement("div", {
20958
+ className: prefixCls + "-index-bar-sidebar-item-wrapper"
20959
+ }, renderSideBarItem(index)));
20960
+ }));
20961
+ return renderSideBar ? renderSideBar(node) : node;
20962
+ }
20963
+
20964
+ function filterValidIndexBarChild(children) {
20965
+ var validChildren = [];
20966
+ React.Children.forEach(children, function (child) {
20967
+ if (! /*#__PURE__*/React.isValidElement(child) || child.type !== IndexBarGroup) {
20968
+ console.warn('<IndexBar /> only accept <IndexBar.Group /> as the children');
20969
+ return;
20970
+ }
20971
+
20972
+ validChildren.push(child);
20973
+ });
20974
+ return validChildren;
20975
+ } // index有可能是number或者string,但是绑在data-index的attr上后
20976
+ // 通过滑动事件得到的都是string,需要处理下
20977
+
20978
+ function getFormatIndex(index, activeIndex) {
20979
+ var activeIndexType = typeof activeIndex;
20980
+ var indexType = typeof index;
20981
+
20982
+ if (indexType === activeIndexType) {
20983
+ return index;
20984
+ }
20985
+
20986
+ if (activeIndexType === 'number') {
20987
+ return Number(index);
20988
+ }
20989
+
20990
+ return index.toString();
20991
+ }
20992
+ function isValidIndex(index) {
20993
+ return typeof index === 'number' || typeof index === 'string';
20994
+ }
20995
+ function getGroupDomFromIndex(containerDom, activeIndex) {
20996
+ var targetDom = null;
20997
+ var containerChildren = containerDom.children;
20998
+
20999
+ for (var i = 0; i < containerChildren.length; i++) {
21000
+ var dom = containerChildren[i];
21001
+ var dataset = dom === null || dom === void 0 ? void 0 : dom.dataset;
21002
+
21003
+ if (dataset && dataset.index) {
21004
+ var formatIndex = getFormatIndex(dataset.index, activeIndex);
21005
+
21006
+ if (formatIndex === activeIndex) {
21007
+ targetDom = dom;
21008
+ break;
21009
+ }
21010
+ }
21011
+ }
21012
+
21013
+ return targetDom;
21014
+ }
21015
+
21016
+ var IndexBar = /*#__PURE__*/React.forwardRef(function (props, ref) {
21017
+ var _a = props.className,
21018
+ className = _a === void 0 ? '' : _a,
21019
+ style = props.style,
21020
+ children = props.children,
21021
+ _b = props.sticky,
21022
+ sticky = _b === void 0 ? true : _b,
21023
+ _c = props.groups,
21024
+ groups = _c === void 0 ? [] : _c,
21025
+ _d = props.tipType,
21026
+ tipType = _d === void 0 ? 'toast' : _d,
21027
+ defaultIndex = props.defaultIndex,
21028
+ scrollBezier = props.scrollBezier,
21029
+ _e = props.scrollDuration,
21030
+ scrollDuration = _e === void 0 ? 0 : _e,
21031
+ _f = props.disableSidebar,
21032
+ disableSidebar = _f === void 0 ? false : _f,
21033
+ onChange = props.onChange,
21034
+ onGroupItemClick = props.onGroupItemClick,
21035
+ renderSideBar = props.renderSideBar,
21036
+ renderSideBarItem = props.renderSideBarItem,
21037
+ renderTip = props.renderTip,
21038
+ renderStickyItem = props.renderStickyItem,
21039
+ renderGroupItem = props.renderGroupItem; // 最外层dom元素的ref
21040
+
21041
+ var domRef = React.useRef(null); // 所有group的容器dom,domRef的内容就是contanerRef和sidebar的内容
21042
+
21043
+ var containerRef = React.useRef(null); // 过滤掉jsx写法中,奇怪的child
21044
+
21045
+ var formatChildren = filterValidIndexBarChild(children); // 所有的索引内容,优先从props.groups中获取,再从formatChildren中获取
21046
+
21047
+ var indexes = React.useMemo(function () {
21048
+ if (groups.length) {
21049
+ return groups.map(function (group) {
21050
+ return group.index;
21051
+ });
21052
+ }
21053
+
21054
+ return formatChildren.map(function (child) {
21055
+ return child.props.index;
21056
+ });
21057
+ }, [children, groups]);
21058
+ var groupRefs = React.useRef({}); // 当前激活的Index
21059
+
21060
+ var _g = React.useState(function () {
21061
+ return defaultIndex !== null && defaultIndex !== void 0 ? defaultIndex : indexes === null || indexes === void 0 ? void 0 : indexes[0];
21062
+ }),
21063
+ activeIndex = _g[0],
21064
+ setActiveIndex = _g[1]; // 给IndexBarGroup用的上下文,主要是为了兼容jsx的写法
21065
+
21066
+
21067
+ var contextValue = React.useMemo(function () {
21068
+ return {
21069
+ sticky: sticky,
21070
+ getScrollContainer: function getScrollContainer() {
21071
+ return containerRef.current;
21072
+ },
21073
+ activeIndex: activeIndex,
21074
+ updateRef: function updateRef(groupIndex, stickyRef) {
21075
+ groupRefs.current[groupIndex] = stickyRef;
21076
+ }
21077
+ };
21078
+ }, [sticky, activeIndex]); // 用户是否正在触碰sidebar, 如果为true的话,禁用handleScroll的处理
21079
+
21080
+ var isScrollHandlerDisabledRef = React.useRef(false);
21081
+
21082
+ var handleChangeActiveIndex = function handleChangeActiveIndex(index, type) {
21083
+ setActiveIndex(function (oldActiveIndex) {
21084
+ var newActiveIndex = getFormatIndex(index, oldActiveIndex); // 和上一次激活的acitveIndex不同,再触发onChange事件
21085
+
21086
+ if (newActiveIndex !== oldActiveIndex) {
21087
+ onChange === null || onChange === void 0 ? void 0 : onChange(newActiveIndex, type);
21088
+ }
21089
+
21090
+ return newActiveIndex;
21091
+ });
21092
+ }; // 要滚动到哪个指定的index
21093
+
21094
+
21095
+ var handleScrollIntoIndex = function handleScrollIntoIndex(params) {
21096
+ var index = params.index,
21097
+ type = params.type,
21098
+ _a = params.rightNow,
21099
+ rightNow = _a === void 0 ? false : _a; // 不传index默认走第一个index
21100
+
21101
+ var formatIndex = index !== null && index !== void 0 ? index : indexes === null || indexes === void 0 ? void 0 : indexes[0];
21102
+ var containerDom = containerRef.current;
21103
+
21104
+ if (!isValidIndex(index) || !containerDom) {
21105
+ return;
21106
+ } // 寻找Index对应的groupDom
21107
+
21108
+
21109
+ var groupDom = getGroupDomFromIndex(containerDom, formatIndex);
21110
+
21111
+ if (groupDom) {
21112
+ handleChangeActiveIndex(formatIndex, type);
21113
+ var duration = rightNow ? 0 : scrollDuration;
21114
+ var targetScrollTop = groupDom.offsetTop; // 将屏幕滚动到groupDom
21115
+ // 手动触发需要禁用handleScroll事件
21116
+
21117
+ if (type === 'manual') {
21118
+ isScrollHandlerDisabledRef.current = true;
21119
+ setTimeout(function () {
21120
+ isScrollHandlerDisabledRef.current = false;
21121
+ }, duration);
21122
+ }
21123
+
21124
+ if (duration > 0) {
21125
+ scrollWithAnimation(containerDom.scrollTop, targetScrollTop, function (top) {
21126
+ return containerDom.scrollTop = top;
21127
+ }, duration, scrollBezier);
21128
+ } else {
21129
+ containerDom.scrollTop = targetScrollTop;
21130
+ }
21131
+ }
21132
+ };
21133
+
21134
+ React.useImperativeHandle(ref, function () {
21135
+ return {
21136
+ dom: domRef.current,
21137
+ scrollToIndex: function scrollToIndex(index, rightNow) {
21138
+ if (isValidIndex(index)) {
21139
+ handleScrollIntoIndex({
21140
+ index: index,
21141
+ rightNow: rightNow,
21142
+ type: 'manual'
21143
+ });
21144
+ }
21145
+ },
21146
+ recalculatePosition: function recalculatePosition(targetIndex) {
21147
+ var formatIndex = targetIndex !== null && targetIndex !== void 0 ? targetIndex : activeIndex;
21148
+
21149
+ if (formatIndex) {
21150
+ var targetStickyRef = groupRefs.current[formatIndex];
21151
+
21152
+ if (targetStickyRef && targetStickyRef.recalculatePosition) {
21153
+ targetStickyRef.recalculatePosition();
21154
+ }
21155
+ }
21156
+ }
21157
+ };
21158
+ });
21159
+
21160
+ var renderChildren = function renderChildren() {
21161
+ if (formatChildren.length) {
21162
+ return formatChildren;
21163
+ }
21164
+
21165
+ return groups === null || groups === void 0 ? void 0 : groups.map(function (group) {
21166
+ return /*#__PURE__*/React__default["default"].createElement(IndexBarGroup, {
21167
+ index: group.index,
21168
+ key: group.index,
21169
+ list: group.list,
21170
+ onGroupItemClick: onGroupItemClick,
21171
+ renderGroupItem: renderGroupItem,
21172
+ renderStickyItem: renderStickyItem
21173
+ });
21174
+ });
21175
+ };
21176
+
21177
+ React.useEffect(function () {
21178
+ var _a;
21179
+
21180
+ var handleScroll = lodash_throttle(function () {
21181
+ // 用户正在触碰sidebar和手动触发scroll时禁用滚动事件的处理
21182
+ if (!containerRef.current || isScrollHandlerDisabledRef.current) {
21183
+ return;
21184
+ } // 根据滚动的距离,获取处于屏幕最顶部的group是哪个
21185
+
21186
+
21187
+ var scrollTop = containerRef.current.scrollTop;
21188
+
21189
+ for (var i = 0; i < containerRef.current.children.length; i++) {
21190
+ var child = containerRef.current.children[i];
21191
+
21192
+ if (!child || !child.dataset || typeof child.dataset.index === 'undefined') {
21193
+ continue;
21194
+ }
21195
+
21196
+ if (child.offsetTop + child.clientHeight >= scrollTop) {
21197
+ handleChangeActiveIndex(child.dataset.index, 'swipe');
21198
+ break;
21199
+ }
21200
+ }
21201
+ }, 100); // 页面挂载时,如果是传入了defaultIndex,则滚动到对应位置
21202
+
21203
+ if (activeIndex) {
21204
+ handleScrollIntoIndex({
21205
+ index: activeIndex,
21206
+ rightNow: true,
21207
+ type: 'manual'
21208
+ });
21209
+ }
21210
+
21211
+ (_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.addEventListener('scroll', handleScroll);
21212
+ return function () {
21213
+ var _a;
21214
+
21215
+ (_a = containerRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('scroll', handleScroll);
21216
+ };
21217
+ }, []);
21218
+ return /*#__PURE__*/React__default["default"].createElement(ContextLayout, null, function (_a) {
21219
+ var prefixCls = _a.prefixCls;
21220
+ return /*#__PURE__*/React__default["default"].createElement(IndexBarContext.Provider, {
21221
+ value: contextValue
21222
+ }, /*#__PURE__*/React__default["default"].createElement("div", {
21223
+ className: cls(prefixCls + "-index-bar", className),
21224
+ style: style,
21225
+ ref: domRef
21226
+ }, /*#__PURE__*/React__default["default"].createElement("div", {
21227
+ className: prefixCls + "-index-bar-container",
21228
+ ref: containerRef
21229
+ }, renderChildren()), !disableSidebar && /*#__PURE__*/React__default["default"].createElement(IndexBarSideBar, {
21230
+ tipType: tipType,
21231
+ activeIndex: activeIndex,
21232
+ prefixCls: prefixCls,
21233
+ indexes: indexes,
21234
+ onTouching: function onTouching(isTouching) {
21235
+ return isScrollHandlerDisabledRef.current = isTouching;
21236
+ },
21237
+ onClick: function onClick(newIndex) {
21238
+ return handleScrollIntoIndex({
21239
+ index: newIndex,
21240
+ type: 'sidebar'
21241
+ });
21242
+ },
21243
+ renderSideBar: renderSideBar,
21244
+ renderSideBarItem: renderSideBarItem,
21245
+ renderTip: renderTip
21246
+ })));
21247
+ });
21248
+ });
21249
+ /**
21250
+ * 索引栏组件
21251
+ * @en IndexBar component
21252
+ * @type 导航
21253
+ * @type_en Navigation
21254
+ * @name 索引栏
21255
+ * @name_en SearchBar
21256
+ */
21257
+
21258
+ var index$9 = componentWrapper(IndexBar, {
21259
+ Group: IndexBarGroup
21260
+ });
21261
+
21262
+ // @en let keyboard random
21263
+
21264
+ var makeArrayRandom = function makeArrayRandom(targetArray) {
21265
+ var randomFn = function randomFn() {
21266
+ return Math.random() - 0.5;
21267
+ };
21268
+
21269
+ return targetArray.sort(randomFn);
21270
+ };
21271
+
21272
+ var splitArray = function splitArray(target) {
21273
+ return target.reduce(function (acc, cur) {
21274
+ if (!acc[acc.length - 1] || acc[acc.length - 1].length >= 3) {
21275
+ acc.push([]);
21276
+ }
21277
+
21278
+ acc[acc.length - 1].push(cur);
21279
+ return acc;
21280
+ }, []);
21281
+ }; // 纯数字类字符
21282
+ // @en Pure numeric characters
21283
+
21284
+
21285
+ var contentArray = [1, 2, 3, 4, 5, 6, 7, 8, 9, 0];
21286
+ /**
21287
+ * 数字键盘组件
21288
+ * @en Keyboard component
21289
+ * @type 数据录入
21290
+ * @type_en Data Entry
21291
+ * @name 数字键盘
21292
+ * @name_en Keyboard
21293
+ */
21294
+
21295
+ var Keyboard = /*#__PURE__*/React.forwardRef(function (props, ref) {
21296
+ var normalKeyClass = props.normalKeyClass,
21297
+ normalKeyStyle = props.normalKeyStyle,
21298
+ _a = props.className,
21299
+ className = _a === void 0 ? '' : _a,
21300
+ style = props.style,
21301
+ _b = props.type,
21302
+ type = _b === void 0 ? 'number' : _b,
21303
+ _c = props.randomOrder,
21304
+ randomOrder = _c === void 0 ? false : _c,
21305
+ title = props.title,
21306
+ rightColumns = props.rightColumns,
21307
+ confirmClosable = props.confirmClosable,
21308
+ confirmButton = props.confirmButton,
21309
+ deleteButton = props.deleteButton,
21310
+ keyboardButton = props.keyboardButton,
21311
+ close = props.close,
21312
+ onConfirm = props.onConfirm,
21313
+ onDelete = props.onDelete,
21314
+ onChange = props.onChange,
21315
+ resetProps = __rest$1(props, ["normalKeyClass", "normalKeyStyle", "className", "style", "type", "randomOrder", "title", "rightColumns", "confirmClosable", "confirmButton", "deleteButton", "keyboardButton", "close", "onConfirm", "onDelete", "onChange"]);
21316
+
21317
+ var popupRef = React.useRef(null);
21318
+ var keyboardRef = React.useRef(null);
21319
+
21320
+ var _d = React.useContext(GlobalContext),
21321
+ prefixCls = _d.prefixCls,
21322
+ _e = _d.locale,
21323
+ locale = _e === void 0 ? defaultLocale : _e;
21324
+
21325
+ var prefix = prefixCls + "-keyboard"; // 3x4键盘的按键内容
21326
+ // @en 3x4 Keyboard button content
21327
+
21328
+ var displayData = React.useMemo(function () {
21329
+ var numberArr = randomOrder ? makeArrayRandom(contentArray) : contentArray;
21330
+ var lastNum = numberArr.slice(-1)[0];
21331
+ var finalData = splitArray(numberArr.slice(0, -1));
21332
+
21333
+ switch (type) {
21334
+ case 'confirm':
21335
+ finalData.push([lastNum, '.']);
21336
+ break;
21337
+
21338
+ case 'tool':
21339
+ finalData.push(['.', lastNum, {
21340
+ type: 'delete'
21341
+ }]);
21342
+ break;
21343
+
21344
+ case 'number':
21345
+ default:
21346
+ finalData.push([{
21347
+ type: 'keyboard'
21348
+ }, lastNum, {
21349
+ type: 'delete'
21350
+ }]);
21351
+ break;
21352
+ }
21353
+
21354
+ return finalData;
21355
+ }, [type]); // 右边一列
21356
+ // @en Right column
21357
+
21358
+ var rightColumn = React.useMemo(function () {
21359
+ switch (type) {
21360
+ case 'number':
21361
+ return [];
21362
+
21363
+ case 'confirm':
21364
+ {
21365
+ return [{
21366
+ type: 'delete'
21367
+ }];
21368
+ }
21369
+
21370
+ case 'tool':
21371
+ return ['+', '-', '×', '÷'];
21372
+
21373
+ default:
21374
+ return [];
21375
+ }
21376
+ }, [type]); // 确认按钮需要在type为confirm时展示
21377
+ // @en Display then confirm button when type is confirm
21378
+
21379
+ var getConfirmButton = React.useCallback(function () {
21380
+ if (type !== 'confirm') {
21381
+ return null;
21382
+ }
21383
+
21384
+ return /*#__PURE__*/React__default["default"].createElement("div", {
21385
+ onClick: function onClick() {
21386
+ confirmClosable && close();
21387
+ onConfirm === null || onConfirm === void 0 ? void 0 : onConfirm();
21388
+ },
21389
+ className: cls(prefix + "-key", prefix + "-key-confirm")
21390
+ }, confirmButton || locale.Keyboard.confirm);
21391
+ }, [type]); // 点击空白处关闭键盘
21392
+ // @en Close keyboard when clicked the blank space
21393
+
21394
+ React.useEffect(function () {
21395
+ var handlerDocumentClick = function handlerDocumentClick(e) {
21396
+ if (!keyboardRef.current) {
21397
+ return;
21398
+ }
21399
+
21400
+ if (!keyboardRef.current.contains(e.target) && e.target !== keyboardRef.current) {
21401
+ close();
21402
+ }
21403
+ };
21404
+
21405
+ document.addEventListener('click', handlerDocumentClick);
21406
+ return function () {
21407
+ document.removeEventListener('click', handlerDocumentClick);
21408
+ };
21409
+ }, []);
21410
+ React.useImperativeHandle(ref, function () {
21411
+ return __assign$2({
21412
+ keyboard: keyboardRef.current
21413
+ }, popupRef.current);
21414
+ });
21415
+
21416
+ var handleButtonClick = function handleButtonClick(ele) {
21417
+ switch (ele.type) {
21418
+ case 'delete':
21419
+ onDelete === null || onDelete === void 0 ? void 0 : onDelete();
21420
+ break;
21421
+
21422
+ case 'keyboard':
21423
+ close();
21424
+ break;
21425
+
21426
+ default:
21427
+ onChange === null || onChange === void 0 ? void 0 : onChange(ele.value);
21428
+ }
21429
+ };
21430
+
21431
+ var renderButtonContent = function renderButtonContent(ele) {
21432
+ switch (ele.type) {
21433
+ case 'delete':
21434
+ return deleteButton || /*#__PURE__*/React__default["default"].createElement(IconKeyboardDelete, null);
21435
+
21436
+ case 'keyboard':
21437
+ return keyboardButton || /*#__PURE__*/React__default["default"].createElement(IconKeyboard, null);
21438
+
21439
+ default:
21440
+ return ele.content;
21441
+ }
21442
+ };
21443
+
21444
+ var renderButton = function renderButton(data, key, extraClass) {
21445
+ var ele = typeof data === 'string' || typeof data === 'number' ? {
21446
+ type: 'content',
21447
+ content: data,
21448
+ value: data
21449
+ } : data;
21450
+ return /*#__PURE__*/React__default["default"].createElement("button", {
21451
+ onClick: function onClick() {
21452
+ return handleButtonClick(ele);
21453
+ },
21454
+ className: cls(prefix + "-key", normalKeyClass, extraClass),
21455
+ key: key,
21456
+ style: normalKeyStyle
21457
+ }, renderButtonContent(ele));
21458
+ };
21459
+
21460
+ var renderKeyboardRightColumns = function renderKeyboardRightColumns() {
21461
+ if (rightColumns) {
21462
+ return rightColumns;
21463
+ }
21464
+
21465
+ return rightColumn.length > 0 ? /*#__PURE__*/React__default["default"].createElement("div", {
21466
+ className: prefix + "-col"
21467
+ }, rightColumn.map(function (item, index) {
21468
+ return renderButton(item, String(index));
21469
+ }), getConfirmButton()) : null;
21470
+ };
21471
+
21472
+ return /*#__PURE__*/React__default["default"].createElement(Popup$1, __assign$2({
21473
+ ref: popupRef,
21474
+ maskClass: prefix + "-popup",
21475
+ close: close
21476
+ }, resetProps), /*#__PURE__*/React__default["default"].createElement("div", {
21477
+ className: cls(prefix, "" + className),
21478
+ style: style,
21479
+ ref: keyboardRef
21480
+ }, title, /*#__PURE__*/React__default["default"].createElement("div", {
21481
+ className: prefix + "-wrapper"
21482
+ }, /*#__PURE__*/React__default["default"].createElement("div", {
21483
+ className: prefix + "-key-wrapper"
21484
+ }, displayData.map(function (item, index) {
21485
+ return /*#__PURE__*/React__default["default"].createElement("div", {
21486
+ className: prefix + "-row",
21487
+ key: index
21488
+ }, item.map(function (e, idx) {
21489
+ var _a;
21490
+
21491
+ return renderButton(e, String(idx), (_a = {}, _a[prefix + "-key-special"] = type === 'confirm' && index === displayData.length - 1 && idx === 0, _a));
21492
+ }));
21493
+ })), renderKeyboardRightColumns())));
21494
+ });
21495
+
21496
+ /**
21497
+ * 上拉加载组件,支持`scroll`和`click`两种触发加载方式,支持滚动监听。支持受控与不受控两种形式。<br>如果引入组件后发现仅触发了初始的`getData`,请确认是否在`getData`方法内没有调用`callback`移除 loading 状态,且未设置`blockWhenLoading`属性为 false。
21498
+ * @en Pull-up loading component, supports `scroll` and `click` two trigger loading methods, supports scroll monitoring. Both controlled and uncontrolled forms are supported. <br>If only the initial `getData` is triggered after the component is introduced, please make sure that the `callback` is not called in the `getData` method to remove the loading state, and the `blockWhenLoading` property is not set to false.
21499
+ * @type 反馈
21500
+ * @type_en Feedback
21501
+ * @name 加载更多
21502
+ * @name_en LoadMore
21503
+ */
21504
+
21505
+ var LoadMore = /*#__PURE__*/React.forwardRef(function (props, ref) {
21506
+ var _a = props.className,
21507
+ className = _a === void 0 ? '' : _a,
21508
+ style = props.style,
21509
+ beforeReadyArea = props.beforeReadyArea,
21510
+ loadingArea = props.loadingArea,
21511
+ noMoreArea = props.noMoreArea,
21512
+ prepareArea = props.prepareArea,
21513
+ retryArea = props.retryArea,
21514
+ _b = props.defaultStatus,
21515
+ defaultStatus = _b === void 0 ? 'prepare' : _b,
21516
+ status = props.status,
21517
+ getScrollContainer = props.getScrollContainer,
21518
+ _c = props.trigger,
21519
+ trigger = _c === void 0 ? 'scroll' : _c,
21520
+ _d = props.threshold,
21521
+ threshold = _d === void 0 ? 200 : _d,
21522
+ _e = props.throttle,
21523
+ throttle = _e === void 0 ? 0 : _e,
21524
+ _f = props.getDataAtFirst,
21525
+ getDataAtFirst = _f === void 0 ? true : _f,
21526
+ getData = props.getData,
21527
+ _g = props.blockWhenLoading,
21528
+ blockWhenLoading = _g === void 0 ? true : _g,
21529
+ onStatusChange = props.onStatusChange,
21530
+ onClick = props.onClick,
21531
+ onEndReached = props.onEndReached;
21532
+ var domRef = React.useRef(null);
21533
+ var requestAtFirst = trigger === 'scroll' ? getDataAtFirst : false;
21534
+
21535
+ var _h = React.useState(defaultStatus),
21536
+ innerStatus = _h[0],
21537
+ setInnerStatus = _h[1];
21538
+
21539
+ var lastScrollEndRef = React.useRef(false);
21540
+ var nowStatus = status || innerStatus;
21541
+ var statusRef = React.useRef(nowStatus);
21542
+ var changeStatus = React.useCallback(function (st, scene) {
21543
+ setInnerStatus(st);
21544
+ onStatusChange && onStatusChange(st, scene);
21545
+ }, [onStatusChange]);
21546
+ var triggerGetData = React.useCallback(function (scene) {
21547
+ if (blockWhenLoading && statusRef.current === 'loading') {
21548
+ return;
21549
+ }
21550
+
21551
+ changeStatus('loading', scene);
21552
+ getData === null || getData === void 0 ? void 0 : getData(function (st) {
21553
+ lastScrollEndRef.current = false;
21554
+ changeStatus(st, 'manual');
21555
+ });
21556
+ }, [blockWhenLoading, changeStatus, getData]);
21557
+ React.useEffect(function () {
21558
+ statusRef.current = nowStatus;
21559
+ }, [nowStatus]);
21560
+ useUpdateEffect(function () {
21561
+ // 当状态被设置为 prepare ,且页面总长度不足一屏时,再触发一次 getData
21562
+ // @en When the state is set to prepare and the total page length is less than one screen, trigger getData again
21563
+ if (trigger === 'scroll' && nowStatus === 'prepare' && checkNeedTrigger(0, threshold)) {
21564
+ triggerGetData('pageEnd');
21565
+ }
21566
+ }, [nowStatus]);
21567
+ React.useEffect(function () {
21568
+ if (requestAtFirst) {
21569
+ if (statusRef.current === 'prepare') {
21570
+ triggerGetData('requestAtFirst');
21571
+ }
21572
+ }
21573
+ }, [trigger]);
21574
+ var handleContainerScroll = React.useCallback(function () {
21575
+ var scrollTop = getScrollContainerAttribute('scrollTop', getScrollContainer);
21576
+
21577
+ if (checkNeedTrigger(scrollTop, threshold + 1)) {
21578
+ if (!lastScrollEndRef.current) {
21579
+ lastScrollEndRef.current = true;
21580
+ onEndReached && onEndReached();
21581
+
21582
+ if (!['nomore', 'retry', 'before-ready'].includes(statusRef.current)) {
21583
+ triggerGetData('scrollEnd');
21584
+ }
21585
+ }
21586
+ } else {
21587
+ lastScrollEndRef.current = false;
21588
+ }
21589
+ }, [getScrollContainer, threshold, triggerGetData, onEndReached]);
21590
+ React.useEffect(function () {
21591
+ var binded = null;
21592
+ var scrollFunc = throttle ? lodash_throttle(handleContainerScroll, throttle) : handleContainerScroll;
21593
+
21594
+ if (trigger === 'scroll') {
21595
+ var container = getValidScrollContainer(getScrollContainer);
21596
+
21597
+ if (container) {
21598
+ container.addEventListener('scroll', scrollFunc);
20683
21599
  binded = container;
20684
21600
  }
20685
21601
  }
@@ -24584,196 +25500,6 @@
24584
25500
  Step: Step
24585
25501
  });
24586
25502
 
24587
- /**
24588
- * 粘性布局组件,元素相对于窗口或指定容器的吸顶效果。
24589
- * @en Sticky layout component, The sticky-to-top effect of the element relative to the window or specified container
24590
- * @type 布局
24591
- * @type_en Layout
24592
- * @name 粘性布局
24593
- * @name_en Sticky
24594
- */
24595
-
24596
- var Sticky = /*#__PURE__*/React.forwardRef(function (props, ref) {
24597
- var _a = props.position,
24598
- position = _a === void 0 ? 'top' : _a,
24599
- _b = props.topOffset,
24600
- topOffset = _b === void 0 ? 0 : _b,
24601
- _c = props.bottomOffset,
24602
- bottomOffset = _c === void 0 ? 0 : _c,
24603
- _d = props.followOffset,
24604
- followOffset = _d === void 0 ? 0 : _d,
24605
- children = props.children,
24606
- className = props.className,
24607
- style = props.style,
24608
- _e = props.zIndex,
24609
- zIndex = _e === void 0 ? 100 : _e,
24610
- _f = props.portalWhenSticky,
24611
- portalWhenSticky = _f === void 0 ? false : _f,
24612
- _g = props.stickyStyle,
24613
- stickyStyle = _g === void 0 ? 'fixed' : _g,
24614
- userSetStickyCssStyle = props.stickyCssStyle,
24615
- getPortalContainer = props.getPortalContainer,
24616
- getContainer = props.getContainer,
24617
- getScrollContainer = props.getScrollContainer,
24618
- onStickyStateChange = props.onStickyStateChange,
24619
- onTopChange = props.onTopChange;
24620
-
24621
- var _h = useRefState(false),
24622
- isSticky = _h[0],
24623
- isStickyRef = _h[1],
24624
- setIsSticky = _h[2];
24625
-
24626
- var _j = useRefState(false),
24627
- wasSticky = _j[0],
24628
- wasStickyRef = _j[1],
24629
- setWasSticky = _j[2];
24630
-
24631
- var _k = React.useState({}),
24632
- stickyStateStyle = _k[0],
24633
- setStickyStateStyle = _k[1];
24634
-
24635
- var contentRef = React.useRef(null);
24636
- var placeholderRef = React.useRef(null);
24637
- var contentCalculateHeightRef = React.useRef(0);
24638
- var containerRef = React.useRef(null);
24639
- var scrollContainerRef = React.useRef(null);
24640
- var framePendingRef = React.useRef(false);
24641
- var containerEventHandler = React.useCallback(function (_a) {
24642
- var followTop = _a.followTop,
24643
- followBottom = _a.followBottom;
24644
-
24645
- if (!contentRef.current) {
24646
- return;
24647
- }
24648
-
24649
- var needTop = position === 'top' || position === 'both';
24650
- var needBottom = position === 'bottom' || position === 'both';
24651
- var placeholderClientRect = placeholderRef.current.getBoundingClientRect();
24652
- var contentClientRect = contentRef.current.getBoundingClientRect();
24653
- var calculatedHeight = contentClientRect.height;
24654
- contentCalculateHeightRef.current = contentClientRect.height;
24655
- var containerRect = getScrollContainerRect(scrollContainerRef.current).containerRect;
24656
- var containerTop = containerRect.top,
24657
- containerBottom = containerRect.bottom,
24658
- containerHeight = containerRect.height;
24659
- var disFromTop = placeholderClientRect.top - containerTop;
24660
- var disFromBottom = placeholderClientRect.top + calculatedHeight - containerBottom;
24661
- var topFollowDifference = followBottom - followOffset - calculatedHeight - topOffset - containerTop;
24662
- var bottomFollowDifference = containerHeight - followTop - followOffset - calculatedHeight - bottomOffset;
24663
- setWasSticky(Boolean(isStickyRef.current));
24664
- var isTopSticky = needTop ? disFromTop <= topOffset && followBottom > containerTop + followOffset : false;
24665
- var isBottomSticky = needBottom ? disFromBottom >= -bottomOffset && followTop < containerBottom - followOffset : false;
24666
- var newStickyState = isTopSticky || isBottomSticky;
24667
- var cssTop = (stickyStyle === 'absolute' ? 0 : containerTop) + topOffset;
24668
- var cssBottom = (stickyStyle === 'absolute' ? 0 : window.innerHeight - containerBottom) + bottomOffset;
24669
- var stickyCssStyle = {};
24670
-
24671
- if (newStickyState) {
24672
- stickyCssStyle = __assign$2(__assign$2(__assign$2(__assign$2({
24673
- transform: 'translateZ(0)',
24674
- WebkitTransform: 'translateZ(0)',
24675
- position: stickyStyle === 'absolute' ? 'absolute' : 'fixed',
24676
- zIndex: zIndex
24677
- }, isTopSticky ? {
24678
- top: topFollowDifference > 0 ? cssTop : cssTop + topFollowDifference
24679
- } : {}), isBottomSticky ? {
24680
- bottom: bottomFollowDifference > 0 ? cssBottom : cssBottom + bottomFollowDifference
24681
- } : {}), {
24682
- left: placeholderClientRect.left,
24683
- width: placeholderClientRect.width
24684
- }), userSetStickyCssStyle || {});
24685
- }
24686
-
24687
- onTopChange === null || onTopChange === void 0 ? void 0 : onTopChange(Math.max(0, contentClientRect.top - containerTop - topOffset));
24688
- setIsSticky(newStickyState);
24689
- setStickyStateStyle(stickyCssStyle);
24690
-
24691
- if (newStickyState !== wasStickyRef.current) {
24692
- onStickyStateChange && onStickyStateChange({
24693
- isTopSticky: isTopSticky,
24694
- isBottomSticky: isBottomSticky,
24695
- isSticky: newStickyState,
24696
- wasSticky: wasStickyRef.current
24697
- });
24698
- }
24699
- }, [position, topOffset, bottomOffset, followOffset, zIndex, stickyStyle, onStickyStateChange, onTopChange, userSetStickyCssStyle]);
24700
- var recalculatePosition = React.useCallback(function () {
24701
- if (framePendingRef.current) {
24702
- return;
24703
- }
24704
-
24705
- execRAF(function () {
24706
- framePendingRef.current = false;
24707
-
24708
- if (containerRef.current) {
24709
- var _a = containerRef.current.getBoundingClientRect(),
24710
- top_1 = _a.top,
24711
- bottom = _a.bottom;
24712
-
24713
- containerEventHandler({
24714
- followTop: top_1,
24715
- followBottom: bottom
24716
- });
24717
- }
24718
- });
24719
- framePendingRef.current = true;
24720
- }, [containerEventHandler]);
24721
- React.useEffect(function () {
24722
- var containerEle = getActualContainer(getContainer);
24723
- containerRef.current = containerEle || document.body;
24724
- var eventTarget = getScrollContainer ? getActualContainer(getScrollContainer) : window;
24725
- if (!eventTarget) return;
24726
- scrollContainerRef.current = eventTarget;
24727
-
24728
- var attachEventListeners = function attachEventListeners(target) {
24729
- target.addEventListener('scroll', recalculatePosition);
24730
- };
24731
-
24732
- var removeEventListeners = function removeEventListeners(target) {
24733
- target.removeEventListener('scroll', recalculatePosition);
24734
- };
24735
-
24736
- attachEventListeners(eventTarget);
24737
- recalculatePosition();
24738
- return function () {
24739
- removeEventListeners(eventTarget);
24740
- };
24741
- }, [getContainer, getScrollContainer, recalculatePosition]);
24742
- React.useEffect(function () {
24743
- if (placeholderRef.current) {
24744
- // 当元素吸顶时,默认有一个占位的元素占住该元素的位置,避免布局产生抖动
24745
- // @en When an element is sticky to the top, a placeholder element occupies the element's position by default to avoid jitter in the layout
24746
- placeholderRef.current.style.height = (isStickyRef.current ? contentCalculateHeightRef.current : 0) + "px";
24747
- }
24748
- }, [isSticky, wasSticky]);
24749
- React.useImperativeHandle(ref, function () {
24750
- return {
24751
- dom: contentRef.current,
24752
- recalculatePosition: recalculatePosition
24753
- };
24754
- }, [recalculatePosition]);
24755
- var computedStyle = React.useMemo(function () {
24756
- return __assign$2(__assign$2({}, style || {}), stickyStateStyle);
24757
- }, [stickyStateStyle, style]);
24758
-
24759
- function renderSticky(prefixCls) {
24760
- return /*#__PURE__*/React__default["default"].createElement("div", {
24761
- className: cls(prefixCls + "-sticky", className),
24762
- ref: contentRef,
24763
- style: computedStyle
24764
- }, children);
24765
- }
24766
-
24767
- return /*#__PURE__*/React__default["default"].createElement(ContextLayout, null, function (_a) {
24768
- var prefixCls = _a.prefixCls;
24769
- return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("div", {
24770
- ref: placeholderRef
24771
- }), portalWhenSticky && isSticky ? /*#__PURE__*/React__default["default"].createElement(Portal, {
24772
- getContainer: getPortalContainer
24773
- }, renderSticky(prefixCls)) : renderSticky(prefixCls));
24774
- });
24775
- });
24776
-
24777
25503
  function renderAction(_a) {
24778
25504
  var action = _a.action,
24779
25505
  prefixCls = _a.prefixCls,
@@ -27489,29 +28215,31 @@
27489
28215
 
27490
28216
  var index = componentWrapper(Toast, methodsGenerator(ToastWithGlobalContext));
27491
28217
 
27492
- exports.ActionSheet = index$n;
27493
- exports.Avatar = index$m;
28218
+ exports.ActionSheet = index$o;
28219
+ exports.Avatar = index$n;
27494
28220
  exports.Badge = Badge;
27495
28221
  exports.Button = Button;
27496
28222
  exports.Carousel = Carousel;
27497
- exports.Cell = index$l;
28223
+ exports.Cell = index$m;
27498
28224
  exports.Checkbox = Checkbox;
27499
28225
  exports.CircleProgress = CircleProgress;
27500
- exports.Collapse = index$k;
28226
+ exports.Collapse = index$l;
27501
28227
  exports.ContextProvider = ContextProvider;
27502
28228
  exports.CountDown = CountDown;
27503
- exports.DatePicker = index$j;
27504
- exports.Dialog = index$i;
28229
+ exports.DatePicker = index$k;
28230
+ exports.Dialog = index$j;
27505
28231
  exports.Divider = Divider;
27506
28232
  exports.Dropdown = Dropdown$1;
27507
28233
  exports.DropdownMenu = DropdownMenu;
27508
28234
  exports.Ellipsis = Ellipsis;
27509
- exports.Form = index$g;
28235
+ exports.Form = index$h;
27510
28236
  exports.Grid = Grid;
27511
28237
  exports.Image = BaseImage;
27512
- exports.ImagePicker = index$a;
27513
- exports.ImagePreview = index$9;
27514
- exports.Input = index$f;
28238
+ exports.ImagePicker = index$b;
28239
+ exports.ImagePreview = index$a;
28240
+ exports.IndexBar = index$9;
28241
+ exports.Input = index$g;
28242
+ exports.Keyboard = Keyboard;
27515
28243
  exports.LoadMore = LoadMore;
27516
28244
  exports.Loading = Loading;
27517
28245
  exports.Masking = Masking$1;
@@ -27527,11 +28255,11 @@
27527
28255
  exports.Portal = Portal;
27528
28256
  exports.Progress = Progress;
27529
28257
  exports.PullRefresh = PullRefresh;
27530
- exports.Radio = index$d;
27531
- exports.Rate = index$c;
28258
+ exports.Radio = index$e;
28259
+ exports.Rate = index$d;
27532
28260
  exports.SearchBar = SearchBar;
27533
28261
  exports.ShowMonitor = ShowMonitor;
27534
- exports.Slider = index$b;
28262
+ exports.Slider = index$c;
27535
28263
  exports.Stepper = index$5;
27536
28264
  exports.Steps = index$4;
27537
28265
  exports.Sticky = Sticky;
@@ -27541,7 +28269,7 @@
27541
28269
  exports.TabBar = index$2;
27542
28270
  exports.Tabs = Tabs;
27543
28271
  exports.Tag = index$1;
27544
- exports.Textarea = index$e;
28272
+ exports.Textarea = index$f;
27545
28273
  exports.Toast = index;
27546
28274
  exports.Transition = Transition;
27547
28275