@nutui/nutui-react 2.3.12-beta.0 → 2.4.0-beta.0

package/dist/esm/NoticeBar.js

@@ -1,70 +1,33 @@
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-function ownKeys(e, r) {
-  var t = Object.keys(e);
-  if (Object.getOwnPropertySymbols) {
-    var o = Object.getOwnPropertySymbols(e);
-    r && (o = o.filter(function(r2) {
-      return Object.getOwnPropertyDescriptor(e, r2).enumerable;
-    })), t.push.apply(t, o);
-  }
-  return t;
-}
-function _objectSpread(e) {
-  for (var r = 1; r < arguments.length; r++) {
-    var t = null != arguments[r] ? arguments[r] : {};
-    r % 2 ? ownKeys(Object(t), true).forEach(function(r2) {
-      _defineProperty(e, r2, t[r2]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) {
-      Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2));
-    });
-  }
-  return e;
-}
 import React__default, { useRef, useState, useMemo, useEffect } from "react";
 import { Notice, Close } from "@nutui/icons-react";
 import classNames from "classnames";
 import { g as getRect } from "./use-client-rect.js";
 import { C as ComponentDefaults } from "./typings.js";
-var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
-  direction: "horizontal",
-  list: [],
-  duration: 1e3,
-  height: 40,
-  content: "",
-  closeable: false,
-  wrap: false,
-  leftIcon: React__default.createElement(Notice, {
-    width: 16,
-    height: 16
-  }),
-  rightIcon: null,
-  delay: 1,
-  scrollable: null,
-  speed: 50
-});
-var NoticeBar = function NoticeBar2(props) {
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, className = _defaultProps$props.className, style = _defaultProps$props.style, direction = _defaultProps$props.direction, list = _defaultProps$props.list, duration = _defaultProps$props.duration, height = _defaultProps$props.height, content = _defaultProps$props.content, closeable = _defaultProps$props.closeable, wrap = _defaultProps$props.wrap, leftIcon = _defaultProps$props.leftIcon, rightIcon = _defaultProps$props.rightIcon, delay = _defaultProps$props.delay, scrollable = _defaultProps$props.scrollable, speed = _defaultProps$props.speed, close = _defaultProps$props.close, click = _defaultProps$props.click, onClose = _defaultProps$props.onClose, onClick = _defaultProps$props.onClick, onItemClick = _defaultProps$props.onItemClick;
-  var classPrefix = "nut-noticebar";
-  var wrapRef = useRef(null);
-  var contentRef = useRef(null);
-  var _useState = useState(true), _useState2 = _slicedToArray(_useState, 2), showNoticeBar = _useState2[0], SetShowNoticeBar = _useState2[1];
-  var scrollList = useRef([]);
-  var _useState3 = useState(0), _useState4 = _slicedToArray(_useState3, 2), wrapWidth = _useState4[0], SetWrapWidth = _useState4[1];
-  var _useState5 = useState(true), _useState6 = _slicedToArray(_useState5, 2), firstRound = _useState6[0], SetFirstRound = _useState6[1];
-  var _useState7 = useState(0), _useState8 = _slicedToArray(_useState7, 2), animationDuration = _useState8[0], SetAnimationDuration = _useState8[1];
-  var _useState9 = useState(0), _useState10 = _slicedToArray(_useState9, 2), offsetWidth = _useState10[0], SetOffsetW = _useState10[1];
-  var _useState11 = useState(""), _useState12 = _slicedToArray(_useState11, 2), animationClass = _useState12[0], SetAnimationClass = _useState12[1];
-  var _useState13 = useState(false), _useState14 = _slicedToArray(_useState13, 2), animate = _useState14[0], SetAnimate = _useState14[1];
-  var _useState15 = useState(0), _useState16 = _slicedToArray(_useState15, 2), timer = _useState16[0], SetTimer = _useState16[1];
-  var _useState17 = useState(null), _useState18 = _slicedToArray(_useState17, 2), isCanScroll = _useState18[0], SetIsCanScroll = _useState18[1];
-  var isVertical = direction === "vertical";
-  var _useState19 = useState(null), _useState20 = _slicedToArray(_useState19, 2), rect = _useState20[0], setRect = _useState20[1];
-  var active = 0;
-  var _useState21 = useState(false), _useState22 = _slicedToArray(_useState21, 2), ready = _useState22[0], setReady = _useState22[1];
-  var container = useRef(null);
-  var innerRef = useRef(null);
-  var swiperRef = useRef({
+import { useRtl } from "./ConfigProvider.js";
+const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { align: "left", direction: "horizontal", list: [], duration: 1e3, height: 40, content: "", closeable: false, wrap: false, leftIcon: React__default.createElement(Notice, { width: 16, height: 16 }), rightIcon: null, delay: 1, scrollable: null, speed: 50 });
+const NoticeBar = (props) => {
+  const rtl = useRtl();
+  const { children, className, style, align, direction, list, duration, height, content, closeable, wrap, leftIcon, rightIcon, delay, scrollable, speed, close, click, onClose, onClick, onItemClick } = Object.assign(Object.assign({}, defaultProps), props);
+  const classPrefix = "nut-noticebar";
+  const wrapRef = useRef(null);
+  const contentRef = useRef(null);
+  const [showNoticeBar, SetShowNoticeBar] = useState(true);
+  const scrollList = useRef([]);
+  const [wrapWidth, SetWrapWidth] = useState(0);
+  const [firstRound, SetFirstRound] = useState(true);
+  const [animationDuration, SetAnimationDuration] = useState(0);
+  const [offsetWidth, SetOffsetW] = useState(0);
+  const [animationClass, SetAnimationClass] = useState("");
+  const [animate, SetAnimate] = useState(false);
+  const [timer, SetTimer] = useState(0);
+  const [isCanScroll, SetIsCanScroll] = useState(null);
+  const isVertical = direction === "vertical";
+  const [rect, setRect] = useState(null);
+  let active = 0;
+  const [ready, setReady] = useState(false);
+  const container = useRef(null);
+  const innerRef = useRef(null);
+  const swiperRef = useRef({
     moving: false,
     autoplayTimer: null,
     width: 0,
@@ -72,11 +35,11 @@ var NoticeBar = function NoticeBar2(props) {
     offset: 0,
     size: 0
   });
-  var _useState23 = useState([]), _useState24 = _slicedToArray(_useState23, 2), childOffset = _useState24[0], setChildOffset = _useState24[1];
-  var _useState25 = useState(0), _useState26 = _slicedToArray(_useState25, 2), offset = _useState26[0], setOffset = _useState26[1];
-  var _useMemo = useMemo(function() {
-    var childCount2 = 0;
-    var childs2 = React__default.Children.map(children, function(child) {
+  const [childOffset, setChildOffset] = useState([]);
+  const [offset, setOffset] = useState(0);
+  const { childs, childCount } = useMemo(() => {
+    let childCount2 = 0;
+    const childs2 = React__default.Children.map(children, (child) => {
       if (!React__default.isValidElement(child))
         return null;
       childCount2++;
@@ -86,16 +49,16 @@ var NoticeBar = function NoticeBar2(props) {
       childs: childs2,
       childCount: childCount2
     };
-  }, [children]), childs = _useMemo.childs, childCount = _useMemo.childCount;
-  var trackSize = childCount * Number(height);
-  var minOffset = function() {
+  }, [children]);
+  let trackSize = childCount * Number(height);
+  const minOffset = (() => {
     if (rect) {
-      var base = isVertical ? rect.height : rect.width;
+      const base = isVertical ? rect.height : rect.width;
       return base - Number(height) * childCount;
     }
     return 0;
-  }();
-  useEffect(function() {
+  })();
+  useEffect(() => {
     if (isVertical) {
       if (children) {
         scrollList.current = [].concat(childs);
@@ -106,29 +69,29 @@ var NoticeBar = function NoticeBar2(props) {
     } else {
       initScrollWrap();
     }
-    return function() {
+    return () => {
       clearInterval(timer);
     };
   }, []);
-  useEffect(function() {
+  useEffect(() => {
     initScrollWrap();
   }, [content]);
-  useEffect(function() {
+  useEffect(() => {
     if (list && list.length) {
       scrollList.current = [].concat(list);
     }
   }, [list]);
-  var initScrollWrap = function initScrollWrap2(value) {
+  const initScrollWrap = (value) => {
     if (showNoticeBar === false) {
       return;
     }
-    setTimeout(function() {
+    setTimeout(() => {
       if (!wrapRef.current || !contentRef.current) {
         return;
       }
-      var wrapW = getRect(wrapRef.current).width;
-      var offsetW = getRect(contentRef.current).width;
-      var canScroll = scrollable == null ? offsetW > wrapW : scrollable;
+      const wrapW = getRect(wrapRef.current).width;
+      const offsetW = getRect(contentRef.current).width;
+      const canScroll = align === "left" && scrollable == null ? offsetW > wrapW : scrollable;
       SetIsCanScroll(canScroll);
       if (canScroll) {
         SetWrapWidth(wrapW);
@@ -140,70 +103,69 @@ var NoticeBar = function NoticeBar2(props) {
       }
     }, 0);
   };
-  var handleClick = function handleClick2(event) {
+  const handleClick = (event) => {
     click && click(event);
     onClick && onClick(event);
   };
-  var onClickIcon = function onClickIcon2(event) {
+  const onClickIcon = (event) => {
     event.stopPropagation();
     SetShowNoticeBar(!closeable);
     close && close(event);
     onClose && onClose(event);
   };
-  var onAnimationEnd = function onAnimationEnd2() {
+  const onAnimationEnd = () => {
     SetFirstRound(false);
-    setTimeout(function() {
+    setTimeout(() => {
       SetAnimationDuration((offsetWidth + wrapWidth) / speed);
       SetAnimationClass("play-infinite");
     }, 0);
   };
-  var time = height / speed / 4 < 1 ? Number((height / speed / 4).toFixed(1)) * 1e3 : ~~(height / speed / 4) * 1e3;
-  var startRollEasy = function startRollEasy2() {
+  const time = height / speed / 4 < 1 ? Number((height / speed / 4).toFixed(1)) * 1e3 : ~~(height / speed / 4) * 1e3;
+  const startRollEasy = () => {
     showhorseLamp();
-    var timerCurr = window.setInterval(showhorseLamp, time + Number(duration));
+    const timerCurr = window.setInterval(showhorseLamp, time + Number(duration));
     SetTimer(timerCurr);
   };
-  var showhorseLamp = function showhorseLamp2() {
+  const showhorseLamp = () => {
     SetAnimate(true);
-    setTimeout(function() {
+    setTimeout(() => {
       scrollList.current.push(scrollList.current[0]);
       scrollList.current.shift();
       SetAnimate(false);
     }, time);
   };
-  var handleClickIcon = function handleClickIcon2(event) {
+  const handleClickIcon = (event) => {
     event.stopPropagation();
     SetShowNoticeBar(!closeable);
     close && close(event);
     onClose && onClose(event);
   };
-  var isEllipsis = function isEllipsis2() {
-    if (isCanScroll == null) {
+  const isEllipsis = () => {
+    if (isCanScroll == null && align === "left") {
       return wrap;
     }
     return !isCanScroll && !wrap;
   };
-  var contentStyle = {
-    animationDelay: "".concat(firstRound ? delay : 0, "s"),
-    animationDuration: "".concat(animationDuration, "s"),
-    transform: "translateX(".concat(firstRound ? 0 : "".concat(wrapWidth, "px"), ")")
+  const contentStyle = {
+    animationDelay: `${firstRound ? delay : 0}s`,
+    animationDuration: `${animationDuration}s`,
+    transform: `translateX(${firstRound ? 0 : `${rtl ? -wrapWidth : wrapWidth}px`})`
   };
-  var barStyle = {
-    height: isVertical ? "".concat(height, "px") : ""
+  const barStyle = {
+    height: isVertical ? `${height}px` : ""
   };
-  var duringTime = height / speed / 4 < 1 ? Number((height / speed / 4).toFixed(1)) : ~~(height / speed / 4);
-  var noDuring = height / speed < 1 ? (height / speed).toFixed(1) : ~~(height / speed);
-  var horseLampStyle = {
-    transition: animate ? "all ".concat(duringTime === 0 ? noDuring : duringTime, "s") : "",
-    marginTop: animate ? "-".concat(height, "px") : ""
+  const duringTime = height / speed / 4 < 1 ? Number((height / speed / 4).toFixed(1)) : ~~(height / speed / 4);
+  const noDuring = height / speed < 1 ? (height / speed).toFixed(1) : ~~(height / speed);
+  const horseLampStyle = {
+    transition: animate ? `all ${duringTime === 0 ? noDuring : duringTime}s` : "",
+    marginTop: animate ? `-${height}px` : ""
   };
-  var init = function init2() {
-    var active2 = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : 0;
-    var rects = getRect(container === null || container === void 0 ? void 0 : container.current);
-    var _active = Math.max(Math.min(childCount - 1, active2), 0);
-    var _height = rects.height;
+  const init = (active2 = 0) => {
+    const rects = getRect(container === null || container === void 0 ? void 0 : container.current);
+    const _active = Math.max(Math.min(childCount - 1, active2), 0);
+    const _height = rects.height;
     trackSize = childCount * Number(_height);
-    var targetOffset = getOffset(_active);
+    const targetOffset = getOffset(_active);
     swiperRef.current.moving = true;
     if (ready) {
       swiperRef.current.moving = false;
@@ -213,47 +175,46 @@ var NoticeBar = function NoticeBar2(props) {
     setOffset(targetOffset);
     setReady(true);
   };
-  useEffect(function() {
+  useEffect(() => {
     if (ready) {
       stopAutoPlay();
       autoplay();
     }
-    return function() {
+    return () => {
       setReady(false);
     };
   }, [ready]);
-  useEffect(function() {
+  useEffect(() => {
     if (isVertical && children) {
       init();
       stopAutoPlay();
       autoplay();
     }
   }, [children, container === null || container === void 0 ? void 0 : container.current]);
-  var stopAutoPlay = function stopAutoPlay2() {
+  const stopAutoPlay = () => {
     clearTimeout(swiperRef.current.autoplayTimer);
     swiperRef.current.autoplayTimer = null;
   };
-  var autoplay = function autoplay2() {
+  const autoplay = () => {
     if (childCount <= 1)
       return;
     stopAutoPlay();
-    swiperRef.current.autoplayTimer = setTimeout(function() {
+    swiperRef.current.autoplayTimer = setTimeout(() => {
       next();
-      autoplay2();
+      autoplay();
     }, Number(duration) + 100 * speed);
   };
-  var move = function move2(_ref) {
-    var _ref$pace = _ref.pace, pace = _ref$pace === void 0 ? 0 : _ref$pace, _ref$offset = _ref.offset, offset2 = _ref$offset === void 0 ? 0 : _ref$offset;
+  const move = ({ pace = 0, offset: offset2 = 0 }) => {
     if (childCount <= 1)
       return;
-    var targetActive = getActive(pace);
-    var targetOffset = getOffset(targetActive, offset2);
+    const targetActive = getActive(pace);
+    const targetOffset = getOffset(targetActive, offset2);
     if (Array.isArray(children) && children[0] && targetOffset !== minOffset) {
-      var rightBound = targetOffset < minOffset;
+      const rightBound = targetOffset < minOffset;
       childOffset[0] = rightBound ? trackSize : 0;
     }
     if (Array.isArray(children) && children[childCount - 1] && targetOffset !== 0) {
-      var leftBound = targetOffset > 0;
+      const leftBound = targetOffset > 0;
       childOffset[childCount - 1] = leftBound ? -trackSize : 0;
     }
     setChildOffset(childOffset);
@@ -261,10 +222,10 @@ var NoticeBar = function NoticeBar2(props) {
     setOffset(targetOffset);
     getStyle(targetOffset);
   };
-  var next = function next2() {
+  const next = () => {
     resettPosition();
-    requestFrame(function() {
-      requestFrame(function() {
+    requestFrame(() => {
+      requestFrame(() => {
         swiperRef.current.moving = false;
         move({
           pace: 1
@@ -272,141 +233,111 @@ var NoticeBar = function NoticeBar2(props) {
       });
     });
   };
-  var handleItemClick = function handleItemClick2(event, value) {
+  const handleItemClick = (event, value) => {
     onItemClick && onItemClick(event, value);
   };
-  var getStyle = function getStyle2() {
-    var moveOffset = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : offset;
-    var target = innerRef.current;
+  const getStyle = (moveOffset = offset) => {
+    const target = innerRef.current;
     if (!target) {
       return;
     }
-    var _offset = 0;
-    var val = rect.height - height;
+    let _offset = 0;
+    const val = rect.height - height;
     _offset = moveOffset + Number(active === childCount - 1 && val / 2);
-    target.style.transitionDuration = "".concat(swiperRef.current.moving ? 0 : duration, "ms");
-    target.style.height = "".concat(Number(height) * childCount, "px");
-    target.style.transform = "translate3D(0,".concat(_offset, "px,0)");
+    target.style.transitionDuration = `${swiperRef.current.moving ? 0 : duration}ms`;
+    target.style.height = `${Number(height) * childCount}px`;
+    target.style.transform = `translate3D(0,${_offset}px,0)`;
   };
-  var itemStyle = function itemStyle2(index) {
-    var style2 = {};
+  const itemStyle = (index) => {
+    const style2 = {};
     if (height) {
-      style2.height = "".concat(height, "px");
-      style2.lineHeight = "".concat(height, "px");
+      style2.height = `${height}px`;
+      style2.lineHeight = `${height}px`;
     }
-    var offset2 = childOffset[index];
+    const offset2 = childOffset[index];
     if (offset2) {
-      style2.transform = "translate3D(0,".concat(offset2, "px,0)");
+      style2.transform = `translate3D(0,${offset2}px,0)`;
     }
     return style2;
   };
-  var getActive = function getActive2(pace) {
+  const getActive = (pace) => {
     if (pace) {
-      var _active = active + pace;
+      const _active = active + pace;
       return range(_active, -1, childCount);
     }
     return active;
   };
-  var getOffset = function getOffset2(active2) {
-    var offset2 = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0;
-    var currentPosition = active2 * Number(height);
-    var targetOffset = offset2 - currentPosition;
+  const getOffset = (active2, offset2 = 0) => {
+    const currentPosition = active2 * Number(height);
+    const targetOffset = offset2 - currentPosition;
     return targetOffset;
   };
-  var requestFrame = function requestFrame2(fn) {
+  const requestFrame = (fn) => {
     window.requestAnimationFrame.call(window, fn);
   };
-  var range = function range2(num, min, max) {
+  const range = (num, min, max) => {
     return Math.min(Math.max(num, min), max);
   };
-  var resettPosition = function resettPosition2() {
+  const resettPosition = () => {
     swiperRef.current.moving = true;
     if (active <= -1) {
-      move({
-        pace: childCount
-      });
+      move({ pace: childCount });
     }
     if (active >= childCount) {
-      move({
-        pace: -childCount
-      });
+      move({ pace: -childCount });
     }
   };
-  var noticebarClass = classNames(_defineProperty({
-    "nut-noticebar-box": true
-  }, "nut-noticebar-box-wrapable", wrap));
-  useEffect(function() {
-    return function() {
+  const noticebarClass = classNames({
+    [`${classPrefix}-box`]: true,
+    [`${classPrefix}-box-wrapable`]: wrap,
+    [`${classPrefix}-box-${align}`]: true
+  });
+  const cls = classNames(classPrefix, className);
+  useEffect(() => {
+    return () => {
       stopAutoPlay();
     };
   }, []);
-  return React__default.createElement("div", {
-    className: "".concat(classPrefix, " ").concat(className || ""),
-    style
-  }, showNoticeBar && direction === "horizontal" ? React__default.createElement("div", {
-    className: noticebarClass,
-    style: barStyle,
-    onClick: handleClick
-  }, leftIcon ? React__default.createElement("div", {
-    className: "nut-noticebar-box-left-icon"
-  }, leftIcon) : null, React__default.createElement("div", {
-    ref: wrapRef,
-    className: "nut-noticebar-box-wrap"
-  }, React__default.createElement("div", {
-    ref: contentRef,
-    className: "nut-noticebar-box-wrap-content ".concat(animationClass, " ").concat(isEllipsis() ? "nut-ellipsis" : ""),
-    style: contentStyle,
-    onAnimationEnd
-  }, children, content)), closeable || rightIcon ? React__default.createElement("div", {
-    className: "nut-noticebar-box-right-icon",
-    onClick: onClickIcon
-  }, rightIcon || React__default.createElement(Close, {
-    width: 12,
-    height: 12
-  })) : null) : null, showNoticeBar && scrollList.current.length > 0 && isVertical ? React__default.createElement("div", {
-    className: "nut-noticebar-vertical",
-    style: barStyle,
-    ref: container,
-    onClick: handleClick
-  }, leftIcon ? React__default.createElement("div", {
-    className: "nut-noticebar-box-left-icon"
-  }, leftIcon) : null, children ? React__default.createElement("div", {
-    className: "nut-noticebar-box-wrap",
-    ref: innerRef
-  }, scrollList.current.map(function(item, index) {
-    return React__default.createElement("div", {
-      style: itemStyle(index),
-      key: index,
-      onClick: function onClick2(e) {
-        handleItemClick(e, item);
-      }
-    }, item);
-  })) : React__default.createElement("div", {
-    className: "nut-noticebar-box-horseLamp-list",
-    style: horseLampStyle
-  }, scrollList.current.map(function(item, index) {
-    return (
-      // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
-      React__default.createElement("div", {
-        className: "nut-noticebar-box-horseLamp-list-item",
-        style: {
-          height
-        },
-        key: index,
-        onClick: function onClick2(e) {
+  return React__default.createElement(
+    "div",
+    { className: cls, style },
+    showNoticeBar && direction === "horizontal" ? React__default.createElement(
+      "div",
+      { className: noticebarClass, style: barStyle, onClick: handleClick },
+      leftIcon ? React__default.createElement("div", { className: "nut-noticebar-box-left-icon" }, leftIcon) : null,
+      React__default.createElement(
+        "div",
+        { ref: wrapRef, className: "nut-noticebar-box-wrap" },
+        React__default.createElement(
+          "div",
+          { ref: contentRef, className: `nut-noticebar-box-wrap-content ${animationClass} ${isEllipsis() ? "nut-ellipsis" : ""}`, style: contentStyle, onAnimationEnd },
+          children,
+          content
+        )
+      ),
+      closeable || rightIcon ? React__default.createElement("div", { className: "nut-noticebar-box-right-icon", onClick: onClickIcon }, rightIcon || React__default.createElement(Close, { width: 12, height: 12 })) : null
+    ) : null,
+    showNoticeBar && scrollList.current.length > 0 && isVertical ? React__default.createElement(
+      "div",
+      { className: "nut-noticebar-vertical", style: barStyle, ref: container, onClick: handleClick },
+      leftIcon ? React__default.createElement("div", { className: "nut-noticebar-box-left-icon" }, leftIcon) : null,
+      children ? React__default.createElement("div", { className: "nut-noticebar-box-wrap", ref: innerRef }, scrollList.current.map((item, index) => {
+        return React__default.createElement("div", { style: itemStyle(index), key: index, onClick: (e) => {
           handleItemClick(e, item);
-        }
-      }, item)
-    );
-  })), React__default.createElement("div", {
-    className: "nut-noticebar-box-right-icon",
-    onClick: function onClick2(e) {
-      handleClickIcon(e);
-    }
-  }, rightIcon || (closeable ? React__default.createElement(Close, {
-    width: 12,
-    height: 12
-  }) : null))) : null);
+        } }, item);
+      })) : React__default.createElement("div", { className: "nut-noticebar-box-horseLamp-list", style: horseLampStyle }, scrollList.current.map((item, index) => {
+        return (
+          // eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
+          React__default.createElement("div", { className: "nut-noticebar-box-horseLamp-list-item", style: { height }, key: index, onClick: (e) => {
+            handleItemClick(e, item);
+          } }, item)
+        );
+      })),
+      React__default.createElement("div", { className: "nut-noticebar-box-right-icon", onClick: (e) => {
+        handleClickIcon(e);
+      } }, rightIcon || (closeable ? React__default.createElement(Close, { width: 12, height: 12 }) : null))
+    ) : null
+  );
 };
 NoticeBar.defaultProps = defaultProps;
 NoticeBar.displayName = "NutNoticeBar";