"use strict";

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

exports.__esModule = true;
exports["default"] = usePopper;

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

var _popper = _interopRequireDefault(require("popper.js"));

var _react = require("react");

var initialPopperStyles = {
  position: 'absolute',
  top: '0',
  left: '0',
  opacity: '0',
  pointerEvents: 'none'
};
var initialArrowStyles = {};
/**
 * Position an element relative some reference element using Popper.js
 *
 * @param {HTMLElement} referenceElement The element
 * @param {HTMLElement} popperElement
 * @param {Object}      options
 * @param {Object}      options.modifiers Popper.js modifiers
 * @param {Boolean}     options.enabled toggle the popper functionality on/off
 * @param {String}      options.placement The popper element placement relative to the reference element
 * @param {Boolean}     options.positionFixed use fixed positioning
 * @param {Boolean}     options.eventsEnabled have Popper listen on window resize events to reposition the element
 */

function usePopper(referenceElement, popperElement, _temp) {
  var _ref = _temp === void 0 ? {} : _temp,
      _ref$enabled = _ref.enabled,
      enabled = _ref$enabled === void 0 ? true : _ref$enabled,
      _ref$placement = _ref.placement,
      placement = _ref$placement === void 0 ? 'bottom' : _ref$placement,
      _ref$positionFixed = _ref.positionFixed,
      positionFixed = _ref$positionFixed === void 0 ? false : _ref$positionFixed,
      _ref$eventsEnabled = _ref.eventsEnabled,
      eventsEnabled = _ref$eventsEnabled === void 0 ? true : _ref$eventsEnabled,
      _ref$modifiers = _ref.modifiers,
      modifiers = _ref$modifiers === void 0 ? {} : _ref$modifiers;

  var popperInstanceRef = (0, _react.useRef)();
  var hasArrow = !!(modifiers.arrow && modifiers.arrow.element);
  var scheduleUpdate = (0, _react.useCallback)(function () {
    if (popperInstanceRef.current) {
      popperInstanceRef.current.scheduleUpdate();
    }
  }, []);

  var _useState = (0, _react.useState)({
    placement: placement,
    scheduleUpdate: scheduleUpdate,
    outOfBoundaries: false,
    styles: initialPopperStyles,
    arrowStyles: initialArrowStyles
  }),
      state = _useState[0],
      setState = _useState[1]; // A placement difference in state means popper determined a new placement
  // apart from the props value. By the time the popper element is rendered with
  // the new position Popper has already measured it, if the place change triggers
  // a size change it will result in a misaligned popper. So we schedule an update to be sure.


  (0, _react.useEffect)(function () {
    scheduleUpdate();
  }, [state.placement, scheduleUpdate]);
  /** Toggle Events */

  (0, _react.useEffect)(function () {
    if (popperInstanceRef.current) {
      // eslint-disable-next-line no-unused-expressions
      eventsEnabled ? popperInstanceRef.current.enableEventListeners() : popperInstanceRef.current.disableEventListeners();
    }
  }, [eventsEnabled]);
  (0, _react.useEffect)(function () {
    if (!enabled || referenceElement == null || popperElement == null) {
      return undefined;
    }

    var arrow = modifiers.arrow && (0, _extends2["default"])({}, modifiers.arrow, {
      element: modifiers.arrow.element
    });
    popperInstanceRef.current = new _popper["default"](referenceElement, popperElement, {
      placement: placement,
      positionFixed: positionFixed,
      modifiers: (0, _extends2["default"])({}, modifiers, {
        arrow: arrow,
        applyStyle: {
          enabled: false
        },
        updateStateModifier: {
          enabled: true,
          order: 900,
          fn: function fn(data) {
            setState({
              scheduleUpdate: scheduleUpdate,
              styles: (0, _extends2["default"])({
                position: data.offsets.popper.position
              }, data.styles),
              arrowStyles: data.arrowStyles,
              outOfBoundaries: data.hide,
              placement: data.placement
            });
          }
        }
      })
    });
    return function () {
      if (popperInstanceRef.current !== null) {
        popperInstanceRef.current.destroy();
        popperInstanceRef.current = null;
      }
    }; // intentionally NOT re-running on new modifiers
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [enabled, placement, positionFixed, referenceElement, popperElement, hasArrow]);
  return state;
}

module.exports = exports.default;