@nutui/nutui-react-taro 3.0.19-beta.1 → 3.0.19-beta.2

package/dist/es/packages/noticebar/noticebar.js

@@ -6,11 +6,9 @@ import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
 import { _ as _to_consumable_array } from "@swc/helpers/_/_to_consumable_array";
 import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
 import React, { useEffect, useMemo, useRef, useState, useCallback } from "react";
-import { nextTick } from "@tarojs/taro";
 import { View } from "@tarojs/components";
 import { Close, Notice } from "@nutui/icons-react-taro";
 import classNames from "classnames";
-import { useUuid } from "../../hooks/use-uuid";
 import { getRectInMultiPlatform } from "../../utils/taro/get-rect";
 import { ComponentDefaults } from "../../utils/typings";
 import { useRtl } from "../configprovider/index";
@@ -38,10 +36,7 @@ export var NoticeBar = function(props) {
     var classPrefix = 'nut-noticebar';
     var wrapRef = useRef(null);
     var contentRef = useRef(null);
-    var uid = useUuid();
-    var wrapRefId = "wrap-ref-".concat(uid);
-    var contentRefId = "content-ref-".concat(uid);
-    var _useState = _sliced_to_array(useState(true), 2), showNoticeBar = _useState[0], setShowNoticeBar = _useState[1];
+    var _useState = _sliced_to_array(useState(true), 2), showNoticeBar = _useState[0], SetShowNoticeBar = _useState[1];
     var scrollList = useRef([]);
     var _useState1 = _sliced_to_array(useState(0), 2), wrapWidth = _useState1[0], SetWrapWidth = _useState1[1];
     var _useState2 = _sliced_to_array(useState(true), 2), firstRound = _useState2[0], SetFirstRound = _useState2[1];
@@ -101,7 +96,7 @@ export var NoticeBar = function(props) {
                 startRollEasy();
             }
         } else {
-            initScrollWrap();
+            initScrollWrap(content);
         }
         return function() {
             // 销毁事件
@@ -111,7 +106,7 @@ export var NoticeBar = function(props) {
         childs
     ]);
     useEffect(function() {
-        initScrollWrap();
+        initScrollWrap(content);
     }, [
         content
     ]);
@@ -122,11 +117,11 @@ export var NoticeBar = function(props) {
     }, [
         list
     ]);
