@nutui/nutui-react-taro 3.0.19-cpp.2 → 3.0.19-cpp.20

package/dist/nutui.react.umd.js

@@ -978,6 +978,7 @@
     select: "请选择",
     edit: "编辑",
     reset: "重置",
+    close: "关闭",
     video: {
       errorTip: "视频加载失败",
       clickRetry: "点击重试"
@@ -1123,7 +1124,8 @@
     },
     watermark: {
       errorCanvasTips: "当前环境不支持Canvas"
-    }
+    },
+    mask: "蒙层"
   };
   var classPrefix$t = "nut-configprovider";
   var defaultConfigRef = {
@@ -4303,6 +4305,12 @@
         return String(t.value) === String(value2);
       });
       index2 = index2 < 0 ? 0 : index2;
+      if (td()) {
+        return {
+          transform: direction === "horizontal" ? "translate3d(".concat(rtl ? "" : "-").concat(index2 * 50, "%, 0, 0)") : "translate3d( 0, -".concat(index2 * 50, "%, 0)"),
+          transitionDuration: "".concat(duration, "ms")
+        };
+      }
       return {
         transform: direction === "horizontal" ? "translate3d(".concat(rtl ? "" : "-").concat(index2 * 100, "%, 0, 0)") : "translate3d( 0, -".concat(index2 * 100, "%, 0)"),
         transitionDuration: "".concat(duration, "ms")
@@ -4417,7 +4425,7 @@
     var _$_object_spread = _object_spread({}, defaultProps$1d, props), children = _$_object_spread.children, visible = _$_object_spread.visible, overlay = _$_object_spread.overlay, closeOnOverlayClick = _$_object_spread.closeOnOverlayClick, overlayStyle = _$_object_spread.overlayStyle, overlayClassName = _$_object_spread.overlayClassName, zIndex = _$_object_spread.zIndex, lockScroll = _$_object_spread.lockScroll, duration = _$_object_spread.duration, closeable = _$_object_spread.closeable, closeIconPosition = _$_object_spread.closeIconPosition, closeIcon = _$_object_spread.closeIcon, left2 = _$_object_spread.left, title = _$_object_spread.title, top = _$_object_spread.top, description = _$_object_spread.description, style = _$_object_spread.style, transition = _$_object_spread.transition, round = _$_object_spread.round, position2 = _$_object_spread.position, className = _$_object_spread.className, destroyOnClose = _$_object_spread.destroyOnClose, portal = _$_object_spread.portal, resizable = _$_object_spread.resizable, minHeight = _$_object_spread.minHeight, onOpen = _$_object_spread.onOpen, onClose = _$_object_spread.onClose, onOverlayClick = _$_object_spread.onOverlayClick, onCloseIconClick = _$_object_spread.onCloseIconClick;
     _$_object_spread.afterShow;
     _$_object_spread.afterClose;
-    var onClick = _$_object_spread.onClick, onTouchStart = _$_object_spread.onTouchStart, onTouchMove = _$_object_spread.onTouchMove, onTouchEnd = _$_object_spread.onTouchEnd;
+    var onClick = _$_object_spread.onClick, onTouchStart = _$_object_spread.onTouchStart, onTouchMove = _$_object_spread.onTouchMove, onTouchEnd = _$_object_spread.onTouchEnd, closeAriaLabel = _$_object_spread.closeAriaLabel;
     var innerIndex = zIndex || _zIndex;
     var _useState = _sliced_to_array(React.useState(innerIndex), 2), index2 = _useState[0], setIndex = _useState[1];
     var _useState1 = _sliced_to_array(React.useState(visible), 2), innerVisible = _useState1[0], setInnerVisible = _useState1[1];
@@ -4433,6 +4441,7 @@
     var heightRef = React.useRef(0);
     var defaultHeightRef = React.useRef(0);
     var isTouching = React.useRef(false);
+    var locale = useConfig().locale;
     var classPrefix2 = "nut-popup";
     var overlayStyles = _object_spread({}, overlayStyle);
     var contentZIndex = harmony() ? index2 + 1 : index2;
@@ -4520,7 +4529,9 @@
       var closeClasses = classNames("".concat(classPrefix2, "-title-right"), "".concat(classPrefix2, "-title-right-").concat(closeIconPosition));
       return /* @__PURE__ */ React.createElement(React.Fragment, null, closeable && /* @__PURE__ */ React.createElement(components.View, {
         className: closeClasses,
-        onClick: handleCloseIconClick
+        onClick: handleCloseIconClick,
+        ariaRole: "button",
+        ariaLabel: closeAriaLabel || locale.close
       }, /* @__PURE__ */ React.isValidElement(closeIcon) ? closeIcon : /* @__PURE__ */ React.createElement(IconSVG$p, null)));
     };
     var renderTop = function() {
@@ -7044,9 +7055,12 @@
     };
     var _obj;
     return /* @__PURE__ */ React.createElement(components.View, _object_spread_props(_object_spread({
-      className: classNames(classPrefix$j, (_obj = {}, _define_property(_obj, "".concat(classPrefix$j, "-reverse"), labelPosition === "left"), _define_property(_obj, "nut-checkbox-list-item", ctx === null || ctx === void 0 ? void 0 : ctx.list), _obj), className)
+      className: classNames(classPrefix$j, (_obj = {}, _define_property(_obj, "".concat(classPrefix$j, "-reverse"), labelPosition === "left"), _define_property(_obj, "nut-checkbox-list-item", ctx === null || ctx === void 0 ? void 0 : ctx.list), _define_property(_obj, "".concat(classPrefix$j, "-active"), innerChecked), _obj), className)
     }, rest), {
-      onClick: handleClick
+      onClick: handleClick,
+      ariaRole: "checkbox",
+      tabIndex: innerDisabled ? -1 : 0,
+      ariaChecked: innerIndeterminate ? "mixed" : innerChecked
     }), renderCheckboxItem());
   };
   Checkbox.displayName = "NutCheckBox";
