vue-tippy 6.0.0-alpha.31 → 6.0.0-alpha.35

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4251 +0,0 @@
1
- /*!
2
- * vue-tippy v6.0.0-alpha.30
3
- * (c) 2021 Georges KABBOUCHI
4
- * @license MIT
5
- */
6
- import { getCurrentInstance, ref, onMounted, onUnmounted, isRef, isReactive, watch, isVNode, render as render$1, h, defineComponent } from 'vue';
7
-
8
- var top = 'top';
9
- var bottom = 'bottom';
10
- var right = 'right';
11
- var left = 'left';
12
- var auto = 'auto';
13
- var basePlacements = [top, bottom, right, left];
14
- var start = 'start';
15
- var end = 'end';
16
- var clippingParents = 'clippingParents';
17
- var viewport = 'viewport';
18
- var popper = 'popper';
19
- var reference = 'reference';
20
- var variationPlacements = /*#__PURE__*/basePlacements.reduce(function (acc, placement) {
21
- return acc.concat([placement + "-" + start, placement + "-" + end]);
22
- }, []);
23
- var placements = /*#__PURE__*/[].concat(basePlacements, [auto]).reduce(function (acc, placement) {
24
- return acc.concat([placement, placement + "-" + start, placement + "-" + end]);
25
- }, []); // modifiers that need to read the DOM
26
-
27
- var beforeRead = 'beforeRead';
28
- var read = 'read';
29
- var afterRead = 'afterRead'; // pure-logic modifiers
30
-
31
- var beforeMain = 'beforeMain';
32
- var main = 'main';
33
- var afterMain = 'afterMain'; // modifier with the purpose to write to the DOM (or write into a framework state)
34
-
35
- var beforeWrite = 'beforeWrite';
36
- var write = 'write';
37
- var afterWrite = 'afterWrite';
38
- var modifierPhases = [beforeRead, read, afterRead, beforeMain, main, afterMain, beforeWrite, write, afterWrite];
39
-
40
- function getNodeName(element) {
41
- return element ? (element.nodeName || '').toLowerCase() : null;
42
- }
43
-
44
- function getWindow(node) {
45
- if (node == null) {
46
- return window;
47
- }
48
-
49
- if (node.toString() !== '[object Window]') {
50
- var ownerDocument = node.ownerDocument;
51
- return ownerDocument ? ownerDocument.defaultView || window : window;
52
- }
53
-
54
- return node;
55
- }
56
-
57
- function isElement(node) {
58
- var OwnElement = getWindow(node).Element;
59
- return node instanceof OwnElement || node instanceof Element;
60
- }
61
-
62
- function isHTMLElement(node) {
63
- var OwnElement = getWindow(node).HTMLElement;
64
- return node instanceof OwnElement || node instanceof HTMLElement;
65
- }
66
-
67
- function isShadowRoot(node) {
68
- // IE 11 has no ShadowRoot
69
- if (typeof ShadowRoot === 'undefined') {
70
- return false;
71
- }
72
-
73
- var OwnElement = getWindow(node).ShadowRoot;
74
- return node instanceof OwnElement || node instanceof ShadowRoot;
75
- }
76
-
77
- // and applies them to the HTMLElements such as popper and arrow
78
-
79
- function applyStyles(_ref) {
80
- var state = _ref.state;
81
- Object.keys(state.elements).forEach(function (name) {
82
- var style = state.styles[name] || {};
83
- var attributes = state.attributes[name] || {};
84
- var element = state.elements[name]; // arrow is optional + virtual elements
85
-
86
- if (!isHTMLElement(element) || !getNodeName(element)) {
87
- return;
88
- } // Flow doesn't support to extend this property, but it's the most
89
- // effective way to apply styles to an HTMLElement
90
- // $FlowFixMe[cannot-write]
91
-
92
-
93
- Object.assign(element.style, style);
94
- Object.keys(attributes).forEach(function (name) {
95
- var value = attributes[name];
96
-
97
- if (value === false) {
98
- element.removeAttribute(name);
99
- } else {
100
- element.setAttribute(name, value === true ? '' : value);
101
- }
102
- });
103
- });
104
- }
105
-
106
- function effect(_ref2) {
107
- var state = _ref2.state;
108
- var initialStyles = {
109
- popper: {
110
- position: state.options.strategy,
111
- left: '0',
112
- top: '0',
113
- margin: '0'
114
- },
115
- arrow: {
116
- position: 'absolute'
117
- },
118
- reference: {}
119
- };
120
- Object.assign(state.elements.popper.style, initialStyles.popper);
121
- state.styles = initialStyles;
122
-
123
- if (state.elements.arrow) {
124
- Object.assign(state.elements.arrow.style, initialStyles.arrow);
125
- }
126
-
127
- return function () {
128
- Object.keys(state.elements).forEach(function (name) {
129
- var element = state.elements[name];
130
- var attributes = state.attributes[name] || {};
131
- var styleProperties = Object.keys(state.styles.hasOwnProperty(name) ? state.styles[name] : initialStyles[name]); // Set all values to an empty string to unset them
132
-
133
- var style = styleProperties.reduce(function (style, property) {
134
- style[property] = '';
135
- return style;
136
- }, {}); // arrow is optional + virtual elements
137
-
138
- if (!isHTMLElement(element) || !getNodeName(element)) {
139
- return;
140
- }
141
-
142
- Object.assign(element.style, style);
143
- Object.keys(attributes).forEach(function (attribute) {
144
- element.removeAttribute(attribute);
145
- });
146
- });
147
- };
148
- } // eslint-disable-next-line import/no-unused-modules
149
-
150
-
151
- var applyStyles$1 = {
152
- name: 'applyStyles',
153
- enabled: true,
154
- phase: 'write',
155
- fn: applyStyles,
156
- effect: effect,
157
- requires: ['computeStyles']
158
- };
159
-
160
- function getBasePlacement(placement) {
161
- return placement.split('-')[0];
162
- }
163
-
164
- function getBoundingClientRect(element) {
165
- var rect = element.getBoundingClientRect();
166
- return {
167
- width: rect.width,
168
- height: rect.height,
169
- top: rect.top,
170
- right: rect.right,
171
- bottom: rect.bottom,
172
- left: rect.left,
173
- x: rect.left,
174
- y: rect.top
175
- };
176
- }
177
-
178
- // means it doesn't take into account transforms.
179
-
180
- function getLayoutRect(element) {
181
- var clientRect = getBoundingClientRect(element); // Use the clientRect sizes if it's not been transformed.
182
- // Fixes https://github.com/popperjs/popper-core/issues/1223
183
-
184
- var width = element.offsetWidth;
185
- var height = element.offsetHeight;
186
-
187
- if (Math.abs(clientRect.width - width) <= 1) {
188
- width = clientRect.width;
189
- }
190
-
191
- if (Math.abs(clientRect.height - height) <= 1) {
192
- height = clientRect.height;
193
- }
194
-
195
- return {
196
- x: element.offsetLeft,
197
- y: element.offsetTop,
198
- width: width,
199
- height: height
200
- };
201
- }
202
-
203
- function contains(parent, child) {
204
- var rootNode = child.getRootNode && child.getRootNode(); // First, attempt with faster native method
205
-
206
- if (parent.contains(child)) {
207
- return true;
208
- } // then fallback to custom implementation with Shadow DOM support
209
- else if (rootNode && isShadowRoot(rootNode)) {
210
- var next = child;
211
-
212
- do {
213
- if (next && parent.isSameNode(next)) {
214
- return true;
215
- } // $FlowFixMe[prop-missing]: need a better way to handle this...
216
-
217
-
218
- next = next.parentNode || next.host;
219
- } while (next);
220
- } // Give up, the result is false
221
-
222
-
223
- return false;
224
- }
225
-
226
- function getComputedStyle(element) {
227
- return getWindow(element).getComputedStyle(element);
228
- }
229
-
230
- function isTableElement(element) {
231
- return ['table', 'td', 'th'].indexOf(getNodeName(element)) >= 0;
232
- }
233
-
234
- function getDocumentElement(element) {
235
- // $FlowFixMe[incompatible-return]: assume body is always available
236
- return ((isElement(element) ? element.ownerDocument : // $FlowFixMe[prop-missing]
237
- element.document) || window.document).documentElement;
238
- }
239
-
240
- function getParentNode(element) {
241
- if (getNodeName(element) === 'html') {
242
- return element;
243
- }
244
-
245
- return (// this is a quicker (but less type safe) way to save quite some bytes from the bundle
246
- // $FlowFixMe[incompatible-return]
247
- // $FlowFixMe[prop-missing]
248
- element.assignedSlot || // step into the shadow DOM of the parent of a slotted node
249
- element.parentNode || ( // DOM Element detected
250
- isShadowRoot(element) ? element.host : null) || // ShadowRoot detected
251
- // $FlowFixMe[incompatible-call]: HTMLElement is a Node
252
- getDocumentElement(element) // fallback
253
-
254
- );
255
- }
256
-
257
- function getTrueOffsetParent(element) {
258
- if (!isHTMLElement(element) || // https://github.com/popperjs/popper-core/issues/837
259
- getComputedStyle(element).position === 'fixed') {
260
- return null;
261
- }
262
-
263
- return element.offsetParent;
264
- } // `.offsetParent` reports `null` for fixed elements, while absolute elements
265
- // return the containing block
266
-
267
-
268
- function getContainingBlock(element) {
269
- var isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') !== -1;
270
- var isIE = navigator.userAgent.indexOf('Trident') !== -1;
271
-
272
- if (isIE && isHTMLElement(element)) {
273
- // In IE 9, 10 and 11 fixed elements containing block is always established by the viewport
274
- var elementCss = getComputedStyle(element);
275
-
276
- if (elementCss.position === 'fixed') {
277
- return null;
278
- }
279
- }
280
-
281
- var currentNode = getParentNode(element);
282
-
283
- while (isHTMLElement(currentNode) && ['html', 'body'].indexOf(getNodeName(currentNode)) < 0) {
284
- var css = getComputedStyle(currentNode); // This is non-exhaustive but covers the most common CSS properties that
285
- // create a containing block.
286
- // https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
287
-
288
- 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') {
289
- return currentNode;
290
- } else {
291
- currentNode = currentNode.parentNode;
292
- }
293
- }
294
-
295
- return null;
296
- } // Gets the closest ancestor positioned element. Handles some edge cases,
297
- // such as table ancestors and cross browser bugs.
298
-
299
-
300
- function getOffsetParent(element) {
301
- var window = getWindow(element);
302
- var offsetParent = getTrueOffsetParent(element);
303
-
304
- while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === 'static') {
305
- offsetParent = getTrueOffsetParent(offsetParent);
306
- }
307
-
308
- if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle(offsetParent).position === 'static')) {
309
- return window;
310
- }
311
-
312
- return offsetParent || getContainingBlock(element) || window;
313
- }
314
-
315
- function getMainAxisFromPlacement(placement) {
316
- return ['top', 'bottom'].indexOf(placement) >= 0 ? 'x' : 'y';
317
- }
318
-
319
- var max = Math.max;
320
- var min = Math.min;
321
- var round = Math.round;
322
-
323
- function within(min$1, value, max$1) {
324
- return max(min$1, min(value, max$1));
325
- }
326
-
327
- function getFreshSideObject() {
328
- return {
329
- top: 0,
330
- right: 0,
331
- bottom: 0,
332
- left: 0
333
- };
334
- }
335
-
336
- function mergePaddingObject(paddingObject) {
337
- return Object.assign({}, getFreshSideObject(), paddingObject);
338
- }
339
-
340
- function expandToHashMap(value, keys) {
341
- return keys.reduce(function (hashMap, key) {
342
- hashMap[key] = value;
343
- return hashMap;
344
- }, {});
345
- }
346
-
347
- var toPaddingObject = function toPaddingObject(padding, state) {
348
- padding = typeof padding === 'function' ? padding(Object.assign({}, state.rects, {
349
- placement: state.placement
350
- })) : padding;
351
- return mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
352
- };
353
-
354
- function arrow(_ref) {
355
- var _state$modifiersData$;
356
-
357
- var state = _ref.state,
358
- name = _ref.name,
359
- options = _ref.options;
360
- var arrowElement = state.elements.arrow;
361
- var popperOffsets = state.modifiersData.popperOffsets;
362
- var basePlacement = getBasePlacement(state.placement);
363
- var axis = getMainAxisFromPlacement(basePlacement);
364
- var isVertical = [left, right].indexOf(basePlacement) >= 0;
365
- var len = isVertical ? 'height' : 'width';
366
-
367
- if (!arrowElement || !popperOffsets) {
368
- return;
369
- }
370
-
371
- var paddingObject = toPaddingObject(options.padding, state);
372
- var arrowRect = getLayoutRect(arrowElement);
373
- var minProp = axis === 'y' ? top : left;
374
- var maxProp = axis === 'y' ? bottom : right;
375
- var endDiff = state.rects.reference[len] + state.rects.reference[axis] - popperOffsets[axis] - state.rects.popper[len];
376
- var startDiff = popperOffsets[axis] - state.rects.reference[axis];
377
- var arrowOffsetParent = getOffsetParent(arrowElement);
378
- var clientSize = arrowOffsetParent ? axis === 'y' ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;
379
- var centerToReference = endDiff / 2 - startDiff / 2; // Make sure the arrow doesn't overflow the popper if the center point is
380
- // outside of the popper bounds
381
-
382
- var min = paddingObject[minProp];
383
- var max = clientSize - arrowRect[len] - paddingObject[maxProp];
384
- var center = clientSize / 2 - arrowRect[len] / 2 + centerToReference;
385
- var offset = within(min, center, max); // Prevents breaking syntax highlighting...
386
-
387
- var axisProp = axis;
388
- state.modifiersData[name] = (_state$modifiersData$ = {}, _state$modifiersData$[axisProp] = offset, _state$modifiersData$.centerOffset = offset - center, _state$modifiersData$);
389
- }
390
-
391
- function effect$1(_ref2) {
392
- var state = _ref2.state,
393
- options = _ref2.options;
394
- var _options$element = options.element,
395
- arrowElement = _options$element === void 0 ? '[data-popper-arrow]' : _options$element;
396
-
397
- if (arrowElement == null) {
398
- return;
399
- } // CSS selector
400
-
401
-
402
- if (typeof arrowElement === 'string') {
403
- arrowElement = state.elements.popper.querySelector(arrowElement);
404
-
405
- if (!arrowElement) {
406
- return;
407
- }
408
- }
409
-
410
- if (!contains(state.elements.popper, arrowElement)) {
411
-
412
- return;
413
- }
414
-
415
- state.elements.arrow = arrowElement;
416
- } // eslint-disable-next-line import/no-unused-modules
417
-
418
-
419
- var arrow$1 = {
420
- name: 'arrow',
421
- enabled: true,
422
- phase: 'main',
423
- fn: arrow,
424
- effect: effect$1,
425
- requires: ['popperOffsets'],
426
- requiresIfExists: ['preventOverflow']
427
- };
428
-
429
- var unsetSides = {
430
- top: 'auto',
431
- right: 'auto',
432
- bottom: 'auto',
433
- left: 'auto'
434
- }; // Round the offsets to the nearest suitable subpixel based on the DPR.
435
- // Zooming can change the DPR, but it seems to report a value that will
436
- // cleanly divide the values into the appropriate subpixels.
437
-
438
- function roundOffsetsByDPR(_ref) {
439
- var x = _ref.x,
440
- y = _ref.y;
441
- var win = window;
442
- var dpr = win.devicePixelRatio || 1;
443
- return {
444
- x: round(round(x * dpr) / dpr) || 0,
445
- y: round(round(y * dpr) / dpr) || 0
446
- };
447
- }
448
-
449
- function mapToStyles(_ref2) {
450
- var _Object$assign2;
451
-
452
- var popper = _ref2.popper,
453
- popperRect = _ref2.popperRect,
454
- placement = _ref2.placement,
455
- offsets = _ref2.offsets,
456
- position = _ref2.position,
457
- gpuAcceleration = _ref2.gpuAcceleration,
458
- adaptive = _ref2.adaptive,
459
- roundOffsets = _ref2.roundOffsets;
460
-
461
- var _ref3 = roundOffsets === true ? roundOffsetsByDPR(offsets) : typeof roundOffsets === 'function' ? roundOffsets(offsets) : offsets,
462
- _ref3$x = _ref3.x,
463
- x = _ref3$x === void 0 ? 0 : _ref3$x,
464
- _ref3$y = _ref3.y,
465
- y = _ref3$y === void 0 ? 0 : _ref3$y;
466
-
467
- var hasX = offsets.hasOwnProperty('x');
468
- var hasY = offsets.hasOwnProperty('y');
469
- var sideX = left;
470
- var sideY = top;
471
- var win = window;
472
-
473
- if (adaptive) {
474
- var offsetParent = getOffsetParent(popper);
475
- var heightProp = 'clientHeight';
476
- var widthProp = 'clientWidth';
477
-
478
- if (offsetParent === getWindow(popper)) {
479
- offsetParent = getDocumentElement(popper);
480
-
481
- if (getComputedStyle(offsetParent).position !== 'static') {
482
- heightProp = 'scrollHeight';
483
- widthProp = 'scrollWidth';
484
- }
485
- } // $FlowFixMe[incompatible-cast]: force type refinement, we compare offsetParent with window above, but Flow doesn't detect it
486
-
487
-
488
- offsetParent = offsetParent;
489
-
490
- if (placement === top) {
491
- sideY = bottom; // $FlowFixMe[prop-missing]
492
-
493
- y -= offsetParent[heightProp] - popperRect.height;
494
- y *= gpuAcceleration ? 1 : -1;
495
- }
496
-
497
- if (placement === left) {
498
- sideX = right; // $FlowFixMe[prop-missing]
499
-
500
- x -= offsetParent[widthProp] - popperRect.width;
501
- x *= gpuAcceleration ? 1 : -1;
502
- }
503
- }
504
-
505
- var commonStyles = Object.assign({
506
- position: position
507
- }, adaptive && unsetSides);
508
-
509
- if (gpuAcceleration) {
510
- var _Object$assign;
511
-
512
- return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? '0' : '', _Object$assign[sideX] = hasX ? '0' : '', _Object$assign.transform = (win.devicePixelRatio || 1) < 2 ? "translate(" + x + "px, " + y + "px)" : "translate3d(" + x + "px, " + y + "px, 0)", _Object$assign));
513
- }
514
-
515
- return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : '', _Object$assign2[sideX] = hasX ? x + "px" : '', _Object$assign2.transform = '', _Object$assign2));
516
- }
517
-
518
- function computeStyles(_ref4) {
519
- var state = _ref4.state,
520
- options = _ref4.options;
521
- var _options$gpuAccelerat = options.gpuAcceleration,
522
- gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat,
523
- _options$adaptive = options.adaptive,
524
- adaptive = _options$adaptive === void 0 ? true : _options$adaptive,
525
- _options$roundOffsets = options.roundOffsets,
526
- roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;
527
-
528
- var commonStyles = {
529
- placement: getBasePlacement(state.placement),
530
- popper: state.elements.popper,
531
- popperRect: state.rects.popper,
532
- gpuAcceleration: gpuAcceleration
533
- };
534
-
535
- if (state.modifiersData.popperOffsets != null) {
536
- state.styles.popper = Object.assign({}, state.styles.popper, mapToStyles(Object.assign({}, commonStyles, {
537
- offsets: state.modifiersData.popperOffsets,
538
- position: state.options.strategy,
539
- adaptive: adaptive,
540
- roundOffsets: roundOffsets
541
- })));
542
- }
543
-
544
- if (state.modifiersData.arrow != null) {
545
- state.styles.arrow = Object.assign({}, state.styles.arrow, mapToStyles(Object.assign({}, commonStyles, {
546
- offsets: state.modifiersData.arrow,
547
- position: 'absolute',
548
- adaptive: false,
549
- roundOffsets: roundOffsets
550
- })));
551
- }
552
-
553
- state.attributes.popper = Object.assign({}, state.attributes.popper, {
554
- 'data-popper-placement': state.placement
555
- });
556
- } // eslint-disable-next-line import/no-unused-modules
557
-
558
-
559
- var computeStyles$1 = {
560
- name: 'computeStyles',
561
- enabled: true,
562
- phase: 'beforeWrite',
563
- fn: computeStyles,
564
- data: {}
565
- };
566
-
567
- var passive = {
568
- passive: true
569
- };
570
-
571
- function effect$2(_ref) {
572
- var state = _ref.state,
573
- instance = _ref.instance,
574
- options = _ref.options;
575
- var _options$scroll = options.scroll,
576
- scroll = _options$scroll === void 0 ? true : _options$scroll,
577
- _options$resize = options.resize,
578
- resize = _options$resize === void 0 ? true : _options$resize;
579
- var window = getWindow(state.elements.popper);
580
- var scrollParents = [].concat(state.scrollParents.reference, state.scrollParents.popper);
581
-
582
- if (scroll) {
583
- scrollParents.forEach(function (scrollParent) {
584
- scrollParent.addEventListener('scroll', instance.update, passive);
585
- });
586
- }
587
-
588
- if (resize) {
589
- window.addEventListener('resize', instance.update, passive);
590
- }
591
-
592
- return function () {
593
- if (scroll) {
594
- scrollParents.forEach(function (scrollParent) {
595
- scrollParent.removeEventListener('scroll', instance.update, passive);
596
- });
597
- }
598
-
599
- if (resize) {
600
- window.removeEventListener('resize', instance.update, passive);
601
- }
602
- };
603
- } // eslint-disable-next-line import/no-unused-modules
604
-
605
-
606
- var eventListeners = {
607
- name: 'eventListeners',
608
- enabled: true,
609
- phase: 'write',
610
- fn: function fn() {},
611
- effect: effect$2,
612
- data: {}
613
- };
614
-
615
- var hash = {
616
- left: 'right',
617
- right: 'left',
618
- bottom: 'top',
619
- top: 'bottom'
620
- };
621
- function getOppositePlacement(placement) {
622
- return placement.replace(/left|right|bottom|top/g, function (matched) {
623
- return hash[matched];
624
- });
625
- }
626
-
627
- var hash$1 = {
628
- start: 'end',
629
- end: 'start'
630
- };
631
- function getOppositeVariationPlacement(placement) {
632
- return placement.replace(/start|end/g, function (matched) {
633
- return hash$1[matched];
634
- });
635
- }
636
-
637
- function getWindowScroll(node) {
638
- var win = getWindow(node);
639
- var scrollLeft = win.pageXOffset;
640
- var scrollTop = win.pageYOffset;
641
- return {
642
- scrollLeft: scrollLeft,
643
- scrollTop: scrollTop
644
- };
645
- }
646
-
647
- function getWindowScrollBarX(element) {
648
- // If <html> has a CSS width greater than the viewport, then this will be
649
- // incorrect for RTL.
650
- // Popper 1 is broken in this case and never had a bug report so let's assume
651
- // it's not an issue. I don't think anyone ever specifies width on <html>
652
- // anyway.
653
- // Browsers where the left scrollbar doesn't cause an issue report `0` for
654
- // this (e.g. Edge 2019, IE11, Safari)
655
- return getBoundingClientRect(getDocumentElement(element)).left + getWindowScroll(element).scrollLeft;
656
- }
657
-
658
- function getViewportRect(element) {
659
- var win = getWindow(element);
660
- var html = getDocumentElement(element);
661
- var visualViewport = win.visualViewport;
662
- var width = html.clientWidth;
663
- var height = html.clientHeight;
664
- var x = 0;
665
- var y = 0; // NB: This isn't supported on iOS <= 12. If the keyboard is open, the popper
666
- // can be obscured underneath it.
667
- // Also, `html.clientHeight` adds the bottom bar height in Safari iOS, even
668
- // if it isn't open, so if this isn't available, the popper will be detected
669
- // to overflow the bottom of the screen too early.
670
-
671
- if (visualViewport) {
672
- width = visualViewport.width;
673
- height = visualViewport.height; // Uses Layout Viewport (like Chrome; Safari does not currently)
674
- // In Chrome, it returns a value very close to 0 (+/-) but contains rounding
675
- // errors due to floating point numbers, so we need to check precision.
676
- // Safari returns a number <= 0, usually < -1 when pinch-zoomed
677
- // Feature detection fails in mobile emulation mode in Chrome.
678
- // Math.abs(win.innerWidth / visualViewport.scale - visualViewport.width) <
679
- // 0.001
680
- // Fallback here: "Not Safari" userAgent
681
-
682
- if (!/^((?!chrome|android).)*safari/i.test(navigator.userAgent)) {
683
- x = visualViewport.offsetLeft;
684
- y = visualViewport.offsetTop;
685
- }
686
- }
687
-
688
- return {
689
- width: width,
690
- height: height,
691
- x: x + getWindowScrollBarX(element),
692
- y: y
693
- };
694
- }
695
-
696
- // of the `<html>` and `<body>` rect bounds if horizontally scrollable
697
-
698
- function getDocumentRect(element) {
699
- var _element$ownerDocumen;
700
-
701
- var html = getDocumentElement(element);
702
- var winScroll = getWindowScroll(element);
703
- var body = (_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body;
704
- var width = max(html.scrollWidth, html.clientWidth, body ? body.scrollWidth : 0, body ? body.clientWidth : 0);
705
- var height = max(html.scrollHeight, html.clientHeight, body ? body.scrollHeight : 0, body ? body.clientHeight : 0);
706
- var x = -winScroll.scrollLeft + getWindowScrollBarX(element);
707
- var y = -winScroll.scrollTop;
708
-
709
- if (getComputedStyle(body || html).direction === 'rtl') {
710
- x += max(html.clientWidth, body ? body.clientWidth : 0) - width;
711
- }
712
-
713
- return {
714
- width: width,
715
- height: height,
716
- x: x,
717
- y: y
718
- };
719
- }
720
-
721
- function isScrollParent(element) {
722
- // Firefox wants us to check `-x` and `-y` variations as well
723
- var _getComputedStyle = getComputedStyle(element),
724
- overflow = _getComputedStyle.overflow,
725
- overflowX = _getComputedStyle.overflowX,
726
- overflowY = _getComputedStyle.overflowY;
727
-
728
- return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
729
- }
730
-
731
- function getScrollParent(node) {
732
- if (['html', 'body', '#document'].indexOf(getNodeName(node)) >= 0) {
733
- // $FlowFixMe[incompatible-return]: assume body is always available
734
- return node.ownerDocument.body;
735
- }
736
-
737
- if (isHTMLElement(node) && isScrollParent(node)) {
738
- return node;
739
- }
740
-
741
- return getScrollParent(getParentNode(node));
742
- }
743
-
744
- /*
745
- given a DOM element, return the list of all scroll parents, up the list of ancesors
746
- until we get to the top window object. This list is what we attach scroll listeners
747
- to, because if any of these parent elements scroll, we'll need to re-calculate the
748
- reference element's position.
749
- */
750
-
751
- function listScrollParents(element, list) {
752
- var _element$ownerDocumen;
753
-
754
- if (list === void 0) {
755
- list = [];
756
- }
757
-
758
- var scrollParent = getScrollParent(element);
759
- var isBody = scrollParent === ((_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body);
760
- var win = getWindow(scrollParent);
761
- var target = isBody ? [win].concat(win.visualViewport || [], isScrollParent(scrollParent) ? scrollParent : []) : scrollParent;
762
- var updatedList = list.concat(target);
763
- return isBody ? updatedList : // $FlowFixMe[incompatible-call]: isBody tells us target will be an HTMLElement here
764
- updatedList.concat(listScrollParents(getParentNode(target)));
765
- }
766
-
767
- function rectToClientRect(rect) {
768
- return Object.assign({}, rect, {
769
- left: rect.x,
770
- top: rect.y,
771
- right: rect.x + rect.width,
772
- bottom: rect.y + rect.height
773
- });
774
- }
775
-
776
- function getInnerBoundingClientRect(element) {
777
- var rect = getBoundingClientRect(element);
778
- rect.top = rect.top + element.clientTop;
779
- rect.left = rect.left + element.clientLeft;
780
- rect.bottom = rect.top + element.clientHeight;
781
- rect.right = rect.left + element.clientWidth;
782
- rect.width = element.clientWidth;
783
- rect.height = element.clientHeight;
784
- rect.x = rect.left;
785
- rect.y = rect.top;
786
- return rect;
787
- }
788
-
789
- function getClientRectFromMixedType(element, clippingParent) {
790
- return clippingParent === viewport ? rectToClientRect(getViewportRect(element)) : isHTMLElement(clippingParent) ? getInnerBoundingClientRect(clippingParent) : rectToClientRect(getDocumentRect(getDocumentElement(element)));
791
- } // A "clipping parent" is an overflowable container with the characteristic of
792
- // clipping (or hiding) overflowing elements with a position different from
793
- // `initial`
794
-
795
-
796
- function getClippingParents(element) {
797
- var clippingParents = listScrollParents(getParentNode(element));
798
- var canEscapeClipping = ['absolute', 'fixed'].indexOf(getComputedStyle(element).position) >= 0;
799
- var clipperElement = canEscapeClipping && isHTMLElement(element) ? getOffsetParent(element) : element;
800
-
801
- if (!isElement(clipperElement)) {
802
- return [];
803
- } // $FlowFixMe[incompatible-return]: https://github.com/facebook/flow/issues/1414
804
-
805
-
806
- return clippingParents.filter(function (clippingParent) {
807
- return isElement(clippingParent) && contains(clippingParent, clipperElement) && getNodeName(clippingParent) !== 'body';
808
- });
809
- } // Gets the maximum area that the element is visible in due to any number of
810
- // clipping parents
811
-
812
-
813
- function getClippingRect(element, boundary, rootBoundary) {
814
- var mainClippingParents = boundary === 'clippingParents' ? getClippingParents(element) : [].concat(boundary);
815
- var clippingParents = [].concat(mainClippingParents, [rootBoundary]);
816
- var firstClippingParent = clippingParents[0];
817
- var clippingRect = clippingParents.reduce(function (accRect, clippingParent) {
818
- var rect = getClientRectFromMixedType(element, clippingParent);
819
- accRect.top = max(rect.top, accRect.top);
820
- accRect.right = min(rect.right, accRect.right);
821
- accRect.bottom = min(rect.bottom, accRect.bottom);
822
- accRect.left = max(rect.left, accRect.left);
823
- return accRect;
824
- }, getClientRectFromMixedType(element, firstClippingParent));
825
- clippingRect.width = clippingRect.right - clippingRect.left;
826
- clippingRect.height = clippingRect.bottom - clippingRect.top;
827
- clippingRect.x = clippingRect.left;
828
- clippingRect.y = clippingRect.top;
829
- return clippingRect;
830
- }
831
-
832
- function getVariation(placement) {
833
- return placement.split('-')[1];
834
- }
835
-
836
- function computeOffsets(_ref) {
837
- var reference = _ref.reference,
838
- element = _ref.element,
839
- placement = _ref.placement;
840
- var basePlacement = placement ? getBasePlacement(placement) : null;
841
- var variation = placement ? getVariation(placement) : null;
842
- var commonX = reference.x + reference.width / 2 - element.width / 2;
843
- var commonY = reference.y + reference.height / 2 - element.height / 2;
844
- var offsets;
845
-
846
- switch (basePlacement) {
847
- case top:
848
- offsets = {
849
- x: commonX,
850
- y: reference.y - element.height
851
- };
852
- break;
853
-
854
- case bottom:
855
- offsets = {
856
- x: commonX,
857
- y: reference.y + reference.height
858
- };
859
- break;
860
-
861
- case right:
862
- offsets = {
863
- x: reference.x + reference.width,
864
- y: commonY
865
- };
866
- break;
867
-
868
- case left:
869
- offsets = {
870
- x: reference.x - element.width,
871
- y: commonY
872
- };
873
- break;
874
-
875
- default:
876
- offsets = {
877
- x: reference.x,
878
- y: reference.y
879
- };
880
- }
881
-
882
- var mainAxis = basePlacement ? getMainAxisFromPlacement(basePlacement) : null;
883
-
884
- if (mainAxis != null) {
885
- var len = mainAxis === 'y' ? 'height' : 'width';
886
-
887
- switch (variation) {
888
- case start:
889
- offsets[mainAxis] = offsets[mainAxis] - (reference[len] / 2 - element[len] / 2);
890
- break;
891
-
892
- case end:
893
- offsets[mainAxis] = offsets[mainAxis] + (reference[len] / 2 - element[len] / 2);
894
- break;
895
- }
896
- }
897
-
898
- return offsets;
899
- }
900
-
901
- function detectOverflow(state, options) {
902
- if (options === void 0) {
903
- options = {};
904
- }
905
-
906
- var _options = options,
907
- _options$placement = _options.placement,
908
- placement = _options$placement === void 0 ? state.placement : _options$placement,
909
- _options$boundary = _options.boundary,
910
- boundary = _options$boundary === void 0 ? clippingParents : _options$boundary,
911
- _options$rootBoundary = _options.rootBoundary,
912
- rootBoundary = _options$rootBoundary === void 0 ? viewport : _options$rootBoundary,
913
- _options$elementConte = _options.elementContext,
914
- elementContext = _options$elementConte === void 0 ? popper : _options$elementConte,
915
- _options$altBoundary = _options.altBoundary,
916
- altBoundary = _options$altBoundary === void 0 ? false : _options$altBoundary,
917
- _options$padding = _options.padding,
918
- padding = _options$padding === void 0 ? 0 : _options$padding;
919
- var paddingObject = mergePaddingObject(typeof padding !== 'number' ? padding : expandToHashMap(padding, basePlacements));
920
- var altContext = elementContext === popper ? reference : popper;
921
- var referenceElement = state.elements.reference;
922
- var popperRect = state.rects.popper;
923
- var element = state.elements[altBoundary ? altContext : elementContext];
924
- var clippingClientRect = getClippingRect(isElement(element) ? element : element.contextElement || getDocumentElement(state.elements.popper), boundary, rootBoundary);
925
- var referenceClientRect = getBoundingClientRect(referenceElement);
926
- var popperOffsets = computeOffsets({
927
- reference: referenceClientRect,
928
- element: popperRect,
929
- strategy: 'absolute',
930
- placement: placement
931
- });
932
- var popperClientRect = rectToClientRect(Object.assign({}, popperRect, popperOffsets));
933
- var elementClientRect = elementContext === popper ? popperClientRect : referenceClientRect; // positive = overflowing the clipping rect
934
- // 0 or negative = within the clipping rect
935
-
936
- var overflowOffsets = {
937
- top: clippingClientRect.top - elementClientRect.top + paddingObject.top,
938
- bottom: elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom,
939
- left: clippingClientRect.left - elementClientRect.left + paddingObject.left,
940
- right: elementClientRect.right - clippingClientRect.right + paddingObject.right
941
- };
942
- var offsetData = state.modifiersData.offset; // Offsets can be applied only to the popper element
943
-
944
- if (elementContext === popper && offsetData) {
945
- var offset = offsetData[placement];
946
- Object.keys(overflowOffsets).forEach(function (key) {
947
- var multiply = [right, bottom].indexOf(key) >= 0 ? 1 : -1;
948
- var axis = [top, bottom].indexOf(key) >= 0 ? 'y' : 'x';
949
- overflowOffsets[key] += offset[axis] * multiply;
950
- });
951
- }
952
-
953
- return overflowOffsets;
954
- }
955
-
956
- function computeAutoPlacement(state, options) {
957
- if (options === void 0) {
958
- options = {};
959
- }
960
-
961
- var _options = options,
962
- placement = _options.placement,
963
- boundary = _options.boundary,
964
- rootBoundary = _options.rootBoundary,
965
- padding = _options.padding,
966
- flipVariations = _options.flipVariations,
967
- _options$allowedAutoP = _options.allowedAutoPlacements,
968
- allowedAutoPlacements = _options$allowedAutoP === void 0 ? placements : _options$allowedAutoP;
969
- var variation = getVariation(placement);
970
- var placements$1 = variation ? flipVariations ? variationPlacements : variationPlacements.filter(function (placement) {
971
- return getVariation(placement) === variation;
972
- }) : basePlacements;
973
- var allowedPlacements = placements$1.filter(function (placement) {
974
- return allowedAutoPlacements.indexOf(placement) >= 0;
975
- });
976
-
977
- if (allowedPlacements.length === 0) {
978
- allowedPlacements = placements$1;
979
- } // $FlowFixMe[incompatible-type]: Flow seems to have problems with two array unions...
980
-
981
-
982
- var overflows = allowedPlacements.reduce(function (acc, placement) {
983
- acc[placement] = detectOverflow(state, {
984
- placement: placement,
985
- boundary: boundary,
986
- rootBoundary: rootBoundary,
987
- padding: padding
988
- })[getBasePlacement(placement)];
989
- return acc;
990
- }, {});
991
- return Object.keys(overflows).sort(function (a, b) {
992
- return overflows[a] - overflows[b];
993
- });
994
- }
995
-
996
- function getExpandedFallbackPlacements(placement) {
997
- if (getBasePlacement(placement) === auto) {
998
- return [];
999
- }
1000
-
1001
- var oppositePlacement = getOppositePlacement(placement);
1002
- return [getOppositeVariationPlacement(placement), oppositePlacement, getOppositeVariationPlacement(oppositePlacement)];
1003
- }
1004
-
1005
- function flip(_ref) {
1006
- var state = _ref.state,
1007
- options = _ref.options,
1008
- name = _ref.name;
1009
-
1010
- if (state.modifiersData[name]._skip) {
1011
- return;
1012
- }
1013
-
1014
- var _options$mainAxis = options.mainAxis,
1015
- checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,
1016
- _options$altAxis = options.altAxis,
1017
- checkAltAxis = _options$altAxis === void 0 ? true : _options$altAxis,
1018
- specifiedFallbackPlacements = options.fallbackPlacements,
1019
- padding = options.padding,
1020
- boundary = options.boundary,
1021
- rootBoundary = options.rootBoundary,
1022
- altBoundary = options.altBoundary,
1023
- _options$flipVariatio = options.flipVariations,
1024
- flipVariations = _options$flipVariatio === void 0 ? true : _options$flipVariatio,
1025
- allowedAutoPlacements = options.allowedAutoPlacements;
1026
- var preferredPlacement = state.options.placement;
1027
- var basePlacement = getBasePlacement(preferredPlacement);
1028
- var isBasePlacement = basePlacement === preferredPlacement;
1029
- var fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipVariations ? [getOppositePlacement(preferredPlacement)] : getExpandedFallbackPlacements(preferredPlacement));
1030
- var placements = [preferredPlacement].concat(fallbackPlacements).reduce(function (acc, placement) {
1031
- return acc.concat(getBasePlacement(placement) === auto ? computeAutoPlacement(state, {
1032
- placement: placement,
1033
- boundary: boundary,
1034
- rootBoundary: rootBoundary,
1035
- padding: padding,
1036
- flipVariations: flipVariations,
1037
- allowedAutoPlacements: allowedAutoPlacements
1038
- }) : placement);
1039
- }, []);
1040
- var referenceRect = state.rects.reference;
1041
- var popperRect = state.rects.popper;
1042
- var checksMap = new Map();
1043
- var makeFallbackChecks = true;
1044
- var firstFittingPlacement = placements[0];
1045
-
1046
- for (var i = 0; i < placements.length; i++) {
1047
- var placement = placements[i];
1048
-
1049
- var _basePlacement = getBasePlacement(placement);
1050
-
1051
- var isStartVariation = getVariation(placement) === start;
1052
- var isVertical = [top, bottom].indexOf(_basePlacement) >= 0;
1053
- var len = isVertical ? 'width' : 'height';
1054
- var overflow = detectOverflow(state, {
1055
- placement: placement,
1056
- boundary: boundary,
1057
- rootBoundary: rootBoundary,
1058
- altBoundary: altBoundary,
1059
- padding: padding
1060
- });
1061
- var mainVariationSide = isVertical ? isStartVariation ? right : left : isStartVariation ? bottom : top;
1062
-
1063
- if (referenceRect[len] > popperRect[len]) {
1064
- mainVariationSide = getOppositePlacement(mainVariationSide);
1065
- }
1066
-
1067
- var altVariationSide = getOppositePlacement(mainVariationSide);
1068
- var checks = [];
1069
-
1070
- if (checkMainAxis) {
1071
- checks.push(overflow[_basePlacement] <= 0);
1072
- }
1073
-
1074
- if (checkAltAxis) {
1075
- checks.push(overflow[mainVariationSide] <= 0, overflow[altVariationSide] <= 0);
1076
- }
1077
-
1078
- if (checks.every(function (check) {
1079
- return check;
1080
- })) {
1081
- firstFittingPlacement = placement;
1082
- makeFallbackChecks = false;
1083
- break;
1084
- }
1085
-
1086
- checksMap.set(placement, checks);
1087
- }
1088
-
1089
- if (makeFallbackChecks) {
1090
- // `2` may be desired in some cases – research later
1091
- var numberOfChecks = flipVariations ? 3 : 1;
1092
-
1093
- var _loop = function _loop(_i) {
1094
- var fittingPlacement = placements.find(function (placement) {
1095
- var checks = checksMap.get(placement);
1096
-
1097
- if (checks) {
1098
- return checks.slice(0, _i).every(function (check) {
1099
- return check;
1100
- });
1101
- }
1102
- });
1103
-
1104
- if (fittingPlacement) {
1105
- firstFittingPlacement = fittingPlacement;
1106
- return "break";
1107
- }
1108
- };
1109
-
1110
- for (var _i = numberOfChecks; _i > 0; _i--) {
1111
- var _ret = _loop(_i);
1112
-
1113
- if (_ret === "break") break;
1114
- }
1115
- }
1116
-
1117
- if (state.placement !== firstFittingPlacement) {
1118
- state.modifiersData[name]._skip = true;
1119
- state.placement = firstFittingPlacement;
1120
- state.reset = true;
1121
- }
1122
- } // eslint-disable-next-line import/no-unused-modules
1123
-
1124
-
1125
- var flip$1 = {
1126
- name: 'flip',
1127
- enabled: true,
1128
- phase: 'main',
1129
- fn: flip,
1130
- requiresIfExists: ['offset'],
1131
- data: {
1132
- _skip: false
1133
- }
1134
- };
1135
-
1136
- function getSideOffsets(overflow, rect, preventedOffsets) {
1137
- if (preventedOffsets === void 0) {
1138
- preventedOffsets = {
1139
- x: 0,
1140
- y: 0
1141
- };
1142
- }
1143
-
1144
- return {
1145
- top: overflow.top - rect.height - preventedOffsets.y,
1146
- right: overflow.right - rect.width + preventedOffsets.x,
1147
- bottom: overflow.bottom - rect.height + preventedOffsets.y,
1148
- left: overflow.left - rect.width - preventedOffsets.x
1149
- };
1150
- }
1151
-
1152
- function isAnySideFullyClipped(overflow) {
1153
- return [top, right, bottom, left].some(function (side) {
1154
- return overflow[side] >= 0;
1155
- });
1156
- }
1157
-
1158
- function hide(_ref) {
1159
- var state = _ref.state,
1160
- name = _ref.name;
1161
- var referenceRect = state.rects.reference;
1162
- var popperRect = state.rects.popper;
1163
- var preventedOffsets = state.modifiersData.preventOverflow;
1164
- var referenceOverflow = detectOverflow(state, {
1165
- elementContext: 'reference'
1166
- });
1167
- var popperAltOverflow = detectOverflow(state, {
1168
- altBoundary: true
1169
- });
1170
- var referenceClippingOffsets = getSideOffsets(referenceOverflow, referenceRect);
1171
- var popperEscapeOffsets = getSideOffsets(popperAltOverflow, popperRect, preventedOffsets);
1172
- var isReferenceHidden = isAnySideFullyClipped(referenceClippingOffsets);
1173
- var hasPopperEscaped = isAnySideFullyClipped(popperEscapeOffsets);
1174
- state.modifiersData[name] = {
1175
- referenceClippingOffsets: referenceClippingOffsets,
1176
- popperEscapeOffsets: popperEscapeOffsets,
1177
- isReferenceHidden: isReferenceHidden,
1178
- hasPopperEscaped: hasPopperEscaped
1179
- };
1180
- state.attributes.popper = Object.assign({}, state.attributes.popper, {
1181
- 'data-popper-reference-hidden': isReferenceHidden,
1182
- 'data-popper-escaped': hasPopperEscaped
1183
- });
1184
- } // eslint-disable-next-line import/no-unused-modules
1185
-
1186
-
1187
- var hide$1 = {
1188
- name: 'hide',
1189
- enabled: true,
1190
- phase: 'main',
1191
- requiresIfExists: ['preventOverflow'],
1192
- fn: hide
1193
- };
1194
-
1195
- function distanceAndSkiddingToXY(placement, rects, offset) {
1196
- var basePlacement = getBasePlacement(placement);
1197
- var invertDistance = [left, top].indexOf(basePlacement) >= 0 ? -1 : 1;
1198
-
1199
- var _ref = typeof offset === 'function' ? offset(Object.assign({}, rects, {
1200
- placement: placement
1201
- })) : offset,
1202
- skidding = _ref[0],
1203
- distance = _ref[1];
1204
-
1205
- skidding = skidding || 0;
1206
- distance = (distance || 0) * invertDistance;
1207
- return [left, right].indexOf(basePlacement) >= 0 ? {
1208
- x: distance,
1209
- y: skidding
1210
- } : {
1211
- x: skidding,
1212
- y: distance
1213
- };
1214
- }
1215
-
1216
- function offset(_ref2) {
1217
- var state = _ref2.state,
1218
- options = _ref2.options,
1219
- name = _ref2.name;
1220
- var _options$offset = options.offset,
1221
- offset = _options$offset === void 0 ? [0, 0] : _options$offset;
1222
- var data = placements.reduce(function (acc, placement) {
1223
- acc[placement] = distanceAndSkiddingToXY(placement, state.rects, offset);
1224
- return acc;
1225
- }, {});
1226
- var _data$state$placement = data[state.placement],
1227
- x = _data$state$placement.x,
1228
- y = _data$state$placement.y;
1229
-
1230
- if (state.modifiersData.popperOffsets != null) {
1231
- state.modifiersData.popperOffsets.x += x;
1232
- state.modifiersData.popperOffsets.y += y;
1233
- }
1234
-
1235
- state.modifiersData[name] = data;
1236
- } // eslint-disable-next-line import/no-unused-modules
1237
-
1238
-
1239
- var offset$1 = {
1240
- name: 'offset',
1241
- enabled: true,
1242
- phase: 'main',
1243
- requires: ['popperOffsets'],
1244
- fn: offset
1245
- };
1246
-
1247
- function popperOffsets(_ref) {
1248
- var state = _ref.state,
1249
- name = _ref.name;
1250
- // Offsets are the actual position the popper needs to have to be
1251
- // properly positioned near its reference element
1252
- // This is the most basic placement, and will be adjusted by
1253
- // the modifiers in the next step
1254
- state.modifiersData[name] = computeOffsets({
1255
- reference: state.rects.reference,
1256
- element: state.rects.popper,
1257
- strategy: 'absolute',
1258
- placement: state.placement
1259
- });
1260
- } // eslint-disable-next-line import/no-unused-modules
1261
-
1262
-
1263
- var popperOffsets$1 = {
1264
- name: 'popperOffsets',
1265
- enabled: true,
1266
- phase: 'read',
1267
- fn: popperOffsets,
1268
- data: {}
1269
- };
1270
-
1271
- function getAltAxis(axis) {
1272
- return axis === 'x' ? 'y' : 'x';
1273
- }
1274
-
1275
- function preventOverflow(_ref) {
1276
- var state = _ref.state,
1277
- options = _ref.options,
1278
- name = _ref.name;
1279
- var _options$mainAxis = options.mainAxis,
1280
- checkMainAxis = _options$mainAxis === void 0 ? true : _options$mainAxis,
1281
- _options$altAxis = options.altAxis,
1282
- checkAltAxis = _options$altAxis === void 0 ? false : _options$altAxis,
1283
- boundary = options.boundary,
1284
- rootBoundary = options.rootBoundary,
1285
- altBoundary = options.altBoundary,
1286
- padding = options.padding,
1287
- _options$tether = options.tether,
1288
- tether = _options$tether === void 0 ? true : _options$tether,
1289
- _options$tetherOffset = options.tetherOffset,
1290
- tetherOffset = _options$tetherOffset === void 0 ? 0 : _options$tetherOffset;
1291
- var overflow = detectOverflow(state, {
1292
- boundary: boundary,
1293
- rootBoundary: rootBoundary,
1294
- padding: padding,
1295
- altBoundary: altBoundary
1296
- });
1297
- var basePlacement = getBasePlacement(state.placement);
1298
- var variation = getVariation(state.placement);
1299
- var isBasePlacement = !variation;
1300
- var mainAxis = getMainAxisFromPlacement(basePlacement);
1301
- var altAxis = getAltAxis(mainAxis);
1302
- var popperOffsets = state.modifiersData.popperOffsets;
1303
- var referenceRect = state.rects.reference;
1304
- var popperRect = state.rects.popper;
1305
- var tetherOffsetValue = typeof tetherOffset === 'function' ? tetherOffset(Object.assign({}, state.rects, {
1306
- placement: state.placement
1307
- })) : tetherOffset;
1308
- var data = {
1309
- x: 0,
1310
- y: 0
1311
- };
1312
-
1313
- if (!popperOffsets) {
1314
- return;
1315
- }
1316
-
1317
- if (checkMainAxis || checkAltAxis) {
1318
- var mainSide = mainAxis === 'y' ? top : left;
1319
- var altSide = mainAxis === 'y' ? bottom : right;
1320
- var len = mainAxis === 'y' ? 'height' : 'width';
1321
- var offset = popperOffsets[mainAxis];
1322
- var min$1 = popperOffsets[mainAxis] + overflow[mainSide];
1323
- var max$1 = popperOffsets[mainAxis] - overflow[altSide];
1324
- var additive = tether ? -popperRect[len] / 2 : 0;
1325
- var minLen = variation === start ? referenceRect[len] : popperRect[len];
1326
- var maxLen = variation === start ? -popperRect[len] : -referenceRect[len]; // We need to include the arrow in the calculation so the arrow doesn't go
1327
- // outside the reference bounds
1328
-
1329
- var arrowElement = state.elements.arrow;
1330
- var arrowRect = tether && arrowElement ? getLayoutRect(arrowElement) : {
1331
- width: 0,
1332
- height: 0
1333
- };
1334
- var arrowPaddingObject = state.modifiersData['arrow#persistent'] ? state.modifiersData['arrow#persistent'].padding : getFreshSideObject();
1335
- var arrowPaddingMin = arrowPaddingObject[mainSide];
1336
- var arrowPaddingMax = arrowPaddingObject[altSide]; // If the reference length is smaller than the arrow length, we don't want
1337
- // to include its full size in the calculation. If the reference is small
1338
- // and near the edge of a boundary, the popper can overflow even if the
1339
- // reference is not overflowing as well (e.g. virtual elements with no
1340
- // width or height)
1341
-
1342
- var arrowLen = within(0, referenceRect[len], arrowRect[len]);
1343
- var minOffset = isBasePlacement ? referenceRect[len] / 2 - additive - arrowLen - arrowPaddingMin - tetherOffsetValue : minLen - arrowLen - arrowPaddingMin - tetherOffsetValue;
1344
- var maxOffset = isBasePlacement ? -referenceRect[len] / 2 + additive + arrowLen + arrowPaddingMax + tetherOffsetValue : maxLen + arrowLen + arrowPaddingMax + tetherOffsetValue;
1345
- var arrowOffsetParent = state.elements.arrow && getOffsetParent(state.elements.arrow);
1346
- var clientOffset = arrowOffsetParent ? mainAxis === 'y' ? arrowOffsetParent.clientTop || 0 : arrowOffsetParent.clientLeft || 0 : 0;
1347
- var offsetModifierValue = state.modifiersData.offset ? state.modifiersData.offset[state.placement][mainAxis] : 0;
1348
- var tetherMin = popperOffsets[mainAxis] + minOffset - offsetModifierValue - clientOffset;
1349
- var tetherMax = popperOffsets[mainAxis] + maxOffset - offsetModifierValue;
1350
-
1351
- if (checkMainAxis) {
1352
- var preventedOffset = within(tether ? min(min$1, tetherMin) : min$1, offset, tether ? max(max$1, tetherMax) : max$1);
1353
- popperOffsets[mainAxis] = preventedOffset;
1354
- data[mainAxis] = preventedOffset - offset;
1355
- }
1356
-
1357
- if (checkAltAxis) {
1358
- var _mainSide = mainAxis === 'x' ? top : left;
1359
-
1360
- var _altSide = mainAxis === 'x' ? bottom : right;
1361
-
1362
- var _offset = popperOffsets[altAxis];
1363
-
1364
- var _min = _offset + overflow[_mainSide];
1365
-
1366
- var _max = _offset - overflow[_altSide];
1367
-
1368
- var _preventedOffset = within(tether ? min(_min, tetherMin) : _min, _offset, tether ? max(_max, tetherMax) : _max);
1369
-
1370
- popperOffsets[altAxis] = _preventedOffset;
1371
- data[altAxis] = _preventedOffset - _offset;
1372
- }
1373
- }
1374
-
1375
- state.modifiersData[name] = data;
1376
- } // eslint-disable-next-line import/no-unused-modules
1377
-
1378
-
1379
- var preventOverflow$1 = {
1380
- name: 'preventOverflow',
1381
- enabled: true,
1382
- phase: 'main',
1383
- fn: preventOverflow,
1384
- requiresIfExists: ['offset']
1385
- };
1386
-
1387
- function getHTMLElementScroll(element) {
1388
- return {
1389
- scrollLeft: element.scrollLeft,
1390
- scrollTop: element.scrollTop
1391
- };
1392
- }
1393
-
1394
- function getNodeScroll(node) {
1395
- if (node === getWindow(node) || !isHTMLElement(node)) {
1396
- return getWindowScroll(node);
1397
- } else {
1398
- return getHTMLElementScroll(node);
1399
- }
1400
- }
1401
-
1402
- // Composite means it takes into account transforms as well as layout.
1403
-
1404
- function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
1405
- if (isFixed === void 0) {
1406
- isFixed = false;
1407
- }
1408
-
1409
- var documentElement = getDocumentElement(offsetParent);
1410
- var rect = getBoundingClientRect(elementOrVirtualElement);
1411
- var isOffsetParentAnElement = isHTMLElement(offsetParent);
1412
- var scroll = {
1413
- scrollLeft: 0,
1414
- scrollTop: 0
1415
- };
1416
- var offsets = {
1417
- x: 0,
1418
- y: 0
1419
- };
1420
-
1421
- if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
1422
- if (getNodeName(offsetParent) !== 'body' || // https://github.com/popperjs/popper-core/issues/1078
1423
- isScrollParent(documentElement)) {
1424
- scroll = getNodeScroll(offsetParent);
1425
- }
1426
-
1427
- if (isHTMLElement(offsetParent)) {
1428
- offsets = getBoundingClientRect(offsetParent);
1429
- offsets.x += offsetParent.clientLeft;
1430
- offsets.y += offsetParent.clientTop;
1431
- } else if (documentElement) {
1432
- offsets.x = getWindowScrollBarX(documentElement);
1433
- }
1434
- }
1435
-
1436
- return {
1437
- x: rect.left + scroll.scrollLeft - offsets.x,
1438
- y: rect.top + scroll.scrollTop - offsets.y,
1439
- width: rect.width,
1440
- height: rect.height
1441
- };
1442
- }
1443
-
1444
- function order(modifiers) {
1445
- var map = new Map();
1446
- var visited = new Set();
1447
- var result = [];
1448
- modifiers.forEach(function (modifier) {
1449
- map.set(modifier.name, modifier);
1450
- }); // On visiting object, check for its dependencies and visit them recursively
1451
-
1452
- function sort(modifier) {
1453
- visited.add(modifier.name);
1454
- var requires = [].concat(modifier.requires || [], modifier.requiresIfExists || []);
1455
- requires.forEach(function (dep) {
1456
- if (!visited.has(dep)) {
1457
- var depModifier = map.get(dep);
1458
-
1459
- if (depModifier) {
1460
- sort(depModifier);
1461
- }
1462
- }
1463
- });
1464
- result.push(modifier);
1465
- }
1466
-
1467
- modifiers.forEach(function (modifier) {
1468
- if (!visited.has(modifier.name)) {
1469
- // check for visited object
1470
- sort(modifier);
1471
- }
1472
- });
1473
- return result;
1474
- }
1475
-
1476
- function orderModifiers(modifiers) {
1477
- // order based on dependencies
1478
- var orderedModifiers = order(modifiers); // order based on phase
1479
-
1480
- return modifierPhases.reduce(function (acc, phase) {
1481
- return acc.concat(orderedModifiers.filter(function (modifier) {
1482
- return modifier.phase === phase;
1483
- }));
1484
- }, []);
1485
- }
1486
-
1487
- function debounce(fn) {
1488
- var pending;
1489
- return function () {
1490
- if (!pending) {
1491
- pending = new Promise(function (resolve) {
1492
- Promise.resolve().then(function () {
1493
- pending = undefined;
1494
- resolve(fn());
1495
- });
1496
- });
1497
- }
1498
-
1499
- return pending;
1500
- };
1501
- }
1502
-
1503
- function mergeByName(modifiers) {
1504
- var merged = modifiers.reduce(function (merged, current) {
1505
- var existing = merged[current.name];
1506
- merged[current.name] = existing ? Object.assign({}, existing, current, {
1507
- options: Object.assign({}, existing.options, current.options),
1508
- data: Object.assign({}, existing.data, current.data)
1509
- }) : current;
1510
- return merged;
1511
- }, {}); // IE11 does not support Object.values
1512
-
1513
- return Object.keys(merged).map(function (key) {
1514
- return merged[key];
1515
- });
1516
- }
1517
-
1518
- var DEFAULT_OPTIONS = {
1519
- placement: 'bottom',
1520
- modifiers: [],
1521
- strategy: 'absolute'
1522
- };
1523
-
1524
- function areValidElements() {
1525
- for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
1526
- args[_key] = arguments[_key];
1527
- }
1528
-
1529
- return !args.some(function (element) {
1530
- return !(element && typeof element.getBoundingClientRect === 'function');
1531
- });
1532
- }
1533
-
1534
- function popperGenerator(generatorOptions) {
1535
- if (generatorOptions === void 0) {
1536
- generatorOptions = {};
1537
- }
1538
-
1539
- var _generatorOptions = generatorOptions,
1540
- _generatorOptions$def = _generatorOptions.defaultModifiers,
1541
- defaultModifiers = _generatorOptions$def === void 0 ? [] : _generatorOptions$def,
1542
- _generatorOptions$def2 = _generatorOptions.defaultOptions,
1543
- defaultOptions = _generatorOptions$def2 === void 0 ? DEFAULT_OPTIONS : _generatorOptions$def2;
1544
- return function createPopper(reference, popper, options) {
1545
- if (options === void 0) {
1546
- options = defaultOptions;
1547
- }
1548
-
1549
- var state = {
1550
- placement: 'bottom',
1551
- orderedModifiers: [],
1552
- options: Object.assign({}, DEFAULT_OPTIONS, defaultOptions),
1553
- modifiersData: {},
1554
- elements: {
1555
- reference: reference,
1556
- popper: popper
1557
- },
1558
- attributes: {},
1559
- styles: {}
1560
- };
1561
- var effectCleanupFns = [];
1562
- var isDestroyed = false;
1563
- var instance = {
1564
- state: state,
1565
- setOptions: function setOptions(options) {
1566
- cleanupModifierEffects();
1567
- state.options = Object.assign({}, defaultOptions, state.options, options);
1568
- state.scrollParents = {
1569
- reference: isElement(reference) ? listScrollParents(reference) : reference.contextElement ? listScrollParents(reference.contextElement) : [],
1570
- popper: listScrollParents(popper)
1571
- }; // Orders the modifiers based on their dependencies and `phase`
1572
- // properties
1573
-
1574
- var orderedModifiers = orderModifiers(mergeByName([].concat(defaultModifiers, state.options.modifiers))); // Strip out disabled modifiers
1575
-
1576
- state.orderedModifiers = orderedModifiers.filter(function (m) {
1577
- return m.enabled;
1578
- }); // Validate the provided modifiers so that the consumer will get warned
1579
-
1580
- runModifierEffects();
1581
- return instance.update();
1582
- },
1583
- // Sync update – it will always be executed, even if not necessary. This
1584
- // is useful for low frequency updates where sync behavior simplifies the
1585
- // logic.
1586
- // For high frequency updates (e.g. `resize` and `scroll` events), always
1587
- // prefer the async Popper#update method
1588
- forceUpdate: function forceUpdate() {
1589
- if (isDestroyed) {
1590
- return;
1591
- }
1592
-
1593
- var _state$elements = state.elements,
1594
- reference = _state$elements.reference,
1595
- popper = _state$elements.popper; // Don't proceed if `reference` or `popper` are not valid elements
1596
- // anymore
1597
-
1598
- if (!areValidElements(reference, popper)) {
1599
-
1600
- return;
1601
- } // Store the reference and popper rects to be read by modifiers
1602
-
1603
-
1604
- state.rects = {
1605
- reference: getCompositeRect(reference, getOffsetParent(popper), state.options.strategy === 'fixed'),
1606
- popper: getLayoutRect(popper)
1607
- }; // Modifiers have the ability to reset the current update cycle. The
1608
- // most common use case for this is the `flip` modifier changing the
1609
- // placement, which then needs to re-run all the modifiers, because the
1610
- // logic was previously ran for the previous placement and is therefore
1611
- // stale/incorrect
1612
-
1613
- state.reset = false;
1614
- state.placement = state.options.placement; // On each update cycle, the `modifiersData` property for each modifier
1615
- // is filled with the initial data specified by the modifier. This means
1616
- // it doesn't persist and is fresh on each update.
1617
- // To ensure persistent data, use `${name}#persistent`
1618
-
1619
- state.orderedModifiers.forEach(function (modifier) {
1620
- return state.modifiersData[modifier.name] = Object.assign({}, modifier.data);
1621
- });
1622
-
1623
- for (var index = 0; index < state.orderedModifiers.length; index++) {
1624
-
1625
- if (state.reset === true) {
1626
- state.reset = false;
1627
- index = -1;
1628
- continue;
1629
- }
1630
-
1631
- var _state$orderedModifie = state.orderedModifiers[index],
1632
- fn = _state$orderedModifie.fn,
1633
- _state$orderedModifie2 = _state$orderedModifie.options,
1634
- _options = _state$orderedModifie2 === void 0 ? {} : _state$orderedModifie2,
1635
- name = _state$orderedModifie.name;
1636
-
1637
- if (typeof fn === 'function') {
1638
- state = fn({
1639
- state: state,
1640
- options: _options,
1641
- name: name,
1642
- instance: instance
1643
- }) || state;
1644
- }
1645
- }
1646
- },
1647
- // Async and optimistically optimized update – it will not be executed if
1648
- // not necessary (debounced to run at most once-per-tick)
1649
- update: debounce(function () {
1650
- return new Promise(function (resolve) {
1651
- instance.forceUpdate();
1652
- resolve(state);
1653
- });
1654
- }),
1655
- destroy: function destroy() {
1656
- cleanupModifierEffects();
1657
- isDestroyed = true;
1658
- }
1659
- };
1660
-
1661
- if (!areValidElements(reference, popper)) {
1662
-
1663
- return instance;
1664
- }
1665
-
1666
- instance.setOptions(options).then(function (state) {
1667
- if (!isDestroyed && options.onFirstUpdate) {
1668
- options.onFirstUpdate(state);
1669
- }
1670
- }); // Modifiers have the ability to execute arbitrary code before the first
1671
- // update cycle runs. They will be executed in the same order as the update
1672
- // cycle. This is useful when a modifier adds some persistent data that
1673
- // other modifiers need to use, but the modifier is run after the dependent
1674
- // one.
1675
-
1676
- function runModifierEffects() {
1677
- state.orderedModifiers.forEach(function (_ref3) {
1678
- var name = _ref3.name,
1679
- _ref3$options = _ref3.options,
1680
- options = _ref3$options === void 0 ? {} : _ref3$options,
1681
- effect = _ref3.effect;
1682
-
1683
- if (typeof effect === 'function') {
1684
- var cleanupFn = effect({
1685
- state: state,
1686
- name: name,
1687
- instance: instance,
1688
- options: options
1689
- });
1690
-
1691
- var noopFn = function noopFn() {};
1692
-
1693
- effectCleanupFns.push(cleanupFn || noopFn);
1694
- }
1695
- });
1696
- }
1697
-
1698
- function cleanupModifierEffects() {
1699
- effectCleanupFns.forEach(function (fn) {
1700
- return fn();
1701
- });
1702
- effectCleanupFns = [];
1703
- }
1704
-
1705
- return instance;
1706
- };
1707
- }
1708
-
1709
- var defaultModifiers = [eventListeners, popperOffsets$1, computeStyles$1, applyStyles$1, offset$1, flip$1, preventOverflow$1, arrow$1, hide$1];
1710
- var createPopper = /*#__PURE__*/popperGenerator({
1711
- defaultModifiers: defaultModifiers
1712
- }); // eslint-disable-next-line import/no-unused-modules
1713
-
1714
- /**!
1715
- * tippy.js v6.3.1
1716
- * (c) 2017-2021 atomiks
1717
- * MIT License
1718
- */
1719
-
1720
- var ROUND_ARROW = '<svg width="16" height="6" xmlns="http://www.w3.org/2000/svg"><path d="M0 6s1.796-.013 4.67-3.615C5.851.9 6.93.006 8 0c1.07-.006 2.148.887 3.343 2.385C14.233 6.005 16 6 16 6H0z"></svg>';
1721
- var BOX_CLASS = "tippy-box";
1722
- var CONTENT_CLASS = "tippy-content";
1723
- var BACKDROP_CLASS = "tippy-backdrop";
1724
- var ARROW_CLASS = "tippy-arrow";
1725
- var SVG_ARROW_CLASS = "tippy-svg-arrow";
1726
- var TOUCH_OPTIONS = {
1727
- passive: true,
1728
- capture: true
1729
- };
1730
- function getValueAtIndexOrReturn(value, index, defaultValue) {
1731
- if (Array.isArray(value)) {
1732
- var v = value[index];
1733
- return v == null ? Array.isArray(defaultValue) ? defaultValue[index] : defaultValue : v;
1734
- }
1735
-
1736
- return value;
1737
- }
1738
- function isType(value, type) {
1739
- var str = {}.toString.call(value);
1740
- return str.indexOf('[object') === 0 && str.indexOf(type + "]") > -1;
1741
- }
1742
- function invokeWithArgsOrReturn(value, args) {
1743
- return typeof value === 'function' ? value.apply(void 0, args) : value;
1744
- }
1745
- function debounce$1(fn, ms) {
1746
- // Avoid wrapping in `setTimeout` if ms is 0 anyway
1747
- if (ms === 0) {
1748
- return fn;
1749
- }
1750
-
1751
- var timeout;
1752
- return function (arg) {
1753
- clearTimeout(timeout);
1754
- timeout = setTimeout(function () {
1755
- fn(arg);
1756
- }, ms);
1757
- };
1758
- }
1759
- function removeProperties(obj, keys) {
1760
- var clone = Object.assign({}, obj);
1761
- keys.forEach(function (key) {
1762
- delete clone[key];
1763
- });
1764
- return clone;
1765
- }
1766
- function splitBySpaces(value) {
1767
- return value.split(/\s+/).filter(Boolean);
1768
- }
1769
- function normalizeToArray(value) {
1770
- return [].concat(value);
1771
- }
1772
- function pushIfUnique(arr, value) {
1773
- if (arr.indexOf(value) === -1) {
1774
- arr.push(value);
1775
- }
1776
- }
1777
- function unique(arr) {
1778
- return arr.filter(function (item, index) {
1779
- return arr.indexOf(item) === index;
1780
- });
1781
- }
1782
- function getBasePlacement$1(placement) {
1783
- return placement.split('-')[0];
1784
- }
1785
- function arrayFrom(value) {
1786
- return [].slice.call(value);
1787
- }
1788
- function removeUndefinedProps(obj) {
1789
- return Object.keys(obj).reduce(function (acc, key) {
1790
- if (obj[key] !== undefined) {
1791
- acc[key] = obj[key];
1792
- }
1793
-
1794
- return acc;
1795
- }, {});
1796
- }
1797
-
1798
- function div() {
1799
- return document.createElement('div');
1800
- }
1801
- function isElement$1(value) {
1802
- return ['Element', 'Fragment'].some(function (type) {
1803
- return isType(value, type);
1804
- });
1805
- }
1806
- function isNodeList(value) {
1807
- return isType(value, 'NodeList');
1808
- }
1809
- function isMouseEvent(value) {
1810
- return isType(value, 'MouseEvent');
1811
- }
1812
- function isReferenceElement(value) {
1813
- return !!(value && value._tippy && value._tippy.reference === value);
1814
- }
1815
- function getArrayOfElements(value) {
1816
- if (isElement$1(value)) {
1817
- return [value];
1818
- }
1819
-
1820
- if (isNodeList(value)) {
1821
- return arrayFrom(value);
1822
- }
1823
-
1824
- if (Array.isArray(value)) {
1825
- return value;
1826
- }
1827
-
1828
- return arrayFrom(document.querySelectorAll(value));
1829
- }
1830
- function setTransitionDuration(els, value) {
1831
- els.forEach(function (el) {
1832
- if (el) {
1833
- el.style.transitionDuration = value + "ms";
1834
- }
1835
- });
1836
- }
1837
- function setVisibilityState(els, state) {
1838
- els.forEach(function (el) {
1839
- if (el) {
1840
- el.setAttribute('data-state', state);
1841
- }
1842
- });
1843
- }
1844
- function getOwnerDocument(elementOrElements) {
1845
- var _element$ownerDocumen;
1846
-
1847
- var _normalizeToArray = normalizeToArray(elementOrElements),
1848
- element = _normalizeToArray[0]; // Elements created via a <template> have an ownerDocument with no reference to the body
1849
-
1850
-
1851
- return (element == null ? void 0 : (_element$ownerDocumen = element.ownerDocument) == null ? void 0 : _element$ownerDocumen.body) ? element.ownerDocument : document;
1852
- }
1853
- function isCursorOutsideInteractiveBorder(popperTreeData, event) {
1854
- var clientX = event.clientX,
1855
- clientY = event.clientY;
1856
- return popperTreeData.every(function (_ref) {
1857
- var popperRect = _ref.popperRect,
1858
- popperState = _ref.popperState,
1859
- props = _ref.props;
1860
- var interactiveBorder = props.interactiveBorder;
1861
- var basePlacement = getBasePlacement$1(popperState.placement);
1862
- var offsetData = popperState.modifiersData.offset;
1863
-
1864
- if (!offsetData) {
1865
- return true;
1866
- }
1867
-
1868
- var topDistance = basePlacement === 'bottom' ? offsetData.top.y : 0;
1869
- var bottomDistance = basePlacement === 'top' ? offsetData.bottom.y : 0;
1870
- var leftDistance = basePlacement === 'right' ? offsetData.left.x : 0;
1871
- var rightDistance = basePlacement === 'left' ? offsetData.right.x : 0;
1872
- var exceedsTop = popperRect.top - clientY + topDistance > interactiveBorder;
1873
- var exceedsBottom = clientY - popperRect.bottom - bottomDistance > interactiveBorder;
1874
- var exceedsLeft = popperRect.left - clientX + leftDistance > interactiveBorder;
1875
- var exceedsRight = clientX - popperRect.right - rightDistance > interactiveBorder;
1876
- return exceedsTop || exceedsBottom || exceedsLeft || exceedsRight;
1877
- });
1878
- }
1879
- function updateTransitionEndListener(box, action, listener) {
1880
- var method = action + "EventListener"; // some browsers apparently support `transition` (unprefixed) but only fire
1881
- // `webkitTransitionEnd`...
1882
-
1883
- ['transitionend', 'webkitTransitionEnd'].forEach(function (event) {
1884
- box[method](event, listener);
1885
- });
1886
- }
1887
-
1888
- var currentInput = {
1889
- isTouch: false
1890
- };
1891
- var lastMouseMoveTime = 0;
1892
- /**
1893
- * When a `touchstart` event is fired, it's assumed the user is using touch
1894
- * input. We'll bind a `mousemove` event listener to listen for mouse input in
1895
- * the future. This way, the `isTouch` property is fully dynamic and will handle
1896
- * hybrid devices that use a mix of touch + mouse input.
1897
- */
1898
-
1899
- function onDocumentTouchStart() {
1900
- if (currentInput.isTouch) {
1901
- return;
1902
- }
1903
-
1904
- currentInput.isTouch = true;
1905
-
1906
- if (window.performance) {
1907
- document.addEventListener('mousemove', onDocumentMouseMove);
1908
- }
1909
- }
1910
- /**
1911
- * When two `mousemove` event are fired consecutively within 20ms, it's assumed
1912
- * the user is using mouse input again. `mousemove` can fire on touch devices as
1913
- * well, but very rarely that quickly.
1914
- */
1915
-
1916
- function onDocumentMouseMove() {
1917
- var now = performance.now();
1918
-
1919
- if (now - lastMouseMoveTime < 20) {
1920
- currentInput.isTouch = false;
1921
- document.removeEventListener('mousemove', onDocumentMouseMove);
1922
- }
1923
-
1924
- lastMouseMoveTime = now;
1925
- }
1926
- /**
1927
- * When an element is in focus and has a tippy, leaving the tab/window and
1928
- * returning causes it to show again. For mouse users this is unexpected, but
1929
- * for keyboard use it makes sense.
1930
- * TODO: find a better technique to solve this problem
1931
- */
1932
-
1933
- function onWindowBlur() {
1934
- var activeElement = document.activeElement;
1935
-
1936
- if (isReferenceElement(activeElement)) {
1937
- var instance = activeElement._tippy;
1938
-
1939
- if (activeElement.blur && !instance.state.isVisible) {
1940
- activeElement.blur();
1941
- }
1942
- }
1943
- }
1944
- function bindGlobalEventListeners() {
1945
- document.addEventListener('touchstart', onDocumentTouchStart, TOUCH_OPTIONS);
1946
- window.addEventListener('blur', onWindowBlur);
1947
- }
1948
-
1949
- var isBrowser = typeof window !== 'undefined' && typeof document !== 'undefined';
1950
- var ua = isBrowser ? navigator.userAgent : '';
1951
- var isIE = /MSIE |Trident\//.test(ua);
1952
-
1953
- var pluginProps = {
1954
- animateFill: false,
1955
- followCursor: false,
1956
- inlinePositioning: false,
1957
- sticky: false
1958
- };
1959
- var renderProps = {
1960
- allowHTML: false,
1961
- animation: 'fade',
1962
- arrow: true,
1963
- content: '',
1964
- inertia: false,
1965
- maxWidth: 350,
1966
- role: 'tooltip',
1967
- theme: '',
1968
- zIndex: 9999
1969
- };
1970
- var defaultProps = Object.assign({
1971
- appendTo: function appendTo() {
1972
- return document.body;
1973
- },
1974
- aria: {
1975
- content: 'auto',
1976
- expanded: 'auto'
1977
- },
1978
- delay: 0,
1979
- duration: [300, 250],
1980
- getReferenceClientRect: null,
1981
- hideOnClick: true,
1982
- ignoreAttributes: false,
1983
- interactive: false,
1984
- interactiveBorder: 2,
1985
- interactiveDebounce: 0,
1986
- moveTransition: '',
1987
- offset: [0, 10],
1988
- onAfterUpdate: function onAfterUpdate() {},
1989
- onBeforeUpdate: function onBeforeUpdate() {},
1990
- onCreate: function onCreate() {},
1991
- onDestroy: function onDestroy() {},
1992
- onHidden: function onHidden() {},
1993
- onHide: function onHide() {},
1994
- onMount: function onMount() {},
1995
- onShow: function onShow() {},
1996
- onShown: function onShown() {},
1997
- onTrigger: function onTrigger() {},
1998
- onUntrigger: function onUntrigger() {},
1999
- onClickOutside: function onClickOutside() {},
2000
- placement: 'top',
2001
- plugins: [],
2002
- popperOptions: {},
2003
- render: null,
2004
- showOnCreate: false,
2005
- touch: true,
2006
- trigger: 'mouseenter focus',
2007
- triggerTarget: null
2008
- }, pluginProps, {}, renderProps);
2009
- var defaultKeys = Object.keys(defaultProps);
2010
- var setDefaultProps = function setDefaultProps(partialProps) {
2011
-
2012
- var keys = Object.keys(partialProps);
2013
- keys.forEach(function (key) {
2014
- defaultProps[key] = partialProps[key];
2015
- });
2016
- };
2017
- function getExtendedPassedProps(passedProps) {
2018
- var plugins = passedProps.plugins || [];
2019
- var pluginProps = plugins.reduce(function (acc, plugin) {
2020
- var name = plugin.name,
2021
- defaultValue = plugin.defaultValue;
2022
-
2023
- if (name) {
2024
- acc[name] = passedProps[name] !== undefined ? passedProps[name] : defaultValue;
2025
- }
2026
-
2027
- return acc;
2028
- }, {});
2029
- return Object.assign({}, passedProps, {}, pluginProps);
2030
- }
2031
- function getDataAttributeProps(reference, plugins) {
2032
- var propKeys = plugins ? Object.keys(getExtendedPassedProps(Object.assign({}, defaultProps, {
2033
- plugins: plugins
2034
- }))) : defaultKeys;
2035
- var props = propKeys.reduce(function (acc, key) {
2036
- var valueAsString = (reference.getAttribute("data-tippy-" + key) || '').trim();
2037
-
2038
- if (!valueAsString) {
2039
- return acc;
2040
- }
2041
-
2042
- if (key === 'content') {
2043
- acc[key] = valueAsString;
2044
- } else {
2045
- try {
2046
- acc[key] = JSON.parse(valueAsString);
2047
- } catch (e) {
2048
- acc[key] = valueAsString;
2049
- }
2050
- }
2051
-
2052
- return acc;
2053
- }, {});
2054
- return props;
2055
- }
2056
- function evaluateProps(reference, props) {
2057
- var out = Object.assign({}, props, {
2058
- content: invokeWithArgsOrReturn(props.content, [reference])
2059
- }, props.ignoreAttributes ? {} : getDataAttributeProps(reference, props.plugins));
2060
- out.aria = Object.assign({}, defaultProps.aria, {}, out.aria);
2061
- out.aria = {
2062
- expanded: out.aria.expanded === 'auto' ? props.interactive : out.aria.expanded,
2063
- content: out.aria.content === 'auto' ? props.interactive ? null : 'describedby' : out.aria.content
2064
- };
2065
- return out;
2066
- }
2067
-
2068
- var innerHTML = function innerHTML() {
2069
- return 'innerHTML';
2070
- };
2071
-
2072
- function dangerouslySetInnerHTML(element, html) {
2073
- element[innerHTML()] = html;
2074
- }
2075
-
2076
- function createArrowElement(value) {
2077
- var arrow = div();
2078
-
2079
- if (value === true) {
2080
- arrow.className = ARROW_CLASS;
2081
- } else {
2082
- arrow.className = SVG_ARROW_CLASS;
2083
-
2084
- if (isElement$1(value)) {
2085
- arrow.appendChild(value);
2086
- } else {
2087
- dangerouslySetInnerHTML(arrow, value);
2088
- }
2089
- }
2090
-
2091
- return arrow;
2092
- }
2093
-
2094
- function setContent(content, props) {
2095
- if (isElement$1(props.content)) {
2096
- dangerouslySetInnerHTML(content, '');
2097
- content.appendChild(props.content);
2098
- } else if (typeof props.content !== 'function') {
2099
- if (props.allowHTML) {
2100
- dangerouslySetInnerHTML(content, props.content);
2101
- } else {
2102
- content.textContent = props.content;
2103
- }
2104
- }
2105
- }
2106
- function getChildren(popper) {
2107
- var box = popper.firstElementChild;
2108
- var boxChildren = arrayFrom(box.children);
2109
- return {
2110
- box: box,
2111
- content: boxChildren.find(function (node) {
2112
- return node.classList.contains(CONTENT_CLASS);
2113
- }),
2114
- arrow: boxChildren.find(function (node) {
2115
- return node.classList.contains(ARROW_CLASS) || node.classList.contains(SVG_ARROW_CLASS);
2116
- }),
2117
- backdrop: boxChildren.find(function (node) {
2118
- return node.classList.contains(BACKDROP_CLASS);
2119
- })
2120
- };
2121
- }
2122
- function render(instance) {
2123
- var popper = div();
2124
- var box = div();
2125
- box.className = BOX_CLASS;
2126
- box.setAttribute('data-state', 'hidden');
2127
- box.setAttribute('tabindex', '-1');
2128
- var content = div();
2129
- content.className = CONTENT_CLASS;
2130
- content.setAttribute('data-state', 'hidden');
2131
- setContent(content, instance.props);
2132
- popper.appendChild(box);
2133
- box.appendChild(content);
2134
- onUpdate(instance.props, instance.props);
2135
-
2136
- function onUpdate(prevProps, nextProps) {
2137
- var _getChildren = getChildren(popper),
2138
- box = _getChildren.box,
2139
- content = _getChildren.content,
2140
- arrow = _getChildren.arrow;
2141
-
2142
- if (nextProps.theme) {
2143
- box.setAttribute('data-theme', nextProps.theme);
2144
- } else {
2145
- box.removeAttribute('data-theme');
2146
- }
2147
-
2148
- if (typeof nextProps.animation === 'string') {
2149
- box.setAttribute('data-animation', nextProps.animation);
2150
- } else {
2151
- box.removeAttribute('data-animation');
2152
- }
2153
-
2154
- if (nextProps.inertia) {
2155
- box.setAttribute('data-inertia', '');
2156
- } else {
2157
- box.removeAttribute('data-inertia');
2158
- }
2159
-
2160
- box.style.maxWidth = typeof nextProps.maxWidth === 'number' ? nextProps.maxWidth + "px" : nextProps.maxWidth;
2161
-
2162
- if (nextProps.role) {
2163
- box.setAttribute('role', nextProps.role);
2164
- } else {
2165
- box.removeAttribute('role');
2166
- }
2167
-
2168
- if (prevProps.content !== nextProps.content || prevProps.allowHTML !== nextProps.allowHTML) {
2169
- setContent(content, instance.props);
2170
- }
2171
-
2172
- if (nextProps.arrow) {
2173
- if (!arrow) {
2174
- box.appendChild(createArrowElement(nextProps.arrow));
2175
- } else if (prevProps.arrow !== nextProps.arrow) {
2176
- box.removeChild(arrow);
2177
- box.appendChild(createArrowElement(nextProps.arrow));
2178
- }
2179
- } else if (arrow) {
2180
- box.removeChild(arrow);
2181
- }
2182
- }
2183
-
2184
- return {
2185
- popper: popper,
2186
- onUpdate: onUpdate
2187
- };
2188
- } // Runtime check to identify if the render function is the default one; this
2189
- // way we can apply default CSS transitions logic and it can be tree-shaken away
2190
-
2191
- render.$$tippy = true;
2192
-
2193
- var idCounter = 1;
2194
- var mouseMoveListeners = []; // Used by `hideAll()`
2195
-
2196
- var mountedInstances = [];
2197
- function createTippy(reference, passedProps) {
2198
- var props = evaluateProps(reference, Object.assign({}, defaultProps, {}, getExtendedPassedProps(removeUndefinedProps(passedProps)))); // ===========================================================================
2199
- // 🔒 Private members
2200
- // ===========================================================================
2201
-
2202
- var showTimeout;
2203
- var hideTimeout;
2204
- var scheduleHideAnimationFrame;
2205
- var isVisibleFromClick = false;
2206
- var didHideDueToDocumentMouseDown = false;
2207
- var didTouchMove = false;
2208
- var ignoreOnFirstUpdate = false;
2209
- var lastTriggerEvent;
2210
- var currentTransitionEndListener;
2211
- var onFirstUpdate;
2212
- var listeners = [];
2213
- var debouncedOnMouseMove = debounce$1(onMouseMove, props.interactiveDebounce);
2214
- var currentTarget; // ===========================================================================
2215
- // 🔑 Public members
2216
- // ===========================================================================
2217
-
2218
- var id = idCounter++;
2219
- var popperInstance = null;
2220
- var plugins = unique(props.plugins);
2221
- var state = {
2222
- // Is the instance currently enabled?
2223
- isEnabled: true,
2224
- // Is the tippy currently showing and not transitioning out?
2225
- isVisible: false,
2226
- // Has the instance been destroyed?
2227
- isDestroyed: false,
2228
- // Is the tippy currently mounted to the DOM?
2229
- isMounted: false,
2230
- // Has the tippy finished transitioning in?
2231
- isShown: false
2232
- };
2233
- var instance = {
2234
- // properties
2235
- id: id,
2236
- reference: reference,
2237
- popper: div(),
2238
- popperInstance: popperInstance,
2239
- props: props,
2240
- state: state,
2241
- plugins: plugins,
2242
- // methods
2243
- clearDelayTimeouts: clearDelayTimeouts,
2244
- setProps: setProps,
2245
- setContent: setContent,
2246
- show: show,
2247
- hide: hide,
2248
- hideWithInteractivity: hideWithInteractivity,
2249
- enable: enable,
2250
- disable: disable,
2251
- unmount: unmount,
2252
- destroy: destroy
2253
- }; // TODO: Investigate why this early return causes a TDZ error in the tests —
2254
- // it doesn't seem to happen in the browser
2255
-
2256
- /* istanbul ignore if */
2257
-
2258
- if (!props.render) {
2259
-
2260
- return instance;
2261
- } // ===========================================================================
2262
- // Initial mutations
2263
- // ===========================================================================
2264
-
2265
-
2266
- var _props$render = props.render(instance),
2267
- popper = _props$render.popper,
2268
- onUpdate = _props$render.onUpdate;
2269
-
2270
- popper.setAttribute('data-tippy-root', '');
2271
- popper.id = "tippy-" + instance.id;
2272
- instance.popper = popper;
2273
- reference._tippy = instance;
2274
- popper._tippy = instance;
2275
- var pluginsHooks = plugins.map(function (plugin) {
2276
- return plugin.fn(instance);
2277
- });
2278
- var hasAriaExpanded = reference.hasAttribute('aria-expanded');
2279
- addListeners();
2280
- handleAriaExpandedAttribute();
2281
- handleStyles();
2282
- invokeHook('onCreate', [instance]);
2283
-
2284
- if (props.showOnCreate) {
2285
- scheduleShow();
2286
- } // Prevent a tippy with a delay from hiding if the cursor left then returned
2287
- // before it started hiding
2288
-
2289
-
2290
- popper.addEventListener('mouseenter', function () {
2291
- if (instance.props.interactive && instance.state.isVisible) {
2292
- instance.clearDelayTimeouts();
2293
- }
2294
- });
2295
- popper.addEventListener('mouseleave', function (event) {
2296
- if (instance.props.interactive && instance.props.trigger.indexOf('mouseenter') >= 0) {
2297
- getDocument().addEventListener('mousemove', debouncedOnMouseMove);
2298
- debouncedOnMouseMove(event);
2299
- }
2300
- });
2301
- return instance; // ===========================================================================
2302
- // 🔒 Private methods
2303
- // ===========================================================================
2304
-
2305
- function getNormalizedTouchSettings() {
2306
- var touch = instance.props.touch;
2307
- return Array.isArray(touch) ? touch : [touch, 0];
2308
- }
2309
-
2310
- function getIsCustomTouchBehavior() {
2311
- return getNormalizedTouchSettings()[0] === 'hold';
2312
- }
2313
-
2314
- function getIsDefaultRenderFn() {
2315
- var _instance$props$rende;
2316
-
2317
- // @ts-ignore
2318
- return !!((_instance$props$rende = instance.props.render) == null ? void 0 : _instance$props$rende.$$tippy);
2319
- }
2320
-
2321
- function getCurrentTarget() {
2322
- return currentTarget || reference;
2323
- }
2324
-
2325
- function getDocument() {
2326
- var parent = getCurrentTarget().parentNode;
2327
- return parent ? getOwnerDocument(parent) : document;
2328
- }
2329
-
2330
- function getDefaultTemplateChildren() {
2331
- return getChildren(popper);
2332
- }
2333
-
2334
- function getDelay(isShow) {
2335
- // For touch or keyboard input, force `0` delay for UX reasons
2336
- // Also if the instance is mounted but not visible (transitioning out),
2337
- // ignore delay
2338
- if (instance.state.isMounted && !instance.state.isVisible || currentInput.isTouch || lastTriggerEvent && lastTriggerEvent.type === 'focus') {
2339
- return 0;
2340
- }
2341
-
2342
- return getValueAtIndexOrReturn(instance.props.delay, isShow ? 0 : 1, defaultProps.delay);
2343
- }
2344
-
2345
- function handleStyles() {
2346
- popper.style.pointerEvents = instance.props.interactive && instance.state.isVisible ? '' : 'none';
2347
- popper.style.zIndex = "" + instance.props.zIndex;
2348
- }
2349
-
2350
- function invokeHook(hook, args, shouldInvokePropsHook) {
2351
- if (shouldInvokePropsHook === void 0) {
2352
- shouldInvokePropsHook = true;
2353
- }
2354
-
2355
- pluginsHooks.forEach(function (pluginHooks) {
2356
- if (pluginHooks[hook]) {
2357
- pluginHooks[hook].apply(void 0, args);
2358
- }
2359
- });
2360
-
2361
- if (shouldInvokePropsHook) {
2362
- var _instance$props;
2363
-
2364
- (_instance$props = instance.props)[hook].apply(_instance$props, args);
2365
- }
2366
- }
2367
-
2368
- function handleAriaContentAttribute() {
2369
- var aria = instance.props.aria;
2370
-
2371
- if (!aria.content) {
2372
- return;
2373
- }
2374
-
2375
- var attr = "aria-" + aria.content;
2376
- var id = popper.id;
2377
- var nodes = normalizeToArray(instance.props.triggerTarget || reference);
2378
- nodes.forEach(function (node) {
2379
- var currentValue = node.getAttribute(attr);
2380
-
2381
- if (instance.state.isVisible) {
2382
- node.setAttribute(attr, currentValue ? currentValue + " " + id : id);
2383
- } else {
2384
- var nextValue = currentValue && currentValue.replace(id, '').trim();
2385
-
2386
- if (nextValue) {
2387
- node.setAttribute(attr, nextValue);
2388
- } else {
2389
- node.removeAttribute(attr);
2390
- }
2391
- }
2392
- });
2393
- }
2394
-
2395
- function handleAriaExpandedAttribute() {
2396
- if (hasAriaExpanded || !instance.props.aria.expanded) {
2397
- return;
2398
- }
2399
-
2400
- var nodes = normalizeToArray(instance.props.triggerTarget || reference);
2401
- nodes.forEach(function (node) {
2402
- if (instance.props.interactive) {
2403
- node.setAttribute('aria-expanded', instance.state.isVisible && node === getCurrentTarget() ? 'true' : 'false');
2404
- } else {
2405
- node.removeAttribute('aria-expanded');
2406
- }
2407
- });
2408
- }
2409
-
2410
- function cleanupInteractiveMouseListeners() {
2411
- getDocument().removeEventListener('mousemove', debouncedOnMouseMove);
2412
- mouseMoveListeners = mouseMoveListeners.filter(function (listener) {
2413
- return listener !== debouncedOnMouseMove;
2414
- });
2415
- }
2416
-
2417
- function onDocumentPress(event) {
2418
- // Moved finger to scroll instead of an intentional tap outside
2419
- if (currentInput.isTouch) {
2420
- if (didTouchMove || event.type === 'mousedown') {
2421
- return;
2422
- }
2423
- } // Clicked on interactive popper
2424
-
2425
-
2426
- if (instance.props.interactive && popper.contains(event.target)) {
2427
- return;
2428
- } // Clicked on the event listeners target
2429
-
2430
-
2431
- if (getCurrentTarget().contains(event.target)) {
2432
- if (currentInput.isTouch) {
2433
- return;
2434
- }
2435
-
2436
- if (instance.state.isVisible && instance.props.trigger.indexOf('click') >= 0) {
2437
- return;
2438
- }
2439
- } else {
2440
- invokeHook('onClickOutside', [instance, event]);
2441
- }
2442
-
2443
- if (instance.props.hideOnClick === true) {
2444
- instance.clearDelayTimeouts();
2445
- instance.hide(); // `mousedown` event is fired right before `focus` if pressing the
2446
- // currentTarget. This lets a tippy with `focus` trigger know that it
2447
- // should not show
2448
-
2449
- didHideDueToDocumentMouseDown = true;
2450
- setTimeout(function () {
2451
- didHideDueToDocumentMouseDown = false;
2452
- }); // The listener gets added in `scheduleShow()`, but this may be hiding it
2453
- // before it shows, and hide()'s early bail-out behavior can prevent it
2454
- // from being cleaned up
2455
-
2456
- if (!instance.state.isMounted) {
2457
- removeDocumentPress();
2458
- }
2459
- }
2460
- }
2461
-
2462
- function onTouchMove() {
2463
- didTouchMove = true;
2464
- }
2465
-
2466
- function onTouchStart() {
2467
- didTouchMove = false;
2468
- }
2469
-
2470
- function addDocumentPress() {
2471
- var doc = getDocument();
2472
- doc.addEventListener('mousedown', onDocumentPress, true);
2473
- doc.addEventListener('touchend', onDocumentPress, TOUCH_OPTIONS);
2474
- doc.addEventListener('touchstart', onTouchStart, TOUCH_OPTIONS);
2475
- doc.addEventListener('touchmove', onTouchMove, TOUCH_OPTIONS);
2476
- }
2477
-
2478
- function removeDocumentPress() {
2479
- var doc = getDocument();
2480
- doc.removeEventListener('mousedown', onDocumentPress, true);
2481
- doc.removeEventListener('touchend', onDocumentPress, TOUCH_OPTIONS);
2482
- doc.removeEventListener('touchstart', onTouchStart, TOUCH_OPTIONS);
2483
- doc.removeEventListener('touchmove', onTouchMove, TOUCH_OPTIONS);
2484
- }
2485
-
2486
- function onTransitionedOut(duration, callback) {
2487
- onTransitionEnd(duration, function () {
2488
- if (!instance.state.isVisible && popper.parentNode && popper.parentNode.contains(popper)) {
2489
- callback();
2490
- }
2491
- });
2492
- }
2493
-
2494
- function onTransitionedIn(duration, callback) {
2495
- onTransitionEnd(duration, callback);
2496
- }
2497
-
2498
- function onTransitionEnd(duration, callback) {
2499
- var box = getDefaultTemplateChildren().box;
2500
-
2501
- function listener(event) {
2502
- if (event.target === box) {
2503
- updateTransitionEndListener(box, 'remove', listener);
2504
- callback();
2505
- }
2506
- } // Make callback synchronous if duration is 0
2507
- // `transitionend` won't fire otherwise
2508
-
2509
-
2510
- if (duration === 0) {
2511
- return callback();
2512
- }
2513
-
2514
- updateTransitionEndListener(box, 'remove', currentTransitionEndListener);
2515
- updateTransitionEndListener(box, 'add', listener);
2516
- currentTransitionEndListener = listener;
2517
- }
2518
-
2519
- function on(eventType, handler, options) {
2520
- if (options === void 0) {
2521
- options = false;
2522
- }
2523
-
2524
- var nodes = normalizeToArray(instance.props.triggerTarget || reference);
2525
- nodes.forEach(function (node) {
2526
- node.addEventListener(eventType, handler, options);
2527
- listeners.push({
2528
- node: node,
2529
- eventType: eventType,
2530
- handler: handler,
2531
- options: options
2532
- });
2533
- });
2534
- }
2535
-
2536
- function addListeners() {
2537
- if (getIsCustomTouchBehavior()) {
2538
- on('touchstart', onTrigger, {
2539
- passive: true
2540
- });
2541
- on('touchend', onMouseLeave, {
2542
- passive: true
2543
- });
2544
- }
2545
-
2546
- splitBySpaces(instance.props.trigger).forEach(function (eventType) {
2547
- if (eventType === 'manual') {
2548
- return;
2549
- }
2550
-
2551
- on(eventType, onTrigger);
2552
-
2553
- switch (eventType) {
2554
- case 'mouseenter':
2555
- on('mouseleave', onMouseLeave);
2556
- break;
2557
-
2558
- case 'focus':
2559
- on(isIE ? 'focusout' : 'blur', onBlurOrFocusOut);
2560
- break;
2561
-
2562
- case 'focusin':
2563
- on('focusout', onBlurOrFocusOut);
2564
- break;
2565
- }
2566
- });
2567
- }
2568
-
2569
- function removeListeners() {
2570
- listeners.forEach(function (_ref) {
2571
- var node = _ref.node,
2572
- eventType = _ref.eventType,
2573
- handler = _ref.handler,
2574
- options = _ref.options;
2575
- node.removeEventListener(eventType, handler, options);
2576
- });
2577
- listeners = [];
2578
- }
2579
-
2580
- function onTrigger(event) {
2581
- var _lastTriggerEvent;
2582
-
2583
- var shouldScheduleClickHide = false;
2584
-
2585
- if (!instance.state.isEnabled || isEventListenerStopped(event) || didHideDueToDocumentMouseDown) {
2586
- return;
2587
- }
2588
-
2589
- var wasFocused = ((_lastTriggerEvent = lastTriggerEvent) == null ? void 0 : _lastTriggerEvent.type) === 'focus';
2590
- lastTriggerEvent = event;
2591
- currentTarget = event.currentTarget;
2592
- handleAriaExpandedAttribute();
2593
-
2594
- if (!instance.state.isVisible && isMouseEvent(event)) {
2595
- // If scrolling, `mouseenter` events can be fired if the cursor lands
2596
- // over a new target, but `mousemove` events don't get fired. This
2597
- // causes interactive tooltips to get stuck open until the cursor is
2598
- // moved
2599
- mouseMoveListeners.forEach(function (listener) {
2600
- return listener(event);
2601
- });
2602
- } // Toggle show/hide when clicking click-triggered tooltips
2603
-
2604
-
2605
- if (event.type === 'click' && (instance.props.trigger.indexOf('mouseenter') < 0 || isVisibleFromClick) && instance.props.hideOnClick !== false && instance.state.isVisible) {
2606
- shouldScheduleClickHide = true;
2607
- } else {
2608
- scheduleShow(event);
2609
- }
2610
-
2611
- if (event.type === 'click') {
2612
- isVisibleFromClick = !shouldScheduleClickHide;
2613
- }
2614
-
2615
- if (shouldScheduleClickHide && !wasFocused) {
2616
- scheduleHide(event);
2617
- }
2618
- }
2619
-
2620
- function onMouseMove(event) {
2621
- var target = event.target;
2622
- var isCursorOverReferenceOrPopper = getCurrentTarget().contains(target) || popper.contains(target);
2623
-
2624
- if (event.type === 'mousemove' && isCursorOverReferenceOrPopper) {
2625
- return;
2626
- }
2627
-
2628
- var popperTreeData = getNestedPopperTree().concat(popper).map(function (popper) {
2629
- var _instance$popperInsta;
2630
-
2631
- var instance = popper._tippy;
2632
- var state = (_instance$popperInsta = instance.popperInstance) == null ? void 0 : _instance$popperInsta.state;
2633
-
2634
- if (state) {
2635
- return {
2636
- popperRect: popper.getBoundingClientRect(),
2637
- popperState: state,
2638
- props: props
2639
- };
2640
- }
2641
-
2642
- return null;
2643
- }).filter(Boolean);
2644
-
2645
- if (isCursorOutsideInteractiveBorder(popperTreeData, event)) {
2646
- cleanupInteractiveMouseListeners();
2647
- scheduleHide(event);
2648
- }
2649
- }
2650
-
2651
- function onMouseLeave(event) {
2652
- var shouldBail = isEventListenerStopped(event) || instance.props.trigger.indexOf('click') >= 0 && isVisibleFromClick;
2653
-
2654
- if (shouldBail) {
2655
- return;
2656
- }
2657
-
2658
- if (instance.props.interactive) {
2659
- instance.hideWithInteractivity(event);
2660
- return;
2661
- }
2662
-
2663
- scheduleHide(event);
2664
- }
2665
-
2666
- function onBlurOrFocusOut(event) {
2667
- if (instance.props.trigger.indexOf('focusin') < 0 && event.target !== getCurrentTarget()) {
2668
- return;
2669
- } // If focus was moved to within the popper
2670
-
2671
-
2672
- if (instance.props.interactive && event.relatedTarget && popper.contains(event.relatedTarget)) {
2673
- return;
2674
- }
2675
-
2676
- scheduleHide(event);
2677
- }
2678
-
2679
- function isEventListenerStopped(event) {
2680
- return currentInput.isTouch ? getIsCustomTouchBehavior() !== event.type.indexOf('touch') >= 0 : false;
2681
- }
2682
-
2683
- function createPopperInstance() {
2684
- destroyPopperInstance();
2685
- var _instance$props2 = instance.props,
2686
- popperOptions = _instance$props2.popperOptions,
2687
- placement = _instance$props2.placement,
2688
- offset = _instance$props2.offset,
2689
- getReferenceClientRect = _instance$props2.getReferenceClientRect,
2690
- moveTransition = _instance$props2.moveTransition;
2691
- var arrow = getIsDefaultRenderFn() ? getChildren(popper).arrow : null;
2692
- var computedReference = getReferenceClientRect ? {
2693
- getBoundingClientRect: getReferenceClientRect,
2694
- contextElement: getReferenceClientRect.contextElement || getCurrentTarget()
2695
- } : reference;
2696
- var tippyModifier = {
2697
- name: '$$tippy',
2698
- enabled: true,
2699
- phase: 'beforeWrite',
2700
- requires: ['computeStyles'],
2701
- fn: function fn(_ref2) {
2702
- var state = _ref2.state;
2703
-
2704
- if (getIsDefaultRenderFn()) {
2705
- var _getDefaultTemplateCh = getDefaultTemplateChildren(),
2706
- box = _getDefaultTemplateCh.box;
2707
-
2708
- ['placement', 'reference-hidden', 'escaped'].forEach(function (attr) {
2709
- if (attr === 'placement') {
2710
- box.setAttribute('data-placement', state.placement);
2711
- } else {
2712
- if (state.attributes.popper["data-popper-" + attr]) {
2713
- box.setAttribute("data-" + attr, '');
2714
- } else {
2715
- box.removeAttribute("data-" + attr);
2716
- }
2717
- }
2718
- });
2719
- state.attributes.popper = {};
2720
- }
2721
- }
2722
- };
2723
- var modifiers = [{
2724
- name: 'offset',
2725
- options: {
2726
- offset: offset
2727
- }
2728
- }, {
2729
- name: 'preventOverflow',
2730
- options: {
2731
- padding: {
2732
- top: 2,
2733
- bottom: 2,
2734
- left: 5,
2735
- right: 5
2736
- }
2737
- }
2738
- }, {
2739
- name: 'flip',
2740
- options: {
2741
- padding: 5
2742
- }
2743
- }, {
2744
- name: 'computeStyles',
2745
- options: {
2746
- adaptive: !moveTransition
2747
- }
2748
- }, tippyModifier];
2749
-
2750
- if (getIsDefaultRenderFn() && arrow) {
2751
- modifiers.push({
2752
- name: 'arrow',
2753
- options: {
2754
- element: arrow,
2755
- padding: 3
2756
- }
2757
- });
2758
- }
2759
-
2760
- modifiers.push.apply(modifiers, (popperOptions == null ? void 0 : popperOptions.modifiers) || []);
2761
- instance.popperInstance = createPopper(computedReference, popper, Object.assign({}, popperOptions, {
2762
- placement: placement,
2763
- onFirstUpdate: onFirstUpdate,
2764
- modifiers: modifiers
2765
- }));
2766
- }
2767
-
2768
- function destroyPopperInstance() {
2769
- if (instance.popperInstance) {
2770
- instance.popperInstance.destroy();
2771
- instance.popperInstance = null;
2772
- }
2773
- }
2774
-
2775
- function mount() {
2776
- var appendTo = instance.props.appendTo;
2777
- var parentNode; // By default, we'll append the popper to the triggerTargets's parentNode so
2778
- // it's directly after the reference element so the elements inside the
2779
- // tippy can be tabbed to
2780
- // If there are clipping issues, the user can specify a different appendTo
2781
- // and ensure focus management is handled correctly manually
2782
-
2783
- var node = getCurrentTarget();
2784
-
2785
- if (instance.props.interactive && appendTo === defaultProps.appendTo || appendTo === 'parent') {
2786
- parentNode = node.parentNode;
2787
- } else {
2788
- parentNode = invokeWithArgsOrReturn(appendTo, [node]);
2789
- } // The popper element needs to exist on the DOM before its position can be
2790
- // updated as Popper needs to read its dimensions
2791
-
2792
-
2793
- if (!parentNode.contains(popper)) {
2794
- parentNode.appendChild(popper);
2795
- }
2796
-
2797
- createPopperInstance();
2798
- }
2799
-
2800
- function getNestedPopperTree() {
2801
- return arrayFrom(popper.querySelectorAll('[data-tippy-root]'));
2802
- }
2803
-
2804
- function scheduleShow(event) {
2805
- instance.clearDelayTimeouts();
2806
-
2807
- if (event) {
2808
- invokeHook('onTrigger', [instance, event]);
2809
- }
2810
-
2811
- addDocumentPress();
2812
- var delay = getDelay(true);
2813
-
2814
- var _getNormalizedTouchSe = getNormalizedTouchSettings(),
2815
- touchValue = _getNormalizedTouchSe[0],
2816
- touchDelay = _getNormalizedTouchSe[1];
2817
-
2818
- if (currentInput.isTouch && touchValue === 'hold' && touchDelay) {
2819
- delay = touchDelay;
2820
- }
2821
-
2822
- if (delay) {
2823
- showTimeout = setTimeout(function () {
2824
- instance.show();
2825
- }, delay);
2826
- } else {
2827
- instance.show();
2828
- }
2829
- }
2830
-
2831
- function scheduleHide(event) {
2832
- instance.clearDelayTimeouts();
2833
- invokeHook('onUntrigger', [instance, event]);
2834
-
2835
- if (!instance.state.isVisible) {
2836
- removeDocumentPress();
2837
- return;
2838
- } // For interactive tippies, scheduleHide is added to a document.body handler
2839
- // from onMouseLeave so must intercept scheduled hides from mousemove/leave
2840
- // events when trigger contains mouseenter and click, and the tip is
2841
- // currently shown as a result of a click.
2842
-
2843
-
2844
- if (instance.props.trigger.indexOf('mouseenter') >= 0 && instance.props.trigger.indexOf('click') >= 0 && ['mouseleave', 'mousemove'].indexOf(event.type) >= 0 && isVisibleFromClick) {
2845
- return;
2846
- }
2847
-
2848
- var delay = getDelay(false);
2849
-
2850
- if (delay) {
2851
- hideTimeout = setTimeout(function () {
2852
- if (instance.state.isVisible) {
2853
- instance.hide();
2854
- }
2855
- }, delay);
2856
- } else {
2857
- // Fixes a `transitionend` problem when it fires 1 frame too
2858
- // late sometimes, we don't want hide() to be called.
2859
- scheduleHideAnimationFrame = requestAnimationFrame(function () {
2860
- instance.hide();
2861
- });
2862
- }
2863
- } // ===========================================================================
2864
- // 🔑 Public methods
2865
- // ===========================================================================
2866
-
2867
-
2868
- function enable() {
2869
- instance.state.isEnabled = true;
2870
- }
2871
-
2872
- function disable() {
2873
- // Disabling the instance should also hide it
2874
- // https://github.com/atomiks/tippy.js-react/issues/106
2875
- instance.hide();
2876
- instance.state.isEnabled = false;
2877
- }
2878
-
2879
- function clearDelayTimeouts() {
2880
- clearTimeout(showTimeout);
2881
- clearTimeout(hideTimeout);
2882
- cancelAnimationFrame(scheduleHideAnimationFrame);
2883
- }
2884
-
2885
- function setProps(partialProps) {
2886
-
2887
- if (instance.state.isDestroyed) {
2888
- return;
2889
- }
2890
-
2891
- invokeHook('onBeforeUpdate', [instance, partialProps]);
2892
- removeListeners();
2893
- var prevProps = instance.props;
2894
- var nextProps = evaluateProps(reference, Object.assign({}, instance.props, {}, partialProps, {
2895
- ignoreAttributes: true
2896
- }));
2897
- instance.props = nextProps;
2898
- addListeners();
2899
-
2900
- if (prevProps.interactiveDebounce !== nextProps.interactiveDebounce) {
2901
- cleanupInteractiveMouseListeners();
2902
- debouncedOnMouseMove = debounce$1(onMouseMove, nextProps.interactiveDebounce);
2903
- } // Ensure stale aria-expanded attributes are removed
2904
-
2905
-
2906
- if (prevProps.triggerTarget && !nextProps.triggerTarget) {
2907
- normalizeToArray(prevProps.triggerTarget).forEach(function (node) {
2908
- node.removeAttribute('aria-expanded');
2909
- });
2910
- } else if (nextProps.triggerTarget) {
2911
- reference.removeAttribute('aria-expanded');
2912
- }
2913
-
2914
- handleAriaExpandedAttribute();
2915
- handleStyles();
2916
-
2917
- if (onUpdate) {
2918
- onUpdate(prevProps, nextProps);
2919
- }
2920
-
2921
- if (instance.popperInstance) {
2922
- createPopperInstance(); // Fixes an issue with nested tippies if they are all getting re-rendered,
2923
- // and the nested ones get re-rendered first.
2924
- // https://github.com/atomiks/tippyjs-react/issues/177
2925
- // TODO: find a cleaner / more efficient solution(!)
2926
-
2927
- getNestedPopperTree().forEach(function (nestedPopper) {
2928
- // React (and other UI libs likely) requires a rAF wrapper as it flushes
2929
- // its work in one
2930
- requestAnimationFrame(nestedPopper._tippy.popperInstance.forceUpdate);
2931
- });
2932
- }
2933
-
2934
- invokeHook('onAfterUpdate', [instance, partialProps]);
2935
- }
2936
-
2937
- function setContent(content) {
2938
- instance.setProps({
2939
- content: content
2940
- });
2941
- }
2942
-
2943
- function show() {
2944
-
2945
-
2946
- var isAlreadyVisible = instance.state.isVisible;
2947
- var isDestroyed = instance.state.isDestroyed;
2948
- var isDisabled = !instance.state.isEnabled;
2949
- var isTouchAndTouchDisabled = currentInput.isTouch && !instance.props.touch;
2950
- var duration = getValueAtIndexOrReturn(instance.props.duration, 0, defaultProps.duration);
2951
-
2952
- if (isAlreadyVisible || isDestroyed || isDisabled || isTouchAndTouchDisabled) {
2953
- return;
2954
- } // Normalize `disabled` behavior across browsers.
2955
- // Firefox allows events on disabled elements, but Chrome doesn't.
2956
- // Using a wrapper element (i.e. <span>) is recommended.
2957
-
2958
-
2959
- if (getCurrentTarget().hasAttribute('disabled')) {
2960
- return;
2961
- }
2962
-
2963
- invokeHook('onShow', [instance], false);
2964
-
2965
- if (instance.props.onShow(instance) === false) {
2966
- return;
2967
- }
2968
-
2969
- instance.state.isVisible = true;
2970
-
2971
- if (getIsDefaultRenderFn()) {
2972
- popper.style.visibility = 'visible';
2973
- }
2974
-
2975
- handleStyles();
2976
- addDocumentPress();
2977
-
2978
- if (!instance.state.isMounted) {
2979
- popper.style.transition = 'none';
2980
- } // If flipping to the opposite side after hiding at least once, the
2981
- // animation will use the wrong placement without resetting the duration
2982
-
2983
-
2984
- if (getIsDefaultRenderFn()) {
2985
- var _getDefaultTemplateCh2 = getDefaultTemplateChildren(),
2986
- box = _getDefaultTemplateCh2.box,
2987
- content = _getDefaultTemplateCh2.content;
2988
-
2989
- setTransitionDuration([box, content], 0);
2990
- }
2991
-
2992
- onFirstUpdate = function onFirstUpdate() {
2993
- var _instance$popperInsta2;
2994
-
2995
- if (!instance.state.isVisible || ignoreOnFirstUpdate) {
2996
- return;
2997
- }
2998
-
2999
- ignoreOnFirstUpdate = true; // reflow
3000
-
3001
- void popper.offsetHeight;
3002
- popper.style.transition = instance.props.moveTransition;
3003
-
3004
- if (getIsDefaultRenderFn() && instance.props.animation) {
3005
- var _getDefaultTemplateCh3 = getDefaultTemplateChildren(),
3006
- _box = _getDefaultTemplateCh3.box,
3007
- _content = _getDefaultTemplateCh3.content;
3008
-
3009
- setTransitionDuration([_box, _content], duration);
3010
- setVisibilityState([_box, _content], 'visible');
3011
- }
3012
-
3013
- handleAriaContentAttribute();
3014
- handleAriaExpandedAttribute();
3015
- pushIfUnique(mountedInstances, instance); // certain modifiers (e.g. `maxSize`) require a second update after the
3016
- // popper has been positioned for the first time
3017
-
3018
- (_instance$popperInsta2 = instance.popperInstance) == null ? void 0 : _instance$popperInsta2.forceUpdate();
3019
- instance.state.isMounted = true;
3020
- invokeHook('onMount', [instance]);
3021
-
3022
- if (instance.props.animation && getIsDefaultRenderFn()) {
3023
- onTransitionedIn(duration, function () {
3024
- instance.state.isShown = true;
3025
- invokeHook('onShown', [instance]);
3026
- });
3027
- }
3028
- };
3029
-
3030
- mount();
3031
- }
3032
-
3033
- function hide() {
3034
-
3035
-
3036
- var isAlreadyHidden = !instance.state.isVisible;
3037
- var isDestroyed = instance.state.isDestroyed;
3038
- var isDisabled = !instance.state.isEnabled;
3039
- var duration = getValueAtIndexOrReturn(instance.props.duration, 1, defaultProps.duration);
3040
-
3041
- if (isAlreadyHidden || isDestroyed || isDisabled) {
3042
- return;
3043
- }
3044
-
3045
- invokeHook('onHide', [instance], false);
3046
-
3047
- if (instance.props.onHide(instance) === false) {
3048
- return;
3049
- }
3050
-
3051
- instance.state.isVisible = false;
3052
- instance.state.isShown = false;
3053
- ignoreOnFirstUpdate = false;
3054
- isVisibleFromClick = false;
3055
-
3056
- if (getIsDefaultRenderFn()) {
3057
- popper.style.visibility = 'hidden';
3058
- }
3059
-
3060
- cleanupInteractiveMouseListeners();
3061
- removeDocumentPress();
3062
- handleStyles();
3063
-
3064
- if (getIsDefaultRenderFn()) {
3065
- var _getDefaultTemplateCh4 = getDefaultTemplateChildren(),
3066
- box = _getDefaultTemplateCh4.box,
3067
- content = _getDefaultTemplateCh4.content;
3068
-
3069
- if (instance.props.animation) {
3070
- setTransitionDuration([box, content], duration);
3071
- setVisibilityState([box, content], 'hidden');
3072
- }
3073
- }
3074
-
3075
- handleAriaContentAttribute();
3076
- handleAriaExpandedAttribute();
3077
-
3078
- if (instance.props.animation) {
3079
- if (getIsDefaultRenderFn()) {
3080
- onTransitionedOut(duration, instance.unmount);
3081
- }
3082
- } else {
3083
- instance.unmount();
3084
- }
3085
- }
3086
-
3087
- function hideWithInteractivity(event) {
3088
-
3089
- getDocument().addEventListener('mousemove', debouncedOnMouseMove);
3090
- pushIfUnique(mouseMoveListeners, debouncedOnMouseMove);
3091
- debouncedOnMouseMove(event);
3092
- }
3093
-
3094
- function unmount() {
3095
-
3096
- if (instance.state.isVisible) {
3097
- instance.hide();
3098
- }
3099
-
3100
- if (!instance.state.isMounted) {
3101
- return;
3102
- }
3103
-
3104
- destroyPopperInstance(); // If a popper is not interactive, it will be appended outside the popper
3105
- // tree by default. This seems mainly for interactive tippies, but we should
3106
- // find a workaround if possible
3107
-
3108
- getNestedPopperTree().forEach(function (nestedPopper) {
3109
- nestedPopper._tippy.unmount();
3110
- });
3111
-
3112
- if (popper.parentNode) {
3113
- popper.parentNode.removeChild(popper);
3114
- }
3115
-
3116
- mountedInstances = mountedInstances.filter(function (i) {
3117
- return i !== instance;
3118
- });
3119
- instance.state.isMounted = false;
3120
- invokeHook('onHidden', [instance]);
3121
- }
3122
-
3123
- function destroy() {
3124
-
3125
- if (instance.state.isDestroyed) {
3126
- return;
3127
- }
3128
-
3129
- instance.clearDelayTimeouts();
3130
- instance.unmount();
3131
- removeListeners();
3132
- delete reference._tippy;
3133
- instance.state.isDestroyed = true;
3134
- invokeHook('onDestroy', [instance]);
3135
- }
3136
- }
3137
-
3138
- function tippy(targets, optionalProps) {
3139
- if (optionalProps === void 0) {
3140
- optionalProps = {};
3141
- }
3142
-
3143
- var plugins = defaultProps.plugins.concat(optionalProps.plugins || []);
3144
-
3145
- bindGlobalEventListeners();
3146
- var passedProps = Object.assign({}, optionalProps, {
3147
- plugins: plugins
3148
- });
3149
- var elements = getArrayOfElements(targets);
3150
-
3151
- var instances = elements.reduce(function (acc, reference) {
3152
- var instance = reference && createTippy(reference, passedProps);
3153
-
3154
- if (instance) {
3155
- acc.push(instance);
3156
- }
3157
-
3158
- return acc;
3159
- }, []);
3160
- return isElement$1(targets) ? instances[0] : instances;
3161
- }
3162
-
3163
- tippy.defaultProps = defaultProps;
3164
- tippy.setDefaultProps = setDefaultProps;
3165
- tippy.currentInput = currentInput;
3166
-
3167
- // every time the popper is destroyed (i.e. a new target), removing the styles
3168
- // and causing transitions to break for singletons when the console is open, but
3169
- // most notably for non-transform styles being used, `gpuAcceleration: false`.
3170
-
3171
- var applyStylesModifier = Object.assign({}, applyStyles$1, {
3172
- effect: function effect(_ref) {
3173
- var state = _ref.state;
3174
- var initialStyles = {
3175
- popper: {
3176
- position: state.options.strategy,
3177
- left: '0',
3178
- top: '0',
3179
- margin: '0'
3180
- },
3181
- arrow: {
3182
- position: 'absolute'
3183
- },
3184
- reference: {}
3185
- };
3186
- Object.assign(state.elements.popper.style, initialStyles.popper);
3187
- state.styles = initialStyles;
3188
-
3189
- if (state.elements.arrow) {
3190
- Object.assign(state.elements.arrow.style, initialStyles.arrow);
3191
- } // intentionally return no cleanup function
3192
- // return () => { ... }
3193
-
3194
- }
3195
- });
3196
-
3197
- var createSingleton = function createSingleton(tippyInstances, optionalProps) {
3198
- var _optionalProps$popper;
3199
-
3200
- if (optionalProps === void 0) {
3201
- optionalProps = {};
3202
- }
3203
-
3204
- var individualInstances = tippyInstances;
3205
- var references = [];
3206
- var currentTarget;
3207
- var overrides = optionalProps.overrides;
3208
- var interceptSetPropsCleanups = [];
3209
- var shownOnCreate = false;
3210
-
3211
- function setReferences() {
3212
- references = individualInstances.map(function (instance) {
3213
- return instance.reference;
3214
- });
3215
- }
3216
-
3217
- function enableInstances(isEnabled) {
3218
- individualInstances.forEach(function (instance) {
3219
- if (isEnabled) {
3220
- instance.enable();
3221
- } else {
3222
- instance.disable();
3223
- }
3224
- });
3225
- }
3226
-
3227
- function interceptSetProps(singleton) {
3228
- return individualInstances.map(function (instance) {
3229
- var originalSetProps = instance.setProps;
3230
-
3231
- instance.setProps = function (props) {
3232
- originalSetProps(props);
3233
-
3234
- if (instance.reference === currentTarget) {
3235
- singleton.setProps(props);
3236
- }
3237
- };
3238
-
3239
- return function () {
3240
- instance.setProps = originalSetProps;
3241
- };
3242
- });
3243
- } // have to pass singleton, as it maybe undefined on first call
3244
-
3245
-
3246
- function prepareInstance(singleton, target) {
3247
- var index = references.indexOf(target); // bail-out
3248
-
3249
- if (target === currentTarget) {
3250
- return;
3251
- }
3252
-
3253
- currentTarget = target;
3254
- var overrideProps = (overrides || []).concat('content').reduce(function (acc, prop) {
3255
- acc[prop] = individualInstances[index].props[prop];
3256
- return acc;
3257
- }, {});
3258
- singleton.setProps(Object.assign({}, overrideProps, {
3259
- getReferenceClientRect: typeof overrideProps.getReferenceClientRect === 'function' ? overrideProps.getReferenceClientRect : function () {
3260
- return target.getBoundingClientRect();
3261
- }
3262
- }));
3263
- }
3264
-
3265
- enableInstances(false);
3266
- setReferences();
3267
- var plugin = {
3268
- fn: function fn() {
3269
- return {
3270
- onDestroy: function onDestroy() {
3271
- enableInstances(true);
3272
- },
3273
- onHidden: function onHidden() {
3274
- currentTarget = null;
3275
- },
3276
- onClickOutside: function onClickOutside(instance) {
3277
- if (instance.props.showOnCreate && !shownOnCreate) {
3278
- shownOnCreate = true;
3279
- currentTarget = null;
3280
- }
3281
- },
3282
- onShow: function onShow(instance) {
3283
- if (instance.props.showOnCreate && !shownOnCreate) {
3284
- shownOnCreate = true;
3285
- prepareInstance(instance, references[0]);
3286
- }
3287
- },
3288
- onTrigger: function onTrigger(instance, event) {
3289
- prepareInstance(instance, event.currentTarget);
3290
- }
3291
- };
3292
- }
3293
- };
3294
- var singleton = tippy(div(), Object.assign({}, removeProperties(optionalProps, ['overrides']), {
3295
- plugins: [plugin].concat(optionalProps.plugins || []),
3296
- triggerTarget: references,
3297
- popperOptions: Object.assign({}, optionalProps.popperOptions, {
3298
- modifiers: [].concat(((_optionalProps$popper = optionalProps.popperOptions) == null ? void 0 : _optionalProps$popper.modifiers) || [], [applyStylesModifier])
3299
- })
3300
- }));
3301
- var originalShow = singleton.show;
3302
-
3303
- singleton.show = function (target) {
3304
- originalShow(); // first time, showOnCreate or programmatic call with no params
3305
- // default to showing first instance
3306
-
3307
- if (!currentTarget && target == null) {
3308
- return prepareInstance(singleton, references[0]);
3309
- } // triggered from event (do nothing as prepareInstance already called by onTrigger)
3310
- // programmatic call with no params when already visible (do nothing again)
3311
-
3312
-
3313
- if (currentTarget && target == null) {
3314
- return;
3315
- } // target is index of instance
3316
-
3317
-
3318
- if (typeof target === 'number') {
3319
- return references[target] && prepareInstance(singleton, references[target]);
3320
- } // target is a child tippy instance
3321
-
3322
-
3323
- if (individualInstances.includes(target)) {
3324
- var ref = target.reference;
3325
- return prepareInstance(singleton, ref);
3326
- } // target is a ReferenceElement
3327
-
3328
-
3329
- if (references.includes(target)) {
3330
- return prepareInstance(singleton, target);
3331
- }
3332
- };
3333
-
3334
- singleton.showNext = function () {
3335
- var first = references[0];
3336
-
3337
- if (!currentTarget) {
3338
- return singleton.show(0);
3339
- }
3340
-
3341
- var index = references.indexOf(currentTarget);
3342
- singleton.show(references[index + 1] || first);
3343
- };
3344
-
3345
- singleton.showPrevious = function () {
3346
- var last = references[references.length - 1];
3347
-
3348
- if (!currentTarget) {
3349
- return singleton.show(last);
3350
- }
3351
-
3352
- var index = references.indexOf(currentTarget);
3353
- var target = references[index - 1] || last;
3354
- singleton.show(target);
3355
- };
3356
-
3357
- var originalSetProps = singleton.setProps;
3358
-
3359
- singleton.setProps = function (props) {
3360
- overrides = props.overrides || overrides;
3361
- originalSetProps(props);
3362
- };
3363
-
3364
- singleton.setInstances = function (nextInstances) {
3365
- enableInstances(true);
3366
- interceptSetPropsCleanups.forEach(function (fn) {
3367
- return fn();
3368
- });
3369
- individualInstances = nextInstances;
3370
- enableInstances(false);
3371
- setReferences();
3372
- interceptSetProps(singleton);
3373
- singleton.setProps({
3374
- triggerTarget: references
3375
- });
3376
- };
3377
-
3378
- interceptSetPropsCleanups = interceptSetProps(singleton);
3379
- return singleton;
3380
- };
3381
-
3382
- var animateFill = {
3383
- name: 'animateFill',
3384
- defaultValue: false,
3385
- fn: function fn(instance) {
3386
- var _instance$props$rende;
3387
-
3388
- // @ts-ignore
3389
- if (!((_instance$props$rende = instance.props.render) == null ? void 0 : _instance$props$rende.$$tippy)) {
3390
-
3391
- return {};
3392
- }
3393
-
3394
- var _getChildren = getChildren(instance.popper),
3395
- box = _getChildren.box,
3396
- content = _getChildren.content;
3397
-
3398
- var backdrop = instance.props.animateFill ? createBackdropElement() : null;
3399
- return {
3400
- onCreate: function onCreate() {
3401
- if (backdrop) {
3402
- box.insertBefore(backdrop, box.firstElementChild);
3403
- box.setAttribute('data-animatefill', '');
3404
- box.style.overflow = 'hidden';
3405
- instance.setProps({
3406
- arrow: false,
3407
- animation: 'shift-away'
3408
- });
3409
- }
3410
- },
3411
- onMount: function onMount() {
3412
- if (backdrop) {
3413
- var transitionDuration = box.style.transitionDuration;
3414
- var duration = Number(transitionDuration.replace('ms', '')); // The content should fade in after the backdrop has mostly filled the
3415
- // tooltip element. `clip-path` is the other alternative but is not
3416
- // well-supported and is buggy on some devices.
3417
-
3418
- content.style.transitionDelay = Math.round(duration / 10) + "ms";
3419
- backdrop.style.transitionDuration = transitionDuration;
3420
- setVisibilityState([backdrop], 'visible');
3421
- }
3422
- },
3423
- onShow: function onShow() {
3424
- if (backdrop) {
3425
- backdrop.style.transitionDuration = '0ms';
3426
- }
3427
- },
3428
- onHide: function onHide() {
3429
- if (backdrop) {
3430
- setVisibilityState([backdrop], 'hidden');
3431
- }
3432
- }
3433
- };
3434
- }
3435
- };
3436
-
3437
- function createBackdropElement() {
3438
- var backdrop = div();
3439
- backdrop.className = BACKDROP_CLASS;
3440
- setVisibilityState([backdrop], 'hidden');
3441
- return backdrop;
3442
- }
3443
-
3444
- var mouseCoords = {
3445
- clientX: 0,
3446
- clientY: 0
3447
- };
3448
- var activeInstances = [];
3449
-
3450
- function storeMouseCoords(_ref) {
3451
- var clientX = _ref.clientX,
3452
- clientY = _ref.clientY;
3453
- mouseCoords = {
3454
- clientX: clientX,
3455
- clientY: clientY
3456
- };
3457
- }
3458
-
3459
- function addMouseCoordsListener(doc) {
3460
- doc.addEventListener('mousemove', storeMouseCoords);
3461
- }
3462
-
3463
- function removeMouseCoordsListener(doc) {
3464
- doc.removeEventListener('mousemove', storeMouseCoords);
3465
- }
3466
-
3467
- var followCursor = {
3468
- name: 'followCursor',
3469
- defaultValue: false,
3470
- fn: function fn(instance) {
3471
- var reference = instance.reference;
3472
- var doc = getOwnerDocument(instance.props.triggerTarget || reference);
3473
- var isInternalUpdate = false;
3474
- var wasFocusEvent = false;
3475
- var isUnmounted = true;
3476
- var prevProps = instance.props;
3477
-
3478
- function getIsInitialBehavior() {
3479
- return instance.props.followCursor === 'initial' && instance.state.isVisible;
3480
- }
3481
-
3482
- function addListener() {
3483
- doc.addEventListener('mousemove', onMouseMove);
3484
- }
3485
-
3486
- function removeListener() {
3487
- doc.removeEventListener('mousemove', onMouseMove);
3488
- }
3489
-
3490
- function unsetGetReferenceClientRect() {
3491
- isInternalUpdate = true;
3492
- instance.setProps({
3493
- getReferenceClientRect: null
3494
- });
3495
- isInternalUpdate = false;
3496
- }
3497
-
3498
- function onMouseMove(event) {
3499
- // If the instance is interactive, avoid updating the position unless it's
3500
- // over the reference element
3501
- var isCursorOverReference = event.target ? reference.contains(event.target) : true;
3502
- var followCursor = instance.props.followCursor;
3503
- var clientX = event.clientX,
3504
- clientY = event.clientY;
3505
- var rect = reference.getBoundingClientRect();
3506
- var relativeX = clientX - rect.left;
3507
- var relativeY = clientY - rect.top;
3508
-
3509
- if (isCursorOverReference || !instance.props.interactive) {
3510
- instance.setProps({
3511
- getReferenceClientRect: function getReferenceClientRect() {
3512
- var rect = reference.getBoundingClientRect();
3513
- var x = clientX;
3514
- var y = clientY;
3515
-
3516
- if (followCursor === 'initial') {
3517
- x = rect.left + relativeX;
3518
- y = rect.top + relativeY;
3519
- }
3520
-
3521
- var top = followCursor === 'horizontal' ? rect.top : y;
3522
- var right = followCursor === 'vertical' ? rect.right : x;
3523
- var bottom = followCursor === 'horizontal' ? rect.bottom : y;
3524
- var left = followCursor === 'vertical' ? rect.left : x;
3525
- return {
3526
- width: right - left,
3527
- height: bottom - top,
3528
- top: top,
3529
- right: right,
3530
- bottom: bottom,
3531
- left: left
3532
- };
3533
- }
3534
- });
3535
- }
3536
- }
3537
-
3538
- function create() {
3539
- if (instance.props.followCursor) {
3540
- activeInstances.push({
3541
- instance: instance,
3542
- doc: doc
3543
- });
3544
- addMouseCoordsListener(doc);
3545
- }
3546
- }
3547
-
3548
- function destroy() {
3549
- activeInstances = activeInstances.filter(function (data) {
3550
- return data.instance !== instance;
3551
- });
3552
-
3553
- if (activeInstances.filter(function (data) {
3554
- return data.doc === doc;
3555
- }).length === 0) {
3556
- removeMouseCoordsListener(doc);
3557
- }
3558
- }
3559
-
3560
- return {
3561
- onCreate: create,
3562
- onDestroy: destroy,
3563
- onBeforeUpdate: function onBeforeUpdate() {
3564
- prevProps = instance.props;
3565
- },
3566
- onAfterUpdate: function onAfterUpdate(_, _ref2) {
3567
- var followCursor = _ref2.followCursor;
3568
-
3569
- if (isInternalUpdate) {
3570
- return;
3571
- }
3572
-
3573
- if (followCursor !== undefined && prevProps.followCursor !== followCursor) {
3574
- destroy();
3575
-
3576
- if (followCursor) {
3577
- create();
3578
-
3579
- if (instance.state.isMounted && !wasFocusEvent && !getIsInitialBehavior()) {
3580
- addListener();
3581
- }
3582
- } else {
3583
- removeListener();
3584
- unsetGetReferenceClientRect();
3585
- }
3586
- }
3587
- },
3588
- onMount: function onMount() {
3589
- if (instance.props.followCursor && !wasFocusEvent) {
3590
- if (isUnmounted) {
3591
- onMouseMove(mouseCoords);
3592
- isUnmounted = false;
3593
- }
3594
-
3595
- if (!getIsInitialBehavior()) {
3596
- addListener();
3597
- }
3598
- }
3599
- },
3600
- onTrigger: function onTrigger(_, event) {
3601
- if (isMouseEvent(event)) {
3602
- mouseCoords = {
3603
- clientX: event.clientX,
3604
- clientY: event.clientY
3605
- };
3606
- }
3607
-
3608
- wasFocusEvent = event.type === 'focus';
3609
- },
3610
- onHidden: function onHidden() {
3611
- if (instance.props.followCursor) {
3612
- unsetGetReferenceClientRect();
3613
- removeListener();
3614
- isUnmounted = true;
3615
- }
3616
- }
3617
- };
3618
- }
3619
- };
3620
-
3621
- function getProps(props, modifier) {
3622
- var _props$popperOptions;
3623
-
3624
- return {
3625
- popperOptions: Object.assign({}, props.popperOptions, {
3626
- modifiers: [].concat((((_props$popperOptions = props.popperOptions) == null ? void 0 : _props$popperOptions.modifiers) || []).filter(function (_ref) {
3627
- var name = _ref.name;
3628
- return name !== modifier.name;
3629
- }), [modifier])
3630
- })
3631
- };
3632
- }
3633
-
3634
- var inlinePositioning = {
3635
- name: 'inlinePositioning',
3636
- defaultValue: false,
3637
- fn: function fn(instance) {
3638
- var reference = instance.reference;
3639
-
3640
- function isEnabled() {
3641
- return !!instance.props.inlinePositioning;
3642
- }
3643
-
3644
- var placement;
3645
- var cursorRectIndex = -1;
3646
- var isInternalUpdate = false;
3647
- var modifier = {
3648
- name: 'tippyInlinePositioning',
3649
- enabled: true,
3650
- phase: 'afterWrite',
3651
- fn: function fn(_ref2) {
3652
- var state = _ref2.state;
3653
-
3654
- if (isEnabled()) {
3655
- if (placement !== state.placement) {
3656
- instance.setProps({
3657
- getReferenceClientRect: function getReferenceClientRect() {
3658
- return _getReferenceClientRect(state.placement);
3659
- }
3660
- });
3661
- }
3662
-
3663
- placement = state.placement;
3664
- }
3665
- }
3666
- };
3667
-
3668
- function _getReferenceClientRect(placement) {
3669
- return getInlineBoundingClientRect(getBasePlacement$1(placement), reference.getBoundingClientRect(), arrayFrom(reference.getClientRects()), cursorRectIndex);
3670
- }
3671
-
3672
- function setInternalProps(partialProps) {
3673
- isInternalUpdate = true;
3674
- instance.setProps(partialProps);
3675
- isInternalUpdate = false;
3676
- }
3677
-
3678
- function addModifier() {
3679
- if (!isInternalUpdate) {
3680
- setInternalProps(getProps(instance.props, modifier));
3681
- }
3682
- }
3683
-
3684
- return {
3685
- onCreate: addModifier,
3686
- onAfterUpdate: addModifier,
3687
- onTrigger: function onTrigger(_, event) {
3688
- if (isMouseEvent(event)) {
3689
- var rects = arrayFrom(instance.reference.getClientRects());
3690
- var cursorRect = rects.find(function (rect) {
3691
- return rect.left - 2 <= event.clientX && rect.right + 2 >= event.clientX && rect.top - 2 <= event.clientY && rect.bottom + 2 >= event.clientY;
3692
- });
3693
- cursorRectIndex = rects.indexOf(cursorRect);
3694
- }
3695
- },
3696
- onUntrigger: function onUntrigger() {
3697
- cursorRectIndex = -1;
3698
- }
3699
- };
3700
- }
3701
- };
3702
- function getInlineBoundingClientRect(currentBasePlacement, boundingRect, clientRects, cursorRectIndex) {
3703
- // Not an inline element, or placement is not yet known
3704
- if (clientRects.length < 2 || currentBasePlacement === null) {
3705
- return boundingRect;
3706
- } // There are two rects and they are disjoined
3707
-
3708
-
3709
- if (clientRects.length === 2 && cursorRectIndex >= 0 && clientRects[0].left > clientRects[1].right) {
3710
- return clientRects[cursorRectIndex] || boundingRect;
3711
- }
3712
-
3713
- switch (currentBasePlacement) {
3714
- case 'top':
3715
- case 'bottom':
3716
- {
3717
- var firstRect = clientRects[0];
3718
- var lastRect = clientRects[clientRects.length - 1];
3719
- var isTop = currentBasePlacement === 'top';
3720
- var top = firstRect.top;
3721
- var bottom = lastRect.bottom;
3722
- var left = isTop ? firstRect.left : lastRect.left;
3723
- var right = isTop ? firstRect.right : lastRect.right;
3724
- var width = right - left;
3725
- var height = bottom - top;
3726
- return {
3727
- top: top,
3728
- bottom: bottom,
3729
- left: left,
3730
- right: right,
3731
- width: width,
3732
- height: height
3733
- };
3734
- }
3735
-
3736
- case 'left':
3737
- case 'right':
3738
- {
3739
- var minLeft = Math.min.apply(Math, clientRects.map(function (rects) {
3740
- return rects.left;
3741
- }));
3742
- var maxRight = Math.max.apply(Math, clientRects.map(function (rects) {
3743
- return rects.right;
3744
- }));
3745
- var measureRects = clientRects.filter(function (rect) {
3746
- return currentBasePlacement === 'left' ? rect.left === minLeft : rect.right === maxRight;
3747
- });
3748
- var _top = measureRects[0].top;
3749
- var _bottom = measureRects[measureRects.length - 1].bottom;
3750
- var _left = minLeft;
3751
- var _right = maxRight;
3752
-
3753
- var _width = _right - _left;
3754
-
3755
- var _height = _bottom - _top;
3756
-
3757
- return {
3758
- top: _top,
3759
- bottom: _bottom,
3760
- left: _left,
3761
- right: _right,
3762
- width: _width,
3763
- height: _height
3764
- };
3765
- }
3766
-
3767
- default:
3768
- {
3769
- return boundingRect;
3770
- }
3771
- }
3772
- }
3773
-
3774
- var sticky = {
3775
- name: 'sticky',
3776
- defaultValue: false,
3777
- fn: function fn(instance) {
3778
- var reference = instance.reference,
3779
- popper = instance.popper;
3780
-
3781
- function getReference() {
3782
- return instance.popperInstance ? instance.popperInstance.state.elements.reference : reference;
3783
- }
3784
-
3785
- function shouldCheck(value) {
3786
- return instance.props.sticky === true || instance.props.sticky === value;
3787
- }
3788
-
3789
- var prevRefRect = null;
3790
- var prevPopRect = null;
3791
-
3792
- function updatePosition() {
3793
- var currentRefRect = shouldCheck('reference') ? getReference().getBoundingClientRect() : null;
3794
- var currentPopRect = shouldCheck('popper') ? popper.getBoundingClientRect() : null;
3795
-
3796
- if (currentRefRect && areRectsDifferent(prevRefRect, currentRefRect) || currentPopRect && areRectsDifferent(prevPopRect, currentPopRect)) {
3797
- if (instance.popperInstance) {
3798
- instance.popperInstance.update();
3799
- }
3800
- }
3801
-
3802
- prevRefRect = currentRefRect;
3803
- prevPopRect = currentPopRect;
3804
-
3805
- if (instance.state.isMounted) {
3806
- requestAnimationFrame(updatePosition);
3807
- }
3808
- }
3809
-
3810
- return {
3811
- onMount: function onMount() {
3812
- if (instance.props.sticky) {
3813
- updatePosition();
3814
- }
3815
- }
3816
- };
3817
- }
3818
- };
3819
-
3820
- function areRectsDifferent(rectA, rectB) {
3821
- if (rectA && rectB) {
3822
- return rectA.top !== rectB.top || rectA.right !== rectB.right || rectA.bottom !== rectB.bottom || rectA.left !== rectB.left;
3823
- }
3824
-
3825
- return true;
3826
- }
3827
-
3828
- tippy.setDefaultProps({
3829
- render: render
3830
- });
3831
-
3832
- tippy.setDefaultProps({
3833
- //@ts-ignore
3834
- onShow: instance => {
3835
- if (!instance.props.content)
3836
- return false;
3837
- },
3838
- });
3839
- function useTippy(el, opts = {}, settings = { mount: true }) {
3840
- const vm = getCurrentInstance();
3841
- const instance = ref();
3842
- let container = null;
3843
- const getContainer = () => {
3844
- if (container)
3845
- return container;
3846
- container = document.createElement('fragment');
3847
- return container;
3848
- };
3849
- const getContent = (content) => {
3850
- let newContent;
3851
- let unwrappedContent = isRef(content)
3852
- ? content.value
3853
- : content;
3854
- if (isVNode(unwrappedContent)) {
3855
- if (vm) {
3856
- unwrappedContent.appContext = vm.appContext;
3857
- }
3858
- render$1(unwrappedContent, getContainer());
3859
- newContent = () => getContainer();
3860
- }
3861
- else if (typeof unwrappedContent === 'object') {
3862
- let comp = h(unwrappedContent);
3863
- if (vm) {
3864
- comp.appContext = vm.appContext;
3865
- }
3866
- render$1(comp, getContainer());
3867
- newContent = () => getContainer();
3868
- }
3869
- else {
3870
- newContent = unwrappedContent;
3871
- }
3872
- return newContent;
3873
- };
3874
- const getProps = (opts) => {
3875
- let options = {};
3876
- if (isRef(opts)) {
3877
- options = opts.value;
3878
- }
3879
- else if (isReactive(opts)) {
3880
- options = { ...opts };
3881
- }
3882
- else {
3883
- options = { ...opts };
3884
- }
3885
- if (options.content) {
3886
- options.content = getContent(options.content);
3887
- }
3888
- if (options.triggerTarget) {
3889
- options.triggerTarget = isRef(options.triggerTarget)
3890
- ? options.triggerTarget.value
3891
- : options.triggerTarget;
3892
- }
3893
- return options;
3894
- };
3895
- const refresh = () => {
3896
- if (!instance.value)
3897
- return;
3898
- instance.value.setProps(getProps(opts));
3899
- };
3900
- const refreshContent = () => {
3901
- if (!instance.value || !opts.content)
3902
- return;
3903
- instance.value.setContent(getContent(opts.content));
3904
- };
3905
- const setContent = (value) => {
3906
- var _a;
3907
- (_a = instance.value) === null || _a === void 0 ? void 0 : _a.setContent(getContent(value));
3908
- };
3909
- const setProps = (value) => {
3910
- var _a;
3911
- (_a = instance.value) === null || _a === void 0 ? void 0 : _a.setProps(getProps(value));
3912
- };
3913
- const destroy = () => {
3914
- if (instance.value) {
3915
- instance.value.destroy();
3916
- instance.value = undefined;
3917
- }
3918
- container = null;
3919
- };
3920
- const show = () => {
3921
- var _a;
3922
- (_a = instance.value) === null || _a === void 0 ? void 0 : _a.show();
3923
- };
3924
- const hide = () => {
3925
- var _a;
3926
- (_a = instance.value) === null || _a === void 0 ? void 0 : _a.hide();
3927
- };
3928
- const disable = () => {
3929
- var _a;
3930
- (_a = instance.value) === null || _a === void 0 ? void 0 : _a.disable();
3931
- };
3932
- const enable = () => {
3933
- var _a;
3934
- (_a = instance.value) === null || _a === void 0 ? void 0 : _a.enable();
3935
- };
3936
- const unmount = () => {
3937
- var _a;
3938
- (_a = instance.value) === null || _a === void 0 ? void 0 : _a.unmount();
3939
- };
3940
- const mount = () => {
3941
- if (!el)
3942
- return;
3943
- let target = isRef(el) ? el.value : el;
3944
- if (typeof target === 'function')
3945
- target = target();
3946
- if (target) {
3947
- instance.value = tippy(target, getProps(opts));
3948
- //@ts-ignore
3949
- target.$tippy = response;
3950
- }
3951
- };
3952
- const response = {
3953
- tippy: instance,
3954
- refresh,
3955
- refreshContent,
3956
- setContent,
3957
- setProps,
3958
- destroy,
3959
- hide,
3960
- show,
3961
- disable,
3962
- enable,
3963
- unmount,
3964
- mount,
3965
- };
3966
- if (settings.mount) {
3967
- if (vm) {
3968
- if (vm.isMounted) {
3969
- mount();
3970
- }
3971
- else {
3972
- onMounted(mount);
3973
- }
3974
- onUnmounted(() => {
3975
- destroy();
3976
- });
3977
- }
3978
- else {
3979
- mount();
3980
- }
3981
- }
3982
- if (isRef(opts) || isReactive(opts)) {
3983
- watch(opts, refresh, { immediate: false });
3984
- }
3985
- else if (isRef(opts.content)) {
3986
- watch(opts.content, refreshContent, { immediate: false });
3987
- }
3988
- return response;
3989
- }
3990
-
3991
- function useTippyComponent(opts = {}, children) {
3992
- const instance = ref();
3993
- return {
3994
- instance,
3995
- TippyComponent: h(TippyComponent, {
3996
- ...opts,
3997
- onVnodeMounted: vnode => {
3998
- //@ts-ignore
3999
- instance.value = vnode.component.ctx;
4000
- },
4001
- }, children),
4002
- };
4003
- }
4004
-
4005
- function useSingleton(instances, optionalProps) {
4006
- const singleton = ref();
4007
- onMounted(() => {
4008
- const pendingTippyInstances = Array.isArray(instances)
4009
- ? instances.map(i => i.value)
4010
- : typeof instances === 'function' ? instances() : instances.value;
4011
- const tippyInstances = pendingTippyInstances
4012
- .map((instance) => {
4013
- if (instance instanceof Element) {
4014
- //@ts-ignore
4015
- return instance._tippy;
4016
- }
4017
- return instance;
4018
- })
4019
- .filter(Boolean);
4020
- singleton.value = createSingleton(tippyInstances, optionalProps);
4021
- });
4022
- return {
4023
- singleton,
4024
- };
4025
- }
4026
-
4027
- // const pluginProps = [
4028
- // 'animateFill',
4029
- // 'followCursor',
4030
- // 'inlinePositioning',
4031
- // 'sticky',
4032
- // ]
4033
- const booleanProps = [
4034
- 'a11y',
4035
- 'allowHTML',
4036
- 'arrow',
4037
- 'flip',
4038
- 'flipOnUpdate',
4039
- 'hideOnClick',
4040
- 'ignoreAttributes',
4041
- 'inertia',
4042
- 'interactive',
4043
- 'lazy',
4044
- 'multiple',
4045
- 'showOnInit',
4046
- 'touch',
4047
- 'touchHold',
4048
- ];
4049
- let props = {};
4050
- Object.keys(tippy.defaultProps).forEach((prop) => {
4051
- if (booleanProps.includes(prop)) {
4052
- props[prop] = {
4053
- type: Boolean,
4054
- default: function () {
4055
- return tippy.defaultProps[prop];
4056
- },
4057
- };
4058
- }
4059
- else {
4060
- props[prop] = {
4061
- default: function () {
4062
- return tippy.defaultProps[prop];
4063
- },
4064
- };
4065
- }
4066
- });
4067
- props['to'] = {};
4068
- props['tag'] = {
4069
- default: 'span'
4070
- };
4071
- props['contentTag'] = {
4072
- default: 'span'
4073
- };
4074
- props['contentClass'] = {
4075
- default: null
4076
- };
4077
- const TippyComponent = defineComponent({
4078
- props,
4079
- setup(props, { slots }) {
4080
- const elem = ref();
4081
- const contentElem = ref();
4082
- let options = props;
4083
- if (options.to) {
4084
- delete options.to;
4085
- }
4086
- let target = elem;
4087
- if (props.to) {
4088
- if (props.to instanceof Element) {
4089
- target = () => props.to;
4090
- }
4091
- else if (typeof props.to === 'string' || props.to instanceof String) {
4092
- target = () => document.querySelector(props.to);
4093
- }
4094
- }
4095
- const tippy = useTippy(target, options);
4096
- onMounted(() => {
4097
- if (slots.content)
4098
- tippy.setContent(() => contentElem.value);
4099
- });
4100
- return { elem, contentElem, ...tippy };
4101
- },
4102
- render() {
4103
- let slot = this.$slots.default ? this.$slots.default(this) : [];
4104
- return h(this.tag, { ref: 'elem', 'data-v-tippy': '' }, this.$slots.content ? [
4105
- slot,
4106
- h(this.contentTag, { ref: 'contentElem', class: this.contentClass }, this.$slots.content(this))
4107
- ] : slot);
4108
- },
4109
- });
4110
-
4111
- const booleanProps$1 = [
4112
- 'a11y',
4113
- 'allowHTML',
4114
- 'arrow',
4115
- 'flip',
4116
- 'flipOnUpdate',
4117
- 'hideOnClick',
4118
- 'ignoreAttributes',
4119
- 'inertia',
4120
- 'interactive',
4121
- 'lazy',
4122
- 'multiple',
4123
- 'showOnInit',
4124
- 'touch',
4125
- 'touchHold',
4126
- ];
4127
- let props$1 = {};
4128
- Object.keys(tippy.defaultProps).forEach((prop) => {
4129
- if (booleanProps$1.includes(prop)) {
4130
- props$1[prop] = {
4131
- type: Boolean,
4132
- default: function () {
4133
- return tippy.defaultProps[prop];
4134
- },
4135
- };
4136
- }
4137
- else {
4138
- props$1[prop] = {
4139
- default: function () {
4140
- return tippy.defaultProps[prop];
4141
- },
4142
- };
4143
- }
4144
- });
4145
- const TippySingleton = defineComponent({
4146
- props: props$1,
4147
- setup(props) {
4148
- const instances = ref([]);
4149
- const { singleton } = useSingleton(instances, props);
4150
- return { instances, singleton };
4151
- },
4152
- mounted() {
4153
- var _a;
4154
- const parent = this.$el.parentElement;
4155
- const elements = parent.querySelectorAll('[data-v-tippy]');
4156
- this.instances = Array.from(elements)
4157
- .map((el) => el._tippy)
4158
- .filter(Boolean);
4159
- (_a = this.singleton) === null || _a === void 0 ? void 0 : _a.setInstances(this.instances);
4160
- },
4161
- render() {
4162
- let slot = this.$slots.default ? this.$slots.default() : [];
4163
- return h(() => slot);
4164
- },
4165
- });
4166
-
4167
- const directive = {
4168
- mounted(el, binding, vnode) {
4169
- const opts = binding.value || {};
4170
- if (vnode.props && vnode.props.onTippyShow) {
4171
- opts.onShow = function (...args) {
4172
- var _a;
4173
- return (_a = vnode.props) === null || _a === void 0 ? void 0 : _a.onTippyShow(...args);
4174
- };
4175
- }
4176
- if (vnode.props && vnode.props.onTippyShown) {
4177
- opts.onShown = function (...args) {
4178
- var _a;
4179
- return (_a = vnode.props) === null || _a === void 0 ? void 0 : _a.onTippyShown(...args);
4180
- };
4181
- }
4182
- if (vnode.props && vnode.props.onTippyHidden) {
4183
- opts.onHidden = function (...args) {
4184
- var _a;
4185
- return (_a = vnode.props) === null || _a === void 0 ? void 0 : _a.onTippyHidden(...args);
4186
- };
4187
- }
4188
- if (vnode.props && vnode.props.onTippyHide) {
4189
- opts.onHide = function (...args) {
4190
- var _a;
4191
- return (_a = vnode.props) === null || _a === void 0 ? void 0 : _a.onTippyHide(...args);
4192
- };
4193
- }
4194
- if (vnode.props && vnode.props.onTippyMount) {
4195
- opts.onMount = function (...args) {
4196
- var _a;
4197
- return (_a = vnode.props) === null || _a === void 0 ? void 0 : _a.onTippyMount(...args);
4198
- };
4199
- }
4200
- if (el.getAttribute('title') && !opts.content) {
4201
- opts.content = el.getAttribute('title');
4202
- el.removeAttribute('title');
4203
- }
4204
- if (el.getAttribute('content') && !opts.content) {
4205
- opts.content = el.getAttribute('content');
4206
- }
4207
- useTippy(el, opts);
4208
- },
4209
- unmounted(el) {
4210
- if (el.$tippy) {
4211
- el.$tippy.destroy();
4212
- }
4213
- else if (el._tippy) {
4214
- el._tippy.destroy();
4215
- }
4216
- },
4217
- updated(el, binding) {
4218
- const opts = binding.value || {};
4219
- if (el.getAttribute('title') && !opts.content) {
4220
- opts.content = el.getAttribute('title');
4221
- el.removeAttribute('title');
4222
- }
4223
- if (el.getAttribute('content') && !opts.content) {
4224
- opts.content = el.getAttribute('content');
4225
- }
4226
- if (el.$tippy) {
4227
- el.$tippy.setProps(opts || {});
4228
- }
4229
- else if (el._tippy) {
4230
- el._tippy.setProps(opts || {});
4231
- }
4232
- },
4233
- };
4234
-
4235
- const plugin = {
4236
- install(app, options = {}) {
4237
- tippy.setDefaultProps(options.defaultProps || {});
4238
- app.directive(options.directive || 'tippy', directive);
4239
- app.component(options.component || 'tippy', TippyComponent);
4240
- app.component(options.componentSingleton || 'tippy-singleton', TippySingleton);
4241
- },
4242
- };
4243
-
4244
- const setDefaultProps$1 = tippy.setDefaultProps;
4245
- setDefaultProps$1({
4246
- ignoreAttributes: true,
4247
- plugins: [sticky, inlinePositioning, followCursor, animateFill],
4248
- });
4249
-
4250
- export default plugin;
4251
- export { TippyComponent as Tippy, TippySingleton, directive, plugin, ROUND_ARROW as roundArrow, setDefaultProps$1 as setDefaultProps, tippy, useSingleton, useTippy, useTippyComponent };