"use strict";

require("core-js/modules/es.symbol.js");
require("core-js/modules/es.array.filter.js");
require("core-js/modules/es.array.for-each.js");
require("core-js/modules/es.array.iterator.js");
require("core-js/modules/es.array.push.js");
require("core-js/modules/es.object.define-properties.js");
require("core-js/modules/es.object.define-property.js");
require("core-js/modules/es.object.get-own-property-descriptor.js");
require("core-js/modules/es.object.get-own-property-descriptors.js");
require("core-js/modules/es.object.keys.js");
require("core-js/modules/es.object.to-string.js");
require("core-js/modules/es.string.iterator.js");
require("core-js/modules/es.weak-map.js");
require("core-js/modules/esnext.iterator.constructor.js");
require("core-js/modules/esnext.iterator.filter.js");
require("core-js/modules/esnext.iterator.for-each.js");
require("core-js/modules/esnext.weak-map.delete-all.js");
require("core-js/modules/esnext.weak-map.emplace.js");
require("core-js/modules/web.dom-collections.for-each.js");
require("core-js/modules/web.dom-collections.iterator.js");
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
var _typeof = require("@babel/runtime/helpers/typeof");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Popup = void 0;
require("core-js/modules/es.array.concat.js");
require("core-js/modules/es.array.includes.js");
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _classnames = _interopRequireDefault(require("classnames"));
var _react = _interopRequireWildcard(require("react"));
var _index = require("./hooks/index");
var _nativeProps = require("./utils/native-props");
var _withDefaultProps = require("./utils/with-default-props");
var _useLockScroll = require("./utils/use-lock-scroll");
var _renderToContainer = require("./utils/render-to-container");
var _web = require("@react-spring/web");
var _withStopPropagation = require("./utils/with-stop-propagation");
var _shouldRender = require("./utils/should-render");
var _popupBaseProps = require("./popup-base-props");
var _useInnerVisible = require("./utils/use-inner-visible");
var _react2 = require("@use-gesture/react");
var _closeIcon = require("../close-icon");
var _jsxRuntime = require("react/jsx-runtime");
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); }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var classPrefix = "fcr-mobile-popup";
var defaultProps = _objectSpread(_objectSpread({}, _popupBaseProps.defaultPopupBaseProps), {}, {
  closeOnSwipe: false,
  position: 'bottom'
});
var Popup = exports.Popup = function Popup(p) {
  var props = (0, _withDefaultProps.mergeProps)(defaultProps, {}, p);
  var bodyCls = (0, _classnames["default"])("".concat(classPrefix, "-body"), props.bodyClassName, "".concat(classPrefix, "-body-position-").concat(props.position));
  var _useState = (0, _react.useState)(props.visible),
    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
    active = _useState2[0],
    setActive = _useState2[1];
  var ref = (0, _react.useRef)(null);
  (0, _useLockScroll.useLockScroll)(ref, props.disableBodyScroll && active ? 'strict' : false);
  (0, _index.useIsomorphicLayoutEffect)(function () {
    if (props.visible) {
      setActive(true);
    }
  }, [props.visible]);
  var unmountedRef = (0, _index.useUnmountedRef)();
  var _useSpring = (0, _web.useSpring)({
      percent: props.visible ? 0 : 100,
      config: {
        precision: 0.1,
        mass: 0.4,
        tension: 300,
        friction: 30
      },
      onRest: function onRest() {
        if (unmountedRef.current) return;
        setActive(props.visible);
        if (props.visible) {
          var _props$afterShow;
          (_props$afterShow = props.afterShow) === null || _props$afterShow === void 0 || _props$afterShow.call(props);
        } else {
          var _props$afterClose;
          (_props$afterClose = props.afterClose) === null || _props$afterClose === void 0 || _props$afterClose.call(props);
        }
      }
    }),
    percent = _useSpring.percent;
  var bind = (0, _react2.useDrag)(function (_ref) {
    var _ref$swipe = (0, _slicedToArray2["default"])(_ref.swipe, 2),
      swipeY = _ref$swipe[1];
    if (!props.closeOnSwipe) return;
    if (swipeY === 1 && props.position === 'bottom' || swipeY === -1 && props.position === 'top') {
      var _props$onClose;
      (_props$onClose = props.onClose) === null || _props$onClose === void 0 || _props$onClose.call(props);
    }
  }, {
    axis: 'y',
    enabled: ['top', 'bottom'].includes(props.position)
  });
  var maskVisible = (0, _useInnerVisible.useInnerVisible)(active && props.visible);
  var node = (0, _withStopPropagation.withStopPropagation)(props.stopPropagation, (0, _nativeProps.withNativeProps)(props, /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", _objectSpread(_objectSpread({
    id: props.elId,
    className: classPrefix,
    onClick: props.onClick,
    style: {
      display: active ? undefined : 'none',
      touchAction: ['top', 'bottom'].includes(props.position) ? 'none' : 'auto'
    }
  }, bind()), {}, {
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      className: "fcr-popup-modal-mask",
      onClick: function onClick(e) {
        var _props$onMaskClick;
        (_props$onMaskClick = props.onMaskClick) === null || _props$onMaskClick === void 0 || _props$onMaskClick.call(props, e);
        if (props.closeOnMaskClick) {
          var _props$onClose2;
          (_props$onClose2 = props.onClose) === null || _props$onClose2 === void 0 || _props$onClose2.call(props);
        }
      }
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_web.animated.div, {
      className: bodyCls,
      style: _objectSpread(_objectSpread({}, props.bodyStyle), {}, {
        pointerEvents: percent.to(function (v) {
          return v === 0 ? 'unset' : 'none';
        }),
        transform: percent.to(function (v) {
          if (props.position === 'bottom') {
            return "translate(0, ".concat(v, "%)");
          }
          if (props.position === 'top') {
            return "translate(0, -".concat(v, "%)");
          }
          if (props.position === 'left') {
            return "translate(-".concat(v, "%, 0)");
          }
          if (props.position === 'right') {
            return "translate(".concat(v, "%, 0)");
          }
          return 'none';
        })
      }),
      ref: ref,
      children: [props.showCloseButton && /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
        className: (0, _classnames["default"])("".concat(classPrefix, "-close-icon"), 'fcr-mobile-plain-anchor'),
        onClick: function onClick() {
          var _props$onClose3;
          (_props$onClose3 = props.onClose) === null || _props$onClose3 === void 0 || _props$onClose3.call(props);
        },
        role: "button",
        children: props.closeIcon || /*#__PURE__*/(0, _jsxRuntime.jsx)(_closeIcon.FcrMobileClosePopupIcon, {})
      }), props.children]
    })]
  }))));
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_shouldRender.ShouldRender, {
    active: active,
    forceRender: props.forceRender,
    destroyOnClose: props.destroyOnClose,
    children: (0, _renderToContainer.renderToContainer)(props.getContainer, node)
  });
};