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

package/dist/cjs/utils/scale-f.d.ts

@@ -0,0 +1,36 @@
+/** 原生 DongScreenAdapterPlugin.getScale 的典型返回结构 */
+type NativeScaleResponse = {
+    status?: string;
+    data?: {
+        scale?: number | string;
+    };
+};
+/** jmfe 通用 callNative 签名 */
+type NativeCaller = (plugin: string, method: string, params: string, extra: string) => Promise<NativeScaleResponse>;
+/** 站内容器的 jmfe 桥接方法（可选） */
+declare global {
+    interface Window {
+        jmfe?: {
+            callNative?: NativeCaller;
+        };
+    }
+}
+/** 字体档位：标准、大字、老年 */
+export type ScaleProfile = 'standard' | 'large' | 'elderly';
+/** 不同场景可选用不同放大比例（layout 等默认可不额外放大） */
+export type ScaleScene = 'layout' | 'font' | 'icon' | 'lego';
+export type ScaleDevice = 'phone' | 'pad';
+/** 首次计算缩放并订阅 resize；返回卸载函数（SSR 下为空函数） */
+export declare function initScaleF(nextProfile?: ScaleProfile): () => void;
+/** calcByProfile 的可选覆盖项：临时指定档位、场景、scale 或设备 */
+type CalcByProfileOptions = {
+    profile?: ScaleProfile;
+    scene?: ScaleScene;
+    scale?: number;
+    device?: ScaleDevice;
+};
+/**
+ * 按档位与场景将设计稿基准值换算为实际数值：base × 场景倍率 × 当前 scale，再按规则取整。
+ */
+export declare function calcByProfile(baseValue: number, options?: CalcByProfileOptions): number;
+export {};

package/dist/cjs/utils/scale-f.js

