@hi-ui/hiui 2.15.11 → 2.15.12

package/es/tabs/tabs-legacy/Tabs.js

@@ -0,0 +1,291 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _icon = _interopRequireDefault(require("../../icon"));
+
+var _tooltip = _interopRequireDefault(require("../../tooltip"));
+
+var _ItemDropdown = _interopRequireDefault(require("./ItemDropdown"));
+
+var noop = function noop() {};
+
+var Tabs =
+/*#__PURE__*/
+function (_Component) {
+  (0, _inherits2["default"])(Tabs, _Component);
+
+  function Tabs(props) {
+    var _this;
+
+    (0, _classCallCheck2["default"])(this, Tabs);
+    _this = (0, _possibleConstructorReturn2["default"])(this, (0, _getPrototypeOf2["default"])(Tabs).call(this, props));
+    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "deleteTabKey", null);
+    var defaultActiveKey = props.defaultActiveKey;
+
+    var _this$getTabItems = _this.getTabItems(_this.props),
+        showTabItems = _this$getTabItems.showTabItems,
+        hiddenTabItems = _this$getTabItems.hiddenTabItems;
+
+    _this.state = {
+      activeKey: defaultActiveKey || showTabItems[0].tabKey,
+      showTabItems: showTabItems,
+      hiddenTabItems: hiddenTabItems
+    };
+    return _this;
+  }
+
+  (0, _createClass2["default"])(Tabs, [{
+    key: "componentWillReceiveProps",
+    value: function componentWillReceiveProps(nextProps) {
+      var _this2 = this;
+
+      var _this$getTabItems2 = this.getTabItems(nextProps),
+          showTabItems = _this$getTabItems2.showTabItems,
+          hiddenTabItems = _this$getTabItems2.hiddenTabItems;
+
+      this.setState({
+        showTabItems: showTabItems,
+        hiddenTabItems: hiddenTabItems
+      });
+
+      if (this.props.defaultActiveKey !== nextProps.defaultActiveKey) {
+        this.setState({
+          activeKey: nextProps.defaultActiveKey
+        });
+      }
+
+      if (this.props.children.length > nextProps.children.length && this.deleteTabKey && this.deleteTabKey === this.state.activeKey) {
+        // 删除的是当前激活的tab，需重置激活tab
+        this.setState({
+          activeKey: nextProps.children[0].props.tabKey
+        }, function () {
+          _this2.deleteTabKey = null;
+        });
+      }
+    }
+  }, {
+    key: "getTabItems",
+    value: function getTabItems(props) {
+      var children = props.children,
+          type = props.type,
+          placement = props.placement,
+          showTabsNum = props.showTabsNum;
+      var showTabItems = [];
+      var hiddenTabItems = [];
+
+      _react["default"].Children.map(children, function (child, index) {
+        if (child) {
+          var _child$props = child.props,
+              tabName = _child$props.tabName,
+              tabKey = _child$props.tabKey,
+              tabDesc = _child$props.tabDesc,
+              disabled = _child$props.disabled,
+              closeable = _child$props.closeable;
+          var item = {
+            tabName: tabName,
+            tabKey: tabKey,
+            tabDesc: tabDesc,
+            disabled: disabled,
+            closeable: closeable
+          };
+
+          if (type === 'card' && placement === 'top' && showTabItems.length >= showTabsNum) {
+            // 卡片式标签超过showTabsNum时，其余标签的隐藏
+            hiddenTabItems.push(item);
+          } else {
+            showTabItems.push(item);
+          }
+        }
+      });
+
+      return {
+        showTabItems: showTabItems,
+        hiddenTabItems: hiddenTabItems
+      };
+    }
+  }, {
+    key: "handleClick",
+    value: function handleClick(tab, e) {
+      var _this3 = this;
+
+      if (tab.disabled) {
+        return false;
+      }
+
+      this.setState({
+        activeKey: tab.tabKey
+      }, function () {
+        var onTabClick = _this3.props.onTabClick;
+        onTabClick(tab.tabKey, e);
+      });
+    }
+  }, {
+    key: "addTab",
+    value: function addTab() {
+      var _this$props = this.props,
+          onEdit = _this$props.onEdit,
+          editable = _this$props.editable,
+          children = _this$props.children;
+
+      if (editable) {
+        onEdit('add', children.length + 1);
+      }
+    }
+  }, {
+    key: "deleteTab",
+    value: function deleteTab(e, tabKey, index) {
+      e.stopPropagation();
+      this.deleteTabKey = tabKey;
+      var _this$props2 = this.props,
+          onEdit = _this$props2.onEdit,
+          editable = _this$props2.editable;
+
+      if (editable) {
+        onEdit('delete', index, tabKey);
+      }
+    }
+  }, {
+    key: "checkEditable",
+    value: function checkEditable() {
+      var _this$props3 = this.props,
+          editable = _this$props3.editable,
+          type = _this$props3.type;
+      return editable && type === 'editable';
+    }
+  }, {
+    key: "renderTabContent",
+    value: function renderTabContent(child) {
+      var tabKey = child.props.tabKey;
+      var activeKey = this.state.activeKey;
+      return (0, _react.cloneElement)(child, {
+        show: tabKey === activeKey
+      });
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this4 = this;
+
+      var _this$state = this.state,
+          activeKey = _this$state.activeKey,
+          showTabItems = _this$state.showTabItems,
+          hiddenTabItems = _this$state.hiddenTabItems;
+      var _this$props4 = this.props,
+          prefixCls = _this$props4.prefixCls,
+          type = _this$props4.type,
+          placement = _this$props4.placement,
+          children = _this$props4.children,
+          className = _this$props4.className;
+      var editable = this.checkEditable();
+      var tabsClasses = (0, _classnames["default"])(prefixCls, className, "".concat(prefixCls, "--").concat(type), (0, _defineProperty2["default"])({}, "".concat(prefixCls, "--").concat(placement), type === 'card'));
+      var activeTabInHiddenItems = true;
+      return _react["default"].createElement("div", {
+        className: tabsClasses
+      }, _react["default"].createElement("div", {
+        className: "".concat(prefixCls, "__header")
+      }, _react["default"].createElement("div", {
+        className: "".concat(prefixCls, "__nav")
+      }, showTabItems.map(function (item, index) {
+        var _classNames2;
+
+        var tabName = item.tabName,
+            tabKey = item.tabKey,
+            tabDesc = item.tabDesc,
+            disabled = item.disabled,
+            closeable = item.closeable;
+        var itemClasses = (0, _classnames["default"])("".concat(prefixCls, "__item"), (_classNames2 = {}, (0, _defineProperty2["default"])(_classNames2, "".concat(prefixCls, "__item--active"), tabKey === activeKey), (0, _defineProperty2["default"])(_classNames2, "".concat(prefixCls, "__item--disabled"), disabled), _classNames2));
+        activeTabInHiddenItems = activeTabInHiddenItems && tabKey !== activeKey;
+        var ToolNav = type === 'editable' && tabKey !== activeKey ? _tooltip["default"] : 'div';
+        return _react["default"].createElement(ToolNav, {
+          className: itemClasses,
+          key: "".concat(prefixCls, "__item-").concat(index),
+          onClick: function onClick(e) {
+            return _this4.handleClick(item, e);
+          },
+          title: tabName
+        }, _react["default"].createElement("span", {
+          className: "".concat(prefixCls, "__item-name")
+        }, tabName), type === 'desc' && _react["default"].createElement("span", {
+          className: "".concat(prefixCls, "__item-desc")
+        }, tabDesc), editable && closeable && _react["default"].createElement("span", {
+          className: "".concat(prefixCls, "__item-close")
+        }, _react["default"].createElement(_icon["default"], {
+          onClick: function onClick(e) {
+            return _this4.deleteTab(e, tabKey, index);
+          },
+          name: "close"
+        })));
+      }), hiddenTabItems.length > 0 && _react["default"].createElement("div", {
+        className: (0, _classnames["default"])("".concat(prefixCls, "__item"), (0, _defineProperty2["default"])({}, "".concat(prefixCls, "__item--active"), activeTabInHiddenItems))
+      }, _react["default"].createElement(_ItemDropdown["default"], {
+        active: activeTabInHiddenItems,
+        items: hiddenTabItems,
+        onChoose: function onChoose(item, e) {
+          _this4.handleClick(item, e);
+        }
+      }))), editable && _react["default"].createElement("div", {
+        className: "".concat(prefixCls, "__add")
+      }, _react["default"].createElement(_icon["default"], {
+        onClick: this.addTab.bind(this),
+        name: "plus"
+      }))), _react["default"].createElement("div", {
+        className: "".concat(prefixCls, "__content")
+      }, _react["default"].Children.map(children, function (item) {
+        return item && _this4.renderTabContent(item);
+      })));
+    }
+  }]);
+  return Tabs;
+}(_react.Component);
+
+(0, _defineProperty2["default"])(Tabs, "propTypes", {
+  type: _propTypes["default"].oneOf(['desc', 'card', 'button', 'editable']),
+  placement: _propTypes["default"].oneOf(['top', 'left']),
+  defaultActiveKey: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
+  showTabsNum: _propTypes["default"].number,
+  editable: _propTypes["default"].bool,
+  className: _propTypes["default"].string,
+  renderTabBar: _propTypes["default"].func,
+  onTabClick: _propTypes["default"].func,
+  onEdit: _propTypes["default"].func
+});
+(0, _defineProperty2["default"])(Tabs, "defaultProps", {
+  prefixCls: 'hi-tabs-legacy',
+  type: 'card',
+  placement: 'top',
+  className: '',
+  showTabsNum: 6,
+  editable: true,
+  onTabClick: noop,
+  onEdit: noop
+});
+var _default = Tabs;
+exports["default"] = _default;

