@nutui/nutui-react 2.0.0-alpha.13 → 2.0.0-alpha.15

package/dist/esm/Signature/style/style.css

@@ -1 +1 @@
-.nut-button{position:relative;display:inline-block;flex-shrink:0;height:var(--nutui-button-default-height, 38px);box-sizing:border-box;margin:0;padding:0;line-height:var(--nutui-button-default-line-height, 36px);font-size:var(--nutui-button-default-font-size, var(--nutui-font-size-2, 14px));text-align:center;cursor:pointer;transition:opacity .2s;-webkit-appearance:none;user-select:none;touch-action:manipulation;color:var(--nutui-button-default-color, var(--nutui-gray-1, #1a1a1a));background:var(--nutui-button-default-bg-color, var(--nutui-gray-6, #ffffff));border:var(--nutui-button-border-width, 1px) solid var(--nutui-button-default-border-color, rgb(204, 204, 204))}.nut-button .nut-button-text{margin-left:var(--nutui-button-text-icon-margin-left, 5px)}.nut-button:before{position:absolute;top:50%;left:50%;width:100%;height:100%;background-color:var(--nutui-gray-0, #000000);border:inherit;border-color:var(--nutui-gray-0, #000000);border-radius:inherit;transform:translate(-50%,-50%);opacity:0;content:" "}.nut-button:after{border:none}.nut-button:active:before{opacity:.1}.nut-button__warp{height:100%;width:100%;display:flex;align-items:center;justify-content:center;background:initial}.nut-button--loading:before,.nut-button--disabled:before{display:none}.nut-button--solid{color:var(--nutui-button-primary-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(135deg,var(--nutui-brand-color, #fa2c19) 0%,var(--nutui-brand-color-end, #fa2c19) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button.nut-button--outline{color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));border-color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));background:transparent}.nut-button.nut-button--none{color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));background:transparent;border-color:transparent}.nut-button--primary{color:var(--nutui-button-primary-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(135deg,var(--nutui-brand-color, #fa2c19) 0%,var(--nutui-brand-color-end, #fa2c19) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--primary.nut-button--outline{color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));border-color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));background:transparent}.nut-button--primary.nut-button--none{color:var(--nutui-button-primary-border-color, var(--nutui-brand-color, #fa2c19));background:transparent;border-color:transparent}.nut-button--info{color:var(--nutui-button-info-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(315deg,rgb(73,143,242) 0%,rgb(73,101,242) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--info.nut-button--outline{color:var(--nutui-button-info-border-color, #496af2);border-color:var(--nutui-button-info-border-color, #496af2);background:transparent}.nut-button--info.nut-button--none{color:var(--nutui-button-info-border-color, #496af2);background:transparent;border-color:transparent}.nut-button--success{color:var(--nutui-button-success-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(135deg,rgb(38,191,38) 0%,rgb(39,197,48) 45%,rgb(40,207,63) 83%,rgb(41,212,70) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--success.nut-button--outline{color:var(--nutui-button-success-border-color, rgb(38, 191, 38));border-color:var(--nutui-button-success-border-color, rgb(38, 191, 38));background:transparent}.nut-button--success.nut-button--none{color:var(--nutui-button-success-border-color, rgb(38, 191, 38));background:transparent;border-color:transparent}.nut-button--danger{color:var(--nutui-button-danger-color, var(--nutui-brand-text-color, #ffffff));background:var(--nutui-button-danger-background-color, rgb(250, 44, 25));border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--danger.nut-button--outline{color:var(--nutui-button-danger-border-color, rgb(250, 44, 25));border-color:var(--nutui-button-danger-border-color, rgb(250, 44, 25));background:transparent}.nut-button--danger.nut-button--none{color:var(--nutui-button-danger-border-color, rgb(250, 44, 25));background:transparent;border-color:transparent}.nut-button--warning{color:var(--nutui-button-warning-color, var(--nutui-brand-text-color, #ffffff));background:linear-gradient(135deg,rgb(255,158,13) 0%,rgb(255,167,13) 45%,rgb(255,182,13) 83%,rgb(255,190,13) 100%);border:var(--nutui-button-border-width, 1px) solid transparent}.nut-button--warning.nut-button--outline{color:var(--nutui-button-warning-border-color, rgb(255, 158, 13));border-color:var(--nutui-button-warning-border-color, rgb(255, 158, 13));background:transparent}.nut-button--warning.nut-button--none{color:var(--nutui-button-warning-border-color, rgb(255, 158, 13));background:transparent;border-color:transparent}.nut-button--large{width:100%;height:var(--nutui-button-large-height, 48px);line-height:var(--nutui-button-large-line-height, 46px)}.nut-button--large .text{margin-left:var(--nutui-button-text-icon-large-margin-left, 10px)}.nut-button--normal{padding:var(--nutui-button-default-padding, 0 18px);font-size:var(--nutui-button-default-font-size, var(--nutui-font-size-2, 14px))}.nut-button--small{height:var(--nutui-button-small-height, 28px);line-height:var(--nutui-button-small-line-height, 26px);padding:var(--nutui-button-small-padding, 0 12px);font-size:var(--nutui-button-small-font-size, var(--nutui-font-size-1, 12px))}.nut-button--small .text{margin-left:var(--nutui-button-text-icon-small-margin-left, 2px)}.nut-button--mini{height:var(--nutui-button-mini-height, 24px);line-height:var(--nutui-button-mini-line-height, 1.2);padding:var(--nutui-button-mini-padding, 0 12px);font-size:var(--nutui-button-mini-font-size, var(--nutui-font-size-1, 12px))}.nut-button--mini .text{margin-left:var(--nutui-button-text-icon-mini-margin-left, 1px)}.nut-button--block{display:block;width:100%}.nut-button--disabled{cursor:not-allowed;opacity:var(--nutui-button-disabled-opacity, .68)}.nut-button--loading{cursor:default;opacity:.9}.nut-button--round{border-radius:var(--nutui-button-border-radius, 25px)}.nut-button--square{border-radius:0}.nut-theme-dark .nut-signature__inner Canvas{background-color:#404040}.nut-theme-dark .demo-tips{color:#e6e6e6}.nut-signature .spcanvas_WEAPP{width:100%;height:100%}.nut-signature .spcanvas_WEAPP Canvas{width:100%}.nut-signature__inner{height:10rem;margin-bottom:.8rem;border:1px solid #dadada;display:flex;justify-content:center;align-items:center}.nut-signature__inner Canvas{background-color:#fff}.nut-signature__unsopport{font-size:var(--nutui-font-size-2, 14px)}.nut-signature__btn{margin-right:15px!important}
+.nut-signature .spcanvas_WEAPP{width:100%;height:100%}.nut-signature .spcanvas_WEAPP Canvas{width:100%}.nut-signature__inner{height:10rem;border:1px solid #dadada;display:flex;justify-content:center;align-items:center}.nut-signature__inner Canvas{background-color:#fff}.nut-signature__unsupport{font-size:var(--nutui-font-size-2, 14px)}

package/dist/esm/Signature.js

@@ -1,7 +1,7 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["type", "lineWidth", "strokeStyle", "unSupportTpl", "className", "confirm", "clear", "onConfirm", "onClear"];
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["type", "lineWidth", "strokeStyle", "unsupported", "className", "style", "onConfirm", "onClear"];
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
   if (Object.getOwnPropertySymbols) {
@@ -23,22 +23,19 @@ function _objectSpread(target) {
   }
   return target;
 }
-import React__default, { useRef, useState, useEffect } from "react";
-import Button from "./Button.js";
-import { c as cn } from "./bem.js";
+import React__default, { useRef, useState, useEffect, useImperativeHandle } from "react";
 import { useConfig } from "./ConfigProvider.js";
-import "@bem-react/classname";
-var defaultProps = {
+import { C as ComponentDefaults } from "./typings.js";
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   type: "png",
   lineWidth: 2,
   strokeStyle: "#000",
-  unSupportTpl: "对不起，当前浏览器不支持Canvas，无法使用本控件！",
-  className: ""
-};
-var Signature = function Signature2(props) {
+  unsupported: ""
+});
+var InternalSignature = function InternalSignature2(props, ref) {
   var _useConfig = useConfig(), locale = _useConfig.locale;
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), type = _defaultProps$props.type, lineWidth = _defaultProps$props.lineWidth, strokeStyle = _defaultProps$props.strokeStyle, unSupportTpl = _defaultProps$props.unSupportTpl, className = _defaultProps$props.className, confirm = _defaultProps$props.confirm, clear = _defaultProps$props.clear, onConfirm = _defaultProps$props.onConfirm, onClear = _defaultProps$props.onClear, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
-  var b = cn("signature");
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), type = _defaultProps$props.type, lineWidth = _defaultProps$props.lineWidth, strokeStyle = _defaultProps$props.strokeStyle, unsupported = _defaultProps$props.unsupported, className = _defaultProps$props.className, style = _defaultProps$props.style, onConfirm = _defaultProps$props.onConfirm, onClear = _defaultProps$props.onClear, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var classPrefix = "nut-signature";
   var canvasRef = useRef(null);
   var wrapRef = useRef(null);
   var _useState = useState(0), _useState2 = _slicedToArray(_useState, 2), canvasHeight = _useState2[0], setCanvasHeight = _useState2[1];
@@ -105,12 +102,8 @@ var Signature = function Signature2(props) {
       ctx.current.clearRect(0, 0, canvasWidth, canvasHeight);
       ctx.current.closePath();
     }
-    clear && clear();
     onClear && onClear();
   };
-  var handleConfirmBtn = function handleConfirmBtn2() {
-    onSave(canvasRef.current);
-  };
   var onSave = function onSave2(canvas) {
     var dataurl;
     switch (type) {
@@ -124,34 +117,33 @@ var Signature = function Signature2(props) {
         dataurl = canvas.toDataURL("image/png");
     }
     handleClearBtn();
-    confirm && confirm(canvas, dataurl);
     onConfirm && onConfirm(canvas, dataurl);
   };
+  useImperativeHandle(ref, function() {
+    return {
+      confirm: function confirm() {
+        onSave(canvasRef.current);
+      },
+      clear: function clear() {
+        handleClearBtn();
+      }
+    };
+  });
   return React__default.createElement("div", _objectSpread({
-    className: "".concat(b(), " ").concat(className)
+    className: "".concat(classPrefix, " ").concat(className),
+    style
   }, rest), React__default.createElement("div", {
-    className: "".concat(b("inner")),
+    className: "".concat(classPrefix, "__inner"),
     ref: wrapRef
   }, isCanvasSupported() ? React__default.createElement("canvas", {
     ref: canvasRef,
     height: canvasHeight,
     width: canvasWidth
-  }) : React__default.createElement("p", {
-    className: "".concat(b("unsopport"))
-  }, locale.signature.unSupportTpl || unSupportTpl)), React__default.createElement(Button, {
-    className: "".concat(b("btn")),
-    type: "default",
-    onClick: function onClick() {
-      return handleClearBtn();
-    }
-  }, locale.signature.reSign), React__default.createElement(Button, {
-    className: "".concat(b("btn")),
-    type: "primary",
-    onClick: function onClick() {
-      return handleConfirmBtn();
-    }
-  }, locale.confirm));
+  }) : React__default.createElement(React__default.Fragment, null, unsupported || React__default.createElement("p", {
+    className: "".concat(classPrefix, "__unsupport")
+  }, locale.signature.unsupported))));
 };
