"use strict";

exports.__esModule = true;
exports.sharedPopupProps = exports.default = void 0;

var _react = _interopRequireWildcard(require("react"));

var _clsx = _interopRequireDefault(require("clsx"));

var _reactTransitionGroup = require("react-transition-group");

var _icons = require("@react-vant/icons");

var _overlay = _interopRequireDefault(require("../overlay"));

var _useEventListener = _interopRequireDefault(require("../hooks/use-event-listener"));

var _utils = require("../utils");

var _interceptor = require("../utils/interceptor");

var _renderToContainer = require("../utils/dom/renderToContainer");

var _useSsrCompat2 = _interopRequireDefault(require("../hooks/use-ssr-compat"));

var _ConfigProviderContext = _interopRequireDefault(require("../config-provider/ConfigProviderContext"));

var _PopupContext = _interopRequireDefault(require("./PopupContext"));

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 || 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); }

var sharedPopupProps = ['round', 'zIndex', 'closeable', 'overlay', 'overlayClass', 'overlayStyle', 'destroyOnClose', 'forceRender', 'lockScroll', 'duration', 'transition', 'closeOnClickOverlay', 'closeOnPopstate', 'onClickOverlay', 'safeAreaInsetBottom', 'onOpen', 'onClose', 'onOpened', 'onClosed', 'beforeClose'];
exports.sharedPopupProps = sharedPopupProps;
var globalZIndex = 2000;
var Popup = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
  var _props$zIndex;

  var _useContext = (0, _react.useContext)(_ConfigProviderContext.default),
      prefixCls = _useContext.prefixCls,
      createNamespace = _useContext.createNamespace;

  var _createNamespace = createNamespace('popup', prefixCls),
      bem = _createNamespace[0];

  var round = props.round,
      visible = props.visible,
      closeable = props.closeable,
      title = props.title,
      descrition = props.descrition,
      children = props.children,
      duration = props.duration,
      closeIcon = props.closeIcon,
      position = props.position;
  var opened = (0, _react.useRef)(false);
  var zIndex = (0, _react.useRef)((_props$zIndex = props.zIndex) != null ? _props$zIndex : globalZIndex);
  var popupRef = (0, _react.useRef)();

  var _useState = (0, _react.useState)(visible),
      animatedVisible = _useState[0],
      setAnimatedVisible = _useState[1];

  var _useSsrCompat = (0, _useSsrCompat2.default)(),
      ssrCompatRender = _useSsrCompat[0],
      rendered = _useSsrCompat[1];

  var style = (0, _react.useMemo)(function () {
    var initStyle = _extends({
      zIndex: zIndex.current
    }, props.style);

    if ((0, _utils.isDef)(props.duration)) {
      var key = props.position === 'center' ? 'animationDuration' : 'transitionDuration';
      initStyle[key] = props.duration + "ms";
    }

    return initStyle;
  }, [zIndex.current, props.style, props.duration]);

  var open = function open() {
    if (props.zIndex !== undefined) {
      zIndex.current = +props.zIndex;
    } else {
      zIndex.current = globalZIndex++;
    }

    opened.current = true;
    props.onOpen == null ? void 0 : props.onOpen();
  };

  var close = function close() {
    if (opened.current) {
      (0, _interceptor.callInterceptor)({
        interceptor: props.beforeClose,
        args: ['close'],
        done: function done() {
          opened.current = false;
          props.onClose == null ? void 0 : props.onClose();
        }
      });
    }
  };

  var onClickOverlay = function onClickOverlay(event) {
    props.onClickOverlay == null ? void 0 : props.onClickOverlay(event);

    if (props.closeOnClickOverlay) {
      close();
    }
  };

  var renderOverlay = function renderOverlay() {
    if (props.overlay) {
      return /*#__PURE__*/_react.default.createElement(_overlay.default, {
        visible: visible && rendered,
        lockScroll: props.lockScroll,
        className: props.overlayClass,
        customStyle: props.overlayStyle,
        zIndex: zIndex.current,
        duration: duration,
        onClick: onClickOverlay
      });
    }

    return null;
  };

  var onClickCloseIcon = function onClickCloseIcon(e) {
    if (props.onClickCloseIcon) {
      props.onClickCloseIcon(e);
    }

    close();
  };

  var renderCloseIcon = function renderCloseIcon() {
    if (closeable) {
      var closeIconPosition = props.closeIconPosition;

      if (closeIcon) {
        return /*#__PURE__*/_react.default.createElement("div", {
          className: (0, _clsx.default)(bem('close-icon', closeIconPosition)),
          onClick: onClickCloseIcon
        }, closeIcon);
      }

      return null;
    }

    return null;
  };

  var renderTitle = function renderTitle() {
    if (title) {
      return /*#__PURE__*/_react.default.createElement("div", {
        className: (0, _clsx.default)(bem('title'))
      }, title);
    }

    return null;
  };

  var renderDescrition = function renderDescrition() {
    if (descrition) {
      return /*#__PURE__*/_react.default.createElement("div", {
        className: (0, _clsx.default)(bem('descrition'))
      }, descrition);
    }

    return null;
  };

  var renderPopup = function renderPopup() {
    var _bem;

    var safeAreaInsetBottom = props.safeAreaInsetBottom;
    return /*#__PURE__*/_react.default.createElement("div", {
      ref: popupRef,
      style: _extends({}, style, {
        display: !visible && !animatedVisible ? 'none' : undefined
      }),
      className: (0, _clsx.default)(bem((_bem = {
        round: round
      }, _bem[position] = position, _bem)), {
        'rv-safe-area-bottom': safeAreaInsetBottom
      }, props.className),
      onClick: props.onClick
    }, renderTitle(), renderDescrition(), children, renderCloseIcon());
  };

  var renderTransition = function renderTransition() {
    var transition = props.transition,
        destroyOnClose = props.destroyOnClose,
        forceRender = props.forceRender;
    var name = position === 'center' ? prefixCls + "-fade" : prefixCls + "-popup-slide-" + position;
    return /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.CSSTransition, {
      in: visible && rendered,

      /**
       * https://github.com/reactjs/react-transition-group/pull/559
       */
      nodeRef: popupRef,
      timeout: duration,
      classNames: transition || name,
      mountOnEnter: !forceRender,
      unmountOnExit: destroyOnClose,
      onEnter: open,
      onEntered: props.onOpened,
      onExited: function onExited() {
        setAnimatedVisible(false);
        props.onClosed == null ? void 0 : props.onClosed();
      }
    }, renderPopup());
  };

  (0, _useEventListener.default)('popstate', function () {
    if (props.closeOnPopstate) {
      close();
    }
  });
  (0, _react.useEffect)(function () {
    if (!rendered) return;

    if (visible) {
      setAnimatedVisible(true);
    }
  }, [visible, rendered]);
  (0, _react.useImperativeHandle)(ref, function () {
    return {
      popupRef: popupRef
    };
  });
  return ssrCompatRender(function () {
    return (0, _renderToContainer.renderToContainer)(props.teleport, /*#__PURE__*/_react.default.createElement(_PopupContext.default.Provider, {
      value: {
        visible: visible
      }
    }, renderOverlay(), renderTransition()));
  });
});
Popup.defaultProps = {
  duration: 300,
  overlay: true,
  lockScroll: true,
  position: 'center',
  closeIcon: /*#__PURE__*/_react.default.createElement(_icons.Cross, null),
  closeIconPosition: 'top-right',
  closeOnClickOverlay: true,
  teleport: function teleport() {
    return document.body;
  }
};
var _default = Popup;
exports.default = _default;