@hi-ui/hiui 2.15.9 → 2.15.11

package/es/tabs/Tabs.js

@@ -1,76 +1,83 @@
 "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 _react = _interopRequireWildcard(require("react"));
 
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
 
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _classnames = _interopRequireDefault(require("classnames"));
 
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
+var _icon = _interopRequireDefault(require("../icon"));
 
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _tooltip = _interopRequireDefault(require("../tooltip"));
 
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
+var _ItemDropdown = _interopRequireDefault(require("./ItemDropdown"));
 
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-var _react = _interopRequireWildcard(require("react"));
+function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-var _classnames = _interopRequireDefault(require("classnames"));
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
 
-var _icon = _interopRequireDefault(require("../icon"));
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
-var _tooltip = _interopRequireDefault(require("../tooltip"));
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 
-var _ItemDropdown = _interopRequireDefault(require("./ItemDropdown"));
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 
-var _context = _interopRequireDefault(require("../context"));
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
 
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
 
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
 
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 var noop = function noop() {};
 
 var Tabs = /*#__PURE__*/function (_Component) {
-  (0, _inherits2["default"])(Tabs, _Component);
+  _inherits(Tabs, _Component);
 
   var _super = _createSuper(Tabs);
 
   function Tabs(props) {
     var _this;
 
-    (0, _classCallCheck2["default"])(this, Tabs);
+    _classCallCheck(this, Tabs);
+
     _this = _super.call(this, props);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "deletetabId", null);
-    var defaultActiveId = props.defaultActiveId,
-        activeId = props.activeId;
+
+    _defineProperty(_assertThisInitialized(_this), "deleteTabKey", null);
+
+    var defaultActiveKey = props.defaultActiveKey;
 
     var _this$getTabItems = _this.getTabItems(_this.props),
         showTabItems = _this$getTabItems.showTabItems,
         hiddenTabItems = _this$getTabItems.hiddenTabItems;
 
     _this.state = {
-      activeId: activeId !== undefined ? activeId : defaultActiveId || showTabItems && showTabItems[0] && showTabItems[0].tabId,
+      activeKey: defaultActiveKey || showTabItems[0].tabKey,
       showTabItems: showTabItems,
-      hiddenTabItems: hiddenTabItems,
-      defaultActiveId: defaultActiveId
+      hiddenTabItems: hiddenTabItems
     };
     return _this;
   }
 
