@arco-design/mobile-react 2.30.9 → 2.30.10

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 (39) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/README.en-US.md +70 -2
  3. package/README.md +69 -2
  4. package/cjs/carousel/index.js +3 -0
  5. package/cjs/picker/index.js +3 -2
  6. package/cjs/picker/type.d.ts +1 -1
  7. package/cjs/picker-view/components/cascader.d.ts +1 -0
  8. package/cjs/picker-view/components/cascader.js +8 -1
  9. package/cjs/picker-view/components/picker-cell.d.ts +1 -0
  10. package/cjs/picker-view/components/picker-cell.js +6 -1
  11. package/cjs/picker-view/index.d.ts +6 -1
  12. package/cjs/picker-view/index.js +25 -13
  13. package/cjs/tabs/tab-cell.js +54 -29
  14. package/cjs/tabs/type.d.ts +5 -0
  15. package/dist/index.js +102 -48
  16. package/dist/index.min.js +1 -1
  17. package/esm/carousel/index.js +3 -0
  18. package/esm/picker/index.js +3 -2
  19. package/esm/picker/type.d.ts +1 -1
  20. package/esm/picker-view/components/cascader.d.ts +1 -0
  21. package/esm/picker-view/components/cascader.js +8 -1
  22. package/esm/picker-view/components/picker-cell.d.ts +1 -0
  23. package/esm/picker-view/components/picker-cell.js +6 -1
  24. package/esm/picker-view/index.d.ts +6 -1
  25. package/esm/picker-view/index.js +26 -13
  26. package/esm/tabs/tab-cell.js +55 -29
  27. package/esm/tabs/type.d.ts +5 -0
  28. package/package.json +3 -3
  29. package/umd/carousel/index.js +3 -0
  30. package/umd/picker/index.js +3 -2
  31. package/umd/picker/type.d.ts +1 -1
  32. package/umd/picker-view/components/cascader.d.ts +1 -0
  33. package/umd/picker-view/components/cascader.js +8 -1
  34. package/umd/picker-view/components/picker-cell.d.ts +1 -0
  35. package/umd/picker-view/components/picker-cell.js +6 -1
  36. package/umd/picker-view/index.d.ts +6 -1
  37. package/umd/picker-view/index.js +25 -13
  38. package/umd/tabs/tab-cell.js +54 -29
  39. package/umd/tabs/type.d.ts +5 -0
