123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206 |
- "use strict";
-
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
- Object.defineProperty(exports, "__esModule", {
- value: true
- });
- exports.default = Popper;
- exports.placements = exports.InnerPopper = void 0;
-
- var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
-
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
- var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
-
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
- var React = _interopRequireWildcard(require("react"));
-
- var _popper = _interopRequireDefault(require("popper.js"));
-
- var _Manager = require("./Manager");
-
- var _utils = require("./utils");
-
- var initialStyle = {
- position: 'absolute',
- top: 0,
- left: 0,
- opacity: 0,
- pointerEvents: 'none'
- };
- var initialArrowStyle = {};
-
- var InnerPopper =
- /*#__PURE__*/
- function (_React$Component) {
- (0, _inheritsLoose2.default)(InnerPopper, _React$Component);
-
- function InnerPopper() {
- var _this;
-
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
- args[_key] = arguments[_key];
- }
-
- _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "state", {
- data: undefined,
- placement: undefined
- });
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "popperInstance", void 0);
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "popperNode", null);
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "arrowNode", null);
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setPopperNode", function (popperNode) {
- if (!popperNode || _this.popperNode === popperNode) return;
- (0, _utils.setRef)(_this.props.innerRef, popperNode);
- _this.popperNode = popperNode;
-
- _this.updatePopperInstance();
- });
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "setArrowNode", function (arrowNode) {
- _this.arrowNode = arrowNode;
- });
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "updateStateModifier", {
- enabled: true,
- order: 900,
- fn: function fn(data) {
- var placement = data.placement;
-
- _this.setState({
- data: data,
- placement: placement
- });
-
- return data;
- }
- });
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getOptions", function () {
- return {
- placement: _this.props.placement,
- eventsEnabled: _this.props.eventsEnabled,
- positionFixed: _this.props.positionFixed,
- modifiers: (0, _extends2.default)({}, _this.props.modifiers, {
- arrow: (0, _extends2.default)({}, _this.props.modifiers && _this.props.modifiers.arrow, {
- enabled: !!_this.arrowNode,
- element: _this.arrowNode
- }),
- applyStyle: {
- enabled: false
- },
- updateStateModifier: _this.updateStateModifier
- })
- };
- });
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getPopperStyle", function () {
- return !_this.popperNode || !_this.state.data ? initialStyle : (0, _extends2.default)({
- position: _this.state.data.offsets.popper.position
- }, _this.state.data.styles);
- });
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getPopperPlacement", function () {
- return !_this.state.data ? undefined : _this.state.placement;
- });
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getArrowStyle", function () {
- return !_this.arrowNode || !_this.state.data ? initialArrowStyle : _this.state.data.arrowStyles;
- });
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getOutOfBoundariesState", function () {
- return _this.state.data ? _this.state.data.hide : undefined;
- });
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "destroyPopperInstance", function () {
- if (!_this.popperInstance) return;
-
- _this.popperInstance.destroy();
-
- _this.popperInstance = null;
- });
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "updatePopperInstance", function () {
- _this.destroyPopperInstance();
-
- var _assertThisInitialize = (0, _assertThisInitialized2.default)(_this),
- popperNode = _assertThisInitialize.popperNode;
-
- var referenceElement = _this.props.referenceElement;
- if (!referenceElement || !popperNode) return;
- _this.popperInstance = new _popper.default(referenceElement, popperNode, _this.getOptions());
- });
- (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "scheduleUpdate", function () {
- if (_this.popperInstance) {
- _this.popperInstance.scheduleUpdate();
- }
- });
- return _this;
- }
-
- var _proto = InnerPopper.prototype;
-
- _proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {
- // If the Popper.js options have changed, update the instance (destroy + create)
- if (this.props.placement !== prevProps.placement || this.props.referenceElement !== prevProps.referenceElement || this.props.positionFixed !== prevProps.positionFixed || this.props.modifiers !== prevProps.modifiers) {
- // develop only check that modifiers isn't being updated needlessly
- if (process.env.NODE_ENV === "development") {
- if (this.props.modifiers !== prevProps.modifiers && this.props.modifiers != null && prevProps.modifiers != null && (0, _utils.shallowEqual)(this.props.modifiers, prevProps.modifiers)) {
- console.warn("'modifiers' prop reference updated even though all values appear the same.\nConsider memoizing the 'modifiers' object to avoid needless rendering.");
- }
- }
-
- this.updatePopperInstance();
- } else if (this.props.eventsEnabled !== prevProps.eventsEnabled && this.popperInstance) {
- this.props.eventsEnabled ? this.popperInstance.enableEventListeners() : this.popperInstance.disableEventListeners();
- } // A placement difference in state means popper determined a new placement
- // apart from the props value. By the time the popper element is rendered with
- // the new position Popper has already measured it, if the place change triggers
- // a size change it will result in a misaligned popper. So we schedule an update to be sure.
-
-
- if (prevState.placement !== this.state.placement) {
- this.scheduleUpdate();
- }
- };
-
- _proto.componentWillUnmount = function componentWillUnmount() {
- (0, _utils.setRef)(this.props.innerRef, null);
- this.destroyPopperInstance();
- };
-
- _proto.render = function render() {
- return (0, _utils.unwrapArray)(this.props.children)({
- ref: this.setPopperNode,
- style: this.getPopperStyle(),
- placement: this.getPopperPlacement(),
- outOfBoundaries: this.getOutOfBoundariesState(),
- scheduleUpdate: this.scheduleUpdate,
- arrowProps: {
- ref: this.setArrowNode,
- style: this.getArrowStyle()
- }
- });
- };
-
- return InnerPopper;
- }(React.Component);
-
- exports.InnerPopper = InnerPopper;
- (0, _defineProperty2.default)(InnerPopper, "defaultProps", {
- placement: 'bottom',
- eventsEnabled: true,
- referenceElement: undefined,
- positionFixed: false
- });
- var placements = _popper.default.placements;
- exports.placements = placements;
-
- function Popper(_ref) {
- var referenceElement = _ref.referenceElement,
- props = (0, _objectWithoutPropertiesLoose2.default)(_ref, ["referenceElement"]);
- return React.createElement(_Manager.ManagerReferenceNodeContext.Consumer, null, function (referenceNode) {
- return React.createElement(InnerPopper, (0, _extends2.default)({
- referenceElement: referenceElement !== undefined ? referenceElement : referenceNode
- }, props));
- });
- }
|