react-tooltip 5.8.2-beta.3 → 5.8.2
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.
- package/dist/react-tooltip.cjs.js +1886 -2159
- package/dist/react-tooltip.cjs.min.js +3 -3
- package/dist/react-tooltip.d.ts +7 -3
- package/dist/react-tooltip.esm.js +1887 -2154
- package/dist/react-tooltip.esm.min.js +3 -3
- package/dist/react-tooltip.umd.js +1886 -2159
- package/dist/react-tooltip.umd.min.js +3 -3
- package/package.json +1 -1
|
@@ -1,1514 +1,5 @@
|
|
|
1
1
|
import require$$0, { createContext, useState, useCallback, useMemo, useContext, useRef, useEffect, useLayoutEffect } from 'react';
|
|
2
2
|
|
|
3
|
-
function getAlignment(placement) {
|
|
4
|
-
return placement.split('-')[1];
|
|
5
|
-
}
|
|
6
|
-
|
|
7
|
-
function getLengthFromAxis(axis) {
|
|
8
|
-
return axis === 'y' ? 'height' : 'width';
|
|
9
|
-
}
|
|
10
|
-
|
|
11
|
-
function getSide(placement) {
|
|
12
|
-
return placement.split('-')[0];
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
function getMainAxisFromPlacement(placement) {
|
|
16
|
-
return ['top', 'bottom'].includes(getSide(placement)) ? 'x' : 'y';
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
function computeCoordsFromPlacement(_ref, placement, rtl) {
|
|
20
|
-
let {
|
|
21
|
-
reference,
|
|
22
|
-
floating
|
|
23
|
-
} = _ref;
|
|
24
|
-
const commonX = reference.x + reference.width / 2 - floating.width / 2;
|
|
25
|
-
const commonY = reference.y + reference.height / 2 - floating.height / 2;
|
|
26
|
-
const mainAxis = getMainAxisFromPlacement(placement);
|
|
27
|
-
const length = getLengthFromAxis(mainAxis);
|
|
28
|
-
const commonAlign = reference[length] / 2 - floating[length] / 2;
|
|
29
|
-
const side = getSide(placement);
|
|
30
|
-
const isVertical = mainAxis === 'x';
|
|
31
|
-
let coords;
|
|
32
|
-
switch (side) {
|
|
33
|
-
case 'top':
|
|
34
|
-
coords = {
|
|
35
|
-
x: commonX,
|
|
36
|
-
y: reference.y - floating.height
|
|
37
|
-
};
|
|
38
|
-
break;
|
|
39
|
-
case 'bottom':
|
|
40
|
-
coords = {
|
|
41
|
-
x: commonX,
|
|
42
|
-
y: reference.y + reference.height
|
|
43
|
-
};
|
|
44
|
-
break;
|
|
45
|
-
case 'right':
|
|
46
|
-
coords = {
|
|
47
|
-
x: reference.x + reference.width,
|
|
48
|
-
y: commonY
|
|
49
|
-
};
|
|
50
|
-
break;
|
|
51
|
-
case 'left':
|
|
52
|
-
coords = {
|
|
53
|
-
x: reference.x - floating.width,
|
|
54
|
-
y: commonY
|
|
55
|
-
};
|
|
56
|
-
break;
|
|
57
|
-
default:
|
|
58
|
-
coords = {
|
|
59
|
-
x: reference.x,
|
|
60
|
-
y: reference.y
|
|
61
|
-
};
|
|
62
|
-
}
|
|
63
|
-
switch (getAlignment(placement)) {
|
|
64
|
-
case 'start':
|
|
65
|
-
coords[mainAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
|
|
66
|
-
break;
|
|
67
|
-
case 'end':
|
|
68
|
-
coords[mainAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
|
|
69
|
-
break;
|
|
70
|
-
}
|
|
71
|
-
return coords;
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
/**
|
|
75
|
-
* Computes the `x` and `y` coordinates that will place the floating element
|
|
76
|
-
* next to a reference element when it is given a certain positioning strategy.
|
|
77
|
-
*
|
|
78
|
-
* This export does not have any `platform` interface logic. You will need to
|
|
79
|
-
* write one for the platform you are using Floating UI with.
|
|
80
|
-
*/
|
|
81
|
-
const computePosition$1 = async (reference, floating, config) => {
|
|
82
|
-
const {
|
|
83
|
-
placement = 'bottom',
|
|
84
|
-
strategy = 'absolute',
|
|
85
|
-
middleware = [],
|
|
86
|
-
platform
|
|
87
|
-
} = config;
|
|
88
|
-
const validMiddleware = middleware.filter(Boolean);
|
|
89
|
-
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
|
|
90
|
-
{
|
|
91
|
-
if (platform == null) {
|
|
92
|
-
console.error(['Floating UI: `platform` property was not passed to config. If you', 'want to use Floating UI on the web, install @floating-ui/dom', 'instead of the /core package. Otherwise, you can create your own', '`platform`: https://floating-ui.com/docs/platform'].join(' '));
|
|
93
|
-
}
|
|
94
|
-
if (validMiddleware.filter(_ref => {
|
|
95
|
-
let {
|
|
96
|
-
name
|
|
97
|
-
} = _ref;
|
|
98
|
-
return name === 'autoPlacement' || name === 'flip';
|
|
99
|
-
}).length > 1) {
|
|
100
|
-
throw new Error(['Floating UI: duplicate `flip` and/or `autoPlacement` middleware', 'detected. This will lead to an infinite loop. Ensure only one of', 'either has been passed to the `middleware` array.'].join(' '));
|
|
101
|
-
}
|
|
102
|
-
if (!reference || !floating) {
|
|
103
|
-
console.error(['Floating UI: The reference and/or floating element was not defined', 'when `computePosition()` was called. Ensure that both elements have', 'been created and can be measured.'].join(' '));
|
|
104
|
-
}
|
|
105
|
-
}
|
|
106
|
-
let rects = await platform.getElementRects({
|
|
107
|
-
reference,
|
|
108
|
-
floating,
|
|
109
|
-
strategy
|
|
110
|
-
});
|
|
111
|
-
let {
|
|
112
|
-
x,
|
|
113
|
-
y
|
|
114
|
-
} = computeCoordsFromPlacement(rects, placement, rtl);
|
|
115
|
-
let statefulPlacement = placement;
|
|
116
|
-
let middlewareData = {};
|
|
117
|
-
let resetCount = 0;
|
|
118
|
-
for (let i = 0; i < validMiddleware.length; i++) {
|
|
119
|
-
const {
|
|
120
|
-
name,
|
|
121
|
-
fn
|
|
122
|
-
} = validMiddleware[i];
|
|
123
|
-
const {
|
|
124
|
-
x: nextX,
|
|
125
|
-
y: nextY,
|
|
126
|
-
data,
|
|
127
|
-
reset
|
|
128
|
-
} = await fn({
|
|
129
|
-
x,
|
|
130
|
-
y,
|
|
131
|
-
initialPlacement: placement,
|
|
132
|
-
placement: statefulPlacement,
|
|
133
|
-
strategy,
|
|
134
|
-
middlewareData,
|
|
135
|
-
rects,
|
|
136
|
-
platform,
|
|
137
|
-
elements: {
|
|
138
|
-
reference,
|
|
139
|
-
floating
|
|
140
|
-
}
|
|
141
|
-
});
|
|
142
|
-
x = nextX != null ? nextX : x;
|
|
143
|
-
y = nextY != null ? nextY : y;
|
|
144
|
-
middlewareData = {
|
|
145
|
-
...middlewareData,
|
|
146
|
-
[name]: {
|
|
147
|
-
...middlewareData[name],
|
|
148
|
-
...data
|
|
149
|
-
}
|
|
150
|
-
};
|
|
151
|
-
{
|
|
152
|
-
if (resetCount > 50) {
|
|
153
|
-
console.warn(['Floating UI: The middleware lifecycle appears to be running in an', 'infinite loop. This is usually caused by a `reset` continually', 'being returned without a break condition.'].join(' '));
|
|
154
|
-
}
|
|
155
|
-
}
|
|
156
|
-
if (reset && resetCount <= 50) {
|
|
157
|
-
resetCount++;
|
|
158
|
-
if (typeof reset === 'object') {
|
|
159
|
-
if (reset.placement) {
|
|
160
|
-
statefulPlacement = reset.placement;
|
|
161
|
-
}
|
|
162
|
-
if (reset.rects) {
|
|
163
|
-
rects = reset.rects === true ? await platform.getElementRects({
|
|
164
|
-
reference,
|
|
165
|
-
floating,
|
|
166
|
-
strategy
|
|
167
|
-
}) : reset.rects;
|
|
168
|
-
}
|
|
169
|
-
({
|
|
170
|
-
x,
|
|
171
|
-
y
|
|
172
|
-
} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
|
|
173
|
-
}
|
|
174
|
-
i = -1;
|
|
175
|
-
continue;
|
|
176
|
-
}
|
|
177
|
-
}
|
|
178
|
-
return {
|
|
179
|
-
x,
|
|
180
|
-
y,
|
|
181
|
-
placement: statefulPlacement,
|
|
182
|
-
strategy,
|
|
183
|
-
middlewareData
|
|
184
|
-
};
|
|
185
|
-
};
|
|
186
|
-
|
|
187
|
-
function expandPaddingObject(padding) {
|
|
188
|
-
return {
|
|
189
|
-
top: 0,
|
|
190
|
-
right: 0,
|
|
191
|
-
bottom: 0,
|
|
192
|
-
left: 0,
|
|
193
|
-
...padding
|
|
194
|
-
};
|
|
195
|
-
}
|
|
196
|
-
|
|
197
|
-
function getSideObjectFromPadding(padding) {
|
|
198
|
-
return typeof padding !== 'number' ? expandPaddingObject(padding) : {
|
|
199
|
-
top: padding,
|
|
200
|
-
right: padding,
|
|
201
|
-
bottom: padding,
|
|
202
|
-
left: padding
|
|
203
|
-
};
|
|
204
|
-
}
|
|
205
|
-
|
|
206
|
-
function rectToClientRect(rect) {
|
|
207
|
-
return {
|
|
208
|
-
...rect,
|
|
209
|
-
top: rect.y,
|
|
210
|
-
left: rect.x,
|
|
211
|
-
right: rect.x + rect.width,
|
|
212
|
-
bottom: rect.y + rect.height
|
|
213
|
-
};
|
|
214
|
-
}
|
|
215
|
-
|
|
216
|
-
/**
|
|
217
|
-
* Resolves with an object of overflow side offsets that determine how much the
|
|
218
|
-
* element is overflowing a given clipping boundary.
|
|
219
|
-
* - positive = overflowing the boundary by that number of pixels
|
|
220
|
-
* - negative = how many pixels left before it will overflow
|
|
221
|
-
* - 0 = lies flush with the boundary
|
|
222
|
-
* @see https://floating-ui.com/docs/detectOverflow
|
|
223
|
-
*/
|
|
224
|
-
async function detectOverflow(middlewareArguments, options) {
|
|
225
|
-
var _await$platform$isEle;
|
|
226
|
-
if (options === void 0) {
|
|
227
|
-
options = {};
|
|
228
|
-
}
|
|
229
|
-
const {
|
|
230
|
-
x,
|
|
231
|
-
y,
|
|
232
|
-
platform,
|
|
233
|
-
rects,
|
|
234
|
-
elements,
|
|
235
|
-
strategy
|
|
236
|
-
} = middlewareArguments;
|
|
237
|
-
const {
|
|
238
|
-
boundary = 'clippingAncestors',
|
|
239
|
-
rootBoundary = 'viewport',
|
|
240
|
-
elementContext = 'floating',
|
|
241
|
-
altBoundary = false,
|
|
242
|
-
padding = 0
|
|
243
|
-
} = options;
|
|
244
|
-
const paddingObject = getSideObjectFromPadding(padding);
|
|
245
|
-
const altContext = elementContext === 'floating' ? 'reference' : 'floating';
|
|
246
|
-
const element = elements[altBoundary ? altContext : elementContext];
|
|
247
|
-
const clippingClientRect = rectToClientRect(await platform.getClippingRect({
|
|
248
|
-
element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || (await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating))),
|
|
249
|
-
boundary,
|
|
250
|
-
rootBoundary,
|
|
251
|
-
strategy
|
|
252
|
-
}));
|
|
253
|
-
const rect = elementContext === 'floating' ? {
|
|
254
|
-
...rects.floating,
|
|
255
|
-
x,
|
|
256
|
-
y
|
|
257
|
-
} : rects.reference;
|
|
258
|
-
const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
|
|
259
|
-
const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
|
|
260
|
-
x: 1,
|
|
261
|
-
y: 1
|
|
262
|
-
} : {
|
|
263
|
-
x: 1,
|
|
264
|
-
y: 1
|
|
265
|
-
};
|
|
266
|
-
const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
267
|
-
rect,
|
|
268
|
-
offsetParent,
|
|
269
|
-
strategy
|
|
270
|
-
}) : rect);
|
|
271
|
-
return {
|
|
272
|
-
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
273
|
-
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
274
|
-
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
275
|
-
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
276
|
-
};
|
|
277
|
-
}
|
|
278
|
-
|
|
279
|
-
const min$1 = Math.min;
|
|
280
|
-
const max$1 = Math.max;
|
|
281
|
-
|
|
282
|
-
function within(min$1$1, value, max$1$1) {
|
|
283
|
-
return max$1(min$1$1, min$1(value, max$1$1));
|
|
284
|
-
}
|
|
285
|
-
|
|
286
|
-
/**
|
|
287
|
-
* Positions an inner element of the floating element such that it is centered
|
|
288
|
-
* to the reference element.
|
|
289
|
-
* @see https://floating-ui.com/docs/arrow
|
|
290
|
-
*/
|
|
291
|
-
const arrow = options => ({
|
|
292
|
-
name: 'arrow',
|
|
293
|
-
options,
|
|
294
|
-
async fn(middlewareArguments) {
|
|
295
|
-
// Since `element` is required, we don't Partial<> the type.
|
|
296
|
-
const {
|
|
297
|
-
element,
|
|
298
|
-
padding = 0
|
|
299
|
-
} = options || {};
|
|
300
|
-
const {
|
|
301
|
-
x,
|
|
302
|
-
y,
|
|
303
|
-
placement,
|
|
304
|
-
rects,
|
|
305
|
-
platform
|
|
306
|
-
} = middlewareArguments;
|
|
307
|
-
if (element == null) {
|
|
308
|
-
{
|
|
309
|
-
console.warn('Floating UI: No `element` was passed to the `arrow` middleware.');
|
|
310
|
-
}
|
|
311
|
-
return {};
|
|
312
|
-
}
|
|
313
|
-
const paddingObject = getSideObjectFromPadding(padding);
|
|
314
|
-
const coords = {
|
|
315
|
-
x,
|
|
316
|
-
y
|
|
317
|
-
};
|
|
318
|
-
const axis = getMainAxisFromPlacement(placement);
|
|
319
|
-
const length = getLengthFromAxis(axis);
|
|
320
|
-
const arrowDimensions = await platform.getDimensions(element);
|
|
321
|
-
const minProp = axis === 'y' ? 'top' : 'left';
|
|
322
|
-
const maxProp = axis === 'y' ? 'bottom' : 'right';
|
|
323
|
-
const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
|
|
324
|
-
const startDiff = coords[axis] - rects.reference[axis];
|
|
325
|
-
const arrowOffsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(element));
|
|
326
|
-
let clientSize = arrowOffsetParent ? axis === 'y' ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;
|
|
327
|
-
if (clientSize === 0) {
|
|
328
|
-
clientSize = rects.floating[length];
|
|
329
|
-
}
|
|
330
|
-
const centerToReference = endDiff / 2 - startDiff / 2;
|
|
331
|
-
|
|
332
|
-
// Make sure the arrow doesn't overflow the floating element if the center
|
|
333
|
-
// point is outside the floating element's bounds.
|
|
334
|
-
const min = paddingObject[minProp];
|
|
335
|
-
const max = clientSize - arrowDimensions[length] - paddingObject[maxProp];
|
|
336
|
-
const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
|
|
337
|
-
const offset = within(min, center, max);
|
|
338
|
-
|
|
339
|
-
// If the reference is small enough that the arrow's padding causes it to
|
|
340
|
-
// to point to nothing for an aligned placement, adjust the offset of the
|
|
341
|
-
// floating element itself. This stops `shift()` from taking action, but can
|
|
342
|
-
// be worked around by calling it again after the `arrow()` if desired.
|
|
343
|
-
const shouldAddOffset = getAlignment(placement) != null && center != offset && rects.reference[length] / 2 - (center < min ? paddingObject[minProp] : paddingObject[maxProp]) - arrowDimensions[length] / 2 < 0;
|
|
344
|
-
const alignmentOffset = shouldAddOffset ? center < min ? min - center : max - center : 0;
|
|
345
|
-
return {
|
|
346
|
-
[axis]: coords[axis] - alignmentOffset,
|
|
347
|
-
data: {
|
|
348
|
-
[axis]: offset,
|
|
349
|
-
centerOffset: center - offset
|
|
350
|
-
}
|
|
351
|
-
};
|
|
352
|
-
}
|
|
353
|
-
});
|
|
354
|
-
|
|
355
|
-
const sides = ['top', 'right', 'bottom', 'left'];
|
|
356
|
-
const allPlacements = /*#__PURE__*/sides.reduce((acc, side) => acc.concat(side, side + "-start", side + "-end"), []);
|
|
357
|
-
|
|
358
|
-
const oppositeSideMap = {
|
|
359
|
-
left: 'right',
|
|
360
|
-
right: 'left',
|
|
361
|
-
bottom: 'top',
|
|
362
|
-
top: 'bottom'
|
|
363
|
-
};
|
|
364
|
-
function getOppositePlacement(placement) {
|
|
365
|
-
return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
|
|
366
|
-
}
|
|
367
|
-
|
|
368
|
-
function getAlignmentSides(placement, rects, rtl) {
|
|
369
|
-
if (rtl === void 0) {
|
|
370
|
-
rtl = false;
|
|
371
|
-
}
|
|
372
|
-
const alignment = getAlignment(placement);
|
|
373
|
-
const mainAxis = getMainAxisFromPlacement(placement);
|
|
374
|
-
const length = getLengthFromAxis(mainAxis);
|
|
375
|
-
let mainAlignmentSide = mainAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
|
|
376
|
-
if (rects.reference[length] > rects.floating[length]) {
|
|
377
|
-
mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
|
|
378
|
-
}
|
|
379
|
-
return {
|
|
380
|
-
main: mainAlignmentSide,
|
|
381
|
-
cross: getOppositePlacement(mainAlignmentSide)
|
|
382
|
-
};
|
|
383
|
-
}
|
|
384
|
-
|
|
385
|
-
const oppositeAlignmentMap = {
|
|
386
|
-
start: 'end',
|
|
387
|
-
end: 'start'
|
|
388
|
-
};
|
|
389
|
-
function getOppositeAlignmentPlacement(placement) {
|
|
390
|
-
return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
|
|
391
|
-
}
|
|
392
|
-
|
|
393
|
-
function getPlacementList(alignment, autoAlignment, allowedPlacements) {
|
|
394
|
-
const allowedPlacementsSortedByAlignment = alignment ? [...allowedPlacements.filter(placement => getAlignment(placement) === alignment), ...allowedPlacements.filter(placement => getAlignment(placement) !== alignment)] : allowedPlacements.filter(placement => getSide(placement) === placement);
|
|
395
|
-
return allowedPlacementsSortedByAlignment.filter(placement => {
|
|
396
|
-
if (alignment) {
|
|
397
|
-
return getAlignment(placement) === alignment || (autoAlignment ? getOppositeAlignmentPlacement(placement) !== placement : false);
|
|
398
|
-
}
|
|
399
|
-
return true;
|
|
400
|
-
});
|
|
401
|
-
}
|
|
402
|
-
/**
|
|
403
|
-
* Automatically chooses the `placement` which has the most space available.
|
|
404
|
-
* @see https://floating-ui.com/docs/autoPlacement
|
|
405
|
-
*/
|
|
406
|
-
const autoPlacement = function (options) {
|
|
407
|
-
if (options === void 0) {
|
|
408
|
-
options = {};
|
|
409
|
-
}
|
|
410
|
-
return {
|
|
411
|
-
name: 'autoPlacement',
|
|
412
|
-
options,
|
|
413
|
-
async fn(middlewareArguments) {
|
|
414
|
-
var _middlewareData$autoP, _middlewareData$autoP2, _placementsSortedByLe;
|
|
415
|
-
const {
|
|
416
|
-
rects,
|
|
417
|
-
middlewareData,
|
|
418
|
-
placement,
|
|
419
|
-
platform,
|
|
420
|
-
elements
|
|
421
|
-
} = middlewareArguments;
|
|
422
|
-
const {
|
|
423
|
-
alignment,
|
|
424
|
-
allowedPlacements = allPlacements,
|
|
425
|
-
autoAlignment = true,
|
|
426
|
-
...detectOverflowOptions
|
|
427
|
-
} = options;
|
|
428
|
-
const placements = alignment !== undefined || allowedPlacements === allPlacements ? getPlacementList(alignment || null, autoAlignment, allowedPlacements) : allowedPlacements;
|
|
429
|
-
const overflow = await detectOverflow(middlewareArguments, detectOverflowOptions);
|
|
430
|
-
const currentIndex = ((_middlewareData$autoP = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP.index) || 0;
|
|
431
|
-
const currentPlacement = placements[currentIndex];
|
|
432
|
-
if (currentPlacement == null) {
|
|
433
|
-
return {};
|
|
434
|
-
}
|
|
435
|
-
const {
|
|
436
|
-
main,
|
|
437
|
-
cross
|
|
438
|
-
} = getAlignmentSides(currentPlacement, rects, await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating)));
|
|
439
|
-
|
|
440
|
-
// Make `computeCoords` start from the right place.
|
|
441
|
-
if (placement !== currentPlacement) {
|
|
442
|
-
return {
|
|
443
|
-
reset: {
|
|
444
|
-
placement: placements[0]
|
|
445
|
-
}
|
|
446
|
-
};
|
|
447
|
-
}
|
|
448
|
-
const currentOverflows = [overflow[getSide(currentPlacement)], overflow[main], overflow[cross]];
|
|
449
|
-
const allOverflows = [...(((_middlewareData$autoP2 = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP2.overflows) || []), {
|
|
450
|
-
placement: currentPlacement,
|
|
451
|
-
overflows: currentOverflows
|
|
452
|
-
}];
|
|
453
|
-
const nextPlacement = placements[currentIndex + 1];
|
|
454
|
-
|
|
455
|
-
// There are more placements to check.
|
|
456
|
-
if (nextPlacement) {
|
|
457
|
-
return {
|
|
458
|
-
data: {
|
|
459
|
-
index: currentIndex + 1,
|
|
460
|
-
overflows: allOverflows
|
|
461
|
-
},
|
|
462
|
-
reset: {
|
|
463
|
-
placement: nextPlacement
|
|
464
|
-
}
|
|
465
|
-
};
|
|
466
|
-
}
|
|
467
|
-
const placementsSortedByLeastOverflow = allOverflows.slice().sort((a, b) => a.overflows[0] - b.overflows[0]);
|
|
468
|
-
const placementThatFitsOnAllSides = (_placementsSortedByLe = placementsSortedByLeastOverflow.find(_ref => {
|
|
469
|
-
let {
|
|
470
|
-
overflows
|
|
471
|
-
} = _ref;
|
|
472
|
-
return overflows.every(overflow => overflow <= 0);
|
|
473
|
-
})) == null ? void 0 : _placementsSortedByLe.placement;
|
|
474
|
-
const resetPlacement = placementThatFitsOnAllSides || placementsSortedByLeastOverflow[0].placement;
|
|
475
|
-
if (resetPlacement !== placement) {
|
|
476
|
-
return {
|
|
477
|
-
data: {
|
|
478
|
-
index: currentIndex + 1,
|
|
479
|
-
overflows: allOverflows
|
|
480
|
-
},
|
|
481
|
-
reset: {
|
|
482
|
-
placement: resetPlacement
|
|
483
|
-
}
|
|
484
|
-
};
|
|
485
|
-
}
|
|
486
|
-
return {};
|
|
487
|
-
}
|
|
488
|
-
};
|
|
489
|
-
};
|
|
490
|
-
|
|
491
|
-
function getExpandedPlacements(placement) {
|
|
492
|
-
const oppositePlacement = getOppositePlacement(placement);
|
|
493
|
-
return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
|
|
494
|
-
}
|
|
495
|
-
|
|
496
|
-
function getSideList(side, isStart, rtl) {
|
|
497
|
-
const lr = ['left', 'right'];
|
|
498
|
-
const rl = ['right', 'left'];
|
|
499
|
-
const tb = ['top', 'bottom'];
|
|
500
|
-
const bt = ['bottom', 'top'];
|
|
501
|
-
switch (side) {
|
|
502
|
-
case 'top':
|
|
503
|
-
case 'bottom':
|
|
504
|
-
if (rtl) return isStart ? rl : lr;
|
|
505
|
-
return isStart ? lr : rl;
|
|
506
|
-
case 'left':
|
|
507
|
-
case 'right':
|
|
508
|
-
return isStart ? tb : bt;
|
|
509
|
-
default:
|
|
510
|
-
return [];
|
|
511
|
-
}
|
|
512
|
-
}
|
|
513
|
-
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
|
|
514
|
-
const alignment = getAlignment(placement);
|
|
515
|
-
let list = getSideList(getSide(placement), direction === 'start', rtl);
|
|
516
|
-
if (alignment) {
|
|
517
|
-
list = list.map(side => side + "-" + alignment);
|
|
518
|
-
if (flipAlignment) {
|
|
519
|
-
list = list.concat(list.map(getOppositeAlignmentPlacement));
|
|
520
|
-
}
|
|
521
|
-
}
|
|
522
|
-
return list;
|
|
523
|
-
}
|
|
524
|
-
|
|
525
|
-
/**
|
|
526
|
-
* Changes the placement of the floating element to one that will fit if the
|
|
527
|
-
* initially specified `placement` does not.
|
|
528
|
-
* @see https://floating-ui.com/docs/flip
|
|
529
|
-
*/
|
|
530
|
-
const flip = function (options) {
|
|
531
|
-
if (options === void 0) {
|
|
532
|
-
options = {};
|
|
533
|
-
}
|
|
534
|
-
return {
|
|
535
|
-
name: 'flip',
|
|
536
|
-
options,
|
|
537
|
-
async fn(middlewareArguments) {
|
|
538
|
-
var _middlewareData$flip;
|
|
539
|
-
const {
|
|
540
|
-
placement,
|
|
541
|
-
middlewareData,
|
|
542
|
-
rects,
|
|
543
|
-
initialPlacement,
|
|
544
|
-
platform,
|
|
545
|
-
elements
|
|
546
|
-
} = middlewareArguments;
|
|
547
|
-
const {
|
|
548
|
-
mainAxis: checkMainAxis = true,
|
|
549
|
-
crossAxis: checkCrossAxis = true,
|
|
550
|
-
fallbackPlacements: specifiedFallbackPlacements,
|
|
551
|
-
fallbackStrategy = 'bestFit',
|
|
552
|
-
fallbackAxisSideDirection = 'none',
|
|
553
|
-
flipAlignment = true,
|
|
554
|
-
...detectOverflowOptions
|
|
555
|
-
} = options;
|
|
556
|
-
const side = getSide(placement);
|
|
557
|
-
const isBasePlacement = getSide(initialPlacement) === initialPlacement;
|
|
558
|
-
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
|
|
559
|
-
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
|
|
560
|
-
if (!specifiedFallbackPlacements && fallbackAxisSideDirection !== 'none') {
|
|
561
|
-
fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
|
|
562
|
-
}
|
|
563
|
-
const placements = [initialPlacement, ...fallbackPlacements];
|
|
564
|
-
const overflow = await detectOverflow(middlewareArguments, detectOverflowOptions);
|
|
565
|
-
const overflows = [];
|
|
566
|
-
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
|
|
567
|
-
if (checkMainAxis) {
|
|
568
|
-
overflows.push(overflow[side]);
|
|
569
|
-
}
|
|
570
|
-
if (checkCrossAxis) {
|
|
571
|
-
const {
|
|
572
|
-
main,
|
|
573
|
-
cross
|
|
574
|
-
} = getAlignmentSides(placement, rects, rtl);
|
|
575
|
-
overflows.push(overflow[main], overflow[cross]);
|
|
576
|
-
}
|
|
577
|
-
overflowsData = [...overflowsData, {
|
|
578
|
-
placement,
|
|
579
|
-
overflows
|
|
580
|
-
}];
|
|
581
|
-
|
|
582
|
-
// One or more sides is overflowing.
|
|
583
|
-
if (!overflows.every(side => side <= 0)) {
|
|
584
|
-
var _middlewareData$flip2, _overflowsData$find;
|
|
585
|
-
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
|
|
586
|
-
const nextPlacement = placements[nextIndex];
|
|
587
|
-
if (nextPlacement) {
|
|
588
|
-
// Try next placement and re-run the lifecycle.
|
|
589
|
-
return {
|
|
590
|
-
data: {
|
|
591
|
-
index: nextIndex,
|
|
592
|
-
overflows: overflowsData
|
|
593
|
-
},
|
|
594
|
-
reset: {
|
|
595
|
-
placement: nextPlacement
|
|
596
|
-
}
|
|
597
|
-
};
|
|
598
|
-
}
|
|
599
|
-
|
|
600
|
-
// First, try to use the one that fits on mainAxis side of overflow.
|
|
601
|
-
let resetPlacement = (_overflowsData$find = overflowsData.find(d => d.overflows[0] <= 0)) == null ? void 0 : _overflowsData$find.placement;
|
|
602
|
-
|
|
603
|
-
// Otherwise fallback.
|
|
604
|
-
if (!resetPlacement) {
|
|
605
|
-
switch (fallbackStrategy) {
|
|
606
|
-
case 'bestFit':
|
|
607
|
-
{
|
|
608
|
-
var _overflowsData$map$so;
|
|
609
|
-
const placement = (_overflowsData$map$so = overflowsData.map(d => [d.placement, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$map$so[0];
|
|
610
|
-
if (placement) {
|
|
611
|
-
resetPlacement = placement;
|
|
612
|
-
}
|
|
613
|
-
break;
|
|
614
|
-
}
|
|
615
|
-
case 'initialPlacement':
|
|
616
|
-
resetPlacement = initialPlacement;
|
|
617
|
-
break;
|
|
618
|
-
}
|
|
619
|
-
}
|
|
620
|
-
if (placement !== resetPlacement) {
|
|
621
|
-
return {
|
|
622
|
-
reset: {
|
|
623
|
-
placement: resetPlacement
|
|
624
|
-
}
|
|
625
|
-
};
|
|
626
|
-
}
|
|
627
|
-
}
|
|
628
|
-
return {};
|
|
629
|
-
}
|
|
630
|
-
};
|
|
631
|
-
};
|
|
632
|
-
|
|
633
|
-
/**
|
|
634
|
-
* Provides improved positioning for inline reference elements that can span
|
|
635
|
-
* over multiple lines, such as hyperlinks or range selections.
|
|
636
|
-
* @see https://floating-ui.com/docs/inline
|
|
637
|
-
*/
|
|
638
|
-
const inline = function (options) {
|
|
639
|
-
if (options === void 0) {
|
|
640
|
-
options = {};
|
|
641
|
-
}
|
|
642
|
-
return {
|
|
643
|
-
name: 'inline',
|
|
644
|
-
options,
|
|
645
|
-
async fn(middlewareArguments) {
|
|
646
|
-
const {
|
|
647
|
-
placement,
|
|
648
|
-
elements,
|
|
649
|
-
rects,
|
|
650
|
-
platform,
|
|
651
|
-
strategy
|
|
652
|
-
} = middlewareArguments;
|
|
653
|
-
// A MouseEvent's client{X,Y} coords can be up to 2 pixels off a
|
|
654
|
-
// ClientRect's bounds, despite the event listener being triggered. A
|
|
655
|
-
// padding of 2 seems to handle this issue.
|
|
656
|
-
const {
|
|
657
|
-
padding = 2,
|
|
658
|
-
x,
|
|
659
|
-
y
|
|
660
|
-
} = options;
|
|
661
|
-
const fallback = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
662
|
-
rect: rects.reference,
|
|
663
|
-
offsetParent: await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating)),
|
|
664
|
-
strategy
|
|
665
|
-
}) : rects.reference);
|
|
666
|
-
const clientRects = (await (platform.getClientRects == null ? void 0 : platform.getClientRects(elements.reference))) || [];
|
|
667
|
-
const paddingObject = getSideObjectFromPadding(padding);
|
|
668
|
-
function getBoundingClientRect() {
|
|
669
|
-
// There are two rects and they are disjoined.
|
|
670
|
-
if (clientRects.length === 2 && clientRects[0].left > clientRects[1].right && x != null && y != null) {
|
|
671
|
-
// Find the first rect in which the point is fully inside.
|
|
672
|
-
return clientRects.find(rect => x > rect.left - paddingObject.left && x < rect.right + paddingObject.right && y > rect.top - paddingObject.top && y < rect.bottom + paddingObject.bottom) || fallback;
|
|
673
|
-
}
|
|
674
|
-
|
|
675
|
-
// There are 2 or more connected rects.
|
|
676
|
-
if (clientRects.length >= 2) {
|
|
677
|
-
if (getMainAxisFromPlacement(placement) === 'x') {
|
|
678
|
-
const firstRect = clientRects[0];
|
|
679
|
-
const lastRect = clientRects[clientRects.length - 1];
|
|
680
|
-
const isTop = getSide(placement) === 'top';
|
|
681
|
-
const top = firstRect.top;
|
|
682
|
-
const bottom = lastRect.bottom;
|
|
683
|
-
const left = isTop ? firstRect.left : lastRect.left;
|
|
684
|
-
const right = isTop ? firstRect.right : lastRect.right;
|
|
685
|
-
const width = right - left;
|
|
686
|
-
const height = bottom - top;
|
|
687
|
-
return {
|
|
688
|
-
top,
|
|
689
|
-
bottom,
|
|
690
|
-
left,
|
|
691
|
-
right,
|
|
692
|
-
width,
|
|
693
|
-
height,
|
|
694
|
-
x: left,
|
|
695
|
-
y: top
|
|
696
|
-
};
|
|
697
|
-
}
|
|
698
|
-
const isLeftSide = getSide(placement) === 'left';
|
|
699
|
-
const maxRight = max$1(...clientRects.map(rect => rect.right));
|
|
700
|
-
const minLeft = min$1(...clientRects.map(rect => rect.left));
|
|
701
|
-
const measureRects = clientRects.filter(rect => isLeftSide ? rect.left === minLeft : rect.right === maxRight);
|
|
702
|
-
const top = measureRects[0].top;
|
|
703
|
-
const bottom = measureRects[measureRects.length - 1].bottom;
|
|
704
|
-
const left = minLeft;
|
|
705
|
-
const right = maxRight;
|
|
706
|
-
const width = right - left;
|
|
707
|
-
const height = bottom - top;
|
|
708
|
-
return {
|
|
709
|
-
top,
|
|
710
|
-
bottom,
|
|
711
|
-
left,
|
|
712
|
-
right,
|
|
713
|
-
width,
|
|
714
|
-
height,
|
|
715
|
-
x: left,
|
|
716
|
-
y: top
|
|
717
|
-
};
|
|
718
|
-
}
|
|
719
|
-
return fallback;
|
|
720
|
-
}
|
|
721
|
-
const resetRects = await platform.getElementRects({
|
|
722
|
-
reference: {
|
|
723
|
-
getBoundingClientRect
|
|
724
|
-
},
|
|
725
|
-
floating: elements.floating,
|
|
726
|
-
strategy
|
|
727
|
-
});
|
|
728
|
-
if (rects.reference.x !== resetRects.reference.x || rects.reference.y !== resetRects.reference.y || rects.reference.width !== resetRects.reference.width || rects.reference.height !== resetRects.reference.height) {
|
|
729
|
-
return {
|
|
730
|
-
reset: {
|
|
731
|
-
rects: resetRects
|
|
732
|
-
}
|
|
733
|
-
};
|
|
734
|
-
}
|
|
735
|
-
return {};
|
|
736
|
-
}
|
|
737
|
-
};
|
|
738
|
-
};
|
|
739
|
-
|
|
740
|
-
async function convertValueToCoords(middlewareArguments, value) {
|
|
741
|
-
const {
|
|
742
|
-
placement,
|
|
743
|
-
platform,
|
|
744
|
-
elements
|
|
745
|
-
} = middlewareArguments;
|
|
746
|
-
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
|
|
747
|
-
const side = getSide(placement);
|
|
748
|
-
const alignment = getAlignment(placement);
|
|
749
|
-
const isVertical = getMainAxisFromPlacement(placement) === 'x';
|
|
750
|
-
const mainAxisMulti = ['left', 'top'].includes(side) ? -1 : 1;
|
|
751
|
-
const crossAxisMulti = rtl && isVertical ? -1 : 1;
|
|
752
|
-
const rawValue = typeof value === 'function' ? value(middlewareArguments) : value;
|
|
753
|
-
|
|
754
|
-
// eslint-disable-next-line prefer-const
|
|
755
|
-
let {
|
|
756
|
-
mainAxis,
|
|
757
|
-
crossAxis,
|
|
758
|
-
alignmentAxis
|
|
759
|
-
} = typeof rawValue === 'number' ? {
|
|
760
|
-
mainAxis: rawValue,
|
|
761
|
-
crossAxis: 0,
|
|
762
|
-
alignmentAxis: null
|
|
763
|
-
} : {
|
|
764
|
-
mainAxis: 0,
|
|
765
|
-
crossAxis: 0,
|
|
766
|
-
alignmentAxis: null,
|
|
767
|
-
...rawValue
|
|
768
|
-
};
|
|
769
|
-
if (alignment && typeof alignmentAxis === 'number') {
|
|
770
|
-
crossAxis = alignment === 'end' ? alignmentAxis * -1 : alignmentAxis;
|
|
771
|
-
}
|
|
772
|
-
return isVertical ? {
|
|
773
|
-
x: crossAxis * crossAxisMulti,
|
|
774
|
-
y: mainAxis * mainAxisMulti
|
|
775
|
-
} : {
|
|
776
|
-
x: mainAxis * mainAxisMulti,
|
|
777
|
-
y: crossAxis * crossAxisMulti
|
|
778
|
-
};
|
|
779
|
-
}
|
|
780
|
-
|
|
781
|
-
/**
|
|
782
|
-
* Displaces the floating element from its reference element.
|
|
783
|
-
* @see https://floating-ui.com/docs/offset
|
|
784
|
-
*/
|
|
785
|
-
const offset = function (value) {
|
|
786
|
-
if (value === void 0) {
|
|
787
|
-
value = 0;
|
|
788
|
-
}
|
|
789
|
-
return {
|
|
790
|
-
name: 'offset',
|
|
791
|
-
options: value,
|
|
792
|
-
async fn(middlewareArguments) {
|
|
793
|
-
const {
|
|
794
|
-
x,
|
|
795
|
-
y
|
|
796
|
-
} = middlewareArguments;
|
|
797
|
-
const diffCoords = await convertValueToCoords(middlewareArguments, value);
|
|
798
|
-
return {
|
|
799
|
-
x: x + diffCoords.x,
|
|
800
|
-
y: y + diffCoords.y,
|
|
801
|
-
data: diffCoords
|
|
802
|
-
};
|
|
803
|
-
}
|
|
804
|
-
};
|
|
805
|
-
};
|
|
806
|
-
|
|
807
|
-
function getCrossAxis(axis) {
|
|
808
|
-
return axis === 'x' ? 'y' : 'x';
|
|
809
|
-
}
|
|
810
|
-
|
|
811
|
-
/**
|
|
812
|
-
* Shifts the floating element in order to keep it in view when it will overflow
|
|
813
|
-
* a clipping boundary.
|
|
814
|
-
* @see https://floating-ui.com/docs/shift
|
|
815
|
-
*/
|
|
816
|
-
const shift = function (options) {
|
|
817
|
-
if (options === void 0) {
|
|
818
|
-
options = {};
|
|
819
|
-
}
|
|
820
|
-
return {
|
|
821
|
-
name: 'shift',
|
|
822
|
-
options,
|
|
823
|
-
async fn(middlewareArguments) {
|
|
824
|
-
const {
|
|
825
|
-
x,
|
|
826
|
-
y,
|
|
827
|
-
placement
|
|
828
|
-
} = middlewareArguments;
|
|
829
|
-
const {
|
|
830
|
-
mainAxis: checkMainAxis = true,
|
|
831
|
-
crossAxis: checkCrossAxis = false,
|
|
832
|
-
limiter = {
|
|
833
|
-
fn: _ref => {
|
|
834
|
-
let {
|
|
835
|
-
x,
|
|
836
|
-
y
|
|
837
|
-
} = _ref;
|
|
838
|
-
return {
|
|
839
|
-
x,
|
|
840
|
-
y
|
|
841
|
-
};
|
|
842
|
-
}
|
|
843
|
-
},
|
|
844
|
-
...detectOverflowOptions
|
|
845
|
-
} = options;
|
|
846
|
-
const coords = {
|
|
847
|
-
x,
|
|
848
|
-
y
|
|
849
|
-
};
|
|
850
|
-
const overflow = await detectOverflow(middlewareArguments, detectOverflowOptions);
|
|
851
|
-
const mainAxis = getMainAxisFromPlacement(getSide(placement));
|
|
852
|
-
const crossAxis = getCrossAxis(mainAxis);
|
|
853
|
-
let mainAxisCoord = coords[mainAxis];
|
|
854
|
-
let crossAxisCoord = coords[crossAxis];
|
|
855
|
-
if (checkMainAxis) {
|
|
856
|
-
const minSide = mainAxis === 'y' ? 'top' : 'left';
|
|
857
|
-
const maxSide = mainAxis === 'y' ? 'bottom' : 'right';
|
|
858
|
-
const min = mainAxisCoord + overflow[minSide];
|
|
859
|
-
const max = mainAxisCoord - overflow[maxSide];
|
|
860
|
-
mainAxisCoord = within(min, mainAxisCoord, max);
|
|
861
|
-
}
|
|
862
|
-
if (checkCrossAxis) {
|
|
863
|
-
const minSide = crossAxis === 'y' ? 'top' : 'left';
|
|
864
|
-
const maxSide = crossAxis === 'y' ? 'bottom' : 'right';
|
|
865
|
-
const min = crossAxisCoord + overflow[minSide];
|
|
866
|
-
const max = crossAxisCoord - overflow[maxSide];
|
|
867
|
-
crossAxisCoord = within(min, crossAxisCoord, max);
|
|
868
|
-
}
|
|
869
|
-
const limitedCoords = limiter.fn({
|
|
870
|
-
...middlewareArguments,
|
|
871
|
-
[mainAxis]: mainAxisCoord,
|
|
872
|
-
[crossAxis]: crossAxisCoord
|
|
873
|
-
});
|
|
874
|
-
return {
|
|
875
|
-
...limitedCoords,
|
|
876
|
-
data: {
|
|
877
|
-
x: limitedCoords.x - x,
|
|
878
|
-
y: limitedCoords.y - y
|
|
879
|
-
}
|
|
880
|
-
};
|
|
881
|
-
}
|
|
882
|
-
};
|
|
883
|
-
};
|
|
884
|
-
|
|
885
|
-
/**
|
|
886
|
-
* Provides data to change the size of the floating element. For instance,
|
|
887
|
-
* prevent it from overflowing its clipping boundary or match the width of the
|
|
888
|
-
* reference element.
|
|
889
|
-
* @see https://floating-ui.com/docs/size
|
|
890
|
-
*/
|
|
891
|
-
const size = function (options) {
|
|
892
|
-
if (options === void 0) {
|
|
893
|
-
options = {};
|
|
894
|
-
}
|
|
895
|
-
return {
|
|
896
|
-
name: 'size',
|
|
897
|
-
options,
|
|
898
|
-
async fn(middlewareArguments) {
|
|
899
|
-
const {
|
|
900
|
-
placement,
|
|
901
|
-
rects,
|
|
902
|
-
platform,
|
|
903
|
-
elements
|
|
904
|
-
} = middlewareArguments;
|
|
905
|
-
const {
|
|
906
|
-
apply = () => {},
|
|
907
|
-
...detectOverflowOptions
|
|
908
|
-
} = options;
|
|
909
|
-
const overflow = await detectOverflow(middlewareArguments, detectOverflowOptions);
|
|
910
|
-
const side = getSide(placement);
|
|
911
|
-
const alignment = getAlignment(placement);
|
|
912
|
-
let heightSide;
|
|
913
|
-
let widthSide;
|
|
914
|
-
if (side === 'top' || side === 'bottom') {
|
|
915
|
-
heightSide = side;
|
|
916
|
-
widthSide = alignment === ((await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating))) ? 'start' : 'end') ? 'left' : 'right';
|
|
917
|
-
} else {
|
|
918
|
-
widthSide = side;
|
|
919
|
-
heightSide = alignment === 'end' ? 'top' : 'bottom';
|
|
920
|
-
}
|
|
921
|
-
const xMin = max$1(overflow.left, 0);
|
|
922
|
-
const xMax = max$1(overflow.right, 0);
|
|
923
|
-
const yMin = max$1(overflow.top, 0);
|
|
924
|
-
const yMax = max$1(overflow.bottom, 0);
|
|
925
|
-
const dimensions = {
|
|
926
|
-
availableHeight: rects.floating.height - (['left', 'right'].includes(placement) ? 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max$1(overflow.top, overflow.bottom)) : overflow[heightSide]),
|
|
927
|
-
availableWidth: rects.floating.width - (['top', 'bottom'].includes(placement) ? 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max$1(overflow.left, overflow.right)) : overflow[widthSide])
|
|
928
|
-
};
|
|
929
|
-
await apply({
|
|
930
|
-
...middlewareArguments,
|
|
931
|
-
...dimensions
|
|
932
|
-
});
|
|
933
|
-
const nextDimensions = await platform.getDimensions(elements.floating);
|
|
934
|
-
if (rects.floating.width !== nextDimensions.width || rects.floating.height !== nextDimensions.height) {
|
|
935
|
-
return {
|
|
936
|
-
reset: {
|
|
937
|
-
rects: true
|
|
938
|
-
}
|
|
939
|
-
};
|
|
940
|
-
}
|
|
941
|
-
return {};
|
|
942
|
-
}
|
|
943
|
-
};
|
|
944
|
-
};
|
|
945
|
-
|
|
946
|
-
function getWindow(node) {
|
|
947
|
-
var _node$ownerDocument;
|
|
948
|
-
return ((_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
|
|
949
|
-
}
|
|
950
|
-
|
|
951
|
-
function getComputedStyle$1(element) {
|
|
952
|
-
return getWindow(element).getComputedStyle(element);
|
|
953
|
-
}
|
|
954
|
-
|
|
955
|
-
const min = Math.min;
|
|
956
|
-
const max = Math.max;
|
|
957
|
-
const round = Math.round;
|
|
958
|
-
|
|
959
|
-
function getCssDimensions(element) {
|
|
960
|
-
const css = getComputedStyle$1(element);
|
|
961
|
-
let width = parseFloat(css.width);
|
|
962
|
-
let height = parseFloat(css.height);
|
|
963
|
-
const offsetWidth = element.offsetWidth;
|
|
964
|
-
const offsetHeight = element.offsetHeight;
|
|
965
|
-
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
|
|
966
|
-
if (shouldFallback) {
|
|
967
|
-
width = offsetWidth;
|
|
968
|
-
height = offsetHeight;
|
|
969
|
-
}
|
|
970
|
-
return {
|
|
971
|
-
width,
|
|
972
|
-
height,
|
|
973
|
-
fallback: shouldFallback
|
|
974
|
-
};
|
|
975
|
-
}
|
|
976
|
-
|
|
977
|
-
function getNodeName(node) {
|
|
978
|
-
return isNode(node) ? (node.nodeName || '').toLowerCase() : '';
|
|
979
|
-
}
|
|
980
|
-
|
|
981
|
-
let uaString;
|
|
982
|
-
function getUAString() {
|
|
983
|
-
if (uaString) {
|
|
984
|
-
return uaString;
|
|
985
|
-
}
|
|
986
|
-
const uaData = navigator.userAgentData;
|
|
987
|
-
if (uaData && Array.isArray(uaData.brands)) {
|
|
988
|
-
uaString = uaData.brands.map(item => item.brand + "/" + item.version).join(' ');
|
|
989
|
-
return uaString;
|
|
990
|
-
}
|
|
991
|
-
return navigator.userAgent;
|
|
992
|
-
}
|
|
993
|
-
|
|
994
|
-
function isHTMLElement(value) {
|
|
995
|
-
return value instanceof getWindow(value).HTMLElement;
|
|
996
|
-
}
|
|
997
|
-
function isElement(value) {
|
|
998
|
-
return value instanceof getWindow(value).Element;
|
|
999
|
-
}
|
|
1000
|
-
function isNode(value) {
|
|
1001
|
-
return value instanceof getWindow(value).Node;
|
|
1002
|
-
}
|
|
1003
|
-
function isShadowRoot(node) {
|
|
1004
|
-
// Browsers without `ShadowRoot` support.
|
|
1005
|
-
if (typeof ShadowRoot === 'undefined') {
|
|
1006
|
-
return false;
|
|
1007
|
-
}
|
|
1008
|
-
const OwnElement = getWindow(node).ShadowRoot;
|
|
1009
|
-
return node instanceof OwnElement || node instanceof ShadowRoot;
|
|
1010
|
-
}
|
|
1011
|
-
function isOverflowElement(element) {
|
|
1012
|
-
const {
|
|
1013
|
-
overflow,
|
|
1014
|
-
overflowX,
|
|
1015
|
-
overflowY,
|
|
1016
|
-
display
|
|
1017
|
-
} = getComputedStyle$1(element);
|
|
1018
|
-
return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !['inline', 'contents'].includes(display);
|
|
1019
|
-
}
|
|
1020
|
-
function isTableElement(element) {
|
|
1021
|
-
return ['table', 'td', 'th'].includes(getNodeName(element));
|
|
1022
|
-
}
|
|
1023
|
-
function isContainingBlock(element) {
|
|
1024
|
-
// TODO: Try to use feature detection here instead.
|
|
1025
|
-
const isFirefox = /firefox/i.test(getUAString());
|
|
1026
|
-
const css = getComputedStyle$1(element);
|
|
1027
|
-
const backdropFilter = css.backdropFilter || css.WebkitBackdropFilter;
|
|
1028
|
-
|
|
1029
|
-
// This is non-exhaustive but covers the most common CSS properties that
|
|
1030
|
-
// create a containing block.
|
|
1031
|
-
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
1032
|
-
return css.transform !== 'none' || css.perspective !== 'none' || (backdropFilter ? backdropFilter !== 'none' : false) || isFirefox && css.willChange === 'filter' || isFirefox && (css.filter ? css.filter !== 'none' : false) || ['transform', 'perspective'].some(value => css.willChange.includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => {
|
|
1033
|
-
// Add type check for old browsers.
|
|
1034
|
-
const contain = css.contain;
|
|
1035
|
-
return contain != null ? contain.includes(value) : false;
|
|
1036
|
-
});
|
|
1037
|
-
}
|
|
1038
|
-
function isLayoutViewport() {
|
|
1039
|
-
// TODO: Try to use feature detection here instead. Feature detection for
|
|
1040
|
-
// this can fail in various ways, making the userAgent check the most:
|
|
1041
|
-
// reliable:
|
|
1042
|
-
// • Always-visible scrollbar or not
|
|
1043
|
-
// • Width of <html>
|
|
1044
|
-
|
|
1045
|
-
// Not Safari.
|
|
1046
|
-
return !/^((?!chrome|android).)*safari/i.test(getUAString());
|
|
1047
|
-
}
|
|
1048
|
-
function isLastTraversableNode(node) {
|
|
1049
|
-
return ['html', 'body', '#document'].includes(getNodeName(node));
|
|
1050
|
-
}
|
|
1051
|
-
|
|
1052
|
-
function unwrapElement(element) {
|
|
1053
|
-
return !isElement(element) ? element.contextElement : element;
|
|
1054
|
-
}
|
|
1055
|
-
|
|
1056
|
-
const FALLBACK_SCALE = {
|
|
1057
|
-
x: 1,
|
|
1058
|
-
y: 1
|
|
1059
|
-
};
|
|
1060
|
-
function getScale(element) {
|
|
1061
|
-
const domElement = unwrapElement(element);
|
|
1062
|
-
if (!isHTMLElement(domElement)) {
|
|
1063
|
-
return FALLBACK_SCALE;
|
|
1064
|
-
}
|
|
1065
|
-
const rect = domElement.getBoundingClientRect();
|
|
1066
|
-
const {
|
|
1067
|
-
width,
|
|
1068
|
-
height,
|
|
1069
|
-
fallback
|
|
1070
|
-
} = getCssDimensions(domElement);
|
|
1071
|
-
let x = (fallback ? round(rect.width) : rect.width) / width;
|
|
1072
|
-
let y = (fallback ? round(rect.height) : rect.height) / height;
|
|
1073
|
-
|
|
1074
|
-
// 0, NaN, or Infinity should always fallback to 1.
|
|
1075
|
-
|
|
1076
|
-
if (!x || !Number.isFinite(x)) {
|
|
1077
|
-
x = 1;
|
|
1078
|
-
}
|
|
1079
|
-
if (!y || !Number.isFinite(y)) {
|
|
1080
|
-
y = 1;
|
|
1081
|
-
}
|
|
1082
|
-
return {
|
|
1083
|
-
x,
|
|
1084
|
-
y
|
|
1085
|
-
};
|
|
1086
|
-
}
|
|
1087
|
-
|
|
1088
|
-
function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
|
|
1089
|
-
var _win$visualViewport, _win$visualViewport2;
|
|
1090
|
-
if (includeScale === void 0) {
|
|
1091
|
-
includeScale = false;
|
|
1092
|
-
}
|
|
1093
|
-
if (isFixedStrategy === void 0) {
|
|
1094
|
-
isFixedStrategy = false;
|
|
1095
|
-
}
|
|
1096
|
-
const clientRect = element.getBoundingClientRect();
|
|
1097
|
-
const domElement = unwrapElement(element);
|
|
1098
|
-
let scale = FALLBACK_SCALE;
|
|
1099
|
-
if (includeScale) {
|
|
1100
|
-
if (offsetParent) {
|
|
1101
|
-
if (isElement(offsetParent)) {
|
|
1102
|
-
scale = getScale(offsetParent);
|
|
1103
|
-
}
|
|
1104
|
-
} else {
|
|
1105
|
-
scale = getScale(element);
|
|
1106
|
-
}
|
|
1107
|
-
}
|
|
1108
|
-
const win = domElement ? getWindow(domElement) : window;
|
|
1109
|
-
const addVisualOffsets = !isLayoutViewport() && isFixedStrategy;
|
|
1110
|
-
let x = (clientRect.left + (addVisualOffsets ? ((_win$visualViewport = win.visualViewport) == null ? void 0 : _win$visualViewport.offsetLeft) || 0 : 0)) / scale.x;
|
|
1111
|
-
let y = (clientRect.top + (addVisualOffsets ? ((_win$visualViewport2 = win.visualViewport) == null ? void 0 : _win$visualViewport2.offsetTop) || 0 : 0)) / scale.y;
|
|
1112
|
-
let width = clientRect.width / scale.x;
|
|
1113
|
-
let height = clientRect.height / scale.y;
|
|
1114
|
-
if (domElement) {
|
|
1115
|
-
const win = getWindow(domElement);
|
|
1116
|
-
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
|
|
1117
|
-
let currentIFrame = win.frameElement;
|
|
1118
|
-
while (currentIFrame && offsetParent && offsetWin !== win) {
|
|
1119
|
-
const iframeScale = getScale(currentIFrame);
|
|
1120
|
-
const iframeRect = currentIFrame.getBoundingClientRect();
|
|
1121
|
-
const css = getComputedStyle(currentIFrame);
|
|
1122
|
-
iframeRect.x += (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
|
|
1123
|
-
iframeRect.y += (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
|
|
1124
|
-
x *= iframeScale.x;
|
|
1125
|
-
y *= iframeScale.y;
|
|
1126
|
-
width *= iframeScale.x;
|
|
1127
|
-
height *= iframeScale.y;
|
|
1128
|
-
x += iframeRect.x;
|
|
1129
|
-
y += iframeRect.y;
|
|
1130
|
-
currentIFrame = getWindow(currentIFrame).frameElement;
|
|
1131
|
-
}
|
|
1132
|
-
}
|
|
1133
|
-
return {
|
|
1134
|
-
width,
|
|
1135
|
-
height,
|
|
1136
|
-
top: y,
|
|
1137
|
-
right: x + width,
|
|
1138
|
-
bottom: y + height,
|
|
1139
|
-
left: x,
|
|
1140
|
-
x,
|
|
1141
|
-
y
|
|
1142
|
-
};
|
|
1143
|
-
}
|
|
1144
|
-
|
|
1145
|
-
function getDocumentElement(node) {
|
|
1146
|
-
return ((isNode(node) ? node.ownerDocument : node.document) || window.document).documentElement;
|
|
1147
|
-
}
|
|
1148
|
-
|
|
1149
|
-
function getNodeScroll(element) {
|
|
1150
|
-
if (isElement(element)) {
|
|
1151
|
-
return {
|
|
1152
|
-
scrollLeft: element.scrollLeft,
|
|
1153
|
-
scrollTop: element.scrollTop
|
|
1154
|
-
};
|
|
1155
|
-
}
|
|
1156
|
-
return {
|
|
1157
|
-
scrollLeft: element.pageXOffset,
|
|
1158
|
-
scrollTop: element.pageYOffset
|
|
1159
|
-
};
|
|
1160
|
-
}
|
|
1161
|
-
|
|
1162
|
-
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
1163
|
-
let {
|
|
1164
|
-
rect,
|
|
1165
|
-
offsetParent,
|
|
1166
|
-
strategy
|
|
1167
|
-
} = _ref;
|
|
1168
|
-
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
1169
|
-
const documentElement = getDocumentElement(offsetParent);
|
|
1170
|
-
if (offsetParent === documentElement) {
|
|
1171
|
-
return rect;
|
|
1172
|
-
}
|
|
1173
|
-
let scroll = {
|
|
1174
|
-
scrollLeft: 0,
|
|
1175
|
-
scrollTop: 0
|
|
1176
|
-
};
|
|
1177
|
-
let scale = {
|
|
1178
|
-
x: 1,
|
|
1179
|
-
y: 1
|
|
1180
|
-
};
|
|
1181
|
-
const offsets = {
|
|
1182
|
-
x: 0,
|
|
1183
|
-
y: 0
|
|
1184
|
-
};
|
|
1185
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== 'fixed') {
|
|
1186
|
-
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
1187
|
-
scroll = getNodeScroll(offsetParent);
|
|
1188
|
-
}
|
|
1189
|
-
if (isHTMLElement(offsetParent)) {
|
|
1190
|
-
const offsetRect = getBoundingClientRect(offsetParent);
|
|
1191
|
-
scale = getScale(offsetParent);
|
|
1192
|
-
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
1193
|
-
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
1194
|
-
}
|
|
1195
|
-
}
|
|
1196
|
-
return {
|
|
1197
|
-
width: rect.width * scale.x,
|
|
1198
|
-
height: rect.height * scale.y,
|
|
1199
|
-
x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
|
|
1200
|
-
y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
|
|
1201
|
-
};
|
|
1202
|
-
}
|
|
1203
|
-
|
|
1204
|
-
function getWindowScrollBarX(element) {
|
|
1205
|
-
// If <html> has a CSS width greater than the viewport, then this will be
|
|
1206
|
-
// incorrect for RTL.
|
|
1207
|
-
return getBoundingClientRect(getDocumentElement(element)).left + getNodeScroll(element).scrollLeft;
|
|
1208
|
-
}
|
|
1209
|
-
|
|
1210
|
-
// Gets the entire size of the scrollable document area, even extending outside
|
|
1211
|
-
// of the `<html>` and `<body>` rect bounds if horizontally scrollable.
|
|
1212
|
-
function getDocumentRect(element) {
|
|
1213
|
-
const html = getDocumentElement(element);
|
|
1214
|
-
const scroll = getNodeScroll(element);
|
|
1215
|
-
const body = element.ownerDocument.body;
|
|
1216
|
-
const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
|
|
1217
|
-
const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
|
|
1218
|
-
let x = -scroll.scrollLeft + getWindowScrollBarX(element);
|
|
1219
|
-
const y = -scroll.scrollTop;
|
|
1220
|
-
if (getComputedStyle$1(body).direction === 'rtl') {
|
|
1221
|
-
x += max(html.clientWidth, body.clientWidth) - width;
|
|
1222
|
-
}
|
|
1223
|
-
return {
|
|
1224
|
-
width,
|
|
1225
|
-
height,
|
|
1226
|
-
x,
|
|
1227
|
-
y
|
|
1228
|
-
};
|
|
1229
|
-
}
|
|
1230
|
-
|
|
1231
|
-
function getParentNode(node) {
|
|
1232
|
-
if (getNodeName(node) === 'html') {
|
|
1233
|
-
return node;
|
|
1234
|
-
}
|
|
1235
|
-
const result =
|
|
1236
|
-
// Step into the shadow DOM of the parent of a slotted node.
|
|
1237
|
-
node.assignedSlot ||
|
|
1238
|
-
// DOM Element detected.
|
|
1239
|
-
node.parentNode ||
|
|
1240
|
-
// ShadowRoot detected.
|
|
1241
|
-
isShadowRoot(node) && node.host ||
|
|
1242
|
-
// Fallback.
|
|
1243
|
-
getDocumentElement(node);
|
|
1244
|
-
return isShadowRoot(result) ? result.host : result;
|
|
1245
|
-
}
|
|
1246
|
-
|
|
1247
|
-
function getNearestOverflowAncestor(node) {
|
|
1248
|
-
const parentNode = getParentNode(node);
|
|
1249
|
-
if (isLastTraversableNode(parentNode)) {
|
|
1250
|
-
// `getParentNode` will never return a `Document` due to the fallback
|
|
1251
|
-
// check, so it's either the <html> or <body> element.
|
|
1252
|
-
return parentNode.ownerDocument.body;
|
|
1253
|
-
}
|
|
1254
|
-
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
|
|
1255
|
-
return parentNode;
|
|
1256
|
-
}
|
|
1257
|
-
return getNearestOverflowAncestor(parentNode);
|
|
1258
|
-
}
|
|
1259
|
-
|
|
1260
|
-
function getOverflowAncestors(node, list) {
|
|
1261
|
-
var _node$ownerDocument;
|
|
1262
|
-
if (list === void 0) {
|
|
1263
|
-
list = [];
|
|
1264
|
-
}
|
|
1265
|
-
const scrollableAncestor = getNearestOverflowAncestor(node);
|
|
1266
|
-
const isBody = scrollableAncestor === ((_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.body);
|
|
1267
|
-
const win = getWindow(scrollableAncestor);
|
|
1268
|
-
if (isBody) {
|
|
1269
|
-
return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : []);
|
|
1270
|
-
}
|
|
1271
|
-
return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor));
|
|
1272
|
-
}
|
|
1273
|
-
|
|
1274
|
-
function getViewportRect(element, strategy) {
|
|
1275
|
-
const win = getWindow(element);
|
|
1276
|
-
const html = getDocumentElement(element);
|
|
1277
|
-
const visualViewport = win.visualViewport;
|
|
1278
|
-
let width = html.clientWidth;
|
|
1279
|
-
let height = html.clientHeight;
|
|
1280
|
-
let x = 0;
|
|
1281
|
-
let y = 0;
|
|
1282
|
-
if (visualViewport) {
|
|
1283
|
-
width = visualViewport.width;
|
|
1284
|
-
height = visualViewport.height;
|
|
1285
|
-
const layoutViewport = isLayoutViewport();
|
|
1286
|
-
if (layoutViewport || !layoutViewport && strategy === 'fixed') {
|
|
1287
|
-
x = visualViewport.offsetLeft;
|
|
1288
|
-
y = visualViewport.offsetTop;
|
|
1289
|
-
}
|
|
1290
|
-
}
|
|
1291
|
-
return {
|
|
1292
|
-
width,
|
|
1293
|
-
height,
|
|
1294
|
-
x,
|
|
1295
|
-
y
|
|
1296
|
-
};
|
|
1297
|
-
}
|
|
1298
|
-
|
|
1299
|
-
// Returns the inner client rect, subtracting scrollbars if present.
|
|
1300
|
-
function getInnerBoundingClientRect(element, strategy) {
|
|
1301
|
-
const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
|
|
1302
|
-
const top = clientRect.top + element.clientTop;
|
|
1303
|
-
const left = clientRect.left + element.clientLeft;
|
|
1304
|
-
const scale = isHTMLElement(element) ? getScale(element) : {
|
|
1305
|
-
x: 1,
|
|
1306
|
-
y: 1
|
|
1307
|
-
};
|
|
1308
|
-
const width = element.clientWidth * scale.x;
|
|
1309
|
-
const height = element.clientHeight * scale.y;
|
|
1310
|
-
const x = left * scale.x;
|
|
1311
|
-
const y = top * scale.y;
|
|
1312
|
-
return {
|
|
1313
|
-
width,
|
|
1314
|
-
height,
|
|
1315
|
-
x,
|
|
1316
|
-
y
|
|
1317
|
-
};
|
|
1318
|
-
}
|
|
1319
|
-
function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
|
|
1320
|
-
if (clippingAncestor === 'viewport') {
|
|
1321
|
-
return rectToClientRect(getViewportRect(element, strategy));
|
|
1322
|
-
}
|
|
1323
|
-
if (isElement(clippingAncestor)) {
|
|
1324
|
-
return rectToClientRect(getInnerBoundingClientRect(clippingAncestor, strategy));
|
|
1325
|
-
}
|
|
1326
|
-
return rectToClientRect(getDocumentRect(getDocumentElement(element)));
|
|
1327
|
-
}
|
|
1328
|
-
|
|
1329
|
-
// A "clipping ancestor" is an `overflow` element with the characteristic of
|
|
1330
|
-
// clipping (or hiding) child elements. This returns all clipping ancestors
|
|
1331
|
-
// of the given element up the tree.
|
|
1332
|
-
function getClippingElementAncestors(element, cache) {
|
|
1333
|
-
const cachedResult = cache.get(element);
|
|
1334
|
-
if (cachedResult) {
|
|
1335
|
-
return cachedResult;
|
|
1336
|
-
}
|
|
1337
|
-
let result = getOverflowAncestors(element).filter(el => isElement(el) && getNodeName(el) !== 'body');
|
|
1338
|
-
let currentContainingBlockComputedStyle = null;
|
|
1339
|
-
const elementIsFixed = getComputedStyle$1(element).position === 'fixed';
|
|
1340
|
-
let currentNode = elementIsFixed ? getParentNode(element) : element;
|
|
1341
|
-
|
|
1342
|
-
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
1343
|
-
while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
1344
|
-
const computedStyle = getComputedStyle$1(currentNode);
|
|
1345
|
-
const containingBlock = isContainingBlock(currentNode);
|
|
1346
|
-
const shouldDropCurrentNode = elementIsFixed ? !containingBlock && !currentContainingBlockComputedStyle : !containingBlock && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && ['absolute', 'fixed'].includes(currentContainingBlockComputedStyle.position);
|
|
1347
|
-
if (shouldDropCurrentNode) {
|
|
1348
|
-
// Drop non-containing blocks.
|
|
1349
|
-
result = result.filter(ancestor => ancestor !== currentNode);
|
|
1350
|
-
} else {
|
|
1351
|
-
// Record last containing block for next iteration.
|
|
1352
|
-
currentContainingBlockComputedStyle = computedStyle;
|
|
1353
|
-
}
|
|
1354
|
-
currentNode = getParentNode(currentNode);
|
|
1355
|
-
}
|
|
1356
|
-
cache.set(element, result);
|
|
1357
|
-
return result;
|
|
1358
|
-
}
|
|
1359
|
-
|
|
1360
|
-
// Gets the maximum area that the element is visible in due to any number of
|
|
1361
|
-
// clipping ancestors.
|
|
1362
|
-
function getClippingRect(_ref) {
|
|
1363
|
-
let {
|
|
1364
|
-
element,
|
|
1365
|
-
boundary,
|
|
1366
|
-
rootBoundary,
|
|
1367
|
-
strategy
|
|
1368
|
-
} = _ref;
|
|
1369
|
-
const elementClippingAncestors = boundary === 'clippingAncestors' ? getClippingElementAncestors(element, this._c) : [].concat(boundary);
|
|
1370
|
-
const clippingAncestors = [...elementClippingAncestors, rootBoundary];
|
|
1371
|
-
const firstClippingAncestor = clippingAncestors[0];
|
|
1372
|
-
const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
|
|
1373
|
-
const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
|
|
1374
|
-
accRect.top = max(rect.top, accRect.top);
|
|
1375
|
-
accRect.right = min(rect.right, accRect.right);
|
|
1376
|
-
accRect.bottom = min(rect.bottom, accRect.bottom);
|
|
1377
|
-
accRect.left = max(rect.left, accRect.left);
|
|
1378
|
-
return accRect;
|
|
1379
|
-
}, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
|
|
1380
|
-
return {
|
|
1381
|
-
width: clippingRect.right - clippingRect.left,
|
|
1382
|
-
height: clippingRect.bottom - clippingRect.top,
|
|
1383
|
-
x: clippingRect.left,
|
|
1384
|
-
y: clippingRect.top
|
|
1385
|
-
};
|
|
1386
|
-
}
|
|
1387
|
-
|
|
1388
|
-
function getDimensions(element) {
|
|
1389
|
-
if (isHTMLElement(element)) {
|
|
1390
|
-
return getCssDimensions(element);
|
|
1391
|
-
}
|
|
1392
|
-
return element.getBoundingClientRect();
|
|
1393
|
-
}
|
|
1394
|
-
|
|
1395
|
-
function getTrueOffsetParent(element) {
|
|
1396
|
-
if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
|
|
1397
|
-
return null;
|
|
1398
|
-
}
|
|
1399
|
-
return element.offsetParent;
|
|
1400
|
-
}
|
|
1401
|
-
function getContainingBlock(element) {
|
|
1402
|
-
let currentNode = getParentNode(element);
|
|
1403
|
-
while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
1404
|
-
if (isContainingBlock(currentNode)) {
|
|
1405
|
-
return currentNode;
|
|
1406
|
-
} else {
|
|
1407
|
-
currentNode = getParentNode(currentNode);
|
|
1408
|
-
}
|
|
1409
|
-
}
|
|
1410
|
-
return null;
|
|
1411
|
-
}
|
|
1412
|
-
|
|
1413
|
-
// Gets the closest ancestor positioned element. Handles some edge cases,
|
|
1414
|
-
// such as table ancestors and cross browser bugs.
|
|
1415
|
-
function getOffsetParent(element) {
|
|
1416
|
-
const window = getWindow(element);
|
|
1417
|
-
let offsetParent = getTrueOffsetParent(element);
|
|
1418
|
-
while (offsetParent && isTableElement(offsetParent) && getComputedStyle$1(offsetParent).position === 'static') {
|
|
1419
|
-
offsetParent = getTrueOffsetParent(offsetParent);
|
|
1420
|
-
}
|
|
1421
|
-
if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle$1(offsetParent).position === 'static' && !isContainingBlock(offsetParent))) {
|
|
1422
|
-
return window;
|
|
1423
|
-
}
|
|
1424
|
-
return offsetParent || getContainingBlock(element) || window;
|
|
1425
|
-
}
|
|
1426
|
-
|
|
1427
|
-
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
1428
|
-
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
1429
|
-
const documentElement = getDocumentElement(offsetParent);
|
|
1430
|
-
const rect = getBoundingClientRect(element, true, strategy === 'fixed', offsetParent);
|
|
1431
|
-
let scroll = {
|
|
1432
|
-
scrollLeft: 0,
|
|
1433
|
-
scrollTop: 0
|
|
1434
|
-
};
|
|
1435
|
-
const offsets = {
|
|
1436
|
-
x: 0,
|
|
1437
|
-
y: 0
|
|
1438
|
-
};
|
|
1439
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== 'fixed') {
|
|
1440
|
-
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
1441
|
-
scroll = getNodeScroll(offsetParent);
|
|
1442
|
-
}
|
|
1443
|
-
if (isHTMLElement(offsetParent)) {
|
|
1444
|
-
const offsetRect = getBoundingClientRect(offsetParent, true);
|
|
1445
|
-
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
1446
|
-
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
1447
|
-
} else if (documentElement) {
|
|
1448
|
-
offsets.x = getWindowScrollBarX(documentElement);
|
|
1449
|
-
}
|
|
1450
|
-
}
|
|
1451
|
-
return {
|
|
1452
|
-
x: rect.left + scroll.scrollLeft - offsets.x,
|
|
1453
|
-
y: rect.top + scroll.scrollTop - offsets.y,
|
|
1454
|
-
width: rect.width,
|
|
1455
|
-
height: rect.height
|
|
1456
|
-
};
|
|
1457
|
-
}
|
|
1458
|
-
|
|
1459
|
-
const platform = {
|
|
1460
|
-
getClippingRect,
|
|
1461
|
-
convertOffsetParentRelativeRectToViewportRelativeRect,
|
|
1462
|
-
isElement,
|
|
1463
|
-
getDimensions,
|
|
1464
|
-
getOffsetParent,
|
|
1465
|
-
getDocumentElement,
|
|
1466
|
-
getScale,
|
|
1467
|
-
async getElementRects(_ref) {
|
|
1468
|
-
let {
|
|
1469
|
-
reference,
|
|
1470
|
-
floating,
|
|
1471
|
-
strategy
|
|
1472
|
-
} = _ref;
|
|
1473
|
-
const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
|
|
1474
|
-
const getDimensionsFn = this.getDimensions;
|
|
1475
|
-
return {
|
|
1476
|
-
reference: getRectRelativeToOffsetParent(reference, await getOffsetParentFn(floating), strategy),
|
|
1477
|
-
floating: {
|
|
1478
|
-
x: 0,
|
|
1479
|
-
y: 0,
|
|
1480
|
-
...(await getDimensionsFn(floating))
|
|
1481
|
-
}
|
|
1482
|
-
};
|
|
1483
|
-
},
|
|
1484
|
-
getClientRects: element => Array.from(element.getClientRects()),
|
|
1485
|
-
isRTL: element => getComputedStyle$1(element).direction === 'rtl'
|
|
1486
|
-
};
|
|
1487
|
-
|
|
1488
|
-
/**
|
|
1489
|
-
* Computes the `x` and `y` coordinates that will place the floating element
|
|
1490
|
-
* next to a reference element when it is given a certain CSS positioning
|
|
1491
|
-
* strategy.
|
|
1492
|
-
*/
|
|
1493
|
-
const computePosition = (reference, floating, options) => {
|
|
1494
|
-
// This caches the expensive `getClippingElementAncestors` function so that
|
|
1495
|
-
// multiple lifecycle resets re-use the same result. It only lives for a
|
|
1496
|
-
// single call. If other functions become expensive, we can add them as well.
|
|
1497
|
-
const cache = new Map();
|
|
1498
|
-
const mergedOptions = {
|
|
1499
|
-
platform,
|
|
1500
|
-
...options
|
|
1501
|
-
};
|
|
1502
|
-
const platformWithCache = {
|
|
1503
|
-
...mergedOptions.platform,
|
|
1504
|
-
_c: cache
|
|
1505
|
-
};
|
|
1506
|
-
return computePosition$1(reference, floating, {
|
|
1507
|
-
...mergedOptions,
|
|
1508
|
-
platform: platformWithCache
|
|
1509
|
-
});
|
|
1510
|
-
};
|
|
1511
|
-
|
|
1512
3
|
var jsxRuntime = {exports: {}};
|
|
1513
4
|
|
|
1514
5
|
var reactJsxRuntime_development = {};
|
|
@@ -1787,832 +278,2074 @@ var reactJsxRuntime_development = {};
|
|
|
1787
278
|
}
|
|
1788
279
|
}
|
|
1789
280
|
|
|
1790
|
-
function checkPropTypes(typeSpecs, values, location, componentName, element) {
|
|
281
|
+
function checkPropTypes(typeSpecs, values, location, componentName, element) {
|
|
282
|
+
{
|
|
283
|
+
// $FlowFixMe This is okay but Flow doesn't know it.
|
|
284
|
+
var has = Function.call.bind(Object.prototype.hasOwnProperty);
|
|
285
|
+
|
|
286
|
+
for (var typeSpecName in typeSpecs) {
|
|
287
|
+
if (has(typeSpecs, typeSpecName)) {
|
|
288
|
+
var error$1 = void 0; // Prop type validation may throw. In case they do, we don't want to
|
|
289
|
+
// fail the render phase where it didn't fail before. So we log it.
|
|
290
|
+
// After these have been cleaned up, we'll let them throw.
|
|
291
|
+
|
|
292
|
+
try {
|
|
293
|
+
// This is intentionally an invariant that gets caught. It's the same
|
|
294
|
+
// behavior as without this statement except with a better message.
|
|
295
|
+
if (typeof typeSpecs[typeSpecName] !== 'function') {
|
|
296
|
+
var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
|
|
297
|
+
err.name = 'Invariant Violation';
|
|
298
|
+
throw err;
|
|
299
|
+
}
|
|
300
|
+
|
|
301
|
+
error$1 = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED');
|
|
302
|
+
} catch (ex) {
|
|
303
|
+
error$1 = ex;
|
|
304
|
+
}
|
|
305
|
+
|
|
306
|
+
if (error$1 && !(error$1 instanceof Error)) {
|
|
307
|
+
setCurrentlyValidatingElement(element);
|
|
308
|
+
|
|
309
|
+
error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
|
|
310
|
+
|
|
311
|
+
setCurrentlyValidatingElement(null);
|
|
312
|
+
}
|
|
313
|
+
|
|
314
|
+
if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
|
|
315
|
+
// Only monitor this failure once because there tends to be a lot of the
|
|
316
|
+
// same error.
|
|
317
|
+
loggedTypeFailures[error$1.message] = true;
|
|
318
|
+
setCurrentlyValidatingElement(element);
|
|
319
|
+
|
|
320
|
+
error('Failed %s type: %s', location, error$1.message);
|
|
321
|
+
|
|
322
|
+
setCurrentlyValidatingElement(null);
|
|
323
|
+
}
|
|
324
|
+
}
|
|
325
|
+
}
|
|
326
|
+
}
|
|
327
|
+
}
|
|
328
|
+
|
|
329
|
+
var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
|
|
330
|
+
var hasOwnProperty = Object.prototype.hasOwnProperty;
|
|
331
|
+
var RESERVED_PROPS = {
|
|
332
|
+
key: true,
|
|
333
|
+
ref: true,
|
|
334
|
+
__self: true,
|
|
335
|
+
__source: true
|
|
336
|
+
};
|
|
337
|
+
var specialPropKeyWarningShown;
|
|
338
|
+
var specialPropRefWarningShown;
|
|
339
|
+
var didWarnAboutStringRefs;
|
|
340
|
+
|
|
341
|
+
{
|
|
342
|
+
didWarnAboutStringRefs = {};
|
|
343
|
+
}
|
|
344
|
+
|
|
345
|
+
function hasValidRef(config) {
|
|
346
|
+
{
|
|
347
|
+
if (hasOwnProperty.call(config, 'ref')) {
|
|
348
|
+
var getter = Object.getOwnPropertyDescriptor(config, 'ref').get;
|
|
349
|
+
|
|
350
|
+
if (getter && getter.isReactWarning) {
|
|
351
|
+
return false;
|
|
352
|
+
}
|
|
353
|
+
}
|
|
354
|
+
}
|
|
355
|
+
|
|
356
|
+
return config.ref !== undefined;
|
|
357
|
+
}
|
|
358
|
+
|
|
359
|
+
function hasValidKey(config) {
|
|
360
|
+
{
|
|
361
|
+
if (hasOwnProperty.call(config, 'key')) {
|
|
362
|
+
var getter = Object.getOwnPropertyDescriptor(config, 'key').get;
|
|
363
|
+
|
|
364
|
+
if (getter && getter.isReactWarning) {
|
|
365
|
+
return false;
|
|
366
|
+
}
|
|
367
|
+
}
|
|
368
|
+
}
|
|
369
|
+
|
|
370
|
+
return config.key !== undefined;
|
|
371
|
+
}
|
|
372
|
+
|
|
373
|
+
function warnIfStringRefCannotBeAutoConverted(config, self) {
|
|
374
|
+
{
|
|
375
|
+
if (typeof config.ref === 'string' && ReactCurrentOwner.current && self && ReactCurrentOwner.current.stateNode !== self) {
|
|
376
|
+
var componentName = getComponentName(ReactCurrentOwner.current.type);
|
|
377
|
+
|
|
378
|
+
if (!didWarnAboutStringRefs[componentName]) {
|
|
379
|
+
error('Component "%s" contains the string ref "%s". ' + 'Support for string refs will be removed in a future major release. ' + 'This case cannot be automatically converted to an arrow function. ' + 'We ask you to manually fix this case by using useRef() or createRef() instead. ' + 'Learn more about using refs safely here: ' + 'https://reactjs.org/link/strict-mode-string-ref', getComponentName(ReactCurrentOwner.current.type), config.ref);
|
|
380
|
+
|
|
381
|
+
didWarnAboutStringRefs[componentName] = true;
|
|
382
|
+
}
|
|
383
|
+
}
|
|
384
|
+
}
|
|
385
|
+
}
|
|
386
|
+
|
|
387
|
+
function defineKeyPropWarningGetter(props, displayName) {
|
|
388
|
+
{
|
|
389
|
+
var warnAboutAccessingKey = function () {
|
|
390
|
+
if (!specialPropKeyWarningShown) {
|
|
391
|
+
specialPropKeyWarningShown = true;
|
|
392
|
+
|
|
393
|
+
error('%s: `key` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
|
394
|
+
}
|
|
395
|
+
};
|
|
396
|
+
|
|
397
|
+
warnAboutAccessingKey.isReactWarning = true;
|
|
398
|
+
Object.defineProperty(props, 'key', {
|
|
399
|
+
get: warnAboutAccessingKey,
|
|
400
|
+
configurable: true
|
|
401
|
+
});
|
|
402
|
+
}
|
|
403
|
+
}
|
|
404
|
+
|
|
405
|
+
function defineRefPropWarningGetter(props, displayName) {
|
|
406
|
+
{
|
|
407
|
+
var warnAboutAccessingRef = function () {
|
|
408
|
+
if (!specialPropRefWarningShown) {
|
|
409
|
+
specialPropRefWarningShown = true;
|
|
410
|
+
|
|
411
|
+
error('%s: `ref` is not a prop. Trying to access it will result ' + 'in `undefined` being returned. If you need to access the same ' + 'value within the child component, you should pass it as a different ' + 'prop. (https://reactjs.org/link/special-props)', displayName);
|
|
412
|
+
}
|
|
413
|
+
};
|
|
414
|
+
|
|
415
|
+
warnAboutAccessingRef.isReactWarning = true;
|
|
416
|
+
Object.defineProperty(props, 'ref', {
|
|
417
|
+
get: warnAboutAccessingRef,
|
|
418
|
+
configurable: true
|
|
419
|
+
});
|
|
420
|
+
}
|
|
421
|
+
}
|
|
422
|
+
/**
|
|
423
|
+
* Factory method to create a new React element. This no longer adheres to
|
|
424
|
+
* the class pattern, so do not use new to call it. Also, instanceof check
|
|
425
|
+
* will not work. Instead test $$typeof field against Symbol.for('react.element') to check
|
|
426
|
+
* if something is a React Element.
|
|
427
|
+
*
|
|
428
|
+
* @param {*} type
|
|
429
|
+
* @param {*} props
|
|
430
|
+
* @param {*} key
|
|
431
|
+
* @param {string|object} ref
|
|
432
|
+
* @param {*} owner
|
|
433
|
+
* @param {*} self A *temporary* helper to detect places where `this` is
|
|
434
|
+
* different from the `owner` when React.createElement is called, so that we
|
|
435
|
+
* can warn. We want to get rid of owner and replace string `ref`s with arrow
|
|
436
|
+
* functions, and as long as `this` and owner are the same, there will be no
|
|
437
|
+
* change in behavior.
|
|
438
|
+
* @param {*} source An annotation object (added by a transpiler or otherwise)
|
|
439
|
+
* indicating filename, line number, and/or other information.
|
|
440
|
+
* @internal
|
|
441
|
+
*/
|
|
442
|
+
|
|
443
|
+
|
|
444
|
+
var ReactElement = function (type, key, ref, self, source, owner, props) {
|
|
445
|
+
var element = {
|
|
446
|
+
// This tag allows us to uniquely identify this as a React Element
|
|
447
|
+
$$typeof: REACT_ELEMENT_TYPE,
|
|
448
|
+
// Built-in properties that belong on the element
|
|
449
|
+
type: type,
|
|
450
|
+
key: key,
|
|
451
|
+
ref: ref,
|
|
452
|
+
props: props,
|
|
453
|
+
// Record the component responsible for creating this element.
|
|
454
|
+
_owner: owner
|
|
455
|
+
};
|
|
456
|
+
|
|
457
|
+
{
|
|
458
|
+
// The validation flag is currently mutative. We put it on
|
|
459
|
+
// an external backing store so that we can freeze the whole object.
|
|
460
|
+
// This can be replaced with a WeakMap once they are implemented in
|
|
461
|
+
// commonly used development environments.
|
|
462
|
+
element._store = {}; // To make comparing ReactElements easier for testing purposes, we make
|
|
463
|
+
// the validation flag non-enumerable (where possible, which should
|
|
464
|
+
// include every environment we run tests in), so the test framework
|
|
465
|
+
// ignores it.
|
|
466
|
+
|
|
467
|
+
Object.defineProperty(element._store, 'validated', {
|
|
468
|
+
configurable: false,
|
|
469
|
+
enumerable: false,
|
|
470
|
+
writable: true,
|
|
471
|
+
value: false
|
|
472
|
+
}); // self and source are DEV only properties.
|
|
473
|
+
|
|
474
|
+
Object.defineProperty(element, '_self', {
|
|
475
|
+
configurable: false,
|
|
476
|
+
enumerable: false,
|
|
477
|
+
writable: false,
|
|
478
|
+
value: self
|
|
479
|
+
}); // Two elements created in two different places should be considered
|
|
480
|
+
// equal for testing purposes and therefore we hide it from enumeration.
|
|
481
|
+
|
|
482
|
+
Object.defineProperty(element, '_source', {
|
|
483
|
+
configurable: false,
|
|
484
|
+
enumerable: false,
|
|
485
|
+
writable: false,
|
|
486
|
+
value: source
|
|
487
|
+
});
|
|
488
|
+
|
|
489
|
+
if (Object.freeze) {
|
|
490
|
+
Object.freeze(element.props);
|
|
491
|
+
Object.freeze(element);
|
|
492
|
+
}
|
|
493
|
+
}
|
|
494
|
+
|
|
495
|
+
return element;
|
|
496
|
+
};
|
|
497
|
+
/**
|
|
498
|
+
* https://github.com/reactjs/rfcs/pull/107
|
|
499
|
+
* @param {*} type
|
|
500
|
+
* @param {object} props
|
|
501
|
+
* @param {string} key
|
|
502
|
+
*/
|
|
503
|
+
|
|
504
|
+
function jsxDEV(type, config, maybeKey, source, self) {
|
|
1791
505
|
{
|
|
1792
|
-
|
|
1793
|
-
var has = Function.call.bind(Object.prototype.hasOwnProperty);
|
|
506
|
+
var propName; // Reserved names are extracted
|
|
1794
507
|
|
|
1795
|
-
|
|
1796
|
-
|
|
1797
|
-
|
|
1798
|
-
|
|
1799
|
-
|
|
508
|
+
var props = {};
|
|
509
|
+
var key = null;
|
|
510
|
+
var ref = null; // Currently, key can be spread in as a prop. This causes a potential
|
|
511
|
+
// issue if key is also explicitly declared (ie. <div {...props} key="Hi" />
|
|
512
|
+
// or <div key="Hi" {...props} /> ). We want to deprecate key spread,
|
|
513
|
+
// but as an intermediary step, we will use jsxDEV for everything except
|
|
514
|
+
// <div {...props} key="Hi" />, because we aren't currently able to tell if
|
|
515
|
+
// key is explicitly declared to be undefined or not.
|
|
1800
516
|
|
|
1801
|
-
|
|
1802
|
-
|
|
1803
|
-
|
|
1804
|
-
if (typeof typeSpecs[typeSpecName] !== 'function') {
|
|
1805
|
-
var err = Error((componentName || 'React class') + ': ' + location + ' type `' + typeSpecName + '` is invalid; ' + 'it must be a function, usually from the `prop-types` package, but received `' + typeof typeSpecs[typeSpecName] + '`.' + 'This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.');
|
|
1806
|
-
err.name = 'Invariant Violation';
|
|
1807
|
-
throw err;
|
|
1808
|
-
}
|
|
517
|
+
if (maybeKey !== undefined) {
|
|
518
|
+
key = '' + maybeKey;
|
|
519
|
+
}
|
|
1809
520
|
|
|
1810
|
-
|
|
1811
|
-
|
|
1812
|
-
|
|
1813
|
-
}
|
|
521
|
+
if (hasValidKey(config)) {
|
|
522
|
+
key = '' + config.key;
|
|
523
|
+
}
|
|
1814
524
|
|
|
1815
|
-
|
|
1816
|
-
|
|
525
|
+
if (hasValidRef(config)) {
|
|
526
|
+
ref = config.ref;
|
|
527
|
+
warnIfStringRefCannotBeAutoConverted(config, self);
|
|
528
|
+
} // Remaining properties are added to a new props object
|
|
1817
529
|
|
|
1818
|
-
error('%s: type specification of %s' + ' `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error$1);
|
|
1819
530
|
|
|
1820
|
-
|
|
1821
|
-
|
|
531
|
+
for (propName in config) {
|
|
532
|
+
if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
|
|
533
|
+
props[propName] = config[propName];
|
|
534
|
+
}
|
|
535
|
+
} // Resolve default props
|
|
1822
536
|
|
|
1823
|
-
if (error$1 instanceof Error && !(error$1.message in loggedTypeFailures)) {
|
|
1824
|
-
// Only monitor this failure once because there tends to be a lot of the
|
|
1825
|
-
// same error.
|
|
1826
|
-
loggedTypeFailures[error$1.message] = true;
|
|
1827
|
-
setCurrentlyValidatingElement(element);
|
|
1828
537
|
|
|
1829
|
-
|
|
538
|
+
if (type && type.defaultProps) {
|
|
539
|
+
var defaultProps = type.defaultProps;
|
|
1830
540
|
|
|
1831
|
-
|
|
541
|
+
for (propName in defaultProps) {
|
|
542
|
+
if (props[propName] === undefined) {
|
|
543
|
+
props[propName] = defaultProps[propName];
|
|
1832
544
|
}
|
|
1833
545
|
}
|
|
1834
546
|
}
|
|
547
|
+
|
|
548
|
+
if (key || ref) {
|
|
549
|
+
var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type;
|
|
550
|
+
|
|
551
|
+
if (key) {
|
|
552
|
+
defineKeyPropWarningGetter(props, displayName);
|
|
553
|
+
}
|
|
554
|
+
|
|
555
|
+
if (ref) {
|
|
556
|
+
defineRefPropWarningGetter(props, displayName);
|
|
557
|
+
}
|
|
558
|
+
}
|
|
559
|
+
|
|
560
|
+
return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props);
|
|
1835
561
|
}
|
|
1836
562
|
}
|
|
1837
563
|
|
|
1838
|
-
var ReactCurrentOwner = ReactSharedInternals.ReactCurrentOwner;
|
|
1839
|
-
|
|
1840
|
-
|
|
1841
|
-
|
|
1842
|
-
|
|
1843
|
-
|
|
1844
|
-
|
|
1845
|
-
|
|
1846
|
-
var specialPropKeyWarningShown;
|
|
1847
|
-
var specialPropRefWarningShown;
|
|
1848
|
-
var didWarnAboutStringRefs;
|
|
564
|
+
var ReactCurrentOwner$1 = ReactSharedInternals.ReactCurrentOwner;
|
|
565
|
+
ReactSharedInternals.ReactDebugCurrentFrame;
|
|
566
|
+
|
|
567
|
+
function setCurrentlyValidatingElement$1(element) {
|
|
568
|
+
currentlyValidatingElement = element;
|
|
569
|
+
}
|
|
570
|
+
|
|
571
|
+
var propTypesMisspellWarningShown;
|
|
1849
572
|
|
|
1850
573
|
{
|
|
1851
|
-
|
|
574
|
+
propTypesMisspellWarningShown = false;
|
|
1852
575
|
}
|
|
576
|
+
/**
|
|
577
|
+
* Verifies the object is a ReactElement.
|
|
578
|
+
* See https://reactjs.org/docs/react-api.html#isvalidelement
|
|
579
|
+
* @param {?object} object
|
|
580
|
+
* @return {boolean} True if `object` is a ReactElement.
|
|
581
|
+
* @final
|
|
582
|
+
*/
|
|
1853
583
|
|
|
1854
|
-
function
|
|
584
|
+
function isValidElement(object) {
|
|
1855
585
|
{
|
|
1856
|
-
|
|
1857
|
-
var getter = Object.getOwnPropertyDescriptor(config, 'ref').get;
|
|
1858
|
-
|
|
1859
|
-
if (getter && getter.isReactWarning) {
|
|
1860
|
-
return false;
|
|
1861
|
-
}
|
|
1862
|
-
}
|
|
586
|
+
return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
|
|
1863
587
|
}
|
|
1864
|
-
|
|
1865
|
-
return config.ref !== undefined;
|
|
1866
588
|
}
|
|
1867
589
|
|
|
1868
|
-
function
|
|
590
|
+
function getDeclarationErrorAddendum() {
|
|
1869
591
|
{
|
|
1870
|
-
if (
|
|
1871
|
-
var
|
|
592
|
+
if (ReactCurrentOwner$1.current) {
|
|
593
|
+
var name = getComponentName(ReactCurrentOwner$1.current.type);
|
|
1872
594
|
|
|
1873
|
-
if (
|
|
1874
|
-
return
|
|
595
|
+
if (name) {
|
|
596
|
+
return '\n\nCheck the render method of `' + name + '`.';
|
|
1875
597
|
}
|
|
1876
598
|
}
|
|
599
|
+
|
|
600
|
+
return '';
|
|
1877
601
|
}
|
|
602
|
+
}
|
|
1878
603
|
|
|
1879
|
-
|
|
604
|
+
function getSourceInfoErrorAddendum(source) {
|
|
605
|
+
{
|
|
606
|
+
if (source !== undefined) {
|
|
607
|
+
var fileName = source.fileName.replace(/^.*[\\\/]/, '');
|
|
608
|
+
var lineNumber = source.lineNumber;
|
|
609
|
+
return '\n\nCheck your code at ' + fileName + ':' + lineNumber + '.';
|
|
610
|
+
}
|
|
611
|
+
|
|
612
|
+
return '';
|
|
613
|
+
}
|
|
1880
614
|
}
|
|
615
|
+
/**
|
|
616
|
+
* Warn if there's no key explicitly set on dynamic arrays of children or
|
|
617
|
+
* object keys are not valid. This allows us to keep track of children between
|
|
618
|
+
* updates.
|
|
619
|
+
*/
|
|
1881
620
|
|
|
1882
|
-
|
|
621
|
+
|
|
622
|
+
var ownerHasKeyUseWarning = {};
|
|
623
|
+
|
|
624
|
+
function getCurrentComponentErrorInfo(parentType) {
|
|
1883
625
|
{
|
|
1884
|
-
|
|
1885
|
-
var componentName = getComponentName(ReactCurrentOwner.current.type);
|
|
626
|
+
var info = getDeclarationErrorAddendum();
|
|
1886
627
|
|
|
1887
|
-
|
|
1888
|
-
|
|
628
|
+
if (!info) {
|
|
629
|
+
var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name;
|
|
1889
630
|
|
|
1890
|
-
|
|
631
|
+
if (parentName) {
|
|
632
|
+
info = "\n\nCheck the top-level render call using <" + parentName + ">.";
|
|
1891
633
|
}
|
|
1892
634
|
}
|
|
635
|
+
|
|
636
|
+
return info;
|
|
1893
637
|
}
|
|
1894
638
|
}
|
|
639
|
+
/**
|
|
640
|
+
* Warn if the element doesn't have an explicit key assigned to it.
|
|
641
|
+
* This element is in an array. The array could grow and shrink or be
|
|
642
|
+
* reordered. All children that haven't already been validated are required to
|
|
643
|
+
* have a "key" property assigned to it. Error statuses are cached so a warning
|
|
644
|
+
* will only be shown once.
|
|
645
|
+
*
|
|
646
|
+
* @internal
|
|
647
|
+
* @param {ReactElement} element Element that requires a key.
|
|
648
|
+
* @param {*} parentType element's parent's type.
|
|
649
|
+
*/
|
|
1895
650
|
|
|
1896
|
-
|
|
651
|
+
|
|
652
|
+
function validateExplicitKey(element, parentType) {
|
|
1897
653
|
{
|
|
1898
|
-
|
|
1899
|
-
|
|
1900
|
-
|
|
654
|
+
if (!element._store || element._store.validated || element.key != null) {
|
|
655
|
+
return;
|
|
656
|
+
}
|
|
1901
657
|
|
|
1902
|
-
|
|
1903
|
-
|
|
1904
|
-
};
|
|
658
|
+
element._store.validated = true;
|
|
659
|
+
var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType);
|
|
1905
660
|
|
|
1906
|
-
|
|
1907
|
-
|
|
1908
|
-
|
|
1909
|
-
|
|
1910
|
-
|
|
661
|
+
if (ownerHasKeyUseWarning[currentComponentErrorInfo]) {
|
|
662
|
+
return;
|
|
663
|
+
}
|
|
664
|
+
|
|
665
|
+
ownerHasKeyUseWarning[currentComponentErrorInfo] = true; // Usually the current owner is the offender, but if it accepts children as a
|
|
666
|
+
// property, it may be the creator of the child that's responsible for
|
|
667
|
+
// assigning it a key.
|
|
668
|
+
|
|
669
|
+
var childOwner = '';
|
|
670
|
+
|
|
671
|
+
if (element && element._owner && element._owner !== ReactCurrentOwner$1.current) {
|
|
672
|
+
// Give the component that originally created this child.
|
|
673
|
+
childOwner = " It was passed a child from " + getComponentName(element._owner.type) + ".";
|
|
674
|
+
}
|
|
675
|
+
|
|
676
|
+
setCurrentlyValidatingElement$1(element);
|
|
677
|
+
|
|
678
|
+
error('Each child in a list should have a unique "key" prop.' + '%s%s See https://reactjs.org/link/warning-keys for more information.', currentComponentErrorInfo, childOwner);
|
|
679
|
+
|
|
680
|
+
setCurrentlyValidatingElement$1(null);
|
|
1911
681
|
}
|
|
1912
682
|
}
|
|
683
|
+
/**
|
|
684
|
+
* Ensure that every element either is passed in a static location, in an
|
|
685
|
+
* array with an explicit keys property defined, or in an object literal
|
|
686
|
+
* with valid key property.
|
|
687
|
+
*
|
|
688
|
+
* @internal
|
|
689
|
+
* @param {ReactNode} node Statically passed child of any type.
|
|
690
|
+
* @param {*} parentType node's parent's type.
|
|
691
|
+
*/
|
|
1913
692
|
|
|
1914
|
-
|
|
693
|
+
|
|
694
|
+
function validateChildKeys(node, parentType) {
|
|
1915
695
|
{
|
|
1916
|
-
|
|
1917
|
-
|
|
1918
|
-
|
|
696
|
+
if (typeof node !== 'object') {
|
|
697
|
+
return;
|
|
698
|
+
}
|
|
1919
699
|
|
|
1920
|
-
|
|
700
|
+
if (Array.isArray(node)) {
|
|
701
|
+
for (var i = 0; i < node.length; i++) {
|
|
702
|
+
var child = node[i];
|
|
703
|
+
|
|
704
|
+
if (isValidElement(child)) {
|
|
705
|
+
validateExplicitKey(child, parentType);
|
|
706
|
+
}
|
|
707
|
+
}
|
|
708
|
+
} else if (isValidElement(node)) {
|
|
709
|
+
// This element was passed in a valid location.
|
|
710
|
+
if (node._store) {
|
|
711
|
+
node._store.validated = true;
|
|
712
|
+
}
|
|
713
|
+
} else if (node) {
|
|
714
|
+
var iteratorFn = getIteratorFn(node);
|
|
715
|
+
|
|
716
|
+
if (typeof iteratorFn === 'function') {
|
|
717
|
+
// Entry iterators used to provide implicit keys,
|
|
718
|
+
// but now we print a separate warning for them later.
|
|
719
|
+
if (iteratorFn !== node.entries) {
|
|
720
|
+
var iterator = iteratorFn.call(node);
|
|
721
|
+
var step;
|
|
722
|
+
|
|
723
|
+
while (!(step = iterator.next()).done) {
|
|
724
|
+
if (isValidElement(step.value)) {
|
|
725
|
+
validateExplicitKey(step.value, parentType);
|
|
726
|
+
}
|
|
727
|
+
}
|
|
728
|
+
}
|
|
1921
729
|
}
|
|
1922
|
-
}
|
|
1923
|
-
|
|
1924
|
-
warnAboutAccessingRef.isReactWarning = true;
|
|
1925
|
-
Object.defineProperty(props, 'ref', {
|
|
1926
|
-
get: warnAboutAccessingRef,
|
|
1927
|
-
configurable: true
|
|
1928
|
-
});
|
|
730
|
+
}
|
|
1929
731
|
}
|
|
1930
732
|
}
|
|
1931
733
|
/**
|
|
1932
|
-
*
|
|
1933
|
-
*
|
|
1934
|
-
* will not work. Instead test $$typeof field against Symbol.for('react.element') to check
|
|
1935
|
-
* if something is a React Element.
|
|
734
|
+
* Given an element, validate that its props follow the propTypes definition,
|
|
735
|
+
* provided by the type.
|
|
1936
736
|
*
|
|
1937
|
-
* @param {
|
|
1938
|
-
* @param {*} props
|
|
1939
|
-
* @param {*} key
|
|
1940
|
-
* @param {string|object} ref
|
|
1941
|
-
* @param {*} owner
|
|
1942
|
-
* @param {*} self A *temporary* helper to detect places where `this` is
|
|
1943
|
-
* different from the `owner` when React.createElement is called, so that we
|
|
1944
|
-
* can warn. We want to get rid of owner and replace string `ref`s with arrow
|
|
1945
|
-
* functions, and as long as `this` and owner are the same, there will be no
|
|
1946
|
-
* change in behavior.
|
|
1947
|
-
* @param {*} source An annotation object (added by a transpiler or otherwise)
|
|
1948
|
-
* indicating filename, line number, and/or other information.
|
|
1949
|
-
* @internal
|
|
737
|
+
* @param {ReactElement} element
|
|
1950
738
|
*/
|
|
1951
739
|
|
|
1952
740
|
|
|
1953
|
-
|
|
1954
|
-
var element = {
|
|
1955
|
-
// This tag allows us to uniquely identify this as a React Element
|
|
1956
|
-
$$typeof: REACT_ELEMENT_TYPE,
|
|
1957
|
-
// Built-in properties that belong on the element
|
|
1958
|
-
type: type,
|
|
1959
|
-
key: key,
|
|
1960
|
-
ref: ref,
|
|
1961
|
-
props: props,
|
|
1962
|
-
// Record the component responsible for creating this element.
|
|
1963
|
-
_owner: owner
|
|
1964
|
-
};
|
|
1965
|
-
|
|
741
|
+
function validatePropTypes(element) {
|
|
1966
742
|
{
|
|
1967
|
-
|
|
1968
|
-
// an external backing store so that we can freeze the whole object.
|
|
1969
|
-
// This can be replaced with a WeakMap once they are implemented in
|
|
1970
|
-
// commonly used development environments.
|
|
1971
|
-
element._store = {}; // To make comparing ReactElements easier for testing purposes, we make
|
|
1972
|
-
// the validation flag non-enumerable (where possible, which should
|
|
1973
|
-
// include every environment we run tests in), so the test framework
|
|
1974
|
-
// ignores it.
|
|
743
|
+
var type = element.type;
|
|
1975
744
|
|
|
1976
|
-
|
|
1977
|
-
|
|
1978
|
-
|
|
1979
|
-
writable: true,
|
|
1980
|
-
value: false
|
|
1981
|
-
}); // self and source are DEV only properties.
|
|
745
|
+
if (type === null || type === undefined || typeof type === 'string') {
|
|
746
|
+
return;
|
|
747
|
+
}
|
|
1982
748
|
|
|
1983
|
-
|
|
1984
|
-
configurable: false,
|
|
1985
|
-
enumerable: false,
|
|
1986
|
-
writable: false,
|
|
1987
|
-
value: self
|
|
1988
|
-
}); // Two elements created in two different places should be considered
|
|
1989
|
-
// equal for testing purposes and therefore we hide it from enumeration.
|
|
749
|
+
var propTypes;
|
|
1990
750
|
|
|
1991
|
-
|
|
1992
|
-
|
|
1993
|
-
|
|
1994
|
-
|
|
1995
|
-
|
|
1996
|
-
|
|
751
|
+
if (typeof type === 'function') {
|
|
752
|
+
propTypes = type.propTypes;
|
|
753
|
+
} else if (typeof type === 'object' && (type.$$typeof === REACT_FORWARD_REF_TYPE || // Note: Memo only checks outer props here.
|
|
754
|
+
// Inner props are checked in the reconciler.
|
|
755
|
+
type.$$typeof === REACT_MEMO_TYPE)) {
|
|
756
|
+
propTypes = type.propTypes;
|
|
757
|
+
} else {
|
|
758
|
+
return;
|
|
759
|
+
}
|
|
1997
760
|
|
|
1998
|
-
if (
|
|
1999
|
-
|
|
2000
|
-
|
|
761
|
+
if (propTypes) {
|
|
762
|
+
// Intentionally inside to avoid triggering lazy initializers:
|
|
763
|
+
var name = getComponentName(type);
|
|
764
|
+
checkPropTypes(propTypes, element.props, 'prop', name, element);
|
|
765
|
+
} else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
|
|
766
|
+
propTypesMisspellWarningShown = true; // Intentionally inside to avoid triggering lazy initializers:
|
|
767
|
+
|
|
768
|
+
var _name = getComponentName(type);
|
|
769
|
+
|
|
770
|
+
error('Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?', _name || 'Unknown');
|
|
2001
771
|
}
|
|
2002
|
-
}
|
|
2003
772
|
|
|
2004
|
-
|
|
2005
|
-
|
|
773
|
+
if (typeof type.getDefaultProps === 'function' && !type.getDefaultProps.isReactClassApproved) {
|
|
774
|
+
error('getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.');
|
|
775
|
+
}
|
|
776
|
+
}
|
|
777
|
+
}
|
|
2006
778
|
/**
|
|
2007
|
-
*
|
|
2008
|
-
* @param {
|
|
2009
|
-
* @param {object} props
|
|
2010
|
-
* @param {string} key
|
|
779
|
+
* Given a fragment, validate that it can only be provided with fragment props
|
|
780
|
+
* @param {ReactElement} fragment
|
|
2011
781
|
*/
|
|
2012
782
|
|
|
2013
|
-
|
|
783
|
+
|
|
784
|
+
function validateFragmentProps(fragment) {
|
|
2014
785
|
{
|
|
2015
|
-
var
|
|
786
|
+
var keys = Object.keys(fragment.props);
|
|
2016
787
|
|
|
2017
|
-
var
|
|
2018
|
-
|
|
2019
|
-
var ref = null; // Currently, key can be spread in as a prop. This causes a potential
|
|
2020
|
-
// issue if key is also explicitly declared (ie. <div {...props} key="Hi" />
|
|
2021
|
-
// or <div key="Hi" {...props} /> ). We want to deprecate key spread,
|
|
2022
|
-
// but as an intermediary step, we will use jsxDEV for everything except
|
|
2023
|
-
// <div {...props} key="Hi" />, because we aren't currently able to tell if
|
|
2024
|
-
// key is explicitly declared to be undefined or not.
|
|
788
|
+
for (var i = 0; i < keys.length; i++) {
|
|
789
|
+
var key = keys[i];
|
|
2025
790
|
|
|
2026
|
-
|
|
2027
|
-
|
|
2028
|
-
}
|
|
791
|
+
if (key !== 'children' && key !== 'key') {
|
|
792
|
+
setCurrentlyValidatingElement$1(fragment);
|
|
2029
793
|
|
|
2030
|
-
|
|
2031
|
-
|
|
794
|
+
error('Invalid prop `%s` supplied to `React.Fragment`. ' + 'React.Fragment can only have `key` and `children` props.', key);
|
|
795
|
+
|
|
796
|
+
setCurrentlyValidatingElement$1(null);
|
|
797
|
+
break;
|
|
798
|
+
}
|
|
2032
799
|
}
|
|
2033
800
|
|
|
2034
|
-
if (
|
|
2035
|
-
|
|
2036
|
-
warnIfStringRefCannotBeAutoConverted(config, self);
|
|
2037
|
-
} // Remaining properties are added to a new props object
|
|
801
|
+
if (fragment.ref !== null) {
|
|
802
|
+
setCurrentlyValidatingElement$1(fragment);
|
|
2038
803
|
|
|
804
|
+
error('Invalid attribute `ref` supplied to `React.Fragment`.');
|
|
2039
805
|
|
|
2040
|
-
|
|
2041
|
-
|
|
2042
|
-
|
|
2043
|
-
|
|
2044
|
-
} // Resolve default props
|
|
806
|
+
setCurrentlyValidatingElement$1(null);
|
|
807
|
+
}
|
|
808
|
+
}
|
|
809
|
+
}
|
|
2045
810
|
|
|
811
|
+
function jsxWithValidation(type, props, key, isStaticChildren, source, self) {
|
|
812
|
+
{
|
|
813
|
+
var validType = isValidElementType(type); // We warn in this case but don't throw. We expect the element creation to
|
|
814
|
+
// succeed and there will likely be errors in render.
|
|
2046
815
|
|
|
2047
|
-
if (
|
|
2048
|
-
var
|
|
816
|
+
if (!validType) {
|
|
817
|
+
var info = '';
|
|
2049
818
|
|
|
2050
|
-
|
|
2051
|
-
|
|
2052
|
-
props[propName] = defaultProps[propName];
|
|
2053
|
-
}
|
|
819
|
+
if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
|
|
820
|
+
info += ' You likely forgot to export your component from the file ' + "it's defined in, or you might have mixed up default and named imports.";
|
|
2054
821
|
}
|
|
2055
|
-
}
|
|
2056
822
|
|
|
2057
|
-
|
|
2058
|
-
var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type;
|
|
823
|
+
var sourceInfo = getSourceInfoErrorAddendum(source);
|
|
2059
824
|
|
|
2060
|
-
if (
|
|
2061
|
-
|
|
825
|
+
if (sourceInfo) {
|
|
826
|
+
info += sourceInfo;
|
|
827
|
+
} else {
|
|
828
|
+
info += getDeclarationErrorAddendum();
|
|
2062
829
|
}
|
|
2063
830
|
|
|
2064
|
-
|
|
2065
|
-
|
|
831
|
+
var typeString;
|
|
832
|
+
|
|
833
|
+
if (type === null) {
|
|
834
|
+
typeString = 'null';
|
|
835
|
+
} else if (Array.isArray(type)) {
|
|
836
|
+
typeString = 'array';
|
|
837
|
+
} else if (type !== undefined && type.$$typeof === REACT_ELEMENT_TYPE) {
|
|
838
|
+
typeString = "<" + (getComponentName(type.type) || 'Unknown') + " />";
|
|
839
|
+
info = ' Did you accidentally export a JSX literal instead of a component?';
|
|
840
|
+
} else {
|
|
841
|
+
typeString = typeof type;
|
|
2066
842
|
}
|
|
843
|
+
|
|
844
|
+
error('React.jsx: type is invalid -- expected a string (for ' + 'built-in components) or a class/function (for composite ' + 'components) but got: %s.%s', typeString, info);
|
|
2067
845
|
}
|
|
2068
846
|
|
|
2069
|
-
|
|
2070
|
-
|
|
2071
|
-
}
|
|
847
|
+
var element = jsxDEV(type, props, key, source, self); // The result can be nullish if a mock or a custom function is used.
|
|
848
|
+
// TODO: Drop this when these are no longer allowed as the type argument.
|
|
2072
849
|
|
|
2073
|
-
|
|
2074
|
-
|
|
850
|
+
if (element == null) {
|
|
851
|
+
return element;
|
|
852
|
+
} // Skip key warning if the type isn't valid since our key validation logic
|
|
853
|
+
// doesn't expect a non-string/function type and can throw confusing errors.
|
|
854
|
+
// We don't want exception behavior to differ between dev and prod.
|
|
855
|
+
// (Rendering will throw with a helpful message and as soon as the type is
|
|
856
|
+
// fixed, the key warnings will appear.)
|
|
2075
857
|
|
|
2076
|
-
function setCurrentlyValidatingElement$1(element) {
|
|
2077
|
-
currentlyValidatingElement = element;
|
|
2078
|
-
}
|
|
2079
858
|
|
|
2080
|
-
|
|
859
|
+
if (validType) {
|
|
860
|
+
var children = props.children;
|
|
2081
861
|
|
|
2082
|
-
|
|
2083
|
-
|
|
2084
|
-
|
|
2085
|
-
|
|
2086
|
-
|
|
2087
|
-
|
|
2088
|
-
|
|
2089
|
-
|
|
2090
|
-
|
|
2091
|
-
|
|
862
|
+
if (children !== undefined) {
|
|
863
|
+
if (isStaticChildren) {
|
|
864
|
+
if (Array.isArray(children)) {
|
|
865
|
+
for (var i = 0; i < children.length; i++) {
|
|
866
|
+
validateChildKeys(children[i], type);
|
|
867
|
+
}
|
|
868
|
+
|
|
869
|
+
if (Object.freeze) {
|
|
870
|
+
Object.freeze(children);
|
|
871
|
+
}
|
|
872
|
+
} else {
|
|
873
|
+
error('React.jsx: Static children should always be an array. ' + 'You are likely explicitly calling React.jsxs or React.jsxDEV. ' + 'Use the Babel transform instead.');
|
|
874
|
+
}
|
|
875
|
+
} else {
|
|
876
|
+
validateChildKeys(children, type);
|
|
877
|
+
}
|
|
878
|
+
}
|
|
879
|
+
}
|
|
880
|
+
|
|
881
|
+
if (type === exports.Fragment) {
|
|
882
|
+
validateFragmentProps(element);
|
|
883
|
+
} else {
|
|
884
|
+
validatePropTypes(element);
|
|
885
|
+
}
|
|
886
|
+
|
|
887
|
+
return element;
|
|
888
|
+
}
|
|
889
|
+
} // These two functions exist to still get child warnings in dev
|
|
890
|
+
// even with the prod transform. This means that jsxDEV is purely
|
|
891
|
+
// opt-in behavior for better messages but that we won't stop
|
|
892
|
+
// giving you warnings if you use production apis.
|
|
2092
893
|
|
|
2093
|
-
function
|
|
894
|
+
function jsxWithValidationStatic(type, props, key) {
|
|
2094
895
|
{
|
|
2095
|
-
return
|
|
896
|
+
return jsxWithValidation(type, props, key, true);
|
|
2096
897
|
}
|
|
2097
898
|
}
|
|
2098
|
-
|
|
2099
|
-
function getDeclarationErrorAddendum() {
|
|
899
|
+
function jsxWithValidationDynamic(type, props, key) {
|
|
2100
900
|
{
|
|
2101
|
-
|
|
2102
|
-
|
|
901
|
+
return jsxWithValidation(type, props, key, false);
|
|
902
|
+
}
|
|
903
|
+
}
|
|
2103
904
|
|
|
2104
|
-
|
|
2105
|
-
|
|
2106
|
-
}
|
|
2107
|
-
}
|
|
905
|
+
var jsx = jsxWithValidationDynamic ; // we may want to special case jsxs internally to take advantage of static children.
|
|
906
|
+
// for now we can ship identical prod functions
|
|
2108
907
|
|
|
2109
|
-
|
|
2110
|
-
|
|
908
|
+
var jsxs = jsxWithValidationStatic ;
|
|
909
|
+
|
|
910
|
+
exports.jsx = jsx;
|
|
911
|
+
exports.jsxs = jsxs;
|
|
912
|
+
})();
|
|
2111
913
|
}
|
|
914
|
+
} (reactJsxRuntime_development));
|
|
2112
915
|
|
|
2113
|
-
|
|
2114
|
-
{
|
|
2115
|
-
if (source !== undefined) {
|
|
2116
|
-
var fileName = source.fileName.replace(/^.*[\\\/]/, '');
|
|
2117
|
-
var lineNumber = source.lineNumber;
|
|
2118
|
-
return '\n\nCheck your code at ' + fileName + ':' + lineNumber + '.';
|
|
2119
|
-
}
|
|
916
|
+
(function (module) {
|
|
2120
917
|
|
|
2121
|
-
|
|
2122
|
-
|
|
918
|
+
{
|
|
919
|
+
module.exports = reactJsxRuntime_development;
|
|
2123
920
|
}
|
|
2124
|
-
|
|
2125
|
-
* Warn if there's no key explicitly set on dynamic arrays of children or
|
|
2126
|
-
* object keys are not valid. This allows us to keep track of children between
|
|
2127
|
-
* updates.
|
|
2128
|
-
*/
|
|
921
|
+
} (jsxRuntime));
|
|
2129
922
|
|
|
923
|
+
var classnames = {exports: {}};
|
|
2130
924
|
|
|
2131
|
-
|
|
925
|
+
/*!
|
|
926
|
+
Copyright (c) 2018 Jed Watson.
|
|
927
|
+
Licensed under the MIT License (MIT), see
|
|
928
|
+
http://jedwatson.github.io/classnames
|
|
929
|
+
*/
|
|
2132
930
|
|
|
2133
|
-
|
|
2134
|
-
|
|
2135
|
-
var info = getDeclarationErrorAddendum();
|
|
931
|
+
(function (module) {
|
|
932
|
+
/* global define */
|
|
2136
933
|
|
|
2137
|
-
|
|
2138
|
-
var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name;
|
|
934
|
+
(function () {
|
|
2139
935
|
|
|
2140
|
-
|
|
2141
|
-
info = "\n\nCheck the top-level render call using <" + parentName + ">.";
|
|
2142
|
-
}
|
|
2143
|
-
}
|
|
936
|
+
var hasOwn = {}.hasOwnProperty;
|
|
2144
937
|
|
|
2145
|
-
|
|
2146
|
-
|
|
2147
|
-
}
|
|
2148
|
-
/**
|
|
2149
|
-
* Warn if the element doesn't have an explicit key assigned to it.
|
|
2150
|
-
* This element is in an array. The array could grow and shrink or be
|
|
2151
|
-
* reordered. All children that haven't already been validated are required to
|
|
2152
|
-
* have a "key" property assigned to it. Error statuses are cached so a warning
|
|
2153
|
-
* will only be shown once.
|
|
2154
|
-
*
|
|
2155
|
-
* @internal
|
|
2156
|
-
* @param {ReactElement} element Element that requires a key.
|
|
2157
|
-
* @param {*} parentType element's parent's type.
|
|
2158
|
-
*/
|
|
938
|
+
function classNames() {
|
|
939
|
+
var classes = [];
|
|
2159
940
|
|
|
941
|
+
for (var i = 0; i < arguments.length; i++) {
|
|
942
|
+
var arg = arguments[i];
|
|
943
|
+
if (!arg) continue;
|
|
2160
944
|
|
|
2161
|
-
|
|
2162
|
-
{
|
|
2163
|
-
if (!element._store || element._store.validated || element.key != null) {
|
|
2164
|
-
return;
|
|
2165
|
-
}
|
|
945
|
+
var argType = typeof arg;
|
|
2166
946
|
|
|
2167
|
-
|
|
2168
|
-
|
|
947
|
+
if (argType === 'string' || argType === 'number') {
|
|
948
|
+
classes.push(arg);
|
|
949
|
+
} else if (Array.isArray(arg)) {
|
|
950
|
+
if (arg.length) {
|
|
951
|
+
var inner = classNames.apply(null, arg);
|
|
952
|
+
if (inner) {
|
|
953
|
+
classes.push(inner);
|
|
954
|
+
}
|
|
955
|
+
}
|
|
956
|
+
} else if (argType === 'object') {
|
|
957
|
+
if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
|
|
958
|
+
classes.push(arg.toString());
|
|
959
|
+
continue;
|
|
960
|
+
}
|
|
2169
961
|
|
|
2170
|
-
|
|
2171
|
-
|
|
2172
|
-
|
|
962
|
+
for (var key in arg) {
|
|
963
|
+
if (hasOwn.call(arg, key) && arg[key]) {
|
|
964
|
+
classes.push(key);
|
|
965
|
+
}
|
|
966
|
+
}
|
|
967
|
+
}
|
|
968
|
+
}
|
|
2173
969
|
|
|
2174
|
-
|
|
2175
|
-
|
|
2176
|
-
// assigning it a key.
|
|
970
|
+
return classes.join(' ');
|
|
971
|
+
}
|
|
2177
972
|
|
|
2178
|
-
|
|
973
|
+
if (module.exports) {
|
|
974
|
+
classNames.default = classNames;
|
|
975
|
+
module.exports = classNames;
|
|
976
|
+
} else {
|
|
977
|
+
window.classNames = classNames;
|
|
978
|
+
}
|
|
979
|
+
}());
|
|
980
|
+
} (classnames));
|
|
2179
981
|
|
|
2180
|
-
|
|
2181
|
-
// Give the component that originally created this child.
|
|
2182
|
-
childOwner = " It was passed a child from " + getComponentName(element._owner.type) + ".";
|
|
2183
|
-
}
|
|
982
|
+
var classNames = classnames.exports;
|
|
2184
983
|
|
|
2185
|
-
|
|
984
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
985
|
+
/**
|
|
986
|
+
* This function debounce the received function
|
|
987
|
+
* @param { function } func Function to be debounced
|
|
988
|
+
* @param { number } wait Time to wait before execut the function
|
|
989
|
+
* @param { boolean } immediate Param to define if the function will be executed immediately
|
|
990
|
+
*/
|
|
991
|
+
const debounce = (func, wait, immediate) => {
|
|
992
|
+
let timeout = null;
|
|
993
|
+
return function debounced(...args) {
|
|
994
|
+
const later = () => {
|
|
995
|
+
timeout = null;
|
|
996
|
+
if (!immediate) {
|
|
997
|
+
func.apply(this, args);
|
|
998
|
+
}
|
|
999
|
+
};
|
|
1000
|
+
if (timeout) {
|
|
1001
|
+
clearTimeout(timeout);
|
|
1002
|
+
}
|
|
1003
|
+
timeout = setTimeout(later, wait);
|
|
1004
|
+
};
|
|
1005
|
+
};
|
|
2186
1006
|
|
|
2187
|
-
|
|
1007
|
+
const TooltipContent = ({ content }) => {
|
|
1008
|
+
return jsxRuntime.exports.jsx("span", { dangerouslySetInnerHTML: { __html: content } });
|
|
1009
|
+
};
|
|
2188
1010
|
|
|
2189
|
-
|
|
2190
|
-
|
|
2191
|
-
|
|
2192
|
-
|
|
2193
|
-
|
|
2194
|
-
|
|
2195
|
-
|
|
2196
|
-
|
|
2197
|
-
|
|
2198
|
-
|
|
2199
|
-
|
|
2200
|
-
|
|
1011
|
+
const DEFAULT_TOOLTIP_ID = 'DEFAULT_TOOLTIP_ID';
|
|
1012
|
+
const DEFAULT_CONTEXT_DATA = {
|
|
1013
|
+
anchorRefs: new Set(),
|
|
1014
|
+
activeAnchor: { current: null },
|
|
1015
|
+
attach: () => {
|
|
1016
|
+
/* attach anchor element */
|
|
1017
|
+
},
|
|
1018
|
+
detach: () => {
|
|
1019
|
+
/* detach anchor element */
|
|
1020
|
+
},
|
|
1021
|
+
setActiveAnchor: () => {
|
|
1022
|
+
/* set active anchor */
|
|
1023
|
+
},
|
|
1024
|
+
};
|
|
1025
|
+
const DEFAULT_CONTEXT_DATA_WRAPPER = {
|
|
1026
|
+
getTooltipData: () => DEFAULT_CONTEXT_DATA,
|
|
1027
|
+
};
|
|
1028
|
+
const TooltipContext = createContext(DEFAULT_CONTEXT_DATA_WRAPPER);
|
|
1029
|
+
/**
|
|
1030
|
+
* @deprecated Use the `data-tooltip-id` attribute, or the `anchorSelect` prop instead.
|
|
1031
|
+
* See https://react-tooltip.com/docs/getting-started
|
|
1032
|
+
*/
|
|
1033
|
+
const TooltipProvider = ({ children }) => {
|
|
1034
|
+
const [anchorRefMap, setAnchorRefMap] = useState({
|
|
1035
|
+
[DEFAULT_TOOLTIP_ID]: new Set(),
|
|
1036
|
+
});
|
|
1037
|
+
const [activeAnchorMap, setActiveAnchorMap] = useState({
|
|
1038
|
+
[DEFAULT_TOOLTIP_ID]: { current: null },
|
|
1039
|
+
});
|
|
1040
|
+
const attach = (tooltipId, ...refs) => {
|
|
1041
|
+
setAnchorRefMap((oldMap) => {
|
|
1042
|
+
var _a;
|
|
1043
|
+
const tooltipRefs = (_a = oldMap[tooltipId]) !== null && _a !== void 0 ? _a : new Set();
|
|
1044
|
+
refs.forEach((ref) => tooltipRefs.add(ref));
|
|
1045
|
+
// create new object to trigger re-render
|
|
1046
|
+
return { ...oldMap, [tooltipId]: new Set(tooltipRefs) };
|
|
1047
|
+
});
|
|
1048
|
+
};
|
|
1049
|
+
const detach = (tooltipId, ...refs) => {
|
|
1050
|
+
setAnchorRefMap((oldMap) => {
|
|
1051
|
+
const tooltipRefs = oldMap[tooltipId];
|
|
1052
|
+
if (!tooltipRefs) {
|
|
1053
|
+
// tooltip not found
|
|
1054
|
+
// maybe thow error?
|
|
1055
|
+
return oldMap;
|
|
1056
|
+
}
|
|
1057
|
+
refs.forEach((ref) => tooltipRefs.delete(ref));
|
|
1058
|
+
// create new object to trigger re-render
|
|
1059
|
+
return { ...oldMap };
|
|
1060
|
+
});
|
|
1061
|
+
};
|
|
1062
|
+
const setActiveAnchor = (tooltipId, ref) => {
|
|
1063
|
+
setActiveAnchorMap((oldMap) => {
|
|
1064
|
+
var _a;
|
|
1065
|
+
if (((_a = oldMap[tooltipId]) === null || _a === void 0 ? void 0 : _a.current) === ref.current) {
|
|
1066
|
+
return oldMap;
|
|
1067
|
+
}
|
|
1068
|
+
// create new object to trigger re-render
|
|
1069
|
+
return { ...oldMap, [tooltipId]: ref };
|
|
1070
|
+
});
|
|
1071
|
+
};
|
|
1072
|
+
const getTooltipData = useCallback((tooltipId = DEFAULT_TOOLTIP_ID) => {
|
|
1073
|
+
var _a, _b;
|
|
1074
|
+
return ({
|
|
1075
|
+
anchorRefs: (_a = anchorRefMap[tooltipId]) !== null && _a !== void 0 ? _a : new Set(),
|
|
1076
|
+
activeAnchor: (_b = activeAnchorMap[tooltipId]) !== null && _b !== void 0 ? _b : { current: null },
|
|
1077
|
+
attach: (...refs) => attach(tooltipId, ...refs),
|
|
1078
|
+
detach: (...refs) => detach(tooltipId, ...refs),
|
|
1079
|
+
setActiveAnchor: (ref) => setActiveAnchor(tooltipId, ref),
|
|
1080
|
+
});
|
|
1081
|
+
}, [anchorRefMap, activeAnchorMap, attach, detach]);
|
|
1082
|
+
const context = useMemo(() => {
|
|
1083
|
+
return {
|
|
1084
|
+
getTooltipData,
|
|
1085
|
+
};
|
|
1086
|
+
}, [getTooltipData]);
|
|
1087
|
+
return jsxRuntime.exports.jsx(TooltipContext.Provider, { value: context, children: children });
|
|
1088
|
+
};
|
|
1089
|
+
function useTooltip(tooltipId = DEFAULT_TOOLTIP_ID) {
|
|
1090
|
+
return useContext(TooltipContext).getTooltipData(tooltipId);
|
|
1091
|
+
}
|
|
1092
|
+
|
|
1093
|
+
/**
|
|
1094
|
+
* @deprecated Use the `data-tooltip-id` attribute, or the `anchorSelect` prop instead.
|
|
1095
|
+
* See https://react-tooltip.com/docs/getting-started
|
|
1096
|
+
*/
|
|
1097
|
+
const TooltipWrapper = ({ tooltipId, children, className, place, content, html, variant, offset, wrapper, events, positionStrategy, delayShow, delayHide, }) => {
|
|
1098
|
+
const { attach, detach } = useTooltip(tooltipId);
|
|
1099
|
+
const anchorRef = useRef(null);
|
|
1100
|
+
useEffect(() => {
|
|
1101
|
+
attach(anchorRef);
|
|
1102
|
+
return () => {
|
|
1103
|
+
detach(anchorRef);
|
|
1104
|
+
};
|
|
1105
|
+
}, []);
|
|
1106
|
+
return (jsxRuntime.exports.jsx("span", { ref: anchorRef, className: classNames('react-tooltip-wrapper', className), "data-tooltip-place": place, "data-tooltip-content": content, "data-tooltip-html": html, "data-tooltip-variant": variant, "data-tooltip-offset": offset, "data-tooltip-wrapper": wrapper, "data-tooltip-events": events, "data-tooltip-position-strategy": positionStrategy, "data-tooltip-delay-show": delayShow, "data-tooltip-delay-hide": delayHide, children: children }));
|
|
1107
|
+
};
|
|
2201
1108
|
|
|
1109
|
+
const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? useLayoutEffect : useEffect;
|
|
2202
1110
|
|
|
2203
|
-
|
|
2204
|
-
|
|
2205
|
-
|
|
2206
|
-
return;
|
|
2207
|
-
}
|
|
1111
|
+
function getAlignment(placement) {
|
|
1112
|
+
return placement.split('-')[1];
|
|
1113
|
+
}
|
|
2208
1114
|
|
|
2209
|
-
|
|
2210
|
-
|
|
2211
|
-
|
|
1115
|
+
function getLengthFromAxis(axis) {
|
|
1116
|
+
return axis === 'y' ? 'height' : 'width';
|
|
1117
|
+
}
|
|
2212
1118
|
|
|
2213
|
-
|
|
2214
|
-
|
|
2215
|
-
|
|
2216
|
-
}
|
|
2217
|
-
} else if (isValidElement(node)) {
|
|
2218
|
-
// This element was passed in a valid location.
|
|
2219
|
-
if (node._store) {
|
|
2220
|
-
node._store.validated = true;
|
|
2221
|
-
}
|
|
2222
|
-
} else if (node) {
|
|
2223
|
-
var iteratorFn = getIteratorFn(node);
|
|
1119
|
+
function getSide(placement) {
|
|
1120
|
+
return placement.split('-')[0];
|
|
1121
|
+
}
|
|
2224
1122
|
|
|
2225
|
-
|
|
2226
|
-
|
|
2227
|
-
|
|
2228
|
-
if (iteratorFn !== node.entries) {
|
|
2229
|
-
var iterator = iteratorFn.call(node);
|
|
2230
|
-
var step;
|
|
1123
|
+
function getMainAxisFromPlacement(placement) {
|
|
1124
|
+
return ['top', 'bottom'].includes(getSide(placement)) ? 'x' : 'y';
|
|
1125
|
+
}
|
|
2231
1126
|
|
|
2232
|
-
|
|
2233
|
-
|
|
2234
|
-
|
|
2235
|
-
|
|
2236
|
-
|
|
2237
|
-
|
|
2238
|
-
|
|
2239
|
-
|
|
2240
|
-
|
|
2241
|
-
|
|
2242
|
-
|
|
2243
|
-
|
|
2244
|
-
|
|
2245
|
-
|
|
2246
|
-
|
|
2247
|
-
|
|
1127
|
+
function computeCoordsFromPlacement(_ref, placement, rtl) {
|
|
1128
|
+
let {
|
|
1129
|
+
reference,
|
|
1130
|
+
floating
|
|
1131
|
+
} = _ref;
|
|
1132
|
+
const commonX = reference.x + reference.width / 2 - floating.width / 2;
|
|
1133
|
+
const commonY = reference.y + reference.height / 2 - floating.height / 2;
|
|
1134
|
+
const mainAxis = getMainAxisFromPlacement(placement);
|
|
1135
|
+
const length = getLengthFromAxis(mainAxis);
|
|
1136
|
+
const commonAlign = reference[length] / 2 - floating[length] / 2;
|
|
1137
|
+
const side = getSide(placement);
|
|
1138
|
+
const isVertical = mainAxis === 'x';
|
|
1139
|
+
let coords;
|
|
1140
|
+
switch (side) {
|
|
1141
|
+
case 'top':
|
|
1142
|
+
coords = {
|
|
1143
|
+
x: commonX,
|
|
1144
|
+
y: reference.y - floating.height
|
|
1145
|
+
};
|
|
1146
|
+
break;
|
|
1147
|
+
case 'bottom':
|
|
1148
|
+
coords = {
|
|
1149
|
+
x: commonX,
|
|
1150
|
+
y: reference.y + reference.height
|
|
1151
|
+
};
|
|
1152
|
+
break;
|
|
1153
|
+
case 'right':
|
|
1154
|
+
coords = {
|
|
1155
|
+
x: reference.x + reference.width,
|
|
1156
|
+
y: commonY
|
|
1157
|
+
};
|
|
1158
|
+
break;
|
|
1159
|
+
case 'left':
|
|
1160
|
+
coords = {
|
|
1161
|
+
x: reference.x - floating.width,
|
|
1162
|
+
y: commonY
|
|
1163
|
+
};
|
|
1164
|
+
break;
|
|
1165
|
+
default:
|
|
1166
|
+
coords = {
|
|
1167
|
+
x: reference.x,
|
|
1168
|
+
y: reference.y
|
|
1169
|
+
};
|
|
1170
|
+
}
|
|
1171
|
+
switch (getAlignment(placement)) {
|
|
1172
|
+
case 'start':
|
|
1173
|
+
coords[mainAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
|
|
1174
|
+
break;
|
|
1175
|
+
case 'end':
|
|
1176
|
+
coords[mainAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
|
|
1177
|
+
break;
|
|
1178
|
+
}
|
|
1179
|
+
return coords;
|
|
1180
|
+
}
|
|
2248
1181
|
|
|
1182
|
+
/**
|
|
1183
|
+
* Computes the `x` and `y` coordinates that will place the floating element
|
|
1184
|
+
* next to a reference element when it is given a certain positioning strategy.
|
|
1185
|
+
*
|
|
1186
|
+
* This export does not have any `platform` interface logic. You will need to
|
|
1187
|
+
* write one for the platform you are using Floating UI with.
|
|
1188
|
+
*/
|
|
1189
|
+
const computePosition$1 = async (reference, floating, config) => {
|
|
1190
|
+
const {
|
|
1191
|
+
placement = 'bottom',
|
|
1192
|
+
strategy = 'absolute',
|
|
1193
|
+
middleware = [],
|
|
1194
|
+
platform
|
|
1195
|
+
} = config;
|
|
1196
|
+
const validMiddleware = middleware.filter(Boolean);
|
|
1197
|
+
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
|
|
1198
|
+
{
|
|
1199
|
+
if (platform == null) {
|
|
1200
|
+
console.error(['Floating UI: `platform` property was not passed to config. If you', 'want to use Floating UI on the web, install @floating-ui/dom', 'instead of the /core package. Otherwise, you can create your own', '`platform`: https://floating-ui.com/docs/platform'].join(' '));
|
|
1201
|
+
}
|
|
1202
|
+
if (validMiddleware.filter(_ref => {
|
|
1203
|
+
let {
|
|
1204
|
+
name
|
|
1205
|
+
} = _ref;
|
|
1206
|
+
return name === 'autoPlacement' || name === 'flip';
|
|
1207
|
+
}).length > 1) {
|
|
1208
|
+
throw new Error(['Floating UI: duplicate `flip` and/or `autoPlacement` middleware', 'detected. This will lead to an infinite loop. Ensure only one of', 'either has been passed to the `middleware` array.'].join(' '));
|
|
1209
|
+
}
|
|
1210
|
+
if (!reference || !floating) {
|
|
1211
|
+
console.error(['Floating UI: The reference and/or floating element was not defined', 'when `computePosition()` was called. Ensure that both elements have', 'been created and can be measured.'].join(' '));
|
|
1212
|
+
}
|
|
1213
|
+
}
|
|
1214
|
+
let rects = await platform.getElementRects({
|
|
1215
|
+
reference,
|
|
1216
|
+
floating,
|
|
1217
|
+
strategy
|
|
1218
|
+
});
|
|
1219
|
+
let {
|
|
1220
|
+
x,
|
|
1221
|
+
y
|
|
1222
|
+
} = computeCoordsFromPlacement(rects, placement, rtl);
|
|
1223
|
+
let statefulPlacement = placement;
|
|
1224
|
+
let middlewareData = {};
|
|
1225
|
+
let resetCount = 0;
|
|
1226
|
+
for (let i = 0; i < validMiddleware.length; i++) {
|
|
1227
|
+
const {
|
|
1228
|
+
name,
|
|
1229
|
+
fn
|
|
1230
|
+
} = validMiddleware[i];
|
|
1231
|
+
const {
|
|
1232
|
+
x: nextX,
|
|
1233
|
+
y: nextY,
|
|
1234
|
+
data,
|
|
1235
|
+
reset
|
|
1236
|
+
} = await fn({
|
|
1237
|
+
x,
|
|
1238
|
+
y,
|
|
1239
|
+
initialPlacement: placement,
|
|
1240
|
+
placement: statefulPlacement,
|
|
1241
|
+
strategy,
|
|
1242
|
+
middlewareData,
|
|
1243
|
+
rects,
|
|
1244
|
+
platform,
|
|
1245
|
+
elements: {
|
|
1246
|
+
reference,
|
|
1247
|
+
floating
|
|
1248
|
+
}
|
|
1249
|
+
});
|
|
1250
|
+
x = nextX != null ? nextX : x;
|
|
1251
|
+
y = nextY != null ? nextY : y;
|
|
1252
|
+
middlewareData = {
|
|
1253
|
+
...middlewareData,
|
|
1254
|
+
[name]: {
|
|
1255
|
+
...middlewareData[name],
|
|
1256
|
+
...data
|
|
1257
|
+
}
|
|
1258
|
+
};
|
|
1259
|
+
{
|
|
1260
|
+
if (resetCount > 50) {
|
|
1261
|
+
console.warn(['Floating UI: The middleware lifecycle appears to be running in an', 'infinite loop. This is usually caused by a `reset` continually', 'being returned without a break condition.'].join(' '));
|
|
1262
|
+
}
|
|
1263
|
+
}
|
|
1264
|
+
if (reset && resetCount <= 50) {
|
|
1265
|
+
resetCount++;
|
|
1266
|
+
if (typeof reset === 'object') {
|
|
1267
|
+
if (reset.placement) {
|
|
1268
|
+
statefulPlacement = reset.placement;
|
|
1269
|
+
}
|
|
1270
|
+
if (reset.rects) {
|
|
1271
|
+
rects = reset.rects === true ? await platform.getElementRects({
|
|
1272
|
+
reference,
|
|
1273
|
+
floating,
|
|
1274
|
+
strategy
|
|
1275
|
+
}) : reset.rects;
|
|
1276
|
+
}
|
|
1277
|
+
({
|
|
1278
|
+
x,
|
|
1279
|
+
y
|
|
1280
|
+
} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
|
|
1281
|
+
}
|
|
1282
|
+
i = -1;
|
|
1283
|
+
continue;
|
|
1284
|
+
}
|
|
1285
|
+
}
|
|
1286
|
+
return {
|
|
1287
|
+
x,
|
|
1288
|
+
y,
|
|
1289
|
+
placement: statefulPlacement,
|
|
1290
|
+
strategy,
|
|
1291
|
+
middlewareData
|
|
1292
|
+
};
|
|
1293
|
+
};
|
|
2249
1294
|
|
|
2250
|
-
|
|
2251
|
-
|
|
2252
|
-
|
|
1295
|
+
function expandPaddingObject(padding) {
|
|
1296
|
+
return {
|
|
1297
|
+
top: 0,
|
|
1298
|
+
right: 0,
|
|
1299
|
+
bottom: 0,
|
|
1300
|
+
left: 0,
|
|
1301
|
+
...padding
|
|
1302
|
+
};
|
|
1303
|
+
}
|
|
2253
1304
|
|
|
2254
|
-
|
|
2255
|
-
|
|
2256
|
-
|
|
1305
|
+
function getSideObjectFromPadding(padding) {
|
|
1306
|
+
return typeof padding !== 'number' ? expandPaddingObject(padding) : {
|
|
1307
|
+
top: padding,
|
|
1308
|
+
right: padding,
|
|
1309
|
+
bottom: padding,
|
|
1310
|
+
left: padding
|
|
1311
|
+
};
|
|
1312
|
+
}
|
|
2257
1313
|
|
|
2258
|
-
|
|
1314
|
+
function rectToClientRect(rect) {
|
|
1315
|
+
return {
|
|
1316
|
+
...rect,
|
|
1317
|
+
top: rect.y,
|
|
1318
|
+
left: rect.x,
|
|
1319
|
+
right: rect.x + rect.width,
|
|
1320
|
+
bottom: rect.y + rect.height
|
|
1321
|
+
};
|
|
1322
|
+
}
|
|
2259
1323
|
|
|
2260
|
-
|
|
2261
|
-
|
|
2262
|
-
|
|
2263
|
-
|
|
2264
|
-
|
|
2265
|
-
|
|
2266
|
-
|
|
2267
|
-
|
|
2268
|
-
|
|
1324
|
+
/**
|
|
1325
|
+
* Resolves with an object of overflow side offsets that determine how much the
|
|
1326
|
+
* element is overflowing a given clipping boundary.
|
|
1327
|
+
* - positive = overflowing the boundary by that number of pixels
|
|
1328
|
+
* - negative = how many pixels left before it will overflow
|
|
1329
|
+
* - 0 = lies flush with the boundary
|
|
1330
|
+
* @see https://floating-ui.com/docs/detectOverflow
|
|
1331
|
+
*/
|
|
1332
|
+
async function detectOverflow(middlewareArguments, options) {
|
|
1333
|
+
var _await$platform$isEle;
|
|
1334
|
+
if (options === void 0) {
|
|
1335
|
+
options = {};
|
|
1336
|
+
}
|
|
1337
|
+
const {
|
|
1338
|
+
x,
|
|
1339
|
+
y,
|
|
1340
|
+
platform,
|
|
1341
|
+
rects,
|
|
1342
|
+
elements,
|
|
1343
|
+
strategy
|
|
1344
|
+
} = middlewareArguments;
|
|
1345
|
+
const {
|
|
1346
|
+
boundary = 'clippingAncestors',
|
|
1347
|
+
rootBoundary = 'viewport',
|
|
1348
|
+
elementContext = 'floating',
|
|
1349
|
+
altBoundary = false,
|
|
1350
|
+
padding = 0
|
|
1351
|
+
} = options;
|
|
1352
|
+
const paddingObject = getSideObjectFromPadding(padding);
|
|
1353
|
+
const altContext = elementContext === 'floating' ? 'reference' : 'floating';
|
|
1354
|
+
const element = elements[altBoundary ? altContext : elementContext];
|
|
1355
|
+
const clippingClientRect = rectToClientRect(await platform.getClippingRect({
|
|
1356
|
+
element: ((_await$platform$isEle = await (platform.isElement == null ? void 0 : platform.isElement(element))) != null ? _await$platform$isEle : true) ? element : element.contextElement || (await (platform.getDocumentElement == null ? void 0 : platform.getDocumentElement(elements.floating))),
|
|
1357
|
+
boundary,
|
|
1358
|
+
rootBoundary,
|
|
1359
|
+
strategy
|
|
1360
|
+
}));
|
|
1361
|
+
const rect = elementContext === 'floating' ? {
|
|
1362
|
+
...rects.floating,
|
|
1363
|
+
x,
|
|
1364
|
+
y
|
|
1365
|
+
} : rects.reference;
|
|
1366
|
+
const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
|
|
1367
|
+
const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
|
|
1368
|
+
x: 1,
|
|
1369
|
+
y: 1
|
|
1370
|
+
} : {
|
|
1371
|
+
x: 1,
|
|
1372
|
+
y: 1
|
|
1373
|
+
};
|
|
1374
|
+
const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
1375
|
+
rect,
|
|
1376
|
+
offsetParent,
|
|
1377
|
+
strategy
|
|
1378
|
+
}) : rect);
|
|
1379
|
+
return {
|
|
1380
|
+
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
1381
|
+
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
1382
|
+
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
1383
|
+
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
1384
|
+
};
|
|
1385
|
+
}
|
|
2269
1386
|
|
|
2270
|
-
|
|
2271
|
-
|
|
2272
|
-
var name = getComponentName(type);
|
|
2273
|
-
checkPropTypes(propTypes, element.props, 'prop', name, element);
|
|
2274
|
-
} else if (type.PropTypes !== undefined && !propTypesMisspellWarningShown) {
|
|
2275
|
-
propTypesMisspellWarningShown = true; // Intentionally inside to avoid triggering lazy initializers:
|
|
1387
|
+
const min$1 = Math.min;
|
|
1388
|
+
const max$1 = Math.max;
|
|
2276
1389
|
|
|
2277
|
-
|
|
1390
|
+
function within(min$1$1, value, max$1$1) {
|
|
1391
|
+
return max$1(min$1$1, min$1(value, max$1$1));
|
|
1392
|
+
}
|
|
2278
1393
|
|
|
2279
|
-
|
|
2280
|
-
|
|
1394
|
+
/**
|
|
1395
|
+
* Positions an inner element of the floating element such that it is centered
|
|
1396
|
+
* to the reference element.
|
|
1397
|
+
* @see https://floating-ui.com/docs/arrow
|
|
1398
|
+
*/
|
|
1399
|
+
const arrow = options => ({
|
|
1400
|
+
name: 'arrow',
|
|
1401
|
+
options,
|
|
1402
|
+
async fn(middlewareArguments) {
|
|
1403
|
+
// Since `element` is required, we don't Partial<> the type.
|
|
1404
|
+
const {
|
|
1405
|
+
element,
|
|
1406
|
+
padding = 0
|
|
1407
|
+
} = options || {};
|
|
1408
|
+
const {
|
|
1409
|
+
x,
|
|
1410
|
+
y,
|
|
1411
|
+
placement,
|
|
1412
|
+
rects,
|
|
1413
|
+
platform
|
|
1414
|
+
} = middlewareArguments;
|
|
1415
|
+
if (element == null) {
|
|
1416
|
+
{
|
|
1417
|
+
console.warn('Floating UI: No `element` was passed to the `arrow` middleware.');
|
|
1418
|
+
}
|
|
1419
|
+
return {};
|
|
1420
|
+
}
|
|
1421
|
+
const paddingObject = getSideObjectFromPadding(padding);
|
|
1422
|
+
const coords = {
|
|
1423
|
+
x,
|
|
1424
|
+
y
|
|
1425
|
+
};
|
|
1426
|
+
const axis = getMainAxisFromPlacement(placement);
|
|
1427
|
+
const length = getLengthFromAxis(axis);
|
|
1428
|
+
const arrowDimensions = await platform.getDimensions(element);
|
|
1429
|
+
const minProp = axis === 'y' ? 'top' : 'left';
|
|
1430
|
+
const maxProp = axis === 'y' ? 'bottom' : 'right';
|
|
1431
|
+
const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
|
|
1432
|
+
const startDiff = coords[axis] - rects.reference[axis];
|
|
1433
|
+
const arrowOffsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(element));
|
|
1434
|
+
let clientSize = arrowOffsetParent ? axis === 'y' ? arrowOffsetParent.clientHeight || 0 : arrowOffsetParent.clientWidth || 0 : 0;
|
|
1435
|
+
if (clientSize === 0) {
|
|
1436
|
+
clientSize = rects.floating[length];
|
|
1437
|
+
}
|
|
1438
|
+
const centerToReference = endDiff / 2 - startDiff / 2;
|
|
2281
1439
|
|
|
2282
|
-
|
|
2283
|
-
|
|
2284
|
-
|
|
2285
|
-
|
|
2286
|
-
|
|
2287
|
-
|
|
2288
|
-
* Given a fragment, validate that it can only be provided with fragment props
|
|
2289
|
-
* @param {ReactElement} fragment
|
|
2290
|
-
*/
|
|
1440
|
+
// Make sure the arrow doesn't overflow the floating element if the center
|
|
1441
|
+
// point is outside the floating element's bounds.
|
|
1442
|
+
const min = paddingObject[minProp];
|
|
1443
|
+
const max = clientSize - arrowDimensions[length] - paddingObject[maxProp];
|
|
1444
|
+
const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
|
|
1445
|
+
const offset = within(min, center, max);
|
|
2291
1446
|
|
|
1447
|
+
// If the reference is small enough that the arrow's padding causes it to
|
|
1448
|
+
// to point to nothing for an aligned placement, adjust the offset of the
|
|
1449
|
+
// floating element itself. This stops `shift()` from taking action, but can
|
|
1450
|
+
// be worked around by calling it again after the `arrow()` if desired.
|
|
1451
|
+
const shouldAddOffset = getAlignment(placement) != null && center != offset && rects.reference[length] / 2 - (center < min ? paddingObject[minProp] : paddingObject[maxProp]) - arrowDimensions[length] / 2 < 0;
|
|
1452
|
+
const alignmentOffset = shouldAddOffset ? center < min ? min - center : max - center : 0;
|
|
1453
|
+
return {
|
|
1454
|
+
[axis]: coords[axis] - alignmentOffset,
|
|
1455
|
+
data: {
|
|
1456
|
+
[axis]: offset,
|
|
1457
|
+
centerOffset: center - offset
|
|
1458
|
+
}
|
|
1459
|
+
};
|
|
1460
|
+
}
|
|
1461
|
+
});
|
|
2292
1462
|
|
|
2293
|
-
|
|
2294
|
-
|
|
2295
|
-
|
|
1463
|
+
const oppositeSideMap = {
|
|
1464
|
+
left: 'right',
|
|
1465
|
+
right: 'left',
|
|
1466
|
+
bottom: 'top',
|
|
1467
|
+
top: 'bottom'
|
|
1468
|
+
};
|
|
1469
|
+
function getOppositePlacement(placement) {
|
|
1470
|
+
return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
|
|
1471
|
+
}
|
|
2296
1472
|
|
|
2297
|
-
|
|
2298
|
-
|
|
1473
|
+
function getAlignmentSides(placement, rects, rtl) {
|
|
1474
|
+
if (rtl === void 0) {
|
|
1475
|
+
rtl = false;
|
|
1476
|
+
}
|
|
1477
|
+
const alignment = getAlignment(placement);
|
|
1478
|
+
const mainAxis = getMainAxisFromPlacement(placement);
|
|
1479
|
+
const length = getLengthFromAxis(mainAxis);
|
|
1480
|
+
let mainAlignmentSide = mainAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
|
|
1481
|
+
if (rects.reference[length] > rects.floating[length]) {
|
|
1482
|
+
mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
|
|
1483
|
+
}
|
|
1484
|
+
return {
|
|
1485
|
+
main: mainAlignmentSide,
|
|
1486
|
+
cross: getOppositePlacement(mainAlignmentSide)
|
|
1487
|
+
};
|
|
1488
|
+
}
|
|
2299
1489
|
|
|
2300
|
-
|
|
2301
|
-
|
|
1490
|
+
const oppositeAlignmentMap = {
|
|
1491
|
+
start: 'end',
|
|
1492
|
+
end: 'start'
|
|
1493
|
+
};
|
|
1494
|
+
function getOppositeAlignmentPlacement(placement) {
|
|
1495
|
+
return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
|
|
1496
|
+
}
|
|
2302
1497
|
|
|
2303
|
-
|
|
1498
|
+
function getExpandedPlacements(placement) {
|
|
1499
|
+
const oppositePlacement = getOppositePlacement(placement);
|
|
1500
|
+
return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
|
|
1501
|
+
}
|
|
2304
1502
|
|
|
2305
|
-
|
|
2306
|
-
|
|
2307
|
-
|
|
2308
|
-
|
|
1503
|
+
function getSideList(side, isStart, rtl) {
|
|
1504
|
+
const lr = ['left', 'right'];
|
|
1505
|
+
const rl = ['right', 'left'];
|
|
1506
|
+
const tb = ['top', 'bottom'];
|
|
1507
|
+
const bt = ['bottom', 'top'];
|
|
1508
|
+
switch (side) {
|
|
1509
|
+
case 'top':
|
|
1510
|
+
case 'bottom':
|
|
1511
|
+
if (rtl) return isStart ? rl : lr;
|
|
1512
|
+
return isStart ? lr : rl;
|
|
1513
|
+
case 'left':
|
|
1514
|
+
case 'right':
|
|
1515
|
+
return isStart ? tb : bt;
|
|
1516
|
+
default:
|
|
1517
|
+
return [];
|
|
1518
|
+
}
|
|
1519
|
+
}
|
|
1520
|
+
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
|
|
1521
|
+
const alignment = getAlignment(placement);
|
|
1522
|
+
let list = getSideList(getSide(placement), direction === 'start', rtl);
|
|
1523
|
+
if (alignment) {
|
|
1524
|
+
list = list.map(side => side + "-" + alignment);
|
|
1525
|
+
if (flipAlignment) {
|
|
1526
|
+
list = list.concat(list.map(getOppositeAlignmentPlacement));
|
|
1527
|
+
}
|
|
1528
|
+
}
|
|
1529
|
+
return list;
|
|
1530
|
+
}
|
|
2309
1531
|
|
|
2310
|
-
|
|
2311
|
-
|
|
1532
|
+
/**
|
|
1533
|
+
* Changes the placement of the floating element to one that will fit if the
|
|
1534
|
+
* initially specified `placement` does not.
|
|
1535
|
+
* @see https://floating-ui.com/docs/flip
|
|
1536
|
+
*/
|
|
1537
|
+
const flip = function (options) {
|
|
1538
|
+
if (options === void 0) {
|
|
1539
|
+
options = {};
|
|
1540
|
+
}
|
|
1541
|
+
return {
|
|
1542
|
+
name: 'flip',
|
|
1543
|
+
options,
|
|
1544
|
+
async fn(middlewareArguments) {
|
|
1545
|
+
var _middlewareData$flip;
|
|
1546
|
+
const {
|
|
1547
|
+
placement,
|
|
1548
|
+
middlewareData,
|
|
1549
|
+
rects,
|
|
1550
|
+
initialPlacement,
|
|
1551
|
+
platform,
|
|
1552
|
+
elements
|
|
1553
|
+
} = middlewareArguments;
|
|
1554
|
+
const {
|
|
1555
|
+
mainAxis: checkMainAxis = true,
|
|
1556
|
+
crossAxis: checkCrossAxis = true,
|
|
1557
|
+
fallbackPlacements: specifiedFallbackPlacements,
|
|
1558
|
+
fallbackStrategy = 'bestFit',
|
|
1559
|
+
fallbackAxisSideDirection = 'none',
|
|
1560
|
+
flipAlignment = true,
|
|
1561
|
+
...detectOverflowOptions
|
|
1562
|
+
} = options;
|
|
1563
|
+
const side = getSide(placement);
|
|
1564
|
+
const isBasePlacement = getSide(initialPlacement) === initialPlacement;
|
|
1565
|
+
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
|
|
1566
|
+
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
|
|
1567
|
+
if (!specifiedFallbackPlacements && fallbackAxisSideDirection !== 'none') {
|
|
1568
|
+
fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
|
|
1569
|
+
}
|
|
1570
|
+
const placements = [initialPlacement, ...fallbackPlacements];
|
|
1571
|
+
const overflow = await detectOverflow(middlewareArguments, detectOverflowOptions);
|
|
1572
|
+
const overflows = [];
|
|
1573
|
+
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
|
|
1574
|
+
if (checkMainAxis) {
|
|
1575
|
+
overflows.push(overflow[side]);
|
|
1576
|
+
}
|
|
1577
|
+
if (checkCrossAxis) {
|
|
1578
|
+
const {
|
|
1579
|
+
main,
|
|
1580
|
+
cross
|
|
1581
|
+
} = getAlignmentSides(placement, rects, rtl);
|
|
1582
|
+
overflows.push(overflow[main], overflow[cross]);
|
|
1583
|
+
}
|
|
1584
|
+
overflowsData = [...overflowsData, {
|
|
1585
|
+
placement,
|
|
1586
|
+
overflows
|
|
1587
|
+
}];
|
|
2312
1588
|
|
|
2313
|
-
|
|
1589
|
+
// One or more sides is overflowing.
|
|
1590
|
+
if (!overflows.every(side => side <= 0)) {
|
|
1591
|
+
var _middlewareData$flip2, _overflowsData$find;
|
|
1592
|
+
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
|
|
1593
|
+
const nextPlacement = placements[nextIndex];
|
|
1594
|
+
if (nextPlacement) {
|
|
1595
|
+
// Try next placement and re-run the lifecycle.
|
|
1596
|
+
return {
|
|
1597
|
+
data: {
|
|
1598
|
+
index: nextIndex,
|
|
1599
|
+
overflows: overflowsData
|
|
1600
|
+
},
|
|
1601
|
+
reset: {
|
|
1602
|
+
placement: nextPlacement
|
|
1603
|
+
}
|
|
1604
|
+
};
|
|
1605
|
+
}
|
|
2314
1606
|
|
|
2315
|
-
|
|
2316
|
-
|
|
2317
|
-
}
|
|
2318
|
-
}
|
|
1607
|
+
// First, try to use the one that fits on mainAxis side of overflow.
|
|
1608
|
+
let resetPlacement = (_overflowsData$find = overflowsData.find(d => d.overflows[0] <= 0)) == null ? void 0 : _overflowsData$find.placement;
|
|
2319
1609
|
|
|
2320
|
-
|
|
2321
|
-
|
|
2322
|
-
|
|
2323
|
-
|
|
1610
|
+
// Otherwise fallback.
|
|
1611
|
+
if (!resetPlacement) {
|
|
1612
|
+
switch (fallbackStrategy) {
|
|
1613
|
+
case 'bestFit':
|
|
1614
|
+
{
|
|
1615
|
+
var _overflowsData$map$so;
|
|
1616
|
+
const placement = (_overflowsData$map$so = overflowsData.map(d => [d.placement, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$map$so[0];
|
|
1617
|
+
if (placement) {
|
|
1618
|
+
resetPlacement = placement;
|
|
1619
|
+
}
|
|
1620
|
+
break;
|
|
1621
|
+
}
|
|
1622
|
+
case 'initialPlacement':
|
|
1623
|
+
resetPlacement = initialPlacement;
|
|
1624
|
+
break;
|
|
1625
|
+
}
|
|
1626
|
+
}
|
|
1627
|
+
if (placement !== resetPlacement) {
|
|
1628
|
+
return {
|
|
1629
|
+
reset: {
|
|
1630
|
+
placement: resetPlacement
|
|
1631
|
+
}
|
|
1632
|
+
};
|
|
1633
|
+
}
|
|
1634
|
+
}
|
|
1635
|
+
return {};
|
|
1636
|
+
}
|
|
1637
|
+
};
|
|
1638
|
+
};
|
|
2324
1639
|
|
|
2325
|
-
|
|
2326
|
-
|
|
1640
|
+
async function convertValueToCoords(middlewareArguments, value) {
|
|
1641
|
+
const {
|
|
1642
|
+
placement,
|
|
1643
|
+
platform,
|
|
1644
|
+
elements
|
|
1645
|
+
} = middlewareArguments;
|
|
1646
|
+
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
|
|
1647
|
+
const side = getSide(placement);
|
|
1648
|
+
const alignment = getAlignment(placement);
|
|
1649
|
+
const isVertical = getMainAxisFromPlacement(placement) === 'x';
|
|
1650
|
+
const mainAxisMulti = ['left', 'top'].includes(side) ? -1 : 1;
|
|
1651
|
+
const crossAxisMulti = rtl && isVertical ? -1 : 1;
|
|
1652
|
+
const rawValue = typeof value === 'function' ? value(middlewareArguments) : value;
|
|
2327
1653
|
|
|
2328
|
-
|
|
2329
|
-
|
|
2330
|
-
|
|
1654
|
+
// eslint-disable-next-line prefer-const
|
|
1655
|
+
let {
|
|
1656
|
+
mainAxis,
|
|
1657
|
+
crossAxis,
|
|
1658
|
+
alignmentAxis
|
|
1659
|
+
} = typeof rawValue === 'number' ? {
|
|
1660
|
+
mainAxis: rawValue,
|
|
1661
|
+
crossAxis: 0,
|
|
1662
|
+
alignmentAxis: null
|
|
1663
|
+
} : {
|
|
1664
|
+
mainAxis: 0,
|
|
1665
|
+
crossAxis: 0,
|
|
1666
|
+
alignmentAxis: null,
|
|
1667
|
+
...rawValue
|
|
1668
|
+
};
|
|
1669
|
+
if (alignment && typeof alignmentAxis === 'number') {
|
|
1670
|
+
crossAxis = alignment === 'end' ? alignmentAxis * -1 : alignmentAxis;
|
|
1671
|
+
}
|
|
1672
|
+
return isVertical ? {
|
|
1673
|
+
x: crossAxis * crossAxisMulti,
|
|
1674
|
+
y: mainAxis * mainAxisMulti
|
|
1675
|
+
} : {
|
|
1676
|
+
x: mainAxis * mainAxisMulti,
|
|
1677
|
+
y: crossAxis * crossAxisMulti
|
|
1678
|
+
};
|
|
1679
|
+
}
|
|
2331
1680
|
|
|
2332
|
-
|
|
1681
|
+
/**
|
|
1682
|
+
* Displaces the floating element from its reference element.
|
|
1683
|
+
* @see https://floating-ui.com/docs/offset
|
|
1684
|
+
*/
|
|
1685
|
+
const offset = function (value) {
|
|
1686
|
+
if (value === void 0) {
|
|
1687
|
+
value = 0;
|
|
1688
|
+
}
|
|
1689
|
+
return {
|
|
1690
|
+
name: 'offset',
|
|
1691
|
+
options: value,
|
|
1692
|
+
async fn(middlewareArguments) {
|
|
1693
|
+
const {
|
|
1694
|
+
x,
|
|
1695
|
+
y
|
|
1696
|
+
} = middlewareArguments;
|
|
1697
|
+
const diffCoords = await convertValueToCoords(middlewareArguments, value);
|
|
1698
|
+
return {
|
|
1699
|
+
x: x + diffCoords.x,
|
|
1700
|
+
y: y + diffCoords.y,
|
|
1701
|
+
data: diffCoords
|
|
1702
|
+
};
|
|
1703
|
+
}
|
|
1704
|
+
};
|
|
1705
|
+
};
|
|
2333
1706
|
|
|
2334
|
-
|
|
2335
|
-
|
|
2336
|
-
|
|
2337
|
-
info += getDeclarationErrorAddendum();
|
|
2338
|
-
}
|
|
1707
|
+
function getCrossAxis(axis) {
|
|
1708
|
+
return axis === 'x' ? 'y' : 'x';
|
|
1709
|
+
}
|
|
2339
1710
|
|
|
2340
|
-
|
|
1711
|
+
/**
|
|
1712
|
+
* Shifts the floating element in order to keep it in view when it will overflow
|
|
1713
|
+
* a clipping boundary.
|
|
1714
|
+
* @see https://floating-ui.com/docs/shift
|
|
1715
|
+
*/
|
|
1716
|
+
const shift = function (options) {
|
|
1717
|
+
if (options === void 0) {
|
|
1718
|
+
options = {};
|
|
1719
|
+
}
|
|
1720
|
+
return {
|
|
1721
|
+
name: 'shift',
|
|
1722
|
+
options,
|
|
1723
|
+
async fn(middlewareArguments) {
|
|
1724
|
+
const {
|
|
1725
|
+
x,
|
|
1726
|
+
y,
|
|
1727
|
+
placement
|
|
1728
|
+
} = middlewareArguments;
|
|
1729
|
+
const {
|
|
1730
|
+
mainAxis: checkMainAxis = true,
|
|
1731
|
+
crossAxis: checkCrossAxis = false,
|
|
1732
|
+
limiter = {
|
|
1733
|
+
fn: _ref => {
|
|
1734
|
+
let {
|
|
1735
|
+
x,
|
|
1736
|
+
y
|
|
1737
|
+
} = _ref;
|
|
1738
|
+
return {
|
|
1739
|
+
x,
|
|
1740
|
+
y
|
|
1741
|
+
};
|
|
1742
|
+
}
|
|
1743
|
+
},
|
|
1744
|
+
...detectOverflowOptions
|
|
1745
|
+
} = options;
|
|
1746
|
+
const coords = {
|
|
1747
|
+
x,
|
|
1748
|
+
y
|
|
1749
|
+
};
|
|
1750
|
+
const overflow = await detectOverflow(middlewareArguments, detectOverflowOptions);
|
|
1751
|
+
const mainAxis = getMainAxisFromPlacement(getSide(placement));
|
|
1752
|
+
const crossAxis = getCrossAxis(mainAxis);
|
|
1753
|
+
let mainAxisCoord = coords[mainAxis];
|
|
1754
|
+
let crossAxisCoord = coords[crossAxis];
|
|
1755
|
+
if (checkMainAxis) {
|
|
1756
|
+
const minSide = mainAxis === 'y' ? 'top' : 'left';
|
|
1757
|
+
const maxSide = mainAxis === 'y' ? 'bottom' : 'right';
|
|
1758
|
+
const min = mainAxisCoord + overflow[minSide];
|
|
1759
|
+
const max = mainAxisCoord - overflow[maxSide];
|
|
1760
|
+
mainAxisCoord = within(min, mainAxisCoord, max);
|
|
1761
|
+
}
|
|
1762
|
+
if (checkCrossAxis) {
|
|
1763
|
+
const minSide = crossAxis === 'y' ? 'top' : 'left';
|
|
1764
|
+
const maxSide = crossAxis === 'y' ? 'bottom' : 'right';
|
|
1765
|
+
const min = crossAxisCoord + overflow[minSide];
|
|
1766
|
+
const max = crossAxisCoord - overflow[maxSide];
|
|
1767
|
+
crossAxisCoord = within(min, crossAxisCoord, max);
|
|
1768
|
+
}
|
|
1769
|
+
const limitedCoords = limiter.fn({
|
|
1770
|
+
...middlewareArguments,
|
|
1771
|
+
[mainAxis]: mainAxisCoord,
|
|
1772
|
+
[crossAxis]: crossAxisCoord
|
|
1773
|
+
});
|
|
1774
|
+
return {
|
|
1775
|
+
...limitedCoords,
|
|
1776
|
+
data: {
|
|
1777
|
+
x: limitedCoords.x - x,
|
|
1778
|
+
y: limitedCoords.y - y
|
|
1779
|
+
}
|
|
1780
|
+
};
|
|
1781
|
+
}
|
|
1782
|
+
};
|
|
1783
|
+
};
|
|
2341
1784
|
|
|
2342
|
-
|
|
2343
|
-
|
|
2344
|
-
|
|
2345
|
-
|
|
2346
|
-
} else if (type !== undefined && type.$$typeof === REACT_ELEMENT_TYPE) {
|
|
2347
|
-
typeString = "<" + (getComponentName(type.type) || 'Unknown') + " />";
|
|
2348
|
-
info = ' Did you accidentally export a JSX literal instead of a component?';
|
|
2349
|
-
} else {
|
|
2350
|
-
typeString = typeof type;
|
|
2351
|
-
}
|
|
1785
|
+
function getWindow(node) {
|
|
1786
|
+
var _node$ownerDocument;
|
|
1787
|
+
return ((_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
|
|
1788
|
+
}
|
|
2352
1789
|
|
|
2353
|
-
|
|
2354
|
-
|
|
1790
|
+
function getComputedStyle$1(element) {
|
|
1791
|
+
return getWindow(element).getComputedStyle(element);
|
|
1792
|
+
}
|
|
2355
1793
|
|
|
2356
|
-
|
|
2357
|
-
|
|
1794
|
+
const min = Math.min;
|
|
1795
|
+
const max = Math.max;
|
|
1796
|
+
const round = Math.round;
|
|
2358
1797
|
|
|
2359
|
-
|
|
2360
|
-
|
|
2361
|
-
|
|
2362
|
-
|
|
2363
|
-
|
|
2364
|
-
|
|
2365
|
-
|
|
1798
|
+
function getCssDimensions(element) {
|
|
1799
|
+
const css = getComputedStyle$1(element);
|
|
1800
|
+
let width = parseFloat(css.width);
|
|
1801
|
+
let height = parseFloat(css.height);
|
|
1802
|
+
const offsetWidth = element.offsetWidth;
|
|
1803
|
+
const offsetHeight = element.offsetHeight;
|
|
1804
|
+
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
|
|
1805
|
+
if (shouldFallback) {
|
|
1806
|
+
width = offsetWidth;
|
|
1807
|
+
height = offsetHeight;
|
|
1808
|
+
}
|
|
1809
|
+
return {
|
|
1810
|
+
width,
|
|
1811
|
+
height,
|
|
1812
|
+
fallback: shouldFallback
|
|
1813
|
+
};
|
|
1814
|
+
}
|
|
2366
1815
|
|
|
1816
|
+
function getNodeName(node) {
|
|
1817
|
+
return isNode(node) ? (node.nodeName || '').toLowerCase() : '';
|
|
1818
|
+
}
|
|
2367
1819
|
|
|
2368
|
-
|
|
2369
|
-
|
|
1820
|
+
let uaString;
|
|
1821
|
+
function getUAString() {
|
|
1822
|
+
if (uaString) {
|
|
1823
|
+
return uaString;
|
|
1824
|
+
}
|
|
1825
|
+
const uaData = navigator.userAgentData;
|
|
1826
|
+
if (uaData && Array.isArray(uaData.brands)) {
|
|
1827
|
+
uaString = uaData.brands.map(item => item.brand + "/" + item.version).join(' ');
|
|
1828
|
+
return uaString;
|
|
1829
|
+
}
|
|
1830
|
+
return navigator.userAgent;
|
|
1831
|
+
}
|
|
2370
1832
|
|
|
2371
|
-
|
|
2372
|
-
|
|
2373
|
-
|
|
2374
|
-
|
|
2375
|
-
|
|
2376
|
-
|
|
1833
|
+
function isHTMLElement(value) {
|
|
1834
|
+
return value instanceof getWindow(value).HTMLElement;
|
|
1835
|
+
}
|
|
1836
|
+
function isElement(value) {
|
|
1837
|
+
return value instanceof getWindow(value).Element;
|
|
1838
|
+
}
|
|
1839
|
+
function isNode(value) {
|
|
1840
|
+
return value instanceof getWindow(value).Node;
|
|
1841
|
+
}
|
|
1842
|
+
function isShadowRoot(node) {
|
|
1843
|
+
// Browsers without `ShadowRoot` support.
|
|
1844
|
+
if (typeof ShadowRoot === 'undefined') {
|
|
1845
|
+
return false;
|
|
1846
|
+
}
|
|
1847
|
+
const OwnElement = getWindow(node).ShadowRoot;
|
|
1848
|
+
return node instanceof OwnElement || node instanceof ShadowRoot;
|
|
1849
|
+
}
|
|
1850
|
+
function isOverflowElement(element) {
|
|
1851
|
+
const {
|
|
1852
|
+
overflow,
|
|
1853
|
+
overflowX,
|
|
1854
|
+
overflowY,
|
|
1855
|
+
display
|
|
1856
|
+
} = getComputedStyle$1(element);
|
|
1857
|
+
return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !['inline', 'contents'].includes(display);
|
|
1858
|
+
}
|
|
1859
|
+
function isTableElement(element) {
|
|
1860
|
+
return ['table', 'td', 'th'].includes(getNodeName(element));
|
|
1861
|
+
}
|
|
1862
|
+
function isContainingBlock(element) {
|
|
1863
|
+
// TODO: Try to use feature detection here instead.
|
|
1864
|
+
const isFirefox = /firefox/i.test(getUAString());
|
|
1865
|
+
const css = getComputedStyle$1(element);
|
|
1866
|
+
const backdropFilter = css.backdropFilter || css.WebkitBackdropFilter;
|
|
2377
1867
|
|
|
2378
|
-
|
|
2379
|
-
|
|
2380
|
-
|
|
2381
|
-
|
|
2382
|
-
|
|
2383
|
-
|
|
2384
|
-
|
|
2385
|
-
|
|
2386
|
-
|
|
2387
|
-
|
|
2388
|
-
|
|
1868
|
+
// This is non-exhaustive but covers the most common CSS properties that
|
|
1869
|
+
// create a containing block.
|
|
1870
|
+
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
1871
|
+
return css.transform !== 'none' || css.perspective !== 'none' || (backdropFilter ? backdropFilter !== 'none' : false) || isFirefox && css.willChange === 'filter' || isFirefox && (css.filter ? css.filter !== 'none' : false) || ['transform', 'perspective'].some(value => css.willChange.includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => {
|
|
1872
|
+
// Add type check for old browsers.
|
|
1873
|
+
const contain = css.contain;
|
|
1874
|
+
return contain != null ? contain.includes(value) : false;
|
|
1875
|
+
});
|
|
1876
|
+
}
|
|
1877
|
+
function isLayoutViewport() {
|
|
1878
|
+
// TODO: Try to use feature detection here instead. Feature detection for
|
|
1879
|
+
// this can fail in various ways, making the userAgent check the most:
|
|
1880
|
+
// reliable:
|
|
1881
|
+
// • Always-visible scrollbar or not
|
|
1882
|
+
// • Width of <html>
|
|
2389
1883
|
|
|
2390
|
-
|
|
2391
|
-
|
|
2392
|
-
|
|
2393
|
-
|
|
2394
|
-
|
|
1884
|
+
// Not Safari.
|
|
1885
|
+
return !/^((?!chrome|android).)*safari/i.test(getUAString());
|
|
1886
|
+
}
|
|
1887
|
+
function isLastTraversableNode(node) {
|
|
1888
|
+
return ['html', 'body', '#document'].includes(getNodeName(node));
|
|
1889
|
+
}
|
|
2395
1890
|
|
|
2396
|
-
|
|
2397
|
-
|
|
2398
|
-
|
|
2399
|
-
// even with the prod transform. This means that jsxDEV is purely
|
|
2400
|
-
// opt-in behavior for better messages but that we won't stop
|
|
2401
|
-
// giving you warnings if you use production apis.
|
|
1891
|
+
function unwrapElement(element) {
|
|
1892
|
+
return !isElement(element) ? element.contextElement : element;
|
|
1893
|
+
}
|
|
2402
1894
|
|
|
2403
|
-
|
|
2404
|
-
|
|
2405
|
-
|
|
2406
|
-
|
|
2407
|
-
|
|
2408
|
-
|
|
2409
|
-
|
|
2410
|
-
|
|
2411
|
-
|
|
2412
|
-
|
|
1895
|
+
const FALLBACK_SCALE = {
|
|
1896
|
+
x: 1,
|
|
1897
|
+
y: 1
|
|
1898
|
+
};
|
|
1899
|
+
function getScale(element) {
|
|
1900
|
+
const domElement = unwrapElement(element);
|
|
1901
|
+
if (!isHTMLElement(domElement)) {
|
|
1902
|
+
return FALLBACK_SCALE;
|
|
1903
|
+
}
|
|
1904
|
+
const rect = domElement.getBoundingClientRect();
|
|
1905
|
+
const {
|
|
1906
|
+
width,
|
|
1907
|
+
height,
|
|
1908
|
+
fallback
|
|
1909
|
+
} = getCssDimensions(domElement);
|
|
1910
|
+
let x = (fallback ? round(rect.width) : rect.width) / width;
|
|
1911
|
+
let y = (fallback ? round(rect.height) : rect.height) / height;
|
|
2413
1912
|
|
|
2414
|
-
|
|
2415
|
-
// for now we can ship identical prod functions
|
|
1913
|
+
// 0, NaN, or Infinity should always fallback to 1.
|
|
2416
1914
|
|
|
2417
|
-
|
|
1915
|
+
if (!x || !Number.isFinite(x)) {
|
|
1916
|
+
x = 1;
|
|
1917
|
+
}
|
|
1918
|
+
if (!y || !Number.isFinite(y)) {
|
|
1919
|
+
y = 1;
|
|
1920
|
+
}
|
|
1921
|
+
return {
|
|
1922
|
+
x,
|
|
1923
|
+
y
|
|
1924
|
+
};
|
|
1925
|
+
}
|
|
2418
1926
|
|
|
2419
|
-
|
|
2420
|
-
|
|
2421
|
-
|
|
2422
|
-
|
|
2423
|
-
}
|
|
1927
|
+
function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
|
|
1928
|
+
var _win$visualViewport, _win$visualViewport2;
|
|
1929
|
+
if (includeScale === void 0) {
|
|
1930
|
+
includeScale = false;
|
|
1931
|
+
}
|
|
1932
|
+
if (isFixedStrategy === void 0) {
|
|
1933
|
+
isFixedStrategy = false;
|
|
1934
|
+
}
|
|
1935
|
+
const clientRect = element.getBoundingClientRect();
|
|
1936
|
+
const domElement = unwrapElement(element);
|
|
1937
|
+
let scale = FALLBACK_SCALE;
|
|
1938
|
+
if (includeScale) {
|
|
1939
|
+
if (offsetParent) {
|
|
1940
|
+
if (isElement(offsetParent)) {
|
|
1941
|
+
scale = getScale(offsetParent);
|
|
1942
|
+
}
|
|
1943
|
+
} else {
|
|
1944
|
+
scale = getScale(element);
|
|
1945
|
+
}
|
|
1946
|
+
}
|
|
1947
|
+
const win = domElement ? getWindow(domElement) : window;
|
|
1948
|
+
const addVisualOffsets = !isLayoutViewport() && isFixedStrategy;
|
|
1949
|
+
let x = (clientRect.left + (addVisualOffsets ? ((_win$visualViewport = win.visualViewport) == null ? void 0 : _win$visualViewport.offsetLeft) || 0 : 0)) / scale.x;
|
|
1950
|
+
let y = (clientRect.top + (addVisualOffsets ? ((_win$visualViewport2 = win.visualViewport) == null ? void 0 : _win$visualViewport2.offsetTop) || 0 : 0)) / scale.y;
|
|
1951
|
+
let width = clientRect.width / scale.x;
|
|
1952
|
+
let height = clientRect.height / scale.y;
|
|
1953
|
+
if (domElement) {
|
|
1954
|
+
const win = getWindow(domElement);
|
|
1955
|
+
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
|
|
1956
|
+
let currentIFrame = win.frameElement;
|
|
1957
|
+
while (currentIFrame && offsetParent && offsetWin !== win) {
|
|
1958
|
+
const iframeScale = getScale(currentIFrame);
|
|
1959
|
+
const iframeRect = currentIFrame.getBoundingClientRect();
|
|
1960
|
+
const css = getComputedStyle(currentIFrame);
|
|
1961
|
+
iframeRect.x += (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
|
|
1962
|
+
iframeRect.y += (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
|
|
1963
|
+
x *= iframeScale.x;
|
|
1964
|
+
y *= iframeScale.y;
|
|
1965
|
+
width *= iframeScale.x;
|
|
1966
|
+
height *= iframeScale.y;
|
|
1967
|
+
x += iframeRect.x;
|
|
1968
|
+
y += iframeRect.y;
|
|
1969
|
+
currentIFrame = getWindow(currentIFrame).frameElement;
|
|
1970
|
+
}
|
|
1971
|
+
}
|
|
1972
|
+
return {
|
|
1973
|
+
width,
|
|
1974
|
+
height,
|
|
1975
|
+
top: y,
|
|
1976
|
+
right: x + width,
|
|
1977
|
+
bottom: y + height,
|
|
1978
|
+
left: x,
|
|
1979
|
+
x,
|
|
1980
|
+
y
|
|
1981
|
+
};
|
|
1982
|
+
}
|
|
2424
1983
|
|
|
2425
|
-
|
|
1984
|
+
function getDocumentElement(node) {
|
|
1985
|
+
return ((isNode(node) ? node.ownerDocument : node.document) || window.document).documentElement;
|
|
1986
|
+
}
|
|
2426
1987
|
|
|
2427
|
-
|
|
2428
|
-
|
|
2429
|
-
|
|
2430
|
-
|
|
1988
|
+
function getNodeScroll(element) {
|
|
1989
|
+
if (isElement(element)) {
|
|
1990
|
+
return {
|
|
1991
|
+
scrollLeft: element.scrollLeft,
|
|
1992
|
+
scrollTop: element.scrollTop
|
|
1993
|
+
};
|
|
1994
|
+
}
|
|
1995
|
+
return {
|
|
1996
|
+
scrollLeft: element.pageXOffset,
|
|
1997
|
+
scrollTop: element.pageYOffset
|
|
1998
|
+
};
|
|
1999
|
+
}
|
|
2431
2000
|
|
|
2432
|
-
|
|
2001
|
+
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
2002
|
+
let {
|
|
2003
|
+
rect,
|
|
2004
|
+
offsetParent,
|
|
2005
|
+
strategy
|
|
2006
|
+
} = _ref;
|
|
2007
|
+
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
2008
|
+
const documentElement = getDocumentElement(offsetParent);
|
|
2009
|
+
if (offsetParent === documentElement) {
|
|
2010
|
+
return rect;
|
|
2011
|
+
}
|
|
2012
|
+
let scroll = {
|
|
2013
|
+
scrollLeft: 0,
|
|
2014
|
+
scrollTop: 0
|
|
2015
|
+
};
|
|
2016
|
+
let scale = {
|
|
2017
|
+
x: 1,
|
|
2018
|
+
y: 1
|
|
2019
|
+
};
|
|
2020
|
+
const offsets = {
|
|
2021
|
+
x: 0,
|
|
2022
|
+
y: 0
|
|
2023
|
+
};
|
|
2024
|
+
if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== 'fixed') {
|
|
2025
|
+
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
2026
|
+
scroll = getNodeScroll(offsetParent);
|
|
2027
|
+
}
|
|
2028
|
+
if (isHTMLElement(offsetParent)) {
|
|
2029
|
+
const offsetRect = getBoundingClientRect(offsetParent);
|
|
2030
|
+
scale = getScale(offsetParent);
|
|
2031
|
+
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
2032
|
+
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
2033
|
+
}
|
|
2034
|
+
}
|
|
2035
|
+
return {
|
|
2036
|
+
width: rect.width * scale.x,
|
|
2037
|
+
height: rect.height * scale.y,
|
|
2038
|
+
x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
|
|
2039
|
+
y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
|
|
2040
|
+
};
|
|
2041
|
+
}
|
|
2433
2042
|
|
|
2434
|
-
|
|
2435
|
-
|
|
2436
|
-
|
|
2437
|
-
|
|
2438
|
-
|
|
2043
|
+
function getWindowScrollBarX(element) {
|
|
2044
|
+
// If <html> has a CSS width greater than the viewport, then this will be
|
|
2045
|
+
// incorrect for RTL.
|
|
2046
|
+
return getBoundingClientRect(getDocumentElement(element)).left + getNodeScroll(element).scrollLeft;
|
|
2047
|
+
}
|
|
2439
2048
|
|
|
2440
|
-
|
|
2441
|
-
|
|
2049
|
+
// Gets the entire size of the scrollable document area, even extending outside
|
|
2050
|
+
// of the `<html>` and `<body>` rect bounds if horizontally scrollable.
|
|
2051
|
+
function getDocumentRect(element) {
|
|
2052
|
+
const html = getDocumentElement(element);
|
|
2053
|
+
const scroll = getNodeScroll(element);
|
|
2054
|
+
const body = element.ownerDocument.body;
|
|
2055
|
+
const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
|
|
2056
|
+
const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
|
|
2057
|
+
let x = -scroll.scrollLeft + getWindowScrollBarX(element);
|
|
2058
|
+
const y = -scroll.scrollTop;
|
|
2059
|
+
if (getComputedStyle$1(body).direction === 'rtl') {
|
|
2060
|
+
x += max(html.clientWidth, body.clientWidth) - width;
|
|
2061
|
+
}
|
|
2062
|
+
return {
|
|
2063
|
+
width,
|
|
2064
|
+
height,
|
|
2065
|
+
x,
|
|
2066
|
+
y
|
|
2067
|
+
};
|
|
2068
|
+
}
|
|
2442
2069
|
|
|
2443
|
-
|
|
2070
|
+
function getParentNode(node) {
|
|
2071
|
+
if (getNodeName(node) === 'html') {
|
|
2072
|
+
return node;
|
|
2073
|
+
}
|
|
2074
|
+
const result =
|
|
2075
|
+
// Step into the shadow DOM of the parent of a slotted node.
|
|
2076
|
+
node.assignedSlot ||
|
|
2077
|
+
// DOM Element detected.
|
|
2078
|
+
node.parentNode ||
|
|
2079
|
+
// ShadowRoot detected.
|
|
2080
|
+
isShadowRoot(node) && node.host ||
|
|
2081
|
+
// Fallback.
|
|
2082
|
+
getDocumentElement(node);
|
|
2083
|
+
return isShadowRoot(result) ? result.host : result;
|
|
2084
|
+
}
|
|
2444
2085
|
|
|
2445
|
-
|
|
2086
|
+
function getNearestOverflowAncestor(node) {
|
|
2087
|
+
const parentNode = getParentNode(node);
|
|
2088
|
+
if (isLastTraversableNode(parentNode)) {
|
|
2089
|
+
// `getParentNode` will never return a `Document` due to the fallback
|
|
2090
|
+
// check, so it's either the <html> or <body> element.
|
|
2091
|
+
return parentNode.ownerDocument.body;
|
|
2092
|
+
}
|
|
2093
|
+
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
|
|
2094
|
+
return parentNode;
|
|
2095
|
+
}
|
|
2096
|
+
return getNearestOverflowAncestor(parentNode);
|
|
2097
|
+
}
|
|
2446
2098
|
|
|
2447
|
-
|
|
2448
|
-
|
|
2099
|
+
function getOverflowAncestors(node, list) {
|
|
2100
|
+
var _node$ownerDocument;
|
|
2101
|
+
if (list === void 0) {
|
|
2102
|
+
list = [];
|
|
2103
|
+
}
|
|
2104
|
+
const scrollableAncestor = getNearestOverflowAncestor(node);
|
|
2105
|
+
const isBody = scrollableAncestor === ((_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.body);
|
|
2106
|
+
const win = getWindow(scrollableAncestor);
|
|
2107
|
+
if (isBody) {
|
|
2108
|
+
return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : []);
|
|
2109
|
+
}
|
|
2110
|
+
return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor));
|
|
2111
|
+
}
|
|
2449
2112
|
|
|
2450
|
-
|
|
2451
|
-
|
|
2452
|
-
|
|
2113
|
+
function getViewportRect(element, strategy) {
|
|
2114
|
+
const win = getWindow(element);
|
|
2115
|
+
const html = getDocumentElement(element);
|
|
2116
|
+
const visualViewport = win.visualViewport;
|
|
2117
|
+
let width = html.clientWidth;
|
|
2118
|
+
let height = html.clientHeight;
|
|
2119
|
+
let x = 0;
|
|
2120
|
+
let y = 0;
|
|
2121
|
+
if (visualViewport) {
|
|
2122
|
+
width = visualViewport.width;
|
|
2123
|
+
height = visualViewport.height;
|
|
2124
|
+
const layoutViewport = isLayoutViewport();
|
|
2125
|
+
if (layoutViewport || !layoutViewport && strategy === 'fixed') {
|
|
2126
|
+
x = visualViewport.offsetLeft;
|
|
2127
|
+
y = visualViewport.offsetTop;
|
|
2128
|
+
}
|
|
2129
|
+
}
|
|
2130
|
+
return {
|
|
2131
|
+
width,
|
|
2132
|
+
height,
|
|
2133
|
+
x,
|
|
2134
|
+
y
|
|
2135
|
+
};
|
|
2136
|
+
}
|
|
2453
2137
|
|
|
2454
|
-
|
|
2138
|
+
// Returns the inner client rect, subtracting scrollbars if present.
|
|
2139
|
+
function getInnerBoundingClientRect(element, strategy) {
|
|
2140
|
+
const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
|
|
2141
|
+
const top = clientRect.top + element.clientTop;
|
|
2142
|
+
const left = clientRect.left + element.clientLeft;
|
|
2143
|
+
const scale = isHTMLElement(element) ? getScale(element) : {
|
|
2144
|
+
x: 1,
|
|
2145
|
+
y: 1
|
|
2146
|
+
};
|
|
2147
|
+
const width = element.clientWidth * scale.x;
|
|
2148
|
+
const height = element.clientHeight * scale.y;
|
|
2149
|
+
const x = left * scale.x;
|
|
2150
|
+
const y = top * scale.y;
|
|
2151
|
+
return {
|
|
2152
|
+
width,
|
|
2153
|
+
height,
|
|
2154
|
+
x,
|
|
2155
|
+
y
|
|
2156
|
+
};
|
|
2157
|
+
}
|
|
2158
|
+
function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
|
|
2159
|
+
if (clippingAncestor === 'viewport') {
|
|
2160
|
+
return rectToClientRect(getViewportRect(element, strategy));
|
|
2161
|
+
}
|
|
2162
|
+
if (isElement(clippingAncestor)) {
|
|
2163
|
+
return rectToClientRect(getInnerBoundingClientRect(clippingAncestor, strategy));
|
|
2164
|
+
}
|
|
2165
|
+
return rectToClientRect(getDocumentRect(getDocumentElement(element)));
|
|
2166
|
+
}
|
|
2455
2167
|
|
|
2456
|
-
|
|
2457
|
-
|
|
2458
|
-
|
|
2459
|
-
|
|
2460
|
-
|
|
2461
|
-
|
|
2462
|
-
|
|
2463
|
-
|
|
2464
|
-
|
|
2465
|
-
|
|
2466
|
-
|
|
2467
|
-
|
|
2468
|
-
continue;
|
|
2469
|
-
}
|
|
2168
|
+
// A "clipping ancestor" is an `overflow` element with the characteristic of
|
|
2169
|
+
// clipping (or hiding) child elements. This returns all clipping ancestors
|
|
2170
|
+
// of the given element up the tree.
|
|
2171
|
+
function getClippingElementAncestors(element, cache) {
|
|
2172
|
+
const cachedResult = cache.get(element);
|
|
2173
|
+
if (cachedResult) {
|
|
2174
|
+
return cachedResult;
|
|
2175
|
+
}
|
|
2176
|
+
let result = getOverflowAncestors(element).filter(el => isElement(el) && getNodeName(el) !== 'body');
|
|
2177
|
+
let currentContainingBlockComputedStyle = null;
|
|
2178
|
+
const elementIsFixed = getComputedStyle$1(element).position === 'fixed';
|
|
2179
|
+
let currentNode = elementIsFixed ? getParentNode(element) : element;
|
|
2470
2180
|
|
|
2471
|
-
|
|
2472
|
-
|
|
2473
|
-
|
|
2474
|
-
|
|
2475
|
-
|
|
2476
|
-
|
|
2477
|
-
|
|
2181
|
+
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
2182
|
+
while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
2183
|
+
const computedStyle = getComputedStyle$1(currentNode);
|
|
2184
|
+
const containingBlock = isContainingBlock(currentNode);
|
|
2185
|
+
const shouldDropCurrentNode = elementIsFixed ? !containingBlock && !currentContainingBlockComputedStyle : !containingBlock && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && ['absolute', 'fixed'].includes(currentContainingBlockComputedStyle.position);
|
|
2186
|
+
if (shouldDropCurrentNode) {
|
|
2187
|
+
// Drop non-containing blocks.
|
|
2188
|
+
result = result.filter(ancestor => ancestor !== currentNode);
|
|
2189
|
+
} else {
|
|
2190
|
+
// Record last containing block for next iteration.
|
|
2191
|
+
currentContainingBlockComputedStyle = computedStyle;
|
|
2192
|
+
}
|
|
2193
|
+
currentNode = getParentNode(currentNode);
|
|
2194
|
+
}
|
|
2195
|
+
cache.set(element, result);
|
|
2196
|
+
return result;
|
|
2197
|
+
}
|
|
2478
2198
|
|
|
2479
|
-
|
|
2480
|
-
|
|
2199
|
+
// Gets the maximum area that the element is visible in due to any number of
|
|
2200
|
+
// clipping ancestors.
|
|
2201
|
+
function getClippingRect(_ref) {
|
|
2202
|
+
let {
|
|
2203
|
+
element,
|
|
2204
|
+
boundary,
|
|
2205
|
+
rootBoundary,
|
|
2206
|
+
strategy
|
|
2207
|
+
} = _ref;
|
|
2208
|
+
const elementClippingAncestors = boundary === 'clippingAncestors' ? getClippingElementAncestors(element, this._c) : [].concat(boundary);
|
|
2209
|
+
const clippingAncestors = [...elementClippingAncestors, rootBoundary];
|
|
2210
|
+
const firstClippingAncestor = clippingAncestors[0];
|
|
2211
|
+
const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
|
|
2212
|
+
const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
|
|
2213
|
+
accRect.top = max(rect.top, accRect.top);
|
|
2214
|
+
accRect.right = min(rect.right, accRect.right);
|
|
2215
|
+
accRect.bottom = min(rect.bottom, accRect.bottom);
|
|
2216
|
+
accRect.left = max(rect.left, accRect.left);
|
|
2217
|
+
return accRect;
|
|
2218
|
+
}, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
|
|
2219
|
+
return {
|
|
2220
|
+
width: clippingRect.right - clippingRect.left,
|
|
2221
|
+
height: clippingRect.bottom - clippingRect.top,
|
|
2222
|
+
x: clippingRect.left,
|
|
2223
|
+
y: clippingRect.top
|
|
2224
|
+
};
|
|
2225
|
+
}
|
|
2481
2226
|
|
|
2482
|
-
|
|
2483
|
-
|
|
2484
|
-
|
|
2485
|
-
|
|
2486
|
-
|
|
2487
|
-
|
|
2488
|
-
}());
|
|
2489
|
-
} (classnames));
|
|
2227
|
+
function getDimensions(element) {
|
|
2228
|
+
if (isHTMLElement(element)) {
|
|
2229
|
+
return getCssDimensions(element);
|
|
2230
|
+
}
|
|
2231
|
+
return element.getBoundingClientRect();
|
|
2232
|
+
}
|
|
2490
2233
|
|
|
2491
|
-
|
|
2234
|
+
function getTrueOffsetParent(element) {
|
|
2235
|
+
if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
|
|
2236
|
+
return null;
|
|
2237
|
+
}
|
|
2238
|
+
return element.offsetParent;
|
|
2239
|
+
}
|
|
2240
|
+
function getContainingBlock(element) {
|
|
2241
|
+
let currentNode = getParentNode(element);
|
|
2242
|
+
while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
2243
|
+
if (isContainingBlock(currentNode)) {
|
|
2244
|
+
return currentNode;
|
|
2245
|
+
} else {
|
|
2246
|
+
currentNode = getParentNode(currentNode);
|
|
2247
|
+
}
|
|
2248
|
+
}
|
|
2249
|
+
return null;
|
|
2250
|
+
}
|
|
2492
2251
|
|
|
2493
|
-
|
|
2494
|
-
|
|
2495
|
-
|
|
2496
|
-
|
|
2497
|
-
|
|
2498
|
-
|
|
2499
|
-
|
|
2500
|
-
|
|
2501
|
-
|
|
2502
|
-
return
|
|
2503
|
-
|
|
2504
|
-
|
|
2505
|
-
|
|
2506
|
-
func.apply(this, args);
|
|
2507
|
-
}
|
|
2508
|
-
};
|
|
2509
|
-
if (timeout) {
|
|
2510
|
-
clearTimeout(timeout);
|
|
2511
|
-
}
|
|
2512
|
-
timeout = setTimeout(later, wait);
|
|
2513
|
-
};
|
|
2514
|
-
};
|
|
2252
|
+
// Gets the closest ancestor positioned element. Handles some edge cases,
|
|
2253
|
+
// such as table ancestors and cross browser bugs.
|
|
2254
|
+
function getOffsetParent(element) {
|
|
2255
|
+
const window = getWindow(element);
|
|
2256
|
+
let offsetParent = getTrueOffsetParent(element);
|
|
2257
|
+
while (offsetParent && isTableElement(offsetParent) && getComputedStyle$1(offsetParent).position === 'static') {
|
|
2258
|
+
offsetParent = getTrueOffsetParent(offsetParent);
|
|
2259
|
+
}
|
|
2260
|
+
if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle$1(offsetParent).position === 'static' && !isContainingBlock(offsetParent))) {
|
|
2261
|
+
return window;
|
|
2262
|
+
}
|
|
2263
|
+
return offsetParent || getContainingBlock(element) || window;
|
|
2264
|
+
}
|
|
2515
2265
|
|
|
2516
|
-
|
|
2517
|
-
|
|
2518
|
-
|
|
2266
|
+
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
2267
|
+
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
2268
|
+
const documentElement = getDocumentElement(offsetParent);
|
|
2269
|
+
const rect = getBoundingClientRect(element, true, strategy === 'fixed', offsetParent);
|
|
2270
|
+
let scroll = {
|
|
2271
|
+
scrollLeft: 0,
|
|
2272
|
+
scrollTop: 0
|
|
2273
|
+
};
|
|
2274
|
+
const offsets = {
|
|
2275
|
+
x: 0,
|
|
2276
|
+
y: 0
|
|
2277
|
+
};
|
|
2278
|
+
if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== 'fixed') {
|
|
2279
|
+
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
2280
|
+
scroll = getNodeScroll(offsetParent);
|
|
2281
|
+
}
|
|
2282
|
+
if (isHTMLElement(offsetParent)) {
|
|
2283
|
+
const offsetRect = getBoundingClientRect(offsetParent, true);
|
|
2284
|
+
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
2285
|
+
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
2286
|
+
} else if (documentElement) {
|
|
2287
|
+
offsets.x = getWindowScrollBarX(documentElement);
|
|
2288
|
+
}
|
|
2289
|
+
}
|
|
2290
|
+
return {
|
|
2291
|
+
x: rect.left + scroll.scrollLeft - offsets.x,
|
|
2292
|
+
y: rect.top + scroll.scrollTop - offsets.y,
|
|
2293
|
+
width: rect.width,
|
|
2294
|
+
height: rect.height
|
|
2295
|
+
};
|
|
2296
|
+
}
|
|
2519
2297
|
|
|
2520
|
-
const
|
|
2521
|
-
|
|
2522
|
-
|
|
2523
|
-
|
|
2524
|
-
|
|
2525
|
-
|
|
2526
|
-
|
|
2527
|
-
|
|
2528
|
-
|
|
2529
|
-
|
|
2530
|
-
|
|
2531
|
-
|
|
2532
|
-
|
|
2533
|
-
};
|
|
2534
|
-
const
|
|
2535
|
-
|
|
2536
|
-
|
|
2537
|
-
|
|
2538
|
-
|
|
2539
|
-
|
|
2540
|
-
|
|
2541
|
-
|
|
2542
|
-
|
|
2543
|
-
const [anchorRefMap, setAnchorRefMap] = useState({
|
|
2544
|
-
[DEFAULT_TOOLTIP_ID]: new Set(),
|
|
2545
|
-
});
|
|
2546
|
-
const [activeAnchorMap, setActiveAnchorMap] = useState({
|
|
2547
|
-
[DEFAULT_TOOLTIP_ID]: { current: null },
|
|
2548
|
-
});
|
|
2549
|
-
const attach = (tooltipId, ...refs) => {
|
|
2550
|
-
setAnchorRefMap((oldMap) => {
|
|
2551
|
-
var _a;
|
|
2552
|
-
const tooltipRefs = (_a = oldMap[tooltipId]) !== null && _a !== void 0 ? _a : new Set();
|
|
2553
|
-
refs.forEach((ref) => tooltipRefs.add(ref));
|
|
2554
|
-
// create new object to trigger re-render
|
|
2555
|
-
return { ...oldMap, [tooltipId]: new Set(tooltipRefs) };
|
|
2556
|
-
});
|
|
2557
|
-
};
|
|
2558
|
-
const detach = (tooltipId, ...refs) => {
|
|
2559
|
-
setAnchorRefMap((oldMap) => {
|
|
2560
|
-
const tooltipRefs = oldMap[tooltipId];
|
|
2561
|
-
if (!tooltipRefs) {
|
|
2562
|
-
// tooltip not found
|
|
2563
|
-
// maybe thow error?
|
|
2564
|
-
return oldMap;
|
|
2565
|
-
}
|
|
2566
|
-
refs.forEach((ref) => tooltipRefs.delete(ref));
|
|
2567
|
-
// create new object to trigger re-render
|
|
2568
|
-
return { ...oldMap };
|
|
2569
|
-
});
|
|
2570
|
-
};
|
|
2571
|
-
const setActiveAnchor = (tooltipId, ref) => {
|
|
2572
|
-
setActiveAnchorMap((oldMap) => {
|
|
2573
|
-
var _a;
|
|
2574
|
-
if (((_a = oldMap[tooltipId]) === null || _a === void 0 ? void 0 : _a.current) === ref.current) {
|
|
2575
|
-
return oldMap;
|
|
2576
|
-
}
|
|
2577
|
-
// create new object to trigger re-render
|
|
2578
|
-
return { ...oldMap, [tooltipId]: ref };
|
|
2579
|
-
});
|
|
2298
|
+
const platform = {
|
|
2299
|
+
getClippingRect,
|
|
2300
|
+
convertOffsetParentRelativeRectToViewportRelativeRect,
|
|
2301
|
+
isElement,
|
|
2302
|
+
getDimensions,
|
|
2303
|
+
getOffsetParent,
|
|
2304
|
+
getDocumentElement,
|
|
2305
|
+
getScale,
|
|
2306
|
+
async getElementRects(_ref) {
|
|
2307
|
+
let {
|
|
2308
|
+
reference,
|
|
2309
|
+
floating,
|
|
2310
|
+
strategy
|
|
2311
|
+
} = _ref;
|
|
2312
|
+
const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
|
|
2313
|
+
const getDimensionsFn = this.getDimensions;
|
|
2314
|
+
return {
|
|
2315
|
+
reference: getRectRelativeToOffsetParent(reference, await getOffsetParentFn(floating), strategy),
|
|
2316
|
+
floating: {
|
|
2317
|
+
x: 0,
|
|
2318
|
+
y: 0,
|
|
2319
|
+
...(await getDimensionsFn(floating))
|
|
2320
|
+
}
|
|
2580
2321
|
};
|
|
2581
|
-
|
|
2582
|
-
|
|
2583
|
-
|
|
2584
|
-
anchorRefs: (_a = anchorRefMap[tooltipId]) !== null && _a !== void 0 ? _a : new Set(),
|
|
2585
|
-
activeAnchor: (_b = activeAnchorMap[tooltipId]) !== null && _b !== void 0 ? _b : { current: null },
|
|
2586
|
-
attach: (...refs) => attach(tooltipId, ...refs),
|
|
2587
|
-
detach: (...refs) => detach(tooltipId, ...refs),
|
|
2588
|
-
setActiveAnchor: (ref) => setActiveAnchor(tooltipId, ref),
|
|
2589
|
-
});
|
|
2590
|
-
}, [anchorRefMap, activeAnchorMap, attach, detach]);
|
|
2591
|
-
const context = useMemo(() => {
|
|
2592
|
-
return {
|
|
2593
|
-
getTooltipData,
|
|
2594
|
-
};
|
|
2595
|
-
}, [getTooltipData]);
|
|
2596
|
-
return jsxRuntime.exports.jsx(TooltipContext.Provider, { value: context, children: children });
|
|
2322
|
+
},
|
|
2323
|
+
getClientRects: element => Array.from(element.getClientRects()),
|
|
2324
|
+
isRTL: element => getComputedStyle$1(element).direction === 'rtl'
|
|
2597
2325
|
};
|
|
2598
|
-
function useTooltip(tooltipId = DEFAULT_TOOLTIP_ID) {
|
|
2599
|
-
return useContext(TooltipContext).getTooltipData(tooltipId);
|
|
2600
|
-
}
|
|
2601
2326
|
|
|
2602
2327
|
/**
|
|
2603
|
-
*
|
|
2604
|
-
*
|
|
2328
|
+
* Computes the `x` and `y` coordinates that will place the floating element
|
|
2329
|
+
* next to a reference element when it is given a certain CSS positioning
|
|
2330
|
+
* strategy.
|
|
2605
2331
|
*/
|
|
2606
|
-
const
|
|
2607
|
-
|
|
2608
|
-
|
|
2609
|
-
|
|
2610
|
-
|
|
2611
|
-
|
|
2612
|
-
|
|
2613
|
-
|
|
2614
|
-
|
|
2615
|
-
|
|
2332
|
+
const computePosition = (reference, floating, options) => {
|
|
2333
|
+
// This caches the expensive `getClippingElementAncestors` function so that
|
|
2334
|
+
// multiple lifecycle resets re-use the same result. It only lives for a
|
|
2335
|
+
// single call. If other functions become expensive, we can add them as well.
|
|
2336
|
+
const cache = new Map();
|
|
2337
|
+
const mergedOptions = {
|
|
2338
|
+
platform,
|
|
2339
|
+
...options
|
|
2340
|
+
};
|
|
2341
|
+
const platformWithCache = {
|
|
2342
|
+
...mergedOptions.platform,
|
|
2343
|
+
_c: cache
|
|
2344
|
+
};
|
|
2345
|
+
return computePosition$1(reference, floating, {
|
|
2346
|
+
...mergedOptions,
|
|
2347
|
+
platform: platformWithCache
|
|
2348
|
+
});
|
|
2616
2349
|
};
|
|
2617
2350
|
|
|
2618
2351
|
const computeTooltipPosition = async ({ elementReference = null, tooltipReference = null, tooltipArrowReference = null, place = 'top', offset: offsetValue = 10, strategy = 'absolute', middlewares = [offset(Number(offsetValue)), flip(), shift({ padding: 5 })], }) => {
|
|
@@ -2691,7 +2424,7 @@ content, html, isOpen, setIsOpen, activeAnchor, setActiveAnchor, }) => {
|
|
|
2691
2424
|
* but should be used carefully because of caveats
|
|
2692
2425
|
* https://beta.reactjs.org/reference/react/useLayoutEffect#caveats
|
|
2693
2426
|
*/
|
|
2694
|
-
|
|
2427
|
+
useIsomorphicLayoutEffect(() => {
|
|
2695
2428
|
mounted.current = true;
|
|
2696
2429
|
return () => {
|
|
2697
2430
|
mounted.current = false;
|
|
@@ -3287,4 +3020,4 @@ const TooltipController = ({ id, anchorId, anchorSelect, content, html, classNam
|
|
|
3287
3020
|
return children ? jsxRuntime.exports.jsx(Tooltip, { ...props, children: children }) : jsxRuntime.exports.jsx(Tooltip, { ...props });
|
|
3288
3021
|
};
|
|
3289
3022
|
|
|
3290
|
-
export { TooltipController as Tooltip, TooltipProvider, TooltipWrapper
|
|
3023
|
+
export { TooltipController as Tooltip, TooltipProvider, TooltipWrapper };
|