-    var initScrollWrap = function() {
+    var initScrollWrap = function(value) {
         if (showNoticeBar === false) {
             return;
         }
-        nextTick(function() {
+        setTimeout(function() {
             return _async_to_generator(function() {
                 var warpRes, contentRes, wrapW, offsetW, canScroll;
                 return _ts_generator(this, function(_state) {
@@ -139,19 +134,16 @@ export var NoticeBar = function(props) {
                             }
                             return [
                                 4,
-                                getRectInMultiPlatform(wrapRef.current, wrapRefId)
+                                getRectInMultiPlatform(wrapRef.current)
                             ];
                         case 1:
                             warpRes = _state.sent();
                             return [
                                 4,
-                                getRectInMultiPlatform(contentRef.current, contentRefId)
+                                getRectInMultiPlatform(contentRef.current)
                             ];
                         case 2:
                             contentRes = _state.sent();
-                            if (!warpRes || !contentRes) return [
-                                2
-                            ];
                             wrapW = warpRes.width;
                             offsetW = contentRes.width;
                             canScroll = align === 'left' && scrollable == null ? offsetW > wrapW : scrollable;
@@ -170,12 +162,18 @@ export var NoticeBar = function(props) {
                     }
                 });
             })();
-        });
+        }, 0);
     };
     var handleClick = function(event) {
         click && click(event);
         onClick && onClick(event);
     };
+    var onClickIcon = function(event) {
+        event.stopPropagation();
+        SetShowNoticeBar(!closeable);
+        close && close(event);
+        onClose && onClose(event);
+    };
     var onAnimationEnd = function() {
         SetFirstRound(false);
         setTimeout(function() {
@@ -198,16 +196,13 @@ export var NoticeBar = function(props) {
             SetAnimate(false);
         }, time);
     };
-    var handleClickIcon = useCallback(function(event) {
+    // 点击滚动单元
+    var handleClickIcon = function(event) {
         event.stopPropagation();
-        setShowNoticeBar(!closeable);
+        SetShowNoticeBar(!closeable);
         close && close(event);
         onClose && onClose(event);
-    }, [
-        close,
-        onClose,
-        closeable
-    ]);
+    };
     var isEllipsis = function() {
         if (isCanScroll == null && align === 'left') {
             return wrap;
@@ -355,12 +350,10 @@ export var NoticeBar = function(props) {
     };
     // 无缝滚动第一个元素位移控制
     var itemStyle = function(index) {
-        var style = {
-            width: '100%'
-        };
+        var style = {};
         if (height) {
             style.height = "".concat(height, "px");
-        // style.lineHeight = `${height}px`
+            style.lineHeight = "".concat(height, "px");
         }
         var offset = childOffset[index];
         if (offset) {
@@ -429,79 +422,74 @@ export var NoticeBar = function(props) {
         container.current = ref;
         setIsContainerReady(true);
     }, []);
-    var renderLeftIcon = useCallback(function() {
-        return /*#__PURE__*/ React.createElement(React.Fragment, null, leftIcon ? /*#__PURE__*/ React.createElement(View, {
+    return (
+        /*#__PURE__*/ React.createElement(View, {
+            className: cls,
+            style: style
+        }, showNoticeBar && direction === 'horizontal' ? /*#__PURE__*/ React.createElement(View, {
+            className: noticebarClass,
+            style: barStyle,
+            onClick: handleClick
+        }, leftIcon ? /*#__PURE__*/ React.createElement(View, {
             className: "nut-noticebar-box-left-icon"
-        }, leftIcon) : null);
-    }, [
-        leftIcon
-    ]);
-    var renderRight = useCallback(function() {
-        return /*#__PURE__*/ React.createElement(React.Fragment, null, right ? /*#__PURE__*/ React.createElement(View, {
+        }, leftIcon) : null, /*#__PURE__*/ React.createElement(View, {
+            ref: wrapRef,
+            className: "nut-noticebar-box-wrap"
+        }, /*#__PURE__*/ React.createElement(View, {
+            ref: contentRef,
+            className: "nut-noticebar-box-wrap-content ".concat(animationClass, " ").concat(isEllipsis() ? 'nut-ellipsis' : ''),
+            style: contentStyle,
+            onAnimationEnd: onAnimationEnd
+        }, children, content)), right ? /*#__PURE__*/ React.createElement(View, {
             className: "nut-noticebar-box-right"
-        }, right) : null);
-    }, [
-        right
-    ]);
-    var renderRightIcon = useCallback(function() {
-        return /*#__PURE__*/ React.createElement(React.Fragment, null, rightIcon || closeable ? /*#__PURE__*/ React.createElement(View, {
+        }, right) : null, closeable || rightIcon ? /*#__PURE__*/ React.createElement(View, {
             className: "nut-noticebar-box-right-icon",
-            onClick: handleClickIcon
+            onClick: onClickIcon
         }, rightIcon || /*#__PURE__*/ React.createElement(Close, {
             size: 12
-        })) : null);
-    }, [
-        rightIcon,
-        closeable,
-        handleClickIcon
-    ]);
-    return /*#__PURE__*/ React.createElement(View, {
-        className: cls,
-        style: style
-    }, showNoticeBar && direction === 'horizontal' ? /*#__PURE__*/ React.createElement(View, {
-        className: noticebarClass,
-        style: barStyle,
-        onClick: handleClick
-    }, renderLeftIcon(), /*#__PURE__*/ React.createElement(View, {
-        ref: wrapRef,
-        className: "nut-noticebar-box-wrap",
-        id: wrapRefId
-    }, /*#__PURE__*/ React.createElement(View, {
-        ref: contentRef,
-        id: contentRefId,
-        className: "nut-noticebar-box-wrap-content ".concat(animationClass, " ").concat(isEllipsis() ? 'nut-ellipsis' : ''),
-        style: contentStyle,
-        onAnimationEnd: onAnimationEnd
-    }, children, content)), renderRight(), renderRightIcon()) : null, showNoticeBar && hasVerticalContent && isVertical ? /*#__PURE__*/ React.createElement(View, {
-        className: "nut-noticebar-vertical",
-        style: barStyle,
-        ref: containerRefCallback,
-        onClick: handleClick
-    }, renderLeftIcon(), children ? /*#__PURE__*/ React.createElement(View, {
-        className: "nut-noticebar-box-wrap",
-        ref: innerRef
-    }, scrollList.current.map(function(item, index) {
-        return /*#__PURE__*/ React.createElement(View, {
-            style: itemStyle(index),
-            key: index,
-            onClick: function(e) {
-                handleItemClick(e, item);
-            }
-        }, item);
-    })) : /*#__PURE__*/ React.createElement(View, {
-        className: "nut-noticebar-box-horseLamp-list",
-        style: horseLampStyle
-    }, scrollList.current.map(function(item, index) {
-        return /*#__PURE__*/ React.createElement(View, {
-            className: "nut-noticebar-box-horseLamp-list-item",
-            style: {
-                height: height
-            },
-            key: index,
+        })) : null) : null, showNoticeBar && hasVerticalContent && isVertical ? /*#__PURE__*/ React.createElement(View, {
+            className: "nut-noticebar-vertical",
+            style: barStyle,
+            ref: containerRefCallback,
+            onClick: handleClick
+        }, leftIcon ? /*#__PURE__*/ React.createElement(View, {
+            className: "nut-noticebar-box-left-icon"
+        }, leftIcon) : null, children ? /*#__PURE__*/ React.createElement(View, {
+            className: "nut-noticebar-box-wrap",
+            ref: innerRef
+        }, scrollList.current.map(function(item, index) {
+            return /*#__PURE__*/ React.createElement(View, {
+                style: itemStyle(index),
+                key: index,
+                onClick: function(e) {
+                    handleItemClick(e, item);
+                }
+            }, item);
+        })) : /*#__PURE__*/ React.createElement(View, {
+            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
+                /*#__PURE__*/ (React.createElement(View, {
+                    className: "nut-noticebar-box-horseLamp-list-item",
+                    style: {
+                        height: height
+                    },
+                    key: index,
+                    onClick: function(e) {
+                        handleItemClick(e, item);
+                    }
+                }, item))
+            );
+        })), /*#__PURE__*/ React.createElement(View, {
+            className: "nut-noticebar-box-right-icon",
             onClick: function(e) {
-                handleItemClick(e, item);
+                handleClickIcon(e);
             }
-        }, item);
-    })), renderRight(), renderRightIcon()) : null);
+        }, rightIcon || (closeable ? /*#__PURE__*/ React.createElement(Close, {
+            size: 12
+        }) : null))) : null)
+    );
 };
 NoticeBar.displayName = 'NutNoticeBar';

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

@@ -36,15 +36,11 @@
       justify-content: center;
 
       .nut-noticebar-box-wrap {
-        /* #ifndef dynamic*/
         flex: initial;
-        /* #endif */
 
         .nut-noticebar-box-wrap-content {
           position: relative;
-          /* #ifndef dynamic*/
           display: initial;
-          /* #endif */
         }
       }
     }