package/dist/index.js CHANGED
@@ -126,7 +126,7 @@
126
126
  * ```
127
127
  */
128
128
 
129
- function isArray(obj) {
129
+ function isArray$1(obj) {
130
130
  return opt.call(obj) === '[object Array]';
131
131
  }
132
132
  /**
@@ -237,7 +237,7 @@
237
237
  */
238
238
 
239
239
  function isEmptyArray(obj) {
240
- return isArray(obj) && !(obj === null || obj === void 0 ? void 0 : obj.length);
240
+ return isArray$1(obj) && !(obj === null || obj === void 0 ? void 0 : obj.length);
241
241
  }
242
242
  /**
243
243
  * 深比较两个对象是否相等
@@ -312,7 +312,7 @@
312
312
 
313
313
  if (isString(v)) {
314
314
  classNames.push(v);
315
- } else if (isArray(v)) {
315
+ } else if (isArray$1(v)) {
316
316
  classNames = classNames.concat(v);
317
317
  } else if (isObject$2(v)) {
318
318
  Object.keys(v).forEach(function (k) {
@@ -3652,7 +3652,7 @@
3652
3652
  Object.keys(this.rules).forEach(function (key) {
3653
3653
  var spPromiseGroup = [];
3654
3654
 
3655
- if (isArray(_this.rules[key])) {
3655
+ if (isArray$1(_this.rules[key])) {
3656
3656
  for (var i = 0; i < _this.rules[key].length; i++) {
3657
3657
  var rule = _this.rules[key][i];
3658
3658
 
@@ -5132,14 +5132,18 @@
5132
5132
  return tabs.length < overflowThreshold ? tabBarArrange : 'start';
5133
5133
  }),
5134
5134
  originArrange = _d[0],
5135
- setOriginArrange = _d[1]; // 默认tab小于overflowThreshold个时不开启加载前隐藏,大于overflowThreshold个时开启
5135
+ setOriginArrange = _d[1];
5136
+
5137
+ var _e = React.useState(false),
5138
+ forceUpdate = _e[0],
5139
+ setForceUpdate = _e[1]; // 默认tab小于overflowThreshold个时不开启加载前隐藏,大于overflowThreshold个时开启
5136
5140
 
5137
5141
 
5138
- var _e = React.useState(function () {
5142
+ var _f = React.useState(function () {
5139
5143
  return hideTabBarBeforeMounted === void 0 ? tabs.length < overflowThreshold || activeIndex === 0 : !hideTabBarBeforeMounted;
5140
5144
  }),
5141
- showTab = _e[0],
5142
- setShowTab = _e[1];
5145
+ showTab = _f[0],
5146
+ setShowTab = _f[1];
5143
5147
 
5144
5148
  var isVertical = tabDirection === 'vertical';
5145
5149
  var isLine = (type || '').indexOf('line') !== -1;
@@ -5154,6 +5158,15 @@
5154
5158
  var hasDivider = tabBarHasDivider === void 0 ? isLine : tabBarHasDivider;
5155
5159
  var wrapSize = isVertical ? wrapWidth : wrapHeight;
5156
5160
  var system = useSystem();
5161
+
5162
+ var updateScrollPosition = function updateScrollPosition() {
5163
+ if (wrapSize && tabBarScrollChance !== 'none') {
5164
+ setTimeout(function () {
5165
+ scrollToCenter();
5166
+ }, tabBarScrollChance === 'after-jump' ? Math.max(transitionDuration || 0, duration || 0) : 0);
5167
+ }
5168
+ };
5169
+
5157
5170
  React.useEffect(function () {
5158
5171
  nextTick(function () {
5159
5172
  setCellOverflow(); // dom出来之后originArrange置空,交由tabBarArrange控制
@@ -5173,31 +5186,16 @@
5173
5186
  (_a = underlineRef.current) === null || _a === void 0 ? void 0 : _a.resetUnderlineStyle();
5174
5187
  });
5175
5188
  }, [activeIndex, tabs, getCellPadding('left'), getCellPadding('right'), tabBarGutter, tabDirection]);
5176
- React.useImperativeHandle(ref, function () {
5177
- return {
5178
- dom: domRef.current,
5179
- scrollTo: scrollTo,
5180
- scrollToCenter: scrollToCenter,
5181
- hasOverflow: hasOverflow,
5182
- setCaterpillarAnimate: function setCaterpillarAnimate(ratio) {
5183
- var _a;
5184
-
5185
- return (_a = underlineRef.current) === null || _a === void 0 ? void 0 : _a.setCaterpillarAnimate(ratio);
5186
- },
5187
- resetUnderlineStyle: function resetUnderlineStyle() {
5188
- var _a;
5189
-
5190
- return (_a = underlineRef.current) === null || _a === void 0 ? void 0 : _a.resetUnderlineStyle();
5191
- }
5192
- };
5193
- }, [scrollToCenter, scrollTo, hasOverflow]);
5194
5189
  React.useEffect(function () {
5195
- if (wrapSize && tabBarScrollChance !== 'none') {
5196
- setTimeout(function () {
5197
- scrollToCenter();
5198
- }, tabBarScrollChance === 'after-jump' ? Math.max(transitionDuration || 0, duration || 0) : 0);
5199
- }
5190
+ updateScrollPosition();
5200
5191
  }, [activeIndex, wrapSize]);
5192
+ React.useEffect(function () {
5193
+ var _a;
5194
+
5195
+ setCellOverflow();
5196
+ (_a = underlineRef.current) === null || _a === void 0 ? void 0 : _a.resetUnderlineStyle();
5197
+ updateScrollPosition();
5198
+ }, [forceUpdate]);
5201
5199
  React.useEffect(function () {
5202
5200
  tabBarScrollChance !== 'none' && scrollToCenter(true); // TabCell左右可滚动时,防止触发父级touchmove事件导致滚不动
5203
5201
  // @en When the TabCell can be scrolled left and right, prevent the parent touchmove event from being triggered which result in inability to scroll
@@ -5336,7 +5334,7 @@
5336
5334
  return typeof tab === 'string' ? tab : tab.title;
5337
5335
  }
5338
5336
 
5339
- function renderTabUnderline() {
5337
+ var renderTabUnderline = function renderTabUnderline() {
5340
5338
  if (!showUnderline || !isLine) {
5341
5339
  return null;
5342
5340
  }
@@ -5367,7 +5365,7 @@
5367
5365
  getTabCenterLeft: getTabCenterLeft,
5368
5366
  getTabRect: getTabRect
5369
5367
  }, lineProps));
5370
- }
5368
+ };
5371
5369
 
5372
5370
  var cellInner = /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, tabs.map(function (tab, index) {
5373
5371
  return /*#__PURE__*/React__default["default"].createElement("div", {
@@ -5409,6 +5407,34 @@
5409
5407
  height: '100%'
5410
5408
  }
5411
5409
  }) : null);
5410
+
5411
+ var _updateLayout = function updateLayout() {
5412
+ setForceUpdate(function (val) {
5413
+ return !val;
5414
+ });
5415
+ };
5416
+
5417
+ React.useImperativeHandle(ref, function () {
5418
+ return {
5419
+ dom: domRef.current,
5420
+ scrollTo: scrollTo,
5421
+ scrollToCenter: scrollToCenter,
5422
+ hasOverflow: hasOverflow,
5423
+ setCaterpillarAnimate: function setCaterpillarAnimate(ratio) {
5424
+ var _a;
5425
+
5426
+ return (_a = underlineRef.current) === null || _a === void 0 ? void 0 : _a.setCaterpillarAnimate(ratio);
5427
+ },
5428
+ resetUnderlineStyle: function resetUnderlineStyle() {
5429
+ var _a;
5430
+
5431
+ return (_a = underlineRef.current) === null || _a === void 0 ? void 0 : _a.resetUnderlineStyle();
5432
+ },
5433
+ updateLayout: function updateLayout() {
5434
+ return _updateLayout();
5435
+ }
5436
+ };
5437
+ }, [scrollToCenter, scrollTo, hasOverflow]);
5412
5438
  return /*#__PURE__*/React__default["default"].createElement("div", {
5413
5439
  className: cls(prefix + "-container-wrap", tabDirection, "type-" + type, tabBarClass, system),
5414
5440
  style: tabBarStyle
@@ -10717,6 +10743,9 @@
10717
10743
 
10718
10744
  function getFakeChild() {
10719
10745
  if (noLoop) {
10746
+ // 循环状态从有到无时,重置 transforms
10747
+ // @en reset transforms when loop status changes to false
10748
+ setTransforms([]);
10720
10749
  return;
10721
10750
  }
10722
10751
 
@@ -12798,6 +12827,10 @@
12798
12827
  return (_a = data[currentIndex]) === null || _a === void 0 ? void 0 : _a.value;
12799
12828
  }
12800
12829
 
12830
+ function getCurrentCellData() {
12831
+ return data[currentIndex];
12832
+ }
12833
+
12801
12834
  function _clearTimer() {
12802
12835
  timeRef.current && clearTimeout(timeRef.current);
12803
12836
  timeRef.current = null;
@@ -12865,7 +12898,8 @@
12865
12898
  return {
12866
12899
  movingStatus: movingStatusRef.current,
12867
12900
  scrollToCurrentIndex: scrollToCurrentIndex,
12868
- getCurrentCellValue: getCurrentCellValue
12901
+ getCurrentCellValue: getCurrentCellValue,
12902
+ getCurrentCellData: getCurrentCellData
12869
12903
  };
12870
12904
  });
12871
12905
  return !hideEmptyCols || data && data.length ? /*#__PURE__*/React__default["default"].createElement("div", {
@@ -12916,7 +12950,8 @@
12916
12950
  return {
12917
12951
  getCellMovingStatus: getCellMovingStatus,
12918
12952
  scrollToCurrentIndex: scrollToCurrentIndex,
12919
- getAllCellsValue: getAllCellsValue
12953
+ getAllCellsValue: getAllCellsValue,
12954
+ getAllCellsData: getAllCellsData
12920
12955
  };
12921
12956
  });
12922
12957
 
@@ -12938,6 +12973,12 @@
12938
12973
  });
12939
12974
  }
12940
12975
 
12976
+ function getAllCellsData() {
12977
+ return pickerCellsRef.current.map(function (cell) {
12978
+ return cell.getCurrentCellData();
12979
+ });
12980
+ }
12981
+
12941
12982
  function _onValueChange(value, index, newData) {
12942
12983
  var children = arrayTreeFilter(data, function (item, level) {
12943
12984
  return level <= index && item.value === value[level];
@@ -13006,6 +13047,14 @@
13006
13047
  }));
13007
13048
  });
13008
13049
 
13050
+ var isArray = function isArray(dt) {
13051
+ return dt ? Array.isArray(dt[0]) : false;
13052
+ };
13053
+
13054
+ var isStrOrNum = function isStrOrNum(dt) {
13055
+ return typeof dt[0][0] === 'string' || typeof dt[0][0] === 'number';
13056
+ };
13057
+
13009
13058
  var PickerView = /*#__PURE__*/React.forwardRef(function (props, ref) {
13010
13059
  var _a = props.className,
13011
13060
  className = _a === void 0 ? '' : _a,
@@ -13055,14 +13104,6 @@
13055
13104
  var innerData = React.useMemo(function () {
13056
13105
  var newData;
13057
13106
 
13058
- var isArray = function isArray(dt) {
13059
- return dt ? Array.isArray(dt[0]) : false;
13060
- };
13061
-
13062
- var isStrOrNum = function isStrOrNum(dt) {
13063
- return typeof dt[0][0] === 'string' || typeof dt[0][0] === 'number';
13064
- };
13065
-
13066
13107
  if (isArray(data)) {
13067
13108
  if (isStrOrNum(data)) {
13068
13109
  newData = data.map(function (item) {
@@ -13096,6 +13137,17 @@
13096
13137
  });
13097
13138
  };
13098
13139
 
13140
+ var getAllColumnData = function getAllColumnData() {
13141
+ var _a;
13142
+
13143
+ var curValues = cascade ? ((_a = cascaderRef.current) === null || _a === void 0 ? void 0 : _a.getAllCellsData()) || [] : pickerCellsRef.current.map(function (cell) {
13144
+ return cell.getCurrentCellData();
13145
+ });
13146
+ return curValues.filter(function (v) {
13147
+ return v !== undefined;
13148
+ });
13149
+ };
13150
+
13099
13151
  function getColumnValue(index) {
13100
13152
  if (index === void 0) {
13101
13153
  index = 0;
@@ -13133,7 +13185,8 @@
13133
13185
  getColumnValue: getColumnValue,
13134
13186
  updateLayout: updateLayout,
13135
13187
  resetValue: resetValue,
13136
- scrollToCurrentIndex: scrollToCurrentIndex
13188
+ scrollToCurrentIndex: scrollToCurrentIndex,
13189
+ getAllColumnData: getAllColumnData
13137
13190
  };
13138
13191
  });
13139
13192
 
@@ -13334,12 +13387,13 @@
13334
13387
 
13335
13388
  (_a = pickerViewRef.current) === null || _a === void 0 ? void 0 : _a.scrollToCurrentIndex();
13336
13389
  nextTick(function () {
13337
- var _a;
13390
+ var _a, _b;
13338
13391
 
13339
13392
  var val = ((_a = pickerViewRef.current) === null || _a === void 0 ? void 0 : _a.getAllColumnValues()) || scrollValueRef.current || [];
13393
+ var selectedData = ((_b = pickerViewRef.current) === null || _b === void 0 ? void 0 : _b.getAllColumnData()) || [];
13340
13394
 
13341
13395
  if (onOk) {
13342
- onOk(val);
13396
+ onOk(val, selectedData);
13343
13397
  }
13344
13398
 
13345
13399
  if (onChange) {
@@ -14457,7 +14511,7 @@
14457
14511
  * */
14458
14512
 
14459
14513
  function isCascadeArray(options) {
14460
- return typeof options[0] === 'object' && !isArray(options[0]);
14514
+ return typeof options[0] === 'object' && !isArray$1(options[0]);
14461
14515
  }
14462
14516
  /**
14463
14517
  * 格式化传入的数组
@@ -27341,7 +27395,7 @@
27341
27395
  });
27342
27396
 
27343
27397
  var getWidth = function getWidth(idx) {
27344
- if (isArray(width)) {
27398
+ if (isArray$1(width)) {
27345
27399
  return width[idx];
27346
27400
  }
27347
27401