@arco-design/mobile-react 2.22.0 → 2.22.2

package/cjs/tabs/style/css/index.css

@@ -386,8 +386,8 @@
 .arco-tab-cell.vertical:not(.custom).line.active.system-android,
 .arco-tab-cell.vertical:not(.custom).line-divide.active.system-android {
   font-weight: 400;
-  -webkit-text-stroke: 0.3PX #165dff;
-  text-stroke: 0.3PX #165dff;
+  -webkit-text-stroke: 0.3PX currentColor;
+  text-stroke: 0.3PX currentColor;
 }
 .arco-tab-cell.vertical:not(.custom).card {
   color:  #165dff ;
@@ -401,8 +401,8 @@
 .arco-tab-cell.vertical:not(.custom).card.active.android,
 .arco-tab-cell.vertical:not(.custom).card.active.system-android {
   font-weight: 400;
-  -webkit-text-stroke: 0.3PX #ffffff;
-  text-stroke: 0.3PX #ffffff;
+  -webkit-text-stroke: 0.3PX currentColor;
+  text-stroke: 0.3PX currentColor;
 }
 .arco-tab-cell.vertical:not(.custom).card:not(:last-child) {
   border-right: 1PX solid #165dff ;
@@ -444,8 +444,8 @@
 .arco-tab-cell.vertical:not(.custom).tag.active.system-android,
 .arco-tab-cell.vertical:not(.custom).tag-divide.active.system-android {
   font-weight: 400;
-  -webkit-text-stroke: 0.3PX #ffffff;
-  text-stroke: 0.3PX #ffffff;
+  -webkit-text-stroke: 0.3PX currentColor;
+  text-stroke: 0.3PX currentColor;
 }
 .arco-tab-cell.horizontal {
   height:  1.08rem ;
@@ -458,8 +458,8 @@
 .arco-tab-cell.horizontal.active.android,
 .arco-tab-cell.horizontal.active.system-android {
   font-weight: 400;
-  -webkit-text-stroke: 0.3PX #165dff;
-  text-stroke: 0.3PX #165dff;
+  -webkit-text-stroke: 0.3PX currentColor;
+  text-stroke: 0.3PX currentColor;
 }
 .arco-tab-pane-container.mode-swipe {
   display: -webkit-box;

package/cjs/tabs/style/index.less

@@ -322,7 +322,7 @@
             &.line-divide {
 
                 &.active {
-                    .text-medium-var(tabs-tab-bar-line-active-color);
+                    .text-medium();
                     .use-var(color, tabs-tab-bar-line-active-color);
                 }
             }
@@ -333,7 +333,7 @@
                 &.active {
                     .use-var(background, tabs-tab-bar-card-color);
                     .use-var(color, tabs-tab-bar-card-text-color);
-                    .text-medium-var(tabs-tab-bar-card-text-color);
+                    .text-medium();
                 }
 
                 &:not(:last-child) {
@@ -374,7 +374,7 @@
                 &.active {
                     .use-var(background, tabs-tab-bar-tag-active-background);
                     .use-var(color, tabs-tab-bar-tag-active-text-color);
-                    .text-medium-var(tabs-tab-bar-tag-active-text-color);
+                    .text-medium();
                 }
             }
         }
@@ -384,7 +384,7 @@
         .use-var(height, tabs-tab-bar-horizontal-height);
 
         &.active {
-            .text-medium-var(tabs-tab-bar-line-active-color);
+            .text-medium();
             .use-var(color, tabs-tab-bar-line-active-color);
         }
     }

package/dist/index.js

@@ -8061,6 +8061,7 @@
       var touchStoppedRef = React.useRef(false);
       var changeFromRef = React.useRef('');
       var touchMoveBarScrollRef = React.useRef(false);
+      var system = useSystem();
       var allPanes = getAllPanes();
       var tabDirection = ['top', 'bottom'].indexOf(tabBarPosition) !== -1 ? 'vertical' : 'horizontal';
       var canSwipe = mode === 'swipe' && !disabled && swipeable && tabDirection === 'vertical' && tabs.length > 1;
@@ -8173,10 +8174,10 @@
 
         var evt = e.changedTouches[0];
         var touchMoveX = evt.clientX || 0;
-        var touchMoveY = evt.clientY || 0; // bugfix: 兼容safari在右滑返回上一页时clientX为负值的情况
+        var touchMoveY = evt.clientY || 0; // bugfix: 兼容safari在右滑返回上一页时clientX为负值的情况，安卓有折叠屏，触点会有超出屏幕(clientX < 0)的情况，因此这里限定ios系统
         // @en bugfix: bugfix: Compatible with the case in safari where clientX is negative when swiping right back to the previous page
 
-        var posDisX = touchMoveX < 0 ? 0 : touchMoveX - touchStartXRef.current;
+        var posDisX = system === 'ios' && touchMoveX < 0 ? 0 : touchMoveX - touchStartXRef.current;
         var posDisY = touchMoveY - touchStartYRef.current;
         var absDisX = Math.abs(posDisX);
         var absDisY = Math.abs(posDisY);
@@ -14681,7 +14682,7 @@
     });
 
     /*!
-    * @arco-design/transformable v1.0.1
+    * @arco-design/transformable v1.0.2
     * (c) 2022 ludan.kibbon
     */
     function _defineProperty(obj, key, value) {
@@ -20831,6 +20832,7 @@
 
       var animationRef = React.useRef(0);
       var className = props.className,
+          style = props.style,
           children = props.children,
           _d = props.loadingText,
           loadingText = _d === void 0 ? /*#__PURE__*/React__default["default"].createElement("div", {
@@ -21006,9 +21008,9 @@
           'is-disabled': disabled || !touching && useHideAsNestedScroll
         }),
         ref: domRef,
-        style: contentHeight > 0 ? {
+        style: contentHeight > 0 ? __assign({
           height: contentHeight
-        } : {}
+        }, style || {}) : style
       }, /*#__PURE__*/React__default["default"].createElement("div", {
         className: cls(prefixCls + "-pull-refresh-content-wrapper")
       }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -21038,6 +21040,7 @@
           locale = _c === void 0 ? defaultLocale : _c;
 
       var className = props.className,
+          style = props.style,
           children = props.children,
           _d = props.loosingText,
           loosingText = _d === void 0 ? /*#__PURE__*/React__default["default"].createElement("div", {
@@ -21272,6 +21275,7 @@
         className: cls(prefixCls + "-pull-refresh all-border-box is-android", className, {
           'is-disabled': (disabled || !touching && useHideAsNestedScroll) && status !== PullRefreshStatus.Loading
         }),
+        style: style,
         ref: domRef
       }, /*#__PURE__*/React__default["default"].createElement("div", {
         className: cls(prefixCls + "-pull-refresh-place"),
@@ -22741,9 +22745,11 @@
           _b = _a.index,
           index = _b === void 0 ? 0 : _b,
           contextStatus = _a.status,
+          contextAlign = _a.align,
           changeIndex = _a.changeIndex;
 
       var status = props.status || contextStatus;
+      var align = props.align || contextAlign;
       var domRef = React.useRef(null);
       React.useImperativeHandle(ref, function () {
         return {
@@ -22782,12 +22788,12 @@
         var prefixCls = _a.prefixCls;
         return /*#__PURE__*/React__default["default"].createElement("div", {
           ref: domRef,
-          className: cls(prefixCls + "-steps-item", currentStatus, direction, iconType),
+          className: cls(prefixCls + "-steps-item", prefixCls + "-steps-item-align-" + align, currentStatus, direction, iconType),
           onClick: function onClick() {
             return changeIndex(index);
           }
         }, /*#__PURE__*/React__default["default"].createElement("div", {
-          className: cls(prefixCls + "-steps-item-tail", currentStatus + "-tail-color-with-config")
+          className: cls(prefixCls + "-steps-item-tail", prefixCls + "-steps-item-tail-status-" + currentStatus, prefixCls + "-steps-item-tail-align-" + align, currentStatus + "-tail-color-with-config")
         }), icon ? /*#__PURE__*/React__default["default"].createElement("div", {
           className: cls(prefixCls + "-steps-item-custom-icon", currentStatus + "-custom-icon-bg-color-with-config")
         }, icon) : /*#__PURE__*/React__default["default"].createElement("div", {
@@ -22795,7 +22801,7 @@
         }, iconType === 'number' ? renderNumIcon(prefixCls) : /*#__PURE__*/React__default["default"].createElement("span", {
           className: cls(prefixCls + "-steps-item-icon-dot")
         })), title || description ? /*#__PURE__*/React__default["default"].createElement("div", {
-          className: cls(prefixCls + "-steps-item-content")
+          className: cls(prefixCls + "-steps-item-content", prefixCls + "-steps-item-content-align-" + align)
         }, title ? /*#__PURE__*/React__default["default"].createElement("div", {
           className: cls(prefixCls + "-steps-item-title", currentStatus + "-title-color-with-config")
         }, title) : null, description ? /*#__PURE__*/React__default["default"].createElement("div", {
@@ -22814,6 +22820,7 @@
           children = props.children,
           _b = props.direction,
           direction = _b === void 0 ? 'horizontal' : _b,
+          userSetAlign = props.align,
           _c = props.iconType,
           iconType = _c === void 0 ? 'number' : _c,
           current = props.current,
@@ -22824,6 +22831,8 @@
           items = props.items,
           onClick = props.onClick,
           onChange = props.onChange;
+      var defaultAlign = direction === 'vertical' ? 'start' : 'center';
+      var align = userSetAlign !== void 0 ? userSetAlign : defaultAlign;
 
       var _f = React.useState(Number(defaultIndex)),
           innerIndex = _f[0],
@@ -22859,11 +22868,12 @@
             direction: direction,
             index: index,
             status: activeIndex === index ? status : void 0,
+            align: align,
             changeIndex: changeIndex
           },
           key: index
         }, child);
-      }, [iconType, activeIndex, direction]);
+      }, [iconType, activeIndex, direction, align]);
       return /*#__PURE__*/React__default["default"].createElement(ContextLayout, null, function (_a) {
         var prefixCls = _a.prefixCls;
         return /*#__PURE__*/React__default["default"].createElement("div", {