package/dist/es/packages/noticebar/style/style.css

@@ -32,15 +32,11 @@
   justify-content: center;
 }
 .nut-noticebar .nut-noticebar-box-center .nut-noticebar-box-wrap {
-  /* #ifndef dynamic*/
   flex: initial;
-  /* #endif */
 }
 .nut-noticebar .nut-noticebar-box-center .nut-noticebar-box-wrap .nut-noticebar-box-wrap-content {
   position: relative;
-  /* #ifndef dynamic*/
   display: initial;
-  /* #endif */
 }
 .nut-noticebar .nut-noticebar-box-left-icon {
   display: flex;

package/dist/es/packages/noticebar/style/style.harmony.css

@@ -32,15 +32,11 @@
   justify-content: center;
 }
 .nut-noticebar .nut-noticebar-box-center .nut-noticebar-box-wrap {
-  /* #ifndef dynamic*/
   flex: initial;
-  /* #endif */
 }
 .nut-noticebar .nut-noticebar-box-center .nut-noticebar-box-wrap .nut-noticebar-box-wrap-content {
   position: relative;
-  /* #ifndef dynamic*/
   display: initial;
-  /* #endif */
 }
 .nut-noticebar .nut-noticebar-box-left-icon {
   display: flex;

package/dist/es/packages/noticebar/style-jmapp/noticebar.scss

@@ -36,15 +36,11 @@
       justify-content: center;
 
       .nut-noticebar-box-wrap {
-        /* #ifndef dynamic*/
         flex: initial;
-        /* #endif */
 
         .nut-noticebar-box-wrap-content {
           position: relative;
-          /* #ifndef dynamic*/
           display: initial;
-          /* #endif */
         }
       }
     }

package/dist/es/packages/noticebar/style-jmapp/style.css

