"use strict";

function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.NativeDialog = void 0;
var _compat = _interopRequireWildcard(require("preact/compat"));
var _polyfill = _interopRequireDefault(require("./polyfill"));
var _excluded = ["children", "exit", "isOpen", "showModal", "backdropClickExits", "boundingBoxRef"];
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
/**
 * This is an internal component and may change without warning. Use at your own risk!
 */
var NativeDialog = function NativeDialog(_ref) {
  var children = _ref.children,
    exit = _ref.exit,
    isOpen = _ref.isOpen,
    showModal = _ref.showModal,
    backdropClickExits = _ref.backdropClickExits,
    boundingBoxRef = _ref.boundingBoxRef,
    dialogProps = _objectWithoutProperties(_ref, _excluded);
  var dialogRef = (0, _compat.useRef)(null);
  if (isOpen === undefined) {
    if (process.env.NODE_ENV !== 'production') {
      console.warn("The 'isOpen' prop is now used to control the state of Dialogs and Drawers. Please do not conditionally render these components to control their state. All Dialogs and Drawers will become invisible without this prop in the next major release. Using this prop will fix a focus-management issue that affects accessibility.");
    }
    isOpen = true;
  }

  // Register dialog with the polyfill if necessary
  (0, _compat.useLayoutEffect)(function () {
    // The registerDialog function itself determines if the polyfill needs to be applied
    _polyfill.default.registerDialog(dialogRef.current);
  });

  // Call imperative show and close functions on mount/unmount
  (0, _compat.useEffect)(function () {
    var dialogNode = dialogRef.current;

    // Show or hide the dialog based on `isOpen` value. The `dialogNode.open` property is
    // a read-only value that will tell us if our dialog DOM element is actually in the
    // open state.
    var closingBecauseOfProp = false;
    if (isOpen) {
      if (!dialogNode.open) {
        showModal ? dialogNode.showModal() : dialogNode.show();
      }
    } else {
      if (dialogNode.open) {
        dialogNode.close();
        closingBecauseOfProp = true;
      }
    }

    // Bind close event listener for ESC press
    var handleClose = function handleClose(event) {
      event.preventDefault();
      // Only call the exit handler if the parent didn't close it by setting isOpen to false
      if (!closingBecauseOfProp) {
        exit(event);
      }
    };
    dialogNode.addEventListener('close', handleClose);
    return function () {
      dialogNode.removeEventListener('close', handleClose);
    };
  }, [isOpen, showModal, exit]);

  // Bind and unbind backdrop click event listeners on mount and unmount
  (0, _compat.useEffect)(function () {
    if (!backdropClickExits) {
      return;
    }
    var dialogNode = dialogRef.current;
    var handleClick = function handleClick(event) {
      var _boundingBoxRef$curre;
      var boundingNode = (_boundingBoxRef$curre = boundingBoxRef === null || boundingBoxRef === void 0 ? void 0 : boundingBoxRef.current) !== null && _boundingBoxRef$curre !== void 0 ? _boundingBoxRef$curre : dialogRef.current;
      var rect = boundingNode.getBoundingClientRect();
      var isInDialog = rect.top <= event.clientY && event.clientY <= rect.top + rect.height && rect.left <= event.clientX && event.clientX <= rect.left + rect.width;
      if (!isInDialog) {
        exit();
      }
    };
    dialogNode.addEventListener('click', handleClick);
    return function () {
      dialogNode.removeEventListener('click', handleClick);
    };
  }, [exit, backdropClickExits]);
  return /*#__PURE__*/_compat.default.createElement("dialog", _extends({
    ref: dialogRef
  }, dialogProps), children);
};
exports.NativeDialog = NativeDialog;
var _default = NativeDialog;
exports.default = _default;