+var Signature = React__default.forwardRef(InternalSignature);
 Signature.defaultProps = defaultProps;
 Signature.displayName = "NutSignature";
 export {

package/dist/esm/Step.js

@@ -24,7 +24,7 @@ function _objectSpread(target) {
 }
 import React__default, { useContext } from "react";
 import classNames from "classnames";
-import { D as DataContext } from "./context2.js";
+import { D as DataContext } from "./context3.js";
 import { C as ComponentDefaults } from "./typings.js";
 var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   title: "",

package/dist/esm/Steps.js

@@ -24,7 +24,7 @@ function _objectSpread(target) {
 }
 import React__default from "react";
 import classNames from "classnames";
-import { D as DataContext } from "./context2.js";
+import { D as DataContext } from "./context3.js";
 import { C as ComponentDefaults } from "./typings.js";
 var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   value: 0,

package/dist/esm/SubSideNavBar/style/style.css

@@ -1 +1 @@
-.nut-theme-dark .nut-subsidenavbar{background-color:#141414}.nut-theme-dark .nut-subsidenavbar__title{background-color:#1f1f1f;color:#e6e6e6}.nut-theme-dark .nut-subsidenavbar__title__text{color:#e6e6e6}.nut-subsidenavbar__title{height:40px;padding:10px 8px 10px 35px;background:#f7f8fa}.nut-subsidenavbar__list.nutShow .nut-subsidenavbar__content{height:auto;overflow:inherit}.nut-subsidenavbar__list.nutHide .nut-subsidenavbar__content{height:0;overflow:hidden}
+.nut-subsidenavbar__title{height:var(--nutui-sidenavbar-item-height, 40px);padding:var(--nutui-sidenavbar-sub-title-padding, 10px 8px 10px 35px);background-color:var(--nutui-sidenavbar-sub-title-background, var(--nutui-gray-5, #f8f8f8));color:var(--nutui-sidenavbar-sub-title-color, var(--nutui-gray-1, #1a1a1a));box-sizing:border-box}.nut-subsidenavbar__list.sidenavbar-show .nut-subsidenavbar__content{height:auto;overflow:inherit}.nut-subsidenavbar__list.sidenavbar-hide .nut-subsidenavbar__content{height:0;overflow:hidden}

package/dist/esm/SubSideNavBar.js

@@ -1,6 +1,6 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["title", "key", "children", "onClick", "open"];
+var _excluded = ["title", "value", "children", "onClick", "open"];
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
   if (Object.getOwnPropertySymbols) {
@@ -23,19 +23,19 @@ function _objectSpread(target) {
   return target;
 }
 import React__default, { useContext, useRef, useCallback, useEffect } from "react";
-import { O as OffsetContext, h as handleClick } from "./offsetContext.js";
+import { O as OffsetContext, h as handleClick } from "./context.js";
 var defaultProps = {
   open: true
 };
 var SubSideNavBar = function SubSideNavBar2(props) {
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), title = _defaultProps$props.title, key = _defaultProps$props.key, children = _defaultProps$props.children, onClick = _defaultProps$props.onClick, open = _defaultProps$props.open, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+  var classPrefix = "nut-subsidenavbar";
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), title = _defaultProps$props.title, value = _defaultProps$props.value, children = _defaultProps$props.children, onClick = _defaultProps$props.onClick, open = _defaultProps$props.open, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
   var offset = useContext(OffsetContext);
-  console.log("offset>>>>>>>", offset);
   var listRef = useRef(null);
   var setListLevel = useCallback(function(nodeList) {
     var level = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 1;
     var titleClass = nodeList[0].className;
-    if (titleClass.includes("nut-subsidenavbar__title")) {
+    if (titleClass.includes("".concat(classPrefix, "__title"))) {
       var left = offset * (level + 1);
       nodeList[0].style.paddingLeft = "".concat(left, "px");
     }
@@ -44,11 +44,11 @@ var SubSideNavBar = function SubSideNavBar2(props) {
     });
     childNodes.forEach(function(item) {
       var itemClass = item.className;
-      if (itemClass.includes("nut-subsidenavbar__item")) {
+      if (itemClass.includes("".concat(classPrefix, "__item"))) {
         var _left = offset * (level + 2);
         item.style.paddingLeft = "".concat(_left, "px");
       }
-      if (itemClass.includes("nut-subsidenavbar__list")) {
+      if (itemClass.includes("".concat(classPrefix, "__list"))) {
         var level2 = item.getAttribute("level") ? Number(item.getAttribute("level")) : 1;
         level2 += 1;
         item.setAttribute("level", level2.toString());
@@ -59,10 +59,10 @@ var SubSideNavBar = function SubSideNavBar2(props) {
   var clickFn = function clickFn2(e) {
     handleClick(e);
     var currentClass = e.currentTarget.className;
-    var isShow = currentClass.includes("nutShow");
+    var isShow = currentClass.includes("sidenavbar-show");
     onClick && onClick({
       title,
-      key,
+      value,
       isShow
     });
   };
@@ -72,18 +72,18 @@ var SubSideNavBar = function SubSideNavBar2(props) {
     (_listRef$current2 = listRef.current) === null || _listRef$current2 === void 0 ? void 0 : _listRef$current2.setAttribute("level", "1");
     childNodes && setListLevel(childNodes);
   }, [setListLevel]);
-  var divClass = open ? "nut-subsidenavbar__list  nutShow" : "nut-subsidenavbar__list  nutHide";
+  var divClass = open ? "".concat(classPrefix, "__list sidenavbar-show") : "".concat(classPrefix, "__list sidenavbar-hide");
   var iconClass = open ? "arrow-icon arrow-down" : "arrow-icon arrow-up";
   return React__default.createElement("div", _objectSpread({
     className: divClass,
     ref: listRef,
     onClick: clickFn
   }, rest), React__default.createElement("div", {
-    className: "nut-subsidenavbar__title border-bt"
+    className: "".concat(classPrefix, "__title ").concat(classPrefix, "-border-bt")
   }, title, " ", React__default.createElement("i", {
     className: iconClass
   })), React__default.createElement("div", {
-    className: "nut-subsidenavbar__content"
+    className: "".concat(classPrefix, "__content")
   }, children));
 };
 export {

package/dist/esm/Swiper.js

@@ -26,7 +26,7 @@ function _objectSpread(target) {
 }
 import React__default, { useRef, useState, useMemo, useEffect } from "react";
 import classNames from "classnames";
-import { D as DataContext } from "./context3.js";
+import { D as DataContext } from "./context4.js";
 import { g as getRect } from "./use-client-rect.js";
 import Indicator from "./Indicator.js";
 var defaultProps = {

package/dist/esm/SwiperItem.js

@@ -22,7 +22,7 @@ function _objectSpread(target) {
 }
 import React__default, { useContext } from "react";
 import classNames from "classnames";
-import { D as DataContext } from "./context3.js";
+import { D as DataContext } from "./context4.js";
 import { c as cn } from "./bem.js";
 import "@bem-react/classname";
 var defaultProps = {

package/dist/esm/Tag/style/style.css

@@ -1 +1 @@
-.nut-tag{padding:var(--nutui-tag-padding, 0 4px);display:inline-flex;justify-content:center;align-items:center;font-size:var(--nutui-tag-font-size, 12px);border-radius:var(--nutui-tag-default-border-radius, 4px);height:var(--nutui-tag-height, auto)}.nut-tag .nut-icon{vertical-align:middle;margin-left:4px}.nut-tag--default{color:var(--nutui-tag-default-color, #ffffff);background:var(--nutui-tag-default-background-color, #000000);border:var(--nutui-tag-border-width, 1px) solid transparent}.nut-tag--default.nut-tag--plain{color:var(--nutui-tag-default-background-color, #000000);border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-default-background-color, #000000)}.nut-tag--primary{color:var(--nutui-tag-default-color, #ffffff);background:var(--nutui-tag-primary-background-color, #3460fa);border:var(--nutui-tag-border-width, 1px) solid transparent}.nut-tag--primary.nut-tag--plain{color:var(--nutui-tag-default-background-color, #000000);border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-default-background-color, #000000)}.nut-tag--success{color:var(--nutui-tag-default-color, #ffffff);background:var(--nutui-tag-success-background-color, #4fc08d);border:var(--nutui-tag-border-width, 1px) solid transparent}.nut-tag--success.nut-tag--plain{color:var(--nutui-tag-default-background-color, #000000);border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-default-background-color, #000000)}.nut-tag--danger{color:var(--nutui-tag-default-color, #ffffff);background:linear-gradient(135deg,rgb(242,20,12) 0%,rgb(232,34,14) 69.8395009973%,rgb(242,77,12) 100%);border:var(--nutui-tag-border-width, 1px) solid transparent}.nut-tag--danger.nut-tag--plain{color:var(--nutui-tag-default-background-color, #000000);border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-default-background-color, #000000)}.nut-tag--warning{color:var(--nutui-tag-default-color, #ffffff);background:var(--nutui-tag-warning-background-color, #f3812e);border:var(--nutui-tag-border-width, 1px) solid transparent}.nut-tag--warning.nut-tag--plain{color:var(--nutui-tag-default-background-color, #000000);border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-default-background-color, #000000)}.nut-tag--round{border-radius:8px}.nut-tag--mark{border-radius:0 12px 12px 0}.nut-tag--close{margin-left:4px;cursor:pointer}.nut-tag-custom-icon{display:inline-flex;align-items:center;justify-content:center}
+.nut-tag{padding:var(--nutui-tag-padding, 0 4px);display:inline-flex;justify-content:center;align-items:center;font-size:var(--nutui-tag-font-size, 12px);border-radius:var(--nutui-tag-border-radius, 4px);height:var(--nutui-tag-height, auto);color:var(--nutui-tag-color, #ffffff);border:var(--nutui-tag-border-width, 1px) solid transparent}.nut-tag .nut-icon{vertical-align:middle;margin-left:4px}.nut-tag--default{background:var(--nutui-tag-background-color, #000000)}.nut-tag--default.nut-tag--plain{color:var(--nutui-tag-background-color, #000000);background-color:#fff;border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-background-color, #000000)}.nut-tag--primary{background:var(--nutui-tag-primary-background-color, var(--nutui-brand-color, #fa2c19))}.nut-tag--primary.nut-tag--plain{color:var(--nutui-tag-background-color, #000000);background-color:#fff;border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-background-color, #000000)}.nut-tag--success{background:var(--nutui-tag-success-background-color, #4fc08d)}.nut-tag--success.nut-tag--plain{color:var(--nutui-tag-background-color, #000000);background-color:#fff;border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-background-color, #000000)}.nut-tag--danger{background:linear-gradient(135deg,rgb(242,20,12) 0%,rgb(232,34,14) 69.8395009973%,rgb(242,77,12) 100%)}.nut-tag--danger.nut-tag--plain{color:var(--nutui-tag-background-color, #000000);background-color:#fff;border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-background-color, #000000)}.nut-tag--warning{background:var(--nutui-tag-warning-background-color, #f3812e)}.nut-tag--warning.nut-tag--plain{color:var(--nutui-tag-background-color, #000000);background-color:#fff;border:var(--nutui-tag-border-width, 1px) solid var(--nutui-tag-background-color, #000000)}.nut-tag--round{border-radius:var(--nutui-tag-round-border-radius, 8px)}.nut-tag--mark{border-radius:var(--nutui-tag-mark-border-radius, 0 12px 12px 0)}.nut-tag--close{cursor:pointer}.nut-tag-custom-icon{display:inline-flex;align-items:center;justify-content:center}

package/dist/esm/Tag.js

@@ -27,80 +27,76 @@ import classNames from "classnames";
 import { C as ComponentDefaults } from "./typings.js";
 var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
   type: "default",
+  background: "",
   color: "",
-  textColor: "",
   plain: false,
   round: false,
   mark: false,
   closeable: false,
   closeIcon: null,
-  prefixCls: "nut-tag",
   onClose: function onClose(e) {
   },
   onClick: function onClick(e) {
   }
 });
 var Tag = function Tag2(props) {
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, color = _defaultProps$props.color, plain = _defaultProps$props.plain, type = _defaultProps$props.type, round = _defaultProps$props.round, prefixCls = _defaultProps$props.prefixCls, children = _defaultProps$props.children, mark = _defaultProps$props.mark, closeable = _defaultProps$props.closeable, closeIcon = _defaultProps$props.closeIcon, textColor = _defaultProps$props.textColor, onClick2 = _defaultProps$props.onClick, onClose2 = _defaultProps$props.onClose;
-  var _useState = useState(""), _useState2 = _slicedToArray(_useState, 2), btnName = _useState2[0], setBtnName = _useState2[1];
-  var _useState3 = useState(true), _useState4 = _slicedToArray(_useState3, 2), isTagShow = _useState4[0], setIsTagShow = _useState4[1];
-  useEffect(function() {
-    setBtnName(classes());
-  }, [type, color, textColor, plain, round, mark, closeable, prefixCls, onClick2, onClose2, className]);
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), className = _defaultProps$props.className, style = _defaultProps$props.style, background = _defaultProps$props.background, plain = _defaultProps$props.plain, type = _defaultProps$props.type, round = _defaultProps$props.round, children = _defaultProps$props.children, mark = _defaultProps$props.mark, closeable = _defaultProps$props.closeable, closeIcon = _defaultProps$props.closeIcon, color = _defaultProps$props.color, onClick2 = _defaultProps$props.onClick, onClose2 = _defaultProps$props.onClose;
+  var _useState = useState(""), _useState2 = _slicedToArray(_useState, 2), tagClass = _useState2[0], setTagClass = _useState2[1];
+  var _useState3 = useState(true), _useState4 = _slicedToArray(_useState3, 2), visible = _useState4[0], setVisible = _useState4[1];
+  var classPrefix = "nut-tag";
   var classes = function classes2() {
     var _classNames;
-    var prefixCls2 = "nut-tag";
-    return classNames((_classNames = {}, _defineProperty(_classNames, prefixCls2, true), _defineProperty(_classNames, "".concat(prefixCls2, "--").concat(type), type), _defineProperty(_classNames, "".concat(prefixCls2, "--plain"), plain), _defineProperty(_classNames, "".concat(prefixCls2, "--round"), round), _defineProperty(_classNames, "".concat(prefixCls2, "--mark"), mark), _defineProperty(_classNames, "".concat(prefixCls2, "--close"), closeable), _defineProperty(_classNames, "".concat(className), className), _classNames));
+    return classNames((_classNames = {}, _defineProperty(_classNames, classPrefix, true), _defineProperty(_classNames, "".concat(classPrefix, "--").concat(type), type), _defineProperty(_classNames, "".concat(classPrefix, "--plain"), plain), _defineProperty(_classNames, "".concat(classPrefix, "--round"), round), _defineProperty(_classNames, "".concat(classPrefix, "--mark"), mark), _defineProperty(_classNames, "".concat(classPrefix, "--close"), closeable), _defineProperty(_classNames, "".concat(className), className), _classNames));
   };
+  useEffect(function() {
+    setTagClass(classes());
+  }, [type, background, color, plain, round, mark, closeable, className]);
   var handleClick = function handleClick2(e) {
-    if (props.onClick) {
-      props.onClick(e);
-    }
+    onClick2 && onClick2(e);
   };
   var getStyle = function getStyle2() {
     var style2 = {};
-    if (textColor) {
-      style2.color = textColor;
-    } else if (color && plain) {
+    if (color) {
       style2.color = color;
+    } else if (background && plain) {
+      style2.color = background;
     }
     if (plain) {
-      style2.background = "#fff";
-      style2.borderColor = color;
-    } else if (color) {
-      style2.background = color;
+      style2.borderColor = background;
+    } else if (background) {
+      style2.background = background;
     }
     return style2;
   };
-  return React__default.createElement(React__default.Fragment, null, closeable ? isTagShow && React__default.createElement("div", {
-    className: btnName,
+  return React__default.createElement(React__default.Fragment, null, closeable ? visible && React__default.createElement("div", {
+    className: tagClass,
     style: _objectSpread(_objectSpread({}, style), getStyle()),
     onClick: function onClick3(e) {
       return handleClick(e);
     }
   }, children && React__default.createElement("span", {
-    className: "nut-tag-text"
+    className: "".concat(classPrefix, "-text")
   }, children), React__default.isValidElement(closeIcon) ? React__default.createElement("i", {
-    className: "nut-tag-custom-icon",
+    className: "".concat(classPrefix, "-custom-icon"),
     onClick: function onClick3(e) {
-      setIsTagShow(false);
-      props.onClose && props.onClose(e);
+      setVisible(false);
+      onClose2 && onClose2(e);
     }
   }, closeIcon) : React__default.createElement(Close, {
     width: 12,
     height: 12,
     onClick: function onClick3(e) {
-      setIsTagShow(false);
-      props.onClose && props.onClose(e);
+      setVisible(false);
+      onClose2 && onClose2(e);
     }
   })) : React__default.createElement("div", {
-    className: btnName,
+    className: tagClass,
     style: _objectSpread(_objectSpread({}, style), getStyle()),
     onClick: function onClick3(e) {
       return handleClick(e);
     }
   }, children && React__default.createElement("span", {
-    className: "nut-tag-text"
+    className: "".concat(classPrefix, "-text")
   }, children)));
 };
 Tag.defaultProps = defaultProps;

package/dist/esm/TextArea/style/style.css

@@ -1 +1 @@
-.nut-textarea{position:relative;width:100%;box-sizing:border-box;display:flex;background:var(--nutui-gray-6, #ffffff);font-size:var(--nutui-textarea-font, var(--nutui-font-size-2, 14px));padding:var(--nutui-textarea-padding, 10px 25px)}.nut-textarea__disabled .nut-textarea__textarea,.nut-textarea__disabled .nut-textarea__limit{cursor:not-allowed;color:var(--nutui-textarea-disabled-color, var(--nutui-gray-3, #bfbfbf))!important}.nut-textarea__limit{position:absolute;right:15px;bottom:12px;font-size:var(--nutui-textarea-font, var(--nutui-font-size-2, 14px));color:var(--nutui-textarea-limit-color, var(--nutui-gray-2, #757575))}.nut-textarea__textarea{outline:none;display:block;box-sizing:border-box;width:100%;min-width:0;margin:0;padding:0;font-size:var(--nutui-textarea-font, var(--nutui-font-size-2, 14px));color:var(--nutui-textarea-text-color, var(--nutui-gray-1, #1a1a1a));caret-color:var(--nutui-textarea-text-curror-color, "$title-color");text-align:left;background-color:transparent;border:0;resize:none}.nut-textarea__textarea .taro-textarea{background-color:transparent;resize:none}.nut-textarea .cpoyText{position:absolute;top:-999999px;left:-999999px}
+.nut-textarea{position:relative;width:100%;box-sizing:border-box;display:flex;background:var(--nutui-gray-6, #ffffff);font-size:var(--nutui-textarea-font, var(--nutui-font-size-2, 14px));padding:var(--nutui-textarea-padding, 10px 25px)}.nut-textarea__disabled .nut-textarea__textarea,.nut-textarea__disabled .nut-textarea__limit{cursor:not-allowed;color:var(--nutui-textarea-disabled-color, var(--nutui-gray-3, #bfbfbf))!important}.nut-textarea__limit{position:absolute;right:15px;bottom:12px;font-size:var(--nutui-textarea-font, var(--nutui-font-size-2, 14px));color:var(--nutui-textarea-limit-color, var(--nutui-gray-2, #757575))}.nut-textarea__textarea{outline:none;display:block;box-sizing:border-box;width:100%;min-width:0;margin:0;padding:0;font-size:var(--nutui-textarea-font, var(--nutui-font-size-2, 14px));color:var(--nutui-textarea-text-color, var(--nutui-gray-1, #1a1a1a));caret-color:var(--nutui-textarea-text-curror-color, var(--nutui-gray-1, #1a1a1a));text-align:left;background-color:transparent;border:0;resize:none}.nut-textarea__textarea .taro-textarea{background-color:transparent;resize:none}.nut-textarea .cpoyText{position:absolute;top:-999999px;left:-999999px}

package/dist/esm/TimeDetail/style/style.css

@@ -1 +1 @@
-.nut-theme-dark .nut-timedetail{background-color:#1f1f1f}.nut-theme-dark .nut-timedetail__detail__list__item{background-color:#0a0a0a;color:#e6e6e6}.nut-theme-dark .nut-timedetail__detail__list__item--curr{color:var(--nutui-timeselect-timedetail-item-cur-text-color, var(--nutui-brand-color, #fa2c19))}.nut-timedetail{display:flex;align-content:flex-start;flex-wrap:wrap;padding:0 0 50px 13px}.nut-timedetail__item{width:100px;height:50px;line-height:50px;text-align:center;margin-right:10px;margin-bottom:10px;background-color:var(--nutui-gray-4, #f4f4f4);color:var(--nutui-gray-1, #1a1a1a);border-radius:5px;font-size:14px;border:1px solid transparent;font-weight:700}.nut-timedetail__item-active{background-color:#fa2c19}.nut-timedetail__item-active{background-color:var(--nutui-brand-color-opacity);border:1px solid var(--nutui-brand-color, #fa2c19);color:var(--nutui-brand-color, #fa2c19)}
+.nut-timedetail{display:flex;align-content:flex-start;flex-wrap:wrap;padding:0 0 50px 13px}.nut-timedetail__item{width:var(--nutui-timeselect-time-width, 100px);height:var(--nutui-timeselect-time-height, 50px);line-height:var(--nutui-timeselect-time-line-height, 50px);text-align:center;margin:var(--nutui-timeselect-time-margin, 0 10px 10px 0);background:var(--nutui-timeselect-time-background, var(--nutui-gray-4, #f4f4f4));color:var(--nutui-timeselect-time-color, var(--nutui-gray-1, #1a1a1a));border-radius:5px;font-size:var(--nutui-timeselect-font-size, 14px);border:1px solid transparent;font-weight:700}.nut-timedetail__item.active{background-color:var(--nutui-timeselect-time-active-background, var(--nutui-gray-5, #f8f8f8));border:1px solid var(--nutui-timeselect-time-active-color, var(--nutui-brand-color, #fa2c19));color:var(--nutui-timeselect-time-active-color, var(--nutui-brand-color, #fa2c19))}

package/dist/esm/TimeDetail.js

@@ -1,4 +1,3 @@
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(object, enumerableOnly) {
   var keys = Object.keys(object);
@@ -21,54 +20,53 @@ function _objectSpread(target) {
   }
   return target;
 }
-import React__default, { useState, useEffect } from "react";
-import { c as cn } from "./bem.js";
-import { useConfig } from "./ConfigProvider.js";
-import "@bem-react/classname";
-var defaultProps = {
-  className: "",
-  currentKey: 0,
-  currentTime: [],
-  times: [],
-  select: function select() {
-    return null;
+import React__default, { useMemo, useCallback } from "react";
+import classNames from "classnames";
+import { C as ComponentDefaults } from "./typings.js";
+var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
+  activeDate: "",
+  activeTime: [],
+  options: [],
+  optionKey: {
+    valueKey: "value",
+    textKey: "text",
+    childrenKey: "children"
+  },
+  onSelect: function onSelect() {
   }
-};
+});
 var TimeDetail = function TimeDetail2(props) {
-  useConfig();
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, times = _defaultProps$props.times, className = _defaultProps$props.className, currentKey = _defaultProps$props.currentKey, currentTime = _defaultProps$props.currentTime, select2 = _defaultProps$props.select;
-  var b = cn("timedetail");
-  var _useState = useState([]), _useState2 = _slicedToArray(_useState, 2), renderData = _useState2[0], setRenderData = _useState2[1];
-  useEffect(function() {
-    var currentData = times.find(function(timesItem) {
-      return String(timesItem.key) === String(currentKey);
-    });
-    var renderData2 = currentData ? currentData.list : [];
-    setRenderData(renderData2);
-  }, [times, currentKey]);
-  var handleTime = function handleTime2(time) {
-    select2(time);
-  };
-  var getDetailClass = function getDetailClass2(item) {
-    var initClass = "nut-timedetail__item";
-    var curTimeData = currentTime.find(function(item2) {
-      return String(item2.key) === String(currentKey);
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), options = _defaultProps$props.options, optionKey = _defaultProps$props.optionKey, className = _defaultProps$props.className, activeDate = _defaultProps$props.activeDate, activeTime = _defaultProps$props.activeTime, onSelect2 = _defaultProps$props.onSelect;
+  var classPrefix = "nut-timedetail";
+  var timeList = useMemo(function() {
+    return (options === null || options === void 0 ? void 0 : options.find(function(item) {
+      return item[optionKey.valueKey] === activeDate;
+    })) || _defineProperty({}, optionKey.childrenKey, []);
+  }, [options, optionKey, activeDate]);
+  var isActive = useCallback(function(timeKey) {
+    var date = activeTime.find(function(item) {
+      return item[optionKey.valueKey] === activeDate;
     });
-    if (curTimeData && curTimeData.list && curTimeData.list.includes(item)) {
-      initClass += " nut-timedetail__item-active";
+    if (date !== null && date !== void 0 && date[optionKey.childrenKey]) {
+      var time = date === null || date === void 0 ? void 0 : date[optionKey.childrenKey].find(function(time2) {
+        return time2[optionKey.valueKey] === timeKey;
+      });
+      return time;
     }
-    return initClass;
-  };
+    return false;
+  }, [activeTime, optionKey, activeDate]);
   return React__default.createElement("div", {
-    className: "".concat(b(), " ").concat(className || "")
-  }, renderData.map(function(item, index) {
+    className: classNames(classPrefix, className)
+  }, timeList[optionKey.childrenKey].map(function(item) {
     return React__default.createElement("span", {
-      className: getDetailClass(item),
-      key: item,
+      className: classNames("".concat(classPrefix, "__item"), {
+        active: isActive(item[optionKey.valueKey])
+      }),
+      key: item[optionKey.valueKey],
       onClick: function onClick() {
-        return handleTime(item);
+        return onSelect2(item);
       }
-    }, item);
+    }, item[optionKey.textKey]);
   }));
 };
 TimeDetail.defaultProps = defaultProps;

package/dist/esm/TimeSelect/style/index.js

@@ -1,4 +1,3 @@
 import '../../Popup/style'
-import '../../TimePannel/style'
 import '../../TimeDetail/style'
 import '../../../packages/timeselect/timeselect.scss'

package/dist/esm/TimeSelect/style/style.css

@@ -1 +1 @@
-.nut-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--nutui-overlay-bg-color, var(--nutui-gray-7, rgba(0, 0, 0, .7)))}.nut-overlay-fade-enter-active{animation:nut-fade-in}.nut-overlay-fade-enter-active .wrapper .content{background-color:var(--nutui-overlay-content-bg-color, var(--nutui-gray-6, #ffffff));color:var(--nutui-overlay-content-color, var(--nutui-gray-1, #1a1a1a))}.nut-overlay-fade-leave-active{animation:nut-fade-out}.nut-overlay-first-render,.nut-overlay-hidden-render{display:none}@keyframes nut-fade-in{0%{opacity:0}1%{opacity:0}to{opacity:1}}@keyframes nut-fade-out{0%{opacity:1}1%{opacity:1}to{opacity:0}}.nut-popup{position:fixed;max-height:100%;overflow-y:auto;background-color:var(--nutui-gray-6, #ffffff);color:var(--nutui-gray-1, #1a1a1a);-webkit-overflow-scrolling:touch}.nut-popup__close-icon{position:absolute!important;z-index:1;color:var(--nutui-popup-close-icon-color, #969799);cursor:pointer;width:30px;height:30px;display:flex;justify-content:center;align-items:center}.nut-popup__close-icon:active{opacity:.7}.nut-popup__close-icon--top-left{top:var(--nutui-popup-close-icon-margin, 16px);left:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon--top-right{top:var(--nutui-popup-close-icon-margin, 16px);right:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon--bottom-left{bottom:var(--nutui-popup-close-icon-margin, 16px);left:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon--bottom-right{right:var(--nutui-popup-close-icon-margin, 16px);bottom:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup-center{top:50%;left:50%;transform:translate(-50%,-50%)}.nut-popup-center.round{border-radius:var(--nutui-popup-border-radius, 20px)}.nut-popup-bottom{bottom:0;left:0;width:100%}.nut-popup-bottom.round{border-radius:var(--nutui-popup-border-radius, 20px) var(--nutui-popup-border-radius, 20px) 0 0}.nut-popup-right{top:0;right:0}.nut-popup-right.round{border-radius:var(--nutui-popup-border-radius, 20px) 0 0 var(--nutui-popup-border-radius, 20px)}.nut-popup-left{top:0;left:0}.nut-popup-left.round{border-radius:0 var(--nutui-popup-border-radius, 20px) var(--nutui-popup-border-radius, 20px) 0}.nut-popup-top{top:0;left:0;width:100%}.nut-popup-top.round{border-radius:0 0 var(--nutui-popup-border-radius, 20px) var(--nutui-popup-border-radius, 20px)}@keyframes popup-fade-in{0%{opacity:0}to{opacity:1}}@keyframes popup-fade-out{0%{opacity:1}to{opacity:0}}.nut-popup-slide-center-enter-active{animation-fill-mode:both;animation-name:popup-fade-in;animation-duration:.3s}.nut-popup-slide-center-exit-active{animation-fill-mode:both;animation-name:popup-fade-out;animation-duration:.3s}@keyframes popup-slide-top-enter{0%{transform:translate3d(0,-100%,0)}}@keyframes popup-slide-top-exit{to{transform:translate3d(0,-100%,0)}}.nut-popup-slide-top-enter-active,.nut-popup-slide-top-appear-active{transform:translateZ(0);animation-fill-mode:both;animation-name:popup-slide-top-enter;animation-duration:.3s}.nut-popup-slide-top-exit-active{animation-fill-mode:both;animation-name:popup-slide-top-exit;animation-duration:.3s}@keyframes popup-slide-right-enter{0%{transform:translate3d(100%,0,0)}}@keyframes popup-slide-right-exit{to{transform:translate3d(100%,0,0)}}.nut-popup-slide-right-enter-active,.nut-popup-slide-right-appear-active{transform:translateZ(0);animation-fill-mode:both;animation-name:popup-slide-right-enter;animation-duration:.3s}.nut-popup-slide-right-exit{animation-fill-mode:both;animation-name:popup-slide-right-exit;animation-duration:.3s}@keyframes popup-slide-bottom-enter{0%{transform:translate3d(0,100%,0)}}@keyframes slide-bottom-exit{to{transform:translate3d(0,100%,0)}}.nut-popup-slide-bottom-enter-active,.nut-popup-slide-bottom-appear-active{transform:translate(0);animation-fill-mode:both;animation-name:popup-slide-bottom-enter;animation-duration:.3s}.nut-popup-slide-bottom-exit{animation-fill-mode:both;animation-name:slide-bottom-exit;animation-duration:.3s}@keyframes popup-slide-left-enter{0%{transform:translate3d(-100%,0,0)}}@keyframes popup-slide-left-exit{to{transform:translate3d(-100%,0,0)}}.nut-popup-slide-left-enter-active,.nut-popup-slide-left-appear-active{transform:translate(0);animation-fill-mode:both;animation-name:popup-slide-left-enter;animation-duration:.3s}.nut-popup-slide-left-exit-active,.nut-popup-slide-left-exit-done{animation-fill-mode:both;animation-name:popup-slide-left-exit;animation-duration:.3s}.nut-overflow-hidden{overflow:hidden!important}.nut-theme-dark .nut-timepannel{background-color:#141414;color:#828282}.nut-theme-dark .nut-timepannel--curr{background-color:#141414;color:#e6e6e6}.nut-timepannel{height:var(--nutui-timeselect-timepannel-height, 40px);line-height:40px;text-align:center;color:var(--nutui-timeselect-timepannel-text-color, var(--nutui-gray-2, #757575));font-size:var(--nutui-timeselect-timepannel-font-size, var(--nutui-font-size-2, 14px))}.nut-theme-dark .nut-timedetail{background-color:#1f1f1f}.nut-theme-dark .nut-timedetail__detail__list__item{background-color:#0a0a0a;color:#e6e6e6}.nut-theme-dark .nut-timedetail__detail__list__item--curr{color:var(--nutui-timeselect-timedetail-item-cur-text-color, var(--nutui-brand-color, #fa2c19))}.nut-timedetail{display:flex;align-content:flex-start;flex-wrap:wrap;padding:0 0 50px 13px}.nut-timedetail__item{width:100px;height:50px;line-height:50px;text-align:center;margin-right:10px;margin-bottom:10px;background-color:var(--nutui-gray-4, #f4f4f4);color:var(--nutui-gray-1, #1a1a1a);border-radius:5px;font-size:14px;border:1px solid transparent;font-weight:700}.nut-timedetail__item-active{background-color:#fa2c19}.nut-timedetail__item-active{background-color:var(--nutui-brand-color-opacity);border:1px solid var(--nutui-brand-color, #fa2c19);color:var(--nutui-brand-color, #fa2c19)}.nut-theme-dark .nut-timeselect{background-color:#1f1f1f}.nut-theme-dark .nut-timeselect__title{background-color:#1f1f1f;color:#e6e6e6}.nut-theme-dark .nut-timeselect__content-left{background-color:#141414;color:#e6e6e6}.nut-theme-dark .nut-timeselect__content-left .nut-timepannel-active{background-color:#1f1f1f;color:#e6e6e6}.nut-theme-dark .nut-timedetail__item{background-color:#0a0a0a;color:#e6e6e6}.nut-theme-dark .nut-timedetail__item-active{background-color:#fa2c19}.nut-timeselect{background-color:var(--nutui-gray-6, #ffffff);display:flex;flex-direction:column;height:100%}.nut-timeselect__title{height:var(--nutui-timeselect-title-height, 50px);line-height:var(--nutui-timeselect-title-line-height, 50px);margin-bottom:10px;font-size:var(--nutui-timeselect-title-font-size, var(--nutui-font-size-2, 14px));background-color:var(--nutui-gray-6, #ffffff);color:var(--nutui-gray-1, #1a1a1a);text-align:center}.nut-timeselect__content{display:flex;flex:1}.nut-timeselect__content-left{width:140px;min-width:140px;height:100%;overflow:auto;background-color:var(--nutui-gray-5, #f8f8f8);color:var(--nutui-gray-1, #1a1a1a)}.nut-timeselect__content-left .nut-timepannel-active{background-color:var(--nutui-brand-color, #fa2c19)}.nut-timeselect .nut-timepannel-active{background-color:var(--nutui-gray-6, #ffffff);color:var(--nutui-gray-1, #1a1a1a);font-weight:700}
+.nut-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--nutui-overlay-bg-color, var(--nutui-gray-7, rgba(0, 0, 0, .7)))}.nut-overlay-fade-enter-active{animation:nut-fade-in}.nut-overlay-fade-enter-active .wrapper .content{background-color:var(--nutui-overlay-content-bg-color, var(--nutui-gray-6, #ffffff));color:var(--nutui-overlay-content-color, var(--nutui-gray-1, #1a1a1a))}.nut-overlay-fade-leave-active{animation:nut-fade-out}.nut-overlay-first-render,.nut-overlay-hidden-render{display:none}@keyframes nut-fade-in{0%{opacity:0}1%{opacity:0}to{opacity:1}}@keyframes nut-fade-out{0%{opacity:1}1%{opacity:1}to{opacity:0}}.nut-popup{position:fixed;max-height:100%;overflow-y:auto;background-color:var(--nutui-gray-6, #ffffff);color:var(--nutui-gray-1, #1a1a1a);-webkit-overflow-scrolling:touch}.nut-popup__close-icon{position:absolute!important;z-index:1;color:var(--nutui-popup-close-icon-color, #969799);cursor:pointer;width:30px;height:30px;display:flex;justify-content:center;align-items:center}.nut-popup__close-icon:active{opacity:.7}.nut-popup__close-icon--top-left{top:var(--nutui-popup-close-icon-margin, 16px);left:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon--top-right{top:var(--nutui-popup-close-icon-margin, 16px);right:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon--bottom-left{bottom:var(--nutui-popup-close-icon-margin, 16px);left:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup__close-icon--bottom-right{right:var(--nutui-popup-close-icon-margin, 16px);bottom:var(--nutui-popup-close-icon-margin, 16px)}.nut-popup-center{top:50%;left:50%;transform:translate(-50%,-50%)}.nut-popup-center.round{border-radius:var(--nutui-popup-border-radius, 20px)}.nut-popup-bottom{bottom:0;left:0;width:100%}.nut-popup-bottom.round{border-radius:var(--nutui-popup-border-radius, 20px) var(--nutui-popup-border-radius, 20px) 0 0}.nut-popup-right{top:0;right:0}.nut-popup-right.round{border-radius:var(--nutui-popup-border-radius, 20px) 0 0 var(--nutui-popup-border-radius, 20px)}.nut-popup-left{top:0;left:0}.nut-popup-left.round{border-radius:0 var(--nutui-popup-border-radius, 20px) var(--nutui-popup-border-radius, 20px) 0}.nut-popup-top{top:0;left:0;width:100%}.nut-popup-top.round{border-radius:0 0 var(--nutui-popup-border-radius, 20px) var(--nutui-popup-border-radius, 20px)}@keyframes popup-scale-fade-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes popup-scale-fade-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.nut-popup-slide-default-enter-active{animation-fill-mode:both;animation-name:popup-scale-fade-in;animation-duration:.3s}.nut-popup-slide-default-exit-active{animation-fill-mode:both;animation-name:popup-scale-fade-out;animation-duration:.3s}@keyframes popup-fade-in{0%{opacity:0}to{opacity:1}}@keyframes popup-fade-out{0%{opacity:1}to{opacity:0}}.nut-popup-slide-center-enter-active{animation-fill-mode:both;animation-name:popup-fade-in;animation-duration:.3s}.nut-popup-slide-center-exit-active{animation-fill-mode:both;animation-name:popup-fade-out;animation-duration:.3s}@keyframes popup-slide-top-enter{0%{transform:translate3d(0,-100%,0)}}@keyframes popup-slide-top-exit{to{transform:translate3d(0,-100%,0)}}.nut-popup-slide-top-enter-active,.nut-popup-slide-top-appear-active{transform:translateZ(0);animation-fill-mode:both;animation-name:popup-slide-top-enter;animation-duration:.3s}.nut-popup-slide-top-exit-active{animation-fill-mode:both;animation-name:popup-slide-top-exit;animation-duration:.3s}@keyframes popup-slide-right-enter{0%{transform:translate3d(100%,0,0)}}@keyframes popup-slide-right-exit{to{transform:translate3d(100%,0,0)}}.nut-popup-slide-right-enter-active,.nut-popup-slide-right-appear-active{transform:translateZ(0);animation-fill-mode:both;animation-name:popup-slide-right-enter;animation-duration:.3s}.nut-popup-slide-right-exit{animation-fill-mode:both;animation-name:popup-slide-right-exit;animation-duration:.3s}@keyframes popup-slide-bottom-enter{0%{transform:translate3d(0,100%,0)}}@keyframes slide-bottom-exit{to{transform:translate3d(0,100%,0)}}.nut-popup-slide-bottom-enter-active,.nut-popup-slide-bottom-appear-active{transform:translate(0);animation-fill-mode:both;animation-name:popup-slide-bottom-enter;animation-duration:.3s}.nut-popup-slide-bottom-exit{animation-fill-mode:both;animation-name:slide-bottom-exit;animation-duration:.3s}@keyframes popup-slide-left-enter{0%{transform:translate3d(-100%,0,0)}}@keyframes popup-slide-left-exit{to{transform:translate3d(-100%,0,0)}}.nut-popup-slide-left-enter-active,.nut-popup-slide-left-appear-active{transform:translate(0);animation-fill-mode:both;animation-name:popup-slide-left-enter;animation-duration:.3s}.nut-popup-slide-left-exit-active,.nut-popup-slide-left-exit-done{animation-fill-mode:both;animation-name:popup-slide-left-exit;animation-duration:.3s}.nut-overflow-hidden{overflow:hidden!important}.nut-timedetail{display:flex;align-content:flex-start;flex-wrap:wrap;padding:0 0 50px 13px}.nut-timedetail__item{width:var(--nutui-timeselect-time-width, 100px);height:var(--nutui-timeselect-time-height, 50px);line-height:var(--nutui-timeselect-time-line-height, 50px);text-align:center;margin:var(--nutui-timeselect-time-margin, 0 10px 10px 0);background:var(--nutui-timeselect-time-background, var(--nutui-gray-4, #f4f4f4));color:var(--nutui-timeselect-time-color, var(--nutui-gray-1, #1a1a1a));border-radius:5px;font-size:var(--nutui-timeselect-font-size, 14px);border:1px solid transparent;font-weight:700}.nut-timedetail__item.active{background-color:var(--nutui-timeselect-time-active-background, var(--nutui-gray-5, #f8f8f8));border:1px solid var(--nutui-timeselect-time-active-color, var(--nutui-brand-color, #fa2c19));color:var(--nutui-timeselect-time-active-color, var(--nutui-brand-color, #fa2c19))}.nut-timeselect{background-color:var(--nutui-gray-6, #ffffff);display:flex;flex-direction:column;height:100%}.nut-timeselect__title{height:var(--nutui-timeselect-title-height, 50px);line-height:var(--nutui-timeselect-title-line-height, 50px);margin-bottom:10px;font-size:var(--nutui-timeselect-title-font-size, var(--nutui-font-size-2, 14px));background:var(--nutui-timeselect-title-background, var(--nutui-gray-6, #ffffff));color:var(--nutui-gray-1, #1a1a1a);text-align:center}.nut-timeselect__content{display:flex;flex:1}.nut-timeselect__content-left{width:var(--nutui-timeselect-date-width, 140px);min-width:var(--nutui-timeselect-date-width, 140px);height:100%;overflow:auto;background:var(--nutui-gray-5, #f8f8f8)}.nut-timepannel{height:var(--nutui-timeselect-date-height, 40px);line-height:var(--nutui-timeselect-date-line-height, 40px);text-align:center;color:var(--nutui-timeselect-date-color, var(--nutui-gray-2, #757575));font-size:var(--nutui-timeselect-date-font-size, var(--nutui-font-size-2, 14px))}.nut-timepannel.active{background:var(--nutui-gray-6, #ffffff);color:var(--nutui-timeselect-date-active-color, var(--nutui-gray-1, #1a1a1a));font-weight:700}