'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
var react = require('@floating-ui/react');
var React = require('react');
var react$1 = require('../../utils/react.js');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var React__default = /*#__PURE__*/_interopDefault(React);

// TODO: #2003
var LIST_PADDING = 2;
var FloatingPopover = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
  var target = _ref.target,
    children = _ref.children,
    opened = _ref.opened,
    onToggle = _ref.onToggle,
    placement = _ref.placement,
    portal = _ref.portal,
    listWidth = _ref.listWidth,
    zIndex = _ref.zIndex,
    isInner = _ref.isInner,
    offset = _ref.offset,
    _ref$shift = _ref.shift,
    outsideShift = _ref$shift === void 0 ? false : _ref$shift,
    _ref$flip = _ref.flip,
    outsideFlip = _ref$flip === void 0 ? false : _ref$flip;
  var _useFloating = react.useFloating({
      whileElementsMounted: react.autoUpdate,
      placement: placement,
      open: opened,
      middleware: [react.offset({
        mainAxis: isInner ? LIST_PADDING * 2 : (offset === null || offset === void 0 ? void 0 : offset[1]) || 0,
        alignmentAxis: isInner ? -LIST_PADDING : (offset === null || offset === void 0 ? void 0 : offset[0]) || 0
      }), outsideShift && react.shift({
        limiter: react.limitShift()
      }), outsideFlip && react.flip(), react.size({
        apply: function apply(_ref2) {
          var rects = _ref2.rects,
            elements = _ref2.elements;
          Object.assign(elements.floating.style, {
            width: listWidth || "".concat(isInner ? rects.reference.width + LIST_PADDING * 2 : rects.reference.width, "px")
          });
        }
      })]
    }),
    refs = _useFloating.refs,
    floatingStyles = _useFloating.floatingStyles;
  var wrappedId = react$1.safeUseId();
  var handleClick = function handleClick() {
    if (onToggle) {
      onToggle(!opened);
    }
  };

  // Проверка на target. Это может быть как ReactNode, так и функция, в которую пробрасывается ref.
  // Это нужно для более тонкой настройки reference-элемента, вокруг которого и будет позиционироваться выпадашка.
  // Пример: когда в Textfield под инпутом находится helperText (или еще что-либо),
  // но выпадающий список должен позиционироваться непосредственно возле самого инпута.
  var isTargetAsFunction = typeof target === 'function';
  return /*#__PURE__*/React__default.default.createElement("div", {
    ref: ref,
    id: wrappedId,
    style: {
      position: 'relative'
    }
  }, /*#__PURE__*/React__default.default.createElement("div", {
    ref: isTargetAsFunction ? undefined : refs.setReference,
    onClick: handleClick
  }, typeof target === 'function' ? target(refs.setReference) : target), opened &&
  /*#__PURE__*/
  // root - принимает ref контейнера портала.
  // id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.
  React__default.default.createElement(react.FloatingPortal, getFloatingPortalProps(portal, wrappedId), /*#__PURE__*/React__default.default.createElement("div", {
    ref: refs.setFloating,
    style: _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, floatingStyles), {}, {
      zIndex: zIndex || 1000
    })
  }, children)));
});
// root - принимает ref контейнера портала.
// id - если есть портал - не используется, если портала нет - подставляется 'wrappedId'.
var getFloatingPortalProps = function getFloatingPortalProps(portal, wrappedId) {
  if (!portal) {
    return {
      id: wrappedId
    };
  }
  if (typeof portal === 'string') {
    return {
      id: portal
    };
  }
  return {
    root: portal
  };
};

exports.FloatingPopover = FloatingPopover;
