UNPKG

105 kBJavaScriptView Raw
1'use strict';
2
3var index = require('./index-93294e6c.js');
4
5var React = require('react');
6
7var theming = require('@storybook/theming');
8
9var reactDom = require('react-dom');
10
11var memoize = require('memoizerific');
12
13require('@storybook/csf');
14
15require('qs');
16
17require('@storybook/client-logger');
18
19function _interopDefaultLegacy(e) {
20 return e && typeof e === 'object' && 'default' in e ? e : {
21 'default': e
22 };
23}
24
25function _interopNamespace(e) {
26 if (e && e.__esModule) return e;
27 var n = Object.create(null);
28
29 if (e) {
30 Object.keys(e).forEach(function (k) {
31 if (k !== 'default') {
32 var d = Object.getOwnPropertyDescriptor(e, k);
33 Object.defineProperty(n, k, d.get ? d : {
34 enumerable: true,
35 get: function () {
36 return e[k];
37 }
38 });
39 }
40 });
41 }
42
43 n["default"] = e;
44 return Object.freeze(n);
45}
46
47var React__namespace = /*#__PURE__*/_interopNamespace(React);
48
49var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
50
51var memoize__default = /*#__PURE__*/_interopDefaultLegacy(memoize);
52
53function getNodeName(element) {
54 return element ? (element.nodeName || '').toLowerCase() : null;
55}
56
57function getWindow(node) {
58 if (node == null) {
59 return window;
60 }
61
62 if (node.toString() !== '[object Window]') {
63 var ownerDocument = node.ownerDocument;
64 return ownerDocument ? ownerDocument.defaultView || window : window;
65 }
66
67 return node;
68}
69
70function isElement(node) {
71 var OwnElement = getWindow(node).Element;
72 return node instanceof OwnElement || node instanceof Element;
73}
74
75function isHTMLElement(node) {
76 var OwnElement = getWindow(node).HTMLElement;
77 return node instanceof OwnElement || node instanceof HTMLElement;
78}
79
80function isShadowRoot(node) {
81 // IE 11 has no ShadowRoot
82 if (typeof ShadowRoot === 'undefined') {
83 return false;
84 }
85
86 var OwnElement = getWindow(node).ShadowRoot;
87 return node instanceof OwnElement || node instanceof ShadowRoot;
88} // and applies them to the HTMLElements such as popper and arrow
89
90
91function applyStyles(_ref) {
92 var state = _ref.state;
93 Object.keys(state.elements).forEach(function (name) {
94 var style = state.styles[name] || {};
95 var attributes = state.attributes[name] || {};
96 var element = state.elements[name]; // arrow is optional + virtual elements
97
98 if (!isHTMLElement(element) || !getNodeName(element)) {
99 return;
100 } // Flow doesn't support to extend this property, but it's the most
101 // effective way to apply styles to an HTMLElement
102 // $FlowFixMe[cannot-write]
103
104
105 Object.assign(element.style, style);
106 Object.keys(attributes).forEach(function (name) {
107 var value = attributes[name];
108
109 if (value === false) {
110 element.removeAttribute(name);
111 } else {
112 element.setAttribute(name, value === true ? '' : value);
113 }
114 });
115 });
116}
117
118function effect$2(_ref2) {
119 var state = _ref2.state;
120 var initialStyles = {
121 popper: {
122 position: state.options.strategy,
123 left: '0',
124 top: '0',
125 margin: '0'
126 },
127 arrow: {
128 position: 'absolute'
129 },
130 reference: {}
131 };
132 Object.assign(state.elements.popper.style, initialStyles.popper);
133 state.styles = initialStyles;
134
135 if (state.elements.arrow) {
136 Object.assign(state.elements.arrow.style, initialStyles.arrow);
137 }
138
139 return function () {
140 Object.keys(state.elements).forEach(function (name) {
141 var element = state.elements[name];
142 var attributes = state.attributes[name] || {};
143 var styleProperties = Object.keys(state.styles.hasOwnProperty(name) ? state.styles[name] : initialStyles[name]); // Set all values to an empty string to unset them
144
145 var style = styleProperties.reduce(function (style, property) {
146 style[property] = '';
147 return style;
148 }, {}); // arrow is optional + virtual elements
149
150 if (!isHTMLElement(element) || !getNodeName(element)) {
151 return;
152 }
153
154 Object.assign(element.style, style);
155 Object.keys(attributes).forEach(function (attribute) {
156 element.removeAttribute(attribute);
157 });
158 });
159 };
160} // eslint-disable-next-line import/no-unused-modules
161
162
163var applyStyles$1 = {
164 name: 'applyStyles',
165 enabled: true,
166 phase: 'write',
167 fn: applyStyles,
168 effect: effect$2,
169 requires: ['computeStyles']
170};
171
172function getBasePlacement(placement) {
173 return placement.split('-')[0];
174}
175
176var max = Math.max;
177var min = Math.min;
178var round = Math.round;
179
180function getBoundingClientRect(element, includeScale) {
181 if (includeScale === void 0) {
182 includeScale = false;
183 }
184
185 var rect = element.getBoundingClientRect();
186 var scaleX = 1;
187 var scaleY = 1;
188
189 if (isHTMLElement(element) && includeScale) {
190 var offsetHeight = element.offsetHeight;
191 var offsetWidth = element.offsetWidth; // Do not attempt to divide by 0, otherwise we get `Infinity` as scale
192 // Fallback to 1 in case both values are `0`
193
194 if (offsetWidth > 0) {
195 scaleX = round(rect.width) / offsetWidth || 1;
196 }
197
198 if (offsetHeight > 0) {
199 scaleY = round(rect.height) / offsetHeight || 1;
200 }
201 }
202
203 return {
204 width: rect.width / scaleX,
205 height: rect.height / scaleY,
206 top: rect.top / scaleY,
207 right: rect.right / scaleX,
208 bottom: rect.bottom / scaleY,
209 left: rect.left / scaleX,
210 x: rect.left / scaleX,
211 y: rect.top / scaleY
212 };
213} // means it doesn't take into account transforms.
214
215
216function getLayoutRect(element) {
217 var clientRect = getBoundingClientRect(element); // Use the clientRect sizes if it's not been transformed.
218 // Fixes https://github.com/popperjs/popper-core/issues/1223
219
220 var width = element.offsetWidth;
221 var height = element.offsetHeight;
222
223 if (Math.abs(clientRect.width - width) <= 1) {
224 width = clientRect.width;
225 }
226
227 if (Math.abs(clientRect.height - height) <= 1) {
228 height = clientRect.height;
229 }
230
231 return {
232 x: element.offsetLeft,
233 y: element.offsetTop,
234 width: width,
235 height: height
236 };
237}
238
239function contains(parent, child) {
240 var rootNode = child.getRootNode && child.getRootNode(); // First, attempt with faster native method
241
242 if (parent.contains(child)) {
243 return true;
244 } // then fallback to custom implementation with Shadow DOM support
245 else if (rootNode && isShadowRoot(rootNode)) {
246 var next = child;
247
248 do {
249 if (next && parent.isSameNode(next)) {
250 return true;
251 } // $FlowFixMe[prop-missing]: need a better way to handle this...
252
253
254 next = next.parentNode || next.host;
255 } while (next);
256 } // Give up, the result is false
257
258
259 return false;
260}
261
262function getComputedStyle(element) {
263 return getWindow(element).getComputedStyle(element);
264}
265
266function isTableElement(element) {
267 return ['table', 'td', 'th'].indexOf(getNodeName(element)) >= 0;
268}
269
270function getDocumentElement(element) {
271 // $FlowFixMe[incompatible-return]: assume body is always available
272 return ((isElement(element) ? element.ownerDocument : // $FlowFixMe[prop-missing]
273 element.document) || window.document).documentElement;
274}
275
276function getParentNode(element) {
277 if (getNodeName(element) === 'html') {
278 return element;
279 }
280
281 return (// this is a quicker (but less type safe) way to save quite some bytes from the bundle
282 // $FlowFixMe[incompatible-return]
283 // $FlowFixMe[prop-missing]
284 element.assignedSlot || // step into the shadow DOM of the parent of a slotted node
285 element.parentNode || ( // DOM Element detected
286 isShadowRoot(element) ? element.host : null) || // ShadowRoot detected
287 // $FlowFixMe[incompatible-call]: HTMLElement is a Node
288 getDocumentElement(element) // fallback
289
290 );
291}
292
293function getTrueOffsetParent(element) {
294 if (!isHTMLElement(element) || // https://github.com/popperjs/popper-core/issues/837
295 getComputedStyle(element).position === 'fixed') {
296 return null;
297 }
298
299 return element.offsetParent;
300} // `.offsetParent` reports `null` for fixed elements, while absolute elements
301// return the containing block
302
303
304function getContainingBlock(element) {
305 var isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') !== -1;
306 var isIE = navigator.userAgent.indexOf('Trident') !== -1;
307
308 if (isIE && isHTMLElement(element)) {
309 // In IE 9, 10 and 11 fixed elements containing block is always established by the viewport
310 var elementCss = getComputedStyle(element);
311
312 if (elementCss.position === 'fixed') {
313 return null;
314 }
315 }
316
317 var currentNode = getParentNode(element);
318
319 while (isHTMLElement(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {
320 var css = getComputedStyle(currentNode); // This is non-exhaustive but covers the most common CSS properties that
321 // create a containing block.
322 // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
323
324 if (css.transform !== 'none' || css.perspective !== 'none' || css.contain === 'paint' || ['transform', 'perspective'].indexOf(css.willChange) !== -1 || isFirefox && css.willChange === 'filter' || isFirefox && css.filter && css.filter !== 'none') {
325 return currentNode;
326 } else {
327 currentNode = currentNode.parentNode;
328 }
329 }
330
331 return null;
332} // Gets the closest ancestor positioned element. Handles some edge cases,
333// such as table ancestors and cross browser bugs.
334
335
336function getOffsetParent(element) {
337 var window = getWindow(element);
338 var offsetParent = getTrueOffsetParent(element);
339
340 while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === 'static') {
341 offsetParent = getTrueOffsetParent(offsetParent);
342 }
343
344 if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle(offsetParent).position === 'static')) {
345 return window;
346 }
347
348 return offsetParent || getContainingBlock(element) || window;
349}
350
351function getMainAxisFromPlacement(placement) {
352 return ['top', 'bottom'].indexOf(placement) >= 0 ? 'x' : 'y';
353}
354
355function within(min$1, value, max$1) {
356 return max(min$1, min(value, max$1));
357}
358
359function withinMaxClamp(min, value, max) {
360 var v = within(min, value, max);
361 return v > max ? max : v;
362}
363
364function getFreshSideObject() {
365 return {
366 top: 0,
367 right: 0,
368 bottom: 0,
369 left: 0
370 };
371}
372
373function mergePaddingObject(paddingObject) {
374 return Object.assign({}, getFreshSideObject(), paddingObject);
375}
376
377function expandToHashMap(value, keys) {
378 return keys.reduce(function (hashMap, key) {
379 hashMap[key] = value;
380 return hashMap;
381 }, {});
382}
383
384var toPaddingObject = function toPaddingObject(padding, state) {
385 padding = typeof padding === 'function' ? padding(Object.assign({}, state.rects, {
386 placement: state.placement
387 })) : padding;
388 return mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, index.basePlacements));
389};
390
391function arrow(_ref) {
392 var _state$modifiersData$;
393
394 var state = _ref.state,
395 name = _ref.name,
396 options = _ref.options;
397 var arrowElement = state.elements.arrow;
398 var popperOffsets = state.modifiersData.popperOffsets;
399 var basePlacement = getBasePlacement(state.placement);
400 var axis = getMainAxisFromPlacement(basePlacement);
401 var isVertical = [index.left, index.right].indexOf(basePlacement) >= 0;
402 var len = isVertical ? 'height' : 'width';
403
404 if (!arrowElement || !popperOffsets) {
405 return;
406 }
407
408 var paddingObject = toPaddingObject(options.padding, state);
409 var arrowRect = getLayoutRect(arrowElement);
410 var minProp = axis === 'y' ? index.top : index.left;
411 var maxProp = axis === 'y' ? index.bottom : index.right;
412 var endDiff = state.rects.reference[len] + state.rects.reference[axis] - popperOffsets[axis] - state.rects.popper[len];
413 var startDiff = popperOffsets[axis] - state.rects.reference[axis];
414 var arrowOffsetParent = getOffsetParent(arrowElement);
415 var clientSize = arrowOffsetParent ? axis === 'y' ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;
416 var centerToReference = endDiff / 2 - startDiff / 2; // Make sure the arrow doesn't overflow the popper if the center point is
417 // outside of the popper bounds
418
419 var min = paddingObject[minProp];
420 var max = clientSize - arrowRect[len] - paddingObject[maxProp];
421 var center = clientSize / 2 - arrowRect[len] / 2 + centerToReference;
422 var offset = within(min, center, max); // Prevents breaking syntax highlighting...
423
424 var axisProp = axis;
425 state.modifiersData[name] = (_state$modifiersData$ = {}, _state$modifiersData$[axisProp] = offset, _state$modifiersData$.centerOffset = offset - center, _state$modifiersData$);
426}
427
428function effect$1(_ref2) {
429 var state = _ref2.state,
430 options = _ref2.options;
431 var _options$element = options.element,
432 arrowElement = _options$element === void 0 ? '[data-popper-arrow]' : _options$element;
433
434 if (arrowElement == null) {
435 return;
436 } // CSS selector
437
438
439 if (typeof arrowElement === 'string') {
440 arrowElement = state.elements.popper.querySelector(arrowElement);
441
442 if (!arrowElement) {
443 return;
444 }
445 }
446
447 if (process.env.NODE_ENV !== "production") {
448 if (!isHTMLElement(arrowElement)) {
449 console.error(['Popper: "arrow" element must be an HTMLElement (not an SVGElement).', 'To use an SVG arrow, wrap it in an HTMLElement that will be used as', 'the arrow.'].join(' '));
450 }
451 }
452
453 if (!contains(state.elements.popper, arrowElement)) {
454 if (process.env.NODE_ENV !== "production") {
455 console.error(['Popper: "arrow" modifier\'s `element` must be a child of the popper', 'element.'].join(' '));
456 }
457
458 return;
459 }
460
461 state.elements.arrow = arrowElement;
462} // eslint-disable-next-line import/no-unused-modules
463
464
465var arrow$1 = {
466 name: 'arrow',
467 enabled: true,
468 phase: 'main',
469 fn: arrow,
470 effect: effect$1,
471 requires: ['popperOffsets'],
472 requiresIfExists: ['preventOverflow']
473};
474
475function getVariation(placement) {
476 return placement.split('-')[1];
477}
478
479var unsetSides = {
480 top: 'auto',
481 right: 'auto',
482 bottom: 'auto',
483 left: 'auto'
484}; // Round the offsets to the nearest suitable subpixel based on the DPR.
485// Zooming can change the DPR, but it seems to report a value that will
486// cleanly divide the values into the appropriate subpixels.
487
488function roundOffsetsByDPR(_ref) {
489 var x = _ref.x,
490 y = _ref.y;
491 var win = window;
492 var dpr = win.devicePixelRatio || 1;
493 return {
494 x: round(x * dpr) / dpr || 0,
495 y: round(y * dpr) / dpr || 0
496 };
497}
498
499function mapToStyles(_ref2) {
500 var _Object$assign2;
501
502 var popper = _ref2.popper,
503 popperRect = _ref2.popperRect,
504 placement = _ref2.placement,
505 variation = _ref2.variation,
506 offsets = _ref2.offsets,
507 position = _ref2.position,
508 gpuAcceleration = _ref2.gpuAcceleration,
509 adaptive = _ref2.adaptive,
510 roundOffsets = _ref2.roundOffsets,
511 isFixed = _ref2.isFixed;
512 var _offsets$x = offsets.x,
513 x = _offsets$x === void 0 ? 0 : _offsets$x,
514 _offsets$y = offsets.y,
515 y = _offsets$y === void 0 ? 0 : _offsets$y;
516
517 var _ref3 = typeof roundOffsets === 'function' ? roundOffsets({
518 x: x,
519 y: y
520 }) : {
521 x: x,
522 y: y
523 };
524
525 x = _ref3.x;
526 y = _ref3.y;
527 var hasX = offsets.hasOwnProperty('x');
528 var hasY = offsets.hasOwnProperty('y');
529 var sideX = index.left;
530 var sideY = index.top;
531 var win = window;
532
533 if (adaptive) {
534 var offsetParent = getOffsetParent(popper);
535 var heightProp = 'clientHeight';
536 var widthProp = 'clientWidth';
537
538 if (offsetParent === getWindow(popper)) {
539 offsetParent = getDocumentElement(popper);
540
541 if (getComputedStyle(offsetParent).position !== 'static' && position === 'absolute') {
542 heightProp = 'scrollHeight';
543 widthProp = 'scrollWidth';
544 }
545 } // $FlowFixMe[incompatible-cast]: force type refinement, we compare offsetParent with window above, but Flow doesn't detect it
546
547
548 offsetParent = offsetParent;
549
550 if (placement === index.top || (placement === index.left || placement === index.right) && variation === index.end) {
551 sideY = index.bottom;
552 var offsetY = isFixed && win.visualViewport ? win.visualViewport.height : // $FlowFixMe[prop-missing]
553 offsetParent[heightProp];
554 y -= offsetY - popperRect.height;
555 y *= gpuAcceleration ? 1 : -1;
556 }
557
558 if (placement === index.left || (placement === index.top || placement === index.bottom) && variation === index.end) {
559 sideX = index.right;
560 var offsetX = isFixed && win.visualViewport ? win.visualViewport.width : // $FlowFixMe[prop-missing]
561 offsetParent[widthProp];
562 x -= offsetX - popperRect.width;
563 x *= gpuAcceleration ? 1 : -1;
564 }
565 }
566
567 var commonStyles = Object.assign({
568 position: position
569 }, adaptive && unsetSides);
570
571 var _ref4 = roundOffsets === true ? roundOffsetsByDPR({
572 x: x,
573 y: y
574 }) : {
575 x: x,
576 y: y
577 };
578
579 x = _ref4.x;
580 y = _ref4.y;
581
582 if (gpuAcceleration) {
583 var _Object$assign;
584
585 return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? '0' : '', _Object$assign[sideX] = hasX ? '0' : '', _Object$assign.transform = (win.devicePixelRatio || 1) <= 1 ? "translate(" + x + "px, " + y + "px)" : "translate3d(" + x + "px, " + y + "px, 0)", _Object$assign));
586 }
587
588 return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : '', _Object$assign2[sideX] = hasX ? x + "px" : '', _Object$assign2.transform = '', _Object$assign2));
589}
590
591function computeStyles(_ref5) {
592 var state = _ref5.state,
593 options = _ref5.options;
594 var _options$gpuAccelerat = options.gpuAcceleration,
595 gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat,
596 _options$adaptive = options.adaptive,
597 adaptive = _options$adaptive === void 0 ? true : _options$adaptive,
598 _options$roundOffsets = options.roundOffsets,
599 roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;
600
601 if (process.env.NODE_ENV !== "production") {
602 var transitionProperty = getComputedStyle(state.elements.popper).transitionProperty || '';
603
604 if (adaptive && ['transform', 'top', 'right', 'bottom', 'left'].some(function (property) {
605 return transitionProperty.indexOf(property) >= 0;
606 })) {
607 console.warn(['Popper: Detected CSS transitions on at least one of the following', 'CSS properties: "transform", "top", "right", "bottom", "left".', '\n\n', 'Disable the "computeStyles" modifier\'s `adaptive` option to allow', 'for smooth transitions, or remove these properties from the CSS', 'transition declaration on the popper element if only transitioning', 'opacity or background-color for example.', '\n\n', 'We recommend using the popper element as a wrapper around an inner', 'element that can have any CSS property transitioned for animations.'].join(' '));
608 }
609 }
610
611 var commonStyles = {
612 placement: getBasePlacement(state.placement),
613 variation: getVariation(state.placement),
614 popper: state.elements.popper,
615 popperRect: state.rects.popper,
616 gpuAcceleration: gpuAcceleration,
617 isFixed: state.options.strategy === 'fixed'
618 };
619
620 if (state.modifiersData.popperOffsets != null) {
621 state.styles.popper = Object.assign({}, state.styles.popper, mapToStyles(Object.assign({}, commonStyles, {
622 offsets: state.modifiersData.popperOffsets,
623 position: state.options.strategy,
624 adaptive: adaptive,
625 roundOffsets: roundOffsets
626 })));
627 }
628
629 if (state.modifiersData.arrow != null) {
630 state.styles.arrow = Object.assign({}, state.styles.arrow, mapToStyles(Object.assign({}, commonStyles, {
631 offsets: state.modifiersData.arrow,
632 position: 'absolute',
633 adaptive: false,
634 roundOffsets: roundOffsets
635 })));
636 }
637
638 state.attributes.popper = Object.assign({}, state.attributes.popper, {
639 'data-popper-placement': state.placement
640 });
641} // eslint-disable-next-line import/no-unused-modules
642
643
644var computeStyles$1 = {
645 name: 'computeStyles',
646 enabled: true,
647 phase: 'beforeWrite',
648 fn: computeStyles,
649 data: {}
650};
651var passive = {
652 passive: true
653};
654
655function effect(_ref) {
656 var state = _ref.state,
657 instance = _ref.instance,
658 options = _ref.options;
659 var _options$scroll = options.scroll,
660 scroll = _options$scroll === void 0 ? true : _options$scroll,
661 _options$resize = options.resize,
662 resize = _options$resize === void 0 ? true : _options$resize;
663 var window = getWindow(state.elements.popper);
664 var scrollParents = [].concat(state.scrollParents.reference, state.scrollParents.popper);
665
666 if (scroll) {
667 scrollParents.forEach(function (scrollParent) {
668 scrollParent.addEventListener('scroll', instance.update, passive);
669 });
670 }
671
672 if (resize) {
673 window.addEventListener('resize', instance.update, passive);
674 }
675
676 return function () {
677 if (scroll) {
678 scrollParents.forEach(function (scrollParent) {
679 scrollParent.removeEventListener('scroll', instance.update, passive);
680 });
681 }
682
683 if (resize) {
684 window.removeEventListener('resize', instance.update, passive);
685 }
686 };
687} // eslint-disable-next-line import/no-unused-modules
688
689
690var eventListeners = {
691 name: 'eventListeners',
692 enabled: true,
693 phase: 'write',
694 fn: function fn() {},
695 effect: effect,
696 data: {}
697};
698var hash$1 = {
699 left: 'right',
700 right: 'left',
701 bottom: 'top',
702 top: 'bottom'
703};
704
705function getOppositePlacement(placement) {
706 return placement.replace(/left|right|bottom|top/g, function (matched) {
707 return hash$1[matched];
708 });
709}
710
711var hash = {
712 start: 'end',
713 end: 'start'
714};
715
716function getOppositeVariationPlacement(placement) {
717 return placement.replace(/start|end/g, function (matched) {
718 return hash[matched];
719 });
720}
721
722function getWindowScroll(node) {
723 var win = getWindow(node);
724 var scrollLeft = win.pageXOffset;
725 var scrollTop = win.pageYOffset;
726 return {
727 scrollLeft: scrollLeft,
728 scrollTop: scrollTop
729 };
730}
731
732function getWindowScrollBarX(element) {
733 // If <html> has a CSS width greater than the viewport, then this will be
734 // incorrect for RTL.
735 // Popper 1 is broken in this case and never had a bug report so let's assume
736 // it's not an issue. I don't think anyone ever specifies width on <html>
737 // anyway.
738 // Browsers where the left scrollbar doesn't cause an issue report `0` for
739 // this (e.g. Edge 2019, IE11, Safari)
740 return getBoundingClientRect(getDocumentElement(element)).left + getWindowScroll(element).scrollLeft;
741}
742
743function getViewportRect(element) {
744 var win = getWindow(element);
745 var html = getDocumentElement(element);
746 var visualViewport = win.visualViewport;
747 var width = html.clientWidth;
748 var height = html.clientHeight;
749 var x = 0;
750 var y = 0; // NB: This isn't supported on iOS <= 12. If the keyboard is open, the popper
751 // can be obscured underneath it.
752 // Also, `html.clientHeight` adds the bottom bar height in Safari iOS, even
753 // if it isn't open, so if this isn't available, the popper will be detected
754 // to overflow the bottom of the screen too early.
755
756 if (visualViewport) {
757 width = visualViewport.width;
758 height = visualViewport.height; // Uses Layout Viewport (like Chrome; Safari does not currently)
759 // In Chrome, it returns a value very close to 0 (+/-) but contains rounding
760 // errors due to floating point numbers, so we need to check precision.
761 // Safari returns a number <= 0, usually < -1 when pinch-zoomed
762 // Feature detection fails in mobile emulation mode in Chrome.
763 // Math.abs(win.innerWidth / visualViewport.scale - visualViewport.width) <
764 // 0.001
765 // Fallback here: "Not Safari" userAgent
766
767 if (!/^((?!chrome|android).)*safari/i.test(navigator.userAgent)) {
768 x = visualViewport.offsetLeft;
769 y = visualViewport.offsetTop;
770 }
771 }
772
773 return {
774 width: width,
775 height: height,
776 x: x + getWindowScrollBarX(element),
777 y: y
778 };
779} // of the `<html>` and `<body>` rect bounds if horizontally scrollable
780
781
782function getDocumentRect(element) {
783 var _element$ownerDocumen;
784
785 var html = getDocumentElement(element);
786 var winScroll = getWindowScroll(element);
787 var body = (_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body;
788 var width = max(html.scrollWidth, html.clientWidth, body ? body.scrollWidth : 0, body ? body.clientWidth : 0);
789 var height = max(html.scrollHeight, html.clientHeight, body ? body.scrollHeight : 0, body ? body.clientHeight : 0);
790 var x = -winScroll.scrollLeft + getWindowScrollBarX(element);
791 var y = -winScroll.scrollTop;
792
793 if (getComputedStyle(body || html).direction === 'rtl') {
794 x += max(html.clientWidth, body ? body.clientWidth : 0) - width;
795 }
796
797 return {
798 width: width,
799 height: height,
800 x: x,
801 y: y
802 };
803}
804
805function isScrollParent(element) {
806 // Firefox wants us to check `-x` and `-y` variations as well
807 var _getComputedStyle = getComputedStyle(element),
808 overflow = _getComputedStyle.overflow,
809 overflowX = _getComputedStyle.overflowX,
810 overflowY = _getComputedStyle.overflowY;
811
812 return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
813}
814
815function getScrollParent(node) {
816 if (['html', 'body', '#document'].indexOf(getNodeName(node)) >= 0) {
817 // $FlowFixMe[incompatible-return]: assume body is always available
818 return node.ownerDocument.body;
819 }
820
821 if (isHTMLElement(node) && isScrollParent(node)) {
822 return node;
823 }
824
825 return getScrollParent(getParentNode(node));
826}
827/*
828given a DOM element, return the list of all scroll parents, up the list of ancesors
829until we get to the top window object. This list is what we attach scroll listeners
830to, because if any of these parent elements scroll, we'll need to re-calculate the
831reference element's position.
832*/
833
834
835function listScrollParents(element, list) {
836 var _element$ownerDocumen;
837
838 if (list === void 0) {
839 list = [];
840 }
841
842 var scrollParent = getScrollParent(element);
843 var isBody = scrollParent === ((_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body);
844 var win = getWindow(scrollParent);
845 var target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;
846 var updatedList = list.concat(target);
847 return isBody ? updatedList : // $FlowFixMe[incompatible-call]: isBody tells us target will be an HTMLElement here
848 updatedList.concat(listScrollParents(getParentNode(target)));
849}
850
851function rectToClientRect(rect) {
852 return Object.assign({}, rect, {
853 left: rect.x,
854 top: rect.y,
855 right: rect.x + rect.width,
856 bottom: rect.y + rect.height
857 });
858}
859
860function getInnerBoundingClientRect(element) {
861 var rect = getBoundingClientRect(element);
862 rect.top = rect.top + element.clientTop;
863 rect.left = rect.left + element.clientLeft;
864 rect.bottom = rect.top + element.clientHeight;
865 rect.right = rect.left + element.clientWidth;
866 rect.width = element.clientWidth;
867 rect.height = element.clientHeight;
868 rect.x = rect.left;
869 rect.y = rect.top;
870 return rect;
871}
872
873function getClientRectFromMixedType(element, clippingParent) {
874 return clippingParent === index.viewport ? rectToClientRect(getViewportRect(element)) : isElement(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
875} // A "clipping parent" is an overflowable container with the characteristic of
876// clipping (or hiding) overflowing elements with a position different from
877// `initial`
878
879
880function getClippingParents(element) {
881 var clippingParents = listScrollParents(getParentNode(element));
882 var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle(element).position) >= 0;
883 var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;
884
885 if (!isElement(clipperElement)) {
886 return [];
887 } // $FlowFixMe[incompatible-return]: https://github.com/facebook/flow/issues/1414
888
889
890 return clippingParents.filter(function (clippingParent) {
891 return isElement(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== 'body';
892 });
893} // Gets the maximum area that the element is visible in due to any number of
894// clipping parents
895
896
897function getClippingRect(element, boundary, rootBoundary) {
898 var mainClippingParents = boundary === 'clippingParents' ? getClippingParents(element) : [].concat(boundary);
899 var clippingParents = [].concat(mainClippingParents, [rootBoundary]);
900 var firstClippingParent = clippingParents[0];
901 var clippingRect = clippingParents.reduce(function (accRect, clippingParent) {
902 var rect = getClientRectFromMixedType(element, clippingParent);
903 accRect.top = max(rect.top, accRect.top);
904 accRect.right = min(rect.right, accRect.right);
905 accRect.bottom = min(rect.bottom, accRect.bottom);
906 accRect.left = max(rect.left, accRect.left);
907 return accRect;
908 }, getClientRectFromMixedType(element, firstClippingParent));
909 clippingRect.width = clippingRect.right - clippingRect.left;
910 clippingRect.height = clippingRect.bottom - clippingRect.top;
911 clippingRect.x = clippingRect.left;
912 clippingRect.y = clippingRect.top;
913 return clippingRect;
914}
915
916function computeOffsets(_ref) {
917 var reference = _ref.reference,
918 element = _ref.element,
919 placement = _ref.placement;
920 var basePlacement = placement ? getBasePlacement(placement) : null;
921 var variation = placement ? getVariation(placement) : null;
922 var commonX = reference.x + reference.width / 2 - element.width / 2;
923 var commonY = reference.y + reference.height / 2 - element.height / 2;
924 var offsets;
925
926 switch (basePlacement) {
927 case index.top:
928 offsets = {
929 x: commonX,
930 y: reference.y - element.height
931 };
932 break;
933
934 case index.bottom:
935 offsets = {
936 x: commonX,
937 y: reference.y + reference.height
938 };
939 break;
940
941 case index.right:
942 offsets = {
943 x: reference.x + reference.width,
944 y: commonY
945 };
946 break;
947
948 case index.left:
949 offsets = {
950 x: reference.x - element.width,
951 y: commonY
952 };
953 break;
954
955 default:
956 offsets = {
957 x: reference.x,
958 y: reference.y
959 };
960 }
961
962 var mainAxis = basePlacement ? getMainAxisFromPlacement(basePlacement) : null;
963
964 if (mainAxis != null) {
965 var len = mainAxis === 'y' ? 'height' : 'width';
966
967 switch (variation) {
968 case index.start:
969 offsets[mainAxis] = offsets[mainAxis] - (reference[len] / 2 - element[len] / 2);
970 break;
971
972 case index.end:
973 offsets[mainAxis] = offsets[mainAxis] + (reference[len] / 2 - element[len] / 2);
974 break;
975 }
976 }
977
978 return offsets;
979}
980
981function detectOverflow(state, options) {
982 if (options === void 0) {
983 options = {};
984 }
985
986 var _options = options,
987 _options$placement = _options.placement,
988 placement = _options$placement === void 0 ? state.placement : _options$placement,
989 _options$boundary = _options.boundary,
990 boundary = _options$boundary === void 0 ? index.clippingParents : _options$boundary,
991 _options$rootBoundary = _options.rootBoundary,
992 rootBoundary = _options$rootBoundary === void 0 ? index.viewport : _options$rootBoundary,
993 _options$elementConte = _options.elementContext,
994 elementContext = _options$elementConte === void 0 ? index.popper : _options$elementConte,
995 _options$altBoundary = _options.altBoundary,
996 altBoundary = _options$altBoundary === void 0 ? false : _options$altBoundary,
997 _options$padding = _options.padding,
998 padding = _options$padding === void 0 ? 0 : _options$padding;
999 var paddingObject = mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, index.basePlacements));
1000 var altContext = elementContext === index.popper ? index.reference : index.popper;
1001 var popperRect = state.rects.popper;
1002 var element = state.elements[altBoundary ? altContext : elementContext];
1003 var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary);
1004 var referenceClientRect = getBoundingClientRect(state.elements.reference);
1005 var popperOffsets = computeOffsets({
1006 reference: referenceClientRect,
1007 element: popperRect,
1008 strategy: 'absolute',
1009 placement: placement
1010 });
1011 var popperClientRect = rectToClientRect(Object.assign({}, popperRect, popperOffsets));
1012 var elementClientRect = elementContext === index.popper ? popperClientRect : referenceClientRect; // positive = overflowing the clipping rect
1013 // 0 or negative = within the clipping rect
1014
1015 var overflowOffsets = {
1016 top: clippingClientRect.top - elementClientRect.top + paddingObject.top,
1017 bottom: elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,
1018 left: clippingClientRect.left - elementClientRect.left + paddingObject.left,
1019 right: elementClientRect.right - clippingClientRect.right + paddingObject.right
1020 };
1021 var offsetData = state.modifiersData.offset; // Offsets can be applied only to the popper element
1022
1023 if (elementContext === index.popper && offsetData) {
1024 var offset = offsetData[placement];
1025 Object.keys(overflowOffsets).forEach(function (key) {
1026 var multiply = [index.right, index.bottom].indexOf(key) >= 0 ? 1 : -1;
1027 var axis = [index.top, index.bottom].indexOf(key) >= 0 ? 'y' : 'x';
1028 overflowOffsets[key] += offset[axis] * multiply;
1029 });
1030 }
1031
1032 return overflowOffsets;
1033}
1034
1035function computeAutoPlacement(state, options) {
1036 if (options === void 0) {
1037 options = {};
1038 }
1039
1040 var _options = options,
1041 placement = _options.placement,
1042 boundary = _options.boundary,
1043 rootBoundary = _options.rootBoundary,
1044 padding = _options.padding,
1045 flipVariations = _options.flipVariations,
1046 _options$allowedAutoP = _options.allowedAutoPlacements,
1047 allowedAutoPlacements = _options$allowedAutoP === void 0 ? index.placements : _options$allowedAutoP;
1048 var variation = getVariation(placement);
1049 var placements = variation ? flipVariations ? index.variationPlacements : index.variationPlacements.filter(function (placement) {
1050 return getVariation(placement) === variation;
1051 }) : index.basePlacements;
1052 var allowedPlacements = placements.filter(function (placement) {
1053 return allowedAutoPlacements.indexOf(placement) >= 0;
1054 });
1055
1056 if (allowedPlacements.length === 0) {
1057 allowedPlacements = placements;
1058
1059 if (process.env.NODE_ENV !== "production") {
1060 console.error(['Popper: The `allowedAutoPlacements` option did not allow any', 'placements. Ensure the `placement` option matches the variation', 'of the allowed placements.', 'For example, "auto" cannot be used to allow "bottom-start".', 'Use "auto-start" instead.'].join(' '));
1061 }
1062 } // $FlowFixMe[incompatible-type]: Flow seems to have problems with two array unions...
1063
1064
1065 var overflows = allowedPlacements.reduce(function (acc, placement) {
1066 acc[placement] = detectOverflow(state, {
1067 placement: placement,
1068 boundary: boundary,
1069 rootBoundary: rootBoundary,
1070 padding: padding
1071 })[getBasePlacement(placement)];
1072 return acc;
1073 }, {});
1074 return Object.keys(overflows).sort(function (a, b) {
1075 return overflows[a] - overflows[b];
1076 });
1077}
1078
1079function getExpandedFallbackPlacements(placement) {
1080 if (getBasePlacement(placement) === index.auto) {
1081 return [];
1082 }
1083
1084 var oppositePlacement = getOppositePlacement(placement);
1085 return [getOppositeVariationPlacement(placement), oppositePlacement, getOppositeVariationPlacement(oppositePlacement)];
1086}
1087
1088function flip(_ref) {
1089 var state = _ref.state,
1090 options = _ref.options,
1091 name = _ref.name;
1092
1093 if (state.modifiersData[name]._skip) {
1094 return;
1095 }
1096
1097 var _options$mainAxis = options.mainAxis,
1098 checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,
1099 _options$altAxis = options.altAxis,
1100 checkAltAxis = _options$altAxis === void 0 ? true : _options$altAxis,
1101 specifiedFallbackPlacements = options.fallbackPlacements,
1102 padding = options.padding,
1103 boundary = options.boundary,
1104 rootBoundary = options.rootBoundary,
1105 altBoundary = options.altBoundary,
1106 _options$flipVariatio = options.flipVariations,
1107 flipVariations = _options$flipVariatio === void 0 ? true : _options$flipVariatio,
1108 allowedAutoPlacements = options.allowedAutoPlacements;
1109 var preferredPlacement = state.options.placement;
1110 var basePlacement = getBasePlacement(preferredPlacement);
1111 var isBasePlacement = basePlacement === preferredPlacement;
1112 var fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipVariations ? [getOppositePlacement(preferredPlacement)] : getExpandedFallbackPlacements(preferredPlacement));
1113 var placements = [preferredPlacement].concat(fallbackPlacements).reduce(function (acc, placement) {
1114 return acc.concat(getBasePlacement(placement) === index.auto ? computeAutoPlacement(state, {
1115 placement: placement,
1116 boundary: boundary,
1117 rootBoundary: rootBoundary,
1118 padding: padding,
1119 flipVariations: flipVariations,
1120 allowedAutoPlacements: allowedAutoPlacements
1121 }) : placement);
1122 }, []);
1123 var referenceRect = state.rects.reference;
1124 var popperRect = state.rects.popper;
1125 var checksMap = new Map();
1126 var makeFallbackChecks = true;
1127 var firstFittingPlacement = placements[0];
1128
1129 for (var i = 0; i < placements.length; i++) {
1130 var placement = placements[i];
1131
1132 var _basePlacement = getBasePlacement(placement);
1133
1134 var isStartVariation = getVariation(placement) === index.start;
1135 var isVertical = [index.top, index.bottom].indexOf(_basePlacement) >= 0;
1136 var len = isVertical ? 'width' : 'height';
1137 var overflow = detectOverflow(state, {
1138 placement: placement,
1139 boundary: boundary,
1140 rootBoundary: rootBoundary,
1141 altBoundary: altBoundary,
1142 padding: padding
1143 });
1144 var mainVariationSide = isVertical ? isStartVariation ? index.right : index.left : isStartVariation ? index.bottom : index.top;
1145
1146 if (referenceRect[len] > popperRect[len]) {
1147 mainVariationSide = getOppositePlacement(mainVariationSide);
1148 }
1149
1150 var altVariationSide = getOppositePlacement(mainVariationSide);
1151 var checks = [];
1152
1153 if (checkMainAxis) {
1154 checks.push(overflow[_basePlacement] <= 0);
1155 }
1156
1157 if (checkAltAxis) {
1158 checks.push(overflow[mainVariationSide] <= 0, overflow[altVariationSide] <= 0);
1159 }
1160
1161 if (checks.every(function (check) {
1162 return check;
1163 })) {
1164 firstFittingPlacement = placement;
1165 makeFallbackChecks = false;
1166 break;
1167 }
1168
1169 checksMap.set(placement, checks);
1170 }
1171
1172 if (makeFallbackChecks) {
1173 // `2` may be desired in some cases – research later
1174 var numberOfChecks = flipVariations ? 3 : 1;
1175
1176 var _loop = function _loop(_i) {
1177 var fittingPlacement = placements.find(function (placement) {
1178 var checks = checksMap.get(placement);
1179
1180 if (checks) {
1181 return checks.slice(0, _i).every(function (check) {
1182 return check;
1183 });
1184 }
1185 });
1186
1187 if (fittingPlacement) {
1188 firstFittingPlacement = fittingPlacement;
1189 return "break";
1190 }
1191 };
1192
1193 for (var _i = numberOfChecks; _i > 0; _i--) {
1194 var _ret = _loop(_i);
1195
1196 if (_ret === "break") break;
1197 }
1198 }
1199
1200 if (state.placement !== firstFittingPlacement) {
1201 state.modifiersData[name]._skip = true;
1202 state.placement = firstFittingPlacement;
1203 state.reset = true;
1204 }
1205} // eslint-disable-next-line import/no-unused-modules
1206
1207
1208var flip$1 = {
1209 name: 'flip',
1210 enabled: true,
1211 phase: 'main',
1212 fn: flip,
1213 requiresIfExists: ['offset'],
1214 data: {
1215 _skip: false
1216 }
1217};
1218
1219function getSideOffsets(overflow, rect, preventedOffsets) {
1220 if (preventedOffsets === void 0) {
1221 preventedOffsets = {
1222 x: 0,
1223 y: 0
1224 };
1225 }
1226
1227 return {
1228 top: overflow.top - rect.height - preventedOffsets.y,
1229 right: overflow.right - rect.width + preventedOffsets.x,
1230 bottom: overflow.bottom - rect.height + preventedOffsets.y,
1231 left: overflow.left - rect.width - preventedOffsets.x
1232 };
1233}
1234
1235function isAnySideFullyClipped(overflow) {
1236 return [index.top, index.right, index.bottom, index.left].some(function (side) {
1237 return overflow[side] >= 0;
1238 });
1239}
1240
1241function hide(_ref) {
1242 var state = _ref.state,
1243 name = _ref.name;
1244 var referenceRect = state.rects.reference;
1245 var popperRect = state.rects.popper;
1246 var preventedOffsets = state.modifiersData.preventOverflow;
1247 var referenceOverflow = detectOverflow(state, {
1248 elementContext: 'reference'
1249 });
1250 var popperAltOverflow = detectOverflow(state, {
1251 altBoundary: true
1252 });
1253 var referenceClippingOffsets = getSideOffsets(referenceOverflow, referenceRect);
1254 var popperEscapeOffsets = getSideOffsets(popperAltOverflow, popperRect, preventedOffsets);
1255 var isReferenceHidden = isAnySideFullyClipped(referenceClippingOffsets);
1256 var hasPopperEscaped = isAnySideFullyClipped(popperEscapeOffsets);
1257 state.modifiersData[name] = {
1258 referenceClippingOffsets: referenceClippingOffsets,
1259 popperEscapeOffsets: popperEscapeOffsets,
1260 isReferenceHidden: isReferenceHidden,
1261 hasPopperEscaped: hasPopperEscaped
1262 };
1263 state.attributes.popper = Object.assign({}, state.attributes.popper, {
1264 'data-popper-reference-hidden': isReferenceHidden,
1265 'data-popper-escaped': hasPopperEscaped
1266 });
1267} // eslint-disable-next-line import/no-unused-modules
1268
1269
1270var hide$1 = {
1271 name: 'hide',
1272 enabled: true,
1273 phase: 'main',
1274 requiresIfExists: ['preventOverflow'],
1275 fn: hide
1276};
1277
1278function distanceAndSkiddingToXY(placement, rects, offset) {
1279 var basePlacement = getBasePlacement(placement);
1280 var invertDistance = [index.left, index.top].indexOf(basePlacement) >= 0 ? -1 : 1;
1281
1282 var _ref = typeof offset === 'function' ? offset(Object.assign({}, rects, {
1283 placement: placement
1284 })) : offset,
1285 skidding = _ref[0],
1286 distance = _ref[1];
1287
1288 skidding = skidding || 0;
1289 distance = (distance || 0) * invertDistance;
1290 return [index.left, index.right].indexOf(basePlacement) >= 0 ? {
1291 x: distance,
1292 y: skidding
1293 } : {
1294 x: skidding,
1295 y: distance
1296 };
1297}
1298
1299function offset(_ref2) {
1300 var state = _ref2.state,
1301 options = _ref2.options,
1302 name = _ref2.name;
1303 var _options$offset = options.offset,
1304 offset = _options$offset === void 0 ? [0, 0] : _options$offset;
1305 var data = index.placements.reduce(function (acc, placement) {
1306 acc[placement] = distanceAndSkiddingToXY(placement, state.rects, offset);
1307 return acc;
1308 }, {});
1309 var _data$state$placement = data[state.placement],
1310 x = _data$state$placement.x,
1311 y = _data$state$placement.y;
1312
1313 if (state.modifiersData.popperOffsets != null) {
1314 state.modifiersData.popperOffsets.x += x;
1315 state.modifiersData.popperOffsets.y += y;
1316 }
1317
1318 state.modifiersData[name] = data;
1319} // eslint-disable-next-line import/no-unused-modules
1320
1321
1322var offset$1 = {
1323 name: 'offset',
1324 enabled: true,
1325 phase: 'main',
1326 requires: ['popperOffsets'],
1327 fn: offset
1328};
1329
1330function popperOffsets(_ref) {
1331 var state = _ref.state,
1332 name = _ref.name; // Offsets are the actual position the popper needs to have to be
1333 // properly positioned near its reference element
1334 // This is the most basic placement, and will be adjusted by
1335 // the modifiers in the next step
1336
1337 state.modifiersData[name] = computeOffsets({
1338 reference: state.rects.reference,
1339 element: state.rects.popper,
1340 strategy: 'absolute',
1341 placement: state.placement
1342 });
1343} // eslint-disable-next-line import/no-unused-modules
1344
1345
1346var popperOffsets$1 = {
1347 name: 'popperOffsets',
1348 enabled: true,
1349 phase: 'read',
1350 fn: popperOffsets,
1351 data: {}
1352};
1353
1354function getAltAxis(axis) {
1355 return axis === 'x' ? 'y' : 'x';
1356}
1357
1358function preventOverflow(_ref) {
1359 var state = _ref.state,
1360 options = _ref.options,
1361 name = _ref.name;
1362 var _options$mainAxis = options.mainAxis,
1363 checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,
1364 _options$altAxis = options.altAxis,
1365 checkAltAxis = _options$altAxis === void 0 ? false : _options$altAxis,
1366 boundary = options.boundary,
1367 rootBoundary = options.rootBoundary,
1368 altBoundary = options.altBoundary,
1369 padding = options.padding,
1370 _options$tether = options.tether,
1371 tether = _options$tether === void 0 ? true : _options$tether,
1372 _options$tetherOffset = options.tetherOffset,
1373 tetherOffset = _options$tetherOffset === void 0 ? 0 : _options$tetherOffset;
1374 var overflow = detectOverflow(state, {
1375 boundary: boundary,
1376 rootBoundary: rootBoundary,
1377 padding: padding,
1378 altBoundary: altBoundary
1379 });
1380 var basePlacement = getBasePlacement(state.placement);
1381 var variation = getVariation(state.placement);
1382 var isBasePlacement = !variation;
1383 var mainAxis = getMainAxisFromPlacement(basePlacement);
1384 var altAxis = getAltAxis(mainAxis);
1385 var popperOffsets = state.modifiersData.popperOffsets;
1386 var referenceRect = state.rects.reference;
1387 var popperRect = state.rects.popper;
1388 var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {
1389 placement: state.placement
1390 })) : tetherOffset;
1391 var normalizedTetherOffsetValue = typeof tetherOffsetValue === 'number' ? {
1392 mainAxis: tetherOffsetValue,
1393 altAxis: tetherOffsetValue
1394 } : Object.assign({
1395 mainAxis: 0,
1396 altAxis: 0
1397 }, tetherOffsetValue);
1398 var offsetModifierState = state.modifiersData.offset ? state.modifiersData.offset[state.placement] : null;
1399 var data = {
1400 x: 0,
1401 y: 0
1402 };
1403
1404 if (!popperOffsets) {
1405 return;
1406 }
1407
1408 if (checkMainAxis) {
1409 var _offsetModifierState$;
1410
1411 var mainSide = mainAxis === 'y' ? index.top : index.left;
1412 var altSide = mainAxis === 'y' ? index.bottom : index.right;
1413 var len = mainAxis === 'y' ? 'height' : 'width';
1414 var offset = popperOffsets[mainAxis];
1415 var min$1 = offset + overflow[mainSide];
1416 var max$1 = offset - overflow[altSide];
1417 var additive = tether ? -popperRect[len] / 2 : 0;
1418 var minLen = variation === index.start ? referenceRect[len] : popperRect[len];
1419 var maxLen = variation === index.start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go
1420 // outside the reference bounds
1421
1422 var arrowElement = state.elements.arrow;
1423 var arrowRect = tether && arrowElement ? getLayoutRect(arrowElement) : {
1424 width: 0,
1425 height: 0
1426 };
1427 var arrowPaddingObject = state.modifiersData['arrow#persistent'] ? state.modifiersData['arrow#persistent'].padding : getFreshSideObject();
1428 var arrowPaddingMin = arrowPaddingObject[mainSide];
1429 var arrowPaddingMax = arrowPaddingObject[altSide]; // If the reference length is smaller than the arrow length, we don't want
1430 // to include its full size in the calculation. If the reference is small
1431 // and near the edge of a boundary, the popper can overflow even if the
1432 // reference is not overflowing as well (e.g. virtual elements with no
1433 // width or height)
1434
1435 var arrowLen = within(0, referenceRect[len], arrowRect[len]);
1436 var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis : minLen - arrowLen - arrowPaddingMin - normalizedTetherOffsetValue.mainAxis;
1437 var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis : maxLen + arrowLen + arrowPaddingMax + normalizedTetherOffsetValue.mainAxis;
1438 var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
1439 var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
1440 var offsetModifierValue = (_offsetModifierState$ = offsetModifierState == null ? void 0 : offsetModifierState[mainAxis]) != null ? _offsetModifierState$ : 0;
1441 var tetherMin = offset + minOffset - offsetModifierValue - clientOffset;
1442 var tetherMax = offset + maxOffset - offsetModifierValue;
1443 var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset, tether ? max(max$1, tetherMax) : max$1);
1444 popperOffsets[mainAxis] = preventedOffset;
1445 data[mainAxis] = preventedOffset - offset;
1446 }
1447
1448 if (checkAltAxis) {
1449 var _offsetModifierState$2;
1450
1451 var _mainSide = mainAxis === 'x' ? index.top : index.left;
1452
1453 var _altSide = mainAxis === 'x' ? index.bottom : index.right;
1454
1455 var _offset = popperOffsets[altAxis];
1456
1457 var _len = altAxis === 'y' ? 'height' : 'width';
1458
1459 var _min = _offset + overflow[_mainSide];
1460
1461 var _max = _offset - overflow[_altSide];
1462
1463 var isOriginSide = [index.top, index.left].indexOf(basePlacement) !== -1;
1464
1465 var _offsetModifierValue = (_offsetModifierState$2 = offsetModifierState == null ? void 0 : offsetModifierState[altAxis]) != null ? _offsetModifierState$2 : 0;
1466
1467 var _tetherMin = isOriginSide ? _min : _offset - referenceRect[_len] - popperRect[_len] - _offsetModifierValue + normalizedTetherOffsetValue.altAxis;
1468
1469 var _tetherMax = isOriginSide ? _offset + referenceRect[_len] + popperRect[_len] - _offsetModifierValue - normalizedTetherOffsetValue.altAxis : _max;
1470
1471 var _preventedOffset = tether && isOriginSide ? withinMaxClamp(_tetherMin, _offset, _tetherMax) : within(tether ? _tetherMin : _min, _offset, tether ? _tetherMax : _max);
1472
1473 popperOffsets[altAxis] = _preventedOffset;
1474 data[altAxis] = _preventedOffset - _offset;
1475 }
1476
1477 state.modifiersData[name] = data;
1478} // eslint-disable-next-line import/no-unused-modules
1479
1480
1481var preventOverflow$1 = {
1482 name: 'preventOverflow',
1483 enabled: true,
1484 phase: 'main',
1485 fn: preventOverflow,
1486 requiresIfExists: ['offset']
1487};
1488
1489function getHTMLElementScroll(element) {
1490 return {
1491 scrollLeft: element.scrollLeft,
1492 scrollTop: element.scrollTop
1493 };
1494}
1495
1496function getNodeScroll(node) {
1497 if (node === getWindow(node) || !isHTMLElement(node)) {
1498 return getWindowScroll(node);
1499 } else {
1500 return getHTMLElementScroll(node);
1501 }
1502}
1503
1504function isElementScaled(element) {
1505 var rect = element.getBoundingClientRect();
1506 var scaleX = round(rect.width) / element.offsetWidth || 1;
1507 var scaleY = round(rect.height) / element.offsetHeight || 1;
1508 return scaleX !== 1 || scaleY !== 1;
1509} // Returns the composite rect of an element relative to its offsetParent.
1510// Composite means it takes into account transforms as well as layout.
1511
1512
1513function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
1514 if (isFixed === void 0) {
1515 isFixed = false;
1516 }
1517
1518 var isOffsetParentAnElement = isHTMLElement(offsetParent);
1519 var offsetParentIsScaled = isHTMLElement(offsetParent) && isElementScaled(offsetParent);
1520 var documentElement = getDocumentElement(offsetParent);
1521 var rect = getBoundingClientRect(elementOrVirtualElement, offsetParentIsScaled);
1522 var scroll = {
1523 scrollLeft: 0,
1524 scrollTop: 0
1525 };
1526 var offsets = {
1527 x: 0,
1528 y: 0
1529 };
1530
1531 if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
1532 if (getNodeName(offsetParent) !== 'body' || // https://github.com/popperjs/popper-core/issues/1078
1533 isScrollParent(documentElement)) {
1534 scroll = getNodeScroll(offsetParent);
1535 }
1536
1537 if (isHTMLElement(offsetParent)) {
1538 offsets = getBoundingClientRect(offsetParent, true);
1539 offsets.x += offsetParent.clientLeft;
1540 offsets.y += offsetParent.clientTop;
1541 } else if (documentElement) {
1542 offsets.x = getWindowScrollBarX(documentElement);
1543 }
1544 }
1545
1546 return {
1547 x: rect.left + scroll.scrollLeft - offsets.x,
1548 y: rect.top + scroll.scrollTop - offsets.y,
1549 width: rect.width,
1550 height: rect.height
1551 };
1552}
1553
1554function order(modifiers) {
1555 var map = new Map();
1556 var visited = new Set();
1557 var result = [];
1558 modifiers.forEach(function (modifier) {
1559 map.set(modifier.name, modifier);
1560 }); // On visiting object, check for its dependencies and visit them recursively
1561
1562 function sort(modifier) {
1563 visited.add(modifier.name);
1564 var requires = [].concat(modifier.requires || [], modifier.requiresIfExists || []);
1565 requires.forEach(function (dep) {
1566 if (!visited.has(dep)) {
1567 var depModifier = map.get(dep);
1568
1569 if (depModifier) {
1570 sort(depModifier);
1571 }
1572 }
1573 });
1574 result.push(modifier);
1575 }
1576
1577 modifiers.forEach(function (modifier) {
1578 if (!visited.has(modifier.name)) {
1579 // check for visited object
1580 sort(modifier);
1581 }
1582 });
1583 return result;
1584}
1585
1586function orderModifiers(modifiers) {
1587 // order based on dependencies
1588 var orderedModifiers = order(modifiers); // order based on phase
1589
1590 return index.modifierPhases.reduce(function (acc, phase) {
1591 return acc.concat(orderedModifiers.filter(function (modifier) {
1592 return modifier.phase === phase;
1593 }));
1594 }, []);
1595}
1596
1597function debounce(fn) {
1598 var pending;
1599 return function () {
1600 if (!pending) {
1601 pending = new Promise(function (resolve) {
1602 Promise.resolve().then(function () {
1603 pending = undefined;
1604 resolve(fn());
1605 });
1606 });
1607 }
1608
1609 return pending;
1610 };
1611}
1612
1613function format(str) {
1614 for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
1615 args[_key - 1] = arguments[_key];
1616 }
1617
1618 return [].concat(args).reduce(function (p, c) {
1619 return p.replace(/%s/, c);
1620 }, str);
1621}
1622
1623var INVALID_MODIFIER_ERROR = 'Popper: modifier "%s" provided an invalid %s property, expected %s but got %s';
1624var MISSING_DEPENDENCY_ERROR = 'Popper: modifier "%s" requires "%s", but "%s" modifier is not available';
1625var VALID_PROPERTIES = ['name', 'enabled', 'phase', 'fn', 'effect', 'requires', 'options'];
1626
1627function validateModifiers(modifiers) {
1628 modifiers.forEach(function (modifier) {
1629 [].concat(Object.keys(modifier), VALID_PROPERTIES) // IE11-compatible replacement for `new Set(iterable)`
1630 .filter(function (value, index, self) {
1631 return self.indexOf(value) === index;
1632 }).forEach(function (key) {
1633 switch (key) {
1634 case 'name':
1635 if (typeof modifier.name !== 'string') {
1636 console.error(format(INVALID_MODIFIER_ERROR, String(modifier.name), '"name"', '"string"', "\"" + String(modifier.name) + "\""));
1637 }
1638
1639 break;
1640
1641 case 'enabled':
1642 if (typeof modifier.enabled !== 'boolean') {
1643 console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"enabled"', '"boolean"', "\"" + String(modifier.enabled) + "\""));
1644 }
1645
1646 break;
1647
1648 case 'phase':
1649 if (index.modifierPhases.indexOf(modifier.phase) < 0) {
1650 console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"phase"', "either " + index.modifierPhases.join(', '), "\"" + String(modifier.phase) + "\""));
1651 }
1652
1653 break;
1654
1655 case 'fn':
1656 if (typeof modifier.fn !== 'function') {
1657 console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"fn"', '"function"', "\"" + String(modifier.fn) + "\""));
1658 }
1659
1660 break;
1661
1662 case 'effect':
1663 if (modifier.effect != null && typeof modifier.effect !== 'function') {
1664 console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"effect"', '"function"', "\"" + String(modifier.fn) + "\""));
1665 }
1666
1667 break;
1668
1669 case 'requires':
1670 if (modifier.requires != null && !Array.isArray(modifier.requires)) {
1671 console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"requires"', '"array"', "\"" + String(modifier.requires) + "\""));
1672 }
1673
1674 break;
1675
1676 case 'requiresIfExists':
1677 if (!Array.isArray(modifier.requiresIfExists)) {
1678 console.error(format(INVALID_MODIFIER_ERROR, modifier.name, '"requiresIfExists"', '"array"', "\"" + String(modifier.requiresIfExists) + "\""));
1679 }
1680
1681 break;
1682
1683 case 'options':
1684 case 'data':
1685 break;
1686
1687 default:
1688 console.error("PopperJS: an invalid property has been provided to the \"" + modifier.name + "\" modifier, valid properties are " + VALID_PROPERTIES.map(function (s) {
1689 return "\"" + s + "\"";
1690 }).join(', ') + "; but \"" + key + "\" was provided.");
1691 }
1692
1693 modifier.requires && modifier.requires.forEach(function (requirement) {
1694 if (modifiers.find(function (mod) {
1695 return mod.name === requirement;
1696 }) == null) {
1697 console.error(format(MISSING_DEPENDENCY_ERROR, String(modifier.name), requirement, requirement));
1698 }
1699 });
1700 });
1701 });
1702}
1703
1704function uniqueBy(arr, fn) {
1705 var identifiers = new Set();
1706 return arr.filter(function (item) {
1707 var identifier = fn(item);
1708
1709 if (!identifiers.has(identifier)) {
1710 identifiers.add(identifier);
1711 return true;
1712 }
1713 });
1714}
1715
1716function mergeByName(modifiers) {
1717 var merged = modifiers.reduce(function (merged, current) {
1718 var existing = merged[current.name];
1719 merged[current.name] = existing ? Object.assign({}, existing, current, {
1720 options: Object.assign({}, existing.options, current.options),
1721 data: Object.assign({}, existing.data, current.data)
1722 }) : current;
1723 return merged;
1724 }, {}); // IE11 does not support Object.values
1725
1726 return Object.keys(merged).map(function (key) {
1727 return merged[key];
1728 });
1729}
1730
1731var INVALID_ELEMENT_ERROR = 'Popper: Invalid reference or popper argument provided. They must be either a DOM element or virtual element.';
1732var INFINITE_LOOP_ERROR = 'Popper: An infinite loop in the modifiers cycle has been detected! The cycle has been interrupted to prevent a browser crash.';
1733var DEFAULT_OPTIONS = {
1734 placement: 'bottom',
1735 modifiers: [],
1736 strategy: 'absolute'
1737};
1738
1739function areValidElements() {
1740 for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
1741 args[_key] = arguments[_key];
1742 }
1743
1744 return !args.some(function (element) {
1745 return !(element && typeof element.getBoundingClientRect === 'function');
1746 });
1747}
1748
1749function popperGenerator(generatorOptions) {
1750 if (generatorOptions === void 0) {
1751 generatorOptions = {};
1752 }
1753
1754 var _generatorOptions = generatorOptions,
1755 _generatorOptions$def = _generatorOptions.defaultModifiers,
1756 defaultModifiers = _generatorOptions$def === void 0 ? [] : _generatorOptions$def,
1757 _generatorOptions$def2 = _generatorOptions.defaultOptions,
1758 defaultOptions = _generatorOptions$def2 === void 0 ? DEFAULT_OPTIONS : _generatorOptions$def2;
1759 return function createPopper(reference, popper, options) {
1760 if (options === void 0) {
1761 options = defaultOptions;
1762 }
1763
1764 var state = {
1765 placement: 'bottom',
1766 orderedModifiers: [],
1767 options: Object.assign({}, DEFAULT_OPTIONS, defaultOptions),
1768 modifiersData: {},
1769 elements: {
1770 reference: reference,
1771 popper: popper
1772 },
1773 attributes: {},
1774 styles: {}
1775 };
1776 var effectCleanupFns = [];
1777 var isDestroyed = false;
1778 var instance = {
1779 state: state,
1780 setOptions: function setOptions(setOptionsAction) {
1781 var options = typeof setOptionsAction === 'function' ? setOptionsAction(state.options) : setOptionsAction;
1782 cleanupModifierEffects();
1783 state.options = Object.assign({}, defaultOptions, state.options, options);
1784 state.scrollParents = {
1785 reference: isElement(reference) ? listScrollParents(reference) : reference.contextElement ? listScrollParents(reference.contextElement) : [],
1786 popper: listScrollParents(popper)
1787 }; // Orders the modifiers based on their dependencies and `phase`
1788 // properties
1789
1790 var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers, state.options.modifiers))); // Strip out disabled modifiers
1791
1792 state.orderedModifiers = orderedModifiers.filter(function (m) {
1793 return m.enabled;
1794 }); // Validate the provided modifiers so that the consumer will get warned
1795 // if one of the modifiers is invalid for any reason
1796
1797 if (process.env.NODE_ENV !== "production") {
1798 var modifiers = uniqueBy([].concat(orderedModifiers, state.options.modifiers), function (_ref) {
1799 var name = _ref.name;
1800 return name;
1801 });
1802 validateModifiers(modifiers);
1803
1804 if (getBasePlacement(state.options.placement) === index.auto) {
1805 var flipModifier = state.orderedModifiers.find(function (_ref2) {
1806 var name = _ref2.name;
1807 return name === 'flip';
1808 });
1809
1810 if (!flipModifier) {
1811 console.error(['Popper: "auto" placements require the "flip" modifier be', 'present and enabled to work.'].join(' '));
1812 }
1813 }
1814
1815 var _getComputedStyle = getComputedStyle(popper),
1816 marginTop = _getComputedStyle.marginTop,
1817 marginRight = _getComputedStyle.marginRight,
1818 marginBottom = _getComputedStyle.marginBottom,
1819 marginLeft = _getComputedStyle.marginLeft; // We no longer take into account `margins` on the popper, and it can
1820 // cause bugs with positioning, so we'll warn the consumer
1821
1822
1823 if ([marginTop, marginRight, marginBottom, marginLeft].some(function (margin) {
1824 return parseFloat(margin);
1825 })) {
1826 console.warn(['Popper: CSS "margin" styles cannot be used to apply padding', 'between the popper and its reference element or boundary.', 'To replicate margin, use the `offset` modifier, as well as', 'the `padding` option in the `preventOverflow` and `flip`', 'modifiers.'].join(' '));
1827 }
1828 }
1829
1830 runModifierEffects();
1831 return instance.update();
1832 },
1833 // Sync update – it will always be executed, even if not necessary. This
1834 // is useful for low frequency updates where sync behavior simplifies the
1835 // logic.
1836 // For high frequency updates (e.g. `resize` and `scroll` events), always
1837 // prefer the async Popper#update method
1838 forceUpdate: function forceUpdate() {
1839 if (isDestroyed) {
1840 return;
1841 }
1842
1843 var _state$elements = state.elements,
1844 reference = _state$elements.reference,
1845 popper = _state$elements.popper; // Don't proceed if `reference` or `popper` are not valid elements
1846 // anymore
1847
1848 if (!areValidElements(reference, popper)) {
1849 if (process.env.NODE_ENV !== "production") {
1850 console.error(INVALID_ELEMENT_ERROR);
1851 }
1852
1853 return;
1854 } // Store the reference and popper rects to be read by modifiers
1855
1856
1857 state.rects = {
1858 reference: getCompositeRect(reference, getOffsetParent(popper), state.options.strategy === 'fixed'),
1859 popper: getLayoutRect(popper)
1860 }; // Modifiers have the ability to reset the current update cycle. The
1861 // most common use case for this is the `flip` modifier changing the
1862 // placement, which then needs to re-run all the modifiers, because the
1863 // logic was previously ran for the previous placement and is therefore
1864 // stale/incorrect
1865
1866 state.reset = false;
1867 state.placement = state.options.placement; // On each update cycle, the `modifiersData` property for each modifier
1868 // is filled with the initial data specified by the modifier. This means
1869 // it doesn't persist and is fresh on each update.
1870 // To ensure persistent data, use `${name}#persistent`
1871
1872 state.orderedModifiers.forEach(function (modifier) {
1873 return state.modifiersData[modifier.name] = Object.assign({}, modifier.data);
1874 });
1875 var __debug_loops__ = 0;
1876
1877 for (var index = 0; index < state.orderedModifiers.length; index++) {
1878 if (process.env.NODE_ENV !== "production") {
1879 __debug_loops__ += 1;
1880
1881 if (__debug_loops__ > 100) {
1882 console.error(INFINITE_LOOP_ERROR);
1883 break;
1884 }
1885 }
1886
1887 if (state.reset === true) {
1888 state.reset = false;
1889 index = -1;
1890 continue;
1891 }
1892
1893 var _state$orderedModifie = state.orderedModifiers[index],
1894 fn = _state$orderedModifie.fn,
1895 _state$orderedModifie2 = _state$orderedModifie.options,
1896 _options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2,
1897 name = _state$orderedModifie.name;
1898
1899 if (typeof fn === 'function') {
1900 state = fn({
1901 state: state,
1902 options: _options,
1903 name: name,
1904 instance: instance
1905 }) || state;
1906 }
1907 }
1908 },
1909 // Async and optimistically optimized update – it will not be executed if
1910 // not necessary (debounced to run at most once-per-tick)
1911 update: debounce(function () {
1912 return new Promise(function (resolve) {
1913 instance.forceUpdate();
1914 resolve(state);
1915 });
1916 }),
1917 destroy: function destroy() {
1918 cleanupModifierEffects();
1919 isDestroyed = true;
1920 }
1921 };
1922
1923 if (!areValidElements(reference, popper)) {
1924 if (process.env.NODE_ENV !== "production") {
1925 console.error(INVALID_ELEMENT_ERROR);
1926 }
1927
1928 return instance;
1929 }
1930
1931 instance.setOptions(options).then(function (state) {
1932 if (!isDestroyed && options.onFirstUpdate) {
1933 options.onFirstUpdate(state);
1934 }
1935 }); // Modifiers have the ability to execute arbitrary code before the first
1936 // update cycle runs. They will be executed in the same order as the update
1937 // cycle. This is useful when a modifier adds some persistent data that
1938 // other modifiers need to use, but the modifier is run after the dependent
1939 // one.
1940
1941 function runModifierEffects() {
1942 state.orderedModifiers.forEach(function (_ref3) {
1943 var name = _ref3.name,
1944 _ref3$options = _ref3.options,
1945 options = _ref3$options === void 0 ? {} : _ref3$options,
1946 effect = _ref3.effect;
1947
1948 if (typeof effect === 'function') {
1949 var cleanupFn = effect({
1950 state: state,
1951 name: name,
1952 instance: instance,
1953 options: options
1954 });
1955
1956 var noopFn = function noopFn() {};
1957
1958 effectCleanupFns.push(cleanupFn || noopFn);
1959 }
1960 });
1961 }
1962
1963 function cleanupModifierEffects() {
1964 effectCleanupFns.forEach(function (fn) {
1965 return fn();
1966 });
1967 effectCleanupFns = [];
1968 }
1969
1970 return instance;
1971 };
1972}
1973
1974var defaultModifiers = [eventListeners, popperOffsets$1, computeStyles$1, applyStyles$1, offset$1, flip$1, preventOverflow$1, arrow$1, hide$1];
1975var createPopper = /*#__PURE__*/popperGenerator({
1976 defaultModifiers: defaultModifiers
1977}); // eslint-disable-next-line import/no-unused-modules
1978
1979function _setPrototypeOf(o, p) {
1980 _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
1981 o.__proto__ = p;
1982 return o;
1983 };
1984
1985 return _setPrototypeOf(o, p);
1986}
1987
1988function _inheritsLoose(subClass, superClass) {
1989 subClass.prototype = Object.create(superClass.prototype);
1990 subClass.prototype.constructor = subClass;
1991
1992 _setPrototypeOf(subClass, superClass);
1993}
1994
1995var ManagerReferenceNodeContext = React__namespace.createContext();
1996var ManagerReferenceNodeSetterContext = React__namespace.createContext();
1997
1998function Manager(_ref) {
1999 var children = _ref.children;
2000
2001 var _React$useState = React__namespace.useState(null),
2002 referenceNode = _React$useState[0],
2003 setReferenceNode = _React$useState[1];
2004
2005 var hasUnmounted = React__namespace.useRef(false);
2006 React__namespace.useEffect(function () {
2007 return function () {
2008 hasUnmounted.current = true;
2009 };
2010 }, []);
2011 var handleSetReferenceNode = React__namespace.useCallback(function (node) {
2012 if (!hasUnmounted.current) {
2013 setReferenceNode(node);
2014 }
2015 }, []);
2016 return /*#__PURE__*/React__namespace.createElement(ManagerReferenceNodeContext.Provider, {
2017 value: referenceNode
2018 }, /*#__PURE__*/React__namespace.createElement(ManagerReferenceNodeSetterContext.Provider, {
2019 value: handleSetReferenceNode
2020 }, children));
2021}
2022/**
2023 * Takes an argument and if it's an array, returns the first item in the array,
2024 * otherwise returns the argument. Used for Preact compatibility.
2025 */
2026
2027
2028var unwrapArray = function unwrapArray(arg) {
2029 return Array.isArray(arg) ? arg[0] : arg;
2030};
2031/**
2032 * Takes a maybe-undefined function and arbitrary args and invokes the function
2033 * only if it is defined.
2034 */
2035
2036
2037var safeInvoke = function safeInvoke(fn) {
2038 if (typeof fn === 'function') {
2039 for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
2040 args[_key - 1] = arguments[_key];
2041 }
2042
2043 return fn.apply(void 0, args);
2044 }
2045};
2046/**
2047 * Sets a ref using either a ref callback or a ref object
2048 */
2049
2050
2051var setRef$1 = function setRef(ref, node) {
2052 // if its a function call it
2053 if (typeof ref === 'function') {
2054 return safeInvoke(ref, node);
2055 } // otherwise we should treat it as a ref object
2056 else if (ref != null) {
2057 ref.current = node;
2058 }
2059};
2060/**
2061 * Simple ponyfill for Object.fromEntries
2062 */
2063
2064
2065var fromEntries = function fromEntries(entries) {
2066 return entries.reduce(function (acc, _ref) {
2067 var key = _ref[0],
2068 value = _ref[1];
2069 acc[key] = value;
2070 return acc;
2071 }, {});
2072};
2073/**
2074 * Small wrapper around `useLayoutEffect` to get rid of the warning on SSR envs
2075 */
2076
2077
2078var useIsomorphicLayoutEffect = typeof window !== 'undefined' && window.document && window.document.createElement ? React__namespace.useLayoutEffect : React__namespace.useEffect;
2079/* global Map:readonly, Set:readonly, ArrayBuffer:readonly */
2080
2081var hasElementType = typeof Element !== 'undefined';
2082var hasMap = typeof Map === 'function';
2083var hasSet = typeof Set === 'function';
2084var hasArrayBuffer = typeof ArrayBuffer === 'function' && !!ArrayBuffer.isView; // Note: We **don't** need `envHasBigInt64Array` in fde es6/index.js
2085
2086function equal(a, b) {
2087 // START: fast-deep-equal es6/index.js 3.1.1
2088 if (a === b) return true;
2089
2090 if (a && b && typeof a == 'object' && typeof b == 'object') {
2091 if (a.constructor !== b.constructor) return false;
2092 var length, i, keys;
2093
2094 if (Array.isArray(a)) {
2095 length = a.length;
2096 if (length != b.length) return false;
2097
2098 for (i = length; i-- !== 0;) if (!equal(a[i], b[i])) return false;
2099
2100 return true;
2101 } // START: Modifications:
2102 // 1. Extra `has<Type> &&` helpers in initial condition allow es6 code
2103 // to co-exist with es5.
2104 // 2. Replace `for of` with es5 compliant iteration using `for`.
2105 // Basically, take:
2106 //
2107 // ```js
2108 // for (i of a.entries())
2109 // if (!b.has(i[0])) return false;
2110 // ```
2111 //
2112 // ... and convert to:
2113 //
2114 // ```js
2115 // it = a.entries();
2116 // while (!(i = it.next()).done)
2117 // if (!b.has(i.value[0])) return false;
2118 // ```
2119 //
2120 // **Note**: `i` access switches to `i.value`.
2121
2122
2123 var it;
2124
2125 if (hasMap && a instanceof Map && b instanceof Map) {
2126 if (a.size !== b.size) return false;
2127 it = a.entries();
2128
2129 while (!(i = it.next()).done) if (!b.has(i.value[0])) return false;
2130
2131 it = a.entries();
2132
2133 while (!(i = it.next()).done) if (!equal(i.value[1], b.get(i.value[0]))) return false;
2134
2135 return true;
2136 }
2137
2138 if (hasSet && a instanceof Set && b instanceof Set) {
2139 if (a.size !== b.size) return false;
2140 it = a.entries();
2141
2142 while (!(i = it.next()).done) if (!b.has(i.value[0])) return false;
2143
2144 return true;
2145 } // END: Modifications
2146
2147
2148 if (hasArrayBuffer && ArrayBuffer.isView(a) && ArrayBuffer.isView(b)) {
2149 length = a.length;
2150 if (length != b.length) return false;
2151
2152 for (i = length; i-- !== 0;) if (a[i] !== b[i]) return false;
2153
2154 return true;
2155 }
2156
2157 if (a.constructor === RegExp) return a.source === b.source && a.flags === b.flags;
2158 if (a.valueOf !== Object.prototype.valueOf) return a.valueOf() === b.valueOf();
2159 if (a.toString !== Object.prototype.toString) return a.toString() === b.toString();
2160 keys = Object.keys(a);
2161 length = keys.length;
2162 if (length !== Object.keys(b).length) return false;
2163
2164 for (i = length; i-- !== 0;) if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false; // END: fast-deep-equal
2165 // START: react-fast-compare
2166 // custom handling for DOM elements
2167
2168
2169 if (hasElementType && a instanceof Element) return false; // custom handling for React/Preact
2170
2171 for (i = length; i-- !== 0;) {
2172 if ((keys[i] === '_owner' || keys[i] === '__v' || keys[i] === '__o') && a.$$typeof) {
2173 // React-specific: avoid traversing React elements' _owner
2174 // Preact-specific: avoid traversing Preact elements' __v and __o
2175 // __v = $_original / $_vnode
2176 // __o = $_owner
2177 // These properties contain circular references and are not needed when
2178 // comparing the actual elements (and not their owners)
2179 // .$$typeof and ._store on just reasonable markers of elements
2180 continue;
2181 } // all other properties should be traversed as usual
2182
2183
2184 if (!equal(a[keys[i]], b[keys[i]])) return false;
2185 } // END: react-fast-compare
2186 // START: fast-deep-equal
2187
2188
2189 return true;
2190 }
2191
2192 return a !== a && b !== b;
2193} // end fast-deep-equal
2194
2195
2196var reactFastCompare = function isEqual(a, b) {
2197 try {
2198 return equal(a, b);
2199 } catch (error) {
2200 if ((error.message || '').match(/stack|recursion/i)) {
2201 // warn on circular references, don't crash
2202 // browsers give this different errors name and messages:
2203 // chrome/safari: "RangeError", "Maximum call stack size exceeded"
2204 // firefox: "InternalError", too much recursion"
2205 // edge: "Error", "Out of stack space"
2206 console.warn('react-fast-compare cannot handle circular refs');
2207 return false;
2208 } // some other error. we should definitely know about these
2209
2210
2211 throw error;
2212 }
2213};
2214
2215var EMPTY_MODIFIERS$1 = [];
2216
2217var usePopper = function usePopper(referenceElement, popperElement, options) {
2218 if (options === void 0) {
2219 options = {};
2220 }
2221
2222 var prevOptions = React__namespace.useRef(null);
2223 var optionsWithDefaults = {
2224 onFirstUpdate: options.onFirstUpdate,
2225 placement: options.placement || 'bottom',
2226 strategy: options.strategy || 'absolute',
2227 modifiers: options.modifiers || EMPTY_MODIFIERS$1
2228 };
2229
2230 var _React$useState = React__namespace.useState({
2231 styles: {
2232 popper: {
2233 position: optionsWithDefaults.strategy,
2234 left: '0',
2235 top: '0'
2236 },
2237 arrow: {
2238 position: 'absolute'
2239 }
2240 },
2241 attributes: {}
2242 }),
2243 state = _React$useState[0],
2244 setState = _React$useState[1];
2245
2246 var updateStateModifier = React__namespace.useMemo(function () {
2247 return {
2248 name: 'updateState',
2249 enabled: true,
2250 phase: 'write',
2251 fn: function fn(_ref) {
2252 var state = _ref.state;
2253 var elements = Object.keys(state.elements);
2254 setState({
2255 styles: fromEntries(elements.map(function (element) {
2256 return [element, state.styles[element] || {}];
2257 })),
2258 attributes: fromEntries(elements.map(function (element) {
2259 return [element, state.attributes[element]];
2260 }))
2261 });
2262 },
2263 requires: ['computeStyles']
2264 };
2265 }, []);
2266 var popperOptions = React__namespace.useMemo(function () {
2267 var newOptions = {
2268 onFirstUpdate: optionsWithDefaults.onFirstUpdate,
2269 placement: optionsWithDefaults.placement,
2270 strategy: optionsWithDefaults.strategy,
2271 modifiers: [].concat(optionsWithDefaults.modifiers, [updateStateModifier, {
2272 name: 'applyStyles',
2273 enabled: false
2274 }])
2275 };
2276
2277 if (reactFastCompare(prevOptions.current, newOptions)) {
2278 return prevOptions.current || newOptions;
2279 } else {
2280 prevOptions.current = newOptions;
2281 return newOptions;
2282 }
2283 }, [optionsWithDefaults.onFirstUpdate, optionsWithDefaults.placement, optionsWithDefaults.strategy, optionsWithDefaults.modifiers, updateStateModifier]);
2284 var popperInstanceRef = React__namespace.useRef();
2285 useIsomorphicLayoutEffect(function () {
2286 if (popperInstanceRef.current) {
2287 popperInstanceRef.current.setOptions(popperOptions);
2288 }
2289 }, [popperOptions]);
2290 useIsomorphicLayoutEffect(function () {
2291 if (referenceElement == null || popperElement == null) {
2292 return;
2293 }
2294
2295 var createPopper$1 = options.createPopper || createPopper;
2296 var popperInstance = createPopper$1(referenceElement, popperElement, popperOptions);
2297 popperInstanceRef.current = popperInstance;
2298 return function () {
2299 popperInstance.destroy();
2300 popperInstanceRef.current = null;
2301 };
2302 }, [referenceElement, popperElement, options.createPopper]);
2303 return {
2304 state: popperInstanceRef.current ? popperInstanceRef.current.state : null,
2305 styles: state.styles,
2306 attributes: state.attributes,
2307 update: popperInstanceRef.current ? popperInstanceRef.current.update : null,
2308 forceUpdate: popperInstanceRef.current ? popperInstanceRef.current.forceUpdate : null
2309 };
2310};
2311
2312var NOOP = function NOOP() {
2313 return void 0;
2314};
2315
2316var NOOP_PROMISE = function NOOP_PROMISE() {
2317 return Promise.resolve(null);
2318};
2319
2320var EMPTY_MODIFIERS = [];
2321
2322function Popper(_ref) {
2323 var _ref$placement = _ref.placement,
2324 placement = _ref$placement === void 0 ? 'bottom' : _ref$placement,
2325 _ref$strategy = _ref.strategy,
2326 strategy = _ref$strategy === void 0 ? 'absolute' : _ref$strategy,
2327 _ref$modifiers = _ref.modifiers,
2328 modifiers = _ref$modifiers === void 0 ? EMPTY_MODIFIERS : _ref$modifiers,
2329 referenceElement = _ref.referenceElement,
2330 onFirstUpdate = _ref.onFirstUpdate,
2331 innerRef = _ref.innerRef,
2332 children = _ref.children;
2333 var referenceNode = React__namespace.useContext(ManagerReferenceNodeContext);
2334
2335 var _React$useState = React__namespace.useState(null),
2336 popperElement = _React$useState[0],
2337 setPopperElement = _React$useState[1];
2338
2339 var _React$useState2 = React__namespace.useState(null),
2340 arrowElement = _React$useState2[0],
2341 setArrowElement = _React$useState2[1];
2342
2343 React__namespace.useEffect(function () {
2344 setRef$1(innerRef, popperElement);
2345 }, [innerRef, popperElement]);
2346 var options = React__namespace.useMemo(function () {
2347 return {
2348 placement: placement,
2349 strategy: strategy,
2350 onFirstUpdate: onFirstUpdate,
2351 modifiers: [].concat(modifiers, [{
2352 name: 'arrow',
2353 enabled: arrowElement != null,
2354 options: {
2355 element: arrowElement
2356 }
2357 }])
2358 };
2359 }, [placement, strategy, onFirstUpdate, modifiers, arrowElement]);
2360
2361 var _usePopper = usePopper(referenceElement || referenceNode, popperElement, options),
2362 state = _usePopper.state,
2363 styles = _usePopper.styles,
2364 forceUpdate = _usePopper.forceUpdate,
2365 update = _usePopper.update;
2366
2367 var childrenProps = React__namespace.useMemo(function () {
2368 return {
2369 ref: setPopperElement,
2370 style: styles.popper,
2371 placement: state ? state.placement : placement,
2372 hasPopperEscaped: state && state.modifiersData.hide ? state.modifiersData.hide.hasPopperEscaped : null,
2373 isReferenceHidden: state && state.modifiersData.hide ? state.modifiersData.hide.isReferenceHidden : null,
2374 arrowProps: {
2375 style: styles.arrow,
2376 ref: setArrowElement
2377 },
2378 forceUpdate: forceUpdate || NOOP,
2379 update: update || NOOP_PROMISE
2380 };
2381 }, [setPopperElement, setArrowElement, placement, state, styles, update, forceUpdate]);
2382 return unwrapArray(children)(childrenProps);
2383}
2384/**
2385 * Copyright (c) 2014-present, Facebook, Inc.
2386 *
2387 * This source code is licensed under the MIT license found in the
2388 * LICENSE file in the root directory of this source tree.
2389 */
2390
2391/**
2392 * Similar to invariant but only logs a warning if the condition is not met.
2393 * This can be used to log issues in development environments in critical
2394 * paths. Removing the logging code for production environments will keep the
2395 * same logic and follow the same code paths.
2396 */
2397
2398
2399var __DEV__ = process.env.NODE_ENV !== 'production';
2400
2401var warning = function () {};
2402
2403if (__DEV__) {
2404 var printWarning = function printWarning(format, args) {
2405 var len = arguments.length;
2406 args = new Array(len > 1 ? len - 1 : 0);
2407
2408 for (var key = 1; key < len; key++) {
2409 args[key - 1] = arguments[key];
2410 }
2411
2412 var argIndex = 0;
2413 var message = 'Warning: ' + format.replace(/%s/g, function () {
2414 return args[argIndex++];
2415 });
2416
2417 if (typeof console !== 'undefined') {
2418 console.error(message);
2419 }
2420
2421 try {
2422 // --- Welcome to debugging React ---
2423 // This error was thrown as a convenience so that you can use this stack
2424 // to find the callsite that caused this warning to fire.
2425 throw new Error(message);
2426 } catch (x) {}
2427 };
2428
2429 warning = function (condition, format, args) {
2430 var len = arguments.length;
2431 args = new Array(len > 2 ? len - 2 : 0);
2432
2433 for (var key = 2; key < len; key++) {
2434 args[key - 2] = arguments[key];
2435 }
2436
2437 if (format === undefined) {
2438 throw new Error('`warning(condition, format, ...args)` requires a warning ' + 'message argument');
2439 }
2440
2441 if (!condition) {
2442 printWarning.apply(null, [format].concat(args));
2443 }
2444 };
2445}
2446
2447var warning_1 = warning;
2448
2449function Reference(_ref) {
2450 var children = _ref.children,
2451 innerRef = _ref.innerRef;
2452 var setReferenceNode = React__namespace.useContext(ManagerReferenceNodeSetterContext);
2453 var refHandler = React__namespace.useCallback(function (node) {
2454 setRef$1(innerRef, node);
2455 safeInvoke(setReferenceNode, node);
2456 }, [innerRef, setReferenceNode]); // ran on unmount
2457
2458 React__namespace.useEffect(function () {
2459 return function () {
2460 return setRef$1(innerRef, null);
2461 };
2462 });
2463 React__namespace.useEffect(function () {
2464 warning_1(Boolean(setReferenceNode), '`Reference` should not be used outside of a `Manager` component.');
2465 }, [setReferenceNode]);
2466 return unwrapArray(children)({
2467 ref: refHandler
2468 });
2469}
2470
2471var TooltipContext = /*#__PURE__*/React__default["default"].createContext({}); // eslint-disable-next-line @typescript-eslint/no-explicit-any
2472// eslint-disable-next-line @typescript-eslint/no-explicit-any
2473
2474var callAll = function callAll() {
2475 for (var _len = arguments.length, fns = new Array(_len), _key = 0; _key < _len; _key++) {
2476 fns[_key] = arguments[_key];
2477 }
2478
2479 return function () {
2480 for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
2481 args[_key2] = arguments[_key2];
2482 }
2483
2484 return fns.forEach(function (fn) {
2485 return fn && fn.apply(void 0, args);
2486 });
2487 };
2488};
2489
2490var noop = function noop() {// do nothing
2491};
2492
2493var canUseDOM = function canUseDOM() {
2494 return !!(typeof window !== 'undefined' && window.document && window.document.createElement);
2495};
2496
2497var setRef = function setRef(ref, node) {
2498 if (typeof ref === 'function') {
2499 return ref(node);
2500 } else if (ref != null) {
2501 ref.current = node;
2502 }
2503};
2504
2505var Tooltip$1 = /*#__PURE__*/function (_Component) {
2506 _inheritsLoose(Tooltip, _Component);
2507
2508 function Tooltip() {
2509 var _this;
2510
2511 for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
2512 args[_key] = arguments[_key];
2513 }
2514
2515 _this = _Component.call.apply(_Component, [this].concat(args)) || this;
2516 _this.observer = void 0;
2517 _this.tooltipRef = void 0;
2518
2519 _this.handleOutsideClick = function (event) {
2520 if (_this.tooltipRef && !_this.tooltipRef.contains(event.target)) {
2521 var parentOutsideClickHandler = _this.context.parentOutsideClickHandler;
2522 var _this$props = _this.props,
2523 hideTooltip = _this$props.hideTooltip,
2524 clearScheduled = _this$props.clearScheduled;
2525 clearScheduled();
2526 hideTooltip();
2527
2528 if (parentOutsideClickHandler) {
2529 parentOutsideClickHandler(event);
2530 }
2531 }
2532 };
2533
2534 _this.handleOutsideRightClick = function (event) {
2535 if (_this.tooltipRef && !_this.tooltipRef.contains(event.target)) {
2536 var parentOutsideRightClickHandler = _this.context.parentOutsideRightClickHandler;
2537 var _this$props2 = _this.props,
2538 hideTooltip = _this$props2.hideTooltip,
2539 clearScheduled = _this$props2.clearScheduled;
2540 clearScheduled();
2541 hideTooltip();
2542
2543 if (parentOutsideRightClickHandler) {
2544 parentOutsideRightClickHandler(event);
2545 }
2546 }
2547 };
2548
2549 _this.addOutsideClickHandler = function () {
2550 document.body.addEventListener('touchend', _this.handleOutsideClick);
2551 document.body.addEventListener('click', _this.handleOutsideClick);
2552 };
2553
2554 _this.removeOutsideClickHandler = function () {
2555 document.body.removeEventListener('touchend', _this.handleOutsideClick);
2556 document.body.removeEventListener('click', _this.handleOutsideClick);
2557 };
2558
2559 _this.addOutsideRightClickHandler = function () {
2560 return document.body.addEventListener('contextmenu', _this.handleOutsideRightClick);
2561 };
2562
2563 _this.removeOutsideRightClickHandler = function () {
2564 return document.body.removeEventListener('contextmenu', _this.handleOutsideRightClick);
2565 };
2566
2567 _this.getTooltipRef = function (node) {
2568 _this.tooltipRef = node;
2569 setRef(_this.props.innerRef, node);
2570 };
2571
2572 _this.getArrowProps = function (props) {
2573 if (props === void 0) {
2574 props = {};
2575 }
2576
2577 return index._extends({}, props, {
2578 style: index._extends({}, props.style, _this.props.arrowProps.style)
2579 });
2580 };
2581
2582 _this.getTooltipProps = function (props) {
2583 if (props === void 0) {
2584 props = {};
2585 }
2586
2587 return index._extends({}, props, _this.isTriggeredBy('hover') && {
2588 onMouseEnter: callAll(_this.props.clearScheduled, props.onMouseEnter),
2589 onMouseLeave: callAll(_this.props.hideTooltip, props.onMouseLeave)
2590 }, {
2591 style: index._extends({}, props.style, _this.props.style)
2592 });
2593 };
2594
2595 _this.contextValue = {
2596 isParentNoneTriggered: _this.props.trigger === 'none',
2597 addParentOutsideClickHandler: _this.addOutsideClickHandler,
2598 addParentOutsideRightClickHandler: _this.addOutsideRightClickHandler,
2599 parentOutsideClickHandler: _this.handleOutsideClick,
2600 parentOutsideRightClickHandler: _this.handleOutsideRightClick,
2601 removeParentOutsideClickHandler: _this.removeOutsideClickHandler,
2602 removeParentOutsideRightClickHandler: _this.removeOutsideRightClickHandler
2603 };
2604 return _this;
2605 }
2606
2607 var _proto = Tooltip.prototype;
2608
2609 _proto.componentDidMount = function componentDidMount() {
2610 var _this2 = this;
2611
2612 var observer = this.observer = new MutationObserver(function () {
2613 _this2.props.update();
2614 });
2615 observer.observe(this.tooltipRef, this.props.mutationObserverOptions);
2616
2617 if (this.isTriggeredBy('hover') || this.isTriggeredBy('click') || this.isTriggeredBy('right-click')) {
2618 var _this$context = this.context,
2619 removeParentOutsideClickHandler = _this$context.removeParentOutsideClickHandler,
2620 removeParentOutsideRightClickHandler = _this$context.removeParentOutsideRightClickHandler;
2621 this.addOutsideClickHandler();
2622 this.addOutsideRightClickHandler();
2623
2624 if (removeParentOutsideClickHandler) {
2625 removeParentOutsideClickHandler();
2626 }
2627
2628 if (removeParentOutsideRightClickHandler) {
2629 removeParentOutsideRightClickHandler();
2630 }
2631 }
2632 };
2633
2634 _proto.componentDidUpdate = function componentDidUpdate() {
2635 if (this.props.closeOnReferenceHidden && this.props.isReferenceHidden) {
2636 this.props.hideTooltip();
2637 }
2638 };
2639
2640 _proto.componentWillUnmount = function componentWillUnmount() {
2641 if (this.observer) {
2642 this.observer.disconnect();
2643 }
2644
2645 if (this.isTriggeredBy('hover') || this.isTriggeredBy('click') || this.isTriggeredBy('right-click')) {
2646 var _this$context2 = this.context,
2647 isParentNoneTriggered = _this$context2.isParentNoneTriggered,
2648 addParentOutsideClickHandler = _this$context2.addParentOutsideClickHandler,
2649 addParentOutsideRightClickHandler = _this$context2.addParentOutsideRightClickHandler;
2650 this.removeOutsideClickHandler();
2651 this.removeOutsideRightClickHandler();
2652 this.handleOutsideClick = undefined;
2653 this.handleOutsideRightClick = undefined;
2654
2655 if (!isParentNoneTriggered && addParentOutsideClickHandler) {
2656 addParentOutsideClickHandler();
2657 }
2658
2659 if (!isParentNoneTriggered && addParentOutsideRightClickHandler) {
2660 addParentOutsideRightClickHandler();
2661 }
2662 }
2663 };
2664
2665 _proto.render = function render() {
2666 var _this$props3 = this.props,
2667 arrowProps = _this$props3.arrowProps,
2668 placement = _this$props3.placement,
2669 tooltip = _this$props3.tooltip;
2670 return /*#__PURE__*/React__default["default"].createElement(TooltipContext.Provider, {
2671 value: this.contextValue
2672 }, tooltip({
2673 arrowRef: arrowProps.ref,
2674 getArrowProps: this.getArrowProps,
2675 getTooltipProps: this.getTooltipProps,
2676 placement: placement,
2677 tooltipRef: this.getTooltipRef
2678 }));
2679 };
2680
2681 _proto.isTriggeredBy = function isTriggeredBy(event) {
2682 var trigger = this.props.trigger;
2683 return trigger === event || Array.isArray(trigger) && trigger.includes(event);
2684 };
2685
2686 return Tooltip;
2687}(React.Component);
2688
2689Tooltip$1.contextType = TooltipContext;
2690var DEFAULT_MUTATION_OBSERVER_CONFIG = {
2691 childList: true,
2692 subtree: true
2693};
2694
2695var TooltipTrigger = /*#__PURE__*/function (_Component) {
2696 _inheritsLoose(TooltipTrigger, _Component);
2697
2698 function TooltipTrigger() {
2699 var _this;
2700
2701 for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
2702 args[_key] = arguments[_key];
2703 }
2704
2705 _this = _Component.call.apply(_Component, [this].concat(args)) || this;
2706 _this.state = {
2707 tooltipShown: _this.props.defaultTooltipShown
2708 };
2709 _this.hideTimeout = void 0;
2710 _this.showTimeout = void 0;
2711 _this.popperOffset = void 0;
2712
2713 _this.setTooltipState = function (state) {
2714 var cb = function cb() {
2715 return _this.props.onVisibilityChange(state.tooltipShown);
2716 };
2717
2718 _this.isControlled() ? cb() : _this.setState(state, cb);
2719 };
2720
2721 _this.clearScheduled = function () {
2722 clearTimeout(_this.hideTimeout);
2723 clearTimeout(_this.showTimeout);
2724 };
2725
2726 _this.showTooltip = function (_ref) {
2727 var pageX = _ref.pageX,
2728 pageY = _ref.pageY;
2729
2730 _this.clearScheduled();
2731
2732 var state = {
2733 tooltipShown: true
2734 };
2735
2736 if (_this.props.followCursor) {
2737 state = index._extends({}, state, {
2738 pageX: pageX,
2739 pageY: pageY
2740 });
2741 }
2742
2743 _this.showTimeout = window.setTimeout(function () {
2744 return _this.setTooltipState(state);
2745 }, _this.props.delayShow);
2746 };
2747
2748 _this.hideTooltip = function () {
2749 _this.clearScheduled();
2750
2751 _this.hideTimeout = window.setTimeout(function () {
2752 return _this.setTooltipState({
2753 tooltipShown: false
2754 });
2755 }, _this.props.delayHide);
2756 };
2757
2758 _this.toggleTooltip = function (_ref2) {
2759 var pageX = _ref2.pageX,
2760 pageY = _ref2.pageY;
2761 var action = _this.getState() ? 'hideTooltip' : 'showTooltip';
2762
2763 _this[action]({
2764 pageX: pageX,
2765 pageY: pageY
2766 });
2767 };
2768
2769 _this.clickToggle = function (event) {
2770 event.preventDefault();
2771 var pageX = event.pageX,
2772 pageY = event.pageY;
2773 var action = _this.props.followCursor ? 'showTooltip' : 'toggleTooltip';
2774
2775 _this[action]({
2776 pageX: pageX,
2777 pageY: pageY
2778 });
2779 };
2780
2781 _this.contextMenuToggle = function (event) {
2782 event.preventDefault();
2783 var pageX = event.pageX,
2784 pageY = event.pageY;
2785 var action = _this.props.followCursor ? 'showTooltip' : 'toggleTooltip';
2786
2787 _this[action]({
2788 pageX: pageX,
2789 pageY: pageY
2790 });
2791 };
2792
2793 _this.getTriggerProps = function (props) {
2794 if (props === void 0) {
2795 props = {};
2796 }
2797
2798 return index._extends({}, props, _this.isTriggeredBy('click') && {
2799 onClick: callAll(_this.clickToggle, props.onClick),
2800 onTouchEnd: callAll(_this.clickToggle, props.onTouchEnd)
2801 }, _this.isTriggeredBy('right-click') && {
2802 onContextMenu: callAll(_this.contextMenuToggle, props.onContextMenu)
2803 }, _this.isTriggeredBy('hover') && index._extends({
2804 onMouseEnter: callAll(_this.showTooltip, props.onMouseEnter),
2805 onMouseLeave: callAll(_this.hideTooltip, props.onMouseLeave)
2806 }, _this.props.followCursor && {
2807 onMouseMove: callAll(_this.showTooltip, props.onMouseMove)
2808 }), _this.isTriggeredBy('focus') && {
2809 onFocus: callAll(_this.showTooltip, props.onFocus),
2810 onBlur: callAll(_this.hideTooltip, props.onBlur)
2811 });
2812 };
2813
2814 return _this;
2815 }
2816
2817 var _proto = TooltipTrigger.prototype;
2818
2819 _proto.componentWillUnmount = function componentWillUnmount() {
2820 this.clearScheduled();
2821 };
2822
2823 _proto.render = function render() {
2824 var _this2 = this;
2825
2826 var _this$props = this.props,
2827 children = _this$props.children,
2828 tooltip = _this$props.tooltip,
2829 placement = _this$props.placement,
2830 trigger = _this$props.trigger,
2831 getTriggerRef = _this$props.getTriggerRef,
2832 modifiers = _this$props.modifiers,
2833 closeOnReferenceHidden = _this$props.closeOnReferenceHidden,
2834 usePortal = _this$props.usePortal,
2835 portalContainer = _this$props.portalContainer,
2836 followCursor = _this$props.followCursor,
2837 getTooltipRef = _this$props.getTooltipRef,
2838 mutationObserverOptions = _this$props.mutationObserverOptions,
2839 restProps = index._objectWithoutPropertiesLoose(_this$props, ["children", "tooltip", "placement", "trigger", "getTriggerRef", "modifiers", "closeOnReferenceHidden", "usePortal", "portalContainer", "followCursor", "getTooltipRef", "mutationObserverOptions"]);
2840
2841 var popper = /*#__PURE__*/React__default["default"].createElement(Popper, index._extends({
2842 innerRef: getTooltipRef,
2843 placement: placement,
2844 modifiers: [{
2845 name: 'followCursor',
2846 enabled: followCursor,
2847 phase: 'main',
2848 fn: function fn(data) {
2849 _this2.popperOffset = data.state.rects.popper;
2850 }
2851 }].concat(modifiers)
2852 }, restProps), function (_ref3) {
2853 var ref = _ref3.ref,
2854 style = _ref3.style,
2855 placement = _ref3.placement,
2856 arrowProps = _ref3.arrowProps,
2857 isReferenceHidden = _ref3.isReferenceHidden,
2858 update = _ref3.update;
2859
2860 if (followCursor && _this2.popperOffset) {
2861 var _this2$state = _this2.state,
2862 pageX = _this2$state.pageX,
2863 pageY = _this2$state.pageY;
2864 var _this2$popperOffset = _this2.popperOffset,
2865 width = _this2$popperOffset.width,
2866 height = _this2$popperOffset.height;
2867 var x = pageX + width > window.pageXOffset + document.body.offsetWidth ? pageX - width : pageX;
2868 var y = pageY + height > window.pageYOffset + document.body.offsetHeight ? pageY - height : pageY;
2869 style.transform = "translate3d(" + x + "px, " + y + "px, 0";
2870 }
2871
2872 return /*#__PURE__*/React__default["default"].createElement(Tooltip$1, index._extends({
2873 arrowProps: arrowProps,
2874 closeOnReferenceHidden: closeOnReferenceHidden,
2875 isReferenceHidden: isReferenceHidden,
2876 placement: placement,
2877 update: update,
2878 style: style,
2879 tooltip: tooltip,
2880 trigger: trigger,
2881 mutationObserverOptions: mutationObserverOptions
2882 }, {
2883 clearScheduled: _this2.clearScheduled,
2884 hideTooltip: _this2.hideTooltip,
2885 innerRef: ref
2886 }));
2887 });
2888 return /*#__PURE__*/React__default["default"].createElement(Manager, null, /*#__PURE__*/React__default["default"].createElement(Reference, {
2889 innerRef: getTriggerRef
2890 }, function (_ref4) {
2891 var ref = _ref4.ref;
2892 return children({
2893 getTriggerProps: _this2.getTriggerProps,
2894 triggerRef: ref
2895 });
2896 }), this.getState() && (usePortal ? /*#__PURE__*/reactDom.createPortal(popper, portalContainer) : popper));
2897 };
2898
2899 _proto.isControlled = function isControlled() {
2900 return this.props.tooltipShown !== undefined;
2901 };
2902
2903 _proto.getState = function getState() {
2904 return this.isControlled() ? this.props.tooltipShown : this.state.tooltipShown;
2905 };
2906
2907 _proto.isTriggeredBy = function isTriggeredBy(event) {
2908 var trigger = this.props.trigger;
2909 return trigger === event || Array.isArray(trigger) && trigger.includes(event);
2910 };
2911
2912 return TooltipTrigger;
2913}(React.Component);
2914
2915TooltipTrigger.defaultProps = {
2916 closeOnReferenceHidden: true,
2917 defaultTooltipShown: false,
2918 delayHide: 0,
2919 delayShow: 0,
2920 followCursor: false,
2921 onVisibilityChange: noop,
2922 placement: 'right',
2923 portalContainer: canUseDOM() ? document.body : null,
2924 trigger: 'hover',
2925 usePortal: canUseDOM(),
2926 mutationObserverOptions: DEFAULT_MUTATION_OBSERVER_CONFIG,
2927 modifiers: []
2928};
2929var TooltipTrigger$1 = TooltipTrigger;
2930const match = memoize__default["default"](1000)((requests, actual, value, fallback = 0) => actual.split('-')[0] === requests ? value : fallback);
2931const ArrowSpacing = 8;
2932const Arrow = theming.styled.div({
2933 position: 'absolute',
2934 borderStyle: 'solid'
2935}, ({
2936 placement
2937}) => {
2938 let x = 0;
2939 let y = 0;
2940
2941 switch (true) {
2942 case placement.startsWith('left') || placement.startsWith('right'):
2943 {
2944 y = 8;
2945 break;
2946 }
2947
2948 case placement.startsWith('top') || placement.startsWith('bottom'):
2949 {
2950 x = 8;
2951 break;
2952 }
2953 }
2954
2955 const transform = `translate3d(${x}px, ${y}px, 0px)`;
2956 return {
2957 transform
2958 };
2959}, ({
2960 theme,
2961 color,
2962 placement
2963}) => ({
2964 bottom: `${match('top', placement, ArrowSpacing * -1, 'auto')}px`,
2965 top: `${match('bottom', placement, ArrowSpacing * -1, 'auto')}px`,
2966 right: `${match('left', placement, ArrowSpacing * -1, 'auto')}px`,
2967 left: `${match('right', placement, ArrowSpacing * -1, 'auto')}px`,
2968 borderBottomWidth: `${match('top', placement, '0', ArrowSpacing)}px`,
2969 borderTopWidth: `${match('bottom', placement, '0', ArrowSpacing)}px`,
2970 borderRightWidth: `${match('left', placement, '0', ArrowSpacing)}px`,
2971 borderLeftWidth: `${match('right', placement, '0', ArrowSpacing)}px`,
2972 borderTopColor: match('top', placement, theme.color[color] || color || theme.base === 'light' ? theming.lighten(theme.background.app) : theming.darken(theme.background.app), 'transparent'),
2973 borderBottomColor: match('bottom', placement, theme.color[color] || color || theme.base === 'light' ? theming.lighten(theme.background.app) : theming.darken(theme.background.app), 'transparent'),
2974 borderLeftColor: match('left', placement, theme.color[color] || color || theme.base === 'light' ? theming.lighten(theme.background.app) : theming.darken(theme.background.app), 'transparent'),
2975 borderRightColor: match('right', placement, theme.color[color] || color || theme.base === 'light' ? theming.lighten(theme.background.app) : theming.darken(theme.background.app), 'transparent')
2976}));
2977const Wrapper = theming.styled.div(({
2978 hidden
2979}) => ({
2980 display: hidden ? 'none' : 'inline-block',
2981 zIndex: 2147483647
2982}), ({
2983 theme,
2984 color,
2985 hasChrome
2986}) => hasChrome ? {
2987 background: theme.color[color] || color || theme.base === 'light' ? theming.lighten(theme.background.app) : theming.darken(theme.background.app),
2988 filter: `
2989 drop-shadow(0px 5px 5px rgba(0,0,0,0.05))
2990 drop-shadow(0 1px 3px rgba(0,0,0,0.1))
2991 `,
2992 borderRadius: theme.appBorderRadius * 2,
2993 fontSize: theme.typography.size.s1
2994} : {});
2995
2996const Tooltip = _a => {
2997 var {
2998 placement,
2999 hasChrome,
3000 children,
3001 arrowProps,
3002 tooltipRef,
3003 arrowRef,
3004 color
3005 } = _a,
3006 props = index.__rest(_a, ["placement", "hasChrome", "children", "arrowProps", "tooltipRef", "arrowRef", "color"]);
3007
3008 return React__default["default"].createElement(Wrapper, Object.assign({
3009 hasChrome: hasChrome,
3010 placement: placement,
3011 ref: tooltipRef
3012 }, props, {
3013 color: color
3014 }), hasChrome && React__default["default"].createElement(Arrow, Object.assign({
3015 placement: placement,
3016 ref: arrowRef
3017 }, arrowProps, {
3018 color: color
3019 })), children);
3020};
3021
3022Tooltip.defaultProps = {
3023 color: undefined,
3024 arrowRef: undefined,
3025 tooltipRef: undefined,
3026 hasChrome: true,
3027 placement: 'top',
3028 arrowProps: {}
3029};
3030const {
3031 document: document$1
3032} = index.window_1; // A target that doesn't speak popper
3033
3034const TargetContainer = theming.styled.div`
3035 display: inline-block;
3036 cursor: ${props => props.mode === 'hover' ? 'default' : 'pointer'};
3037`;
3038const TargetSvgContainer = theming.styled.g`
3039 cursor: ${props => props.mode === 'hover' ? 'default' : 'pointer'};
3040`; // Pure, does not bind to the body
3041
3042const WithTooltipPure = _a => {
3043 var {
3044 svg,
3045 trigger,
3046 closeOnClick,
3047 placement,
3048 modifiers,
3049 hasChrome,
3050 tooltip,
3051 children,
3052 tooltipShown,
3053 onVisibilityChange
3054 } = _a,
3055 props = index.__rest(_a, ["svg", "trigger", "closeOnClick", "placement", "modifiers", "hasChrome", "tooltip", "children", "tooltipShown", "onVisibilityChange"]);
3056
3057 const Container = svg ? TargetSvgContainer : TargetContainer;
3058 return React__default["default"].createElement(TooltipTrigger$1, {
3059 placement: placement,
3060 trigger: trigger,
3061 modifiers: modifiers,
3062 tooltipShown: tooltipShown,
3063 onVisibilityChange: onVisibilityChange,
3064 tooltip: ({
3065 getTooltipProps,
3066 getArrowProps,
3067 tooltipRef,
3068 arrowRef,
3069 placement: tooltipPlacement
3070 }) => React__default["default"].createElement(Tooltip, Object.assign({
3071 hasChrome: hasChrome,
3072 placement: tooltipPlacement,
3073 tooltipRef: tooltipRef,
3074 arrowRef: arrowRef,
3075 arrowProps: getArrowProps()
3076 }, getTooltipProps()), typeof tooltip === 'function' ? tooltip({
3077 onHide: () => onVisibilityChange(false)
3078 }) : tooltip)
3079 }, ({
3080 getTriggerProps,
3081 triggerRef
3082 }) => // @ts-ignore
3083 React__default["default"].createElement(Container, Object.assign({
3084 ref: triggerRef
3085 }, getTriggerProps(), props), children));
3086};
3087
3088WithTooltipPure.defaultProps = {
3089 svg: false,
3090 trigger: 'hover',
3091 closeOnClick: false,
3092 placement: 'top',
3093 modifiers: [{
3094 name: 'preventOverflow',
3095 options: {
3096 padding: 8
3097 }
3098 }, {
3099 name: 'offset',
3100 options: {
3101 offset: [8, 8]
3102 }
3103 }, {
3104 name: 'arrow',
3105 options: {
3106 padding: 8
3107 }
3108 }],
3109 hasChrome: true,
3110 tooltipShown: false
3111};
3112
3113const WithToolTipState = _a => {
3114 var {
3115 startOpen,
3116 onVisibilityChange: onChange
3117 } = _a,
3118 rest = index.__rest(_a, ["startOpen", "onVisibilityChange"]);
3119
3120 const [tooltipShown, setTooltipShown] = React.useState(startOpen || false);
3121 const onVisibilityChange = React.useCallback(visibility => {
3122 if (onChange && onChange(visibility) === false) return;
3123 setTooltipShown(visibility);
3124 }, [onChange]);
3125 React.useEffect(() => {
3126 const hide = () => onVisibilityChange(false);
3127
3128 document$1.addEventListener('keydown', hide, false); // Find all iframes on the screen and bind to clicks inside them (waiting until the iframe is ready)
3129
3130 const iframes = Array.from(document$1.getElementsByTagName('iframe'));
3131 const unbinders = [];
3132 iframes.forEach(iframe => {
3133 const bind = () => {
3134 try {
3135 if (iframe.contentWindow.document) {
3136 iframe.contentWindow.document.addEventListener('click', hide);
3137 unbinders.push(() => {
3138 try {
3139 iframe.contentWindow.document.removeEventListener('click', hide);
3140 } catch (e) {// logger.debug('Removing a click listener from iframe failed: ', e);
3141 }
3142 });
3143 }
3144 } catch (e) {// logger.debug('Adding a click listener to iframe failed: ', e);
3145 }
3146 };
3147
3148 bind(); // I don't know how to find out if it's already loaded so I potentially will bind twice
3149
3150 iframe.addEventListener('load', bind);
3151 unbinders.push(() => {
3152 iframe.removeEventListener('load', bind);
3153 });
3154 });
3155 return () => {
3156 document$1.removeEventListener('keydown', hide);
3157 unbinders.forEach(unbind => {
3158 unbind();
3159 });
3160 };
3161 });
3162 return React__default["default"].createElement(WithTooltipPure, Object.assign({}, rest, {
3163 tooltipShown: tooltipShown,
3164 onVisibilityChange: onVisibilityChange
3165 }));
3166};
3167
3168exports.WithToolTipState = WithToolTipState;
3169exports.WithTooltip = WithToolTipState;
3170exports.WithTooltipPure = WithTooltipPure;