@antv/f2/es/timeline.js

import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
import _createClass from "@babel/runtime/helpers/esm/createClass";
import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
import _inherits from "@babel/runtime/helpers/esm/inherits";
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
import Component from './base/component';
import Children from './children';

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

  var _super = _createSuper(Timeline);

  function Timeline(props) {
    var _this;

    _classCallCheck(this, Timeline);

    _this = _super.call(this, props);

    _this.next = function () {
      var _assertThisInitialize = _assertThisInitialized(_this),
          state = _assertThisInitialize.state,
          props = _assertThisInitialize.props;

      var index = state.index,
          count = state.count,
          delay = state.delay;
      var loop = props.loop;
      var next = loop ? (index + 1) % count : index + 1;

      if (next < count) {
        setTimeout(function () {
          _this.setState({
            index: next
          });
        }, delay || 0);
      }
    };

    var delay = props.delay,
        _props$start = props.start,
        start = _props$start === void 0 ? 0 : _props$start,
        children = props.children;
    var count = Children.toArray(children).length;
    _this.state = {
      delay: delay,
      count: count,
      index: start
    };
    return _this;
  }

  _createClass(Timeline, [{
    key: "didMount",
    value: function didMount() {
      var context = this.context;
      var root = context.root;
      root.on('animationEnd', this.next);
    }
  }, {
    key: "didUnmount",
    value: function didUnmount() {
      var context = this.context;
      var root = context.root;
      root.off('animationEnd', this.next);
    }
  }, {
    key: "render",
    value: function render() {
      var state = this.state,
          props = this.props;
      var children = props.children;
      var index = state.index;
      var childrenArray = Children.toArray(children);
      return childrenArray[index];
    }
  }]);

  return Timeline;
}(Component);

export default Timeline;