backpack-ui/dist/hoc/clickOutside/index.js

Lonely Planet's Components

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _extends2 = require("babel-runtime/helpers/extends");

var _extends3 = _interopRequireDefault(_extends2);

var _getPrototypeOf = require("babel-runtime/core-js/object/get-prototype-of");

var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);

var _classCallCheck2 = require("babel-runtime/helpers/classCallCheck");

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

var _createClass2 = require("babel-runtime/helpers/createClass");

var _createClass3 = _interopRequireDefault(_createClass2);

var _possibleConstructorReturn2 = require("babel-runtime/helpers/possibleConstructorReturn");

var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);

var _inherits2 = require("babel-runtime/helpers/inherits");

var _inherits3 = _interopRequireDefault(_inherits2);

var _react = require("react");

var _react2 = _interopRequireDefault(_react);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var clickOutside = function clickOutside(WrappedComponent) {
  var HigherOrderComponent = function (_Component) {
    (0, _inherits3.default)(HigherOrderComponent, _Component);

    function HigherOrderComponent(props) {
      (0, _classCallCheck3.default)(this, HigherOrderComponent);

      var _this = (0, _possibleConstructorReturn3.default)(this, (HigherOrderComponent.__proto__ || (0, _getPrototypeOf2.default)(HigherOrderComponent)).call(this, props));

      _this.handleClickOutside = _this.handleClickOutside.bind(_this);
      return _this;
    }

    (0, _createClass3.default)(HigherOrderComponent, [{
      key: "componentDidMount",
      value: function componentDidMount() {
        if (typeof this.innerRef === "undefined") {
          console.warn("Incorrect or missing ref on enhanced component; ref must use props.innerRef"); // eslint-disable-line no-console
        }

        if (typeof window !== "undefined") {
          window.addEventListener("click", this.handleClickOutside, false);
        }
      }
    }, {
      key: "componentWillUnmount",
      value: function componentWillUnmount() {
        if (typeof window !== "undefined") {
          window.removeEventListener("click", this.handleClickOutside, false);
        }
      }
    }, {
      key: "handleClickOutside",
      value: function handleClickOutside(event) {
        var target = event.target;
        var isPassedFunction = typeof this.outerRef.handleClickOutside === "function";
        var notTarget = !this.innerRef || !this.innerRef.contains(target);

        if (notTarget && isPassedFunction) {
          this.outerRef.handleClickOutside(event);
        }
      }
    }, {
      key: "render",
      value: function render() {
        var _this2 = this;

        return _react2.default.createElement(WrappedComponent, (0, _extends3.default)({}, this.props, {
          innerRef: function innerRef(node) {
            return _this2.innerRef = node;
          },
          ref: function ref(node) {
            return _this2.outerRef = node;
          }
        }));
      }
    }]);
    return HigherOrderComponent;
  }(_react.Component);

  return HigherOrderComponent;
};

exports.default = clickOutside;