@nutui/nutui-react-taro 3.0.19-beta.1 → 3.0.19-beta.2

package/dist/cjs/packages/swipe/swipe.js

@@ -18,10 +18,10 @@ var _ts_generator = require("@swc/helpers/_/_ts_generator");
 var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 var _classnames = /*#__PURE__*/ _interop_require_default._(require("classnames"));
 var _components = require("@tarojs/components");
-var _taro = require("@tarojs/taro");
 var _usetouch = require("../../hooks/use-touch");
 var _getrect = require("../../utils/taro/get-rect");
 var _typings = require("../../utils/typings");
+var _platform = require("../../utils/taro/platform");
 var _userefstate = require("../../hooks/use-ref-state");
 var _useuuid = require("../../hooks/use-uuid");
 function preventDefault(event, isStopPropagation) {
@@ -41,9 +41,97 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
     var uid = (0, _useuuid.useUuid)();
     var leftId = "swipe-left-".concat(uid);
     var rightId = "swipe-right-".concat(uid);
-    var getWidth = function getWidth() {
+    var _$_object_spread = (0, _object_spread._)({}, defaultProps, props), children = _$_object_spread.children, className = _$_object_spread.className, style = _$_object_spread.style;
+    var root = (0, _react.useRef)();
+    var opened = (0, _react.useRef)(false);
+    var lockClick = (0, _react.useRef)(false);
+    var startOffset = (0, _react.useRef)(0);
+    var _useState = (0, _sliced_to_array._)((0, _react.useState)({
+        offset: 0,
+        dragging: false
+    }), 2), state = _useState[0], setState = _useState[1];
+    var _useRefState = (0, _sliced_to_array._)((0, _userefstate.useRefState)({
+        left: 0,
+        right: 0
+    }), 2), actionWidth = _useRefState[0], updateState = _useRefState[1];
+    var setActionWidth = (0, _react.useCallback)(function(fn) {
+        var res = fn();
+        if (res.left !== undefined) {
+            updateState((0, _object_spread_props._)((0, _object_spread._)({}, actionWidth.current), {
+                left: res.left
+            }));
+        }
+        if (res.right !== undefined) {
+            updateState((0, _object_spread_props._)((0, _object_spread._)({}, actionWidth.current), {
+                right: res.right
+            }));
+        }
+    }, [
+        actionWidth,
+        updateState
+    ]);
+    // 获取元素的时候要在页面 onReady 后，需要参考小程序的事件周期
+    (0, _react.useLayoutEffect)(function() {
+        var getWidth = function getWidth() {
+            return (0, _async_to_generator._)(function() {
+                var leftRect, rightRect;
+                return (0, _ts_generator._)(this, function(_state) {
+                    switch(_state.label){
+                        case 0:
+                            if (!leftWrapper.current) return [
+                                3,
+                                2
+                            ];
+                            return [
+                                4,
+                                (0, _getrect.getRectInMultiPlatform)(leftWrapper.current, leftId)
+                            ];
+                        case 1:
+                            leftRect = _state.sent();
+                            leftRect && setActionWidth(function(v) {
+                                return (0, _object_spread_props._)((0, _object_spread._)({}, v), {
+                                    left: leftRect.width
+                                });
+                            });
+                            _state.label = 2;
+                        case 2:
+                            if (!rightWrapper.current) return [
+                                3,
+                                4
+                            ];
+                            return [
+                                4,
+                                (0, _getrect.getRectInMultiPlatform)(rightWrapper.current, rightId)
+                            ];
+                        case 3:
+                            rightRect = _state.sent();
+                            rightRect && setActionWidth(function(v) {
+                                return (0, _object_spread_props._)((0, _object_spread._)({}, v), {
+                                    right: rightRect.width
+                                });
+                            });
+                            _state.label = 4;
+                        case 4:
+                            return [
+                                2
+                            ];
+                    }
+                });
+            })();
+        };
+        getWidth();
+    }, [
+        leftId,
+        rightId,
+        setActionWidth
+    ]);
+    var wrapperStyle = {
+        transform: "translate(".concat(state.offset).concat(!(0, _platform.harmony)() ? 'px' : '', ", 0)"),
+        transitionDuration: state.dragging ? '0s' : '.6s'
+    };
+    var onTouchStart = function onTouchStart(event) {
         return (0, _async_to_generator._)(function() {
-            var leftRect, rightRect;
+            var leftRect, rightRect, _props_onTouchStart;
             return (0, _ts_generator._)(this, function(_state) {
                 switch(_state.label){
                     case 0:
@@ -81,6 +169,12 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
                         });
                         _state.label = 4;
                     case 4:
+                        if (!props.disabled) {
+                            ;
+                            startOffset.current = state.offset;
+                            touch.start(event);
+                            (_props_onTouchStart = props.onTouchStart) === null || _props_onTouchStart === void 0 ? void 0 : _props_onTouchStart.call(props, event);
+                        }
                         return [
                             2
                         ];
@@ -88,89 +182,31 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
             });
         })();
     };
-    // 获取元素的时候要在页面 onReady 后，需要参考小程序的事件周期
-    (0, _taro.useReady)(function() {
-        (0, _taro.nextTick)(function() {
-            return getWidth();
-        });
-    });
-    var _$_object_spread = (0, _object_spread._)({}, defaultProps, props), children = _$_object_spread.children, className = _$_object_spread.className, style = _$_object_spread.style;
-    var root = (0, _react.useRef)();
-    var opened = (0, _react.useRef)(false);
-    var lockClick = (0, _react.useRef)(false);
-    var startOffset = (0, _react.useRef)(0);
-    var _useState = (0, _sliced_to_array._)((0, _react.useState)({
-        offset: 0,
-        dragging: false
-    }), 2), state = _useState[0], setState = _useState[1];
-    var _useRefState = (0, _sliced_to_array._)((0, _userefstate.useRefState)({
-        left: 0,
-        right: 0
-    }), 2), actionWidth = _useRefState[0], updateState = _useRefState[1];
-    var setActionWidth = function setActionWidth(fn) {
-        var res = fn();
-        if (res.left !== undefined) {
-            updateState((0, _object_spread_props._)((0, _object_spread._)({}, actionWidth.current), {
-                left: res.left
-            }));
-        }
-        if (res.right !== undefined) {
-            updateState((0, _object_spread_props._)((0, _object_spread._)({}, actionWidth.current), {
-                right: res.right
-            }));
-        }
-    };
-    var wrapperStyle = (0, _react.useMemo)(function() {
-        return {
-            transform: "translate(".concat(state.offset, "px, 0)"),
-            transitionDuration: state.dragging ? '0.01s' : '.6s'
-        };
-    }, [
-        state.offset,
-        state.dragging
-    ]);
-    var onTouchStart = function onTouchStart(event) {
-        return (0, _async_to_generator._)(function() {
-            var _props_onTouchStart;
-            return (0, _ts_generator._)(this, function(_state) {
-                if (!props.disabled) {
-                    ;
-                    getWidth();
-                    startOffset.current = state.offset;
-                    touch.start(event);
-                    (_props_onTouchStart = props.onTouchStart) === null || _props_onTouchStart === void 0 ? void 0 : _props_onTouchStart.call(props, event);
-                }
-                return [
-                    2
-                ];
-            });
-        })();
-    };
     var onTouchMove = function onTouchMove(event) {
         var _props_onTouchMove;
-        if (props.disabled) return;
+        if (props.disabled) {
+            return;
+        }
         touch.move(event);
         (_props_onTouchMove = props.onTouchMove) === null || _props_onTouchMove === void 0 ? void 0 : _props_onTouchMove.call(props, event);
         if (touch.isHorizontal()) {
             lockClick.current = true;
+            var newState = (0, _object_spread_props._)((0, _object_spread._)({}, state), {
+                dragging: true
+            });
             var isEdge = !opened || touch.deltaX.current * startOffset.current < 0;
             if (isEdge) {
                 preventDefault(event, true);
             }
-            var offset = rangeCalculation(touch.deltaX.current + startOffset.current, -actionWidth.current.right || 0, actionWidth.current.left || 0);
-            setState(function(prevState) {
-                return (0, _object_spread_props._)((0, _object_spread._)({}, prevState), {
-                    dragging: true,
-                    offset: Number(offset) || 0
-                });
-            });
+            newState.offset = rangeCalculation(touch.deltaX.current + startOffset.current, -actionWidth.current.right || 0, actionWidth.current.left || 0);
+            setState(newState);
         }
     };
     var onTouchEnd = function onTouchEnd(event) {
         if (state.dragging) {
             var _props_onTouchEnd;
-            setState(function(prevState) {
-                return (0, _object_spread_props._)((0, _object_spread._)({}, prevState), {
+            setState(function(v) {
+                return (0, _object_spread_props._)((0, _object_spread._)({}, v), {
                     dragging: false
                 });
             });
@@ -201,13 +237,13 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
             name: name,
             position: side
         });
-        setState(function(prevState) {
-            return (0, _object_spread_props._)((0, _object_spread._)({}, prevState), {
+        setState(function(v) {
+            return (0, _object_spread_props._)((0, _object_spread._)({}, v), {
                 offset: Number(offset) || 0
             });
         });
     };
-    var close = (0, _react.useCallback)(function(position) {
+    var close = function close(position) {
         if (opened.current) {
             var _props_onClose;
             opened.current = false;
@@ -216,14 +252,12 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
                 position: position || 'left'
             });
         }
-        setState(function(prevState) {
-            return (0, _object_spread_props._)((0, _object_spread._)({}, prevState), {
+        setState(function(v) {
+            return (0, _object_spread_props._)((0, _object_spread._)({}, v), {
                 offset: 0
             });
         });
-    }, [
-        props
-    ]);
+    };
     var rangeCalculation = function rangeCalculation(num, min, max) {
         return Math.min(Math.max(Number(num), Number(min)), Number(max));
     };
@@ -260,7 +294,7 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
         };
     });
     (0, _react.useEffect)(function() {
-        // 并没有生效
+        if ((0, _platform.harmony)()) return;
         var handler = function handler(event) {
             var targets = [
                 root
@@ -277,9 +311,7 @@ var Swipe = /*#__PURE__*/ (0, _react.forwardRef)(function(props, instanceRef) {
         return function() {
             document.removeEventListener('touchstart', handler);
         };
-    }, [
-        close
-    ]);
+    }, []);
     return /*#__PURE__*/ _react.default.createElement(_components.View, {
         ref: root,
         className: (0, _classnames.default)(classPrefix, className),

package/dist/cjs/packages/swiper/style/style.harmony.css

@@ -82,9 +82,7 @@
 
 .nut-indicator-white .nut-indicator-dot, .nut-indicator-white .nut-indicator-line {
   position: relative;
-  /* #ifndef dynamic*/
   box-sizing: content-box;
-  /* #endif */
   background: rgba(255, 255, 255, 0.4);
   opacity: 1;
 }

package/dist/cjs/packages/switch/style/style.css

@@ -5,12 +5,7 @@
 .nut-switch {
   cursor: pointer;
   position: relative;
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   flex-direction: row;
   align-items: center;
   min-width: var(--nutui-switch-width, 46px);
@@ -65,12 +60,7 @@
   border-radius: 2px;
 }
 .nut-switch-label {
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   align-items: center;
   height: 100%;
   white-space: nowrap;

package/dist/cjs/packages/switch/style/style.harmony.css

@@ -5,12 +5,7 @@
 .nut-switch {
   cursor: pointer;
   position: relative;
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   flex-direction: row;
   align-items: center;
   min-width: var(--nutui-switch-width, 46px);
@@ -65,12 +60,7 @@
   border-radius: 2px;
 }
 .nut-switch-label {
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   align-items: center;
   height: 100%;
   white-space: nowrap;

package/dist/cjs/packages/switch/style/switch.scss

@@ -1,12 +1,7 @@
 .nut-switch {
   cursor: pointer;
   position: relative;
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   flex-direction: row;
   align-items: center;
   min-width: $switch-width;
@@ -63,12 +58,7 @@
   }
 
   &-label {
-    /* #ifdef dynamic*/
-    display: flex;
-    /* #endif */
-    /* #ifndef dynamic*/
     display: inline-flex;
-    /* #endif */
     align-items: center;
     height: 100%;
     white-space: nowrap;

package/dist/cjs/packages/switch/style-jmapp/style.css

@@ -5,12 +5,7 @@
 .nut-switch {
   cursor: pointer;
   position: relative;
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   flex-direction: row;
   align-items: center;
   min-width: var(--nutui-switch-width, 40px);
@@ -65,12 +60,7 @@
   border-radius: 2px;
 }
 .nut-switch-label {
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   align-items: center;
   height: 100%;
   white-space: nowrap;

package/dist/cjs/packages/switch/style-jmapp/switch.scss

@@ -1,12 +1,7 @@
 .nut-switch {
   cursor: pointer;
   position: relative;
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   flex-direction: row;
   align-items: center;
   min-width: $switch-width;
@@ -63,12 +58,7 @@
   }
 
   &-label {
-    /* #ifdef dynamic*/
-    display: flex;
-    /* #endif */
-    /* #ifndef dynamic*/
     display: inline-flex;
-    /* #endif */
     align-items: center;
     height: 100%;
     white-space: nowrap;

package/dist/cjs/packages/switch/style-jrkf/style.css

@@ -5,12 +5,7 @@
 .nut-switch {
   cursor: pointer;
   position: relative;
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   flex-direction: row;
   align-items: center;
   min-width: var(--nutui-switch-width, 40px);
@@ -65,12 +60,7 @@
   border-radius: 2px;
 }
 .nut-switch-label {
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   align-items: center;
   height: 100%;
   white-space: nowrap;

package/dist/cjs/packages/switch/style-jrkf/switch.scss

@@ -1,12 +1,7 @@
 .nut-switch {
   cursor: pointer;
   position: relative;
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   flex-direction: row;
   align-items: center;
   min-width: $switch-width;
@@ -63,12 +58,7 @@
   }
 
   &-label {
-    /* #ifdef dynamic*/
-    display: flex;
-    /* #endif */
-    /* #ifndef dynamic*/
     display: inline-flex;
-    /* #endif */
     align-items: center;
     height: 100%;
     white-space: nowrap;

package/dist/cjs/packages/switch/switch.js

@@ -33,7 +33,7 @@ var defaultProps = (0, _object_spread_props._)((0, _object_spread._)({}, _typing
     onLoadingChange: function onLoadingChange(loading) {}
 });
 var Switch = function Switch(props) {
-    var _ref = (0, _object_spread._)({}, defaultProps, props), checked = _ref.checked, defaultChecked = _ref.defaultChecked, disabled = _ref.disabled, activeText = _ref.activeText, inactiveText = _ref.inactiveText, loadingIcon = _ref.loadingIcon, className = _ref.className, style = _ref.style, onChange = _ref.onChange, propLoading = _ref.loading, onLoadingChange = _ref.onLoadingChange, ariaLabel = _ref.ariaLabel, rest = (0, _object_without_properties._)(_ref, [
+    var _ref = (0, _object_spread._)({}, defaultProps, props), checked = _ref.checked, defaultChecked = _ref.defaultChecked, disabled = _ref.disabled, activeText = _ref.activeText, inactiveText = _ref.inactiveText, loadingIcon = _ref.loadingIcon, className = _ref.className, style = _ref.style, onChange = _ref.onChange, propLoading = _ref.loading, onLoadingChange = _ref.onLoadingChange, rest = (0, _object_without_properties._)(_ref, [
         "checked",
         "defaultChecked",
         "disabled",
@@ -44,8 +44,7 @@ var Switch = function Switch(props) {
         "style",
         "onChange",
         "loading",
-        "onLoadingChange",
-        "ariaLabel"
+        "onLoadingChange"
     ]);
     var classPrefix = 'nut-switch';
     var rtl = (0, _index.useRtl)();
@@ -127,13 +126,7 @@ var Switch = function Switch(props) {
     return /*#__PURE__*/ _react.default.createElement(_components.View, (0, _object_spread._)({
         className: classes(),
         onClick: onClick,
-        style: style,
-        ariaRole: "switch",
-        // @ts-ignore
-        ariaChecked: value,
-        ariaDisabled: disabled,
-        tabIndex: disabled ? -1 : 0,
-        ariaLabel: ariaLabel
+        style: style
     }, rest), /*#__PURE__*/ _react.default.createElement(_components.View, {
         className: (0, _classnames.default)([
             [

package/dist/cjs/packages/tabbar/style/style.harmony.css

@@ -4,14 +4,9 @@
 /* #endif */
 .nut-badge {
   position: relative;
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  box-sizing: content-box;
-  /* #endif */
   vertical-align: middle;
+  box-sizing: content-box;
   width: auto;
 }
 .nut-badge-icon {
@@ -43,12 +38,7 @@
   border-radius: var(--nutui-badge-border-radius, var(--nutui-badge-height, 14px));
 }
 .nut-badge-sup {
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   text-align: center;
   min-width: var(--nutui-badge-min-width, 6px);
   padding: var(--nutui-badge-padding, 1px 4px);
@@ -144,9 +134,9 @@
   padding: 0;
 }
 .nut-tabbar-item-large .nut-tabbar-item-text {
-  font-size: var(--nutui-tabbar-text-large-font-size, var(--nutui-font-size-l, 15px));
+  font-size: var(--nutui-tabbar-text-large-font-size, var(--nutui-font-size-l, 16px));
   margin-top: 0;
-  line-height: var(--nutui-tabbar-text-large-font-size, var(--nutui-font-size-l, 15px));
+  line-height: var(--nutui-tabbar-text-large-font-size, var(--nutui-font-size-l, 16px));
   font-weight: var(--nutui-tabbar-text-large-font-weight, var(--nutui-font-weight, 400));
 }
 .nut-tabbar-item-active {

package/dist/cjs/packages/tabbaritem/style/style.css

@@ -39,9 +39,9 @@
   padding: 0;
 }
 .nut-tabbar-item-large .nut-tabbar-item-text {
-  font-size: var(--nutui-tabbar-text-large-font-size, var(--nutui-font-size-l, 15px));
+  font-size: var(--nutui-tabbar-text-large-font-size, var(--nutui-font-size-l, 16px));
   margin-top: 0;
-  line-height: var(--nutui-tabbar-text-large-font-size, var(--nutui-font-size-l, 15px));
+  line-height: var(--nutui-tabbar-text-large-font-size, var(--nutui-font-size-l, 16px));
   font-weight: var(--nutui-tabbar-text-large-font-weight, var(--nutui-font-weight, 400));
 }
 .nut-tabbar-item-active {

package/dist/cjs/packages/tabbaritem/style/style.harmony.css

@@ -4,14 +4,9 @@
 /* #endif */
 .nut-badge {
   position: relative;
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  box-sizing: content-box;
-  /* #endif */
   vertical-align: middle;
+  box-sizing: content-box;
   width: auto;
 }
 .nut-badge-icon {
@@ -43,12 +38,7 @@
   border-radius: var(--nutui-badge-border-radius, var(--nutui-badge-height, 14px));
 }
 .nut-badge-sup {
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
   text-align: center;
   min-width: var(--nutui-badge-min-width, 6px);
   padding: var(--nutui-badge-padding, 1px 4px);
@@ -144,9 +134,9 @@
   padding: 0;
 }
 .nut-tabbar-item-large .nut-tabbar-item-text {
-  font-size: var(--nutui-tabbar-text-large-font-size, var(--nutui-font-size-l, 15px));
+  font-size: var(--nutui-tabbar-text-large-font-size, var(--nutui-font-size-l, 16px));
   margin-top: 0;
-  line-height: var(--nutui-tabbar-text-large-font-size, var(--nutui-font-size-l, 15px));
+  line-height: var(--nutui-tabbar-text-large-font-size, var(--nutui-font-size-l, 16px));
   font-weight: var(--nutui-tabbar-text-large-font-weight, var(--nutui-font-weight, 400));
 }
 .nut-tabbar-item-active {

package/dist/cjs/packages/table/style/style.css

@@ -23,14 +23,12 @@
   overflow-x: auto;
 }
 .nut-table-main {
-  /* #ifndef dynamic*/
   display: table;
-  width: max-content;
-  /* #endif */
   overflow-x: auto;
   color: var(--nutui-color-title, #1a1a1a);
   background-color: var(--nutui-color-background-overlay, #ffffff);
   table-layout: fixed;
+  width: max-content;
   min-width: 100%;
   position: relative;
 }
@@ -47,18 +45,14 @@
   background: inherit;
 }
 .nut-table-main-head-tr, .nut-table-main-body-tr {
-  /* #ifndef dynamic*/
   display: table-row;
-  /* #endif */
   background: inherit;
 }
 .nut-table-main-head-tr:last-child .nut-table-main-body-tr-td, .nut-table-main-body-tr:last-child .nut-table-main-body-tr-td {
   border-bottom: none;
 }
 .nut-table-main-head-tr-th, .nut-table-main-body-tr-th {
-  /* #ifndef dynamic*/
   display: table-cell;
-  /* #endif */
   padding: var(--nutui-table-cols-padding, 10px);
   table-layout: fixed;
   background: inherit;
@@ -72,9 +66,7 @@
   border-right: none;
 }
 .nut-table-main-head-tr-td, .nut-table-main-body-tr-td {
-  /* #ifndef dynamic*/
   display: table-cell;
-  /* #endif */
   padding: var(--nutui-table-cols-padding, 10px);
   table-layout: fixed;
   background: inherit;
@@ -102,14 +94,10 @@
   text-align: end;
 }
 .nut-table-main-head {
-  /* #ifndef dynamic*/
   display: table-header-group;
-  /* #endif */
 }
 .nut-table-main-body {
-  /* #ifndef dynamic*/
-  display: table-header-group;
-  /* #endif */
+  display: table-row-group;
 }
 .nut-table-sticky-left, .nut-table-sticky-right {
   position: absolute;