"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.unconnectedExtension = void 0;

var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread"));

var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));

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 _react = _interopRequireWildcard(require("react"));

var _propTypes = require("prop-types");

var _reactDom = _interopRequireDefault(require("react-dom"));

var _redux = require("redux");

var _reactRedux = require("../../../react-redux");

var scrollingActionCreators = _interopRequireWildcard(require("../../../actions/scrolling"));

var connectToScrollingStore = function connectToScrollingStore(ComposedComponent) {
  var mapDispatchToProps = function mapDispatchToProps(dispatch) {
    return {
      scrollingActions: (0, _redux.bindActionCreators)(scrollingActionCreators, dispatch)
    };
  };

  var mapStateToProps = function mapStateToProps(state) {
    // TODO: change the name in state
    return {
      scrolledComponentKey: state.getIn(['scrolling', 'scrolledComponentKey']),
      scrollingFocus: state.getIn(['scrolling', 'scrollingFocus'])
    };
  };

  return (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps, null, {
    withRef: true
  })(ComposedComponent);
};

var makeScrollable = function makeScrollable(ComposedComponent) {
  var _class, _temp;

  return _temp = _class =
  /*#__PURE__*/
  function (_Component) {
    (0, _inherits2.default)(WithScrollableItems, _Component);

    function WithScrollableItems(props) {
      var _this;

      (0, _classCallCheck2.default)(this, WithScrollableItems);
      _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(WithScrollableItems).call(this, props));

      _this.composedRef = function (node) {
        _this._composed = node;
      };

      _this._composed = null;
      return _this;
    }

    (0, _createClass2.default)(WithScrollableItems, [{
      key: "isScrolled",
      value: function isScrolled() {
        return this.props.scrollKey === this.props.scrolledComponentKey;
      }
    }, {
      key: "scrollIntoView",
      value: function scrollIntoView() {
        var scrollingFocus = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;

        var node = _reactDom.default.findDOMNode(this);

        node.scrollIntoView();
        if (scrollingFocus) node.focus(); // Focus on the item once scrolled into view
      }
    }, {
      key: "setFocus",
      value: function setFocus() {
        var node = _reactDom.default.findDOMNode(this);

        node && node.focus();
      }
    }, {
      key: "componentDidMount",
      value: function componentDidMount() {
        if (this.props.shouldFocusOnMount) {
          this.setFocus();
        }
      }
    }, {
      key: "componentDidUpdate",
      value: function componentDidUpdate(prevProps, prevState) {
        var _this$props = this.props,
            scrolledComponentKey = _this$props.scrolledComponentKey,
            scrollingFocus = _this$props.scrollingFocus,
            scrollKey = _this$props.scrollKey,
            scrollingActions = _this$props.scrollingActions;

        if (prevProps.scrolledComponentKey !== scrolledComponentKey && scrolledComponentKey === scrollKey) {
          this.scrollIntoView(scrollingFocus);
          scrollingActions.clearsScrolledComponentKey();
        }
      }
    }, {
      key: "render",
      value: function render() {
        return _react.default.createElement(ComposedComponent, Object.assign({}, this.composedProps, {
          ref: this.composedRef
        }), this.props.children);
      }
    }, {
      key: "composedProps",
      get: function get() {
        var _this2 = this;

        // We want the props that are in CC.propTypes, and the passthrough props,
        // which are in neither our nor CC's propTypes
        return Object.assign.apply(Object, [{}].concat((0, _toConsumableArray2.default)(Object.keys(this.props).filter(function (name) {
          return ComposedComponent.propTypes && ComposedComponent.propTypes[name] || !_this2.constructor.propTypes[name];
        }).map(function (name) {
          return (0, _defineProperty2.default)({}, name, _this2.props[name]);
        }))));
      }
    }]);
    WithScrollableItems.displayName = "WithScrollableItems";
    return WithScrollableItems;
  }(_react.Component), _class.propTypes = (0, _objectSpread2.default)({}, ComposedComponent.propTypes || {}, {
    scrollKey: _propTypes.PropTypes.string,
    scrolledComponentKey: _propTypes.PropTypes.string,
    scrollingFocus: _propTypes.PropTypes.bool,
    scrollingActions: _propTypes.PropTypes.shape({
      clearsScrolledComponentKey: _propTypes.PropTypes.func.isRequired
    }).isRequired,
    shouldFocusOnMount: _propTypes.PropTypes.bool
  }), _class.defaultProps = {
    scrollKey: '',
    scrolledComponentKey: '',
    scrollingFocus: false,
    shouldFocusOnMount: false
  }, _temp;
};

var unconnectedExtension = function unconnectedExtension(givenComponent) {
  return makeScrollable(givenComponent);
};

exports.unconnectedExtension = unconnectedExtension;

var _default = function _default(givenComponent) {
  return connectToScrollingStore(unconnectedExtension(givenComponent));
};

exports.default = _default;