@nutui/nutui-react-taro 3.0.20-cpp → 3.0.20

package/dist/cjs/packages/calendarcard/calendarcard.js

@@ -24,13 +24,12 @@ var _index = require("../configprovider/index");
 var _usepropsvalue = require("../../hooks/use-props-value");
 var defaultProps = (0, _object_spread_props._)((0, _object_spread._)({}, _typings.ComponentDefaults), {
     type: 'single',
-    firstDayOfWeek: 0,
-    weekdays: []
+    firstDayOfWeek: 0
 });
 var prefixCls = 'nut-calendarcard';
 var CalendarCard = /*#__PURE__*/ _react.default.forwardRef(function(props, ref) {
     var locale = (0, _index.useConfig)().locale;
-    var _$_object_spread = (0, _object_spread._)({}, defaultProps, props), style = _$_object_spread.style, className = _$_object_spread.className, type = _$_object_spread.type, title = _$_object_spread.title, value = _$_object_spread.value, defaultValue = _$_object_spread.defaultValue, firstDayOfWeek = _$_object_spread.firstDayOfWeek, startDate = _$_object_spread.startDate, endDate = _$_object_spread.endDate, disableDay = _$_object_spread.disableDay, renderDay = _$_object_spread.renderDay, renderDayTop = _$_object_spread.renderDayTop, renderDayBottom = _$_object_spread.renderDayBottom, renderDayAriaLabel = _$_object_spread.renderDayAriaLabel, weekdays = _$_object_spread.weekdays, onDayClick = _$_object_spread.onDayClick, onPageChange = _$_object_spread.onPageChange, onChange = _$_object_spread.onChange;
+    var _$_object_spread = (0, _object_spread._)({}, defaultProps, props), style = _$_object_spread.style, className = _$_object_spread.className, type = _$_object_spread.type, title = _$_object_spread.title, value = _$_object_spread.value, defaultValue = _$_object_spread.defaultValue, firstDayOfWeek = _$_object_spread.firstDayOfWeek, startDate = _$_object_spread.startDate, endDate = _$_object_spread.endDate, disableDay = _$_object_spread.disableDay, renderDay = _$_object_spread.renderDay, renderDayTop = _$_object_spread.renderDayTop, renderDayBottom = _$_object_spread.renderDayBottom, onDayClick = _$_object_spread.onDayClick, onPageChange = _$_object_spread.onPageChange, onChange = _$_object_spread.onChange;
     var onPageChangeRef = (0, _react.useRef)(onPageChange);
     // 当前月份信息
     var _useState = (0, _sliced_to_array._)((0, _react.useState)(function() {
@@ -180,19 +179,6 @@ var CalendarCard = /*#__PURE__*/ _react.default.forwardRef(function(props, ref)
         var d = new Date(day.year, day.month - 1, day.date).getDay();
         return d === 0 || d === 6;
     };
-    var isToday = function isToday(day) {
-        var today = new Date();
-        return day.year === today.getFullYear() && day.month === today.getMonth() + 1 && day.date === today.getDate();
-    };
-    // 日期无障碍朗读
-    var getAriaLabel = function getAriaLabel(day) {
-        var _locale_calendaritem_dayAriaLabel, _locale_calendaritem;
-        if (renderDayAriaLabel) {
-            return renderDayAriaLabel(day);
-        }
-        var today = isToday(day);
-        return (_locale_calendaritem_dayAriaLabel = (_locale_calendaritem = locale.calendaritem).dayAriaLabel) === null || _locale_calendaritem_dayAriaLabel === void 0 ? void 0 : _locale_calendaritem_dayAriaLabel.call(_locale_calendaritem, day.year, day.month, day.date, today, isActive(day), isDisable(day));
-    };
     var getClasses = function getClasses(day) {
         /**
      * active: single、multiple 激活日期
@@ -377,20 +363,15 @@ var CalendarCard = /*#__PURE__*/ _react.default.forwardRef(function(props, ref)
             }
         }, /*#__PURE__*/ _react.default.createElement(_icon.DoubleRight, null))));
     };
-    var weekHeader = (0, _react.useMemo)(function() {
-        var weekdaysList = weekdays.length > 0 ? weekdays : locale.calendaritem.weekdays;
-        var weekdaysData = weekdaysList.map(function(day, index) {
+    var _useState2 = (0, _sliced_to_array._)((0, _react.useState)(function() {
+        var weekdays = locale.calendaritem.weekdays.map(function(day, index) {
             return {
                 name: day,
                 key: index
             };
         });
-        return (0, _to_consumable_array._)(weekdaysData.slice(firstDayOfWeek, 7)).concat((0, _to_consumable_array._)(weekdaysData.slice(0, firstDayOfWeek)));
-    }, [
-        weekdays,
-        firstDayOfWeek,
-        locale.calendaritem.weekdays
-    ]);
+        return (0, _to_consumable_array._)(weekdays.slice(firstDayOfWeek, 7)).concat((0, _to_consumable_array._)(weekdays.slice(0, firstDayOfWeek)));
+    }), 1), weekHeader = _useState2[0];
     var renderContent = function renderContent() {
         return /*#__PURE__*/ _react.default.createElement(_components.View, {
             className: "".concat(prefixCls, "-content")
@@ -411,14 +392,11 @@ var CalendarCard = /*#__PURE__*/ _react.default.forwardRef(function(props, ref)
                 key: "".concat(day.year, "-").concat(day.month, "-").concat(day.date),
                 onClick: function onClick() {
                     return handleDayClick(day);
-                },
-                ariaLabel: getAriaLabel(day),
-                ariaRole: "button"
+                }
             }, /*#__PURE__*/ _react.default.createElement(_components.View, {
                 className: "".concat(prefixCls, "-day-top")
             }, renderDayTop ? renderDayTop(day) : ''), /*#__PURE__*/ _react.default.createElement(_components.View, {
-                className: "".concat(prefixCls, "-day-inner"),
-                ariaHidden: true
+                className: "".concat(prefixCls, "-day-inner")
             }, renderDay ? renderDay(day) : day.date), /*#__PURE__*/ _react.default.createElement(_components.View, {
                 className: "".concat(prefixCls, "-day-bottom")
             }, renderDayBottom ? renderDayBottom(day) : ''));

package/dist/cjs/packages/calendarcard/icon.js

@@ -25,21 +25,32 @@ _export(exports, {
 var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
 var _react = /*#__PURE__*/ _interop_require_default._(require("react"));
 var _components = require("@tarojs/components");
-var left = 'https://storage.360buyimg.com/imgtools/6437a2b149-bb511b40-4942-11f1-b1e1-7158b9aae0a9.svg';
-var right = 'https://storage.360buyimg.com/imgtools/8aa060341d-baf78990-4942-11f1-9368-cd56fc5fadc6.svg';
-var doubleLeft = 'https://storage.360buyimg.com/imgtools/b5e798f4ed-bbe8c760-4942-11f1-b1e1-7158b9aae0a9.svg';
-var doubleRight = 'https://storage.360buyimg.com/imgtools/d6979fa16d-bbb4bf10-4942-11f1-9368-cd56fc5fadc6.svg';
+var left = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCIgdmlld0JveD0iMCAwIDE4IDE4Ij48cGF0aCBkPSJNNi42MDUgOS40OWEuNzcxLjc3MSAwIDAgMSAwLS45OGwzLjYtNC4zNzJhLjc3MS43NzEgMCAwIDEgMS4xOS45ODFMOC4yIDlsMy4xOTcgMy44ODFhLjc3MS43NzEgMCAxIDEtMS4xOTEuOThsLTMuNi00LjM3eiIvPjwvc3ZnPg==';
+var right = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCIgdmlld0JveD0iMCAwIDE4IDE4Ij48cGF0aCBkPSJNMTEuMzk2IDkuNDlhLjc3MS43NzEgMCAwIDAgMC0uOThsLTMuNi00LjM3MmEuNzcxLjc3MSAwIDAgMC0xLjE5MS45ODFMOS44IDlsLTMuMTk2IDMuODgxYS43NzEuNzcxIDAgMCAwIDEuMTkuOThsMy42LTQuMzd6Ii8+PC9zdmc+';
+var doubleLeft = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCIgdmlld0JveD0iMCAwIDE4IDE4Ij48cGF0aCBkPSJNMTMuODUzIDQuMDI2YS43NzEuNzcxIDAgMCAxIC4xMiAxLjA4NUwxMC44NjQgOWwzLjExIDMuODg5YS43NzEuNzcxIDAgMSAxLTEuMjA0Ljk2M2wtMy40OTgtNC4zN2EuNzcxLjc3MSAwIDAgMSAwLS45NjRsMy40OTctNC4zNzFhLjc3MS43NzEgMCAwIDEgMS4wODQtLjEyem0tNS4yNDUgMGEuNzcxLjc3MSAwIDAgMSAuMTIgMS4wODVMNS42MTcgOWwzLjExMSAzLjg4OWEuNzcxLjc3MSAwIDAgMS0xLjIwNS45NjNsLTMuNDk3LTQuMzdhLjc3MS43NzEgMCAwIDEgMC0uOTY0bDMuNDk3LTQuMzcxYS43NzEuNzcxIDAgMCAxIDEuMDg1LS4xMnoiLz48L3N2Zz4=';
+var doubleRight = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCIgdmlld0JveD0iMCAwIDE4IDE4Ij48cGF0aCBkPSJNNC4xNDcgMTMuOTc0YS43NzEuNzcxIDAgMCAxLS4xMi0xLjA4NUw3LjEzNiA5IDQuMDI4IDUuMTFhLjc3MS43NzEgMCAxIDEgMS4yMDQtLjk2M2wzLjQ5NyA0LjM3MWEuNzcxLjc3MSAwIDAgMSAwIC45NjRsLTMuNDk3IDQuMzcxYS43NzEuNzcxIDAgMCAxLTEuMDg0LjEyem01LjI0NSAwYS43NzEuNzcxIDAgMCAxLS4xMi0xLjA4NUwxMi4zODMgOSA5LjI3MiA1LjExYS43NzEuNzcxIDAgMSAxIDEuMjA1LS45NjNsMy40OTcgNC4zNzFhLjc3MS43NzEgMCAwIDEgMCAuOTY0bC0zLjQ5NyA0LjM3MWEuNzcxLjc3MSAwIDAgMS0xLjA4NS4xMnoiLz48L3N2Zz4=';
+if (process.env.TARO_ENV === 'jdharmony_cpp') {
+    left = 'https://img11.360buyimg.com/imagetools/jfs/t1/187031/35/51586/196/6731c464F9b9f8f00/5506e32bf15e29dc.png';
+    right = 'https://img12.360buyimg.com/imagetools/jfs/t1/181006/25/51824/185/6731c452F9e252322/7493147dd6b4a88d.png';
+    doubleLeft = 'https://img13.360buyimg.com/imagetools/jfs/t1/221244/29/45876/259/6731c6bdF515df0a2/624e8eee3c8494a2.png';
+    doubleRight = 'https://img11.360buyimg.com/imagetools/jfs/t1/238382/25/24000/235/6731c6bdF0153286c/4a57e60b6e889af3.png';
+}
 var Icon = function Icon(param) {
     var url = param.url;
-    var iconStyle = {
-        color: 'var(--nutui-color-text)'
+    var style = {
+        background: "url('".concat(url, "') no-repeat center"),
+        backgroundSize: '100% 100%',
+        width: 18,
+        height: 18
     };
-    return /*#__PURE__*/ _react.default.createElement(_components.Image, {
-        className: "nut-calendarcard-icon",
-        svg: true,
-        src: url,
-        mode: "aspectFit",
-        style: iconStyle
+    if (process.env.TARO_ENV === 'jdharmony_cpp') {
+        return /*#__PURE__*/ _react.default.createElement(_components.Image, {
+            src: url,
+            style: style
+        });
+    }
+    return /*#__PURE__*/ _react.default.createElement(_components.View, {
+        style: style
     });
 };
 var ArrowLeft = function ArrowLeft() {

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

@@ -30,12 +30,6 @@
     }
   }
 
-  &-icon {
-    width: 18px;
-    height: 18px;
-    display: block;
-  }
-
   &-days {
     display: flex;
     flex-direction: row;
@@ -55,13 +49,6 @@
     margin-bottom: 4px;
     text-align: center;
 
-    // 部分 Taro 机型下子节点不会稳定继承父级 color，颜色直接落到最内层文案。
-    &-top,
-    &-inner,
-    &-bottom {
-      color: $color-title;
-    }
-
     &.header {
       cursor: auto;
     }
@@ -79,12 +66,6 @@
 
     &.weekend {
       color: $calendar-choose-color;
-
-      .nut-calendarcard-day-top,
-      .nut-calendarcard-day-inner,
-      .nut-calendarcard-day-bottom {
-        color: $calendar-choose-color;
-      }
     }
 
     &.active {

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

@@ -29,11 +29,6 @@
 .nut-calendarcard-header-left .right, .nut-calendarcard-header-right .right {
   margin-right: 8px;
 }
-.nut-calendarcard-icon {
-  width: 18px;
-  height: 18px;
-  display: block;
-}
 .nut-calendarcard-days {
   display: flex;
   flex-direction: row;
@@ -52,9 +47,6 @@
   margin-bottom: 4px;
   text-align: center;
 }
-.nut-calendarcard-day-top, .nut-calendarcard-day-inner, .nut-calendarcard-day-bottom {
-  color: var(--nutui-color-title, #1a1a1a);
-}
 .nut-calendarcard-day.header {
   cursor: auto;
 }
@@ -70,11 +62,6 @@
 .nut-calendarcard-day.weekend {
   color: var(--nutui-calendar-choose-color, var(--nutui-color-primary, #ff0f23));
 }
-.nut-calendarcard-day.weekend .nut-calendarcard-day-top,
-.nut-calendarcard-day.weekend .nut-calendarcard-day-inner,
-.nut-calendarcard-day.weekend .nut-calendarcard-day-bottom {
-  color: var(--nutui-calendar-choose-color, var(--nutui-color-primary, #ff0f23));
-}
 .nut-calendarcard-day.active {
   background-color: var(--nutui-calendar-active-background-color, var(--nutui-color-primary, #ff0f23));
   border-radius: var(--nutui-calendar-day-active-border-radius, 4px);

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

@@ -29,11 +29,6 @@
 .nut-calendarcard-header-left .right, .nut-calendarcard-header-right .right {
   margin-right: 8px;
 }
-.nut-calendarcard-icon {
-  width: 18px;
-  height: 18px;
-  display: block;
-}
 .nut-calendarcard-days {
   display: flex;
   flex-direction: row;
@@ -52,9 +47,6 @@
   margin-bottom: 4px;
   text-align: center;
 }
-.nut-calendarcard-day-top, .nut-calendarcard-day-inner, .nut-calendarcard-day-bottom {
-  color: var(--nutui-color-title, #1a1a1a);
-}
 .nut-calendarcard-day.header {
   cursor: auto;
 }
@@ -70,11 +62,6 @@
 .nut-calendarcard-day.weekend {
   color: var(--nutui-calendar-choose-color, var(--nutui-color-primary, #ff0f23));
 }
-.nut-calendarcard-day.weekend .nut-calendarcard-day-top,
-.nut-calendarcard-day.weekend .nut-calendarcard-day-inner,
-.nut-calendarcard-day.weekend .nut-calendarcard-day-bottom {
-  color: var(--nutui-calendar-choose-color, var(--nutui-color-primary, #ff0f23));
-}
 .nut-calendarcard-day.active {
   background-color: var(--nutui-calendar-active-background-color, var(--nutui-color-primary, #ff0f23));
   border-radius: var(--nutui-calendar-day-active-border-radius, 4px);

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

@@ -30,12 +30,6 @@
     }
   }
 
-  &-icon {
-    width: 18px;
-    height: 18px;
-    display: block;
-  }
-
   &-days {
     display: flex;
     flex-direction: row;
@@ -55,13 +49,6 @@
     margin-bottom: 4px;
     text-align: center;
 
-    // 部分 Taro 机型下子节点不会稳定继承父级 color，颜色直接落到最内层文案。
-    &-top,
-    &-inner,
-    &-bottom {
-      color: $color-title;
-    }
-
     &.header {
       cursor: auto;
     }
@@ -79,12 +66,6 @@
 
     &.weekend {
       color: $calendar-choose-color;
-
-      .nut-calendarcard-day-top,
-      .nut-calendarcard-day-inner,
-      .nut-calendarcard-day-bottom {
-        color: $calendar-choose-color;
-      }
     }
 
     &.active {

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

@@ -29,11 +29,6 @@
 .nut-calendarcard-header-left .right, .nut-calendarcard-header-right .right {
   margin-right: 8px;
 }
-.nut-calendarcard-icon {
-  width: 18px;
-  height: 18px;
-  display: block;
-}
 .nut-calendarcard-days {
   display: flex;
   flex-direction: row;
@@ -52,9 +47,6 @@
   margin-bottom: 4px;
   text-align: center;
 }
-.nut-calendarcard-day-top, .nut-calendarcard-day-inner, .nut-calendarcard-day-bottom {
-  color: var(--nutui-color-title);
-}
 .nut-calendarcard-day.header {
   cursor: auto;
 }
@@ -70,11 +62,6 @@
 .nut-calendarcard-day.weekend {
   color: var(--nutui-calendar-choose-color, var(--nutui-color-primary));
 }
-.nut-calendarcard-day.weekend .nut-calendarcard-day-top,
-.nut-calendarcard-day.weekend .nut-calendarcard-day-inner,
-.nut-calendarcard-day.weekend .nut-calendarcard-day-bottom {
-  color: var(--nutui-calendar-choose-color, var(--nutui-color-primary));
-}
 .nut-calendarcard-day.active {
   background-color: var(--nutui-calendar-active-background-color, var(--nutui-color-primary));
   border-radius: var(--nutui-calendar-day-active-border-radius, 4px);

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

@@ -30,12 +30,6 @@
     }
   }
 
-  &-icon {
-    width: 18px;
-    height: 18px;
-    display: block;
-  }
-
   &-days {
     display: flex;
     flex-direction: row;
@@ -55,13 +49,6 @@
     margin-bottom: 4px;
     text-align: center;
 
-    // 部分 Taro 机型下子节点不会稳定继承父级 color，颜色直接落到最内层文案。
-    &-top,
-    &-inner,
-    &-bottom {
-      color: $color-title;
-    }
-
     &.header {
       cursor: auto;
     }
@@ -79,12 +66,6 @@
 
     &.weekend {
       color: $calendar-choose-color;
-
-      .nut-calendarcard-day-top,
-      .nut-calendarcard-day-inner,
-      .nut-calendarcard-day-bottom {
-        color: $calendar-choose-color;
-      }
     }
 
     &.active {

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

@@ -29,11 +29,6 @@
 .nut-calendarcard-header-left .right, .nut-calendarcard-header-right .right {
   margin-right: 8px;
 }
-.nut-calendarcard-icon {
-  width: 18px;
-  height: 18px;
-  display: block;
-}
 .nut-calendarcard-days {
   display: flex;
   flex-direction: row;
@@ -52,9 +47,6 @@
   margin-bottom: 4px;
   text-align: center;
 }
-.nut-calendarcard-day-top, .nut-calendarcard-day-inner, .nut-calendarcard-day-bottom {
-  color: var(--nutui-color-title);
-}
 .nut-calendarcard-day.header {
   cursor: auto;
 }
@@ -70,11 +62,6 @@
 .nut-calendarcard-day.weekend {
   color: var(--nutui-calendar-choose-color, var(--nutui-color-primary, #ff6666));
 }
-.nut-calendarcard-day.weekend .nut-calendarcard-day-top,
-.nut-calendarcard-day.weekend .nut-calendarcard-day-inner,
-.nut-calendarcard-day.weekend .nut-calendarcard-day-bottom {
-  color: var(--nutui-calendar-choose-color, var(--nutui-color-primary, #ff6666));
-}
 .nut-calendarcard-day.active {
   background-color: var(--nutui-calendar-active-background-color, var(--nutui-color-primary, #ff6666));
   border-radius: var(--nutui-calendar-day-active-border-radius, 4px);

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

@@ -106,7 +106,7 @@
   background: var(--nutui-tag-background-color, var(--nutui-color-title, #1a1a1a));
 }
 .nut-tag-primary {
-  background: #fa2c19;
+  background: var(--nutui-tag-primary-background-color, linear-gradient(135deg, var(--nutui-color-primary-stop-1, #ff475d) 0%, var(--nutui-color-primary-stop-2, #ff0f23) 100%));
 }
 .nut-tag-info {
   background: var(--nutui-tag-info-background-color, var(--nutui-color-info, #0073ff));

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

@@ -71,7 +71,7 @@
   align-items: center;
   justify-content: center;
   border-bottom: var(--nutui-popup-title-border-bottom, 0);
-  padding: var(--nutui-popup-title-padding, 11px);
+  padding: var(--nutui-popup-title-padding, 16px);
   position: relative;
 }
 .nut-popup-title-wrapper {
@@ -84,6 +84,7 @@
   color: var(--nutui-color-title, #1a1a1a);
   font-weight: var(--nutui-font-weight-bold, 600);
   font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
+  line-height: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
 }
 .nut-popup-title-description {
   color: var(--nutui-color-text, #505259);
@@ -95,13 +96,13 @@
 }
 .nut-popup-title-left {
   position: absolute;
-  top: var(--nutui-popup-title-padding, 11px);
-  left: var(--nutui-popup-title-padding, 11px);
+  top: var(--nutui-popup-title-padding, 16px);
+  left: var(--nutui-popup-title-padding, 16px);
 }
 .nut-popup-title-right {
   position: absolute;
-  top: var(--nutui-popup-title-padding, 11px);
-  right: var(--nutui-popup-title-padding, 11px);
+  top: var(--nutui-popup-title-padding, 16px);
+  right: var(--nutui-popup-title-padding, 16px);
   z-index: 1;
   width: var(--nutui-popup-icon-size, 20px);
   height: var(--nutui-popup-icon-size, 20px);
@@ -112,22 +113,20 @@
   opacity: 0.7;
 }
 .nut-popup-title-right-top-left {
-  top: var(--nutui-popup-title-padding, 11px);
-  left: var(--nutui-popup-title-padding, 11px);
+  top: var(--nutui-popup-title-padding, 16px);
+  left: var(--nutui-popup-title-padding, 16px);
 }
 .nut-popup-title-right-bottom-left {
-  bottom: var(--nutui-popup-title-padding, 11px);
-  left: var(--nutui-popup-title-padding, 11px);
+  bottom: var(--nutui-popup-title-padding, 16px);
+  left: var(--nutui-popup-title-padding, 16px);
 }
 .nut-popup-title-right-bottom-right {
-  right: var(--nutui-popup-title-padding, 11px);
-  bottom: var(--nutui-popup-title-padding, 11px);
+  right: var(--nutui-popup-title-padding, 16px);
+  bottom: var(--nutui-popup-title-padding, 16px);
 }
 .nut-popup-center {
   top: 50%;
   left: 50%;
-  right: auto;
-  bottom: auto;
   min-height: 10%;
   max-width: 295px;
   transform: translate(-50%, -50%);
@@ -138,8 +137,6 @@
 .nut-popup-bottom {
   bottom: 0;
   left: 0;
-  right: auto;
-  top: auto;
   width: 100%;
 }
 .nut-popup-bottom.nut-popup-round {
@@ -151,8 +148,6 @@
 .nut-popup-right {
   top: 0;
   right: 0;
-  left: auto;
-  bottom: auto;
   width: 100px;
   height: 100%;
 }
@@ -162,8 +157,6 @@
 .nut-popup-left {
   top: 0;
   left: 0;
-  right: auto;
-  bottom: auto;
   width: 100px;
   height: 100%;
 }
@@ -173,8 +166,6 @@
 .nut-popup-top {
   top: 0;
   left: 0;
-  right: auto;
-  bottom: auto;
   width: 100%;
 }
 .nut-popup-top.nut-popup-round {
@@ -251,9 +242,6 @@
   }
 }
 @keyframes popup-slide-top-exit {
-  from {
-    transform: translate3d(0, 0%, 0);
-  }
   to {
     transform: translate3d(0, -100%, 0);
   }
@@ -278,9 +266,6 @@
   }
 }
 @keyframes popup-slide-right-exit {
-  from {
-    transform: translate3d(0%, 0, 0);
-  }
   to {
     transform: translate3d(100%, 0, 0);
   }
@@ -305,9 +290,6 @@
   }
 }
 @keyframes slide-bottom-exit {
-  from {
-    transform: translate3d(0, 0%, 0);
-  }
   to {
     transform: translate3d(0, 100%, 0);
   }
@@ -332,9 +314,6 @@
   }
 }
 @keyframes popup-slide-left-exit {
-  from {
-    transform: translate3d(0%, 0, 0);
-  }
   to {
     transform: translate3d(-100%, 0, 0);
   }
@@ -360,27 +339,27 @@
 [dir=rtl] .nut-popup-title-left,
 .nut-rtl .nut-popup-title-left {
   left: auto;
-  right: var(--nutui-popup-title-padding, 11px);
+  right: var(--nutui-popup-title-padding, 16px);
 }
 [dir=rtl] .nut-popup-title-right,
 .nut-rtl .nut-popup-title-right {
   right: auto;
-  left: var(--nutui-popup-title-padding, 11px);
+  left: var(--nutui-popup-title-padding, 16px);
 }
 [dir=rtl] .nut-popup-title-right-top-left,
 .nut-rtl .nut-popup-title-right-top-left {
   left: auto;
-  right: var(--nutui-popup-title-padding, 11px);
+  right: var(--nutui-popup-title-padding, 16px);
 }
 [dir=rtl] .nut-popup-title-right-bottom-left,
 .nut-rtl .nut-popup-title-right-bottom-left {
   left: auto;
-  right: var(--nutui-popup-title-padding, 11px);
+  right: var(--nutui-popup-title-padding, 16px);
 }
 [dir=rtl] .nut-popup-title-right-bottom-right,
 .nut-rtl .nut-popup-title-right-bottom-right {
   right: auto;
-  left: var(--nutui-popup-title-padding, 11px);
+  left: var(--nutui-popup-title-padding, 16px);
 }
 [dir=rtl] .nut-popup-title .nut-icon-ArrowLeft,
 .nut-rtl .nut-popup-title .nut-icon-ArrowLeft {