@@ -0,0 +1,222 @@
+/**
+ * 响应式缩放系数（--nut-scale-f）：结合京东站内原生桥与站外视口规则，
+ * 写入根节点 CSS 变量（--nut-scale-f / --nut-scale-font / --nut-scale-icon），
+ * 供布局/字号/icon 等按比例换算（见 calcByProfile）。H5 与 Taro WebView 共用此实现。
+ */ "use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get calcByProfile () {
+        return calcByProfile;
+    },
+    get initScaleF () {
+        return initScaleF;
+    }
+});
+var _async_to_generator = require("@swc/helpers/_/_async_to_generator");
+var _ts_generator = require("@swc/helpers/_/_ts_generator");
+var _canusedom = require("./can-use-dom");
+/** 当前基准缩放（来自原生或视口计算） */ var scale = 1;
+/** 大字模式下仅 font 场景的相对倍率 */ var LARGE_FONT_RATIO = 1.15;
+/** 老年模式下 font/icon/lego 场景的相对倍率 */ var ELDERLY_RATIO = 1.3;
+/** 全局当前档位，与 scale 共同参与 calcByProfile */ var profile = 'standard';
+/** 仅 large / elderly 有效，其余一律视为 standard */ function normalizeProfile(nextProfile) {
+    if (nextProfile === 'large' || nextProfile === 'elderly') return nextProfile;
+    return 'standard';
+}
+/** 计算 CSS 变量要使用的场景缩放（基准 scale × 场景倍率） */ function getCssSceneScale(scene, baseScale) {
+    return baseScale * getSceneRatio(scene, profile);
+}
+/** 将缩放值同步到 :root 的 --nut-scale-f / --nut-scale-font / --nut-scale-icon */ function applyScaleCssVars(nextScale) {
+    if (!_canusedom.canUseDom) return;
+    var rootStyle = document.documentElement.style;
+    rootStyle.setProperty('--nut-scale-f', formatScaleValue(nextScale));
+    rootStyle.setProperty('--nut-scale-font', formatScaleValue(getCssSceneScale('font', nextScale)));
+    rootStyle.setProperty('--nut-scale-icon', formatScaleValue(getCssSceneScale('icon', nextScale)));
+}
+/** >1 保留两位小数字符串；否则取整，与 CSS 消费端约定一致 */ function formatScaleValue(nextScale) {
+    if (nextScale > 1) {
+        return (Math.round(nextScale * 100) / 100).toFixed(2);
+    }
+    return "".concat(Math.round(nextScale));
+}
+/** 根据屏宽粗略区分 phone / pad */ function getCurrentDevice() {
+    if (!_canusedom.canUseDom) return 'phone';
+    return window.innerWidth >= 600 ? 'pad' : 'phone';
+}
+/** 在 profile 与 scene 维度上叠加额外倍率（与全局 scale 相乘） */ function getSceneRatio(scene, currentProfile) {
+    if (currentProfile === 'elderly' && (scene === 'font' || scene === 'icon' || scene === 'lego')) {
+        return ELDERLY_RATIO;
+    }
+    if (currentProfile === 'large' && scene === 'font') {
+        return LARGE_FONT_RATIO;
+    }
+    return 1;
+}
+/** 输出 px 等单位时的取整规则：缩放>1 或强制时保留两位小数精度 */ function roundByScaleRule(value, baseScale) {
+    var forceKeepTwoDecimals = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : false;
+    if (forceKeepTwoDecimals || baseScale > 1) {
+        return Math.round(value * 100) / 100;
+    }
+    return Math.round(value);
+}
+/** 无原生桥时按屏宽推算 scale（含平板与 375 基准窄屏区间） */ function getScaleByViewport() {
+    if (!_canusedom.canUseDom) return 1;
+    var deviceWidth = window.innerWidth;
+    if (!deviceWidth) return 1;
+    if (deviceWidth >= 600) {
+        return 1.2;
+    }
+    if (deviceWidth >= 375 && deviceWidth < 600) {
+        var ratio = deviceWidth / 375;
+        return ratio >= 1.17 ? 1.17 : ratio;
+    }
+    return 1;
+}
+/** 通过 jmfe.callNative 拉取 DongScreenAdapterPlugin；失败返回 null */ function getScaleByNative() {
+    return (0, _async_to_generator._)(function() {
+        var _window_jmfe, _res_data, res, parsed, e;
+        return (0, _ts_generator._)(this, function(_state) {
+            switch(_state.label){
+                case 0:
+                    if (!_canusedom.canUseDom || !((_window_jmfe = window.jmfe) === null || _window_jmfe === void 0 ? void 0 : _window_jmfe.callNative)) return [
+                        2,
+                        null
+                    ];
+                    _state.label = 1;
+                case 1:
+                    _state.trys.push([
+                        1,
+                        3,
+                        ,
+                        4
+                    ]);
+                    return [
+                        4,
+                        window.jmfe.callNative('DongScreenAdapterPlugin', 'getScale', JSON.stringify({}), '')
+                    ];
+                case 2:
+                    res = _state.sent();
+                    if ((res === null || res === void 0 ? void 0 : res.status) === '0' && ((_res_data = res.data) === null || _res_data === void 0 ? void 0 : _res_data.scale) !== undefined) {
+                        parsed = Number(res.data.scale);
+                        if (Number.isFinite(parsed) && parsed > 0) {
+                            return [
+                                2,
+                                parsed
+                            ];
+                        }
+                    }
+                    return [
+                        3,
+                        4
+                    ];
+                case 3:
+                    e = _state.sent();
+                    return [
+                        3,
+                        4
+                    ];
+                case 4:
+                    return [
+                        2,
+                        null
+                    ];
+            }
+        });
+    })();
+}
+/** 统一获取缩放：站内原生优先，失败则用视口规则 */ function getScaleF() {
+    return (0, _async_to_generator._)(function() {
+        var nativeScale;
+        return (0, _ts_generator._)(this, function(_state) {
+            switch(_state.label){
+                case 0:
+                    return [
+                        4,
+                        getScaleByNative()
+                    ];
+                case 1:
+                    nativeScale = _state.sent();
+                    if (nativeScale) return [
+                        2,
+                        nativeScale
+                    ];
+                    return [
+                        2,
+                        getScaleByViewport()
+                    ];
+            }
+        });
+    })();
+}
+/** 校验后更新内存中的 scale，并写入 --nut-scale-f */ function setScaleF(nextScale) {
+    var validScale = Number.isFinite(nextScale) && nextScale > 0 ? nextScale : 1;
+    scale = validScale;
+    applyScaleCssVars(validScale);
+    return scale;
+}
+/** 重新拉取缩放；可选同时切换 profile，避免与当前值相同时重复写 DOM */ function refreshScaleF(nextProfile) {
+    return (0, _async_to_generator._)(function() {
+        var nextScale;
+        return (0, _ts_generator._)(this, function(_state) {
+            switch(_state.label){
+                case 0:
+                    if (nextProfile) {
+                        setScaleProfile(nextProfile);
+                    }
+                    return [
+                        4,
+                        getScaleF()
+                    ];
+                case 1:
+                    nextScale = _state.sent();
+                    if (!scale || nextScale !== scale) {
+                        setScaleF(nextScale);
+                    }
+                    return [
+                        2,
+                        scale
+                    ];
+            }
+        });
+    })();
+}
+function initScaleF(nextProfile) {
+    if (!_canusedom.canUseDom) return function() {};
+    setScaleProfile(nextProfile);
+    var handler = function handler() {
+        refreshScaleF();
+    };
+    handler();
+    window.addEventListener('resize', handler);
+    return function() {
+        window.removeEventListener('resize', handler);
+    };
+}
+/** 更新全局 profile，并在当前 scale 下重刷 CSS 变量 */ function setScaleProfile(nextProfile) {
+    profile = normalizeProfile(nextProfile);
+    // profile 切换后需要重新应用当前缩放值。
+    setScaleF(scale);
+    return profile;
+}
+function calcByProfile(baseValue) {
+    var options = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
+    var _options_profile;
+    var currentProfile = normalizeProfile((_options_profile = options.profile) !== null && _options_profile !== void 0 ? _options_profile : profile);
+    var _options_scene;
+    var scene = (_options_scene = options.scene) !== null && _options_scene !== void 0 ? _options_scene : 'layout';
+    var currentScale = Number.isFinite(options.scale) && Number(options.scale) > 0 ? Number(options.scale) : scale;
+    var _options_device;
+    var device = (_options_device = options.device) !== null && _options_device !== void 0 ? _options_device : getCurrentDevice();
+    var ratio = getSceneRatio(scene, currentProfile);
+    var rawValue = baseValue * ratio * currentScale;
+    var forceKeepTwoDecimals = scene === 'font' && currentProfile === 'large' && device === 'pad';
+    return roundByScaleRule(rawValue, currentScale, forceKeepTwoDecimals);
+}

