taro-ui 3.2.1 → 3.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.esm.js CHANGED
@@ -1415,13 +1415,15 @@ function delay(delayTime) {
1415
1415
  function delayQuerySelector(selectorStr, delayTime) {
1416
1416
  if (delayTime === void 0) { delayTime = 500; }
1417
1417
  return new Promise(function (resolve) {
1418
- var selector = Taro.createSelectorQuery();
1419
- delay(delayTime).then(function () {
1420
- selector
1421
- .select(selectorStr)
1422
- .boundingClientRect()
1423
- .exec(function (res) {
1424
- resolve(res);
1418
+ Taro.nextTick(function () {
1419
+ var selector = Taro.createSelectorQuery();
1420
+ delay(delayTime).then(function () {
1421
+ selector
1422
+ .select(selectorStr)
1423
+ .boundingClientRect()
1424
+ .exec(function (res) {
1425
+ resolve(res);
1426
+ });
1425
1427
  });
1426
1428
  });
1427
1429
  });
@@ -1564,13 +1566,7 @@ function handleTouchScroll(flag) {
1564
1566
  function pxTransform(size) {
1565
1567
  if (!size)
1566
1568
  return '';
1567
- var designWidth = 750;
1568
- var deviceRatio = {
1569
- 640: 2.34 / 2,
1570
- 750: 1,
1571
- 828: 1.81 / 2
1572
- };
1573
- return "".concat(size / deviceRatio[designWidth], "rpx");
1569
+ return Taro.pxTransform(size);
1574
1570
  }
1575
1571
  function objectToString$2(style) {
1576
1572
  if (style && typeof style === 'object') {
@@ -1600,18 +1596,6 @@ function mergeStyle(style1, style2) {
1600
1596
  return Object.assign({}, style1, style2);
1601
1597
  }
1602
1598
  return objectToString$2(style1) + objectToString$2(style2);
1603
- }
1604
- /**
1605
- * 自定义验证器,用于验证参数是否是 JSX.Element
1606
- * @param {any} props
1607
- * @param {string} propName
1608
- * @param {string} componentName
1609
- * @returns
1610
- */
1611
- function isJSXElement(props, propName, componentName) {
1612
- if (!React.isValidElement(props[propName])) {
1613
- return new Error("Invalid prop ".concat(propName, " supplied to ").concat(componentName, ". It must be a valid JSX element."));
1614
- }
1615
1599
  }
1616
1600
 
1617
1601
  var AtLoading = /** @class */ (function (_super) {
@@ -2122,16 +2106,16 @@ AtListItem.defaultProps = {
2122
2106
  iconInfo: { value: '' }
2123
2107
  };
2124
2108
  AtListItem.propTypes = {
2125
- note: isJSXElement,
2109
+ note: propTypes.oneOfType([propTypes.string, propTypes.element]),
2126
2110
  disabled: propTypes.bool,
2127
- title: isJSXElement,
2111
+ title: propTypes.oneOfType([propTypes.string, propTypes.element]),
2128
2112
  thumb: propTypes.string,
2129
2113
  onClick: propTypes.func,
2130
2114
  isSwitch: propTypes.bool,
2131
2115
  hasBorder: propTypes.bool,
2132
2116
  switchColor: propTypes.string,
2133
2117
  switchIsCheck: propTypes.bool,
2134
- extraText: isJSXElement,
2118
+ extraText: propTypes.oneOfType([propTypes.string, propTypes.element]),
2135
2119
  extraThumb: propTypes.string,
2136
2120
  onSwitchChange: propTypes.func,
2137
2121
  arrow: propTypes.oneOf(['up', 'down', 'right']),
@@ -4509,8 +4493,7 @@ var AtTabs = /** @class */ (function (_super) {
4509
4493
  transformStyle = "translate3d(-".concat(current * 100, "%, 0px, 0px)");
4510
4494
  }
4511
4495
  Object.assign(bodyStyle, {
4512
- transform: transformStyle,
4513
- '-webkit-transform': transformStyle
4496
+ transform: transformStyle
4514
4497
  });
4515
4498
  if (!animated) {
4516
4499
  bodyStyle.transition = 'unset';
@@ -5162,22 +5145,7 @@ var AtSwipeAction = /** @class */ (function (_super) {
5162
5145
  };
5163
5146
  _this.onTouchEnd = function (e) {
5164
5147
  var maxOffsetSize = _this.state.maxOffsetSize;
5165
- if (_this.moveX === -maxOffsetSize) {
5166
- _this._reset(true);
5167
- _this.handleOpened(e);
5168
- return;
5169
- }
5170
- if (_this.moveX === 0) {
5171
- _this._reset(false);
5172
- _this.handleClosed(e);
5173
- return;
5174
- }
5175
- if (_this.state._isOpened && _this.moveX < 0) {
5176
- _this._reset(false);
5177
- _this.handleClosed(e);
5178
- return;
5179
- }
5180
- if (Math.abs(_this.moveX) < maxOffsetSize * _this.moveRatio) {
5148
+ if (Math.abs(_this.moveX) < maxOffsetSize / 2) {
5181
5149
  _this._reset(false);
5182
5150
  _this.handleClosed(e);
5183
5151
  }
@@ -5189,7 +5157,7 @@ var AtSwipeAction = /** @class */ (function (_super) {
5189
5157
  _this.onChange = function (e) {
5190
5158
  _this.moveX = e.detail.x;
5191
5159
  };
5192
- var isOpened = props.isOpened, moveRatio = props.moveRatio;
5160
+ var isOpened = props.isOpened;
5193
5161
  _this.state = {
5194
5162
  componentId: uuid(),
5195
5163
  // eslint-disable-next-line no-extra-boolean-cast
@@ -5200,7 +5168,6 @@ var AtSwipeAction = /** @class */ (function (_super) {
5200
5168
  maxOffsetSize: 0
5201
5169
  };
5202
5170
  _this.moveX = _this.state.offsetSize;
5203
- _this.moveRatio = moveRatio || 0.5;
5204
5171
  return _this;
5205
5172
  }
5206
5173
  AtSwipeAction.prototype.componentDidMount = function () {
@@ -6201,7 +6168,8 @@ var AtIndexes = /** @class */ (function (_super) {
6201
6168
  _scrollTop: 0,
6202
6169
  _tipText: '',
6203
6170
  _isShowToast: false,
6204
- isWEB: Taro.getEnv() === Taro.ENV_TYPE.WEB
6171
+ isWEB: Taro.getEnv() === Taro.ENV_TYPE.WEB,
6172
+ currentIndex: -1
6205
6173
  };
6206
6174
  // 右侧导航高度
6207
6175
  _this.menuHeight = 0;
@@ -6212,6 +6180,7 @@ var AtIndexes = /** @class */ (function (_super) {
6212
6180
  // 当前索引
6213
6181
  _this.currentIndex = -1;
6214
6182
  _this.listId = isTest() ? 'indexes-list-AOTU2018' : "list-".concat(uuid());
6183
+ _this.indexMap = [];
6215
6184
  return _this;
6216
6185
  }
6217
6186
  AtIndexes.prototype.jumpTarget = function (_scrollIntoView, idx) {
@@ -6269,21 +6238,69 @@ var AtIndexes = /** @class */ (function (_super) {
6269
6238
  }
6270
6239
  };
6271
6240
  AtIndexes.prototype.initData = function () {
6272
- var _this = this;
6273
- delayQuerySelector('.at-indexes__menu').then(function (rect) {
6274
- var len = _this.props.list.length;
6275
- _this.menuHeight = rect[0].height;
6276
- _this.startTop = rect[0].top;
6277
- _this.itemHeight = Math.floor(_this.menuHeight / (len + 1));
6241
+ var _a, _b, _c, _d;
6242
+ return __awaiter(this, void 0, void 0, function () {
6243
+ var headerHeight, itemHeight, titleHeight;
6244
+ var _this = this;
6245
+ return __generator(this, function (_e) {
6246
+ switch (_e.label) {
6247
+ case 0:
6248
+ delayQuerySelector('.at-indexes__menu').then(function (rect) {
6249
+ var len = _this.props.list.length;
6250
+ _this.menuHeight = rect[0].height;
6251
+ _this.startTop = rect[0].top;
6252
+ _this.itemHeight = Math.floor(_this.menuHeight / (len + 1));
6253
+ });
6254
+ return [4 /*yield*/, delayQuerySelector('#at-indexes__top')];
6255
+ case 1:
6256
+ headerHeight = ((_b = (_a = (_e.sent())) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.height) || 0;
6257
+ return [4 /*yield*/, delayQuerySelector('.at-list__item')];
6258
+ case 2:
6259
+ itemHeight = ((_c = (_e.sent())) === null || _c === void 0 ? void 0 : _c[0].height) || 0;
6260
+ return [4 /*yield*/, delayQuerySelector('.at-indexes__list-title')];
6261
+ case 3:
6262
+ titleHeight = ((_d = (_e.sent())) === null || _d === void 0 ? void 0 : _d[0].height) || 0;
6263
+ this.indexMap = [];
6264
+ this.props.list.forEach(function (dataList, i) {
6265
+ if (i === 0) {
6266
+ _this.indexMap.push({
6267
+ key: dataList.key,
6268
+ startHeight: headerHeight,
6269
+ endHeight: dataList.items.length * itemHeight + headerHeight + titleHeight
6270
+ });
6271
+ }
6272
+ else {
6273
+ var prev = _this.indexMap[i - 1];
6274
+ _this.indexMap.push({
6275
+ key: dataList.key,
6276
+ startHeight: prev.endHeight,
6277
+ endHeight: prev.endHeight + dataList.items.length * itemHeight + titleHeight
6278
+ });
6279
+ }
6280
+ });
6281
+ return [2 /*return*/];
6282
+ }
6283
+ });
6278
6284
  });
6279
6285
  };
6280
6286
  AtIndexes.prototype.handleScroll = function (e) {
6281
6287
  if (e && e.detail) {
6288
+ var scrollTop = e.detail.scrollTop;
6282
6289
  this.setState({
6283
- _scrollTop: e.detail.scrollTop
6290
+ _scrollTop: scrollTop
6284
6291
  });
6292
+ this.getAnchorIndex(scrollTop);
6285
6293
  }
6286
6294
  };
6295
+ // 根据滚动高度,判断当前应该显示的索引值
6296
+ AtIndexes.prototype.getAnchorIndex = function (scrollTop) {
6297
+ var index = this.indexMap.findIndex(function (item) {
6298
+ return scrollTop >= item.startHeight && scrollTop < item.endHeight;
6299
+ });
6300
+ this.setState({
6301
+ currentIndex: index
6302
+ });
6303
+ };
6287
6304
  AtIndexes.prototype.UNSAFE_componentWillReceiveProps = function (nextProps) {
6288
6305
  if (nextProps.list.length !== this.props.list.length) {
6289
6306
  this.initData();
@@ -6302,13 +6319,15 @@ var AtIndexes = /** @class */ (function (_super) {
6302
6319
  AtIndexes.prototype.render = function () {
6303
6320
  var _this = this;
6304
6321
  var _a = this.props, className = _a.className, customStyle = _a.customStyle, animation = _a.animation, topKey = _a.topKey, list = _a.list;
6305
- var _b = this.state, _scrollTop = _b._scrollTop, _scrollIntoView = _b._scrollIntoView, _tipText = _b._tipText, _isShowToast = _b._isShowToast, isWEB = _b.isWEB;
6322
+ var _b = this.state, _scrollTop = _b._scrollTop, _scrollIntoView = _b._scrollIntoView, _tipText = _b._tipText, _isShowToast = _b._isShowToast, isWEB = _b.isWEB, currentIndex = _b.currentIndex;
6306
6323
  var toastStyle = { minWidth: pxTransform(100) };
6307
6324
  var rootCls = classnames('at-indexes', className);
6308
6325
  var menuList = list.map(function (dataList, i) {
6309
6326
  var key = dataList.key;
6310
6327
  var targetView = "at-indexes__list-".concat(key);
6311
- return (React.createElement(View, { className: 'at-indexes__menu-item', key: key, onClick: _this.jumpTarget.bind(_this, targetView, i + 1) }, key));
6328
+ return (React.createElement(View, { className: classnames('at-indexes__menu-item', {
6329
+ 'at-indexes__menu-item--active': currentIndex === i
6330
+ }), key: key, onClick: _this.jumpTarget.bind(_this, targetView, i + 1) }, key));
6312
6331
  });
6313
6332
  var indexesList = list.map(function (dataList) { return (React.createElement(View, { id: "at-indexes__list-".concat(dataList.key), className: 'at-indexes__list', key: dataList.key },
6314
6333
  React.createElement(View, { className: 'at-indexes__list-title' }, dataList.title),