@@ -12640,7 +12654,7 @@
     var _ref = _object_spread({}, defaultProps$T, props), children = _ref.children, className = _ref.className, style = _ref.style, checked = _ref.checked, defaultChecked = _ref.defaultChecked, shape = _ref.shape, value2 = _ref.value;
     _ref.icon;
     _ref.activeIcon;
-    var onChange = _ref.onChange, others = _object_without_properties(_ref, [
+    var onChange = _ref.onChange, ariaLabel = _ref.ariaLabel, others = _object_without_properties(_ref, [
       "children",
       "className",
       "style",
@@ -12650,7 +12664,8 @@
       "value",
       "icon",
       "activeIcon",
-      "onChange"
+      "onChange",
+      "ariaLabel"
     ]);
     var labelPosition = others.labelPosition, disabled = others.disabled;
     var _usePropsValue = _sliced_to_array(usePropsValue({
@@ -12727,7 +12742,12 @@
     return /* @__PURE__ */ React.createElement(components.View, {
       className: cls,
       style,
-      onClick: handleClick
+      onClick: handleClick,
+      ariaRole: "radio",
+      ariaLabel,
+      // @ts-ignore
+      ariaChecked: checkedStatement,
+      ariaDisabled: disabled
     }, renderRadioItem());
   };
   Radio.displayName = "NutRadio";
@@ -13980,7 +14000,11 @@
     var initCanvas = function() {
       Taro.nextTick(function() {
         setTimeout(function() {
-          if (Taro.getEnv() === "WEAPP" || Taro.getEnv() === "JD") {
+          if ([
+            "WEAPP",
+            "JD",
+            "ASCF"
+          ].includes(Taro.getEnv())) {
             Taro.createSelectorQuery().select("#".concat(canvasId)).fields({
               node: true,
               size: true
@@ -14007,7 +14031,11 @@
     }, rest), /* @__PURE__ */ React.createElement(components.View, {
       className: "".concat(classPrefix2, "-inner spcanvas_WEAPP"),
       ref: wrapRef
-    }, Taro.getEnv() === "WEAPP" || Taro.getEnv() === "JD" ? /* @__PURE__ */ React.createElement("canvas", {
+    }, [
+      "WEAPP",
+      "JD",
+      "ASCF"
+    ].includes(Taro.getEnv()) ? /* @__PURE__ */ React.createElement("canvas", {
       id: canvasId,
       ref: canvasRef,
       // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -14041,7 +14069,7 @@
     }
   });
   var Switch = function(props) {
-    var _ref = _object_spread({}, defaultProps$M, props), checked = _ref.checked, defaultChecked = _ref.defaultChecked, disabled = _ref.disabled, activeText = _ref.activeText, inactiveText = _ref.inactiveText, loadingIcon = _ref.loadingIcon, className = _ref.className, style = _ref.style, onChange = _ref.onChange, propLoading = _ref.loading, onLoadingChange = _ref.onLoadingChange, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$M, props), checked = _ref.checked, defaultChecked = _ref.defaultChecked, disabled = _ref.disabled, activeText = _ref.activeText, inactiveText = _ref.inactiveText, loadingIcon = _ref.loadingIcon, className = _ref.className, style = _ref.style, onChange = _ref.onChange, propLoading = _ref.loading, onLoadingChange = _ref.onLoadingChange, ariaLabel = _ref.ariaLabel, rest = _object_without_properties(_ref, [
       "checked",
       "defaultChecked",
       "disabled",
@@ -14052,7 +14080,8 @@
       "style",
       "onChange",
       "loading",
-      "onLoadingChange"
+      "onLoadingChange",
+      "ariaLabel"
     ]);
     var classPrefix2 = "nut-switch";
     var rtl = useRtl();
@@ -14133,7 +14162,13 @@
     return /* @__PURE__ */ React.createElement(components.View, _object_spread({
       className: classes(),
       onClick,
-      style
+      style,
+      ariaRole: "switch",
+      // @ts-ignore
+      ariaChecked: value2,
+      ariaDisabled: disabled,
+      tabIndex: disabled ? -1 : 0,
+      ariaLabel
     }, rest), /* @__PURE__ */ React.createElement(components.View, {
       className: classNames([
         [
@@ -14163,7 +14198,7 @@
   });
   var TextArea = /* @__PURE__ */ React.forwardRef(function(props, ref) {
     var locale = useConfig().locale;
-    var _ref = _object_spread({}, defaultProps$L, props), className = _ref.className, value2 = _ref.value, defaultValue = _ref.defaultValue, showCount = _ref.showCount, maxLength = _ref.maxLength, rows = _ref.rows, placeholder = _ref.placeholder, readOnly = _ref.readOnly, disabled = _ref.disabled, autoSize = _ref.autoSize, style = _ref.style, plain = _ref.plain, status = _ref.status, onChange = _ref.onChange, onBlur = _ref.onBlur, onFocus = _ref.onFocus, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$L, props), className = _ref.className, value2 = _ref.value, defaultValue = _ref.defaultValue, showCount = _ref.showCount, maxLength = _ref.maxLength, rows = _ref.rows, placeholder = _ref.placeholder, readOnly = _ref.readOnly, disabled = _ref.disabled, autoSize = _ref.autoSize, style = _ref.style, plain = _ref.plain, status = _ref.status, viewId = _ref.viewId, onChange = _ref.onChange, onBlur = _ref.onBlur, onFocus = _ref.onFocus, rest = _object_without_properties(_ref, [
       "className",
       "value",
       "defaultValue",
@@ -14177,6 +14212,7 @@
       "style",
       "plain",
       "status",
+      "viewId",
       "onChange",
       "onBlur",
       "onFocus"
@@ -14238,6 +14274,7 @@
     });
     var _obj;
     return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(components.View, {
+      id: viewId,
       className: classNames(classPrefix2, (_obj = {}, _define_property(_obj, "".concat(classPrefix2, "-disabled"), disabled), _define_property(_obj, "".concat(classPrefix2, "-readonly"), readOnly), _define_property(_obj, "".concat(classPrefix2, "-rtl"), rtl), _define_property(_obj, "".concat(classPrefix2, "-plain"), plain), _define_property(_obj, "".concat(classPrefix2, "-container"), !plain), _define_property(_obj, "".concat(classPrefix2, "-").concat(status), status), _obj), className)
     }, /* @__PURE__ */ React.createElement(components.Textarea, _object_spread_props(_object_spread({}, rest), {
       ref: textareaRef,
@@ -14262,7 +14299,8 @@
       onFocus: handleFocus,
       autoHeight: autoSize,
       maxlength: maxLength,
-      placeholder: placeholder !== void 0 ? placeholder : locale.placeholder
+      placeholder: placeholder !== void 0 ? placeholder : locale.placeholder,
+      showCount
     })), showCount && /* @__PURE__ */ React.createElement(components.View, {
       className: classNames("".concat(classPrefix2, "-limit"), _define_property({}, "".concat(classPrefix2, "-limit-disabled"), disabled))
     }, innerValue.length, "/", maxLength < 0 ? 0 : maxLength)));
@@ -14700,7 +14738,8 @@
       if ([
         "WEAPP",
         "JD",
-        "WEB"
+        "WEB",
+        "ASCF"
       ].includes(env) && Taro.chooseMedia) {
         Taro.chooseMedia({
           count: multiple ? maxCount * 1 - fileList.length : 1,
@@ -15116,6 +15155,8 @@
     content: "",
     header: "",
     footer: "",
+    cancelBadge: "",
+    confirmBadge: "",
     confirmText: "",
     cancelText: "",
     hideConfirmButton: false,
@@ -15145,7 +15186,7 @@
     }
   });
   var BaseDialog = function(props) {
-    var _useParams = useParams(mergeProps(defaultProps$H, props)), _useParams_params = _useParams.params, id = _useParams_params.id, closeOnOverlayClick = _useParams_params.closeOnOverlayClick, confirmText = _useParams_params.confirmText, cancelText = _useParams_params.cancelText, children = _useParams_params.children, className = _useParams_params.className, closeIconPosition = _useParams_params.closeIconPosition, closeIcon = _useParams_params.closeIcon, content2 = _useParams_params.content, disableConfirmButton = _useParams_params.disableConfirmButton, footer = _useParams_params.footer, footerDirection = _useParams_params.footerDirection, header = _useParams_params.header, hideConfirmButton = _useParams_params.hideConfirmButton, hideCancelButton = _useParams_params.hideCancelButton, lockScroll = _useParams_params.lockScroll, overlay = _useParams_params.overlay, overlayStyle = _useParams_params.overlayStyle, overlayClassName = _useParams_params.overlayClassName, style = _useParams_params.style, title = _useParams_params.title, visible = _useParams_params.visible, zIndex = _useParams_params.zIndex, beforeCancel = _useParams_params.beforeCancel, beforeClose = _useParams_params.beforeClose, onClose = _useParams_params.onClose, onCancel = _useParams_params.onCancel, onConfirm = _useParams_params.onConfirm, onOverlayClick = _useParams_params.onOverlayClick, setParams = _useParams.setParams;
+    var _useParams = useParams(mergeProps(defaultProps$H, props)), _useParams_params = _useParams.params, id = _useParams_params.id, closeOnOverlayClick = _useParams_params.closeOnOverlayClick, confirmText = _useParams_params.confirmText, cancelText = _useParams_params.cancelText, children = _useParams_params.children, className = _useParams_params.className, closeIconPosition = _useParams_params.closeIconPosition, closeIcon = _useParams_params.closeIcon, content2 = _useParams_params.content, disableConfirmButton = _useParams_params.disableConfirmButton, footer = _useParams_params.footer, footerDirection = _useParams_params.footerDirection, header = _useParams_params.header, cancelBadge = _useParams_params.cancelBadge, confirmBadge = _useParams_params.confirmBadge, hideConfirmButton = _useParams_params.hideConfirmButton, hideCancelButton = _useParams_params.hideCancelButton, lockScroll = _useParams_params.lockScroll, overlay = _useParams_params.overlay, overlayStyle = _useParams_params.overlayStyle, overlayClassName = _useParams_params.overlayClassName, style = _useParams_params.style, title = _useParams_params.title, visible = _useParams_params.visible, zIndex = _useParams_params.zIndex, beforeCancel = _useParams_params.beforeCancel, beforeClose = _useParams_params.beforeClose, onClose = _useParams_params.onClose, onCancel = _useParams_params.onCancel, onConfirm = _useParams_params.onConfirm, onOverlayClick = _useParams_params.onOverlayClick, setParams = _useParams.setParams;
     var classPrefix2 = "nut-dialog";
     var locale = useConfig().locale;
     var _useState = _sliced_to_array(React.useState(false), 2), loading = _useState[0], setLoading = _useState[1];
@@ -15215,17 +15256,43 @@
         }, cancelText || locale.cancel);
       };
       var renderCancel = function() {
-        return !hideCancelButton && /* @__PURE__ */ React.createElement(Button, {
+        return !hideCancelButton && /* @__PURE__ */ React.createElement(React.Fragment, null, cancelBadge ? /* @__PURE__ */ React.createElement(components.View, {
+          className: "".concat(classPrefix2, "-footer-cancel-container")
+        }, /* @__PURE__ */ React.createElement(Button, {
           type: "default",
           size: "large",
           className: "".concat(classPrefix2, "-footer-cancel ").concat(btnClass),
           onClick: function(e) {
             return handleCancel(e);
           }
-        }, cancelText || locale.cancel);
+        }, cancelText || locale.cancel), cancelBadge ? /* @__PURE__ */ React.createElement(components.View, {
+          className: "".concat(classPrefix2, "-footer-cancel-badge")
+        }, cancelBadge) : null) : /* @__PURE__ */ React.createElement(Button, {
+          type: "default",
+          size: "large",
+          className: "".concat(classPrefix2, "-footer-cancel ").concat(btnClass),
+          onClick: function(e) {
+            return handleCancel(e);
+          }
+        }, cancelText || locale.cancel));
       };
       var renderConfirm = function() {
-        return !hideConfirmButton && /* @__PURE__ */ React.createElement(Button, {
+        return !hideConfirmButton && /* @__PURE__ */ React.createElement(React.Fragment, null, confirmBadge ? /* @__PURE__ */ React.createElement(components.View, {
+          className: "".concat(classPrefix2, "-footer-ok-container")
+        }, /* @__PURE__ */ React.createElement(Button, {
+          type: "primary",
+          size: "large",
+          className: classNames("".concat(classPrefix2, "-footer-ok ").concat(btnClass), {
+            disabled: disableConfirmButton
+          }),
+          disabled: disableConfirmButton,
+          onClick: function(e) {
+            return handleOk(e);
+          },
+          loading
+        }, confirmText || locale.confirm), confirmBadge ? /* @__PURE__ */ React.createElement(components.View, {
+          className: "".concat(classPrefix2, "-footer-ok-badge")
+        }, confirmBadge) : null) : /* @__PURE__ */ React.createElement(Button, {
           type: "primary",
           size: "large",
           className: classNames("".concat(classPrefix2, "-footer-ok ").concat(btnClass), {
@@ -15236,7 +15303,7 @@
             return handleOk(e);
           },
           loading
-        }, confirmText || locale.confirm);
+        }, confirmText || locale.confirm));
       };
       return footer || /* @__PURE__ */ React.createElement(React.Fragment, null, footerDirection === "vertical" ? /* @__PURE__ */ React.createElement(React.Fragment, null, renderConfirm(), renderCancelOfVertical()) : /* @__PURE__ */ React.createElement(React.Fragment, null, renderCancel(), renderConfirm()));
     };
@@ -15251,7 +15318,11 @@
       var systomIcon = closeIconPosition !== "bottom" ? /* @__PURE__ */ React.createElement(IconSVG$p, null) : /* @__PURE__ */ React.createElement(IconSVG$n, null);
       return /* @__PURE__ */ React.createElement(components.View, {
         className: closeClasses,
-        onClick: handleClose
+        onClick: handleClose,
+        ariaRole: "button",
+        ariaLabel: locale.close,
+        // @ts-ignore
+        tabIndex: 0
       }, /* @__PURE__ */ React.isValidElement(closeIcon) ? closeIcon : systomIcon);
     };
     var onHandleClickOverlay = function(e) {
@@ -15803,7 +15874,10 @@
     var classPrefix2 = "nut-noticebar";
     var wrapRef = React.useRef(null);
     var contentRef = React.useRef(null);
-    var _useState = _sliced_to_array(React.useState(true), 2), showNoticeBar = _useState[0], SetShowNoticeBar = _useState[1];
+    var uid = useUuid();
+    var wrapRefId = "wrap-ref-".concat(uid);
+    var contentRefId = "content-ref-".concat(uid);
+    var _useState = _sliced_to_array(React.useState(true), 2), showNoticeBar = _useState[0], setShowNoticeBar = _useState[1];
     var scrollList = React.useRef([]);
     var _useState1 = _sliced_to_array(React.useState(0), 2), wrapWidth = _useState1[0], SetWrapWidth = _useState1[1];
     var _useState2 = _sliced_to_array(React.useState(true), 2), firstRound = _useState2[0], SetFirstRound = _useState2[1];
@@ -15881,11 +15955,11 @@
     }, [
       list
     ]);
-    var initScrollWrap = function(value2) {
+    var initScrollWrap = function() {
       if (showNoticeBar === false) {
         return;
       }
-      setTimeout(function() {
+      Taro.nextTick(function() {
         return _async_to_generator(function() {
           var warpRes, contentRes, wrapW, offsetW, canScroll;
           return __generator(this, function(_state) {
@@ -15898,16 +15972,19 @@
                 }
                 return [
                   4,
-                  getRectInMultiPlatform(wrapRef.current)
+                  getRectInMultiPlatform(wrapRef.current, wrapRefId)
                 ];
               case 1:
                 warpRes = _state.sent();
                 return [
                   4,
-                  getRectInMultiPlatform(contentRef.current)
+                  getRectInMultiPlatform(contentRef.current, contentRefId)
                 ];
               case 2:
                 contentRes = _state.sent();
+                if (!warpRes || !contentRes) return [
+                  2
+                ];
                 wrapW = warpRes.width;
                 offsetW = contentRes.width;
                 canScroll = align === "left" && scrollable == null ? offsetW > wrapW : scrollable;
@@ -15926,18 +16003,12 @@
             }
           });
         })();
-      }, 0);
+      });
     };
     var handleClick = function(event) {
       click && click(event);
       onClick && onClick(event);
     };
-    var onClickIcon = function(event) {
-      event.stopPropagation();
-      SetShowNoticeBar(!closeable);
-      close2 && close2(event);
-      onClose && onClose(event);
-    };
     var onAnimationEnd = function() {
       SetFirstRound(false);
       setTimeout(function() {
@@ -15960,12 +16031,16 @@
         SetAnimate(false);
       }, time2);
     };
-    var handleClickIcon = function(event) {
+    var handleClickIcon = React.useCallback(function(event) {
       event.stopPropagation();
-      SetShowNoticeBar(!closeable);
+      setShowNoticeBar(!closeable);
       close2 && close2(event);
       onClose && onClose(event);
-    };
+    }, [
+      close2,
+      onClose,
+      closeable
+    ]);
     var isEllipsis = function() {
       if (isCanScroll == null && align === "left") {
         return wrap;
@@ -16104,10 +16179,11 @@
       target.style.transform = "translate3D(0,".concat(_offset, "px,0)");
     };
     var itemStyle = function(index2) {
-      var style2 = {};
+      var style2 = {
+        width: "100%"
+      };
       if (height2) {
         style2.height = "".concat(height2, "px");
-        style2.lineHeight = "".concat(height2, "px");
       }
       var offset2 = childOffset[index2];
       if (offset2) {
@@ -16171,6 +16247,32 @@
       container.current = ref;
       setIsContainerReady(true);
     }, []);
+    var renderLeftIcon = React.useCallback(function() {
+      return /* @__PURE__ */ React.createElement(React.Fragment, null, leftIcon ? /* @__PURE__ */ React.createElement(components.View, {
+        className: "nut-noticebar-box-left-icon"
+      }, leftIcon) : null);
+    }, [
+      leftIcon
+    ]);
+    var renderRight = React.useCallback(function() {
+      return /* @__PURE__ */ React.createElement(React.Fragment, null, right2 ? /* @__PURE__ */ React.createElement(components.View, {
+        className: "nut-noticebar-box-right"
+      }, right2) : null);
+    }, [
+      right2
+    ]);
+    var renderRightIcon = React.useCallback(function() {
+      return /* @__PURE__ */ React.createElement(React.Fragment, null, rightIcon || closeable ? /* @__PURE__ */ React.createElement(components.View, {
+        className: "nut-noticebar-box-right-icon",
+        onClick: handleClickIcon
+      }, rightIcon || /* @__PURE__ */ React.createElement(IconSVG$p, {
+        size: 12
+      })) : null);
+    }, [
+      rightIcon,
+      closeable,
+      handleClickIcon
+    ]);
     return /* @__PURE__ */ React.createElement(components.View, {
       className: cls,
       style
@@ -16178,31 +16280,22 @@
       className: noticebarClass,
       style: barStyle,
       onClick: handleClick
-    }, leftIcon ? /* @__PURE__ */ React.createElement(components.View, {
-      className: "nut-noticebar-box-left-icon"
-    }, leftIcon) : null, /* @__PURE__ */ React.createElement(components.View, {
+    }, renderLeftIcon(), /* @__PURE__ */ React.createElement(components.View, {
       ref: wrapRef,
-      className: "nut-noticebar-box-wrap"
+      className: "nut-noticebar-box-wrap",
+      id: wrapRefId
     }, /* @__PURE__ */ React.createElement(components.View, {
       ref: contentRef,
+      id: contentRefId,
       className: "nut-noticebar-box-wrap-content ".concat(animationClass, " ").concat(isEllipsis() ? "nut-ellipsis" : ""),
       style: contentStyle,
       onAnimationEnd
-    }, children, content2)), right2 ? /* @__PURE__ */ React.createElement(components.View, {
-      className: "nut-noticebar-box-right"
-    }, right2) : null, closeable || rightIcon ? /* @__PURE__ */ React.createElement(components.View, {
-      className: "nut-noticebar-box-right-icon",
-      onClick: onClickIcon
-    }, rightIcon || /* @__PURE__ */ React.createElement(IconSVG$p, {
-      size: 12
-    })) : null) : null, showNoticeBar && hasVerticalContent && isVertical ? /* @__PURE__ */ React.createElement(components.View, {
+    }, children, content2)), renderRight(), renderRightIcon()) : null, showNoticeBar && hasVerticalContent && isVertical ? /* @__PURE__ */ React.createElement(components.View, {
       className: "nut-noticebar-vertical",
       style: barStyle,
       ref: containerRefCallback,
       onClick: handleClick
-    }, leftIcon ? /* @__PURE__ */ React.createElement(components.View, {
-      className: "nut-noticebar-box-left-icon"
-    }, leftIcon) : null, children ? /* @__PURE__ */ React.createElement(components.View, {
+    }, renderLeftIcon(), children ? /* @__PURE__ */ React.createElement(components.View, {
       className: "nut-noticebar-box-wrap",
       ref: innerRef
     }, scrollList.current.map(function(item, index2) {
@@ -16217,27 +16310,17 @@
       className: "nut-noticebar-box-horseLamp-list",
       style: horseLampStyle
     }, scrollList.current.map(function(item, index2) {
-      return (
-        // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
-        /* @__PURE__ */ React.createElement(components.View, {
-          className: "nut-noticebar-box-horseLamp-list-item",
-          style: {
-            height: height2
-          },
-          key: index2,
-          onClick: function(e) {
-            handleItemClick(e, item);
-          }
-        }, item)
-      );
-    })), /* @__PURE__ */ React.createElement(components.View, {
-      className: "nut-noticebar-box-right-icon",
-      onClick: function(e) {
-        handleClickIcon(e);
-      }
-    }, rightIcon || (closeable ? /* @__PURE__ */ React.createElement(IconSVG$p, {
-      size: 12
-    }) : null))) : null);
+      return /* @__PURE__ */ React.createElement(components.View, {
+        className: "nut-noticebar-box-horseLamp-list-item",
+        style: {
+          height: height2
+        },
+        key: index2,
+        onClick: function(e) {
+          handleItemClick(e, item);
+        }
+      }, item);
+    })), renderRight(), renderRightIcon()) : null);
   };
   NoticeBar.displayName = "NutNoticeBar";
   var defaultProps$B = _object_spread_props(_object_spread({}, ComponentDefaults), {
@@ -17355,12 +17438,15 @@
       id
     }, /* @__PURE__ */ React.createElement(components.View, {
       className: classNames("".concat(classPrefix2, "-inner"), "".concat(classPrefix2, "-").concat(position2), contentClassName, "".concat(classPrefix2, "-inner-").concat(size), "".concat(classPrefix2, "-inner-").concat(wordBreak), _define_property({}, "".concat(classPrefix2, "-inner-descrption"), content2)),
-      style: _object_spread({}, styles, contentStyle)
+      style: _object_spread({}, styles, contentStyle),
+      ariaRole: "alert"
     }, renderIcon(), title && /* @__PURE__ */ React.createElement(components.Text, {
       className: "".concat(classPrefix2, "-title")
-    }, title), content2 && /* @__PURE__ */ React.createElement(components.View, {
+    }, title), content2 && (td() ? /* @__PURE__ */ React.createElement(components.Text, {
       className: "".concat(classPrefix2, "-text")
-    }, content2)))));
+    }, content2) : /* @__PURE__ */ React.createElement(components.View, {
+      className: "".concat(classPrefix2, "-text")
+    }, content2))))));
   };
   function show(selector, options) {
     var path = useCustomEventsPath(selector);
@@ -39854,7 +39940,7 @@
         style: priceColorStyle
       }, formatDecimal(price))) : null, symbol && position2 === "after" ? renderSymbol() : null);
     };
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, harmony() ? /* @__PURE__ */ React.createElement(components.Text, {
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, harmony() || process.env.TARO_ENV === "dynamic" ? /* @__PURE__ */ React.createElement(components.Text, {
       className: "".concat(classPrefix2, " ").concat(classPrefix2, "-").concat(color, " ").concat(className),
       style
     }, renderInner()) : /* @__PURE__ */ React.createElement(components.View, {
@@ -39985,7 +40071,7 @@
     ]);
     var renderContent = React.useMemo(function() {
       if (!title && !description) return null;
-      return /* @__PURE__ */ React.createElement("div", {
+      return /* @__PURE__ */ React.createElement(components.View, {
         className: "".concat(classPrefix2, "-main")
       }, title && /* @__PURE__ */ React.createElement(components.View, {
         className: "".concat(classPrefix2, "-title")
@@ -39996,7 +40082,7 @@
       title,
       description
     ]);
-    return /* @__PURE__ */ React.createElement("div", {
+    return /* @__PURE__ */ React.createElement(components.View, {
       className: classes,
       style,
       onClick: handleClickStep
@@ -40025,7 +40111,7 @@
     propSteps.value;
     var layout = propSteps.layout, status = propSteps.status, type2 = propSteps.type, className = propSteps.className, children = propSteps.children;
     propSteps.onStepClick;
-    var restProps = _object_without_properties(propSteps, [
+    _object_without_properties(propSteps, [
       "direction",
       "value",
       "layout",
@@ -40043,9 +40129,9 @@
     var classes = classNames(classPrefix2, (_obj = {}, _define_property(_obj, "".concat(classPrefix2, "-").concat(direction), true), _define_property(_obj, "".concat(classPrefix2, "-").concat(direction, "-count-").concat(React.Children.count(children)), true), _define_property(_obj, "".concat(classPrefix2, "-").concat(direction, "-").concat(layout), true), _define_property(_obj, "".concat(classPrefix2, "-").concat(direction, "-").concat(type2), true), _define_property(_obj, "".concat(classPrefix2, "-").concat(direction, "-").concat(status), true), _obj), className);
     return /* @__PURE__ */ React.createElement(DataContext.Provider, {
       value: parentSteps
-    }, /* @__PURE__ */ React.createElement("div", _object_spread({
+    }, /* @__PURE__ */ React.createElement(components.View, {
       className: classes
-    }, restProps), React.Children.map(children, function(child, index2) {
+    }, React.Children.map(children, function(child, index2) {
       if (/* @__PURE__ */ React.isValidElement(child)) {
         return /* @__PURE__ */ React.cloneElement(child, {
           // @ts-ignore