package/dist/cjs/utils/should-render-price-raw.d.ts

@@ -0,0 +1 @@
+export declare function shouldRenderPriceAsRaw(s: string): boolean;

package/dist/cjs/utils/should-render-price-raw.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "shouldRenderPriceAsRaw", {
+    enumerable: true,
+    get: function() {
+        return shouldRenderPriceAsRaw;
+    }
+});
+var CJK = /[\u4E00-\u9FFF]/;
+var RE_NUM = /\d+(?:\.\d+)?/g;
+function hasNoExtractablePrice(s) {
+    var t = s.trim();
+    if (!t) return true;
+    if (!/\d/.test(t)) return true;
+    if (t.replace(/[^\d.]/g, '') === '') return true;
+    return false;
+}
+function shouldRenderPriceAsRaw(s) {
+    if (hasNoExtractablePrice(s)) {
+        return true;
+    }
+    var t = s.trim();
+    if (!CJK.test(t)) return false;
+    var matches = Array.from(t.matchAll(RE_NUM));
+    if (matches.length < 2) return false;
+    var a = matches[0];
+    var b = matches[1];
+    var i0 = a.index;
+    var i1 = b.index;
+    var between = t.slice(i0 + a[0].length, i1);
+    return CJK.test(between);
+}

package/dist/cjs/utils/taro/{ConfigurableCSSTransition copy.js → ConfigurableCSSTransition.js}

