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

package/dist/es/packages/price/price.js

@@ -7,7 +7,8 @@ import classNames from "classnames";
 import { ComponentDefaults } from "../../utils/typings";
 import { useRtl } from "../configprovider/index";
 import { PriceColorEnum } from "../../types";
-import { harmony, td } from "../../utils/taro/platform";
+import { harmony } from "../../utils/taro/platform";
+import { shouldRenderPriceAsRaw, hasNonPriceChars } from "../../utils/should-render-price-raw";
 var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
     color: 'primary',
     price: 0,
@@ -16,16 +17,25 @@ var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
     thousands: false,
     position: 'before',
     size: 'normal',
-    line: false
+    line: false,
+    raw: false
 });
-export var Price = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps, props), color = _$_object_spread.color, originalPrice = _$_object_spread.price, symbol = _$_object_spread.symbol, digits = _$_object_spread.digits, thousands = _$_object_spread.thousands, position = _$_object_spread.position, size = _$_object_spread.size, line = _$_object_spread.line, className = _$_object_spread.className, style = _$_object_spread.style;
+export var Price = function Price(props) {
+    var _$_object_spread = _object_spread({}, defaultProps, props), color = _$_object_spread.color, originalPrice = _$_object_spread.price, symbol = _$_object_spread.symbol, digits = _$_object_spread.digits, thousands = _$_object_spread.thousands, position = _$_object_spread.position, size = _$_object_spread.size, line = _$_object_spread.line, raw = _$_object_spread.raw, className = _$_object_spread.className, style = _$_object_spread.style;
     var classPrefix = 'nut-price';
     var rtl = useRtl();
+    var isRenderPriceRaw = useMemo(function() {
+        return typeof originalPrice === 'string' && shouldRenderPriceAsRaw(originalPrice) || raw && typeof originalPrice === 'string' && hasNonPriceChars(originalPrice);
+    }, [
+        originalPrice,
+        raw
+    ]);
     var price = useMemo(function() {
+        if (isRenderPriceRaw) return '';
         return originalPrice.toString().replace(/[^\d.]/g, '');
     }, [
-        originalPrice
+        originalPrice,
+        isRenderPriceRaw
     ]);
     var isCustomPriceColor = useMemo(function() {
         var specificPriceColor = Object.values(PriceColorEnum);
@@ -41,7 +51,7 @@ export var Price = function(props) {
         isCustomPriceColor,
         color
     ]);
-    var replaceSpecialChar = function(url) {
+    var replaceSpecialChar = function replaceSpecialChar(url) {
         url = url.replace(/"/g, '"');
         url = url.replace(/&/g, '&');
         url = url.replace(/&lt;/g, '<');
@@ -50,10 +60,10 @@ export var Price = function(props) {
         url = url.replace(/&yen;/g, '¥');
         return url;
     };
-    var checkPoint = function(price) {
+    var checkPoint = function checkPoint(price) {
         return String(price).indexOf('.') > 0;
     };
-    var formatThousands = function(num) {
+    var formatThousands = function formatThousands(num) {
         if (Number(num) === 0) {
             num = 0;
         }
@@ -66,8 +76,8 @@ export var Price = function(props) {
         }
         return num;
     };
-    var formatDecimal = function(decimalNum) {
-        if (Number(decimalNum) === 0) {
+    var formatDecimal = function formatDecimal(decimalNum) {
+        if (Number(decimalNum) === 0 && !checkPoint(decimalNum)) {
             decimalNum = 0;
         }
         if (checkPoint(decimalNum)) {
@@ -83,7 +93,7 @@ export var Price = function(props) {
         }
         return decimalNum;
     };
-    var renderSymbol = function() {
+    var renderSymbol = function renderSymbol() {
         var _obj;
         return /*#__PURE__*/ React.createElement(Text, {
             className: classNames([
@@ -91,27 +101,56 @@ export var Price = function(props) {
                 "".concat(classPrefix, "-symbol-").concat(size),
                 (_obj = {}, _define_property(_obj, "".concat(classPrefix, "-line"), line), _define_property(_obj, "".concat(classPrefix, "-rtl"), rtl), _obj)
             ]),
-            style: priceColorStyle
+            style: priceColorStyle,
+            // @ts-ignore
+            ariaHidden: true
         }, symbol ? replaceSpecialChar(symbol) : '');
     };
-    var renderInner = function() {
+    var renderInner = function renderInner() {
         return /*#__PURE__*/ React.createElement(React.Fragment, null, symbol && position === 'before' ? renderSymbol() : null, /*#__PURE__*/ React.createElement(Text, {
             className: "".concat(classPrefix, "-integer ").concat(classPrefix, "-integer-").concat(size, " ").concat(line ? "".concat(classPrefix, "-line") : ''),
-            style: priceColorStyle
+            style: priceColorStyle,
+            // @ts-ignore
+            ariaHidden: true
         }, formatThousands(price)), digits !== 0 ? /*#__PURE__*/ React.createElement(React.Fragment, null, checkPoint(price) || digits ? /*#__PURE__*/ React.createElement(Text, {
             className: "".concat(classPrefix, "-decimal ").concat(classPrefix, "-decimal-").concat(size, " ").concat(line ? "".concat(classPrefix, "-line") : ''),
-            style: priceColorStyle
+            style: priceColorStyle,
+            // @ts-ignore
+            ariaHidden: true
         }, ".") : null, /*#__PURE__*/ React.createElement(Text, {
             className: "".concat(classPrefix, "-decimal ").concat(classPrefix, "-decimal-").concat(size, " ").concat(line ? "".concat(classPrefix, "-line") : ''),
-            style: priceColorStyle
+            style: priceColorStyle,
+            // @ts-ignore
+            ariaHidden: true
         }, formatDecimal(price))) : null, symbol && position === 'after' ? renderSymbol() : null);
     };
-    return /*#__PURE__*/ React.createElement(React.Fragment, null, harmony() || td() ? /*#__PURE__*/ React.createElement(Text, {
+    var renderRawContent = function renderRawContent() {
+        return /*#__PURE__*/ React.createElement(React.Fragment, null, originalPrice);
+    };
+    var accessiblePriceText = useMemo(function() {
+        var safeSymbol = symbol ? replaceSpecialChar(symbol) : '';
+        var numberText = isRenderPriceRaw ? "".concat(originalPrice) : "".concat(price);
+        return position === 'after' ? "".concat(numberText).concat(safeSymbol) : "".concat(safeSymbol).concat(numberText);
+    }, [
+        symbol,
+        price,
+        position,
+        originalPrice,
+        isRenderPriceRaw
+    ]);
+    return /*#__PURE__*/ React.createElement(React.Fragment, null, harmony() || process.env.TARO_ENV === 'dynamic' ? /*#__PURE__*/ React.createElement(Text, {
         className: "".concat(classPrefix, " ").concat(classPrefix, "-").concat(color, " ").concat(className),
-        style: style
-    }, renderInner()) : /*#__PURE__*/ React.createElement(View, {
+        style: style,
+        // @ts-ignore
+        ariaLabel: accessiblePriceText,
+        // eslint-disable-next-line jsx-a11y/aria-role
+        role: "text"
+    }, isRenderPriceRaw ? renderRawContent() : renderInner()) : /*#__PURE__*/ React.createElement(View, {
         className: "".concat(classPrefix, " ").concat(classPrefix, "-").concat(color, " ").concat(className),
-        style: style
-    }, renderInner()));
+        style: style,
+        ariaLabel: accessiblePriceText,
+        // eslint-disable-next-line jsx-a11y/aria-role
+        role: "text"
+    }, isRenderPriceRaw ? renderRawContent() : renderInner()));
 };
 Price.displayName = 'NutPrice';

package/dist/es/packages/progress/progress.js

@@ -19,10 +19,11 @@ var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
     lazy: false,
     delay: 0
 });
-export var Progress = function(props) {
+export var Progress = function Progress(props) {
+    var _ref, _props_showText, _ref1, _props_color, _ref2, _props_background, _ref3, _props_animated;
     var rtl = useRtl();
-    var _ref = _object_spread({}, defaultProps, props), className = _ref.className, style = _ref.style, percent = _ref.percent, background = _ref.background, color = _ref.color, strokeWidth = _ref.strokeWidth, showText = _ref.showText, animated = _ref.animated, children = _ref.children, lazy = _ref.lazy, delay = _ref.delay, // tc
-    showInfo = _ref.showInfo, borderRadius = _ref.borderRadius, fontSize = _ref.fontSize, activeColor = _ref.activeColor, backgroundColor = _ref.backgroundColor, active = _ref.active, activeMode = _ref.activeMode, duration = _ref.duration, ariaLabel = _ref.ariaLabel, onActiveEnd = _ref.onActiveEnd, rest = _object_without_properties(_ref, [
+    var _$_object_spread = _object_spread({}, defaultProps, props), className = _$_object_spread.className, style = _$_object_spread.style, percent = _$_object_spread.percent, background = _$_object_spread.background, color = _$_object_spread.color, strokeWidth = _$_object_spread.strokeWidth, showText = _$_object_spread.showText, animated = _$_object_spread.animated, children = _$_object_spread.children, lazy = _$_object_spread.lazy, delay = _$_object_spread.delay, // tc
+    showInfo = _$_object_spread.showInfo, borderRadius = _$_object_spread.borderRadius, fontSize = _$_object_spread.fontSize, activeColor = _$_object_spread.activeColor, backgroundColor = _$_object_spread.backgroundColor, active = _$_object_spread.active, activeMode = _$_object_spread.activeMode, duration = _$_object_spread.duration, onActiveEnd = _$_object_spread.onActiveEnd, rest = _object_without_properties(_$_object_spread, [
         "className",
         "style",
         "percent",
@@ -42,22 +43,17 @@ export var Progress = function(props) {
         "active",
         "activeMode",
         "duration",
-        "ariaLabel",
         "onActiveEnd"
     ]);
     var classPrefix = 'nut-progress';
-    var _props_showText, _ref1;
-    var effectiveShowText = (_ref1 = (_props_showText = props.showText) !== null && _props_showText !== void 0 ? _props_showText : showInfo) !== null && _ref1 !== void 0 ? _ref1 : defaultProps.showText;
-    var _props_color, _ref2;
-    var effectiveColor = (_ref2 = (_props_color = props.color) !== null && _props_color !== void 0 ? _props_color : activeColor) !== null && _ref2 !== void 0 ? _ref2 : defaultProps.color;
-    var _props_background, _ref3;
-    var effectiveBgColor = (_ref3 = (_props_background = props.background) !== null && _props_background !== void 0 ? _props_background : backgroundColor) !== null && _ref3 !== void 0 ? _ref3 : defaultProps.background;
-    var _props_animated, _ref4;
-    var effectiveAnimated = (_ref4 = (_props_animated = props.animated) !== null && _props_animated !== void 0 ? _props_animated : active) !== null && _ref4 !== void 0 ? _ref4 : defaultProps.animated;
+    var effectiveShowText = (_ref = (_props_showText = props.showText) !== null && _props_showText !== void 0 ? _props_showText : showInfo) !== null && _ref !== void 0 ? _ref : defaultProps.showText;
+    var effectiveColor = (_ref1 = (_props_color = props.color) !== null && _props_color !== void 0 ? _props_color : activeColor) !== null && _ref1 !== void 0 ? _ref1 : defaultProps.color;
+    var effectiveBgColor = (_ref2 = (_props_background = props.background) !== null && _props_background !== void 0 ? _props_background : backgroundColor) !== null && _ref2 !== void 0 ? _ref2 : defaultProps.background;
+    var effectiveAnimated = (_ref3 = (_props_animated = props.animated) !== null && _props_animated !== void 0 ? _props_animated : active) !== null && _ref3 !== void 0 ? _ref3 : defaultProps.animated;
     var _obj;
     var classesInner = classNames((_obj = {}, _define_property(_obj, "".concat(classPrefix, "-inner"), true), _define_property(_obj, "".concat(classPrefix, "-active"), effectiveAnimated), _obj));
     var _useState = _sliced_to_array(useState(percent), 2), displayPercent = _useState[0], setDispalyPercent = _useState[1];
-    var getStyles = function() {
+    var getStyles = function getStyles() {
         // 基础样式
         var baseStyles = {
             height: strokeWidth && pxTransform(Number(strokeWidth)),
@@ -78,7 +74,7 @@ export var Progress = function(props) {
         };
     };
     var _getStyles = getStyles(), stylesOuter = _getStyles.outer, stylesInner = _getStyles.inner;
-    var handlePercent = function() {
+    var handlePercent = function handlePercent() {
         var timer = null;
         if (delay) {
             setDispalyPercent(0);
@@ -116,7 +112,7 @@ export var Progress = function(props) {
     var webObserver = useRef(null);
     var uuid = useUuid();
     var selector = "".concat(classPrefix, "-lazy-").concat(uuid);
-    var resetObserver = function() {
+    var resetObserver = function resetObserver() {
         var observer = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : null;
         if (web()) {
             webObserver.current.disconnect && webObserver.current.disconnect();
@@ -137,7 +133,7 @@ export var Progress = function(props) {
     }, [
         intersecting
     ]);
-    var handleWebObserver = function() {
+    var handleWebObserver = function handleWebObserver() {
         /// web环境
         if (lazy) {
             webObserver.current = new IntersectionObserver(function(entires, self) {
@@ -154,7 +150,7 @@ export var Progress = function(props) {
         }
         handlePercent();
     };
-    var handleOtherObserver = function() {
+    var handleOtherObserver = function handleOtherObserver() {
         // 非web环境
         var observer = null;
         if (lazy) {
@@ -179,14 +175,14 @@ export var Progress = function(props) {
             handleOtherObserver();
         }
     }, []);
-    var getTextStyle = function() {
+    var getTextStyle = function getTextStyle() {
         return rtl ? {
             right: '100%'
         } : {
             left: '100%'
         };
     };
-    var computeRight = function() {
+    var computeRight = function computeRight() {
         if (children) {
             return 0;
         }
@@ -195,7 +191,7 @@ export var Progress = function(props) {
         }
         return Math.floor(("".concat(percent, "%").length * 9 + 4) / 2);
     };
-    var computeInnerStyle = function() {
+    var computeInnerStyle = function computeInnerStyle() {
         var style = {
             backgroundColor: effectiveColor || '#ff0f23',
             fontSize: fontSize && pxTransform(parseInt(fontSize.toString()))
@@ -209,8 +205,7 @@ export var Progress = function(props) {
         ref: progressRef,
         id: selector,
         className: classNames(classPrefix, className),
-        style: style,
-        "aria-label": ariaLabel
+        style: style
     }, rest), /*#__PURE__*/ React.createElement(View, {
         className: "".concat(classPrefix, "-outer"),
         style: stylesOuter

package/dist/es/packages/pulltorefresh/pulltorefresh.js

@@ -27,9 +27,9 @@ var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
     headHeight: 80,
     threshold: 60,
     scrollTop: 0,
-    onRefresh: function() {}
+    onRefresh: function onRefresh() {}
 });
-export var PullToRefresh = function(p) {
+export var PullToRefresh = function PullToRefresh(p) {
     var doRefresh = function doRefresh() {
         return _async_to_generator(function() {
             var e;
@@ -100,17 +100,17 @@ export var PullToRefresh = function(p) {
     var _useState = _sliced_to_array(useState('pulling'), 2), status = _useState[0], setStatus = _useState[1];
     var _useState1 = _sliced_to_array(useState(0), 2), height = _useState1[0], setHeight = _useState1[1];
     var timer = useRef();
-    var renderIcons = function(status) {
+    var renderIcons = function renderIcons(status) {
         return /*#__PURE__*/ React.createElement(React.Fragment, null, (status === 'pulling' || status === 'complete') && /*#__PURE__*/ React.createElement(Loading, null), (status === 'canRelease' || status === 'refreshing') && /*#__PURE__*/ React.createElement(More, null));
     };
-    var renderStatusIcon = function() {
+    var renderStatusIcon = function renderStatusIcon() {
         if (props.renderIcon) {
             var _props_renderIcon;
             return (_props_renderIcon = props.renderIcon) === null || _props_renderIcon === void 0 ? void 0 : _props_renderIcon.call(props, status);
         }
         return renderIcons(status);
     };
-    var renderStatusText = function() {
+    var renderStatusText = function renderStatusText() {
         if (props.renderText) {
             var _props_renderText;
             return (_props_renderText = props.renderText) === null || _props_renderText === void 0 ? void 0 : _props_renderText.call(props, status);
@@ -121,11 +121,11 @@ export var PullToRefresh = function(p) {
         if (status === 'complete') return props.completeText;
         return '';
     };
-    var handleTouchStart = function(e) {
+    var handleTouchStart = function handleTouchStart(e) {
         if (props.disabled) return;
         touch.start(e);
     };
-    var handleTouchMove = function(e) {
+    var handleTouchMove = function handleTouchMove(e) {
         if (props.scrollTop > 0 || props.disabled) {
             return;
         }
@@ -139,7 +139,7 @@ export var PullToRefresh = function(p) {
         }
         clearTimeout(timer.current);
     };
-    var handleTouchEnd = function() {
+    var handleTouchEnd = function handleTouchEnd() {
         if (props.disabled) return;
         pullingRef.current = false;
         if (status === 'canRelease') {

package/dist/es/packages/quickenter/index.d.ts

@@ -0,0 +1,3 @@
+import QuickEnter from "./quickenter";
+export type { TaroQuickEnterProps as QuickEnterProps } from "../../types";
+export default QuickEnter;

package/dist/es/packages/quickenter/index.js

@@ -0,0 +1,2 @@
+import QuickEnter from "./quickenter";
+export default QuickEnter;

package/dist/es/packages/quickenter/quickenter.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { QuickEnterActions, TaroQuickEnterProps } from "../../types";
+declare const QuickEnter: React.ForwardRefExoticComponent<Partial<TaroQuickEnterProps> & React.RefAttributes<QuickEnterActions>>;
+export default QuickEnter;

package/dist/es/packages/quickenter/quickenter.js

@@ -0,0 +1,141 @@
+import { _ as _define_property } from "@swc/helpers/_/_define_property";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
+import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
+import React, { useImperativeHandle } from "react";
+import { View } from "@tarojs/components";
+import Taro from "@tarojs/taro";
+import classNames from "classnames";
+import { Close } from "@nutui/icons-react-taro";
+import Popup from "../popup/index";
+import { ComponentDefaults } from "../../utils/typings";
+import { usePropsValue } from "../../hooks/use-props-value";
+import Badge from "../badge/index";
+import { useConfig } from "../configprovider";
+var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
+    options: [],
+    visible: false,
+    closeOnOverlayClick: true,
+    safeAreaInsetTop: true
+});
+var InternalQuickEnter = function InternalQuickEnter(props, ref) {
+    var _$_object_spread = _object_spread({}, defaultProps, props), children = _$_object_spread.children, visible = _$_object_spread.visible, title = _$_object_spread.title, _object_spread_options = _$_object_spread.options, options = _object_spread_options === void 0 ? [] : _object_spread_options, closeOnOverlayClick = _$_object_spread.closeOnOverlayClick, _object_spread_popupProps = _$_object_spread.popupProps, popupProps = _object_spread_popupProps === void 0 ? {} : _object_spread_popupProps, className = _$_object_spread.className, style = _$_object_spread.style, onClose = _$_object_spread.onClose, onChange = _$_object_spread.onChange, closeIcon = _$_object_spread.closeIcon, safeAreaInsetTop = _$_object_spread.safeAreaInsetTop, rest = _object_without_properties(_$_object_spread, [
+        "children",
+        "visible",
+        "title",
+        "options",
+        "closeOnOverlayClick",
+        "popupProps",
+        "className",
+        "style",
+        "onClose",
+        "onChange",
+        "closeIcon",
+        "safeAreaInsetTop"
+    ]);
+    var locale = useConfig().locale;
+    var mergedTitle = title || locale.quickenter.title;
+    var classPrefix = 'nut-quickenter';
+    var classes = classNames(classPrefix, className, {
+        'safe-area-top': safeAreaInsetTop
+    });
+    var _usePropsValue = _sliced_to_array(usePropsValue({
+        value: props.visible,
+        defaultValue: false,
+        finalValue: false,
+        onChange: function onChange(v) {
+            if (!v) {
+                var _props_onClose;
+                (_props_onClose = props.onClose) === null || _props_onClose === void 0 ? void 0 : _props_onClose.call(props);
+            }
+        }
+    }), 2), innerVisible = _usePropsValue[0], setInnerVisible = _usePropsValue[1];
+    var actions = {
+        open: function open() {
+            setInnerVisible(true);
+        },
+        close: function close() {
+            setInnerVisible(false);
+        }
+    };
+    useImperativeHandle(ref, function() {
+        return actions;
+    });
+    var onCancelEvent = function onCancelEvent() {
+        setInnerVisible(false);
+    };
+    var handleItemClick = function handleItemClick(item, index) {
+        if (item.url) {
+            Taro.navigateTo({
+                url: item.url
+            });
+        }
+        onChange === null || onChange === void 0 ? void 0 : onChange(item, index);
+    };
+    var renderTitleBar = function renderTitleBar() {
+        return /*#__PURE__*/ React.createElement(View, {
+            className: "".concat(classPrefix, "-control")
+        }, /*#__PURE__*/ React.createElement(View, {
+            className: "".concat(classPrefix, "-title")
+        }, mergedTitle), /*#__PURE__*/ React.createElement(View, {
+            className: "".concat(classPrefix, "-close-btn"),
+            onClick: function onClick(e) {
+                e.stopPropagation();
+                onCancelEvent();
+            }
+        }, closeIcon || /*#__PURE__*/ React.createElement(Close, {
+            ariaLabel: locale.close
+        })));
+    };
+    var renderContent = function renderContent() {
+        return /*#__PURE__*/ React.createElement(View, {
+            className: classNames("".concat(classPrefix, "-content"), _define_property({}, "".concat(classPrefix, "-content-scrollable"), options.length > 8))
+        }, /*#__PURE__*/ React.createElement(View, {
+            className: "".concat(classPrefix, "-list")
+        }, options.map(function(item, index) {
+            var _item_badge, _item_badge1;
+            var _item_badgeProps, _item_badgeProps1;
+            return /*#__PURE__*/ React.createElement(View, {
+                key: index,
+                className: "".concat(classPrefix, "-item"),
+                ariaLabel: "".concat(item.title, " ").concat((_item_badge = item.badge) !== null && _item_badge !== void 0 ? _item_badge : (_item_badgeProps = item.badgeProps) === null || _item_badgeProps === void 0 ? void 0 : _item_badgeProps.value),
+                onClick: function onClick() {
+                    return handleItemClick(item, index);
+                }
+            }, /*#__PURE__*/ React.createElement(View, {
+                className: "".concat(classPrefix, "-item-icon"),
+                ariaHidden: true
+            }, /*#__PURE__*/ React.createElement(Badge, _object_spread_props(_object_spread({}, item.badgeProps), {
+                value: (_item_badge1 = item.badge) !== null && _item_badge1 !== void 0 ? _item_badge1 : (_item_badgeProps1 = item.badgeProps) === null || _item_badgeProps1 === void 0 ? void 0 : _item_badgeProps1.value
+            }), item.icon)), /*#__PURE__*/ React.createElement(View, {
+                className: "".concat(classPrefix, "-item-title"),
+                ariaHidden: true
+            }, item.title));
+        })));
+    };
+    var renderQuickEnterElement = function renderQuickEnterElement() {
+        return /*#__PURE__*/ React.createElement(View, _object_spread({
+            className: classes,
+            style: style
+        }, rest), renderTitleBar(), children, renderContent());
+    };
+    return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(Popup, _object_spread_props(_object_spread({
+        style: {
+            background: 'transparent'
+        }
+    }, popupProps), {
+        overlayStyle: {
+            background: 'transparent'
+        },
+        visible: innerVisible,
+        position: "top",
+        onOverlayClick: function onOverlayClick() {
+            if (!closeOnOverlayClick) return;
+            onCancelEvent();
+        },
+        onClose: onCancelEvent
+    }), renderQuickEnterElement()));
+};
+var QuickEnter = /*#__PURE__*/ React.forwardRef(InternalQuickEnter);
+export default QuickEnter;

package/dist/es/packages/quickenter/style/css.js

@@ -0,0 +1,2 @@
+import '../../popup/style/css';
+import './style.css';

package/dist/es/packages/quickenter/style/index.js

@@ -0,0 +1,2 @@
+import '../../popup/style';
+import './quickenter.scss';

package/dist/es/packages/quickenter/style/quickenter.scss

@@ -0,0 +1,120 @@
+.nut-quickenter {
+  width: 100%;
+  /* 限制弹层最大高度，包含安全区 */
+  max-height: calc(#{$quickenter-max-height} + env(safe-area-inset-top, 0));
+  background: $quickenter-bg-color;
+  border-radius: 0 0 12px 12px;
+  overflow: hidden;
+  box-sizing: border-box;
+  display: flex;
+  flex-direction: column;
+  box-shadow: $quickenter-box-shadow;
+  // backdrop-filter: $quickenter-backdrop-filter;
+
+  &.safe-area-top {
+    /* 使用 env fallback，确保旧浏览器返回 0 */
+    padding-top: calc(
+      env(safe-area-inset-top, 0) * var(--nutui-safe-area-multiple, 1)
+    );
+  }
+
+  &-control {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 30px 16px 0;
+    box-sizing: border-box;
+  }
+
+  &-title {
+    flex: 1;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    text-align: left;
+    color: $quickenter-title-color;
+    font-size: $quickenter-title-font-size;
+  }
+
+  &-close-btn {
+    color: $quickenter-close-icon-color;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    svg,
+    .nut-icon {
+      width: $quickenter-close-icon-size;
+      height: $quickenter-close-icon-size;
+    }
+  }
+
+  &-content {
+    flex: 1;
+    padding: 10px 28px;
+    overflow-y: hidden; // 始终可滚动，防止内容被遮挡
+    box-sizing: border-box;
+
+    &-scrollable {
+      overflow-y: auto; // Only scroll when > 8 items
+      -webkit-overflow-scrolling: touch;
+    }
+  }
+
+  &-list {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: flex-start;
+    width: 100%;
+  }
+
+  &-item {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: flex-start;
+    width: 56px;
+    padding: 0 0 12px 0; // Reduced from 16px to ensure 2 rows fit in 256px
+    box-sizing: border-box;
+    cursor: pointer;
+
+    // Calculate gap for 4 items per row: (100% - 4 * 56px) / 3
+    margin-right: calc((100% - 224px) / 3);
+
+    &:nth-child(4n) {
+      margin-right: 0;
+    }
+
+    &-icon {
+      width: 56px;
+      height: 56px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border-radius: 50%;
+      background: $quickenter-item-icon-bg-color;
+      color: $quickenter-item-icon-color;
+      margin-bottom: 8px;
+      flex-shrink: 0;
+
+      svg,
+      .nut-icon {
+        width: 22px;
+        height: 22px;
+      }
+    }
+
+    &-title {
+      font-size: $quickenter-item-title-font-size;
+      color: $quickenter-item-title-color;
+      text-align: center;
+      line-height: 1.4;
+      // Allow multi-line if text is long, preventing truncation
+      white-space: normal;
+      word-wrap: break-word;
+      width: 72px; // Allow text to be slightly wider than icon
+      margin-left: -8px; // Center 72px title over 56px icon
+      margin-right: -8px;
+    }
+  }
+}