@nutui/nutui-react 1.1.0 → 1.1.1-beta.0

package/dist/esm/Picker.js

@@ -64,9 +64,9 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
   var isHidden = function isHidden(index) {
     if (index >= currIndex + 8 || index <= currIndex - 8) {
       return true;
-    } else {
-      return false;
     }
+
+    return false;
   };
 
   var setTransform = function setTransform() {
@@ -151,8 +151,8 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
     var moveTime = lastTime - touchParams.startTime;
 
     if (moveTime <= 300) {
-      move = move * 2;
-      moveTime = moveTime + 1000;
+      move *= 2;
+      moveTime += 1000;
       setMove(move, 'end', moveTime);
     } else {
       setMove(move, 'end', moveTime);
@@ -170,6 +170,13 @@ var InternalPickerSlot = function InternalPickerSlot(props, ref) {
           return true;
         }
       });
+    } else if (value && !value.value) {
+      listData.some(function (item, idx) {
+        if (item == value) {
+          index = idx;
+          return true;
+        }
+      });
     } else {
       index = listData.indexOf(defaultValue);
     }
@@ -356,7 +363,7 @@ var InternalPicker = function InternalPicker(props, ref) {
       _onClose && _onClose();
     }
   }, React__default.createElement("div", _objectSpread({
-    className: "".concat(b(), " ").concat(className ? className : ''),
+    className: "".concat(b(), " ").concat(className || ''),
     style: style
   }, rest), React__default.createElement("div", {
     className: b('control')
@@ -367,7 +374,7 @@ var InternalPicker = function InternalPicker(props, ref) {
     }
   }, "\u53D6\u6D88"), React__default.createElement("div", {
     className: b('title')
-  }, title ? title : ''), React__default.createElement("span", {
+  }, title || ''), React__default.createElement("span", {
     className: b('confirm-btn'),
     onClick: function onClick() {
       return confirm();

package/dist/esm/Popover.js

@@ -213,10 +213,10 @@ var Popover = function Popover(props) {
       style.left = 0;
     }
 
-    style.top = style.top + 'px';
-    style.left = style.left + 'px';
-    style.bottom = style.bottom + 'px';
-    style.right = style.right + 'px';
+    style.top += 'px';
+    style.left += 'px';
+    style.bottom += 'px';
+    style.right += 'px';
     return style;
   };
 
@@ -237,10 +237,10 @@ var Popover = function Popover(props) {
       style.top = -20;
     }
 
-    style.top = style.top + 'px';
-    style.left = style.left + 'px';
-    style.bottom = style.bottom + 'px';
-    style.right = style.right + 'px';
+    style.top += 'px';
+    style.left += 'px';
+    style.bottom += 'px';
+    style.right += 'px';
     return style;
   };
 

package/dist/esm/Popup.js

@@ -7,10 +7,10 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 import React__default, { useState, useEffect } from 'react';
 import { CSSTransition } from 'react-transition-group';
-import { d as defaultOverlayProps } from './overlay-418bcf84.js';
+import classNames from 'classnames';
+import { d as defaultOverlayProps } from './overlay-ed3eb37d.js';
 import Icon from './Icon.js';
 import Overlay from './Overlay.js';
-import classNames from 'classnames';
 import { c as cn } from './bem-893ad28d.js';
 import '@bem-react/classname';
 
@@ -65,7 +65,7 @@ var Popup = function Popup(props) {
       onClosed = props.onClosed,
       onClick = props.onClick;
 
-  var _useState = useState(zIndex ? zIndex : _zIndex),
+  var _useState = useState(zIndex || _zIndex),
       _useState2 = _slicedToArray(_useState, 2),
       index = _useState2[0],
       setIndex = _useState2[1];
@@ -95,7 +95,9 @@ var Popup = function Popup(props) {
 
   var popStyles = _objectSpread(_objectSpread({}, style), baseStyle);
 
-  var classes = classNames((_classNames = {}, _defineProperty(_classNames, 'round', round), _defineProperty(_classNames, "popup-".concat(position), true), _defineProperty(_classNames, "".concat(popClass), true), _defineProperty(_classNames, "".concat(className), true), _classNames), b(''));
+  var classes = classNames((_classNames = {
+    round: round
+  }, _defineProperty(_classNames, "popup-".concat(position), true), _defineProperty(_classNames, "".concat(popClass), true), _defineProperty(_classNames, "".concat(className), true), _classNames), b(''));
   var closeClasses = classNames(_defineProperty({
     'nutui-popup__close-icon': true
   }, "nutui-popup__close-icon--".concat(closeIconPosition), true));
@@ -158,7 +160,7 @@ var Popup = function Popup(props) {
     !visible && close();
   }, [visible]);
   useEffect(function () {
-    setTransitionName(transition ? transition : "popup-slide-".concat(position));
+    setTransitionName(transition || "popup-slide-".concat(position));
   }, [position]);
   return React__default.createElement(React__default.Fragment, null, React__default.createElement(Overlay, {
     style: overlayStyles,

package/dist/esm/Price.js

@@ -54,9 +54,9 @@ var Price = function Price(props) {
 
     if (thousands) {
       return (num || 0).toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,');
-    } else {
-      return num;
     }
+
+    return num;
   };
 
   var formatDecimal = function formatDecimal(decimalNum) {
@@ -71,7 +71,7 @@ var Price = function Price(props) {
       decimalNum = 0;
     }
 
-    var result = '0.' + decimalNum;
+    var result = "0.".concat(decimalNum);
     var resultFixed = Number(result).toFixed(decimalDigits);
     return String(resultFixed).substring(2, resultFixed.length);
   };

package/dist/esm/Range.js

@@ -362,7 +362,7 @@ var Range = function Range(props) {
   };
 
   return React__default.createElement("div", {
-    className: "nut-range-container ".concat(className ? className : '')
+    className: "nut-range-container ".concat(className || '')
   }, !hiddenRange ? React__default.createElement("div", {
     className: "min"
   }, +min) : null, React__default.createElement("div", {
@@ -404,7 +404,7 @@ var Range = function Range(props) {
       onClick: function onClick(e) {
         e.stopPropagation();
       }
-    }, button ? button : React__default.createElement("div", {
+    }, button || React__default.createElement("div", {
       className: "nut-range-button",
       style: buttonStyle()
     }, !hiddenTag ? React__default.createElement("div", {
@@ -433,7 +433,7 @@ var Range = function Range(props) {
     onClick: function onClick(e) {
       e.stopPropagation();
     }
-  }, button ? button : React__default.createElement("div", {
+  }, button || React__default.createElement("div", {
     className: "nut-range-button",
     style: buttonStyle()
   }, !hiddenTag ? React__default.createElement("div", {

package/dist/esm/ShortPassword.js

@@ -101,9 +101,9 @@ var ShortPassword = function ShortPassword(props) {
 
   var systemStyle = function systemStyle() {
     var u = navigator.userAgent;
-    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //g
+    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; // g
 
-    var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
+    var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); // ios终端
 
     if (isIOS) {
       return {

package/dist/esm/Skeleton/style/css.js

@@ -0,0 +1 @@
+require('../../../packages/skeleton/skeleton.css')

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

@@ -0,0 +1 @@
+require('../../../packages/skeleton/skeleton.scss')

package/dist/esm/Skeleton.js

@@ -0,0 +1,102 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["className", "width", "height", "animated", "row", "title", "avatar", "avatarSize", "round", "loading", "children", "avatarShape"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+import React__default from 'react';
+import classNames from 'classnames';
+import Avatar from './Avatar.js';
+import { c as cn } from './bem-893ad28d.js';
+import '@bem-react/classname';
+var defaultProps = {
+  width: 100,
+  height: 100,
+  row: 1,
+  animated: false,
+  title: false,
+  avatar: false,
+  round: false,
+  avatarSize: '50px',
+  loading: false,
+  avatarShape: 'round'
+};
+
+var Skeleton = function Skeleton(props) {
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+      className = _defaultProps$props.className,
+      width = _defaultProps$props.width,
+      height = _defaultProps$props.height,
+      animated = _defaultProps$props.animated,
+      row = _defaultProps$props.row,
+      title = _defaultProps$props.title,
+      avatar = _defaultProps$props.avatar,
+      avatarSize = _defaultProps$props.avatarSize,
+      round = _defaultProps$props.round,
+      loading = _defaultProps$props.loading,
+      children = _defaultProps$props.children,
+      avatarShape = _defaultProps$props.avatarShape,
+      restProps = _objectWithoutProperties(_defaultProps$props, _excluded);
+
+  var b = cn('skeleton');
+  var classes = classNames(className, b());
+  var blockClass = classNames({
+    blockClass: true,
+    'blockClass--round': round
+  });
+  var avatarClass = classNames(_defineProperty({
+    avatarClass: true
+  }, "avatarClass--".concat(avatarShape), avatarShape));
+
+  var repeatLines = function repeatLines(num) {
+    return Array.from({
+      length: num
+    }, function (v, i) {
+      return i;
+    });
+  };
+
+  var getStyle = function getStyle() {
+    return {
+      width: avatarSize,
+      height: avatarSize
+    };
+  };
+
+  return React__default.createElement(React__default.Fragment, null, loading ? React__default.createElement("div", null, children) : React__default.createElement("div", _objectSpread({
+    className: classes
+  }, restProps), React__default.createElement("div", {
+    className: "skeleton-animation"
+  }), React__default.createElement("div", {
+    className: "nut-skeleton-content"
+  }, avatar && React__default.createElement(Avatar, {
+    className: avatarClass,
+    bgColor: "rgb(239, 239, 239)",
+    style: getStyle()
+  }), row === 1 ? React__default.createElement("div", {
+    className: blockClass,
+    style: {
+      width: "".concat(width, "px"),
+      height: "".concat(height, "px")
+    }
+  }) : React__default.createElement("div", {
+    className: "skeleton-content-line"
+  }, title && React__default.createElement("div", {
+    className: "skeleton-title"
+  }), repeatLines(row).map(function (item, index) {
+    return React__default.createElement("div", {
+      className: "".concat(blockClass, " skeleton-lines"),
+      key: index,
+      style: {
+        width: "".concat(width, "px"),
+        height: "".concat(height, "px")
+      }
+    });
+  })))));
+};
+
+Skeleton.defaultProps = defaultProps;
+Skeleton.displayName = 'NutSkeleton';
+export { Skeleton as default };

package/dist/esm/Step.js

@@ -7,9 +7,9 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 import React__default, { useContext } from 'react';
+import classNames from 'classnames';
 import { D as DataContext } from './UserContext-68f62e66.js';
 import { c as cn } from './bem-893ad28d.js';
-import classNames from 'classnames';
 import Icon from './Icon.js';
 import '@bem-react/classname';
 var defaultProps = {

package/dist/esm/Steps.js

@@ -7,9 +7,9 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 import React__default from 'react';
+import classNames from 'classnames';
 import { D as DataContext } from './UserContext-68f62e66.js';
 import { c as cn } from './bem-893ad28d.js';
-import classNames from 'classnames';
 import '@bem-react/classname';
 var defaultProps = {
   current: 0,

package/dist/esm/Swiper.js

@@ -8,9 +8,9 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 import React__default, { useRef, useState, useEffect } from 'react';
+import classNames from 'classnames';
 import { D as DataContext } from './UserContext-b4181162.js';
 import { c as cn } from './bem-893ad28d.js';
-import classNames from 'classnames';
 import '@bem-react/classname';
 var defaultProps = {
   width: window.innerWidth,
@@ -129,7 +129,7 @@ var Swiper = React__default.forwardRef(function (props, ref) {
       if (child.type && child.type.displayName === 'NutSwiperItem') {
         childs.push(React__default.cloneElement(child, {
           ref: childsRefs[index],
-          key: 'item_' + index
+          key: "item_".concat(index)
         }));
       }
     });

package/dist/esm/SwiperItem.js

@@ -6,9 +6,9 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 import React__default, { useContext, useState, useImperativeHandle } from 'react';
+import classNames from 'classnames';
 import { D as DataContext } from './UserContext-b4181162.js';
 import { c as cn } from './bem-893ad28d.js';
-import classNames from 'classnames';
 import '@bem-react/classname';
 var defaultProps = {
   direction: 'horizontal'
@@ -48,7 +48,7 @@ var SwiperItem = React__default.forwardRef(function (props, ref) {
     }
 
     if (offset) {
-      style['transform'] = "translate3D".concat(_direction === 'horizontal' ? "(".concat(offset, "px,0,0)") : "(0,".concat(offset, "px,0)"));
+      style.transform = "translate3D".concat(_direction === 'horizontal' ? "(".concat(offset, "px,0,0)") : "(0,".concat(offset, "px,0)"));
     }
 
     return style;

package/dist/esm/Switch.js

@@ -47,9 +47,10 @@ var Switch = function Switch(props) {
   };
 
   var styles = function styles() {
-    var myStyle = Object.assign({}, {
+    var myStyle = _objectSpread({
       backgroundColor: value ? activeColor : inactiveColor
     }, style || {});
+
     return myStyle;
   };
 

package/dist/esm/TabPane/style/css.js

@@ -0,0 +1 @@
+require('../../../packages/tabpane/tabpane.css')

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

@@ -0,0 +1 @@
+require('../../../packages/tabpane/tabpane.scss')

package/dist/esm/TabPane.js

@@ -0,0 +1,33 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+import React__default from 'react';
+import classNames from 'classnames';
+import { c as cn } from './bem-893ad28d.js';
+import '@bem-react/classname';
+var defaultProps = {
+  title: '',
+  paneKey: '',
+  activeKey: '',
+  disabled: false
+};
+
+var TabPane = function TabPane(props) {
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+      children = _defaultProps$props.children,
+      paneKey = _defaultProps$props.paneKey,
+      activeKey = _defaultProps$props.activeKey;
+
+  var b = cn('tabpane');
+  var classes = classNames({
+    active: paneKey === activeKey
+  }, b(''));
+  return React__default.createElement("div", {
+    className: classes
+  }, children);
+};
+
+export { TabPane as default };

package/dist/esm/Tabs/style/css.js

@@ -0,0 +1 @@
+require('../../../packages/tabs/tabs.css')

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

@@ -0,0 +1 @@
+require('../../../packages/tabs/tabs.scss')

package/dist/esm/Tabs.js

@@ -0,0 +1,187 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+var _excluded = ["value", "color", "background", "direction", "type", "titleScroll", "ellipsis", "animatedTime", "titleGutter", "size", "titleNode", "children", "onClick", "onChange", "className"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+import React__default, { useState, useRef, useEffect } from 'react';
+import classNames from 'classnames';
+import { c as cn } from './bem-893ad28d.js';
+import Icon from './Icon.js';
+import '@bem-react/classname';
+
+var Title = /*#__PURE__*/_createClass( // eslint-disable-next-line no-useless-constructor
+function Title() {
+  _classCallCheck(this, Title);
+
+  _defineProperty(this, "title", '');
+
+  _defineProperty(this, "paneKey", '');
+
+  _defineProperty(this, "disabled", false);
+
+  _defineProperty(this, "index", 0);
+});
+
+var defaultProps = {
+  value: 0,
+  color: '',
+  background: '',
+  direction: 'horizontal',
+  type: 'line',
+  titleScroll: false,
+  ellipsis: true,
+  animatedTime: 300,
+  titleGutter: 0,
+  size: 'normal'
+};
+
+var pxCheck = function pxCheck(value) {
+  return Number.isNaN(Number(value)) ? String(value) : "".concat(value, "px");
+};
+
+var Tabs = function Tabs(props) {
+  var _classNames;
+
+  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props),
+      value = _defaultProps$props.value,
+      color = _defaultProps$props.color,
+      background = _defaultProps$props.background,
+      direction = _defaultProps$props.direction,
+      type = _defaultProps$props.type,
+      titleScroll = _defaultProps$props.titleScroll,
+      ellipsis = _defaultProps$props.ellipsis,
+      animatedTime = _defaultProps$props.animatedTime,
+      titleGutter = _defaultProps$props.titleGutter,
+      size = _defaultProps$props.size,
+      titleNode = _defaultProps$props.titleNode,
+      children = _defaultProps$props.children,
+      onClick = _defaultProps$props.onClick,
+      onChange = _defaultProps$props.onChange,
+      className = _defaultProps$props.className,
+      rest = _objectWithoutProperties(_defaultProps$props, _excluded);
+
+  var _useState = useState({
+    index: 0
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      currentItem = _useState2[0],
+      setCurrentItem = _useState2[1];
+
+  var titles = useRef([]);
+  useEffect(function () {
+    var currentIndex = 0;
+    titles.current = []; // eslint-disable-next-line consistent-return
+
+    React__default.Children.forEach(children, function (child, idx) {
+      var _child$props, _child$props2;
+
+      if (!React__default.isValidElement(child)) {
+        return null;
+      }
+
+      var title = new Title();
+
+      if ((_child$props = child.props) !== null && _child$props !== void 0 && _child$props.title || (_child$props2 = child.props) !== null && _child$props2 !== void 0 && _child$props2.paneKey) {
+        var _child$props3, _child$props4, _child$props5;
+
+        title.title = (_child$props3 = child.props) === null || _child$props3 === void 0 ? void 0 : _child$props3.title;
+        title.paneKey = ((_child$props4 = child.props) === null || _child$props4 === void 0 ? void 0 : _child$props4.paneKey) || idx;
+        title.disabled = (_child$props5 = child.props) === null || _child$props5 === void 0 ? void 0 : _child$props5.disabled;
+        title.index = idx;
+
+        if (title.paneKey === value) {
+          currentIndex = idx;
+        }
+      }
+
+      titles.current.push(title);
+    });
+    setCurrentItem(titles.current[currentIndex]);
+  }, [children]);
+  var b = cn('tabs');
+  var classes = classNames(direction, b(''), className);
+  var classesTitle = classNames((_classNames = {}, _defineProperty(_classNames, type, type), _defineProperty(_classNames, "scrollable", titleScroll), _defineProperty(_classNames, size, size), _classNames), "".concat(b(''), "__titles"));
+  var titleStyle = {
+    marginLeft: pxCheck(titleGutter),
+    marginRight: pxCheck(titleGutter)
+  };
+  var tabsActiveStyle = {
+    color: type === 'smile' ? color : '',
+    background: type === 'line' ? color : ''
+  };
+  var index = titles.current.findIndex(function (t) {
+    return t.paneKey === value;
+  });
+  var contentStyle = {
+    transform: direction === 'horizontal' ? "translate3d(-".concat(index * 100, "%, 0, 0)") : "translate3d( 0,-".concat(index * 100, "%, 0)"),
+    transitionDuration: "".concat(animatedTime, "ms")
+  };
+
+  var tabChange = function tabChange(item, index) {
+    onClick && onClick(item);
+
+    if (item.disabled) {
+      return;
+    }
+
+    setCurrentItem(item);
+    onChange && onChange(item);
+  };
+
+  return React__default.createElement("div", _objectSpread({
+    className: classes
+  }, rest), React__default.createElement("div", {
+    className: classesTitle,
+    style: {
+      background: background
+    }
+  }, !!titleNode && typeof titleNode === 'function' ? titleNode() : titles.current.map(function (item, index) {
+    return React__default.createElement("div", {
+      style: titleStyle,
+      onClick: function onClick(e) {
+        return tabChange(item);
+      },
+      className: classNames({
+        active: item.paneKey === value,
+        disabled: item.disabled
+      }, "".concat(b(''), "__titles-item")),
+      key: item.paneKey
+    }, type === 'line' && React__default.createElement("div", {
+      className: "".concat(b(''), "__titles-item__line"),
+      style: tabsActiveStyle
+    }), type === 'smile' && React__default.createElement("div", {
+      className: "".concat(b(''), "__titles-item__smile"),
+      style: tabsActiveStyle
+    }, React__default.createElement(Icon, {
+      color: color,
+      name: "joy-smile"
+    })), React__default.createElement("div", {
+      className: classNames({
+        ellipsis: ellipsis && !titleScroll && direction === 'horizontal'
+      }, "".concat(b(''), "__titles-item__text"))
+    }, item.title));
+  })), React__default.createElement("div", {
+    className: "".concat(b(''), "__content"),
+    style: contentStyle
+  }, React__default.Children.map(children, function (child, idx) {
+    if (!React__default.isValidElement(child)) {
+      return null;
+    }
+
+    var childProps = _objectSpread(_objectSpread({}, child.props), {}, {
+      activeKey: value
+    });
+
+    return React__default.cloneElement(child, childProps);
+  })));
+};
+
+Tabs.defaultProps = defaultProps;
+Tabs.displayName = 'NutTabs';
+export { Tabs as default };

package/dist/esm/Tag.js

@@ -62,16 +62,12 @@ var Tag = function Tag(props) {
 
       if (plain) {
         style.background = '#fff';
-      } else {
-        if (color) {
-          style.background = color;
-        }
-      }
-    } else {
-      if (color) {
-        style.color = '#fff';
+      } else if (color) {
         style.background = color;
       }
+    } else if (color) {
+      style.color = '#fff';
+      style.background = color;
     }
 
     return style;

package/dist/esm/TextArea.js

@@ -94,7 +94,7 @@ var TextArea = function TextArea(props) {
   };
 
   return React__default.createElement("div", {
-    className: "".concat(textareaBem(), " ").concat(disabled ? textareaBem('disabled') : '', " ").concat(className ? className : '')
+    className: "".concat(textareaBem(), " ").concat(disabled ? textareaBem('disabled') : '', " ").concat(className || '')
   }, React__default.createElement("textarea", {
     className: textareaBem('textarea'),
     style: _objectSpread({