@nutui/nutui-react 3.0.1 → 3.0.3-beta.0

package/dist/cjs/utils/get-system-info.js

@@ -19,14 +19,13 @@ _export(exports, {
         return getWindowInfo;
     }
 });
-var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-var _taro = /*#__PURE__*/ _interop_require_default._(require("@tarojs/taro"));
+var _taro = require("@tarojs/taro");
 var getDeviceInfo = function getDeviceInfo() {
-    return _taro.default.canIUse('getDeviceInfo') ? _taro.default.getDeviceInfo() : _taro.default.getSystemInfoSync();
+    return (0, _taro.canIUse)('getDeviceInfo') ? (0, _taro.getDeviceInfo)() : (0, _taro.getSystemInfoSync)();
 };
 var getWindowInfo = function getWindowInfo() {
-    return _taro.default.canIUse('getWindowInfo') ? _taro.default.getWindowInfo() : _taro.default.getSystemInfoSync();
+    return (0, _taro.canIUse)('getWindowInfo') ? (0, _taro.getWindowInfo)() : (0, _taro.getSystemInfoSync)();
 };
 var getAppBaseInfo = function getAppBaseInfo() {
-    return _taro.default.canIUse('getAppBaseInfo') ? _taro.default.getAppBaseInfo() : _taro.default.getSystemInfoSync();
+    return (0, _taro.canIUse)('getAppBaseInfo') ? (0, _taro.getAppBaseInfo)() : (0, _taro.getSystemInfoSync)();
 };

package/dist/cjs/utils/merge.d.ts

@@ -0,0 +1,14 @@
+export default main;
+export declare function main(clone: boolean, ...items: any[]): any;
+export declare function main(...items: any[]): any;
+export declare namespace main {
+    var clone: typeof import("./merge").clone;
+    var isPlainObject: typeof import("./merge").isPlainObject;
+    var recursive: typeof import("./merge").recursive;
+}
+export declare function merge(clone: boolean, ...items: any[]): any;
+export declare function merge(...items: any[]): any;
+export declare function recursive(clone: boolean, ...items: any[]): any;
+export declare function recursive(...items: any[]): any;
+export declare function clone<T>(input: T): T;
+export declare function isPlainObject(input: unknown): input is NonNullable<any>;

package/dist/cjs/utils/merge.js

@@ -0,0 +1,98 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    clone: function() {
+        return clone;
+    },
+    default: function() {
+        return _default;
+    },
+    isPlainObject: function() {
+        return isPlainObject;
+    },
+    main: function() {
+        return main;
+    },
+    merge: function() {
+        return merge;
+    },
+    recursive: function() {
+        return recursive;
+    }
+});
+var _to_consumable_array = require("@swc/helpers/_/_to_consumable_array");
+var _type_of = require("@swc/helpers/_/_type_of");
+var _default = main;
+function main() {
+    for(var _len = arguments.length, items = new Array(_len), _key = 0; _key < _len; _key++){
+        items[_key] = arguments[_key];
+    }
+    return merge.apply(void 0, (0, _to_consumable_array._)(items));
+}
+main.clone = clone;
+main.isPlainObject = isPlainObject;
+main.recursive = recursive;
+function merge() {
+    for(var _len = arguments.length, items = new Array(_len), _key = 0; _key < _len; _key++){
+        items[_key] = arguments[_key];
+    }
+    return _merge(items[0] === true, false, items);
+}
+function recursive() {
+    for(var _len = arguments.length, items = new Array(_len), _key = 0; _key < _len; _key++){
+        items[_key] = arguments[_key];
+    }
+    return _merge(items[0] === true, true, items);
+}
+function clone(input) {
+    if (Array.isArray(input)) {
+        var output = [];
+        for(var index = 0; index < input.length; ++index)output.push(clone(input[index]));
+        return output;
+    }
+    if (isPlainObject(input)) {
+        var output1 = {};
+        // eslint-disable-next-line guard-for-in
+        for(var index1 in input)output1[index1] = clone(input[index1]);
+        return output1;
+    }
+    return input;
+}
+function isPlainObject(input) {
+    if (input === null || (typeof input === "undefined" ? "undefined" : (0, _type_of._)(input)) !== 'object') return false;
+    if (Object.getPrototypeOf(input) === null) return true;
+    var ref = input;
+    while(Object.getPrototypeOf(ref) !== null)ref = Object.getPrototypeOf(ref);
+    return Object.getPrototypeOf(input) === ref;
+}
+function _recursiveMerge(base, extend) {
+    if (!isPlainObject(base) || !isPlainObject(extend)) return extend;
+    for(var key in extend){
+        if (key === '__proto__' || key === 'constructor' || key === 'prototype') continue;
+        base[key] = isPlainObject(base[key]) && isPlainObject(extend[key]) ? _recursiveMerge(base[key], extend[key]) : extend[key];
+    }
+    return base;
+}
+function _merge(isClone, isRecursive, items) {
+    var result;
+    if (isClone || !isPlainObject(result = items.shift())) result = {};
+    for(var index = 0; index < items.length; ++index){
+        var item = items[index];
+        // eslint-disable-next-line no-continue
+        if (!isPlainObject(item)) continue;
+        for(var key in item){
+            if (key === '__proto__' || key === 'constructor' || key === 'prototype') continue;
+            var value = isClone ? clone(item[key]) : item[key];
+            result[key] = isRecursive ? _recursiveMerge(result[key], value) : value;
+        }
+    }
+    return result;
+}