@@ -21,84 +21,45 @@ var ConfigurableCSSTransition = function ConfigurableCSSTransition(props) {
         if (inPhase) return "".concat(baseClassName, "-enter-done");
         return "".concat(baseClassName, "-exit-done");
     }), 2), classes = _useState1[0], setClasses = _useState1[1];
-    var fallbackTimerRef = (0, _react.useRef)(null);
+    var timerRef = (0, _react.useRef)(null);
     var statusRef = (0, _react.useRef)(status);
     var prevInPhase = (0, _react.useRef)(inPhase);
-    var latestOnAnimationEnd = (0, _react.useRef)(children.props.onAnimationEnd);
-    (0, _react.useEffect)(function() {
-        latestOnAnimationEnd.current = children.props.onAnimationEnd;
-    });
     var updateStatus = (0, _react.useCallback)(function(nextStatus) {
         statusRef.current = nextStatus;
         setStatus(nextStatus);
     }, []);
-    var handleAnimationEnd = (0, _react.useCallback)(function(e) {
-        var _latestOnAnimationEnd_current;
-        (_latestOnAnimationEnd_current = latestOnAnimationEnd.current) === null || _latestOnAnimationEnd_current === void 0 ? void 0 : _latestOnAnimationEnd_current.call(latestOnAnimationEnd, e);
-        if (e && e.target !== e.currentTarget) return;
-        if (fallbackTimerRef.current) clearTimeout(fallbackTimerRef.current);
-        if (statusRef.current === 'entering') {
-            updateStatus('entered');
-            setClasses("".concat(baseClassName, "-enter-done"));
-            onEntered === null || onEntered === void 0 ? void 0 : onEntered();
-        } else if (statusRef.current === 'exiting') {
-            updateStatus('exited');
-            setClasses("".concat(baseClassName, "-exit-done"));
-            if (unmountOnExit) {
-                updateStatus('unmounted');
-            }
-            onExited === null || onExited === void 0 ? void 0 : onExited();
-        }
-    }, [
-        baseClassName,
-        onEntered,
-        onExited,
-        unmountOnExit,
-        updateStatus
-    ]);
     var enter = (0, _react.useCallback)(function() {
-        if (fallbackTimerRef.current) clearTimeout(fallbackTimerRef.current);
+        if (timerRef.current) clearTimeout(timerRef.current);
         if (statusRef.current === 'unmounted') {
             updateStatus('exited');
         }
-        if (timeout === 0) {
+        updateStatus('entering');
+        setClasses("".concat(baseClassName, "-enter ").concat(baseClassName, "-enter-active"));
+        timerRef.current = setTimeout(function() {
             updateStatus('entered');
             setClasses("".concat(baseClassName, "-enter-done"));
             onEntered === null || onEntered === void 0 ? void 0 : onEntered();
-            return;
-        }
-        updateStatus('entering');
-        setClasses("".concat(baseClassName, "-enter ").concat(baseClassName, "-enter-active"));
-        // Safety fallback: Give it extra time over the expected timeout in case onAnimationEnd misses
-        fallbackTimerRef.current = setTimeout(function() {
-            handleAnimationEnd(null);
-        }, timeout + 200);
+        }, timeout);
     }, [
         baseClassName,
-        handleAnimationEnd,
         onEntered,
         timeout,
         updateStatus
     ]);
     var exit = (0, _react.useCallback)(function() {
-        if (fallbackTimerRef.current) clearTimeout(fallbackTimerRef.current);
-        if (timeout === 0) {
+        if (timerRef.current) clearTimeout(timerRef.current);
+        updateStatus('exiting');
+        setClasses("".concat(baseClassName, "-exit ").concat(baseClassName, "-exit-active"));
+        timerRef.current = setTimeout(function() {
             updateStatus('exited');
             setClasses("".concat(baseClassName, "-exit-done"));
             if (unmountOnExit) {
                 updateStatus('unmounted');
             }
             onExited === null || onExited === void 0 ? void 0 : onExited();
-            return;
-        }
-        updateStatus('exiting');
-        setClasses("".concat(baseClassName, "-exit ").concat(baseClassName, "-exit-active"));
-        fallbackTimerRef.current = setTimeout(function() {
-            handleAnimationEnd(null);
-        }, timeout + 200);
+        }, timeout);
     }, [
         baseClassName,
-        handleAnimationEnd,
         onExited,
         timeout,
         unmountOnExit,
@@ -114,7 +75,7 @@ var ConfigurableCSSTransition = function ConfigurableCSSTransition(props) {
             prevInPhase.current = inPhase;
         }
         return function() {
-            if (fallbackTimerRef.current) clearTimeout(fallbackTimerRef.current);
+            if (timerRef.current) clearTimeout(timerRef.current);
         };
     }, [
         inPhase,
@@ -123,8 +84,7 @@ var ConfigurableCSSTransition = function ConfigurableCSSTransition(props) {
     ]);
     if (status === 'unmounted') return null;
     return /*#__PURE__*/ (0, _react.cloneElement)(children, {
-        className: "".concat(children.props.className || '', " ").concat(classes),
-        onAnimationEnd: handleAnimationEnd
+        className: "".concat(children.props.className || '', " ").concat(classes)
     });
 };
 var _default = ConfigurableCSSTransition;