@@ -32,15 +32,11 @@
   justify-content: center;
 }
 .nut-noticebar .nut-noticebar-box-center .nut-noticebar-box-wrap {
-  /* #ifndef dynamic*/
   flex: initial;
-  /* #endif */
 }
 .nut-noticebar .nut-noticebar-box-center .nut-noticebar-box-wrap .nut-noticebar-box-wrap-content {
   position: relative;
-  /* #ifndef dynamic*/
   display: initial;
-  /* #endif */
 }
 .nut-noticebar .nut-noticebar-box-left-icon {
   display: flex;

package/dist/es/packages/noticebar/style-jrkf/noticebar.scss

@@ -36,15 +36,11 @@
       justify-content: center;
 
       .nut-noticebar-box-wrap {
-        /* #ifndef dynamic*/
         flex: initial;
-        /* #endif */
 
         .nut-noticebar-box-wrap-content {
           position: relative;
-          /* #ifndef dynamic*/
           display: initial;
-          /* #endif */
         }
       }
     }

package/dist/es/packages/noticebar/style-jrkf/style.css

@@ -32,15 +32,11 @@
   justify-content: center;
 }
 .nut-noticebar .nut-noticebar-box-center .nut-noticebar-box-wrap {
-  /* #ifndef dynamic*/
   flex: initial;
-  /* #endif */
 }
 .nut-noticebar .nut-noticebar-box-center .nut-noticebar-box-wrap .nut-noticebar-box-wrap-content {
   position: relative;
-  /* #ifndef dynamic*/
   display: initial;
-  /* #endif */
 }
 .nut-noticebar .nut-noticebar-box-left-icon {
   display: flex;

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

@@ -75,12 +75,7 @@
 
   &-left-icon,
   &-right-icon {
-    /* #ifdef dynamic*/
-    display: flex;
-    /* #endif */
-    /* #ifndef dynamic*/
     display: inline-flex;
-    /* #endif */
   }
 
   &-left-icon {

package/dist/es/packages/notify/style/style.css

@@ -76,12 +76,7 @@
   text-align: left;
 }
 .nut-notify-left-icon, .nut-notify-right-icon {
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
 }
 .nut-notify-left-icon {
   margin-right: 6px;

package/dist/es/packages/notify/style/style.harmony.css

@@ -76,12 +76,7 @@
   text-align: left;
 }
 .nut-notify-left-icon, .nut-notify-right-icon {
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
 }
 .nut-notify-left-icon {
   margin-right: 6px;

package/dist/es/packages/notify/style-jmapp/notify.scss

@@ -75,12 +75,7 @@
 
   &-left-icon,
   &-right-icon {
-    /* #ifdef dynamic*/
-    display: flex;
-    /* #endif */
-    /* #ifndef dynamic*/
     display: inline-flex;
-    /* #endif */
   }
 
   &-left-icon {

package/dist/es/packages/notify/style-jmapp/style.css

@@ -76,12 +76,7 @@
   text-align: left;
 }
 .nut-notify-left-icon, .nut-notify-right-icon {
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
 }
 .nut-notify-left-icon {
   margin-right: 6px;

package/dist/es/packages/notify/style-jrkf/notify.scss

@@ -75,12 +75,7 @@
 
   &-left-icon,
   &-right-icon {
-    /* #ifdef dynamic*/
-    display: flex;
-    /* #endif */
-    /* #ifndef dynamic*/
     display: inline-flex;
-    /* #endif */
   }
 
   &-left-icon {

package/dist/es/packages/notify/style-jrkf/style.css

@@ -76,12 +76,7 @@
   text-align: left;
 }
 .nut-notify-left-icon, .nut-notify-right-icon {
-  /* #ifdef dynamic*/
-  display: flex;
-  /* #endif */
-  /* #ifndef dynamic*/
   display: inline-flex;
-  /* #endif */
 }
 .nut-notify-left-icon {
   margin-right: 6px;

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

@@ -9,9 +9,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    /* #ifndef dynamic*/
     box-sizing: content-box;
-    /* #endif */
     padding: $popup-title-padding;
     color: $color-title;
     font-size: $popup-title-font-size;

package/dist/es/packages/numberkeyboard/style/style.css

@@ -13,17 +13,15 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  /* #ifndef dynamic*/
   box-sizing: content-box;
-  /* #endif */
   padding: var(--nutui-popup-title-padding, 16px);
   color: var(--nutui-color-title, #1a1a1a);
-  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
+  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-l, 16px));
 }
 .nut-numberkeyboard-header-title {
   color: var(--nutui-color-title, #1a1a1a);
   display: inline-block;
-  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
+  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-l, 16px));
 }
 .nut-numberkeyboard-header-close {
   position: absolute;
@@ -95,7 +93,7 @@
   height: auto;
 }
 .nut-numberkeyboard-sidebar .nut-numberkeyboard-body-wrapper .confirm {
-  font-size: var(--nutui-numberkeyboard-key-confirm-font-size, var(--nutui-font-size-l, 15px));
+  font-size: var(--nutui-numberkeyboard-key-confirm-font-size, var(--nutui-font-size-l, 16px));
   color: var(--nutui-numberkeyboard-key-confirm-color, #fff);
   background-color: var(--nutui-numberkeyboard-key-confirm-background-color, var(--nutui-color-primary, #ff0f23));
 }

package/dist/es/packages/numberkeyboard/style/style.harmony.css

@@ -83,8 +83,8 @@
 .nut-popup-title-title {
   color: var(--nutui-color-title, #1a1a1a);
   font-weight: var(--nutui-font-weight-bold, 600);
-  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
-  line-height: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
+  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-l, 16px));
+  line-height: var(--nutui-popup-title-font-size, var(--nutui-font-size-l, 16px));
 }
 .nut-popup-title-description {
   color: var(--nutui-color-text, #505259);
@@ -142,9 +142,6 @@
 .nut-popup-bottom.nut-popup-round {
   border-radius: var(--nutui-popup-border-radius, var(--nutui-radius-xl, 12px)) var(--nutui-popup-border-radius, var(--nutui-radius-xl, 12px)) 0 0;
 }
-.nut-popup-bottom-top {
-  position: absolute;
-}
 .nut-popup-right {
   top: 0;
   right: 0;
@@ -393,17 +390,15 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  /* #ifndef dynamic*/
   box-sizing: content-box;
-  /* #endif */
   padding: var(--nutui-popup-title-padding, 16px);
   color: var(--nutui-color-title, #1a1a1a);
-  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
+  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-l, 16px));
 }
 .nut-numberkeyboard-header-title {
   color: var(--nutui-color-title, #1a1a1a);
   display: inline-block;
-  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
+  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-l, 16px));
 }
 .nut-numberkeyboard-header-close {
   position: absolute;
@@ -475,7 +470,7 @@
   height: auto;
 }
 .nut-numberkeyboard-sidebar .nut-numberkeyboard-body-wrapper .confirm {
-  font-size: var(--nutui-numberkeyboard-key-confirm-font-size, var(--nutui-font-size-l, 15px));
+  font-size: var(--nutui-numberkeyboard-key-confirm-font-size, var(--nutui-font-size-l, 16px));
   color: var(--nutui-numberkeyboard-key-confirm-color, #fff);
   background-color: var(--nutui-numberkeyboard-key-confirm-background-color, var(--nutui-color-primary, #ff0f23));
 }

package/dist/es/packages/numberkeyboard/style-jmapp/numberkeyboard.scss

@@ -9,9 +9,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    /* #ifndef dynamic*/
     box-sizing: content-box;
-    /* #endif */
     padding: $popup-title-padding;
     color: $color-title;
     font-size: $popup-title-font-size;

package/dist/es/packages/numberkeyboard/style-jmapp/style.css

@@ -13,9 +13,7 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  /* #ifndef dynamic*/
   box-sizing: content-box;
-  /* #endif */
   padding: var(--nutui-popup-title-padding, 12px);
   color: var(--nutui-color-title);
   font-size: var(--nutui-popup-title-font-size, var(--nutui-font-h1));

package/dist/es/packages/numberkeyboard/style-jrkf/numberkeyboard.scss

@@ -9,9 +9,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    /* #ifndef dynamic*/
     box-sizing: content-box;
-    /* #endif */
     padding: $popup-title-padding;
     color: $color-title;
     font-size: $popup-title-font-size;

package/dist/es/packages/numberkeyboard/style-jrkf/style.css

@@ -13,9 +13,7 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  /* #ifndef dynamic*/
   box-sizing: content-box;
-  /* #endif */
   padding: var(--nutui-popup-title-padding, 12px);
   color: var(--nutui-color-title);
   font-size: var(--nutui-popup-title-font-size, var(--nutui-font-h1));