package/dist/cjs/utils/platform-taro.js

@@ -19,22 +19,21 @@ _export(exports, {
         return web;
     }
 });
-var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
-var _taro = /*#__PURE__*/ _interop_require_default._(require("@tarojs/taro"));
+var _taro = require("@tarojs/taro");
 var harmony = function harmony() {
     return [
         'harmony',
         'harmonyhybrid',
         'jdharmony'
-    ].includes(_taro.default.getEnv().toLowerCase());
+    ].includes((0, _taro.getEnv)().toLowerCase());
 };
 var web = function web() {
     return [
         'web'
-    ].includes(_taro.default.getEnv().toLowerCase());
+    ].includes((0, _taro.getEnv)().toLowerCase());
 };
 var miniprogram = function miniprogram() {
     return [
         'mini'
-    ].includes(_taro.default.getEnv().toLowerCase());
+    ].includes((0, _taro.getEnv)().toLowerCase());
 };

package/dist/cjs/utils/to-array.d.ts

@@ -0,0 +1 @@
+export declare function toArray<T>(value?: T | T[] | null): T[];

package/dist/cjs/utils/to-array.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "toArray", {
+    enumerable: true,
+    get: function() {
+        return toArray;
+    }
+});
+function toArray(value) {
+    if (value === undefined || value === null) {
+        return [];
+    }
+    return Array.isArray(value) ? value : [
+        value
+    ];
+}

package/dist/es/hooks/use-client-rect.js

@@ -25,6 +25,7 @@ export function isWindow(val) {
         };
     }
     if (element && element.getBoundingClientRect) {
+        console.log(element, element.getBoundingClientRect());
         return element.getBoundingClientRect();
     }
     return {

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

@@ -383,6 +383,76 @@
   right: 0;
 }
 