package/dist/cjs/utils/taro/get-rect.js

@@ -26,6 +26,10 @@ var _taro = require("@tarojs/taro");
 var _lru = require("../lru");
 var _getrect = require("../get-rect");
 var lru = new _lru.MiniLru(10);
+var createScopedSelectorQuery = function createScopedSelectorQuery(scope) {
+    var query = (0, _taro.createSelectorQuery)();
+    return scope ? query.in(scope) : query;
+};
 function makeRect(width, height) {
     return {
         top: 0,
@@ -55,7 +59,8 @@ var getRectInMultiPlatform = function getRectInMultiPlatform(element) {
                             resolve(lru.get(element));
                             return;
                         }
-                        (0, _taro.createSelectorQuery)().select("#".concat(harmonyId || element.uid)).boundingClientRect().exec(function(param) {
+                        createScopedSelectorQuery(element === null || element === void 0 ? void 0 : element._scope) // https://taro.jd.com/docs/reference/config/page/
+                        .select("#".concat(harmonyId || element.uid)).boundingClientRect().exec(function(param) {
                             var _param = (0, _sliced_to_array._)(param, 1), rects = _param[0];
                             if (rects) {
                                 lru.set(element, rects);
@@ -86,7 +91,8 @@ var getRectInMultiPlatformWithoutCache = function getRectInMultiPlatformWithoutC
                 return [
                     2,
                     new Promise(function(resolve, reject) {
-                        (0, _taro.createSelectorQuery)().select("#".concat(harmonyId || element.uid)).boundingClientRect().exec(function(param) {
+                        createScopedSelectorQuery(element === null || element === void 0 ? void 0 : element._scope) // https://taro.jd.com/docs/reference/config/page/
+                        .select("#".concat(harmonyId || element.uid)).boundingClientRect().exec(function(param) {
                             var _param = (0, _sliced_to_array._)(param, 1), rects = _param[0];
                             resolve(rects);
                         });

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

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

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

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

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

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

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

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

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

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

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

@@ -155,6 +155,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'
+    }
 };
 export default viVN;

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

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

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

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

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

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

package/dist/es/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/es/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 {