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

React wrapper around Popper.js

import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
import React, { Fragment } from 'react';
import { Transition } from 'react-spring/renderprops';
import Popper from './Popper';
import Manager from './Manager';
import Reference from './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 = _objectWithoutPropertiesLoose(_ref, ["children", "reference", "isOpen", "placement", "modifiers"]);

  return React.createElement(Manager, null, React.createElement(Reference, null, reference), React.createElement(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.createElement(Popper, _extends({
        placement: placement,
        modifiers: _extends({
          flip: {
            enabled: true
          },
          preventOverflow: {
            enabled: true
          },
          hide: {
            enabled: false
          },
          computeStyle: {
            gpuAcceleration: false
          }
        }, modifiers)
      }, props), function (props) {
        return children(_extends({}, props, {
          opacity: opacity,
          topOffset: topOffset
        }));
      });
    };
  }));
}

export default ReactPopper;