+.nut-pickerview {
+  --nutui-picker-item-height: 36px;
+  position: relative;
+  display: flex;
+  width: 100%;
+  height: calc(var(--nutui-picker-item-height, 36px) * 7);
+  overflow: hidden;
+}
+.nut-pickerview-mask, .nut-pickerview-indicator {
+  position: absolute;
+  left: 0;
+  right: 0;
+  z-index: 3;
+  pointer-events: none;
+}
+.nut-pickerview-mask {
+  top: 0;
+  bottom: 0;
+  background-image: var(--picker-mask-background, linear-gradient(180deg, var(--nutui-white-12), var(--nutui-white-7)), linear-gradient(0deg, var(--nutui-white-12), var(--nutui-white-7)));
+  background-position: top, bottom;
+  background-size: 100% calc((var(--nutui-picker-item-height, 36px) * 7 - var(--nutui-picker-item-height, 36px)) / 2);
+  background-repeat: no-repeat;
+  transform: translateZ(0);
+}
+.nut-pickerview-indicator {
+  top: calc((var(--nutui-picker-item-height, 36px) * 7 - var(--nutui-picker-item-height, 36px)) / 2);
+  height: var(--nutui-picker-item-height, 36px);
+  border: var(--nutui-picker-item-active-line-border, 1px solid var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
+  border-left: 0;
+  border-right: 0;
+  box-sizing: border-box;
+}
+.nut-pickerview-list {
+  position: relative;
+  flex: 1;
+  height: calc(var(--nutui-picker-item-height, 36px) * 7);
+  overflow: hidden;
+  touch-action: none;
+}
+.nut-pickerview-roller {
+  position: absolute;
+  top: calc((var(--nutui-picker-item-height, 36px) * 7 - var(--nutui-picker-item-height, 36px)) / 2);
+  width: 100%;
+  height: var(--nutui-picker-item-height, 36px);
+  z-index: 1;
+  transform-style: preserve-3d;
+}
+.nut-pickerview-roller-item {
+  position: absolute;
+  top: 0;
+  backface-visibility: hidden;
+  -moz-backface-visibility: hidden;
+  -webkit-backface-visibility: hidden;
+}
+.nut-pickerview-roller-item-hidden {
+  visibility: hidden;
+  opacity: 0;
+}
+.nut-pickerview-roller-item, .nut-pickerview-roller-item-tiled {
+  width: 100%;
+  height: var(--nutui-picker-item-height, 36px);
+  line-height: var(--nutui-picker-item-height, 36px);
+  color: var(--nutui-picker-item-text-color, var(--nutui-color-title, #1a1a1a));
+  font-size: var(--nutui-picker-item-text-font-size, var(--nutui-font-size-base, 14px));
+  text-align: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 .nut-picker {
   background-color: var(--nutui-color-background-overlay, #ffffff);
   width: 100%;

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

@@ -1 +1,2 @@
+import '../../pickerview/style';
 import './datepickerview.scss';

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

@@ -2,6 +2,76 @@
 /* #endif */
 /* #ifndef harmony */
 /* #endif */
+.nut-pickerview {
+  --nutui-picker-item-height: 36px;
+  position: relative;
+  display: flex;
+  width: 100%;
+  height: calc(var(--nutui-picker-item-height, 36px) * 7);
+  overflow: hidden;
+}
+.nut-pickerview-mask, .nut-pickerview-indicator {
+  position: absolute;
+  left: 0;
+  right: 0;
+  z-index: 3;
+  pointer-events: none;
+}
+.nut-pickerview-mask {
+  top: 0;
+  bottom: 0;
+  background-image: var(--picker-mask-background, linear-gradient(180deg, var(--nutui-white-12), var(--nutui-white-7)), linear-gradient(0deg, var(--nutui-white-12), var(--nutui-white-7)));
+  background-position: top, bottom;
+  background-size: 100% calc((var(--nutui-picker-item-height, 36px) * 7 - var(--nutui-picker-item-height, 36px)) / 2);
+  background-repeat: no-repeat;
+  transform: translateZ(0);
+}
+.nut-pickerview-indicator {
+  top: calc((var(--nutui-picker-item-height, 36px) * 7 - var(--nutui-picker-item-height, 36px)) / 2);
+  height: var(--nutui-picker-item-height, 36px);
+  border: var(--nutui-picker-item-active-line-border, 1px solid var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
+  border-left: 0;
+  border-right: 0;
+  box-sizing: border-box;
+}
+.nut-pickerview-list {
+  position: relative;
+  flex: 1;
+  height: calc(var(--nutui-picker-item-height, 36px) * 7);
+  overflow: hidden;
+  touch-action: none;
+}
+.nut-pickerview-roller {
+  position: absolute;
+  top: calc((var(--nutui-picker-item-height, 36px) * 7 - var(--nutui-picker-item-height, 36px)) / 2);
+  width: 100%;
+  height: var(--nutui-picker-item-height, 36px);
+  z-index: 1;
+  transform-style: preserve-3d;
+}
+.nut-pickerview-roller-item {
+  position: absolute;
+  top: 0;
+  backface-visibility: hidden;
+  -moz-backface-visibility: hidden;
+  -webkit-backface-visibility: hidden;
+}
+.nut-pickerview-roller-item-hidden {
+  visibility: hidden;
+  opacity: 0;
+}
+.nut-pickerview-roller-item, .nut-pickerview-roller-item-tiled {
+  width: 100%;
+  height: var(--nutui-picker-item-height, 36px);
+  line-height: var(--nutui-picker-item-height, 36px);
+  color: var(--nutui-picker-item-text-color, var(--nutui-color-title, #1a1a1a));
+  font-size: var(--nutui-picker-item-text-font-size, var(--nutui-font-size-base, 14px));
+  text-align: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 .nut-datepickerview {
   display: flex;
   width: 100%;

package/dist/es/packages/fixednav/fixednav.js

@@ -7,6 +7,7 @@ import { ArrowLeft } from "@nutui/icons-react";
 import Overlay from "../overlay/index";
 import { useConfig } from "../configprovider";
 import { defaultOverlayProps } from "../overlay/overlay";
+import Badge from "../badge/index";
 var defaultProps = _object_spread_props(_object_spread({}, defaultOverlayProps), {
     activeText: '',
     inactiveText: '',
@@ -43,6 +44,20 @@ export var FixedNav = function(props) {
     var classes = classNames(classPrefix, {
         active: visible
     }, type, className);
+    var renderListItem = function(item, index) {
+        return /*#__PURE__*/ React.createElement("div", {
+            className: "".concat(classPrefix, "-list-item"),
+            onClick: function(event) {
+                return onSelect(item, event);
+            },
+            key: item.id || index
+        }, /*#__PURE__*/ React.isValidElement(item.icon) ? item.icon : /*#__PURE__*/ React.createElement("img", {
+            src: item.icon,
+            alt: ""
+        }), /*#__PURE__*/ React.createElement("div", {
+            className: "".concat(classPrefix, "-list-text")
+        }, item.text));
+    };
     return /*#__PURE__*/ React.createElement("div", _object_spread({
         className: classes,
         style: _object_spread({}, position, style)
@@ -57,20 +72,11 @@ export var FixedNav = function(props) {
     }, children || /*#__PURE__*/ React.createElement("div", {
         className: "".concat(classPrefix, "-list")
     }, list.map(function(item, index) {
-        return /*#__PURE__*/ React.createElement("div", {
-            className: "".concat(classPrefix, "-list-item"),
-            onClick: function(event) {
-                return onSelect(item, event);
-            },
-            key: item.id || index
-        }, /*#__PURE__*/ React.isValidElement(item.icon) ? item.icon : /*#__PURE__*/ React.createElement("img", {
-            src: item.icon,
-            alt: ""
-        }), /*#__PURE__*/ React.createElement("div", {
-            className: "".concat(classPrefix, "-list-text")
-        }, item.text), item.num && /*#__PURE__*/ React.createElement("div", {
-            className: "b"
-        }, item.num));
+        return /*#__PURE__*/ React.createElement(React.Fragment, null, item.num ? /*#__PURE__*/ React.createElement(Badge, {
+            value: item.num,
+            top: 8,
+            right: 6
+        }, renderListItem(item, index)) : /*#__PURE__*/ React.createElement(React.Fragment, null, renderListItem(item, index)));
     }))), /*#__PURE__*/ React.createElement("div", {
         className: "".concat(classPrefix, "-btn"),
         onClick: function() {

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

@@ -95,21 +95,6 @@
       .nut-fixednav-list-text {
         font-size: 10px;
       }
-
-      .b {
-        position: absolute;
-        right: 0;
-        top: 1px;
-        height: 14px;
-        line-height: 14px;
-        font-size: 10px;
-        padding: 0 3px;
-        color: white;
-        background: $color-primary;
-        border-radius: 7px;
-        text-align: center;
-        min-width: 12px;
-      }
     }
   }
 

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

@@ -1,2 +1,3 @@
 import '../../overlay/style';
+import '../../badge/style';
 import './fixednav.scss';

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

@@ -57,6 +57,103 @@
   right: 0;
 }
 
+.nut-badge {
+  position: relative;
+  display: inline-flex;
+  width: auto;
+}
+.nut-badge-icon {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background: var(--nutui-badge-background-color, var(--nutui-color-primary, #ff0f23));
+  padding: var(--nutui-badge-icon-padding, 2px);
+  text-align: center;
+  z-index: var(--nutui-badge-z-index, 1);
+}
+.nut-badge-icon .nut-icon {
+  width: var(--nutui-badge-icon-size, 10px);
+  height: var(--nutui-badge-icon-size, 10px);
+  font-size: var(--nutui-badge-icon-size, 10px);
+}
+.nut-badge-sup, .nut-badge-icon {
+  border-radius: var(--nutui-badge-border-radius, var(--nutui-badge-height, 14px));
+}
+.nut-badge-sup::after, .nut-badge-icon::after {
+  content: "";
+  position: absolute;
+  top: -50%;
+  bottom: -50%;
+  left: -50%;
+  right: -50%;
+  transform: scale(0.5);
+  border: var(--nutui-badge-border, 1px solid #ffffff);
+  border-radius: var(--nutui-badge-border-radius, var(--nutui-badge-height, 14px));
+}
+.nut-badge-sup {
+  display: inline-flex;
+  justify-content: center;
+  height: var(--nutui-badge-height, 14px);
+  min-width: var(--nutui-badge-min-width, 6px);
+  padding: var(--nutui-badge-padding, 1px 4px);
+  box-sizing: border-box;
+  color: var(--nutui-badge-color, #ffffff);
+  font-size: var(--nutui-badge-font-size, var(--nutui-font-size-xxs, 10px));
+  line-height: 12px;
+  white-space: nowrap;
+  font-weight: normal;
+  vertical-align: middle;
+  background: var(--nutui-badge-background-color, var(--nutui-color-primary, #ff0f23));
+  z-index: 1;
+}
+.nut-badge-number {
+  font-family: "JD";
+  /* #ifdef harmony */
+  line-height: 12px;
+  /* #endif */
+  /* #ifndef harmony */
+  line-height: 13px;
+  /* #endif */
+}
+.nut-badge-one {
+  height: var(--nutui-badge-height, 14px);
+  width: var(--nutui-badge-height, 14px);
+}
+.nut-badge-content {
+  position: absolute;
+  transform: var(--nutui-badge-content-transform, translate(50%, -50%));
+}
+.nut-badge-dot {
+  padding: 0;
+  border-radius: 50%;
+}
+.nut-badge-dot::after {
+  border: var(--nutui-badge-dot-border, 1px solid #ffffff);
+  border-radius: 50%;
+}
+.nut-badge-dot-normal {
+  min-width: var(--nutui-badge-dot-width, 6px);
+  width: var(--nutui-badge-dot-width, 6px);
+  height: var(--nutui-badge-dot-width, 6px);
+}
+.nut-badge-dot-small {
+  min-width: var(--nutui-badge-dot-width, 4px);
+  width: var(--nutui-badge-dot-width, 4px);
+  height: var(--nutui-badge-dot-width, 4px);
+}
+.nut-badge-dot-large {
+  min-width: var(--nutui-badge-dot-width, 8px);
+  width: var(--nutui-badge-dot-width, 8px);
+  height: var(--nutui-badge-dot-width, 8px);
+}
+.nut-badge-outline {
+  background: #ffffff;
+  color: var(--nutui-badge-outline-color, var(--nutui-color-primary, #ff0f23));
+}
+.nut-badge-outline::after {
+  border: var(--nutui-badge-outline-border, 1px solid var(--nutui-color-primary, #ff0f23));
+}
+
 .nut-fixednav {
   position: fixed;
   z-index: var(--nutui-fixednav-index, 900);
@@ -136,20 +233,6 @@
 .nut-fixednav-list-item .nut-fixednav-list-text {
   font-size: 10px;
 }
-.nut-fixednav-list-item .b {
-  position: absolute;
-  right: 0;
-  top: 1px;
-  height: 14px;
-  line-height: 14px;
-  font-size: 10px;
-  padding: 0 3px;
-  color: white;
-  background: var(--nutui-color-primary, #ff0f23);
-  border-radius: 7px;
-  text-align: center;
-  min-width: 12px;
-}
 .nut-fixednav.left {
   right: auto;
   left: 0;

package/dist/es/packages/form/__tests__/merge.spec.d.ts

@@ -0,0 +1 @@
+export {};