wix-style-react/dist/src/Popover/PopoverCore/utils/ClickOutside.js

wix-style-react

"use strict";

exports.__esModule = true;
exports.ClickOutside = void 0;
var React = _interopRequireWildcard(require("react"));
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
/**
 * Click outside behavior
 */
class ClickOutside extends React.PureComponent {
  constructor(props) {
    super(props);
    this._boundEvents = void 0;
    /**
     * Check whether the click is inside the element or excluded
     * @param event - Click event
     */
    /**
     * Check whether the click is inside the element or excluded
     * @param event - Click event
     */
    // @ts-ignore
    this._isInsideClick = event => {
      var {
        rootRef,
        excludeClass
      } = this.props;
      var target = event.target;
      while (target) {
        // Same node
        if (rootRef.current === target) {
          return true;
        }

        // Contains an excluded class
        if (target.classList) {
          if (typeof excludeClass === 'string' && target.classList.contains(excludeClass)) {
            return true;
          }
          if (typeof excludeClass === 'object' && target.classList.toString().split(' ').some(c => excludeClass.includes(c))) {
            return true;
          }
        }
        // @ts-expect-error
        target = target.parentElement;
      }
      return;
    };
    /**
     * Triggers onClickOutside callback when clicked outside child
     * @param event - Click event
     */
    this._onClickOutside = event => {
      var {
        onClickOutside
      } = this.props;
      if (typeof onClickOutside === 'function' && !this._isInsideClick(event)) {
        onClickOutside(event);
      }
    };
    this._boundEvents = [];
  }

  /**
   * Register ClickOutside events
   */
  _registerEvents() {
    var {
      options
    } = this.props;
    ['mouseup', 'touchend'].forEach(eventName => {
      document.addEventListener(eventName, this._onClickOutside, options);
      this._boundEvents.push(eventName);
    });
  }

  /**
   * Unregister ClickOutside events
   */
  _unregisterEvents() {
    var {
      options
    } = this.props;
    while (this._boundEvents.length > 0) {
      var eventName = this._boundEvents.pop();
      if (eventName) {
        document.removeEventListener(eventName, this._onClickOutside, options);
      }
    }
  }
  componentDidMount() {
    if (this.props.onClickOutside) {
      this._registerEvents();
    }
  }
  componentDidUpdate(prevProps) {
    if (this.props.onClickOutside !== prevProps.onClickOutside) {
      if (this.props.onClickOutside) {
        this._registerEvents();
      } else {
        this._unregisterEvents();
      }
    }
  }
  componentWillUnmount() {
    this._unregisterEvents();
  }
  render() {
    return this.props.children;
  }
}
exports.ClickOutside = ClickOutside;
//# sourceMappingURL=ClickOutside.js.map