package/es/tabs/tabs-legacy/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _Tabs = _interopRequireDefault(require("./Tabs"));
+
+var _TabPane = _interopRequireDefault(require("./TabPane"));
+
+require("./style/index");
+
+_Tabs["default"].Pane = _TabPane["default"];
+var _default = _Tabs["default"];
+exports["default"] = _default;

package/es/tabs/tabs-legacy/style/index.css

@@ -0,0 +1 @@
+.hi-tabs-legacy .hi-tabs-legacy__header{position:relative;font-size:14px;color:#333}.hi-tabs-legacy .hi-tabs-legacy__item{-webkit-box-flex:0;-ms-flex:0 1 auto;flex:0 1 auto;cursor:pointer;border:1px solid transparent}.hi-tabs-legacy .hi-tabs-legacy__item{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.hi-tabs-legacy .hi-tabs-legacy__item--active{-webkit-box-flex:0;-ms-flex:none;flex:none}.hi-tabs-legacy .hi-tabs-legacy__item .hi-icon:not(.icon-close){margin-right:4px}.hi-tabs-legacy .hi-tabs-legacy__add{position:absolute;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;width:24px;height:24px;color:#979797;border-radius:2px;border:1px solid #d8d8d8;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box}.hi-tabs-legacy .hi-tabs-legacy__item-close{margin-left:8px;font-size:12px}.hi-tabs-legacy--card .hi-tabs-legacy__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.hi-tabs-legacy--card .hi-tabs-legacy__item{height:48px;line-height:48px;padding:0 16px;-webkit-box-sizing:border-box;box-sizing:border-box}.hi-tabs-legacy--card .hi-tabs-legacy__item:hover{color:#4284f5}.hi-tabs-legacy--card .hi-tabs-legacy__item--active{border:1px solid #e6e7e8;color:#4284f5}.hi-tabs-legacy--card.hi-tabs-legacy--top .hi-tabs-legacy__nav{margin-bottom:-1px}.hi-tabs-legacy--card.hi-tabs-legacy--top .hi-tabs-legacy__header{border-bottom:1px solid #e6e7e8}.hi-tabs-legacy--card.hi-tabs-legacy--top .hi-tabs-legacy__item{margin-right:16px}.hi-tabs-legacy--card.hi-tabs-legacy--top .hi-tabs-legacy__item--active{border-bottom-color:#fff}.hi-tabs-legacy--card.hi-tabs-legacy--left{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.hi-tabs-legacy--card.hi-tabs-legacy--left .hi-tabs-legacy__header{-webkit-box-flex:0;-ms-flex:none;flex:none;display:inline-block;border-right:1px solid #e6e7e8}.hi-tabs-legacy--card.hi-tabs-legacy--left .hi-tabs-legacy__nav{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-right:-1px}.hi-tabs-legacy--card.hi-tabs-legacy--left .hi-tabs-legacy__item--active{border-right-color:#fff}.hi-tabs-legacy--editable .hi-tabs-legacy__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow:hidden;margin-bottom:-1px;margin-right:40px}.hi-tabs-legacy--editable .hi-tabs-legacy__header{border-bottom:1px solid #e6e7e8}.hi-tabs-legacy--editable .hi-tabs-legacy__item{height:48px;min-width:48px;line-height:48px;margin-right:4px;padding:0 8px;background:#fafafa;border-radius:4px 4px 0 0;border:1px solid #e6e7e8;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box}.hi-tabs-legacy--editable .hi-tabs-legacy__item:last-child{margin-right:0}.hi-tabs-legacy--editable .hi-tabs-legacy__item:hover:not(.hi-tabs-legacy__item--active){background-color:#e6e7e8}.hi-tabs-legacy--editable .hi-tabs-legacy__item--active{background-color:#fff;border-bottom-color:#fff;color:#4284f5}.hi-tabs-legacy--editable .hi-tabs-legacy__add{right:4px;bottom:12px}.hi-tabs-legacy--desc .hi-tabs-legacy__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow:hidden}.hi-tabs-legacy--desc .hi-tabs-legacy__item{-webkit-box-flex:0;-ms-flex:none;flex:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;padding:16px 20px;text-align:center;border:1px solid #e6e7e8;-webkit-box-sizing:border-box;box-sizing:border-box}.hi-tabs-legacy--desc .hi-tabs-legacy__item:not(:first-child){margin-left:-1px}.hi-tabs-legacy--desc .hi-tabs-legacy__item:hover{color:#4284f5}.hi-tabs-legacy--desc .hi-tabs-legacy__item:hover .hi-tabs-legacy__item-desc{color:#4284f5}.hi-tabs-legacy--desc .hi-tabs-legacy__item--active{color:#4284f5;border-color:#4284f5;z-index:1}.hi-tabs-legacy--desc .hi-tabs-legacy__item--active .hi-tabs-legacy__item-desc{color:#4284f5}.hi-tabs-legacy--desc .hi-tabs-legacy__item-name{margin-top:4px}.hi-tabs-legacy--desc .hi-tabs-legacy__item-desc{font-size:12px;color:#999}.hi-tabs-legacy--button .hi-tabs-legacy__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.hi-tabs-legacy--button .hi-tabs-legacy__item{-webkit-box-flex:0;-ms-flex:none;flex:none;height:36px;line-height:36px;padding:0 20px;margin-right:32px;-webkit-box-sizing:border-box;box-sizing:border-box}.hi-tabs-legacy--button .hi-tabs-legacy__item:hover{color:#4284f5}.hi-tabs-legacy--button .hi-tabs-legacy__item--active{color:#4284f5;border:1px solid #4284f5;border-radius:18px}.hi-tabs-legacy-dropdown__toggle-title{margin-right:8px}.hi-tabs-legacy-dropdown__items{max-height:160px;padding:4px 0;overflow:auto;background-color:#fff;border-radius:2px;border:1px solid #e6e7e8;-webkit-box-shadow:0 2px 8px 0 rgba(56,62,71,0.1);box-shadow:0 2px 8px 0 rgba(56,62,71,0.1)}.hi-tabs-legacy-dropdown__item{height:36px;min-width:140px;line-height:36px;padding:0 16px;font-size:14px;color:#383e47;white-space:nowrap;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box}.hi-tabs-legacy-dropdown__item:hover{background-color:rgba(66,133,244,0.08)}.hi-tabs-legacy-dropdown__item--active{background-color:rgba(66,133,244,0.08)}

package/es/tabs/tabs-legacy/style/index.js

@@ -0,0 +1,3 @@
+"use strict";
+
+require("./index.css");

package/es/tag/__tests__/index.test.js

@@ -0,0 +1,46 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _enzyme = require("enzyme");
+
+var _sinon = require("sinon");
+
+var _ = require("../");
+
+describe('Tag', function () {
+  describe('ProtoType', function () {
+    it('type', function () {
+      var wrapper = (0, _enzyme.mount)(_react["default"].createElement("div", null, _react["default"].createElement(_.Tag, {
+        type: "primary"
+      }), _react["default"].createElement(_.Tag, {
+        type: "danger"
+      }), _react["default"].createElement(_.Tag, {
+        type: "success"
+      }), _react["default"].createElement(_.Tag, {
+        type: "warning"
+      })));
+      expect(wrapper.find(".hi-tag__container--warning")).toHaveLength(1);
+      expect(wrapper.find('.hi-tag__container--primary')).toHaveLength(1);
+      expect(wrapper.find('.hi-tag__container--success')).toHaveLength(1);
+      expect(wrapper.find('.hi-tag__container--danger')).toHaveLength(1);
+    });
+    it('appearance', function () {
+      var wrapper = (0, _enzyme.mount)(_react["default"].createElement("div", null, _react["default"].createElement(_.Tag, {
+        appearance: "line"
+      }), _react["default"].createElement(_.Tag, null)));
+      expect(wrapper.find('.hi-tag__container--line')).toHaveLength(1);
+      expect(wrapper.find('.hi-tag__container--default')).toHaveLength(1);
+    });
+    it('onClick', function () {
+      var callback = (0, _sinon.fake)();
+      var wrapper = (0, _enzyme.shallow)(_react["default"].createElement(_.Tag, {
+        onClick: callback
+      }));
+      wrapper.find('.hi-tag__container--click').simulate('click');
+      expect(callback.callCount).toEqual(1);
+    });
+  });
+});

package/es/tag/index.js

@@ -0,0 +1,86 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Tag = exports["default"] = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+
+var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+require("./style/index");
+
+var _context = _interopRequireDefault(require("../context"));
+
+var Tag =
+/*#__PURE__*/
+function (_Component) {
+  (0, _inherits2["default"])(Tag, _Component);
+
+  function Tag() {
+    (0, _classCallCheck2["default"])(this, Tag);
+    return (0, _possibleConstructorReturn2["default"])(this, (0, _getPrototypeOf2["default"])(Tag).apply(this, arguments));
+  }
+
+  (0, _createClass2["default"])(Tag, [{
+    key: "render",
+    value: function render() {
+      var prefixCls = 'hi-tag';
+      var _this$props = this.props,
+          children = _this$props.children,
+          type = _this$props.type,
+          appearance = _this$props.appearance,
+          onClick = _this$props.onClick,
+          style = _this$props.style,
+          className = _this$props.className,
+          theme = _this$props.theme;
+      var eleClass = (0, _classnames["default"])("theme__".concat(theme), "".concat(prefixCls, "__container"), className, onClick && "".concat(prefixCls, "__container--click"), "".concat(prefixCls, "__container--").concat(type), "".concat(prefixCls, "__container--").concat(appearance));
+      var restProps = {
+        style: style,
+        onClick: onClick
+      };
+      return _react["default"].createElement("div", (0, _extends2["default"])({
+        className: eleClass
+      }, restProps), children);
+    }
+  }]);
+  return Tag;
+}(_react.Component);
+
+exports.Tag = Tag;
+(0, _defineProperty2["default"])(Tag, "propTypes", {
+  type: _propTypes["default"].oneOf(['primary', 'success', 'warning', 'danger']),
+  appearance: _propTypes["default"].oneOf(['default', 'line']),
+  onClick: _propTypes["default"].func,
+  style: _propTypes["default"].object,
+  className: _propTypes["default"].string
+});
+(0, _defineProperty2["default"])(Tag, "defaultProps", {
+  type: 'primary',
+  appearance: 'default'
+});
+
+var _default = (0, _context["default"])(Tag);
+
+exports["default"] = _default;

package/es/tag/style/index.css

@@ -0,0 +1 @@
+.hi-tag__container{height:22px;display:inline-block;vertical-align:middle;padding:0 6px;font-size:12px;-webkit-box-sizing:border-box;box-sizing:border-box;text-align:center;line-height:22px;-webkit-font-smoothing:antialiased;border-radius:2px}.hi-tag__container+.hi-tag__container{margin-left:10px}.hi-tag__container--default{background:#4285f4;color:#fff}.hi-tag__container--default.hi-tag__container--normal{background:#999}.hi-tag__container--default.hi-tag__container--success{background:#1da653}.hi-tag__container--default.hi-tag__container--danger{background:#f44141}.hi-tag__container--default.hi-tag__container--warning{background:#e19d0c}.hi-tag__container--line{background:transparent;border:1px solid #4285f4;color:#4285f4;padding:0 5px;line-height:20px}.hi-tag__container--line.hi-tag__container--normal{border:1px solid #999;color:#999}.hi-tag__container--line.hi-tag__container--success{border:1px solid #1da653;color:#1da653}.hi-tag__container--line.hi-tag__container--danger{border:1px solid #f44141;color:#f44141}.hi-tag__container--line.hi-tag__container--warning{border:1px solid #e19d0c;color:#e19d0c}.hi-tag__container--click{cursor:pointer}.theme__orange.hi-tag__container--primary.hi-tag__container--default{background:#f63}.theme__orange.hi-tag__container--primary.hi-tag__container--line{border:1px solid #f63;color:#f63}.theme__cyan.hi-tag__container--primary.hi-tag__container--default{background:#46bc99}.theme__cyan.hi-tag__container--primary.hi-tag__container--line{border:1px solid #46bc99;color:#46bc99}.theme__magenta.hi-tag__container--primary.hi-tag__container--default{background:#ff5975}.theme__magenta.hi-tag__container--primary.hi-tag__container--line{border:1px solid #ff5975;color:#ff5975}.theme__lavender.hi-tag__container--primary.hi-tag__container--default{background:#b450de}.theme__lavender.hi-tag__container--primary.hi-tag__container--line{border:1px solid #b450de;color:#b450de}.theme__blue.hi-tag__container--primary.hi-tag__container--default{background:#3da8f5}.theme__blue.hi-tag__container--primary.hi-tag__container--line{border:1px solid #3da8f5;color:#3da8f5}.theme__purple.hi-tag__container--primary.hi-tag__container--default{background:#8a8acb}.theme__purple.hi-tag__container--primary.hi-tag__container--line{border:1px solid #8a8acb;color:#8a8acb}

package/es/tag/style/index.js

@@ -0,0 +1,3 @@
+"use strict";
+
+require("./index.css");

package/es/timeline/__tests__/index.test.js

@@ -0,0 +1,198 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _enzyme = require("enzyme");
+
+var _index = _interopRequireDefault(require("../index"));
+
+var _icon = _interopRequireDefault(require("../../icon"));
+
+describe('Timeline', function () {
+  describe('props', function () {
+    it('data', function () {
+      var datas = [{
+        title: 'Title - 1',
+        content: 'Here are some descriptions',
+        timestamp: '2019.02.24 12:00:00'
+      }, {
+        title: 'Title 2',
+        content: 'Here are some descriptions',
+        timestamp: '2019.02.24 14:24:00'
+      }, {
+        title: 'Title 3',
+        content: 'Here are some descriptions',
+        timestamp: '2019.02.24 15:00:00',
+        children: [{
+          title: 'Sub 1',
+          content: 'Here are some descriptions'
+        }, {
+          title: 'Sub 2',
+          content: 'Here are some descriptions'
+        }]
+      }, {
+        title: 'Title 2-2',
+        content: 'Here are some descriptions',
+        timestamp: '12:00'
+      }, {
+        title: 'Title 4',
+        content: 'Here are some descriptions',
+        timestamp: '2019.02.24 19:55:00'
+      }];
+      var wrapper = (0, _enzyme.mount)(_react["default"].createElement(_index["default"], {
+        data: datas
+      }));
+      expect(wrapper.find('.hi-timeline')).toHaveLength(1);
+      expect(wrapper.find('.hi-timeline__item')).toHaveLength(6); // 点击展开按钮
+
+      expect(wrapper.find('.hi-timeline__item--folding').find('ul')).toHaveLength(0);
+      wrapper.find('.hi-timeline__arrow').first().simulate('click');
+      expect(wrapper.find('.hi-timeline__item--folding').find('ul')).toHaveLength(1);
+      expect(wrapper.find('.hi-timeline__item--sub')).toHaveLength(2);
+    });
+    it('type', function () {
+      var datas = [{
+        groupTitle: '2月',
+        children: [{
+          title: 'Title - 1',
+          content: 'Here are some descriptions',
+          timestamp: '10:00',
+          extraTime: '02-23'
+        }, {
+          title: 'Title 2',
+          content: 'Here are some descriptions',
+          timestamp: '10:00',
+          extraTime: '02-27'
+        }]
+      }, {
+        groupTitle: '3月',
+        children: [{
+          title: 'Title 3',
+          content: 'Here are some descriptions',
+          timestamp: '12:00',
+          extraTime: '03-02'
+        }, {
+          title: 'Title 4',
+          content: 'Here are some descriptions',
+          timestamp: '11:00',
+          extraTime: '03-10'
+        }]
+      }];
+      var wrapper = (0, _enzyme.mount)(_react["default"].createElement(_index["default"], {
+        data: datas
+      }));
+      expect(wrapper.find('.hi-timeline').hasClass('hi-timeline--normal')).toBeTruthy();
+      expect(wrapper.find('.hi-timeline').hasClass('hi-timeline--cross')).toBeFalsy();
+      wrapper.setProps({
+        type: 'cross'
+      });
+      expect(wrapper.find('.hi-timeline').hasClass('hi-timeline--normal')).toBeFalsy();
+      expect(wrapper.find('.hi-timeline').hasClass('hi-timeline--cross')).toBeTruthy();
+    });
+  });
+  describe("oldProps", function () {
+    it('list ,same as data', function () {
+      var lists = [{
+        title: 'Title - 1',
+        content: 'Here are some descriptions',
+        timestamp: '2019.02.24 12:00:00'
+      }, {
+        title: 'Title 2',
+        content: 'Here are some descriptions',
+        timestamp: '2019.02.24 14:24:00'
+      }];
+      var wrapper = (0, _enzyme.mount)(_react["default"].createElement(_index["default"], {
+        list: lists
+      }));
+      expect(wrapper.find('.hi-timeline')).toHaveLength(1);
+      expect(wrapper.find('.hi-timeline__item')).toHaveLength(2);
+    });
+    it('dot in dataItem,same as icon', function () {
+      var ele = _react["default"].createElement("span", {
+        className: "dotEle"
+      }, "111");
+
+      var data = [{
+        title: 'Title - 1',
+        content: 'Here are some descriptions',
+        timestamp: '2019.02.24 12:00:00'
+      }, {
+        title: 'Title 2',
+        dot: ele,
+        content: 'Here are some descriptions',
+        timestamp: '2019.02.24 14:24:00'
+      }, {
+        icon: _react["default"].createElement(_icon["default"], {
+          name: "collection",
+          style: {
+            fontSize: 16,
+            color: 'red'
+          }
+        }),
+        title: 'Title 2-2',
+        content: 'Here are some descriptions',
+        timestamp: '12:00'
+      }, {
+        title: 'Title 4',
+        icon: 'circle',
+        content: 'Here are some descriptions',
+        timestamp: '2019.02.24 19:55:00'
+      }];
+      var wrapper = (0, _enzyme.mount)(_react["default"].createElement(_index["default"], {
+        data: data
+      }));
+      expect(wrapper.find('.hi-timeline__dot')).toHaveLength(4);
+      expect(wrapper.find('.hi-timeline__dot--custom')).toHaveLength(3);
+    });
+    it('description in dataItem,same as content', function () {
+      var data = [{
+        title: 'Title - 1',
+        content: 'Here are some descriptions',
+        timestamp: '2019.02.24 12:00:00'
+      }, {
+        title: 'Title 2',
+        description: 'Here are some descriptions',
+        timestamp: '2019.02.24 14:24:00'
+      }];
+      var wrapper = (0, _enzyme.mount)(_react["default"].createElement(_index["default"], {
+        data: data
+      }));
+      expect(wrapper.find('.hi-timeline__desc')).toHaveLength(2);
+    });
+  });
+  describe('layout effect with type,equal with only type', function () {
+    var data = [{
+      title: 'Title - 1',
+      content: 'Here are some descriptions',
+      timestamp: '2019.02.24 12:00:00'
+    }, {
+      title: 'Title 2',
+      content: 'Here are some descriptions',
+      timestamp: '2019.02.24 14:24:00'
+    }];
+    it('cross', function () {
+      var wrapper = (0, _enzyme.mount)(_react["default"].createElement("div", null, _react["default"].createElement(_index["default"], {
+        data: data,
+        layout: "cross",
+        type: "default"
+      }), _react["default"].createElement(_index["default"], {
+        data: data,
+        type: "cross"
+      })));
+      expect(wrapper.find('.hi-timeline--cross').first().html()).toEqual(wrapper.find('.hi-timeline--cross').last().html());
+    });
+    it('right', function () {
+      var wrapper = (0, _enzyme.mount)(_react["default"].createElement("div", null, _react["default"].createElement(_index["default"], {
+        data: data,
+        layout: "right",
+        type: "default"
+      }), _react["default"].createElement(_index["default"], {
+        data: data,
+        type: "right"
+      })));
+      expect(wrapper.find('.hi-timeline--right').first().html()).toEqual(wrapper.find('.hi-timeline--right').last().html());
+    });
+  });
+});