dott-react-popper/lib/cjs/index.js

React wrapper around Popper.js

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

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

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

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

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

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

var _renderprops = require("react-spring/renderprops");

var _Popper = _interopRequireDefault(require("./Popper"));

var _Manager = _interopRequireDefault(require("./Manager"));

var _Reference = _interopRequireDefault(require("./Reference"));

function ReactPopper(_ref) {
  var children = _ref.children,
      reference = _ref.reference,
      isOpen = _ref.isOpen,
      _ref$placement = _ref.placement,
      placement = _ref$placement === void 0 ? 'bottom-start' : _ref$placement,
      _ref$modifiers = _ref.modifiers,
      modifiers = _ref$modifiers === void 0 ? {} : _ref$modifiers,
      props = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["children", "reference", "isOpen", "placement", "modifiers"]);
  return _react["default"].createElement(_Manager["default"], null, _react["default"].createElement(_Reference["default"], null, reference), _react["default"].createElement(_renderprops.Transition, {
    items: isOpen,
    from: {
      opacity: 0,
      top: 32
    },
    enter: {
      opacity: 1,
      top: 0
    },
    leave: {
      opacity: 0,
      top: 32
    }
  }, function (isOpen) {
    return isOpen && function (_ref2) {
      var opacity = _ref2.opacity,
          topOffset = _ref2.top;
      return _react["default"].createElement(_Popper["default"], (0, _extends2["default"])({
        placement: placement,
        modifiers: (0, _extends2["default"])({
          flip: {
            enabled: true
          },
          preventOverflow: {
            enabled: true
          },
          hide: {
            enabled: false
          },
          computeStyle: {
            gpuAcceleration: false
          }
        }, modifiers)
      }, props), function (props) {
        return children((0, _extends2["default"])({}, props, {
          opacity: opacity,
          topOffset: topOffset
        }));
      });
    };
  }));
}

var _default = ReactPopper;
exports["default"] = _default;