-  (0, _createClass2["default"])(Tabs, [{
+  _createClass(Tabs, [{
     key: "componentWillReceiveProps",
     value: function componentWillReceiveProps(nextProps) {
       var _this2 = this;
@@ -84,25 +91,18 @@ var Tabs = /*#__PURE__*/function (_Component) {
         hiddenTabItems: hiddenTabItems
       });
 
-      if (this.props.activeId !== nextProps.activeId) {
-        this.setState({
-          activeId: nextProps.activeId
-        });
-      } // 考虑 tab 删完又新增一个的情况
-
-
-      if (this.props.children.length === 0 && nextProps.children.length > 0) {
+      if (this.props.defaultActiveKey !== nextProps.defaultActiveKey) {
         this.setState({
-          activeId: nextProps.children[0] && nextProps.children[0].props.tabId
+          activeKey: nextProps.defaultActiveKey
         });
       }
 
-      if (this.props.children.length > nextProps.children.length && this.deletetabId && this.deletetabId === this.state.activeId) {
+      if (this.props.children.length > nextProps.children.length && this.deleteTabKey && this.deleteTabKey === this.state.activeKey) {
         // 删除的是当前激活的tab，需重置激活tab
         this.setState({
-          activeId: nextProps.children[0] && nextProps.children[0].props.tabId || undefined
+          activeKey: nextProps.children[0].props.tabKey
         }, function () {
-          _this2.deletetabId = null;
+          _this2.deleteTabKey = null;
         });
       }
     }
@@ -112,28 +112,28 @@ var Tabs = /*#__PURE__*/function (_Component) {
       var children = props.children,
           type = props.type,
           placement = props.placement,
-          max = props.max;
+          showTabsNum = props.showTabsNum;
       var showTabItems = [];
       var hiddenTabItems = [];
 
       _react["default"].Children.map(children, function (child, index) {
         if (child) {
           var _child$props = child.props,
-              tabTitle = _child$props.tabTitle,
-              tabId = _child$props.tabId,
+              tabName = _child$props.tabName,
+              tabKey = _child$props.tabKey,
               tabDesc = _child$props.tabDesc,
               disabled = _child$props.disabled,
-              closeable = _child$props.closeable;
+              closable = _child$props.closable;
           var item = {
-            tabTitle: tabTitle,
-            tabId: tabId,
+            tabName: tabName,
+            tabKey: tabKey,
             tabDesc: tabDesc,
             disabled: disabled,
-            closeable: closeable
+            closable: closable
           };
 
-          if (type === 'card' && placement === 'horizontal' && showTabItems.length >= max) {
-            // 卡片式标签超过max时，其余标签的隐藏
+          if (type === 'card' && placement === 'top' && showTabItems.length >= showTabsNum) {
+            // 卡片式标签超过showTabsNum时，其余标签的隐藏
             hiddenTabItems.push(item);
           } else {
             showTabItems.push(item);
@@ -149,15 +149,17 @@ var Tabs = /*#__PURE__*/function (_Component) {
   }, {
     key: "handleClick",
     value: function handleClick(tab, e) {
+      var _this3 = this;
+
       if (tab.disabled) {
         return false;
       }
 
-      var onTabClick = this.props.onTabClick;
-      onTabClick(tab.tabId, e);
-      var activeId = this.props.activeId;
-      activeId !== undefined || this.setState({
-        activeId: tab.tabId
+      this.setState({
+        activeKey: tab.tabKey
+      }, function () {
+        var onTabClick = _this3.props.onTabClick;
+        onTabClick(tab.tabKey, e);
       });
     }
   }, {
@@ -174,15 +176,15 @@ var Tabs = /*#__PURE__*/function (_Component) {
     }
   }, {
     key: "deleteTab",
-    value: function deleteTab(e, tabId, index) {
+    value: function deleteTab(e, tabKey, index) {
       e.stopPropagation();
-      this.deletetabId = tabId;
+      this.deleteTabKey = tabKey;
       var _this$props2 = this.props,
           onEdit = _this$props2.onEdit,
           editable = _this$props2.editable;
 
       if (editable) {
-        onEdit('delete', index, tabId);
+        onEdit('delete', index, tabKey);
       }
     }
   }, {
@@ -196,31 +198,29 @@ var Tabs = /*#__PURE__*/function (_Component) {
   }, {
     key: "renderTabContent",
     value: function renderTabContent(child) {
-      var tabId = child.props.tabId;
-      var activeId = this.state.activeId;
+      var tabKey = child.props.tabKey;
+      var activeKey = this.state.activeKey;
       return /*#__PURE__*/(0, _react.cloneElement)(child, {
-        show: tabId === activeId
+        show: tabKey === activeKey
       });
     }
   }, {
     key: "render",
     value: function render() {
-      var _this3 = this;
+      var _this4 = this;
 
       var _this$state = this.state,
-          activeId = _this$state.activeId,
+          activeKey = _this$state.activeKey,
           showTabItems = _this$state.showTabItems,
-          hiddenTabItems = _this$state.hiddenTabItems,
-          defaultActiveId = _this$state.defaultActiveId;
+          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,
-          theme = _this$props4.theme;
+          className = _this$props4.className;
       var editable = this.checkEditable();
-      var tabsClasses = (0, _classnames["default"])(prefixCls, className, "".concat(prefixCls, "--").concat(type), "theme__".concat(theme), (0, _defineProperty2["default"])({}, "".concat(prefixCls, "--").concat(placement), type === 'card'));
+      var tabsClasses = (0, _classnames["default"])(prefixCls, className, "".concat(prefixCls, "--").concat(type), _defineProperty({}, "".concat(prefixCls, "--").concat(placement), type === 'card'));
       var activeTabInHiddenItems = true;
       return /*#__PURE__*/_react["default"].createElement("div", {
         className: tabsClasses
@@ -231,43 +231,40 @@ var Tabs = /*#__PURE__*/function (_Component) {
       }, showTabItems.map(function (item, index) {
         var _classNames2;
 
-        var tabTitle = item.tabTitle,
-            tabId = item.tabId,
+        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"), tabId === activeId), (0, _defineProperty2["default"])(_classNames2, "".concat(prefixCls, "__item--disabled"), disabled), _classNames2));
-        activeTabInHiddenItems = activeTabInHiddenItems && tabId !== activeId;
-        var ToolNav = type === 'editable' && tabId !== activeId ? _tooltip["default"] : 'div';
+            closable = item.closable;
+        var itemClasses = (0, _classnames["default"])("".concat(prefixCls, "__item"), (_classNames2 = {}, _defineProperty(_classNames2, "".concat(prefixCls, "__item--active"), tabKey === activeKey), _defineProperty(_classNames2, "".concat(prefixCls, "__item--disabled"), disabled), _classNames2));
+        activeTabInHiddenItems = activeTabInHiddenItems && tabKey !== activeKey;
+        var ToolNav = type === 'editable' && tabKey !== activeKey ? _tooltip["default"] : 'div';
         return /*#__PURE__*/_react["default"].createElement(ToolNav, {
           className: itemClasses,
           key: "".concat(prefixCls, "__item-").concat(index),
           onClick: function onClick(e) {
-            return _this3.handleClick(item, e);
+            return _this4.handleClick(item, e);
           },
-          title: type === 'editable' && tabId !== activeId ? tabTitle : null
+          title: tabName
         }, /*#__PURE__*/_react["default"].createElement("span", {
           className: "".concat(prefixCls, "__item-name")
-        }, tabTitle), type === 'desc' && /*#__PURE__*/_react["default"].createElement("span", {
+        }, tabName), type === 'desc' && /*#__PURE__*/_react["default"].createElement("span", {
           className: "".concat(prefixCls, "__item-desc")
-        }, tabDesc), editable && closeable && /*#__PURE__*/_react["default"].createElement("span", {
+        }, tabDesc), editable && closable && /*#__PURE__*/_react["default"].createElement("span", {
           className: "".concat(prefixCls, "__item-close")
         }, /*#__PURE__*/_react["default"].createElement(_icon["default"], {
           onClick: function onClick(e) {
-            return _this3.deleteTab(e, tabId, index);
+            return _this4.deleteTab(e, tabKey, index);
           },
           name: "close"
         })));
       }), hiddenTabItems.length > 0 && /*#__PURE__*/_react["default"].createElement("div", {
-        className: (0, _classnames["default"])("".concat(prefixCls, "__item"), (0, _defineProperty2["default"])({}, "".concat(prefixCls, "__item--active"), activeTabInHiddenItems))
+        className: (0, _classnames["default"])("".concat(prefixCls, "__item"), _defineProperty({}, "".concat(prefixCls, "__item--active"), activeTabInHiddenItems))
       }, /*#__PURE__*/_react["default"].createElement(_ItemDropdown["default"], {
         active: activeTabInHiddenItems,
-        activeId: activeId,
-        theme: theme,
-        defaultActiveId: defaultActiveId,
         items: hiddenTabItems,
         onChoose: function onChoose(item, e) {
-          _this3.handleClick(item, e);
+          _this4.handleClick(item, e);
         }
       }))), editable && /*#__PURE__*/_react["default"].createElement("div", {
         className: "".concat(prefixCls, "__add")
@@ -277,36 +274,36 @@ var Tabs = /*#__PURE__*/function (_Component) {
       }))), /*#__PURE__*/_react["default"].createElement("div", {
         className: "".concat(prefixCls, "__content")
       }, _react["default"].Children.map(children, function (item) {
-        return item && _this3.renderTabContent(item);
+        return item && _this4.renderTabContent(item);
       })));
     }
   }]);
+
   return Tabs;
 }(_react.Component);
 
-(0, _defineProperty2["default"])(Tabs, "propTypes", {
-  type: _propTypes["default"].oneOf(['desc', 'card', 'button', 'editable', 'line']),
-  placement: _propTypes["default"].oneOf(['horizontal', 'vertical']),
-  activeId: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
-  defaultActiveId: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
-  max: _propTypes["default"].number,
+_defineProperty(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", {
+
+_defineProperty(Tabs, "defaultProps", {
   prefixCls: 'hi-tabs',
   type: 'card',
-  placement: 'horizontal',
+  placement: 'top',
   className: '',
-  max: 6,
+  showTabsNum: 6,
   editable: true,
   onTabClick: noop,
   onEdit: noop
 });
 
-var _default = (0, _context["default"])(Tabs);
-
+var _default = Tabs;
 exports["default"] = _default;

package/es/tabs/index.js

@@ -1,7 +1,5 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -13,12 +11,8 @@ var _TabPane = _interopRequireDefault(require("./TabPane"));
 
 require("./style/index");
 
-var _SwitchVersion = _interopRequireDefault(require("../_util/SwitchVersion"));
-
-var _index2 = _interopRequireDefault(require("./tabs-legacy/index"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-var VTabs = (0, _SwitchVersion["default"])(_Tabs["default"], _index2["default"]);
-var VTabPane = (0, _SwitchVersion["default"])(_TabPane["default"], _index2["default"].Pane);
-VTabs.Pane = VTabPane;
-var _default = VTabs;
+_Tabs["default"].Pane = _TabPane["default"];
+var _default = _Tabs["default"];
 exports["default"] = _default;

package/es/tabs/style/index.css

@@ -1 +1 @@
-.hi-tabs .hi-tabs__header{position:relative;font-size:14px;color:#333}.hi-tabs .hi-tabs__item{-webkit-box-flex:0;-ms-flex:0 1 auto;flex:0 1 auto;cursor:pointer;border:1px solid transparent}.hi-tabs .hi-tabs__item{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.hi-tabs .hi-tabs__item--active{-webkit-box-flex:0;-ms-flex:none;flex:none}.hi-tabs .hi-tabs__item .hi-icon:not(.icon-close){margin-right:4px}.hi-tabs .hi-tabs__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;cursor:pointer;-webkit-box-sizing:border-box;box-sizing:border-box;font-size:16px}.hi-tabs .hi-tabs__item-close{margin-left:8px;font-size:16px}.hi-tabs--line>.hi-tabs__header .hi-tabs__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;border-bottom:1px solid #e6e7e8}.hi-tabs--line>.hi-tabs__header .hi-tabs__item{position:relative;height:40px;line-height:40px;margin-right:32px;-webkit-box-sizing:border-box;box-sizing:border-box;border:none;-webkit-transition:color 0.5s linear;transition:color 0.5s linear}.hi-tabs--line>.hi-tabs__header .hi-tabs__item::after{display:inline-block;position:absolute;content:'';height:2px;width:100%;background:#4284f5;bottom:0;left:0;opacity:0;-webkit-transition:opacity 0.5s linear;transition:opacity 0.5s linear}.hi-tabs--line>.hi-tabs__header .hi-tabs__item:hover{color:#4284f5}.hi-tabs--line>.hi-tabs__header .hi-tabs__item--active{color:#4284f5}.hi-tabs--line>.hi-tabs__header .hi-tabs__item--active::after{opacity:1}.hi-tabs--card>.hi-tabs__header .hi-tabs__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.hi-tabs--card>.hi-tabs__header .hi-tabs__item{height:48px;line-height:46px;padding:0 16px;-webkit-box-sizing:border-box;box-sizing:border-box}.hi-tabs--card>.hi-tabs__header .hi-tabs__item:hover{color:#4284f5}.hi-tabs--card>.hi-tabs__header .hi-tabs__item--active{border:1px solid #e6e7e8;border-radius:2px;color:#4284f5}.hi-tabs--card.hi-tabs--horizontal .hi-tabs__nav{margin-bottom:-1px}.hi-tabs--card.hi-tabs--horizontal .hi-tabs__header{border-bottom:1px solid #e6e7e8}.hi-tabs--card.hi-tabs--horizontal .hi-tabs__item--active{border-bottom-color:#fff}.hi-tabs--card.hi-tabs--vertical{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.hi-tabs--card.hi-tabs--vertical .hi-tabs__header{-webkit-box-flex:0;-ms-flex:none;flex:none;display:inline-block;border-right:1px solid #e6e7e8}.hi-tabs--card.hi-tabs--vertical .hi-tabs__nav{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-right:-1px}.hi-tabs--card.hi-tabs--vertical .hi-tabs__item{border-top-left-radius:4px;border-bottom-left-radius:4px}.hi-tabs--card.hi-tabs--vertical .hi-tabs__item--active{border-right-color:#fff}.hi-tabs--editable>.hi-tabs__header{border-bottom:1px solid #e6e7e8}.hi-tabs--editable>.hi-tabs__header .hi-tabs__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow:hidden;margin-bottom:-1px;margin-right:40px;min-height:40px}.hi-tabs--editable>.hi-tabs__header .hi-tabs__item{height:40px;min-width:48px;line-height:40px;margin-right:4px;padding:0 8px;background:#fafafa;border-radius:2px 2px 0 0;border:1px solid #e6e7e8;text-align:center;-webkit-box-sizing:border-box;box-sizing:border-box}.hi-tabs--editable>.hi-tabs__header .hi-tabs__item:last-child{margin-right:0}.hi-tabs--editable>.hi-tabs__header .hi-tabs__item:hover:not(.hi-tabs__item--active){background-color:#f0f0f0}.hi-tabs--editable>.hi-tabs__header .hi-tabs__item--active{background-color:#fff;border-bottom-color:#fff;color:#4284f5}.hi-tabs--editable>.hi-tabs__header .hi-tabs__add{right:4px;bottom:12px}.hi-tabs--desc>.hi-tabs__header .hi-tabs__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow:hidden}.hi-tabs--desc>.hi-tabs__header .hi-tabs__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--desc>.hi-tabs__header .hi-tabs__item:not(:first-child){margin-left:-1px}.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover{color:#4284f5}.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover .hi-tabs__item-desc{color:#4284f5}.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active{color:#4284f5;border-color:#4284f5;z-index:1}.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active .hi-tabs__item-desc{color:#4284f5}.hi-tabs--desc>.hi-tabs__header .hi-tabs__item-name{margin-top:4px}.hi-tabs--desc>.hi-tabs__header .hi-tabs__item-desc{font-size:12px;color:#999}.hi-tabs--button>.hi-tabs__header .hi-tabs__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.hi-tabs--button>.hi-tabs__header .hi-tabs__item{-webkit-box-flex:0;-ms-flex:none;flex:none;height:36px;line-height:34px;padding:0 23px;-webkit-box-sizing:border-box;box-sizing:border-box;margin-right:24px;border:1px solid #d8d8d8;border-radius:18px}.hi-tabs--button>.hi-tabs__header .hi-tabs__item:hover:not(.hi-tabs__item--active){color:#4284f5;border:1px solid #4284f5}.hi-tabs--button>.hi-tabs__header .hi-tabs__item--active{color:#fff;background-color:#4284f5;border:1px solid #4284f5}.hi-tabs-dropdown__toggle-title{margin-right:8px}.hi-tabs-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-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-dropdown__item:hover{background-color:rgba(66,133,244,0.08)}.hi-tabs-dropdown__item--active{background-color:rgba(66,133,244,0.08)}.theme__orange.hi-tabs--card>.hi-tabs__header .hi-tabs__item:hover{color:#f63}.theme__orange.hi-tabs--card>.hi-tabs__header .hi-tabs__item--active{color:#f63}.theme__orange.hi-tabs--editable>.hi-tabs__header .hi-tabs__item--active{color:#f63}.theme__orange.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover{color:#f63}.theme__orange.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover .hi-tabs__item-desc{color:#f63}.theme__orange.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active{color:#f63;border-color:#f63}.theme__orange.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active .hi-tabs__item-desc{color:#f63}.theme__orange.hi-tabs--button>.hi-tabs__header .hi-tabs__item:hover:not(.hi-tabs__item--active){color:#f63;border:1px solid #f63}.theme__orange.hi-tabs--button>.hi-tabs__header .hi-tabs__item--active{background-color:#f63;border:1px solid #f63}.theme__orange.hi-tabs-dropdown__items .hi-tabs-dropdown__item:hover{background-color:rgba(255,102,51,0.1)}.theme__orange.hi-tabs-dropdown__items .hi-tabs-dropdown__item.hi-tabs-dropdown__item--active{background-color:rgba(255,102,51,0.1)}.theme__cyan.hi-tabs--card>.hi-tabs__header .hi-tabs__item:hover{color:#46bc99}.theme__cyan.hi-tabs--card>.hi-tabs__header .hi-tabs__item--active{color:#46bc99}.theme__cyan.hi-tabs--editable>.hi-tabs__header .hi-tabs__item--active{color:#46bc99}.theme__cyan.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover{color:#46bc99}.theme__cyan.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover .hi-tabs__item-desc{color:#46bc99}.theme__cyan.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active{color:#46bc99;border-color:#46bc99}.theme__cyan.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active .hi-tabs__item-desc{color:#46bc99}.theme__cyan.hi-tabs--button>.hi-tabs__header .hi-tabs__item:hover:not(.hi-tabs__item--active){color:#46bc99;border:1px solid #46bc99}.theme__cyan.hi-tabs--button>.hi-tabs__header .hi-tabs__item--active{background-color:#46bc99;border:1px solid #46bc99}.theme__cyan.hi-tabs-dropdown__items .hi-tabs-dropdown__item:hover{background-color:rgba(70,188,153,0.1)}.theme__cyan.hi-tabs-dropdown__items .hi-tabs-dropdown__item.hi-tabs-dropdown__item--active{background-color:rgba(70,188,153,0.1)}.theme__magenta.hi-tabs--card>.hi-tabs__header .hi-tabs__item:hover{color:#ff5975}.theme__magenta.hi-tabs--card>.hi-tabs__header .hi-tabs__item--active{color:#ff5975}.theme__magenta.hi-tabs--editable>.hi-tabs__header .hi-tabs__item--active{color:#ff5975}.theme__magenta.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover{color:#ff5975}.theme__magenta.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover .hi-tabs__item-desc{color:#ff5975}.theme__magenta.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active{color:#ff5975;border-color:#ff5975}.theme__magenta.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active .hi-tabs__item-desc{color:#ff5975}.theme__magenta.hi-tabs--button>.hi-tabs__header .hi-tabs__item:hover:not(.hi-tabs__item--active){color:#ff5975;border:1px solid #ff5975}.theme__magenta.hi-tabs--button>.hi-tabs__header .hi-tabs__item--active{background-color:#ff5975;border:1px solid #ff5975}.theme__magenta.hi-tabs-dropdown__items .hi-tabs-dropdown__item:hover{background-color:rgba(255,89,117,0.1)}.theme__magenta.hi-tabs-dropdown__items .hi-tabs-dropdown__item.hi-tabs-dropdown__item--active{background-color:rgba(255,89,117,0.1)}.theme__lavender.hi-tabs--card>.hi-tabs__header .hi-tabs__item:hover{color:#b450de}.theme__lavender.hi-tabs--card>.hi-tabs__header .hi-tabs__item--active{color:#b450de}.theme__lavender.hi-tabs--editable>.hi-tabs__header .hi-tabs__item--active{color:#b450de}.theme__lavender.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover{color:#b450de}.theme__lavender.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover .hi-tabs__item-desc{color:#b450de}.theme__lavender.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active{color:#b450de;border-color:#b450de}.theme__lavender.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active .hi-tabs__item-desc{color:#b450de}.theme__lavender.hi-tabs--button>.hi-tabs__header .hi-tabs__item:hover:not(.hi-tabs__item--active){color:#b450de;border:1px solid #b450de}.theme__lavender.hi-tabs--button>.hi-tabs__header .hi-tabs__item--active{background-color:#b450de;border:1px solid #b450de}.theme__lavender.hi-tabs-dropdown__items .hi-tabs-dropdown__item:hover{background-color:rgba(180,80,222,0.1)}.theme__lavender.hi-tabs-dropdown__items .hi-tabs-dropdown__item.hi-tabs-dropdown__item--active{background-color:rgba(180,80,222,0.1)}.theme__blue.hi-tabs--card>.hi-tabs__header .hi-tabs__item:hover{color:#3da8f5}.theme__blue.hi-tabs--card>.hi-tabs__header .hi-tabs__item--active{color:#3da8f5}.theme__blue.hi-tabs--editable>.hi-tabs__header .hi-tabs__item--active{color:#3da8f5}.theme__blue.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover{color:#3da8f5}.theme__blue.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover .hi-tabs__item-desc{color:#3da8f5}.theme__blue.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active{color:#3da8f5;border-color:#3da8f5}.theme__blue.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active .hi-tabs__item-desc{color:#3da8f5}.theme__blue.hi-tabs--button>.hi-tabs__header .hi-tabs__item:hover:not(.hi-tabs__item--active){color:#3da8f5;border:1px solid #3da8f5}.theme__blue.hi-tabs--button>.hi-tabs__header .hi-tabs__item--active{background-color:#3da8f5;border:1px solid #3da8f5}.theme__blue.hi-tabs-dropdown__items .hi-tabs-dropdown__item:hover{background-color:rgba(61,168,245,0.1)}.theme__blue.hi-tabs-dropdown__items .hi-tabs-dropdown__item.hi-tabs-dropdown__item--active{background-color:rgba(61,168,245,0.1)}.theme__purple.hi-tabs--card>.hi-tabs__header .hi-tabs__item:hover{color:#8a8acb}.theme__purple.hi-tabs--card>.hi-tabs__header .hi-tabs__item--active{color:#8a8acb}.theme__purple.hi-tabs--editable>.hi-tabs__header .hi-tabs__item--active{color:#8a8acb}.theme__purple.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover{color:#8a8acb}.theme__purple.hi-tabs--desc>.hi-tabs__header .hi-tabs__item:hover .hi-tabs__item-desc{color:#8a8acb}.theme__purple.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active{color:#8a8acb;border-color:#8a8acb}.theme__purple.hi-tabs--desc>.hi-tabs__header .hi-tabs__item--active .hi-tabs__item-desc{color:#8a8acb}.theme__purple.hi-tabs--button>.hi-tabs__header .hi-tabs__item:hover:not(.hi-tabs__item--active){color:#8a8acb;border:1px solid #8a8acb}.theme__purple.hi-tabs--button>.hi-tabs__header .hi-tabs__item--active{background-color:#8a8acb;border:1px solid #8a8acb}.theme__purple.hi-tabs-dropdown__items .hi-tabs-dropdown__item:hover{background-color:rgba(138,138,203,0.1)}.theme__purple.hi-tabs-dropdown__items .hi-tabs-dropdown__item.hi-tabs-dropdown__item--active{background-color:rgba(138,138,203,0.1)}
+.hi-tabs .hi-tabs__header{position:relative;font-size:14px;color:#333}.hi-tabs .hi-tabs__item{-webkit-box-flex:0;-ms-flex:0 1 auto;flex:0 1 auto;cursor:pointer;border:1px solid transparent}.hi-tabs .hi-tabs__item{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.hi-tabs .hi-tabs__item--active{-webkit-box-flex:0;-ms-flex:none;flex:none}.hi-tabs .hi-tabs__item .hi-icon:not(.icon-close){margin-right:4px}.hi-tabs .hi-tabs__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 .hi-tabs__item-close{margin-left:8px;font-size:12px}.hi-tabs--card .hi-tabs__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.hi-tabs--card .hi-tabs__item{height:48px;line-height:48px;padding:0 16px;-webkit-box-sizing:border-box;box-sizing:border-box}.hi-tabs--card .hi-tabs__item:hover{color:#4284f5}.hi-tabs--card .hi-tabs__item--active{border:1px solid #e6e7e8;color:#4284f5}.hi-tabs--card.hi-tabs--top .hi-tabs__nav{margin-bottom:-1px}.hi-tabs--card.hi-tabs--top .hi-tabs__header{border-bottom:1px solid #e6e7e8}.hi-tabs--card.hi-tabs--top .hi-tabs__item{margin-right:16px}.hi-tabs--card.hi-tabs--top .hi-tabs__item--active{border-bottom-color:#fff}.hi-tabs--card.hi-tabs--left{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap}.hi-tabs--card.hi-tabs--left .hi-tabs__header{-webkit-box-flex:0;-ms-flex:none;flex:none;display:inline-block;border-right:1px solid #e6e7e8}.hi-tabs--card.hi-tabs--left .hi-tabs__nav{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;margin-right:-1px}.hi-tabs--card.hi-tabs--left .hi-tabs__item--active{border-right-color:#fff}.hi-tabs--editable .hi-tabs__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--editable .hi-tabs__header{border-bottom:1px solid #e6e7e8}.hi-tabs--editable .hi-tabs__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--editable .hi-tabs__item:last-child{margin-right:0}.hi-tabs--editable .hi-tabs__item:hover:not(.hi-tabs__item--active){background-color:#e6e7e8}.hi-tabs--editable .hi-tabs__item--active{background-color:#fff;border-bottom-color:#fff;color:#4284f5}.hi-tabs--editable .hi-tabs__add{right:4px;bottom:12px}.hi-tabs--desc .hi-tabs__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;overflow:hidden}.hi-tabs--desc .hi-tabs__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--desc .hi-tabs__item:not(:first-child){margin-left:-1px}.hi-tabs--desc .hi-tabs__item:hover{color:#4284f5}.hi-tabs--desc .hi-tabs__item:hover .hi-tabs__item-desc{color:#4284f5}.hi-tabs--desc .hi-tabs__item--active{color:#4284f5;border-color:#4284f5;z-index:1}.hi-tabs--desc .hi-tabs__item--active .hi-tabs__item-desc{color:#4284f5}.hi-tabs--desc .hi-tabs__item-name{margin-top:4px}.hi-tabs--desc .hi-tabs__item-desc{font-size:12px;color:#999}.hi-tabs--button .hi-tabs__nav{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap}.hi-tabs--button .hi-tabs__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--button .hi-tabs__item:hover{color:#4284f5}.hi-tabs--button .hi-tabs__item--active{color:#4284f5;border:1px solid #4284f5;border-radius:18px}.hi-tabs-dropdown__toggle-title{margin-right:8px}.hi-tabs-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-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-dropdown__item:hover{background-color:rgba(66,133,244,0.08)}.hi-tabs-dropdown__item--active{background-color:rgba(66,133,244,0.08)}

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

@@ -0,0 +1,49 @@
+"use strict";
+
+var _react = _interopRequireDefault(require("react"));
+
+var _enzyme = require("enzyme");
+
+var _reactTestRenderer = _interopRequireDefault(require("react-test-renderer"));
+
+var _ = _interopRequireDefault(require("../"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var datas = [{
+  groupTitle: '2月',
+  children: [{
+    title: 'Title - 1',
+    description: 'Here are some descriptions',
+    timestamp: '10:00',
+    extraTime: '02-23'
+  }, {
+    dot: 'circle',
+    title: 'Title 2',
+    description: 'Here are some descriptions',
+    timestamp: '10:00',
+    extraTime: '02-27'
+  }]
+}, {
+  groupTitle: '3月',
+  children: [{
+    dot: 'circle',
+    title: 'Title 3',
+    description: 'Here are some descriptions',
+    timestamp: '12:00',
+    extraTime: '03-02'
+  }, {
+    dot: 'circle',
+    title: 'Title 4',
+    description: 'Here are some descriptions',
+    timestamp: '11:00',
+    extraTime: '03-10'
+  }]
+}];
+describe('Timeline', function () {
+  it('renders correctly', function () {
+    var wrapper = _reactTestRenderer["default"].create( /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_["default"], null)));
+
+    expect(wrapper).toMatchSnapshot();
+  });
+});

package/es/timeline/foldingItem.js

@@ -0,0 +1,82 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _icon = _interopRequireDefault(require("../icon"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+var FoldingItem = /*#__PURE__*/function (_React$Component) {
+  _inherits(FoldingItem, _React$Component);
+
+  var _super = _createSuper(FoldingItem);
+
+  function FoldingItem(props) {
+    var _this;
+
+    _classCallCheck(this, FoldingItem);
+
+    _this = _super.call(this, props);
+    _this.state = {
+      showSub: false
+    };
+    return _this;
+  }
+
+  _createClass(FoldingItem, [{
+    key: "render",
+    value: function render() {
+      var _this2 = this;
+
+      var showSub = this.state.showSub;
+      var texts = this.props.texts;
+      var text = showSub ? texts.collapse : texts.expand;
+      var iconName = showSub ? 'up' : 'down';
+      return /*#__PURE__*/_react["default"].createElement("li", {
+        className: "hi-timeline__item hi-timeline__item--folding"
+      }, showSub && /*#__PURE__*/_react["default"].createElement("ul", null, this.props.subChildren), /*#__PURE__*/_react["default"].createElement("span", {
+        className: "hi-timeline__arrow",
+        onClick: function onClick() {
+          return _this2.setState({
+            showSub: !_this2.state.showSub
+          });
+        }
+      }, text, "   ", /*#__PURE__*/_react["default"].createElement(_icon["default"], {
+        name: iconName
+      })), /*#__PURE__*/_react["default"].createElement("div", {
+        className: "hi-timeline__line"
+      }));
+    }
+  }]);
+
+  return FoldingItem;
+}(_react["default"].Component);
+
+exports["default"] = FoldingItem;