@nutui/nutui-react 3.0.20-beta.0 → 3.1.0-beta.1

package/CHANGELOG.md

@@ -1,3 +1,16 @@
+# v3.0.20
+
+`2026-05-20`
+
+- :sparkles: feat: enhance SafeArea with className/style props and constant() iOS fallback (#3388)
+- :sparkles: feat(language): 添加越南语语言包 (#3378)
+- :bug: fix: 修改多语言
+- :bug: fix: 修订demo
+- 🏡 chore(deps): update dependency jest to v30 (#3288)
+- 🏡 chore(deps): update commitlint monorepo to v20 (#3428)
+- 🏡 chore(deps): update actions/github-script action to v9 (#3432)
+- 🔨 build: 添加postinstall脚本以收集使用统计信息 (#3436)
+
 # v3.0.19
 
 `2026-03-06`

package/dist/cjs/hooks/taro/use-custom-event.js

@@ -5,20 +5,20 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    customEvents: function() {
+    get customEvents () {
         return customEvents;
     },
-    useCustomEvent: function() {
+    get useCustomEvent () {
         return useCustomEvent;
     },
-    useCustomEventsPath: function() {
+    get useCustomEventsPath () {
         return useCustomEventsPath;
     },
-    useParams: function() {
+    get useParams () {
         return useParams;
     }
 });

package/dist/cjs/hooks/use-ref-state.js

@@ -5,14 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    getRefValue: function() {
+    get getRefValue () {
         return getRefValue;
     },
-    useRefState: function() {
+    get useRefState () {
         return useRefState;
     }
 });

package/dist/cjs/hooks/use-touch.js

@@ -8,8 +8,7 @@ Object.defineProperty(exports, "useTouch", {
         return useTouch;
     }
 });
-var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
-var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+var _react = require("react");
 var MIN_DISTANCE = 10;
 function getDirection(x, y) {
     if (x > y && x > MIN_DISTANCE) {

package/dist/cjs/locales/base.d.ts

@@ -142,4 +142,7 @@ export interface BaseLang {
         errorCanvasTips: string;
     };
     mask: string;
+    quickenter: {
+        title: string;
+    };
 }

package/dist/cjs/locales/en-US.js

@@ -165,6 +165,9 @@ var enUS = {
     watermark: {
         errorCanvasTips: 'Canvas is not supported in the current environment'
     },
-    mask: 'Mask'
+    mask: 'Mask',
+    quickenter: {
+        title: 'Quick Enter'
+    }
 };
 var _default = enUS;

package/dist/cjs/locales/id-ID.js

@@ -165,6 +165,9 @@ var idID = {
     watermark: {
         errorCanvasTips: 'Canvas is not supported in the current environment'
     },
-    mask: 'Masker'
+    mask: 'Masker',
+    quickenter: {
+        title: 'Masuk Cepat'
+    }
 };
 var _default = idID;

package/dist/cjs/locales/ja-JP.js

@@ -165,6 +165,9 @@ var jaJP = {
         errorCanvasTips: '現在の環境はCanvasをサポートしていません'
     },
     mask: 'マスク',
-    close: '閉じる'
+    close: '閉じる',
+    quickenter: {
+        title: 'クイックアクセス'
+    }
 };
 var _default = jaJP;

package/dist/cjs/locales/tr-TR.js

@@ -165,6 +165,9 @@ var trTR = {
     watermark: {
         errorCanvasTips: 'Geçerli ortam Canvası desteklemiyor'
     },
-    mask: 'Maske'
+    mask: 'Maske',
+    quickenter: {
+        title: 'Hızlı Giriş'
+    }
 };
 var _default = trTR;

package/dist/cjs/locales/vi-VN.js

@@ -165,6 +165,9 @@ var viVN = {
     watermark: {
         errorCanvasTips: 'Môi trường hiện tại không hỗ trợ Canvas'
     },
-    mask: 'Lớp phủ'
+    mask: 'Lớp phủ',
+    quickenter: {
+        title: 'Truy cập nhanh'
+    }
 };
 var _default = viVN;

package/dist/cjs/locales/zh-CN.js

@@ -165,6 +165,9 @@ var zhCN = {
     watermark: {
         errorCanvasTips: '当前环境不支持Canvas'
     },
-    mask: '蒙层'
+    mask: '蒙层',
+    quickenter: {
+        title: '快捷入口'
+    }
 };
 var _default = zhCN;

package/dist/cjs/locales/zh-TW.js

@@ -165,6 +165,9 @@ var zhCN = {
     watermark: {
         errorCanvasTips: '當前環境不支持Canvas'
     },
-    mask: '蒙層'
+    mask: '蒙層',
+    quickenter: {
+        title: '快捷入口'
+    }
 };
 var _default = zhCN;

package/dist/cjs/locales/zh-UG.js

@@ -165,6 +165,9 @@ var zhUG = {
     watermark: {
         errorCanvasTips: 'Canvas نى قوللىمايدۇ'
     },
-    mask: 'قاپلىما قەۋەت'
+    mask: 'قاپلىما قەۋەت',
+    quickenter: {
+        title: 'تېز كىرگۈزۈش'
+    }
 };
 var _default = zhUG;

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

@@ -7,7 +7,7 @@
   }
 
   .nut-popup-title {
-    border-bottom: 1px solid $actionsheet-border-color;
+    border-bottom: scale-px(1px) solid $actionsheet-border-color;
   }
 
   &-list {
@@ -21,7 +21,7 @@
   &-cancel,
   &-item {
     display: block;
-    padding: 10px;
+    padding: scale-px(10px);
     text-align: $actionsheet-item-text-align;
     line-height: $actionsheet-item-line-height;
     font-size: $font-size-base;
@@ -52,8 +52,8 @@
   }
 
   &-cancel {
-    margin-top: 5px;
-    border-top: 1px solid $actionsheet-border-color;
+    margin-top: scale-px(5px);
+    border-top: scale-px(1px) solid $actionsheet-border-color;
     border-radius: $actionsheet-border-radius;
   }
 

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

@@ -1,3 +1,13 @@
+:root,
+page {
+  --nut-scale-f: 1;
+  --nut-scale-font: var(--nut-scale-f, 1);
+  --nut-scale-icon: var(--nut-scale-f, 1);
+  --nut-icon-height: calc(16px * var(--nut-scale-icon, var(--nut-scale-f, 1))) !important;
+  --nut-icon-width: calc(16px * var(--nut-scale-icon, var(--nut-scale-f, 1))) !important;
+  --nut-icon-line-height: calc(16px * var(--nut-scale-icon, var(--nut-scale-f, 1))) !important;
+}
+
 /* #ifdef harmony */
 /* #endif */
 /* #ifndef harmony */
@@ -10,7 +20,7 @@
   background-color: var(--nutui-actionsheet-background-color, var(--nutui-color-background-overlay, #ffffff));
 }
 .nut-actionsheet .nut-popup-title {
-  border-bottom: 1px solid var(--nutui-actionsheet-border-color, var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
+  border-bottom: calc(1px * var(--nut-scale-f, 1)) solid var(--nutui-actionsheet-border-color, var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
 }
 .nut-actionsheet-list {
   display: block;
@@ -21,25 +31,25 @@
 }
 .nut-actionsheet-cancel, .nut-actionsheet-item {
   display: block;
-  padding: 10px;
+  padding: calc(10px * var(--nut-scale-f, 1));
   text-align: var(--nutui-actionsheet-item-text-align, center);
-  line-height: var(--nutui-actionsheet-item-line-height, 24px);
-  font-size: var(--nutui-font-size-base, 14px);
+  line-height: var(--nutui-actionsheet-item-line-height, calc(24px * var(--nut-scale-f, 1)));
+  font-size: var(--nutui-font-size-base, calc(14px * var(--nut-scale-font, var(--nut-scale-f, 1))));
   color: var(--nutui-actionsheet-item-color, var(--nutui-color-title, #1a1a1a));
   cursor: pointer;
 }
 .nut-actionsheet-cancel-name, .nut-actionsheet-item-name {
   text-align: var(--nutui-actionsheet-item-text-align, center);
-  line-height: var(--nutui-actionsheet-item-line-height, 24px);
-  font-size: var(--nutui-font-size-base, 14px);
+  line-height: var(--nutui-actionsheet-item-line-height, calc(24px * var(--nut-scale-f, 1)));
+  font-size: var(--nutui-font-size-base, calc(14px * var(--nut-scale-font, var(--nut-scale-f, 1))));
   color: var(--nutui-actionsheet-item-color, var(--nutui-color-title, #1a1a1a));
 }
 .nut-actionsheet-cancel-description, .nut-actionsheet-item-description {
   display: block;
-  font-size: var(--nutui-font-size-s, 12px);
+  font-size: var(--nutui-font-size-s, calc(12px * var(--nut-scale-font, var(--nut-scale-f, 1))));
   color: var(--nutui-color-text, #505259);
   text-align: var(--nutui-actionsheet-item-text-align, center);
-  line-height: var(--nutui-actionsheet-item-line-height, 24px);
+  line-height: var(--nutui-actionsheet-item-line-height, calc(24px * var(--nut-scale-f, 1)));
 }
 .nut-actionsheet-cancel-danger, .nut-actionsheet-item-danger {
   color: var(--nutui-actionsheet-item-danger, var(--nutui-color-danger, #ff0f23));
@@ -49,8 +59,8 @@
   cursor: not-allowed;
 }
 .nut-actionsheet-cancel {
-  margin-top: 5px;
-  border-top: 1px solid var(--nutui-actionsheet-border-color, var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
+  margin-top: calc(5px * var(--nut-scale-f, 1));
+  border-top: calc(1px * var(--nut-scale-f, 1)) solid var(--nutui-actionsheet-border-color, var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
   border-radius: var(--nutui-actionsheet-border-radius, 0);
 }
 .nut-actionsheet-safe-area {

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

@@ -7,7 +7,7 @@
   }
 
   .nut-popup-title {
-    border-bottom: 1px solid $actionsheet-border-color;
+    border-bottom: scale-px(1px) solid $actionsheet-border-color;
   }
 
   &-list {
@@ -21,7 +21,7 @@
   &-cancel,
   &-item {
     display: block;
-    padding: 10px;
+    padding: scale-px(10px);
     text-align: $actionsheet-item-text-align;
     line-height: $actionsheet-item-line-height;
     font-size: $font-size-base;
@@ -52,8 +52,8 @@
   }
 
   &-cancel {
-    margin-top: 5px;
-    border-top: 1px solid $actionsheet-border-color;
+    margin-top: scale-px(5px);
+    border-top: scale-px(1px) solid $actionsheet-border-color;
     border-radius: $actionsheet-border-radius;
   }
 

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

@@ -10,7 +10,7 @@
   background-color: var(--nutui-actionsheet-background-color, var(--nutui-color-surface-1));
 }
 .nut-actionsheet .nut-popup-title {
-  border-bottom: 1px solid var(--nutui-actionsheet-border-color, none);
+  border-bottom: scale-px(1px) solid var(--nutui-actionsheet-border-color, none);
 }
 .nut-actionsheet-list {
   display: block;
@@ -21,7 +21,7 @@
 }
 .nut-actionsheet-cancel, .nut-actionsheet-item {
   display: block;
-  padding: 10px;
+  padding: scale-px(10px);
   text-align: var(--nutui-actionsheet-item-text-align, center);
   line-height: var(--nutui-actionsheet-item-line-height, 24px);
   font-size: var(--nutui-font-text);
@@ -49,8 +49,8 @@
   cursor: not-allowed;
 }
 .nut-actionsheet-cancel {
-  margin-top: 5px;
-  border-top: 1px solid var(--nutui-actionsheet-border-color, none);
+  margin-top: scale-px(5px);
+  border-top: scale-px(1px) solid var(--nutui-actionsheet-border-color, none);
   border-radius: var(--nutui-actionsheet-border-radius, var(--nutui-radius-l));
 }
 .nut-actionsheet-safe-area {

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

@@ -7,7 +7,7 @@
   }
 
   .nut-popup-title {
-    border-bottom: 1px solid $actionsheet-border-color;
+    border-bottom: scale-px(1px) solid $actionsheet-border-color;
   }
 
   &-list {
@@ -21,7 +21,7 @@
   &-cancel,
   &-item {
     display: block;
-    padding: 10px;
+    padding: scale-px(10px);
     text-align: $actionsheet-item-text-align;
     line-height: $actionsheet-item-line-height;
     font-size: $font-size-base;
@@ -52,8 +52,8 @@
   }
 
   &-cancel {
-    margin-top: 5px;
-    border-top: 1px solid $actionsheet-border-color;
+    margin-top: scale-px(5px);
+    border-top: scale-px(1px) solid $actionsheet-border-color;
     border-radius: $actionsheet-border-radius;
   }
 

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

@@ -10,7 +10,7 @@
   background-color: var(--nutui-actionsheet-background-color, var(--nutui-color-surface-1));
 }
 .nut-actionsheet .nut-popup-title {
-  border-bottom: 1px solid var(--nutui-actionsheet-border-color, none);
+  border-bottom: scale-px(1px) solid var(--nutui-actionsheet-border-color, none);
 }
 .nut-actionsheet-list {
   display: block;
@@ -21,7 +21,7 @@
 }
 .nut-actionsheet-cancel, .nut-actionsheet-item {
   display: block;
-  padding: 10px;
+  padding: scale-px(10px);
   text-align: var(--nutui-actionsheet-item-text-align, center);
   line-height: var(--nutui-actionsheet-item-line-height, 24px);
   font-size: var(--nutui-font-text);
@@ -49,8 +49,8 @@
   cursor: not-allowed;
 }
 .nut-actionsheet-cancel {
-  margin-top: 5px;
-  border-top: 1px solid var(--nutui-actionsheet-border-color, none);
+  margin-top: scale-px(5px);
+  border-top: scale-px(1px) solid var(--nutui-actionsheet-border-color, none);
   border-radius: var(--nutui-actionsheet-border-radius, var(--nutui-radius-l));
 }
 .nut-actionsheet-safe-area {

package/dist/cjs/packages/address/address.js

@@ -5,14 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    Address: function() {
+    get Address () {
         return Address;
     },
-    InternalAddress: function() {
+    get InternalAddress () {
         return InternalAddress;
     }
 });

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

@@ -1,15 +1,15 @@
 .nut-address {
   &-exist {
     display: block;
-    padding: 15px 20px 0;
-    height: 279px;
+    padding: scale-px(15px) scale-px(20px) 0;
+    height: scale-px(279px);
     overflow-y: auto;
     box-sizing: border-box;
 
     &-item {
       display: flex;
       align-items: center;
-      margin-bottom: 20px;
+      margin-bottom: scale-px(20px);
       font-size: $font-size-s;
       line-height: $font-size-base;
       color: $color-title;
@@ -19,26 +19,26 @@
       }
 
       &-info {
-        margin-left: 9px;
+        margin-left: scale-px(9px);
       }
     }
   }
 
   &-footer {
     width: 100%;
-    height: 54px;
-    padding: 6px 0px 0;
-    border-top: 1px solid $color-border;
+    height: scale-px(54px);
+    padding: scale-px(6px) 0 0;
+    border-top: scale-px(1px) solid $color-border;
 
     &-btn {
       width: 90%;
-      height: 42px;
-      line-height: 42px;
+      height: scale-px(42px);
+      line-height: scale-px(42px);
       margin: auto;
       text-align: center;
       background: $button-primary-background-color;
-      border-radius: 21px;
-      font-size: 15px;
+      border-radius: scale-px(21px);
+      font-size: $font-size-l;
       color: $color-primary-text;
     }
   }
@@ -46,12 +46,12 @@
 
 .nut-address {
   &-title {
-    font-size: 14px;
+    font-size: $font-size-base;
     font-weight: 500;
-    padding: 16px 16px 12px 16px;
+    padding: scale-px(16px) scale-px(16px) scale-px(12px) scale-px(16px);
   }
   &-hotlist {
-    padding: 0 16px;
+    padding: 0 scale-px(16px);
     display: flex;
     flex-wrap: wrap;
     align-items: flex-start;
@@ -59,16 +59,16 @@
       display: flex;
       justify-content: center;
       align-items: center;
-      width: 63px;
-      height: 28px;
-      font-size: 12px;
-      border-radius: 4px;
-      margin-bottom: 7px;
+      width: scale-px(63px);
+      height: scale-px(28px);
+      font-size: $font-size-s;
+      border-radius: scale-px(4px);
+      margin-bottom: scale-px(7px);
       /* #ifdef harmony dynamic*/
-      margin-right: 6px;
+      margin-right: scale-px(6px);
       /* #endif */
       /* #ifndef harmony dynamic*/
-      margin-right: 7px;
+      margin-right: scale-px(7px);
       /* #endif */
       background-color: $color-background-sunken;
       color: $color-title;
@@ -80,36 +80,36 @@
     &.hotlist-more {
       .nut-address-hotlist-item {
         width: auto;
-        padding: 0 16px;
-        margin-right: 7px;
+        padding: 0 scale-px(16px);
+        margin-right: scale-px(7px);
       }
     }
   }
 
   &-selected {
     width: 100%;
-    height: 60px;
-    padding: 0 16px;
+    height: scale-px(60px);
+    padding: 0 scale-px(16px);
     display: flex;
     align-items: center;
-    border-bottom: 1px solid $color-border;
+    border-bottom: scale-px(1px) solid $color-border;
     &-item {
-      font-size: 12px;
+      font-size: $font-size-s;
       display: inline-block;
-      height: 28px;
-      line-height: 28px;
-      padding: 0 12px;
-      border-radius: 4px;
+      height: scale-px(28px);
+      line-height: scale-px(28px);
+      padding: 0 scale-px(12px);
+      border-radius: scale-px(4px);
       background-color: $color-background-sunken;
 
       &.active {
-        border: 1px solid $color-primary;
+        border: scale-px(1px) solid $color-primary;
         background-color: $color-primary-light-pressed;
         color: $color-primary;
       }
     }
     &-border {
-      margin: 0 2px;
+      margin: 0 scale-px(2px);
       color: $color-text-disabled;
     }
   }
@@ -119,15 +119,15 @@
     .nut-elevator-list {
       &-item {
         position: relative;
-        padding-left: 20px;
+        padding-left: scale-px(20px);
       }
       &-item-code {
         display: inline;
         position: absolute;
         left: 0;
         top: 0;
-        height: 30px;
-        line-height: 30px;
+        height: scale-px(30px);
+        line-height: scale-px(30px);
         border-bottom: 0;
         color: $color-text-help;
         font-weight: 500;
@@ -142,11 +142,11 @@
         display: flex;
         justify-content: center;
         align-items: center;
-        width: 16px;
-        height: 16px;
-        font-size: 10px;
-        border-radius: 16px;
-        margin-bottom: 2px;
+        width: scale-px(16px);
+        height: scale-px(16px);
+        font-size: $font-size-xxs;
+        border-radius: scale-px(16px);
+        margin-bottom: scale-px(2px);
         color: $color-text-help;
         &-active {
           background-color: $color-primary;
@@ -164,7 +164,7 @@
     &-item {
       &-info {
         margin-left: 0;
-        margin-right: 9px;
+        margin-right: scale-px(9px);
       }
     }
   }