choerodon-ui/es/timeline/Timeline.js

An enterprise-class UI design language and React-based implementation

import _extends from "@babel/runtime/helpers/extends";
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _inherits from "@babel/runtime/helpers/inherits";
import _createSuper from "@babel/runtime/helpers/createSuper";
var _excluded = ["prefixCls", "spinPrefixCls", "children", "pending", "pendingDot", "className", "reverse"];
import React, { Children, cloneElement, Component } from 'react';
import classNames from 'classnames';
import TimelineItem from './TimelineItem';
import Spin from '../spin';
import ConfigContext from '../config-provider/ConfigContext';
import { Size } from '../_util/enum';

var Timeline = /*#__PURE__*/function (_Component) {
  _inherits(Timeline, _Component);

  var _super = _createSuper(Timeline);

  function Timeline() {
    _classCallCheck(this, Timeline);

    return _super.apply(this, arguments);
  }

  _createClass(Timeline, [{
    key: "render",
    value: function render() {
      var _classNames;

      var _this$props = this.props,
          customizePrefixCls = _this$props.prefixCls,
          spinPrefixCls = _this$props.spinPrefixCls,
          children = _this$props.children,
          _this$props$pending = _this$props.pending,
          pending = _this$props$pending === void 0 ? null : _this$props$pending,
          pendingDot = _this$props.pendingDot,
          className = _this$props.className,
          reverse = _this$props.reverse,
          restProps = _objectWithoutProperties(_this$props, _excluded);

      var getPrefixCls = this.context.getPrefixCls;
      var pendingNode = typeof pending === 'boolean' ? null : pending;
      var prefixCls = getPrefixCls('timeline', customizePrefixCls);
      var classString = classNames(prefixCls, (_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "-pending"), !!pending), _defineProperty(_classNames, "".concat(prefixCls, "-reverse"), !!reverse), _classNames), className);
      var pendingItem = pending ? /*#__PURE__*/React.createElement(TimelineItem, {
        prefixCls: prefixCls,
        pending: !!pending,
        dot: pendingDot || /*#__PURE__*/React.createElement(Spin, {
          prefixCls: spinPrefixCls,
          size: Size.small
        })
      }, pendingNode) : null;
      var timeLineItems = reverse ? [pendingItem].concat(_toConsumableArray(Children.toArray(children).reverse())) : [].concat(_toConsumableArray(Children.toArray(children)), [pendingItem]); // Remove falsy items

      var truthyItems = timeLineItems.filter(function (item) {
        return !!item;
      });
      var itemsCount = Children.count(truthyItems);
      var lastCls = "".concat(prefixCls, "-item-last");
      var items = Children.map(truthyItems, function (ele, idx) {
        return /*#__PURE__*/cloneElement(ele, {
          className: classNames([ele.props.className, !reverse && !!pending ? idx === itemsCount - 2 ? lastCls : '' : idx === itemsCount - 1 ? lastCls : ''])
        });
      });
      return /*#__PURE__*/React.createElement("ul", _extends({}, restProps, {
        className: classString
      }), items);
    }
  }], [{
    key: "contextType",
    get: function get() {
      return ConfigContext;
    }
  }]);

  return Timeline;
}(Component);

export { Timeline as default };
Timeline.displayName = 'Timeline';
Timeline.Item = TimelineItem;
//# sourceMappingURL=Timeline.js.map