@vritti/quantum-ui 0.4.0 → 0.4.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/Avatar.js +5 -5
- package/dist/Checkbox.js +16 -11
- package/dist/Checkbox.js.map +1 -1
- package/dist/Checkbox2.js +4 -5
- package/dist/Checkbox2.js.map +1 -1
- package/dist/Combination.js +1 -1
- package/dist/Dialog.js +1 -1
- package/dist/Progress.js +2 -2
- package/dist/RadioGroup.js +4 -5
- package/dist/RadioGroup.js.map +1 -1
- package/dist/Sidebar.js +1 -1
- package/dist/Sonner.js +1 -1
- package/dist/Switch.js +19 -14
- package/dist/Switch.js.map +1 -1
- package/dist/TabsSkeleton.js +1 -1
- package/dist/Toggle.js +1 -1
- package/dist/assets/quantum-ui.css +1 -1
- package/dist/components/RichTextEditor.js +1 -1
- package/dist/components/TreeView.js +2 -3
- package/dist/components/TreeView.js.map +1 -1
- package/dist/disabledTip.js +13 -0
- package/dist/disabledTip.js.map +1 -0
- package/dist/dropdown-menu.js +5 -7
- package/dist/dropdown-menu.js.map +1 -1
- package/dist/image-component.js +1 -1
- package/dist/index.js +1 -1
- package/dist/index13.js +4 -6
- package/dist/index13.js.map +1 -1
- package/dist/index14.js +3 -5
- package/dist/index14.js.map +1 -1
- package/dist/index15.js +8 -9
- package/dist/index15.js.map +1 -1
- package/dist/index16.js +1 -1
- package/dist/index17.js +1 -1
- package/dist/index19.js +2 -4
- package/dist/index19.js.map +1 -1
- package/dist/index20.js +1 -1
- package/dist/index21.js +139 -1
- package/dist/index21.js.map +1 -1
- package/dist/index22.js +3 -4
- package/dist/index22.js.map +1 -1
- package/dist/index23.js +70 -122
- package/dist/index23.js.map +1 -1
- package/dist/index24.js +1128 -70
- package/dist/index24.js.map +1 -1
- package/dist/index25.js +231 -11
- package/dist/index25.js.map +1 -1
- package/dist/index26.js +2509 -1106
- package/dist/index26.js.map +1 -1
- package/dist/index27.js +23 -223
- package/dist/index27.js.map +1 -1
- package/dist/index28.js +3 -2535
- package/dist/index28.js.map +1 -1
- package/dist/index29.js +36 -31
- package/dist/index29.js.map +1 -1
- package/dist/index30.js +308 -3
- package/dist/index30.js.map +1 -1
- package/dist/index31.js +8 -36
- package/dist/index31.js.map +1 -1
- package/dist/index32.js +25 -305
- package/dist/index32.js.map +1 -1
- package/dist/index33.js +60 -8
- package/dist/index33.js.map +1 -1
- package/dist/index34.js +11 -30
- package/dist/index34.js.map +1 -1
- package/dist/index35.js +35 -59
- package/dist/index35.js.map +1 -1
- package/dist/index36.js +35348 -9
- package/dist/index36.js.map +1 -1
- package/dist/index37.js +79 -36
- package/dist/index37.js.map +1 -1
- package/dist/index38.js +184 -35341
- package/dist/index38.js.map +1 -1
- package/dist/index5.js +2 -4
- package/dist/index5.js.map +1 -1
- package/dist/lib/components/Checkbox/Checkbox.d.ts +1 -0
- package/dist/lib/components/Checkbox/Checkbox.d.ts.map +1 -1
- package/dist/lib/components/Switch/Switch.d.ts +4 -1
- package/dist/lib/components/Switch/Switch.d.ts.map +1 -1
- package/dist/lib/selects/permission-group/PermissionGroupSelector.d.ts +4 -0
- package/dist/lib/selects/permission-group/PermissionGroupSelector.d.ts.map +1 -0
- package/dist/lib/selects/permission-group/index.d.ts +2 -0
- package/dist/lib/selects/permission-group/index.d.ts.map +1 -0
- package/dist/lib/types/catalog-resolver.d.ts +19 -7
- package/dist/lib/types/catalog-resolver.d.ts.map +1 -1
- package/dist/lib/utils/disabledTip.d.ts +3 -0
- package/dist/lib/utils/disabledTip.d.ts.map +1 -0
- package/dist/selects/permission-group.js +21 -0
- package/dist/selects/permission-group.js.map +1 -0
- package/dist/types/catalog-resolver.js +1 -1
- package/dist/types/catalog-resolver.js.map +1 -1
- package/dist/utils/motion.js +2 -2
- package/dist/value.js +1 -1
- package/package.json +5 -1
- package/dist/index39.js +0 -84
- package/dist/index39.js.map +0 -1
- package/dist/index40.js +0 -199
- package/dist/index40.js.map +0 -1
package/dist/index26.js
CHANGED
|
@@ -1,1137 +1,2540 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
'sonner-loading-wrapper',
|
|
32
|
-
className
|
|
33
|
-
].filter(Boolean).join(' '),
|
|
34
|
-
"data-visible": visible
|
|
35
|
-
}, /*#__PURE__*/ React__default.createElement("div", {
|
|
36
|
-
className: "sonner-spinner"
|
|
37
|
-
}, bars.map((_, i)=>/*#__PURE__*/ React__default.createElement("div", {
|
|
38
|
-
className: "sonner-loading-bar",
|
|
39
|
-
key: `spinner-bar-${i}`
|
|
40
|
-
}))));
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { useLayoutEffect } from 'react';
|
|
3
|
+
import * as ReactDOM from 'react-dom';
|
|
4
|
+
import { P as Primitive } from './index20.js';
|
|
5
|
+
import { jsx } from 'react/jsx-runtime';
|
|
6
|
+
import { u as useComposedRefs } from './index12.js';
|
|
7
|
+
import { c as createContextScope } from './index21.js';
|
|
8
|
+
import { u as useCallbackRef } from './index31.js';
|
|
9
|
+
import { u as useLayoutEffect2 } from './index28.js';
|
|
10
|
+
import { u as useSize } from './index35.js';
|
|
11
|
+
|
|
12
|
+
/**
|
|
13
|
+
* Custom positioning reference element.
|
|
14
|
+
* @see https://floating-ui.com/docs/virtual-elements
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
const sides = ['top', 'right', 'bottom', 'left'];
|
|
18
|
+
const min = Math.min;
|
|
19
|
+
const max = Math.max;
|
|
20
|
+
const round = Math.round;
|
|
21
|
+
const floor = Math.floor;
|
|
22
|
+
const createCoords = v => ({
|
|
23
|
+
x: v,
|
|
24
|
+
y: v
|
|
25
|
+
});
|
|
26
|
+
const oppositeSideMap = {
|
|
27
|
+
left: 'right',
|
|
28
|
+
right: 'left',
|
|
29
|
+
bottom: 'top',
|
|
30
|
+
top: 'bottom'
|
|
41
31
|
};
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
32
|
+
function clamp(start, value, end) {
|
|
33
|
+
return max(start, min(value, end));
|
|
34
|
+
}
|
|
35
|
+
function evaluate(value, param) {
|
|
36
|
+
return typeof value === 'function' ? value(param) : value;
|
|
37
|
+
}
|
|
38
|
+
function getSide(placement) {
|
|
39
|
+
return placement.split('-')[0];
|
|
40
|
+
}
|
|
41
|
+
function getAlignment(placement) {
|
|
42
|
+
return placement.split('-')[1];
|
|
43
|
+
}
|
|
44
|
+
function getOppositeAxis(axis) {
|
|
45
|
+
return axis === 'x' ? 'y' : 'x';
|
|
46
|
+
}
|
|
47
|
+
function getAxisLength(axis) {
|
|
48
|
+
return axis === 'y' ? 'height' : 'width';
|
|
49
|
+
}
|
|
50
|
+
function getSideAxis(placement) {
|
|
51
|
+
const firstChar = placement[0];
|
|
52
|
+
return firstChar === 't' || firstChar === 'b' ? 'y' : 'x';
|
|
53
|
+
}
|
|
54
|
+
function getAlignmentAxis(placement) {
|
|
55
|
+
return getOppositeAxis(getSideAxis(placement));
|
|
56
|
+
}
|
|
57
|
+
function getAlignmentSides(placement, rects, rtl) {
|
|
58
|
+
if (rtl === void 0) {
|
|
59
|
+
rtl = false;
|
|
60
|
+
}
|
|
61
|
+
const alignment = getAlignment(placement);
|
|
62
|
+
const alignmentAxis = getAlignmentAxis(placement);
|
|
63
|
+
const length = getAxisLength(alignmentAxis);
|
|
64
|
+
let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
|
|
65
|
+
if (rects.reference[length] > rects.floating[length]) {
|
|
66
|
+
mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
|
|
67
|
+
}
|
|
68
|
+
return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
|
|
69
|
+
}
|
|
70
|
+
function getExpandedPlacements(placement) {
|
|
71
|
+
const oppositePlacement = getOppositePlacement(placement);
|
|
72
|
+
return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
|
|
73
|
+
}
|
|
74
|
+
function getOppositeAlignmentPlacement(placement) {
|
|
75
|
+
return placement.includes('start') ? placement.replace('start', 'end') : placement.replace('end', 'start');
|
|
76
|
+
}
|
|
77
|
+
const lrPlacement = ['left', 'right'];
|
|
78
|
+
const rlPlacement = ['right', 'left'];
|
|
79
|
+
const tbPlacement = ['top', 'bottom'];
|
|
80
|
+
const btPlacement = ['bottom', 'top'];
|
|
81
|
+
function getSideList(side, isStart, rtl) {
|
|
82
|
+
switch (side) {
|
|
83
|
+
case 'top':
|
|
84
|
+
case 'bottom':
|
|
85
|
+
if (rtl) return isStart ? rlPlacement : lrPlacement;
|
|
86
|
+
return isStart ? lrPlacement : rlPlacement;
|
|
87
|
+
case 'left':
|
|
88
|
+
case 'right':
|
|
89
|
+
return isStart ? tbPlacement : btPlacement;
|
|
90
|
+
default:
|
|
91
|
+
return [];
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
|
|
95
|
+
const alignment = getAlignment(placement);
|
|
96
|
+
let list = getSideList(getSide(placement), direction === 'start', rtl);
|
|
97
|
+
if (alignment) {
|
|
98
|
+
list = list.map(side => side + "-" + alignment);
|
|
99
|
+
if (flipAlignment) {
|
|
100
|
+
list = list.concat(list.map(getOppositeAlignmentPlacement));
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
return list;
|
|
104
|
+
}
|
|
105
|
+
function getOppositePlacement(placement) {
|
|
106
|
+
const side = getSide(placement);
|
|
107
|
+
return oppositeSideMap[side] + placement.slice(side.length);
|
|
108
|
+
}
|
|
109
|
+
function expandPaddingObject(padding) {
|
|
110
|
+
return {
|
|
111
|
+
top: 0,
|
|
112
|
+
right: 0,
|
|
113
|
+
bottom: 0,
|
|
114
|
+
left: 0,
|
|
115
|
+
...padding
|
|
116
|
+
};
|
|
117
|
+
}
|
|
118
|
+
function getPaddingObject(padding) {
|
|
119
|
+
return typeof padding !== 'number' ? expandPaddingObject(padding) : {
|
|
120
|
+
top: padding,
|
|
121
|
+
right: padding,
|
|
122
|
+
bottom: padding,
|
|
123
|
+
left: padding
|
|
124
|
+
};
|
|
125
|
+
}
|
|
126
|
+
function rectToClientRect(rect) {
|
|
127
|
+
const {
|
|
128
|
+
x,
|
|
129
|
+
y,
|
|
130
|
+
width,
|
|
131
|
+
height
|
|
132
|
+
} = rect;
|
|
133
|
+
return {
|
|
134
|
+
width,
|
|
135
|
+
height,
|
|
136
|
+
top: y,
|
|
137
|
+
left: x,
|
|
138
|
+
right: x + width,
|
|
139
|
+
bottom: y + height,
|
|
140
|
+
x,
|
|
141
|
+
y
|
|
142
|
+
};
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
function computeCoordsFromPlacement(_ref, placement, rtl) {
|
|
146
|
+
let {
|
|
147
|
+
reference,
|
|
148
|
+
floating
|
|
149
|
+
} = _ref;
|
|
150
|
+
const sideAxis = getSideAxis(placement);
|
|
151
|
+
const alignmentAxis = getAlignmentAxis(placement);
|
|
152
|
+
const alignLength = getAxisLength(alignmentAxis);
|
|
153
|
+
const side = getSide(placement);
|
|
154
|
+
const isVertical = sideAxis === 'y';
|
|
155
|
+
const commonX = reference.x + reference.width / 2 - floating.width / 2;
|
|
156
|
+
const commonY = reference.y + reference.height / 2 - floating.height / 2;
|
|
157
|
+
const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
|
|
158
|
+
let coords;
|
|
159
|
+
switch (side) {
|
|
160
|
+
case 'top':
|
|
161
|
+
coords = {
|
|
162
|
+
x: commonX,
|
|
163
|
+
y: reference.y - floating.height
|
|
164
|
+
};
|
|
165
|
+
break;
|
|
166
|
+
case 'bottom':
|
|
167
|
+
coords = {
|
|
168
|
+
x: commonX,
|
|
169
|
+
y: reference.y + reference.height
|
|
170
|
+
};
|
|
171
|
+
break;
|
|
172
|
+
case 'right':
|
|
173
|
+
coords = {
|
|
174
|
+
x: reference.x + reference.width,
|
|
175
|
+
y: commonY
|
|
176
|
+
};
|
|
177
|
+
break;
|
|
178
|
+
case 'left':
|
|
179
|
+
coords = {
|
|
180
|
+
x: reference.x - floating.width,
|
|
181
|
+
y: commonY
|
|
182
|
+
};
|
|
183
|
+
break;
|
|
184
|
+
default:
|
|
185
|
+
coords = {
|
|
186
|
+
x: reference.x,
|
|
187
|
+
y: reference.y
|
|
188
|
+
};
|
|
189
|
+
}
|
|
190
|
+
switch (getAlignment(placement)) {
|
|
191
|
+
case 'start':
|
|
192
|
+
coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
|
|
193
|
+
break;
|
|
194
|
+
case 'end':
|
|
195
|
+
coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
|
|
196
|
+
break;
|
|
197
|
+
}
|
|
198
|
+
return coords;
|
|
199
|
+
}
|
|
200
|
+
|
|
201
|
+
/**
|
|
202
|
+
* Resolves with an object of overflow side offsets that determine how much the
|
|
203
|
+
* element is overflowing a given clipping boundary on each side.
|
|
204
|
+
* - positive = overflowing the boundary by that number of pixels
|
|
205
|
+
* - negative = how many pixels left before it will overflow
|
|
206
|
+
* - 0 = lies flush with the boundary
|
|
207
|
+
* @see https://floating-ui.com/docs/detectOverflow
|
|
208
|
+
*/
|
|
209
|
+
async function detectOverflow(state, options) {
|
|
210
|
+
var _await$platform$isEle;
|
|
211
|
+
if (options === void 0) {
|
|
212
|
+
options = {};
|
|
213
|
+
}
|
|
214
|
+
const {
|
|
215
|
+
x,
|
|
216
|
+
y,
|
|
217
|
+
platform,
|
|
218
|
+
rects,
|
|
219
|
+
elements,
|
|
220
|
+
strategy
|
|
221
|
+
} = state;
|
|
222
|
+
const {
|
|
223
|
+
boundary = 'clippingAncestors',
|
|
224
|
+
rootBoundary = 'viewport',
|
|
225
|
+
elementContext = 'floating',
|
|
226
|
+
altBoundary = false,
|
|
227
|
+
padding = 0
|
|
228
|
+
} = evaluate(options, state);
|
|
229
|
+
const paddingObject = getPaddingObject(padding);
|
|
230
|
+
const altContext = elementContext === 'floating' ? 'reference' : 'floating';
|
|
231
|
+
const element = elements[altBoundary ? altContext : elementContext];
|
|
232
|
+
const clippingClientRect = rectToClientRect(await platform.getClippingRect({
|
|
233
|
+
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))),
|
|
234
|
+
boundary,
|
|
235
|
+
rootBoundary,
|
|
236
|
+
strategy
|
|
237
|
+
}));
|
|
238
|
+
const rect = elementContext === 'floating' ? {
|
|
239
|
+
x,
|
|
240
|
+
y,
|
|
241
|
+
width: rects.floating.width,
|
|
242
|
+
height: rects.floating.height
|
|
243
|
+
} : rects.reference;
|
|
244
|
+
const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
|
|
245
|
+
const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
|
|
246
|
+
x: 1,
|
|
247
|
+
y: 1
|
|
248
|
+
} : {
|
|
249
|
+
x: 1,
|
|
250
|
+
y: 1
|
|
251
|
+
};
|
|
252
|
+
const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
253
|
+
elements,
|
|
254
|
+
rect,
|
|
255
|
+
offsetParent,
|
|
256
|
+
strategy
|
|
257
|
+
}) : rect);
|
|
258
|
+
return {
|
|
259
|
+
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
260
|
+
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
261
|
+
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
262
|
+
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
263
|
+
};
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
// Maximum number of resets that can occur before bailing to avoid infinite reset loops.
|
|
267
|
+
const MAX_RESET_COUNT = 50;
|
|
268
|
+
|
|
269
|
+
/**
|
|
270
|
+
* Computes the `x` and `y` coordinates that will place the floating element
|
|
271
|
+
* next to a given reference element.
|
|
272
|
+
*
|
|
273
|
+
* This export does not have any `platform` interface logic. You will need to
|
|
274
|
+
* write one for the platform you are using Floating UI with.
|
|
275
|
+
*/
|
|
276
|
+
const computePosition$1 = async (reference, floating, config) => {
|
|
277
|
+
const {
|
|
278
|
+
placement = 'bottom',
|
|
279
|
+
strategy = 'absolute',
|
|
280
|
+
middleware = [],
|
|
281
|
+
platform
|
|
282
|
+
} = config;
|
|
283
|
+
const platformWithDetectOverflow = platform.detectOverflow ? platform : {
|
|
284
|
+
...platform,
|
|
285
|
+
detectOverflow
|
|
286
|
+
};
|
|
287
|
+
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
|
|
288
|
+
let rects = await platform.getElementRects({
|
|
289
|
+
reference,
|
|
290
|
+
floating,
|
|
291
|
+
strategy
|
|
292
|
+
});
|
|
293
|
+
let {
|
|
294
|
+
x,
|
|
295
|
+
y
|
|
296
|
+
} = computeCoordsFromPlacement(rects, placement, rtl);
|
|
297
|
+
let statefulPlacement = placement;
|
|
298
|
+
let resetCount = 0;
|
|
299
|
+
const middlewareData = {};
|
|
300
|
+
for (let i = 0; i < middleware.length; i++) {
|
|
301
|
+
const currentMiddleware = middleware[i];
|
|
302
|
+
if (!currentMiddleware) {
|
|
303
|
+
continue;
|
|
304
|
+
}
|
|
305
|
+
const {
|
|
306
|
+
name,
|
|
307
|
+
fn
|
|
308
|
+
} = currentMiddleware;
|
|
309
|
+
const {
|
|
310
|
+
x: nextX,
|
|
311
|
+
y: nextY,
|
|
312
|
+
data,
|
|
313
|
+
reset
|
|
314
|
+
} = await fn({
|
|
315
|
+
x,
|
|
316
|
+
y,
|
|
317
|
+
initialPlacement: placement,
|
|
318
|
+
placement: statefulPlacement,
|
|
319
|
+
strategy,
|
|
320
|
+
middlewareData,
|
|
321
|
+
rects,
|
|
322
|
+
platform: platformWithDetectOverflow,
|
|
323
|
+
elements: {
|
|
324
|
+
reference,
|
|
325
|
+
floating
|
|
326
|
+
}
|
|
327
|
+
});
|
|
328
|
+
x = nextX != null ? nextX : x;
|
|
329
|
+
y = nextY != null ? nextY : y;
|
|
330
|
+
middlewareData[name] = {
|
|
331
|
+
...middlewareData[name],
|
|
332
|
+
...data
|
|
333
|
+
};
|
|
334
|
+
if (reset && resetCount < MAX_RESET_COUNT) {
|
|
335
|
+
resetCount++;
|
|
336
|
+
if (typeof reset === 'object') {
|
|
337
|
+
if (reset.placement) {
|
|
338
|
+
statefulPlacement = reset.placement;
|
|
339
|
+
}
|
|
340
|
+
if (reset.rects) {
|
|
341
|
+
rects = reset.rects === true ? await platform.getElementRects({
|
|
342
|
+
reference,
|
|
343
|
+
floating,
|
|
344
|
+
strategy
|
|
345
|
+
}) : reset.rects;
|
|
346
|
+
}
|
|
347
|
+
({
|
|
348
|
+
x,
|
|
349
|
+
y
|
|
350
|
+
} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
|
|
351
|
+
}
|
|
352
|
+
i = -1;
|
|
353
|
+
}
|
|
354
|
+
}
|
|
355
|
+
return {
|
|
356
|
+
x,
|
|
357
|
+
y,
|
|
358
|
+
placement: statefulPlacement,
|
|
359
|
+
strategy,
|
|
360
|
+
middlewareData
|
|
361
|
+
};
|
|
118
362
|
};
|
|
119
363
|
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
364
|
+
/**
|
|
365
|
+
* Provides data to position an inner element of the floating element so that it
|
|
366
|
+
* appears centered to the reference element.
|
|
367
|
+
* @see https://floating-ui.com/docs/arrow
|
|
368
|
+
*/
|
|
369
|
+
const arrow$3 = options => ({
|
|
370
|
+
name: 'arrow',
|
|
371
|
+
options,
|
|
372
|
+
async fn(state) {
|
|
373
|
+
const {
|
|
374
|
+
x,
|
|
375
|
+
y,
|
|
376
|
+
placement,
|
|
377
|
+
rects,
|
|
378
|
+
platform,
|
|
379
|
+
elements,
|
|
380
|
+
middlewareData
|
|
381
|
+
} = state;
|
|
382
|
+
// Since `element` is required, we don't Partial<> the type.
|
|
383
|
+
const {
|
|
384
|
+
element,
|
|
385
|
+
padding = 0
|
|
386
|
+
} = evaluate(options, state) || {};
|
|
387
|
+
if (element == null) {
|
|
388
|
+
return {};
|
|
389
|
+
}
|
|
390
|
+
const paddingObject = getPaddingObject(padding);
|
|
391
|
+
const coords = {
|
|
392
|
+
x,
|
|
393
|
+
y
|
|
394
|
+
};
|
|
395
|
+
const axis = getAlignmentAxis(placement);
|
|
396
|
+
const length = getAxisLength(axis);
|
|
397
|
+
const arrowDimensions = await platform.getDimensions(element);
|
|
398
|
+
const isYAxis = axis === 'y';
|
|
399
|
+
const minProp = isYAxis ? 'top' : 'left';
|
|
400
|
+
const maxProp = isYAxis ? 'bottom' : 'right';
|
|
401
|
+
const clientProp = isYAxis ? 'clientHeight' : 'clientWidth';
|
|
402
|
+
const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
|
|
403
|
+
const startDiff = coords[axis] - rects.reference[axis];
|
|
404
|
+
const arrowOffsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(element));
|
|
405
|
+
let clientSize = arrowOffsetParent ? arrowOffsetParent[clientProp] : 0;
|
|
406
|
+
|
|
407
|
+
// DOM platform can return `window` as the `offsetParent`.
|
|
408
|
+
if (!clientSize || !(await (platform.isElement == null ? void 0 : platform.isElement(arrowOffsetParent)))) {
|
|
409
|
+
clientSize = elements.floating[clientProp] || rects.floating[length];
|
|
410
|
+
}
|
|
411
|
+
const centerToReference = endDiff / 2 - startDiff / 2;
|
|
412
|
+
|
|
413
|
+
// If the padding is large enough that it causes the arrow to no longer be
|
|
414
|
+
// centered, modify the padding so that it is centered.
|
|
415
|
+
const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1;
|
|
416
|
+
const minPadding = min(paddingObject[minProp], largestPossiblePadding);
|
|
417
|
+
const maxPadding = min(paddingObject[maxProp], largestPossiblePadding);
|
|
418
|
+
|
|
419
|
+
// Make sure the arrow doesn't overflow the floating element if the center
|
|
420
|
+
// point is outside the floating element's bounds.
|
|
421
|
+
const min$1 = minPadding;
|
|
422
|
+
const max = clientSize - arrowDimensions[length] - maxPadding;
|
|
423
|
+
const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
|
|
424
|
+
const offset = clamp(min$1, center, max);
|
|
425
|
+
|
|
426
|
+
// If the reference is small enough that the arrow's padding causes it to
|
|
427
|
+
// to point to nothing for an aligned placement, adjust the offset of the
|
|
428
|
+
// floating element itself. To ensure `shift()` continues to take action,
|
|
429
|
+
// a single reset is performed when this is true.
|
|
430
|
+
const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset && rects.reference[length] / 2 - (center < min$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
|
|
431
|
+
const alignmentOffset = shouldAddOffset ? center < min$1 ? center - min$1 : center - max : 0;
|
|
432
|
+
return {
|
|
433
|
+
[axis]: coords[axis] + alignmentOffset,
|
|
434
|
+
data: {
|
|
435
|
+
[axis]: offset,
|
|
436
|
+
centerOffset: center - offset - alignmentOffset,
|
|
437
|
+
...(shouldAddOffset && {
|
|
438
|
+
alignmentOffset
|
|
439
|
+
})
|
|
440
|
+
},
|
|
441
|
+
reset: shouldAddOffset
|
|
442
|
+
};
|
|
443
|
+
}
|
|
444
|
+
});
|
|
445
|
+
|
|
446
|
+
/**
|
|
447
|
+
* Optimizes the visibility of the floating element by flipping the `placement`
|
|
448
|
+
* in order to keep it in view when the preferred placement(s) will overflow the
|
|
449
|
+
* clipping boundary. Alternative to `autoPlacement`.
|
|
450
|
+
* @see https://floating-ui.com/docs/flip
|
|
451
|
+
*/
|
|
452
|
+
const flip$2 = function (options) {
|
|
453
|
+
if (options === void 0) {
|
|
454
|
+
options = {};
|
|
455
|
+
}
|
|
456
|
+
return {
|
|
457
|
+
name: 'flip',
|
|
458
|
+
options,
|
|
459
|
+
async fn(state) {
|
|
460
|
+
var _middlewareData$arrow, _middlewareData$flip;
|
|
461
|
+
const {
|
|
462
|
+
placement,
|
|
463
|
+
middlewareData,
|
|
464
|
+
rects,
|
|
465
|
+
initialPlacement,
|
|
466
|
+
platform,
|
|
467
|
+
elements
|
|
468
|
+
} = state;
|
|
469
|
+
const {
|
|
470
|
+
mainAxis: checkMainAxis = true,
|
|
471
|
+
crossAxis: checkCrossAxis = true,
|
|
472
|
+
fallbackPlacements: specifiedFallbackPlacements,
|
|
473
|
+
fallbackStrategy = 'bestFit',
|
|
474
|
+
fallbackAxisSideDirection = 'none',
|
|
475
|
+
flipAlignment = true,
|
|
476
|
+
...detectOverflowOptions
|
|
477
|
+
} = evaluate(options, state);
|
|
478
|
+
|
|
479
|
+
// If a reset by the arrow was caused due to an alignment offset being
|
|
480
|
+
// added, we should skip any logic now since `flip()` has already done its
|
|
481
|
+
// work.
|
|
482
|
+
// https://github.com/floating-ui/floating-ui/issues/2549#issuecomment-1719601643
|
|
483
|
+
if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
484
|
+
return {};
|
|
485
|
+
}
|
|
486
|
+
const side = getSide(placement);
|
|
487
|
+
const initialSideAxis = getSideAxis(initialPlacement);
|
|
488
|
+
const isBasePlacement = getSide(initialPlacement) === initialPlacement;
|
|
489
|
+
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
|
|
490
|
+
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
|
|
491
|
+
const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== 'none';
|
|
492
|
+
if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) {
|
|
493
|
+
fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
|
|
494
|
+
}
|
|
495
|
+
const placements = [initialPlacement, ...fallbackPlacements];
|
|
496
|
+
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
497
|
+
const overflows = [];
|
|
498
|
+
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
|
|
499
|
+
if (checkMainAxis) {
|
|
500
|
+
overflows.push(overflow[side]);
|
|
501
|
+
}
|
|
502
|
+
if (checkCrossAxis) {
|
|
503
|
+
const sides = getAlignmentSides(placement, rects, rtl);
|
|
504
|
+
overflows.push(overflow[sides[0]], overflow[sides[1]]);
|
|
505
|
+
}
|
|
506
|
+
overflowsData = [...overflowsData, {
|
|
507
|
+
placement,
|
|
508
|
+
overflows
|
|
509
|
+
}];
|
|
510
|
+
|
|
511
|
+
// One or more sides is overflowing.
|
|
512
|
+
if (!overflows.every(side => side <= 0)) {
|
|
513
|
+
var _middlewareData$flip2, _overflowsData$filter;
|
|
514
|
+
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
|
|
515
|
+
const nextPlacement = placements[nextIndex];
|
|
516
|
+
if (nextPlacement) {
|
|
517
|
+
const ignoreCrossAxisOverflow = checkCrossAxis === 'alignment' ? initialSideAxis !== getSideAxis(nextPlacement) : false;
|
|
518
|
+
if (!ignoreCrossAxisOverflow ||
|
|
519
|
+
// We leave the current main axis only if every placement on that axis
|
|
520
|
+
// overflows the main axis.
|
|
521
|
+
overflowsData.every(d => getSideAxis(d.placement) === initialSideAxis ? d.overflows[0] > 0 : true)) {
|
|
522
|
+
// Try next placement and re-run the lifecycle.
|
|
523
|
+
return {
|
|
524
|
+
data: {
|
|
525
|
+
index: nextIndex,
|
|
526
|
+
overflows: overflowsData
|
|
527
|
+
},
|
|
528
|
+
reset: {
|
|
529
|
+
placement: nextPlacement
|
|
530
|
+
}
|
|
129
531
|
};
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
this.publish({
|
|
156
|
-
...toast,
|
|
157
|
-
...data,
|
|
158
|
-
id,
|
|
159
|
-
title: message
|
|
160
|
-
});
|
|
161
|
-
return {
|
|
162
|
-
...toast,
|
|
163
|
-
...data,
|
|
164
|
-
id,
|
|
165
|
-
dismissible,
|
|
166
|
-
title: message
|
|
167
|
-
};
|
|
168
|
-
}
|
|
169
|
-
return toast;
|
|
170
|
-
});
|
|
171
|
-
} else {
|
|
172
|
-
this.addToast({
|
|
173
|
-
title: message,
|
|
174
|
-
...rest,
|
|
175
|
-
dismissible,
|
|
176
|
-
id
|
|
177
|
-
});
|
|
178
|
-
}
|
|
179
|
-
return id;
|
|
180
|
-
};
|
|
181
|
-
this.dismiss = (id)=>{
|
|
182
|
-
if (id) {
|
|
183
|
-
this.dismissedToasts.add(id);
|
|
184
|
-
requestAnimationFrame(()=>this.subscribers.forEach((subscriber)=>subscriber({
|
|
185
|
-
id,
|
|
186
|
-
dismiss: true
|
|
187
|
-
})));
|
|
188
|
-
} else {
|
|
189
|
-
this.toasts.forEach((toast)=>{
|
|
190
|
-
this.subscribers.forEach((subscriber)=>subscriber({
|
|
191
|
-
id: toast.id,
|
|
192
|
-
dismiss: true
|
|
193
|
-
}));
|
|
194
|
-
});
|
|
195
|
-
}
|
|
196
|
-
return id;
|
|
197
|
-
};
|
|
198
|
-
this.message = (message, data)=>{
|
|
199
|
-
return this.create({
|
|
200
|
-
...data,
|
|
201
|
-
message
|
|
202
|
-
});
|
|
203
|
-
};
|
|
204
|
-
this.error = (message, data)=>{
|
|
205
|
-
return this.create({
|
|
206
|
-
...data,
|
|
207
|
-
message,
|
|
208
|
-
type: 'error'
|
|
209
|
-
});
|
|
210
|
-
};
|
|
211
|
-
this.success = (message, data)=>{
|
|
212
|
-
return this.create({
|
|
213
|
-
...data,
|
|
214
|
-
type: 'success',
|
|
215
|
-
message
|
|
216
|
-
});
|
|
217
|
-
};
|
|
218
|
-
this.info = (message, data)=>{
|
|
219
|
-
return this.create({
|
|
220
|
-
...data,
|
|
221
|
-
type: 'info',
|
|
222
|
-
message
|
|
223
|
-
});
|
|
224
|
-
};
|
|
225
|
-
this.warning = (message, data)=>{
|
|
226
|
-
return this.create({
|
|
227
|
-
...data,
|
|
228
|
-
type: 'warning',
|
|
229
|
-
message
|
|
230
|
-
});
|
|
231
|
-
};
|
|
232
|
-
this.loading = (message, data)=>{
|
|
233
|
-
return this.create({
|
|
234
|
-
...data,
|
|
235
|
-
type: 'loading',
|
|
236
|
-
message
|
|
237
|
-
});
|
|
238
|
-
};
|
|
239
|
-
this.promise = (promise, data)=>{
|
|
240
|
-
if (!data) {
|
|
241
|
-
// Nothing to show
|
|
242
|
-
return;
|
|
243
|
-
}
|
|
244
|
-
let id = undefined;
|
|
245
|
-
if (data.loading !== undefined) {
|
|
246
|
-
id = this.create({
|
|
247
|
-
...data,
|
|
248
|
-
promise,
|
|
249
|
-
type: 'loading',
|
|
250
|
-
message: data.loading,
|
|
251
|
-
description: typeof data.description !== 'function' ? data.description : undefined
|
|
252
|
-
});
|
|
253
|
-
}
|
|
254
|
-
const p = Promise.resolve(promise instanceof Function ? promise() : promise);
|
|
255
|
-
let shouldDismiss = id !== undefined;
|
|
256
|
-
let result;
|
|
257
|
-
const originalPromise = p.then(async (response)=>{
|
|
258
|
-
result = [
|
|
259
|
-
'resolve',
|
|
260
|
-
response
|
|
261
|
-
];
|
|
262
|
-
const isReactElementResponse = React__default.isValidElement(response);
|
|
263
|
-
if (isReactElementResponse) {
|
|
264
|
-
shouldDismiss = false;
|
|
265
|
-
this.create({
|
|
266
|
-
id,
|
|
267
|
-
type: 'default',
|
|
268
|
-
message: response
|
|
269
|
-
});
|
|
270
|
-
} else if (isHttpResponse(response) && !response.ok) {
|
|
271
|
-
shouldDismiss = false;
|
|
272
|
-
const promiseData = typeof data.error === 'function' ? await data.error(`HTTP error! status: ${response.status}`) : data.error;
|
|
273
|
-
const description = typeof data.description === 'function' ? await data.description(`HTTP error! status: ${response.status}`) : data.description;
|
|
274
|
-
const isExtendedResult = typeof promiseData === 'object' && !React__default.isValidElement(promiseData);
|
|
275
|
-
const toastSettings = isExtendedResult ? promiseData : {
|
|
276
|
-
message: promiseData
|
|
277
|
-
};
|
|
278
|
-
this.create({
|
|
279
|
-
id,
|
|
280
|
-
type: 'error',
|
|
281
|
-
description,
|
|
282
|
-
...toastSettings
|
|
283
|
-
});
|
|
284
|
-
} else if (response instanceof Error) {
|
|
285
|
-
shouldDismiss = false;
|
|
286
|
-
const promiseData = typeof data.error === 'function' ? await data.error(response) : data.error;
|
|
287
|
-
const description = typeof data.description === 'function' ? await data.description(response) : data.description;
|
|
288
|
-
const isExtendedResult = typeof promiseData === 'object' && !React__default.isValidElement(promiseData);
|
|
289
|
-
const toastSettings = isExtendedResult ? promiseData : {
|
|
290
|
-
message: promiseData
|
|
291
|
-
};
|
|
292
|
-
this.create({
|
|
293
|
-
id,
|
|
294
|
-
type: 'error',
|
|
295
|
-
description,
|
|
296
|
-
...toastSettings
|
|
297
|
-
});
|
|
298
|
-
} else if (data.success !== undefined) {
|
|
299
|
-
shouldDismiss = false;
|
|
300
|
-
const promiseData = typeof data.success === 'function' ? await data.success(response) : data.success;
|
|
301
|
-
const description = typeof data.description === 'function' ? await data.description(response) : data.description;
|
|
302
|
-
const isExtendedResult = typeof promiseData === 'object' && !React__default.isValidElement(promiseData);
|
|
303
|
-
const toastSettings = isExtendedResult ? promiseData : {
|
|
304
|
-
message: promiseData
|
|
305
|
-
};
|
|
306
|
-
this.create({
|
|
307
|
-
id,
|
|
308
|
-
type: 'success',
|
|
309
|
-
description,
|
|
310
|
-
...toastSettings
|
|
311
|
-
});
|
|
312
|
-
}
|
|
313
|
-
}).catch(async (error)=>{
|
|
314
|
-
result = [
|
|
315
|
-
'reject',
|
|
316
|
-
error
|
|
317
|
-
];
|
|
318
|
-
if (data.error !== undefined) {
|
|
319
|
-
shouldDismiss = false;
|
|
320
|
-
const promiseData = typeof data.error === 'function' ? await data.error(error) : data.error;
|
|
321
|
-
const description = typeof data.description === 'function' ? await data.description(error) : data.description;
|
|
322
|
-
const isExtendedResult = typeof promiseData === 'object' && !React__default.isValidElement(promiseData);
|
|
323
|
-
const toastSettings = isExtendedResult ? promiseData : {
|
|
324
|
-
message: promiseData
|
|
325
|
-
};
|
|
326
|
-
this.create({
|
|
327
|
-
id,
|
|
328
|
-
type: 'error',
|
|
329
|
-
description,
|
|
330
|
-
...toastSettings
|
|
331
|
-
});
|
|
332
|
-
}
|
|
333
|
-
}).finally(()=>{
|
|
334
|
-
if (shouldDismiss) {
|
|
335
|
-
// Toast is still in load state (and will be indefinitely — dismiss it)
|
|
336
|
-
this.dismiss(id);
|
|
337
|
-
id = undefined;
|
|
532
|
+
}
|
|
533
|
+
}
|
|
534
|
+
|
|
535
|
+
// First, find the candidates that fit on the mainAxis side of overflow,
|
|
536
|
+
// then find the placement that fits the best on the main crossAxis side.
|
|
537
|
+
let resetPlacement = (_overflowsData$filter = overflowsData.filter(d => d.overflows[0] <= 0).sort((a, b) => a.overflows[1] - b.overflows[1])[0]) == null ? void 0 : _overflowsData$filter.placement;
|
|
538
|
+
|
|
539
|
+
// Otherwise fallback.
|
|
540
|
+
if (!resetPlacement) {
|
|
541
|
+
switch (fallbackStrategy) {
|
|
542
|
+
case 'bestFit':
|
|
543
|
+
{
|
|
544
|
+
var _overflowsData$filter2;
|
|
545
|
+
const placement = (_overflowsData$filter2 = overflowsData.filter(d => {
|
|
546
|
+
if (hasFallbackAxisSideDirection) {
|
|
547
|
+
const currentSideAxis = getSideAxis(d.placement);
|
|
548
|
+
return currentSideAxis === initialSideAxis ||
|
|
549
|
+
// Create a bias to the `y` side axis due to horizontal
|
|
550
|
+
// reading directions favoring greater width.
|
|
551
|
+
currentSideAxis === 'y';
|
|
552
|
+
}
|
|
553
|
+
return true;
|
|
554
|
+
}).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$filter2[0];
|
|
555
|
+
if (placement) {
|
|
556
|
+
resetPlacement = placement;
|
|
338
557
|
}
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
});
|
|
558
|
+
break;
|
|
559
|
+
}
|
|
560
|
+
case 'initialPlacement':
|
|
561
|
+
resetPlacement = initialPlacement;
|
|
562
|
+
break;
|
|
563
|
+
}
|
|
564
|
+
}
|
|
565
|
+
if (placement !== resetPlacement) {
|
|
566
|
+
return {
|
|
567
|
+
reset: {
|
|
568
|
+
placement: resetPlacement
|
|
351
569
|
}
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
570
|
+
};
|
|
571
|
+
}
|
|
572
|
+
}
|
|
573
|
+
return {};
|
|
574
|
+
}
|
|
575
|
+
};
|
|
576
|
+
};
|
|
577
|
+
|
|
578
|
+
function getSideOffsets(overflow, rect) {
|
|
579
|
+
return {
|
|
580
|
+
top: overflow.top - rect.height,
|
|
581
|
+
right: overflow.right - rect.width,
|
|
582
|
+
bottom: overflow.bottom - rect.height,
|
|
583
|
+
left: overflow.left - rect.width
|
|
584
|
+
};
|
|
585
|
+
}
|
|
586
|
+
function isAnySideFullyClipped(overflow) {
|
|
587
|
+
return sides.some(side => overflow[side] >= 0);
|
|
588
|
+
}
|
|
589
|
+
/**
|
|
590
|
+
* Provides data to hide the floating element in applicable situations, such as
|
|
591
|
+
* when it is not in the same clipping context as the reference element.
|
|
592
|
+
* @see https://floating-ui.com/docs/hide
|
|
593
|
+
*/
|
|
594
|
+
const hide$2 = function (options) {
|
|
595
|
+
if (options === void 0) {
|
|
596
|
+
options = {};
|
|
597
|
+
}
|
|
598
|
+
return {
|
|
599
|
+
name: 'hide',
|
|
600
|
+
options,
|
|
601
|
+
async fn(state) {
|
|
602
|
+
const {
|
|
603
|
+
rects,
|
|
604
|
+
platform
|
|
605
|
+
} = state;
|
|
606
|
+
const {
|
|
607
|
+
strategy = 'referenceHidden',
|
|
608
|
+
...detectOverflowOptions
|
|
609
|
+
} = evaluate(options, state);
|
|
610
|
+
switch (strategy) {
|
|
611
|
+
case 'referenceHidden':
|
|
612
|
+
{
|
|
613
|
+
const overflow = await platform.detectOverflow(state, {
|
|
614
|
+
...detectOverflowOptions,
|
|
615
|
+
elementContext: 'reference'
|
|
359
616
|
});
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
617
|
+
const offsets = getSideOffsets(overflow, rects.reference);
|
|
618
|
+
return {
|
|
619
|
+
data: {
|
|
620
|
+
referenceHiddenOffsets: offsets,
|
|
621
|
+
referenceHidden: isAnySideFullyClipped(offsets)
|
|
622
|
+
}
|
|
623
|
+
};
|
|
624
|
+
}
|
|
625
|
+
case 'escaped':
|
|
626
|
+
{
|
|
627
|
+
const overflow = await platform.detectOverflow(state, {
|
|
628
|
+
...detectOverflowOptions,
|
|
629
|
+
altBoundary: true
|
|
630
|
+
});
|
|
631
|
+
const offsets = getSideOffsets(overflow, rects.floating);
|
|
632
|
+
return {
|
|
633
|
+
data: {
|
|
634
|
+
escapedOffsets: offsets,
|
|
635
|
+
escaped: isAnySideFullyClipped(offsets)
|
|
636
|
+
}
|
|
637
|
+
};
|
|
638
|
+
}
|
|
639
|
+
default:
|
|
640
|
+
{
|
|
641
|
+
return {};
|
|
642
|
+
}
|
|
643
|
+
}
|
|
644
|
+
}
|
|
645
|
+
};
|
|
646
|
+
};
|
|
647
|
+
|
|
648
|
+
const originSides = /*#__PURE__*/new Set(['left', 'top']);
|
|
649
|
+
|
|
650
|
+
// For type backwards-compatibility, the `OffsetOptions` type was also
|
|
651
|
+
// Derivable.
|
|
652
|
+
|
|
653
|
+
async function convertValueToCoords(state, options) {
|
|
654
|
+
const {
|
|
655
|
+
placement,
|
|
656
|
+
platform,
|
|
657
|
+
elements
|
|
658
|
+
} = state;
|
|
659
|
+
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
|
|
660
|
+
const side = getSide(placement);
|
|
661
|
+
const alignment = getAlignment(placement);
|
|
662
|
+
const isVertical = getSideAxis(placement) === 'y';
|
|
663
|
+
const mainAxisMulti = originSides.has(side) ? -1 : 1;
|
|
664
|
+
const crossAxisMulti = rtl && isVertical ? -1 : 1;
|
|
665
|
+
const rawValue = evaluate(options, state);
|
|
666
|
+
|
|
667
|
+
// eslint-disable-next-line prefer-const
|
|
668
|
+
let {
|
|
669
|
+
mainAxis,
|
|
670
|
+
crossAxis,
|
|
671
|
+
alignmentAxis
|
|
672
|
+
} = typeof rawValue === 'number' ? {
|
|
673
|
+
mainAxis: rawValue,
|
|
674
|
+
crossAxis: 0,
|
|
675
|
+
alignmentAxis: null
|
|
676
|
+
} : {
|
|
677
|
+
mainAxis: rawValue.mainAxis || 0,
|
|
678
|
+
crossAxis: rawValue.crossAxis || 0,
|
|
679
|
+
alignmentAxis: rawValue.alignmentAxis
|
|
680
|
+
};
|
|
681
|
+
if (alignment && typeof alignmentAxis === 'number') {
|
|
682
|
+
crossAxis = alignment === 'end' ? alignmentAxis * -1 : alignmentAxis;
|
|
683
|
+
}
|
|
684
|
+
return isVertical ? {
|
|
685
|
+
x: crossAxis * crossAxisMulti,
|
|
686
|
+
y: mainAxis * mainAxisMulti
|
|
687
|
+
} : {
|
|
688
|
+
x: mainAxis * mainAxisMulti,
|
|
689
|
+
y: crossAxis * crossAxisMulti
|
|
690
|
+
};
|
|
691
|
+
}
|
|
692
|
+
|
|
693
|
+
/**
|
|
694
|
+
* Modifies the placement by translating the floating element along the
|
|
695
|
+
* specified axes.
|
|
696
|
+
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
|
697
|
+
* object may be passed.
|
|
698
|
+
* @see https://floating-ui.com/docs/offset
|
|
699
|
+
*/
|
|
700
|
+
const offset$2 = function (options) {
|
|
701
|
+
if (options === void 0) {
|
|
702
|
+
options = 0;
|
|
703
|
+
}
|
|
704
|
+
return {
|
|
705
|
+
name: 'offset',
|
|
706
|
+
options,
|
|
707
|
+
async fn(state) {
|
|
708
|
+
var _middlewareData$offse, _middlewareData$arrow;
|
|
709
|
+
const {
|
|
710
|
+
x,
|
|
711
|
+
y,
|
|
712
|
+
placement,
|
|
713
|
+
middlewareData
|
|
714
|
+
} = state;
|
|
715
|
+
const diffCoords = await convertValueToCoords(state, options);
|
|
716
|
+
|
|
717
|
+
// If the placement is the same and the arrow caused an alignment offset
|
|
718
|
+
// then we don't need to change the positioning coordinates.
|
|
719
|
+
if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
720
|
+
return {};
|
|
721
|
+
}
|
|
722
|
+
return {
|
|
723
|
+
x: x + diffCoords.x,
|
|
724
|
+
y: y + diffCoords.y,
|
|
725
|
+
data: {
|
|
726
|
+
...diffCoords,
|
|
727
|
+
placement
|
|
728
|
+
}
|
|
729
|
+
};
|
|
730
|
+
}
|
|
731
|
+
};
|
|
732
|
+
};
|
|
733
|
+
|
|
734
|
+
/**
|
|
735
|
+
* Optimizes the visibility of the floating element by shifting it in order to
|
|
736
|
+
* keep it in view when it will overflow the clipping boundary.
|
|
737
|
+
* @see https://floating-ui.com/docs/shift
|
|
738
|
+
*/
|
|
739
|
+
const shift$2 = function (options) {
|
|
740
|
+
if (options === void 0) {
|
|
741
|
+
options = {};
|
|
742
|
+
}
|
|
743
|
+
return {
|
|
744
|
+
name: 'shift',
|
|
745
|
+
options,
|
|
746
|
+
async fn(state) {
|
|
747
|
+
const {
|
|
748
|
+
x,
|
|
749
|
+
y,
|
|
750
|
+
placement,
|
|
751
|
+
platform
|
|
752
|
+
} = state;
|
|
753
|
+
const {
|
|
754
|
+
mainAxis: checkMainAxis = true,
|
|
755
|
+
crossAxis: checkCrossAxis = false,
|
|
756
|
+
limiter = {
|
|
757
|
+
fn: _ref => {
|
|
758
|
+
let {
|
|
759
|
+
x,
|
|
760
|
+
y
|
|
761
|
+
} = _ref;
|
|
762
|
+
return {
|
|
763
|
+
x,
|
|
764
|
+
y
|
|
765
|
+
};
|
|
766
|
+
}
|
|
767
|
+
},
|
|
768
|
+
...detectOverflowOptions
|
|
769
|
+
} = evaluate(options, state);
|
|
770
|
+
const coords = {
|
|
771
|
+
x,
|
|
772
|
+
y
|
|
773
|
+
};
|
|
774
|
+
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
775
|
+
const crossAxis = getSideAxis(getSide(placement));
|
|
776
|
+
const mainAxis = getOppositeAxis(crossAxis);
|
|
777
|
+
let mainAxisCoord = coords[mainAxis];
|
|
778
|
+
let crossAxisCoord = coords[crossAxis];
|
|
779
|
+
if (checkMainAxis) {
|
|
780
|
+
const minSide = mainAxis === 'y' ? 'top' : 'left';
|
|
781
|
+
const maxSide = mainAxis === 'y' ? 'bottom' : 'right';
|
|
782
|
+
const min = mainAxisCoord + overflow[minSide];
|
|
783
|
+
const max = mainAxisCoord - overflow[maxSide];
|
|
784
|
+
mainAxisCoord = clamp(min, mainAxisCoord, max);
|
|
785
|
+
}
|
|
786
|
+
if (checkCrossAxis) {
|
|
787
|
+
const minSide = crossAxis === 'y' ? 'top' : 'left';
|
|
788
|
+
const maxSide = crossAxis === 'y' ? 'bottom' : 'right';
|
|
789
|
+
const min = crossAxisCoord + overflow[minSide];
|
|
790
|
+
const max = crossAxisCoord - overflow[maxSide];
|
|
791
|
+
crossAxisCoord = clamp(min, crossAxisCoord, max);
|
|
792
|
+
}
|
|
793
|
+
const limitedCoords = limiter.fn({
|
|
794
|
+
...state,
|
|
795
|
+
[mainAxis]: mainAxisCoord,
|
|
796
|
+
[crossAxis]: crossAxisCoord
|
|
797
|
+
});
|
|
798
|
+
return {
|
|
799
|
+
...limitedCoords,
|
|
800
|
+
data: {
|
|
801
|
+
x: limitedCoords.x - x,
|
|
802
|
+
y: limitedCoords.y - y,
|
|
803
|
+
enabled: {
|
|
804
|
+
[mainAxis]: checkMainAxis,
|
|
805
|
+
[crossAxis]: checkCrossAxis
|
|
806
|
+
}
|
|
807
|
+
}
|
|
808
|
+
};
|
|
809
|
+
}
|
|
810
|
+
};
|
|
811
|
+
};
|
|
812
|
+
/**
|
|
813
|
+
* Built-in `limiter` that will stop `shift()` at a certain point.
|
|
814
|
+
*/
|
|
815
|
+
const limitShift$2 = function (options) {
|
|
816
|
+
if (options === void 0) {
|
|
817
|
+
options = {};
|
|
818
|
+
}
|
|
819
|
+
return {
|
|
820
|
+
options,
|
|
821
|
+
fn(state) {
|
|
822
|
+
const {
|
|
823
|
+
x,
|
|
824
|
+
y,
|
|
825
|
+
placement,
|
|
826
|
+
rects,
|
|
827
|
+
middlewareData
|
|
828
|
+
} = state;
|
|
829
|
+
const {
|
|
830
|
+
offset = 0,
|
|
831
|
+
mainAxis: checkMainAxis = true,
|
|
832
|
+
crossAxis: checkCrossAxis = true
|
|
833
|
+
} = evaluate(options, state);
|
|
834
|
+
const coords = {
|
|
835
|
+
x,
|
|
836
|
+
y
|
|
837
|
+
};
|
|
838
|
+
const crossAxis = getSideAxis(placement);
|
|
839
|
+
const mainAxis = getOppositeAxis(crossAxis);
|
|
840
|
+
let mainAxisCoord = coords[mainAxis];
|
|
841
|
+
let crossAxisCoord = coords[crossAxis];
|
|
842
|
+
const rawOffset = evaluate(offset, state);
|
|
843
|
+
const computedOffset = typeof rawOffset === 'number' ? {
|
|
844
|
+
mainAxis: rawOffset,
|
|
845
|
+
crossAxis: 0
|
|
846
|
+
} : {
|
|
847
|
+
mainAxis: 0,
|
|
848
|
+
crossAxis: 0,
|
|
849
|
+
...rawOffset
|
|
850
|
+
};
|
|
851
|
+
if (checkMainAxis) {
|
|
852
|
+
const len = mainAxis === 'y' ? 'height' : 'width';
|
|
853
|
+
const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis;
|
|
854
|
+
const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis;
|
|
855
|
+
if (mainAxisCoord < limitMin) {
|
|
856
|
+
mainAxisCoord = limitMin;
|
|
857
|
+
} else if (mainAxisCoord > limitMax) {
|
|
858
|
+
mainAxisCoord = limitMax;
|
|
859
|
+
}
|
|
860
|
+
}
|
|
861
|
+
if (checkCrossAxis) {
|
|
862
|
+
var _middlewareData$offse, _middlewareData$offse2;
|
|
863
|
+
const len = mainAxis === 'y' ? 'width' : 'height';
|
|
864
|
+
const isOriginSide = originSides.has(getSide(placement));
|
|
865
|
+
const limitMin = rects.reference[crossAxis] - rects.floating[len] + (isOriginSide ? ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse[crossAxis]) || 0 : 0) + (isOriginSide ? 0 : computedOffset.crossAxis);
|
|
866
|
+
const limitMax = rects.reference[crossAxis] + rects.reference[len] + (isOriginSide ? 0 : ((_middlewareData$offse2 = middlewareData.offset) == null ? void 0 : _middlewareData$offse2[crossAxis]) || 0) - (isOriginSide ? computedOffset.crossAxis : 0);
|
|
867
|
+
if (crossAxisCoord < limitMin) {
|
|
868
|
+
crossAxisCoord = limitMin;
|
|
869
|
+
} else if (crossAxisCoord > limitMax) {
|
|
870
|
+
crossAxisCoord = limitMax;
|
|
871
|
+
}
|
|
872
|
+
}
|
|
873
|
+
return {
|
|
874
|
+
[mainAxis]: mainAxisCoord,
|
|
875
|
+
[crossAxis]: crossAxisCoord
|
|
876
|
+
};
|
|
877
|
+
}
|
|
878
|
+
};
|
|
879
|
+
};
|
|
880
|
+
|
|
881
|
+
/**
|
|
882
|
+
* Provides data that allows you to change the size of the floating element —
|
|
883
|
+
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
884
|
+
* width of the reference element.
|
|
885
|
+
* @see https://floating-ui.com/docs/size
|
|
886
|
+
*/
|
|
887
|
+
const size$2 = function (options) {
|
|
888
|
+
if (options === void 0) {
|
|
889
|
+
options = {};
|
|
890
|
+
}
|
|
891
|
+
return {
|
|
892
|
+
name: 'size',
|
|
893
|
+
options,
|
|
894
|
+
async fn(state) {
|
|
895
|
+
var _state$middlewareData, _state$middlewareData2;
|
|
896
|
+
const {
|
|
897
|
+
placement,
|
|
898
|
+
rects,
|
|
899
|
+
platform,
|
|
900
|
+
elements
|
|
901
|
+
} = state;
|
|
902
|
+
const {
|
|
903
|
+
apply = () => {},
|
|
904
|
+
...detectOverflowOptions
|
|
905
|
+
} = evaluate(options, state);
|
|
906
|
+
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
907
|
+
const side = getSide(placement);
|
|
908
|
+
const alignment = getAlignment(placement);
|
|
909
|
+
const isYAxis = getSideAxis(placement) === 'y';
|
|
910
|
+
const {
|
|
911
|
+
width,
|
|
912
|
+
height
|
|
913
|
+
} = rects.floating;
|
|
914
|
+
let heightSide;
|
|
915
|
+
let widthSide;
|
|
916
|
+
if (side === 'top' || side === 'bottom') {
|
|
917
|
+
heightSide = side;
|
|
918
|
+
widthSide = alignment === ((await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating))) ? 'start' : 'end') ? 'left' : 'right';
|
|
919
|
+
} else {
|
|
920
|
+
widthSide = side;
|
|
921
|
+
heightSide = alignment === 'end' ? 'top' : 'bottom';
|
|
922
|
+
}
|
|
923
|
+
const maximumClippingHeight = height - overflow.top - overflow.bottom;
|
|
924
|
+
const maximumClippingWidth = width - overflow.left - overflow.right;
|
|
925
|
+
const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight);
|
|
926
|
+
const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
|
|
927
|
+
const noShift = !state.middlewareData.shift;
|
|
928
|
+
let availableHeight = overflowAvailableHeight;
|
|
929
|
+
let availableWidth = overflowAvailableWidth;
|
|
930
|
+
if ((_state$middlewareData = state.middlewareData.shift) != null && _state$middlewareData.enabled.x) {
|
|
931
|
+
availableWidth = maximumClippingWidth;
|
|
932
|
+
}
|
|
933
|
+
if ((_state$middlewareData2 = state.middlewareData.shift) != null && _state$middlewareData2.enabled.y) {
|
|
934
|
+
availableHeight = maximumClippingHeight;
|
|
935
|
+
}
|
|
936
|
+
if (noShift && !alignment) {
|
|
937
|
+
const xMin = max(overflow.left, 0);
|
|
938
|
+
const xMax = max(overflow.right, 0);
|
|
939
|
+
const yMin = max(overflow.top, 0);
|
|
940
|
+
const yMax = max(overflow.bottom, 0);
|
|
941
|
+
if (isYAxis) {
|
|
942
|
+
availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
|
|
943
|
+
} else {
|
|
944
|
+
availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
|
|
945
|
+
}
|
|
946
|
+
}
|
|
947
|
+
await apply({
|
|
948
|
+
...state,
|
|
949
|
+
availableWidth,
|
|
950
|
+
availableHeight
|
|
951
|
+
});
|
|
952
|
+
const nextDimensions = await platform.getDimensions(elements.floating);
|
|
953
|
+
if (width !== nextDimensions.width || height !== nextDimensions.height) {
|
|
954
|
+
return {
|
|
955
|
+
reset: {
|
|
956
|
+
rects: true
|
|
957
|
+
}
|
|
364
958
|
};
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
this.dismissedToasts = new Set();
|
|
959
|
+
}
|
|
960
|
+
return {};
|
|
368
961
|
}
|
|
962
|
+
};
|
|
963
|
+
};
|
|
964
|
+
|
|
965
|
+
function hasWindow() {
|
|
966
|
+
return typeof window !== 'undefined';
|
|
369
967
|
}
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
968
|
+
function getNodeName(node) {
|
|
969
|
+
if (isNode(node)) {
|
|
970
|
+
return (node.nodeName || '').toLowerCase();
|
|
971
|
+
}
|
|
972
|
+
// Mocked nodes in testing environments may not be instances of Node. By
|
|
973
|
+
// returning `#document` an infinite loop won't occur.
|
|
974
|
+
// https://github.com/floating-ui/floating-ui/issues/2317
|
|
975
|
+
return '#document';
|
|
976
|
+
}
|
|
977
|
+
function getWindow(node) {
|
|
978
|
+
var _node$ownerDocument;
|
|
979
|
+
return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
|
|
980
|
+
}
|
|
981
|
+
function getDocumentElement(node) {
|
|
982
|
+
var _ref;
|
|
983
|
+
return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
|
|
984
|
+
}
|
|
985
|
+
function isNode(value) {
|
|
986
|
+
if (!hasWindow()) {
|
|
987
|
+
return false;
|
|
988
|
+
}
|
|
989
|
+
return value instanceof Node || value instanceof getWindow(value).Node;
|
|
990
|
+
}
|
|
991
|
+
function isElement(value) {
|
|
992
|
+
if (!hasWindow()) {
|
|
993
|
+
return false;
|
|
994
|
+
}
|
|
995
|
+
return value instanceof Element || value instanceof getWindow(value).Element;
|
|
996
|
+
}
|
|
997
|
+
function isHTMLElement(value) {
|
|
998
|
+
if (!hasWindow()) {
|
|
999
|
+
return false;
|
|
1000
|
+
}
|
|
1001
|
+
return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
|
|
1002
|
+
}
|
|
1003
|
+
function isShadowRoot(value) {
|
|
1004
|
+
if (!hasWindow() || typeof ShadowRoot === 'undefined') {
|
|
1005
|
+
return false;
|
|
1006
|
+
}
|
|
1007
|
+
return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
|
|
1008
|
+
}
|
|
1009
|
+
function isOverflowElement(element) {
|
|
1010
|
+
const {
|
|
1011
|
+
overflow,
|
|
1012
|
+
overflowX,
|
|
1013
|
+
overflowY,
|
|
1014
|
+
display
|
|
1015
|
+
} = getComputedStyle$1(element);
|
|
1016
|
+
return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && display !== 'inline' && display !== 'contents';
|
|
1017
|
+
}
|
|
1018
|
+
function isTableElement(element) {
|
|
1019
|
+
return /^(table|td|th)$/.test(getNodeName(element));
|
|
1020
|
+
}
|
|
1021
|
+
function isTopLayer(element) {
|
|
1022
|
+
try {
|
|
1023
|
+
if (element.matches(':popover-open')) {
|
|
1024
|
+
return true;
|
|
1025
|
+
}
|
|
1026
|
+
} catch (_e) {
|
|
1027
|
+
// no-op
|
|
1028
|
+
}
|
|
1029
|
+
try {
|
|
1030
|
+
return element.matches(':modal');
|
|
1031
|
+
} catch (_e) {
|
|
1032
|
+
return false;
|
|
1033
|
+
}
|
|
1034
|
+
}
|
|
1035
|
+
const willChangeRe = /transform|translate|scale|rotate|perspective|filter/;
|
|
1036
|
+
const containRe = /paint|layout|strict|content/;
|
|
1037
|
+
const isNotNone = value => !!value && value !== 'none';
|
|
1038
|
+
let isWebKitValue;
|
|
1039
|
+
function isContainingBlock(elementOrCss) {
|
|
1040
|
+
const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
|
|
1041
|
+
|
|
1042
|
+
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
1043
|
+
// https://drafts.csswg.org/css-transforms-2/#individual-transforms
|
|
1044
|
+
return isNotNone(css.transform) || isNotNone(css.translate) || isNotNone(css.scale) || isNotNone(css.rotate) || isNotNone(css.perspective) || !isWebKit() && (isNotNone(css.backdropFilter) || isNotNone(css.filter)) || willChangeRe.test(css.willChange || '') || containRe.test(css.contain || '');
|
|
1045
|
+
}
|
|
1046
|
+
function getContainingBlock(element) {
|
|
1047
|
+
let currentNode = getParentNode(element);
|
|
1048
|
+
while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
1049
|
+
if (isContainingBlock(currentNode)) {
|
|
1050
|
+
return currentNode;
|
|
1051
|
+
} else if (isTopLayer(currentNode)) {
|
|
1052
|
+
return null;
|
|
1053
|
+
}
|
|
1054
|
+
currentNode = getParentNode(currentNode);
|
|
1055
|
+
}
|
|
1056
|
+
return null;
|
|
1057
|
+
}
|
|
1058
|
+
function isWebKit() {
|
|
1059
|
+
if (isWebKitValue == null) {
|
|
1060
|
+
isWebKitValue = typeof CSS !== 'undefined' && CSS.supports && CSS.supports('-webkit-backdrop-filter', 'none');
|
|
1061
|
+
}
|
|
1062
|
+
return isWebKitValue;
|
|
1063
|
+
}
|
|
1064
|
+
function isLastTraversableNode(node) {
|
|
1065
|
+
return /^(html|body|#document)$/.test(getNodeName(node));
|
|
1066
|
+
}
|
|
1067
|
+
function getComputedStyle$1(element) {
|
|
1068
|
+
return getWindow(element).getComputedStyle(element);
|
|
1069
|
+
}
|
|
1070
|
+
function getNodeScroll(element) {
|
|
1071
|
+
if (isElement(element)) {
|
|
1072
|
+
return {
|
|
1073
|
+
scrollLeft: element.scrollLeft,
|
|
1074
|
+
scrollTop: element.scrollTop
|
|
1075
|
+
};
|
|
1076
|
+
}
|
|
1077
|
+
return {
|
|
1078
|
+
scrollLeft: element.scrollX,
|
|
1079
|
+
scrollTop: element.scrollY
|
|
1080
|
+
};
|
|
1081
|
+
}
|
|
1082
|
+
function getParentNode(node) {
|
|
1083
|
+
if (getNodeName(node) === 'html') {
|
|
1084
|
+
return node;
|
|
1085
|
+
}
|
|
1086
|
+
const result =
|
|
1087
|
+
// Step into the shadow DOM of the parent of a slotted node.
|
|
1088
|
+
node.assignedSlot ||
|
|
1089
|
+
// DOM Element detected.
|
|
1090
|
+
node.parentNode ||
|
|
1091
|
+
// ShadowRoot detected.
|
|
1092
|
+
isShadowRoot(node) && node.host ||
|
|
1093
|
+
// Fallback.
|
|
1094
|
+
getDocumentElement(node);
|
|
1095
|
+
return isShadowRoot(result) ? result.host : result;
|
|
1096
|
+
}
|
|
1097
|
+
function getNearestOverflowAncestor(node) {
|
|
1098
|
+
const parentNode = getParentNode(node);
|
|
1099
|
+
if (isLastTraversableNode(parentNode)) {
|
|
1100
|
+
return node.ownerDocument ? node.ownerDocument.body : node.body;
|
|
1101
|
+
}
|
|
1102
|
+
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
|
|
1103
|
+
return parentNode;
|
|
1104
|
+
}
|
|
1105
|
+
return getNearestOverflowAncestor(parentNode);
|
|
1106
|
+
}
|
|
1107
|
+
function getOverflowAncestors(node, list, traverseIframes) {
|
|
1108
|
+
var _node$ownerDocument2;
|
|
1109
|
+
if (list === void 0) {
|
|
1110
|
+
list = [];
|
|
1111
|
+
}
|
|
1112
|
+
if (traverseIframes === void 0) {
|
|
1113
|
+
traverseIframes = true;
|
|
1114
|
+
}
|
|
1115
|
+
const scrollableAncestor = getNearestOverflowAncestor(node);
|
|
1116
|
+
const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
|
|
1117
|
+
const win = getWindow(scrollableAncestor);
|
|
1118
|
+
if (isBody) {
|
|
1119
|
+
const frameElement = getFrameElement(win);
|
|
1120
|
+
return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
|
|
1121
|
+
} else {
|
|
1122
|
+
return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
|
|
1123
|
+
}
|
|
1124
|
+
}
|
|
1125
|
+
function getFrameElement(win) {
|
|
1126
|
+
return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
|
|
1127
|
+
}
|
|
1128
|
+
|
|
1129
|
+
function getCssDimensions(element) {
|
|
1130
|
+
const css = getComputedStyle$1(element);
|
|
1131
|
+
// In testing environments, the `width` and `height` properties are empty
|
|
1132
|
+
// strings for SVG elements, returning NaN. Fallback to `0` in this case.
|
|
1133
|
+
let width = parseFloat(css.width) || 0;
|
|
1134
|
+
let height = parseFloat(css.height) || 0;
|
|
1135
|
+
const hasOffset = isHTMLElement(element);
|
|
1136
|
+
const offsetWidth = hasOffset ? element.offsetWidth : width;
|
|
1137
|
+
const offsetHeight = hasOffset ? element.offsetHeight : height;
|
|
1138
|
+
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
|
|
1139
|
+
if (shouldFallback) {
|
|
1140
|
+
width = offsetWidth;
|
|
1141
|
+
height = offsetHeight;
|
|
1142
|
+
}
|
|
1143
|
+
return {
|
|
1144
|
+
width,
|
|
1145
|
+
height,
|
|
1146
|
+
$: shouldFallback
|
|
1147
|
+
};
|
|
1148
|
+
}
|
|
1149
|
+
|
|
1150
|
+
function unwrapElement(element) {
|
|
1151
|
+
return !isElement(element) ? element.contextElement : element;
|
|
1152
|
+
}
|
|
1153
|
+
|
|
1154
|
+
function getScale(element) {
|
|
1155
|
+
const domElement = unwrapElement(element);
|
|
1156
|
+
if (!isHTMLElement(domElement)) {
|
|
1157
|
+
return createCoords(1);
|
|
1158
|
+
}
|
|
1159
|
+
const rect = domElement.getBoundingClientRect();
|
|
1160
|
+
const {
|
|
1161
|
+
width,
|
|
1162
|
+
height,
|
|
1163
|
+
$
|
|
1164
|
+
} = getCssDimensions(domElement);
|
|
1165
|
+
let x = ($ ? round(rect.width) : rect.width) / width;
|
|
1166
|
+
let y = ($ ? round(rect.height) : rect.height) / height;
|
|
1167
|
+
|
|
1168
|
+
// 0, NaN, or Infinity should always fallback to 1.
|
|
1169
|
+
|
|
1170
|
+
if (!x || !Number.isFinite(x)) {
|
|
1171
|
+
x = 1;
|
|
1172
|
+
}
|
|
1173
|
+
if (!y || !Number.isFinite(y)) {
|
|
1174
|
+
y = 1;
|
|
1175
|
+
}
|
|
1176
|
+
return {
|
|
1177
|
+
x,
|
|
1178
|
+
y
|
|
1179
|
+
};
|
|
1180
|
+
}
|
|
1181
|
+
|
|
1182
|
+
const noOffsets = /*#__PURE__*/createCoords(0);
|
|
1183
|
+
function getVisualOffsets(element) {
|
|
1184
|
+
const win = getWindow(element);
|
|
1185
|
+
if (!isWebKit() || !win.visualViewport) {
|
|
1186
|
+
return noOffsets;
|
|
1187
|
+
}
|
|
1188
|
+
return {
|
|
1189
|
+
x: win.visualViewport.offsetLeft,
|
|
1190
|
+
y: win.visualViewport.offsetTop
|
|
1191
|
+
};
|
|
1192
|
+
}
|
|
1193
|
+
function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
|
|
1194
|
+
if (isFixed === void 0) {
|
|
1195
|
+
isFixed = false;
|
|
1196
|
+
}
|
|
1197
|
+
if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
|
|
1198
|
+
return false;
|
|
1199
|
+
}
|
|
1200
|
+
return isFixed;
|
|
1201
|
+
}
|
|
1202
|
+
|
|
1203
|
+
function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
|
|
1204
|
+
if (includeScale === void 0) {
|
|
1205
|
+
includeScale = false;
|
|
1206
|
+
}
|
|
1207
|
+
if (isFixedStrategy === void 0) {
|
|
1208
|
+
isFixedStrategy = false;
|
|
1209
|
+
}
|
|
1210
|
+
const clientRect = element.getBoundingClientRect();
|
|
1211
|
+
const domElement = unwrapElement(element);
|
|
1212
|
+
let scale = createCoords(1);
|
|
1213
|
+
if (includeScale) {
|
|
1214
|
+
if (offsetParent) {
|
|
1215
|
+
if (isElement(offsetParent)) {
|
|
1216
|
+
scale = getScale(offsetParent);
|
|
1217
|
+
}
|
|
1218
|
+
} else {
|
|
1219
|
+
scale = getScale(element);
|
|
1220
|
+
}
|
|
1221
|
+
}
|
|
1222
|
+
const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
|
|
1223
|
+
let x = (clientRect.left + visualOffsets.x) / scale.x;
|
|
1224
|
+
let y = (clientRect.top + visualOffsets.y) / scale.y;
|
|
1225
|
+
let width = clientRect.width / scale.x;
|
|
1226
|
+
let height = clientRect.height / scale.y;
|
|
1227
|
+
if (domElement) {
|
|
1228
|
+
const win = getWindow(domElement);
|
|
1229
|
+
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
|
|
1230
|
+
let currentWin = win;
|
|
1231
|
+
let currentIFrame = getFrameElement(currentWin);
|
|
1232
|
+
while (currentIFrame && offsetParent && offsetWin !== currentWin) {
|
|
1233
|
+
const iframeScale = getScale(currentIFrame);
|
|
1234
|
+
const iframeRect = currentIFrame.getBoundingClientRect();
|
|
1235
|
+
const css = getComputedStyle$1(currentIFrame);
|
|
1236
|
+
const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
|
|
1237
|
+
const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
|
|
1238
|
+
x *= iframeScale.x;
|
|
1239
|
+
y *= iframeScale.y;
|
|
1240
|
+
width *= iframeScale.x;
|
|
1241
|
+
height *= iframeScale.y;
|
|
1242
|
+
x += left;
|
|
1243
|
+
y += top;
|
|
1244
|
+
currentWin = getWindow(currentIFrame);
|
|
1245
|
+
currentIFrame = getFrameElement(currentWin);
|
|
1246
|
+
}
|
|
1247
|
+
}
|
|
1248
|
+
return rectToClientRect({
|
|
1249
|
+
width,
|
|
1250
|
+
height,
|
|
1251
|
+
x,
|
|
1252
|
+
y
|
|
1253
|
+
});
|
|
1254
|
+
}
|
|
1255
|
+
|
|
1256
|
+
// If <html> has a CSS width greater than the viewport, then this will be
|
|
1257
|
+
// incorrect for RTL.
|
|
1258
|
+
function getWindowScrollBarX(element, rect) {
|
|
1259
|
+
const leftScroll = getNodeScroll(element).scrollLeft;
|
|
1260
|
+
if (!rect) {
|
|
1261
|
+
return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
|
|
1262
|
+
}
|
|
1263
|
+
return rect.left + leftScroll;
|
|
1264
|
+
}
|
|
1265
|
+
|
|
1266
|
+
function getHTMLOffset(documentElement, scroll) {
|
|
1267
|
+
const htmlRect = documentElement.getBoundingClientRect();
|
|
1268
|
+
const x = htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect);
|
|
1269
|
+
const y = htmlRect.top + scroll.scrollTop;
|
|
1270
|
+
return {
|
|
1271
|
+
x,
|
|
1272
|
+
y
|
|
1273
|
+
};
|
|
1274
|
+
}
|
|
1275
|
+
|
|
1276
|
+
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
1277
|
+
let {
|
|
1278
|
+
elements,
|
|
1279
|
+
rect,
|
|
1280
|
+
offsetParent,
|
|
1281
|
+
strategy
|
|
1282
|
+
} = _ref;
|
|
1283
|
+
const isFixed = strategy === 'fixed';
|
|
1284
|
+
const documentElement = getDocumentElement(offsetParent);
|
|
1285
|
+
const topLayer = elements ? isTopLayer(elements.floating) : false;
|
|
1286
|
+
if (offsetParent === documentElement || topLayer && isFixed) {
|
|
1287
|
+
return rect;
|
|
1288
|
+
}
|
|
1289
|
+
let scroll = {
|
|
1290
|
+
scrollLeft: 0,
|
|
1291
|
+
scrollTop: 0
|
|
1292
|
+
};
|
|
1293
|
+
let scale = createCoords(1);
|
|
1294
|
+
const offsets = createCoords(0);
|
|
1295
|
+
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
1296
|
+
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
1297
|
+
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
1298
|
+
scroll = getNodeScroll(offsetParent);
|
|
1299
|
+
}
|
|
1300
|
+
if (isOffsetParentAnElement) {
|
|
1301
|
+
const offsetRect = getBoundingClientRect(offsetParent);
|
|
1302
|
+
scale = getScale(offsetParent);
|
|
1303
|
+
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
1304
|
+
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
1305
|
+
}
|
|
1306
|
+
}
|
|
1307
|
+
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
1308
|
+
return {
|
|
1309
|
+
width: rect.width * scale.x,
|
|
1310
|
+
height: rect.height * scale.y,
|
|
1311
|
+
x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
|
|
1312
|
+
y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
|
|
1313
|
+
};
|
|
1314
|
+
}
|
|
1315
|
+
|
|
1316
|
+
function getClientRects(element) {
|
|
1317
|
+
return Array.from(element.getClientRects());
|
|
1318
|
+
}
|
|
1319
|
+
|
|
1320
|
+
// Gets the entire size of the scrollable document area, even extending outside
|
|
1321
|
+
// of the `<html>` and `<body>` rect bounds if horizontally scrollable.
|
|
1322
|
+
function getDocumentRect(element) {
|
|
1323
|
+
const html = getDocumentElement(element);
|
|
1324
|
+
const scroll = getNodeScroll(element);
|
|
1325
|
+
const body = element.ownerDocument.body;
|
|
1326
|
+
const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
|
|
1327
|
+
const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
|
|
1328
|
+
let x = -scroll.scrollLeft + getWindowScrollBarX(element);
|
|
1329
|
+
const y = -scroll.scrollTop;
|
|
1330
|
+
if (getComputedStyle$1(body).direction === 'rtl') {
|
|
1331
|
+
x += max(html.clientWidth, body.clientWidth) - width;
|
|
1332
|
+
}
|
|
1333
|
+
return {
|
|
1334
|
+
width,
|
|
1335
|
+
height,
|
|
1336
|
+
x,
|
|
1337
|
+
y
|
|
1338
|
+
};
|
|
1339
|
+
}
|
|
1340
|
+
|
|
1341
|
+
// Safety check: ensure the scrollbar space is reasonable in case this
|
|
1342
|
+
// calculation is affected by unusual styles.
|
|
1343
|
+
// Most scrollbars leave 15-18px of space.
|
|
1344
|
+
const SCROLLBAR_MAX = 25;
|
|
1345
|
+
function getViewportRect(element, strategy) {
|
|
1346
|
+
const win = getWindow(element);
|
|
1347
|
+
const html = getDocumentElement(element);
|
|
1348
|
+
const visualViewport = win.visualViewport;
|
|
1349
|
+
let width = html.clientWidth;
|
|
1350
|
+
let height = html.clientHeight;
|
|
1351
|
+
let x = 0;
|
|
1352
|
+
let y = 0;
|
|
1353
|
+
if (visualViewport) {
|
|
1354
|
+
width = visualViewport.width;
|
|
1355
|
+
height = visualViewport.height;
|
|
1356
|
+
const visualViewportBased = isWebKit();
|
|
1357
|
+
if (!visualViewportBased || visualViewportBased && strategy === 'fixed') {
|
|
1358
|
+
x = visualViewport.offsetLeft;
|
|
1359
|
+
y = visualViewport.offsetTop;
|
|
1360
|
+
}
|
|
1361
|
+
}
|
|
1362
|
+
const windowScrollbarX = getWindowScrollBarX(html);
|
|
1363
|
+
// <html> `overflow: hidden` + `scrollbar-gutter: stable` reduces the
|
|
1364
|
+
// visual width of the <html> but this is not considered in the size
|
|
1365
|
+
// of `html.clientWidth`.
|
|
1366
|
+
if (windowScrollbarX <= 0) {
|
|
1367
|
+
const doc = html.ownerDocument;
|
|
1368
|
+
const body = doc.body;
|
|
1369
|
+
const bodyStyles = getComputedStyle(body);
|
|
1370
|
+
const bodyMarginInline = doc.compatMode === 'CSS1Compat' ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
|
|
1371
|
+
const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
|
|
1372
|
+
if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) {
|
|
1373
|
+
width -= clippingStableScrollbarWidth;
|
|
1374
|
+
}
|
|
1375
|
+
} else if (windowScrollbarX <= SCROLLBAR_MAX) {
|
|
1376
|
+
// If the <body> scrollbar is on the left, the width needs to be extended
|
|
1377
|
+
// by the scrollbar amount so there isn't extra space on the right.
|
|
1378
|
+
width += windowScrollbarX;
|
|
1379
|
+
}
|
|
1380
|
+
return {
|
|
1381
|
+
width,
|
|
1382
|
+
height,
|
|
1383
|
+
x,
|
|
1384
|
+
y
|
|
1385
|
+
};
|
|
1386
|
+
}
|
|
1387
|
+
|
|
1388
|
+
// Returns the inner client rect, subtracting scrollbars if present.
|
|
1389
|
+
function getInnerBoundingClientRect(element, strategy) {
|
|
1390
|
+
const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
|
|
1391
|
+
const top = clientRect.top + element.clientTop;
|
|
1392
|
+
const left = clientRect.left + element.clientLeft;
|
|
1393
|
+
const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
|
|
1394
|
+
const width = element.clientWidth * scale.x;
|
|
1395
|
+
const height = element.clientHeight * scale.y;
|
|
1396
|
+
const x = left * scale.x;
|
|
1397
|
+
const y = top * scale.y;
|
|
1398
|
+
return {
|
|
1399
|
+
width,
|
|
1400
|
+
height,
|
|
1401
|
+
x,
|
|
1402
|
+
y
|
|
1403
|
+
};
|
|
1404
|
+
}
|
|
1405
|
+
function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
|
|
1406
|
+
let rect;
|
|
1407
|
+
if (clippingAncestor === 'viewport') {
|
|
1408
|
+
rect = getViewportRect(element, strategy);
|
|
1409
|
+
} else if (clippingAncestor === 'document') {
|
|
1410
|
+
rect = getDocumentRect(getDocumentElement(element));
|
|
1411
|
+
} else if (isElement(clippingAncestor)) {
|
|
1412
|
+
rect = getInnerBoundingClientRect(clippingAncestor, strategy);
|
|
1413
|
+
} else {
|
|
1414
|
+
const visualOffsets = getVisualOffsets(element);
|
|
1415
|
+
rect = {
|
|
1416
|
+
x: clippingAncestor.x - visualOffsets.x,
|
|
1417
|
+
y: clippingAncestor.y - visualOffsets.y,
|
|
1418
|
+
width: clippingAncestor.width,
|
|
1419
|
+
height: clippingAncestor.height
|
|
1420
|
+
};
|
|
1421
|
+
}
|
|
1422
|
+
return rectToClientRect(rect);
|
|
1423
|
+
}
|
|
1424
|
+
function hasFixedPositionAncestor(element, stopNode) {
|
|
1425
|
+
const parentNode = getParentNode(element);
|
|
1426
|
+
if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
|
|
1427
|
+
return false;
|
|
1428
|
+
}
|
|
1429
|
+
return getComputedStyle$1(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
|
|
1430
|
+
}
|
|
1431
|
+
|
|
1432
|
+
// A "clipping ancestor" is an `overflow` element with the characteristic of
|
|
1433
|
+
// clipping (or hiding) child elements. This returns all clipping ancestors
|
|
1434
|
+
// of the given element up the tree.
|
|
1435
|
+
function getClippingElementAncestors(element, cache) {
|
|
1436
|
+
const cachedResult = cache.get(element);
|
|
1437
|
+
if (cachedResult) {
|
|
1438
|
+
return cachedResult;
|
|
1439
|
+
}
|
|
1440
|
+
let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
|
|
1441
|
+
let currentContainingBlockComputedStyle = null;
|
|
1442
|
+
const elementIsFixed = getComputedStyle$1(element).position === 'fixed';
|
|
1443
|
+
let currentNode = elementIsFixed ? getParentNode(element) : element;
|
|
1444
|
+
|
|
1445
|
+
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
1446
|
+
while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
1447
|
+
const computedStyle = getComputedStyle$1(currentNode);
|
|
1448
|
+
const currentNodeIsContaining = isContainingBlock(currentNode);
|
|
1449
|
+
if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
|
|
1450
|
+
currentContainingBlockComputedStyle = null;
|
|
1451
|
+
}
|
|
1452
|
+
const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && (currentContainingBlockComputedStyle.position === 'absolute' || currentContainingBlockComputedStyle.position === 'fixed') || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
|
|
1453
|
+
if (shouldDropCurrentNode) {
|
|
1454
|
+
// Drop non-containing blocks.
|
|
1455
|
+
result = result.filter(ancestor => ancestor !== currentNode);
|
|
1456
|
+
} else {
|
|
1457
|
+
// Record last containing block for next iteration.
|
|
1458
|
+
currentContainingBlockComputedStyle = computedStyle;
|
|
1459
|
+
}
|
|
1460
|
+
currentNode = getParentNode(currentNode);
|
|
1461
|
+
}
|
|
1462
|
+
cache.set(element, result);
|
|
1463
|
+
return result;
|
|
1464
|
+
}
|
|
1465
|
+
|
|
1466
|
+
// Gets the maximum area that the element is visible in due to any number of
|
|
1467
|
+
// clipping ancestors.
|
|
1468
|
+
function getClippingRect(_ref) {
|
|
1469
|
+
let {
|
|
1470
|
+
element,
|
|
1471
|
+
boundary,
|
|
1472
|
+
rootBoundary,
|
|
1473
|
+
strategy
|
|
1474
|
+
} = _ref;
|
|
1475
|
+
const elementClippingAncestors = boundary === 'clippingAncestors' ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
|
|
1476
|
+
const clippingAncestors = [...elementClippingAncestors, rootBoundary];
|
|
1477
|
+
const firstRect = getClientRectFromClippingAncestor(element, clippingAncestors[0], strategy);
|
|
1478
|
+
let top = firstRect.top;
|
|
1479
|
+
let right = firstRect.right;
|
|
1480
|
+
let bottom = firstRect.bottom;
|
|
1481
|
+
let left = firstRect.left;
|
|
1482
|
+
for (let i = 1; i < clippingAncestors.length; i++) {
|
|
1483
|
+
const rect = getClientRectFromClippingAncestor(element, clippingAncestors[i], strategy);
|
|
1484
|
+
top = max(rect.top, top);
|
|
1485
|
+
right = min(rect.right, right);
|
|
1486
|
+
bottom = min(rect.bottom, bottom);
|
|
1487
|
+
left = max(rect.left, left);
|
|
1488
|
+
}
|
|
1489
|
+
return {
|
|
1490
|
+
width: right - left,
|
|
1491
|
+
height: bottom - top,
|
|
1492
|
+
x: left,
|
|
1493
|
+
y: top
|
|
1494
|
+
};
|
|
1495
|
+
}
|
|
1496
|
+
|
|
1497
|
+
function getDimensions(element) {
|
|
1498
|
+
const {
|
|
1499
|
+
width,
|
|
1500
|
+
height
|
|
1501
|
+
} = getCssDimensions(element);
|
|
1502
|
+
return {
|
|
1503
|
+
width,
|
|
1504
|
+
height
|
|
1505
|
+
};
|
|
1506
|
+
}
|
|
1507
|
+
|
|
1508
|
+
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
1509
|
+
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
1510
|
+
const documentElement = getDocumentElement(offsetParent);
|
|
1511
|
+
const isFixed = strategy === 'fixed';
|
|
1512
|
+
const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
|
|
1513
|
+
let scroll = {
|
|
1514
|
+
scrollLeft: 0,
|
|
1515
|
+
scrollTop: 0
|
|
1516
|
+
};
|
|
1517
|
+
const offsets = createCoords(0);
|
|
1518
|
+
|
|
1519
|
+
// If the <body> scrollbar appears on the left (e.g. RTL systems). Use
|
|
1520
|
+
// Firefox with layout.scrollbar.side = 3 in about:config to test this.
|
|
1521
|
+
function setLeftRTLScrollbarOffset() {
|
|
1522
|
+
offsets.x = getWindowScrollBarX(documentElement);
|
|
1523
|
+
}
|
|
1524
|
+
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
1525
|
+
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
1526
|
+
scroll = getNodeScroll(offsetParent);
|
|
1527
|
+
}
|
|
1528
|
+
if (isOffsetParentAnElement) {
|
|
1529
|
+
const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
|
|
1530
|
+
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
1531
|
+
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
1532
|
+
} else if (documentElement) {
|
|
1533
|
+
setLeftRTLScrollbarOffset();
|
|
1534
|
+
}
|
|
1535
|
+
}
|
|
1536
|
+
if (isFixed && !isOffsetParentAnElement && documentElement) {
|
|
1537
|
+
setLeftRTLScrollbarOffset();
|
|
1538
|
+
}
|
|
1539
|
+
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
1540
|
+
const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
|
|
1541
|
+
const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
|
|
1542
|
+
return {
|
|
1543
|
+
x,
|
|
1544
|
+
y,
|
|
1545
|
+
width: rect.width,
|
|
1546
|
+
height: rect.height
|
|
1547
|
+
};
|
|
1548
|
+
}
|
|
1549
|
+
|
|
1550
|
+
function isStaticPositioned(element) {
|
|
1551
|
+
return getComputedStyle$1(element).position === 'static';
|
|
1552
|
+
}
|
|
1553
|
+
|
|
1554
|
+
function getTrueOffsetParent(element, polyfill) {
|
|
1555
|
+
if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
|
|
1556
|
+
return null;
|
|
1557
|
+
}
|
|
1558
|
+
if (polyfill) {
|
|
1559
|
+
return polyfill(element);
|
|
1560
|
+
}
|
|
1561
|
+
let rawOffsetParent = element.offsetParent;
|
|
1562
|
+
|
|
1563
|
+
// Firefox returns the <html> element as the offsetParent if it's non-static,
|
|
1564
|
+
// while Chrome and Safari return the <body> element. The <body> element must
|
|
1565
|
+
// be used to perform the correct calculations even if the <html> element is
|
|
1566
|
+
// non-static.
|
|
1567
|
+
if (getDocumentElement(element) === rawOffsetParent) {
|
|
1568
|
+
rawOffsetParent = rawOffsetParent.ownerDocument.body;
|
|
1569
|
+
}
|
|
1570
|
+
return rawOffsetParent;
|
|
1571
|
+
}
|
|
1572
|
+
|
|
1573
|
+
// Gets the closest ancestor positioned element. Handles some edge cases,
|
|
1574
|
+
// such as table ancestors and cross browser bugs.
|
|
1575
|
+
function getOffsetParent(element, polyfill) {
|
|
1576
|
+
const win = getWindow(element);
|
|
1577
|
+
if (isTopLayer(element)) {
|
|
1578
|
+
return win;
|
|
1579
|
+
}
|
|
1580
|
+
if (!isHTMLElement(element)) {
|
|
1581
|
+
let svgOffsetParent = getParentNode(element);
|
|
1582
|
+
while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
|
|
1583
|
+
if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
|
|
1584
|
+
return svgOffsetParent;
|
|
1585
|
+
}
|
|
1586
|
+
svgOffsetParent = getParentNode(svgOffsetParent);
|
|
1587
|
+
}
|
|
1588
|
+
return win;
|
|
1589
|
+
}
|
|
1590
|
+
let offsetParent = getTrueOffsetParent(element, polyfill);
|
|
1591
|
+
while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
|
|
1592
|
+
offsetParent = getTrueOffsetParent(offsetParent, polyfill);
|
|
1593
|
+
}
|
|
1594
|
+
if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
|
|
1595
|
+
return win;
|
|
1596
|
+
}
|
|
1597
|
+
return offsetParent || getContainingBlock(element) || win;
|
|
1598
|
+
}
|
|
1599
|
+
|
|
1600
|
+
const getElementRects = async function (data) {
|
|
1601
|
+
const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
|
|
1602
|
+
const getDimensionsFn = this.getDimensions;
|
|
1603
|
+
const floatingDimensions = await getDimensionsFn(data.floating);
|
|
1604
|
+
return {
|
|
1605
|
+
reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
|
|
1606
|
+
floating: {
|
|
1607
|
+
x: 0,
|
|
1608
|
+
y: 0,
|
|
1609
|
+
width: floatingDimensions.width,
|
|
1610
|
+
height: floatingDimensions.height
|
|
1611
|
+
}
|
|
1612
|
+
};
|
|
380
1613
|
};
|
|
381
|
-
|
|
382
|
-
|
|
1614
|
+
|
|
1615
|
+
function isRTL(element) {
|
|
1616
|
+
return getComputedStyle$1(element).direction === 'rtl';
|
|
1617
|
+
}
|
|
1618
|
+
|
|
1619
|
+
const platform = {
|
|
1620
|
+
convertOffsetParentRelativeRectToViewportRelativeRect,
|
|
1621
|
+
getDocumentElement,
|
|
1622
|
+
getClippingRect,
|
|
1623
|
+
getOffsetParent,
|
|
1624
|
+
getElementRects,
|
|
1625
|
+
getClientRects,
|
|
1626
|
+
getDimensions,
|
|
1627
|
+
getScale,
|
|
1628
|
+
isElement,
|
|
1629
|
+
isRTL
|
|
383
1630
|
};
|
|
384
|
-
const basicToast = toastFunction;
|
|
385
|
-
const getHistory = ()=>ToastState.toasts;
|
|
386
|
-
const getToasts = ()=>ToastState.getActiveToasts();
|
|
387
|
-
// We use `Object.assign` to maintain the correct types as we would lose them otherwise
|
|
388
|
-
const toast = Object.assign(basicToast, {
|
|
389
|
-
success: ToastState.success,
|
|
390
|
-
info: ToastState.info,
|
|
391
|
-
warning: ToastState.warning,
|
|
392
|
-
error: ToastState.error,
|
|
393
|
-
custom: ToastState.custom,
|
|
394
|
-
message: ToastState.message,
|
|
395
|
-
promise: ToastState.promise,
|
|
396
|
-
dismiss: ToastState.dismiss,
|
|
397
|
-
loading: ToastState.loading
|
|
398
|
-
}, {
|
|
399
|
-
getHistory,
|
|
400
|
-
getToasts
|
|
401
|
-
});
|
|
402
1631
|
|
|
403
|
-
__insertCSS("[data-sonner-toaster][dir=ltr],html[dir=ltr]{--toast-icon-margin-start:-3px;--toast-icon-margin-end:4px;--toast-svg-margin-start:-1px;--toast-svg-margin-end:0px;--toast-button-margin-start:auto;--toast-button-margin-end:0;--toast-close-button-start:0;--toast-close-button-end:unset;--toast-close-button-transform:translate(-35%, -35%)}[data-sonner-toaster][dir=rtl],html[dir=rtl]{--toast-icon-margin-start:4px;--toast-icon-margin-end:-3px;--toast-svg-margin-start:0px;--toast-svg-margin-end:-1px;--toast-button-margin-start:0;--toast-button-margin-end:auto;--toast-close-button-start:unset;--toast-close-button-end:0;--toast-close-button-transform:translate(35%, -35%)}[data-sonner-toaster]{position:fixed;width:var(--width);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;--gray1:hsl(0, 0%, 99%);--gray2:hsl(0, 0%, 97.3%);--gray3:hsl(0, 0%, 95.1%);--gray4:hsl(0, 0%, 93%);--gray5:hsl(0, 0%, 90.9%);--gray6:hsl(0, 0%, 88.7%);--gray7:hsl(0, 0%, 85.8%);--gray8:hsl(0, 0%, 78%);--gray9:hsl(0, 0%, 56.1%);--gray10:hsl(0, 0%, 52.3%);--gray11:hsl(0, 0%, 43.5%);--gray12:hsl(0, 0%, 9%);--border-radius:8px;box-sizing:border-box;padding:0;margin:0;list-style:none;outline:0;z-index:999999999;transition:transform .4s ease}@media (hover:none) and (pointer:coarse){[data-sonner-toaster][data-lifted=true]{transform:none}}[data-sonner-toaster][data-x-position=right]{right:var(--offset-right)}[data-sonner-toaster][data-x-position=left]{left:var(--offset-left)}[data-sonner-toaster][data-x-position=center]{left:50%;transform:translateX(-50%)}[data-sonner-toaster][data-y-position=top]{top:var(--offset-top)}[data-sonner-toaster][data-y-position=bottom]{bottom:var(--offset-bottom)}[data-sonner-toast]{--y:translateY(100%);--lift-amount:calc(var(--lift) * var(--gap));z-index:var(--z-index);position:absolute;opacity:0;transform:var(--y);touch-action:none;transition:transform .4s,opacity .4s,height .4s,box-shadow .2s;box-sizing:border-box;outline:0;overflow-wrap:anywhere}[data-sonner-toast][data-styled=true]{padding:16px;background:var(--normal-bg);border:1px solid var(--normal-border);color:var(--normal-text);border-radius:var(--border-radius);box-shadow:0 4px 12px rgba(0,0,0,.1);width:var(--width);font-size:13px;display:flex;align-items:center;gap:6px}[data-sonner-toast]:focus-visible{box-shadow:0 4px 12px rgba(0,0,0,.1),0 0 0 2px rgba(0,0,0,.2)}[data-sonner-toast][data-y-position=top]{top:0;--y:translateY(-100%);--lift:1;--lift-amount:calc(1 * var(--gap))}[data-sonner-toast][data-y-position=bottom]{bottom:0;--y:translateY(100%);--lift:-1;--lift-amount:calc(var(--lift) * var(--gap))}[data-sonner-toast][data-styled=true] [data-description]{font-weight:400;line-height:1.4;color:#3f3f3f}[data-rich-colors=true][data-sonner-toast][data-styled=true] [data-description]{color:inherit}[data-sonner-toaster][data-sonner-theme=dark] [data-description]{color:#e8e8e8}[data-sonner-toast][data-styled=true] [data-title]{font-weight:500;line-height:1.5;color:inherit}[data-sonner-toast][data-styled=true] [data-icon]{display:flex;height:16px;width:16px;position:relative;justify-content:flex-start;align-items:center;flex-shrink:0;margin-left:var(--toast-icon-margin-start);margin-right:var(--toast-icon-margin-end)}[data-sonner-toast][data-promise=true] [data-icon]>svg{opacity:0;transform:scale(.8);transform-origin:center;animation:sonner-fade-in .3s ease forwards}[data-sonner-toast][data-styled=true] [data-icon]>*{flex-shrink:0}[data-sonner-toast][data-styled=true] [data-icon] svg{margin-left:var(--toast-svg-margin-start);margin-right:var(--toast-svg-margin-end)}[data-sonner-toast][data-styled=true] [data-content]{display:flex;flex-direction:column;gap:2px}[data-sonner-toast][data-styled=true] [data-button]{border-radius:4px;padding-left:8px;padding-right:8px;height:24px;font-size:12px;color:var(--normal-bg);background:var(--normal-text);margin-left:var(--toast-button-margin-start);margin-right:var(--toast-button-margin-end);border:none;font-weight:500;cursor:pointer;outline:0;display:flex;align-items:center;flex-shrink:0;transition:opacity .4s,box-shadow .2s}[data-sonner-toast][data-styled=true] [data-button]:focus-visible{box-shadow:0 0 0 2px rgba(0,0,0,.4)}[data-sonner-toast][data-styled=true] [data-button]:first-of-type{margin-left:var(--toast-button-margin-start);margin-right:var(--toast-button-margin-end)}[data-sonner-toast][data-styled=true] [data-cancel]{color:var(--normal-text);background:rgba(0,0,0,.08)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast][data-styled=true] [data-cancel]{background:rgba(255,255,255,.3)}[data-sonner-toast][data-styled=true] [data-close-button]{position:absolute;left:var(--toast-close-button-start);right:var(--toast-close-button-end);top:0;height:20px;width:20px;display:flex;justify-content:center;align-items:center;padding:0;color:var(--gray12);background:var(--normal-bg);border:1px solid var(--gray4);transform:var(--toast-close-button-transform);border-radius:50%;cursor:pointer;z-index:1;transition:opacity .1s,background .2s,border-color .2s}[data-sonner-toast][data-styled=true] [data-close-button]:focus-visible{box-shadow:0 4px 12px rgba(0,0,0,.1),0 0 0 2px rgba(0,0,0,.2)}[data-sonner-toast][data-styled=true] [data-disabled=true]{cursor:not-allowed}[data-sonner-toast][data-styled=true]:hover [data-close-button]:hover{background:var(--gray2);border-color:var(--gray5)}[data-sonner-toast][data-swiping=true]::before{content:'';position:absolute;left:-100%;right:-100%;height:100%;z-index:-1}[data-sonner-toast][data-y-position=top][data-swiping=true]::before{bottom:50%;transform:scaleY(3) translateY(50%)}[data-sonner-toast][data-y-position=bottom][data-swiping=true]::before{top:50%;transform:scaleY(3) translateY(-50%)}[data-sonner-toast][data-swiping=false][data-removed=true]::before{content:'';position:absolute;inset:0;transform:scaleY(2)}[data-sonner-toast][data-expanded=true]::after{content:'';position:absolute;left:0;height:calc(var(--gap) + 1px);bottom:100%;width:100%}[data-sonner-toast][data-mounted=true]{--y:translateY(0);opacity:1}[data-sonner-toast][data-expanded=false][data-front=false]{--scale:var(--toasts-before) * 0.05 + 1;--y:translateY(calc(var(--lift-amount) * var(--toasts-before))) scale(calc(-1 * var(--scale)));height:var(--front-toast-height)}[data-sonner-toast]>*{transition:opacity .4s}[data-sonner-toast][data-x-position=right]{right:0}[data-sonner-toast][data-x-position=left]{left:0}[data-sonner-toast][data-expanded=false][data-front=false][data-styled=true]>*{opacity:0}[data-sonner-toast][data-visible=false]{opacity:0;pointer-events:none}[data-sonner-toast][data-mounted=true][data-expanded=true]{--y:translateY(calc(var(--lift) * var(--offset)));height:var(--initial-height)}[data-sonner-toast][data-removed=true][data-front=true][data-swipe-out=false]{--y:translateY(calc(var(--lift) * -100%));opacity:0}[data-sonner-toast][data-removed=true][data-front=false][data-swipe-out=false][data-expanded=true]{--y:translateY(calc(var(--lift) * var(--offset) + var(--lift) * -100%));opacity:0}[data-sonner-toast][data-removed=true][data-front=false][data-swipe-out=false][data-expanded=false]{--y:translateY(40%);opacity:0;transition:transform .5s,opacity .2s}[data-sonner-toast][data-removed=true][data-front=false]::before{height:calc(var(--initial-height) + 20%)}[data-sonner-toast][data-swiping=true]{transform:var(--y) translateY(var(--swipe-amount-y,0)) translateX(var(--swipe-amount-x,0));transition:none}[data-sonner-toast][data-swiped=true]{user-select:none}[data-sonner-toast][data-swipe-out=true][data-y-position=bottom],[data-sonner-toast][data-swipe-out=true][data-y-position=top]{animation-duration:.2s;animation-timing-function:ease-out;animation-fill-mode:forwards}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=left]{animation-name:swipe-out-left}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=right]{animation-name:swipe-out-right}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=up]{animation-name:swipe-out-up}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=down]{animation-name:swipe-out-down}@keyframes swipe-out-left{from{transform:var(--y) translateX(var(--swipe-amount-x));opacity:1}to{transform:var(--y) translateX(calc(var(--swipe-amount-x) - 100%));opacity:0}}@keyframes swipe-out-right{from{transform:var(--y) translateX(var(--swipe-amount-x));opacity:1}to{transform:var(--y) translateX(calc(var(--swipe-amount-x) + 100%));opacity:0}}@keyframes swipe-out-up{from{transform:var(--y) translateY(var(--swipe-amount-y));opacity:1}to{transform:var(--y) translateY(calc(var(--swipe-amount-y) - 100%));opacity:0}}@keyframes swipe-out-down{from{transform:var(--y) translateY(var(--swipe-amount-y));opacity:1}to{transform:var(--y) translateY(calc(var(--swipe-amount-y) + 100%));opacity:0}}@media (max-width:600px){[data-sonner-toaster]{position:fixed;right:var(--mobile-offset-right);left:var(--mobile-offset-left);width:100%}[data-sonner-toaster][dir=rtl]{left:calc(var(--mobile-offset-left) * -1)}[data-sonner-toaster] [data-sonner-toast]{left:0;right:0;width:calc(100% - var(--mobile-offset-left) * 2)}[data-sonner-toaster][data-x-position=left]{left:var(--mobile-offset-left)}[data-sonner-toaster][data-y-position=bottom]{bottom:var(--mobile-offset-bottom)}[data-sonner-toaster][data-y-position=top]{top:var(--mobile-offset-top)}[data-sonner-toaster][data-x-position=center]{left:var(--mobile-offset-left);right:var(--mobile-offset-right);transform:none}}[data-sonner-toaster][data-sonner-theme=light]{--normal-bg:#fff;--normal-border:var(--gray4);--normal-text:var(--gray12);--success-bg:hsl(143, 85%, 96%);--success-border:hsl(145, 92%, 87%);--success-text:hsl(140, 100%, 27%);--info-bg:hsl(208, 100%, 97%);--info-border:hsl(221, 91%, 93%);--info-text:hsl(210, 92%, 45%);--warning-bg:hsl(49, 100%, 97%);--warning-border:hsl(49, 91%, 84%);--warning-text:hsl(31, 92%, 45%);--error-bg:hsl(359, 100%, 97%);--error-border:hsl(359, 100%, 94%);--error-text:hsl(360, 100%, 45%)}[data-sonner-toaster][data-sonner-theme=light] [data-sonner-toast][data-invert=true]{--normal-bg:#000;--normal-border:hsl(0, 0%, 20%);--normal-text:var(--gray1)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast][data-invert=true]{--normal-bg:#fff;--normal-border:var(--gray3);--normal-text:var(--gray12)}[data-sonner-toaster][data-sonner-theme=dark]{--normal-bg:#000;--normal-bg-hover:hsl(0, 0%, 12%);--normal-border:hsl(0, 0%, 20%);--normal-border-hover:hsl(0, 0%, 25%);--normal-text:var(--gray1);--success-bg:hsl(150, 100%, 6%);--success-border:hsl(147, 100%, 12%);--success-text:hsl(150, 86%, 65%);--info-bg:hsl(215, 100%, 6%);--info-border:hsl(223, 43%, 17%);--info-text:hsl(216, 87%, 65%);--warning-bg:hsl(64, 100%, 6%);--warning-border:hsl(60, 100%, 9%);--warning-text:hsl(46, 87%, 65%);--error-bg:hsl(358, 76%, 10%);--error-border:hsl(357, 89%, 16%);--error-text:hsl(358, 100%, 81%)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button]{background:var(--normal-bg);border-color:var(--normal-border);color:var(--normal-text)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button]:hover{background:var(--normal-bg-hover);border-color:var(--normal-border-hover)}[data-rich-colors=true][data-sonner-toast][data-type=success]{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}[data-rich-colors=true][data-sonner-toast][data-type=success] [data-close-button]{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}[data-rich-colors=true][data-sonner-toast][data-type=info]{background:var(--info-bg);border-color:var(--info-border);color:var(--info-text)}[data-rich-colors=true][data-sonner-toast][data-type=info] [data-close-button]{background:var(--info-bg);border-color:var(--info-border);color:var(--info-text)}[data-rich-colors=true][data-sonner-toast][data-type=warning]{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)}[data-rich-colors=true][data-sonner-toast][data-type=warning] [data-close-button]{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)}[data-rich-colors=true][data-sonner-toast][data-type=error]{background:var(--error-bg);border-color:var(--error-border);color:var(--error-text)}[data-rich-colors=true][data-sonner-toast][data-type=error] [data-close-button]{background:var(--error-bg);border-color:var(--error-border);color:var(--error-text)}.sonner-loading-wrapper{--size:16px;height:var(--size);width:var(--size);position:absolute;inset:0;z-index:10}.sonner-loading-wrapper[data-visible=false]{transform-origin:center;animation:sonner-fade-out .2s ease forwards}.sonner-spinner{position:relative;top:50%;left:50%;height:var(--size);width:var(--size)}.sonner-loading-bar{animation:sonner-spin 1.2s linear infinite;background:var(--gray11);border-radius:6px;height:8%;left:-10%;position:absolute;top:-3.9%;width:24%}.sonner-loading-bar:first-child{animation-delay:-1.2s;transform:rotate(.0001deg) translate(146%)}.sonner-loading-bar:nth-child(2){animation-delay:-1.1s;transform:rotate(30deg) translate(146%)}.sonner-loading-bar:nth-child(3){animation-delay:-1s;transform:rotate(60deg) translate(146%)}.sonner-loading-bar:nth-child(4){animation-delay:-.9s;transform:rotate(90deg) translate(146%)}.sonner-loading-bar:nth-child(5){animation-delay:-.8s;transform:rotate(120deg) translate(146%)}.sonner-loading-bar:nth-child(6){animation-delay:-.7s;transform:rotate(150deg) translate(146%)}.sonner-loading-bar:nth-child(7){animation-delay:-.6s;transform:rotate(180deg) translate(146%)}.sonner-loading-bar:nth-child(8){animation-delay:-.5s;transform:rotate(210deg) translate(146%)}.sonner-loading-bar:nth-child(9){animation-delay:-.4s;transform:rotate(240deg) translate(146%)}.sonner-loading-bar:nth-child(10){animation-delay:-.3s;transform:rotate(270deg) translate(146%)}.sonner-loading-bar:nth-child(11){animation-delay:-.2s;transform:rotate(300deg) translate(146%)}.sonner-loading-bar:nth-child(12){animation-delay:-.1s;transform:rotate(330deg) translate(146%)}@keyframes sonner-fade-in{0%{opacity:0;transform:scale(.8)}100%{opacity:1;transform:scale(1)}}@keyframes sonner-fade-out{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.8)}}@keyframes sonner-spin{0%{opacity:1}100%{opacity:.15}}@media (prefers-reduced-motion){.sonner-loading-bar,[data-sonner-toast],[data-sonner-toast]>*{transition:none!important;animation:none!important}}.sonner-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transform-origin:center;transition:opacity .2s,transform .2s}.sonner-loader[data-visible=false]{opacity:0;transform:scale(.8) translate(-50%,-50%)}");
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
// Threshold to dismiss a toast
|
|
422
|
-
const SWIPE_THRESHOLD = 45;
|
|
423
|
-
// Equal to exit animation duration
|
|
424
|
-
const TIME_BEFORE_UNMOUNT = 200;
|
|
425
|
-
function cn(...classes) {
|
|
426
|
-
return classes.filter(Boolean).join(' ');
|
|
427
|
-
}
|
|
428
|
-
function getDefaultSwipeDirections(position) {
|
|
429
|
-
const [y, x] = position.split('-');
|
|
430
|
-
const directions = [];
|
|
431
|
-
if (y) {
|
|
432
|
-
directions.push(y);
|
|
1632
|
+
function rectsAreEqual(a, b) {
|
|
1633
|
+
return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
|
|
1634
|
+
}
|
|
1635
|
+
|
|
1636
|
+
// https://samthor.au/2021/observing-dom/
|
|
1637
|
+
function observeMove(element, onMove) {
|
|
1638
|
+
let io = null;
|
|
1639
|
+
let timeoutId;
|
|
1640
|
+
const root = getDocumentElement(element);
|
|
1641
|
+
function cleanup() {
|
|
1642
|
+
var _io;
|
|
1643
|
+
clearTimeout(timeoutId);
|
|
1644
|
+
(_io = io) == null || _io.disconnect();
|
|
1645
|
+
io = null;
|
|
1646
|
+
}
|
|
1647
|
+
function refresh(skip, threshold) {
|
|
1648
|
+
if (skip === void 0) {
|
|
1649
|
+
skip = false;
|
|
433
1650
|
}
|
|
434
|
-
if (
|
|
435
|
-
|
|
1651
|
+
if (threshold === void 0) {
|
|
1652
|
+
threshold = 1;
|
|
436
1653
|
}
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
const
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
const
|
|
452
|
-
const
|
|
453
|
-
const
|
|
454
|
-
const
|
|
455
|
-
const
|
|
456
|
-
const
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
var _toast_closeButton;
|
|
467
|
-
return (_toast_closeButton = toast.closeButton) != null ? _toast_closeButton : closeButtonFromToaster;
|
|
468
|
-
}, [
|
|
469
|
-
toast.closeButton,
|
|
470
|
-
closeButtonFromToaster
|
|
471
|
-
]);
|
|
472
|
-
const duration = React__default.useMemo(()=>toast.duration || durationFromToaster || TOAST_LIFETIME, [
|
|
473
|
-
toast.duration,
|
|
474
|
-
durationFromToaster
|
|
475
|
-
]);
|
|
476
|
-
const closeTimerStartTimeRef = React__default.useRef(0);
|
|
477
|
-
const offset = React__default.useRef(0);
|
|
478
|
-
const lastCloseTimerStartTimeRef = React__default.useRef(0);
|
|
479
|
-
const pointerStartRef = React__default.useRef(null);
|
|
480
|
-
const [y, x] = position.split('-');
|
|
481
|
-
const toastsHeightBefore = React__default.useMemo(()=>{
|
|
482
|
-
return heights.reduce((prev, curr, reducerIndex)=>{
|
|
483
|
-
// Calculate offset up until current toast
|
|
484
|
-
if (reducerIndex >= heightIndex) {
|
|
485
|
-
return prev;
|
|
486
|
-
}
|
|
487
|
-
return prev + curr.height;
|
|
488
|
-
}, 0);
|
|
489
|
-
}, [
|
|
490
|
-
heights,
|
|
491
|
-
heightIndex
|
|
492
|
-
]);
|
|
493
|
-
const isDocumentHidden = useIsDocumentHidden();
|
|
494
|
-
const invert = toast.invert || ToasterInvert;
|
|
495
|
-
const disabled = toastType === 'loading';
|
|
496
|
-
offset.current = React__default.useMemo(()=>heightIndex * gap + toastsHeightBefore, [
|
|
497
|
-
heightIndex,
|
|
498
|
-
toastsHeightBefore
|
|
499
|
-
]);
|
|
500
|
-
React__default.useEffect(()=>{
|
|
501
|
-
remainingTime.current = duration;
|
|
502
|
-
}, [
|
|
503
|
-
duration
|
|
504
|
-
]);
|
|
505
|
-
React__default.useEffect(()=>{
|
|
506
|
-
// Trigger enter animation without using CSS animation
|
|
507
|
-
setMounted(true);
|
|
508
|
-
}, []);
|
|
509
|
-
React__default.useEffect(()=>{
|
|
510
|
-
const toastNode = toastRef.current;
|
|
511
|
-
if (toastNode) {
|
|
512
|
-
const height = toastNode.getBoundingClientRect().height;
|
|
513
|
-
// Add toast height to heights array after the toast is mounted
|
|
514
|
-
setInitialHeight(height);
|
|
515
|
-
setHeights((h)=>[
|
|
516
|
-
{
|
|
517
|
-
toastId: toast.id,
|
|
518
|
-
height,
|
|
519
|
-
position: toast.position
|
|
520
|
-
},
|
|
521
|
-
...h
|
|
522
|
-
]);
|
|
523
|
-
return ()=>setHeights((h)=>h.filter((height)=>height.toastId !== toast.id));
|
|
1654
|
+
cleanup();
|
|
1655
|
+
const elementRectForRootMargin = element.getBoundingClientRect();
|
|
1656
|
+
const {
|
|
1657
|
+
left,
|
|
1658
|
+
top,
|
|
1659
|
+
width,
|
|
1660
|
+
height
|
|
1661
|
+
} = elementRectForRootMargin;
|
|
1662
|
+
if (!skip) {
|
|
1663
|
+
onMove();
|
|
1664
|
+
}
|
|
1665
|
+
if (!width || !height) {
|
|
1666
|
+
return;
|
|
1667
|
+
}
|
|
1668
|
+
const insetTop = floor(top);
|
|
1669
|
+
const insetRight = floor(root.clientWidth - (left + width));
|
|
1670
|
+
const insetBottom = floor(root.clientHeight - (top + height));
|
|
1671
|
+
const insetLeft = floor(left);
|
|
1672
|
+
const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
|
|
1673
|
+
const options = {
|
|
1674
|
+
rootMargin,
|
|
1675
|
+
threshold: max(0, min(1, threshold)) || 1
|
|
1676
|
+
};
|
|
1677
|
+
let isFirstUpdate = true;
|
|
1678
|
+
function handleObserve(entries) {
|
|
1679
|
+
const ratio = entries[0].intersectionRatio;
|
|
1680
|
+
if (ratio !== threshold) {
|
|
1681
|
+
if (!isFirstUpdate) {
|
|
1682
|
+
return refresh();
|
|
524
1683
|
}
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
if (!mounted) return;
|
|
532
|
-
const toastNode = toastRef.current;
|
|
533
|
-
const originalHeight = toastNode.style.height;
|
|
534
|
-
toastNode.style.height = 'auto';
|
|
535
|
-
const newHeight = toastNode.getBoundingClientRect().height;
|
|
536
|
-
toastNode.style.height = originalHeight;
|
|
537
|
-
setInitialHeight(newHeight);
|
|
538
|
-
setHeights((heights)=>{
|
|
539
|
-
const alreadyExists = heights.find((height)=>height.toastId === toast.id);
|
|
540
|
-
if (!alreadyExists) {
|
|
541
|
-
return [
|
|
542
|
-
{
|
|
543
|
-
toastId: toast.id,
|
|
544
|
-
height: newHeight,
|
|
545
|
-
position: toast.position
|
|
546
|
-
},
|
|
547
|
-
...heights
|
|
548
|
-
];
|
|
549
|
-
} else {
|
|
550
|
-
return heights.map((height)=>height.toastId === toast.id ? {
|
|
551
|
-
...height,
|
|
552
|
-
height: newHeight
|
|
553
|
-
} : height);
|
|
554
|
-
}
|
|
555
|
-
});
|
|
556
|
-
}, [
|
|
557
|
-
mounted,
|
|
558
|
-
toast.title,
|
|
559
|
-
toast.description,
|
|
560
|
-
setHeights,
|
|
561
|
-
toast.id,
|
|
562
|
-
toast.jsx,
|
|
563
|
-
toast.action,
|
|
564
|
-
toast.cancel
|
|
565
|
-
]);
|
|
566
|
-
const deleteToast = React__default.useCallback(()=>{
|
|
567
|
-
// Save the offset for the exit swipe animation
|
|
568
|
-
setRemoved(true);
|
|
569
|
-
setOffsetBeforeRemove(offset.current);
|
|
570
|
-
setHeights((h)=>h.filter((height)=>height.toastId !== toast.id));
|
|
571
|
-
setTimeout(()=>{
|
|
572
|
-
removeToast(toast);
|
|
573
|
-
}, TIME_BEFORE_UNMOUNT);
|
|
574
|
-
}, [
|
|
575
|
-
toast,
|
|
576
|
-
removeToast,
|
|
577
|
-
setHeights,
|
|
578
|
-
offset
|
|
579
|
-
]);
|
|
580
|
-
React__default.useEffect(()=>{
|
|
581
|
-
if (toast.promise && toastType === 'loading' || toast.duration === Infinity || toast.type === 'loading') return;
|
|
582
|
-
let timeoutId;
|
|
583
|
-
// Pause the timer on each hover
|
|
584
|
-
const pauseTimer = ()=>{
|
|
585
|
-
if (lastCloseTimerStartTimeRef.current < closeTimerStartTimeRef.current) {
|
|
586
|
-
// Get the elapsed time since the timer started
|
|
587
|
-
const elapsedTime = new Date().getTime() - closeTimerStartTimeRef.current;
|
|
588
|
-
remainingTime.current = remainingTime.current - elapsedTime;
|
|
589
|
-
}
|
|
590
|
-
lastCloseTimerStartTimeRef.current = new Date().getTime();
|
|
591
|
-
};
|
|
592
|
-
const startTimer = ()=>{
|
|
593
|
-
// setTimeout(, Infinity) behaves as if the delay is 0.
|
|
594
|
-
// As a result, the toast would be closed immediately, giving the appearance that it was never rendered.
|
|
595
|
-
// See: https://github.com/denysdovhan/wtfjs?tab=readme-ov-file#an-infinite-timeout
|
|
596
|
-
if (remainingTime.current === Infinity) return;
|
|
597
|
-
closeTimerStartTimeRef.current = new Date().getTime();
|
|
598
|
-
// Let the toast know it has started
|
|
599
|
-
timeoutId = setTimeout(()=>{
|
|
600
|
-
toast.onAutoClose == null ? void 0 : toast.onAutoClose.call(toast, toast);
|
|
601
|
-
deleteToast();
|
|
602
|
-
}, remainingTime.current);
|
|
603
|
-
};
|
|
604
|
-
if (expanded || interacting || isDocumentHidden) {
|
|
605
|
-
pauseTimer();
|
|
1684
|
+
if (!ratio) {
|
|
1685
|
+
// If the reference is clipped, the ratio is 0. Throttle the refresh
|
|
1686
|
+
// to prevent an infinite loop of updates.
|
|
1687
|
+
timeoutId = setTimeout(() => {
|
|
1688
|
+
refresh(false, 1e-7);
|
|
1689
|
+
}, 1000);
|
|
606
1690
|
} else {
|
|
607
|
-
|
|
608
|
-
}
|
|
609
|
-
return ()=>clearTimeout(timeoutId);
|
|
610
|
-
}, [
|
|
611
|
-
expanded,
|
|
612
|
-
interacting,
|
|
613
|
-
toast,
|
|
614
|
-
toastType,
|
|
615
|
-
isDocumentHidden,
|
|
616
|
-
deleteToast
|
|
617
|
-
]);
|
|
618
|
-
React__default.useEffect(()=>{
|
|
619
|
-
if (toast.delete) {
|
|
620
|
-
deleteToast();
|
|
621
|
-
toast.onDismiss == null ? void 0 : toast.onDismiss.call(toast, toast);
|
|
1691
|
+
refresh(false, ratio);
|
|
622
1692
|
}
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
|
|
1693
|
+
}
|
|
1694
|
+
if (ratio === 1 && !rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) {
|
|
1695
|
+
// It's possible that even though the ratio is reported as 1, the
|
|
1696
|
+
// element is not actually fully within the IntersectionObserver's root
|
|
1697
|
+
// area anymore. This can happen under performance constraints. This may
|
|
1698
|
+
// be a bug in the browser's IntersectionObserver implementation. To
|
|
1699
|
+
// work around this, we compare the element's bounding rect now with
|
|
1700
|
+
// what it was at the time we created the IntersectionObserver. If they
|
|
1701
|
+
// are not equal then the element moved, so we refresh.
|
|
1702
|
+
refresh();
|
|
1703
|
+
}
|
|
1704
|
+
isFirstUpdate = false;
|
|
1705
|
+
}
|
|
1706
|
+
|
|
1707
|
+
// Older browsers don't support a `document` as the root and will throw an
|
|
1708
|
+
// error.
|
|
1709
|
+
try {
|
|
1710
|
+
io = new IntersectionObserver(handleObserve, {
|
|
1711
|
+
...options,
|
|
1712
|
+
// Handle <iframe>s
|
|
1713
|
+
root: root.ownerDocument
|
|
1714
|
+
});
|
|
1715
|
+
} catch (_e) {
|
|
1716
|
+
io = new IntersectionObserver(handleObserve, options);
|
|
1717
|
+
}
|
|
1718
|
+
io.observe(element);
|
|
1719
|
+
}
|
|
1720
|
+
refresh(true);
|
|
1721
|
+
return cleanup;
|
|
1722
|
+
}
|
|
1723
|
+
|
|
1724
|
+
/**
|
|
1725
|
+
* Automatically updates the position of the floating element when necessary.
|
|
1726
|
+
* Should only be called when the floating element is mounted on the DOM or
|
|
1727
|
+
* visible on the screen.
|
|
1728
|
+
* @returns cleanup function that should be invoked when the floating element is
|
|
1729
|
+
* removed from the DOM or hidden from the screen.
|
|
1730
|
+
* @see https://floating-ui.com/docs/autoUpdate
|
|
1731
|
+
*/
|
|
1732
|
+
function autoUpdate(reference, floating, update, options) {
|
|
1733
|
+
if (options === void 0) {
|
|
1734
|
+
options = {};
|
|
1735
|
+
}
|
|
1736
|
+
const {
|
|
1737
|
+
ancestorScroll = true,
|
|
1738
|
+
ancestorResize = true,
|
|
1739
|
+
elementResize = typeof ResizeObserver === 'function',
|
|
1740
|
+
layoutShift = typeof IntersectionObserver === 'function',
|
|
1741
|
+
animationFrame = false
|
|
1742
|
+
} = options;
|
|
1743
|
+
const referenceEl = unwrapElement(reference);
|
|
1744
|
+
const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...(floating ? getOverflowAncestors(floating) : [])] : [];
|
|
1745
|
+
ancestors.forEach(ancestor => {
|
|
1746
|
+
ancestorScroll && ancestor.addEventListener('scroll', update, {
|
|
1747
|
+
passive: true
|
|
1748
|
+
});
|
|
1749
|
+
ancestorResize && ancestor.addEventListener('resize', update);
|
|
1750
|
+
});
|
|
1751
|
+
const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
|
|
1752
|
+
let reobserveFrame = -1;
|
|
1753
|
+
let resizeObserver = null;
|
|
1754
|
+
if (elementResize) {
|
|
1755
|
+
resizeObserver = new ResizeObserver(_ref => {
|
|
1756
|
+
let [firstEntry] = _ref;
|
|
1757
|
+
if (firstEntry && firstEntry.target === referenceEl && resizeObserver && floating) {
|
|
1758
|
+
// Prevent update loops when using the `size` middleware.
|
|
1759
|
+
// https://github.com/floating-ui/floating-ui/issues/1740
|
|
1760
|
+
resizeObserver.unobserve(floating);
|
|
1761
|
+
cancelAnimationFrame(reobserveFrame);
|
|
1762
|
+
reobserveFrame = requestAnimationFrame(() => {
|
|
1763
|
+
var _resizeObserver;
|
|
1764
|
+
(_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
|
|
1765
|
+
});
|
|
1766
|
+
}
|
|
1767
|
+
update();
|
|
1768
|
+
});
|
|
1769
|
+
if (referenceEl && !animationFrame) {
|
|
1770
|
+
resizeObserver.observe(referenceEl);
|
|
1771
|
+
}
|
|
1772
|
+
if (floating) {
|
|
1773
|
+
resizeObserver.observe(floating);
|
|
1774
|
+
}
|
|
1775
|
+
}
|
|
1776
|
+
let frameId;
|
|
1777
|
+
let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
|
|
1778
|
+
if (animationFrame) {
|
|
1779
|
+
frameLoop();
|
|
1780
|
+
}
|
|
1781
|
+
function frameLoop() {
|
|
1782
|
+
const nextRefRect = getBoundingClientRect(reference);
|
|
1783
|
+
if (prevRefRect && !rectsAreEqual(prevRefRect, nextRefRect)) {
|
|
1784
|
+
update();
|
|
1785
|
+
}
|
|
1786
|
+
prevRefRect = nextRefRect;
|
|
1787
|
+
frameId = requestAnimationFrame(frameLoop);
|
|
1788
|
+
}
|
|
1789
|
+
update();
|
|
1790
|
+
return () => {
|
|
1791
|
+
var _resizeObserver2;
|
|
1792
|
+
ancestors.forEach(ancestor => {
|
|
1793
|
+
ancestorScroll && ancestor.removeEventListener('scroll', update);
|
|
1794
|
+
ancestorResize && ancestor.removeEventListener('resize', update);
|
|
1795
|
+
});
|
|
1796
|
+
cleanupIo == null || cleanupIo();
|
|
1797
|
+
(_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
|
|
1798
|
+
resizeObserver = null;
|
|
1799
|
+
if (animationFrame) {
|
|
1800
|
+
cancelAnimationFrame(frameId);
|
|
1801
|
+
}
|
|
1802
|
+
};
|
|
1803
|
+
}
|
|
1804
|
+
|
|
1805
|
+
/**
|
|
1806
|
+
* Modifies the placement by translating the floating element along the
|
|
1807
|
+
* specified axes.
|
|
1808
|
+
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
|
1809
|
+
* object may be passed.
|
|
1810
|
+
* @see https://floating-ui.com/docs/offset
|
|
1811
|
+
*/
|
|
1812
|
+
const offset$1 = offset$2;
|
|
1813
|
+
|
|
1814
|
+
/**
|
|
1815
|
+
* Optimizes the visibility of the floating element by shifting it in order to
|
|
1816
|
+
* keep it in view when it will overflow the clipping boundary.
|
|
1817
|
+
* @see https://floating-ui.com/docs/shift
|
|
1818
|
+
*/
|
|
1819
|
+
const shift$1 = shift$2;
|
|
1820
|
+
|
|
1821
|
+
/**
|
|
1822
|
+
* Optimizes the visibility of the floating element by flipping the `placement`
|
|
1823
|
+
* in order to keep it in view when the preferred placement(s) will overflow the
|
|
1824
|
+
* clipping boundary. Alternative to `autoPlacement`.
|
|
1825
|
+
* @see https://floating-ui.com/docs/flip
|
|
1826
|
+
*/
|
|
1827
|
+
const flip$1 = flip$2;
|
|
1828
|
+
|
|
1829
|
+
/**
|
|
1830
|
+
* Provides data that allows you to change the size of the floating element —
|
|
1831
|
+
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
1832
|
+
* width of the reference element.
|
|
1833
|
+
* @see https://floating-ui.com/docs/size
|
|
1834
|
+
*/
|
|
1835
|
+
const size$1 = size$2;
|
|
1836
|
+
|
|
1837
|
+
/**
|
|
1838
|
+
* Provides data to hide the floating element in applicable situations, such as
|
|
1839
|
+
* when it is not in the same clipping context as the reference element.
|
|
1840
|
+
* @see https://floating-ui.com/docs/hide
|
|
1841
|
+
*/
|
|
1842
|
+
const hide$1 = hide$2;
|
|
1843
|
+
|
|
1844
|
+
/**
|
|
1845
|
+
* Provides data to position an inner element of the floating element so that it
|
|
1846
|
+
* appears centered to the reference element.
|
|
1847
|
+
* @see https://floating-ui.com/docs/arrow
|
|
1848
|
+
*/
|
|
1849
|
+
const arrow$2 = arrow$3;
|
|
1850
|
+
|
|
1851
|
+
/**
|
|
1852
|
+
* Built-in `limiter` that will stop `shift()` at a certain point.
|
|
1853
|
+
*/
|
|
1854
|
+
const limitShift$1 = limitShift$2;
|
|
1855
|
+
|
|
1856
|
+
/**
|
|
1857
|
+
* Computes the `x` and `y` coordinates that will place the floating element
|
|
1858
|
+
* next to a given reference element.
|
|
1859
|
+
*/
|
|
1860
|
+
const computePosition = (reference, floating, options) => {
|
|
1861
|
+
// This caches the expensive `getClippingElementAncestors` function so that
|
|
1862
|
+
// multiple lifecycle resets re-use the same result. It only lives for a
|
|
1863
|
+
// single call. If other functions become expensive, we can add them as well.
|
|
1864
|
+
const cache = new Map();
|
|
1865
|
+
const mergedOptions = {
|
|
1866
|
+
platform,
|
|
1867
|
+
...options
|
|
1868
|
+
};
|
|
1869
|
+
const platformWithCache = {
|
|
1870
|
+
...mergedOptions.platform,
|
|
1871
|
+
_c: cache
|
|
1872
|
+
};
|
|
1873
|
+
return computePosition$1(reference, floating, {
|
|
1874
|
+
...mergedOptions,
|
|
1875
|
+
platform: platformWithCache
|
|
1876
|
+
});
|
|
1877
|
+
};
|
|
1878
|
+
|
|
1879
|
+
var isClient = typeof document !== 'undefined';
|
|
1880
|
+
|
|
1881
|
+
var noop = function noop() {};
|
|
1882
|
+
var index = isClient ? useLayoutEffect : noop;
|
|
1883
|
+
|
|
1884
|
+
// Fork of `fast-deep-equal` that only does the comparisons we need and compares
|
|
1885
|
+
// functions
|
|
1886
|
+
function deepEqual(a, b) {
|
|
1887
|
+
if (a === b) {
|
|
1888
|
+
return true;
|
|
1889
|
+
}
|
|
1890
|
+
if (typeof a !== typeof b) {
|
|
1891
|
+
return false;
|
|
1892
|
+
}
|
|
1893
|
+
if (typeof a === 'function' && a.toString() === b.toString()) {
|
|
1894
|
+
return true;
|
|
1895
|
+
}
|
|
1896
|
+
let length;
|
|
1897
|
+
let i;
|
|
1898
|
+
let keys;
|
|
1899
|
+
if (a && b && typeof a === 'object') {
|
|
1900
|
+
if (Array.isArray(a)) {
|
|
1901
|
+
length = a.length;
|
|
1902
|
+
if (length !== b.length) return false;
|
|
1903
|
+
for (i = length; i-- !== 0;) {
|
|
1904
|
+
if (!deepEqual(a[i], b[i])) {
|
|
1905
|
+
return false;
|
|
635
1906
|
}
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
1907
|
+
}
|
|
1908
|
+
return true;
|
|
1909
|
+
}
|
|
1910
|
+
keys = Object.keys(a);
|
|
1911
|
+
length = keys.length;
|
|
1912
|
+
if (length !== Object.keys(b).length) {
|
|
1913
|
+
return false;
|
|
1914
|
+
}
|
|
1915
|
+
for (i = length; i-- !== 0;) {
|
|
1916
|
+
if (!{}.hasOwnProperty.call(b, keys[i])) {
|
|
1917
|
+
return false;
|
|
1918
|
+
}
|
|
1919
|
+
}
|
|
1920
|
+
for (i = length; i-- !== 0;) {
|
|
1921
|
+
const key = keys[i];
|
|
1922
|
+
if (key === '_owner' && a.$$typeof) {
|
|
1923
|
+
continue;
|
|
1924
|
+
}
|
|
1925
|
+
if (!deepEqual(a[key], b[key])) {
|
|
1926
|
+
return false;
|
|
1927
|
+
}
|
|
1928
|
+
}
|
|
1929
|
+
return true;
|
|
1930
|
+
}
|
|
1931
|
+
return a !== a && b !== b;
|
|
1932
|
+
}
|
|
1933
|
+
|
|
1934
|
+
function getDPR(element) {
|
|
1935
|
+
if (typeof window === 'undefined') {
|
|
1936
|
+
return 1;
|
|
1937
|
+
}
|
|
1938
|
+
const win = element.ownerDocument.defaultView || window;
|
|
1939
|
+
return win.devicePixelRatio || 1;
|
|
1940
|
+
}
|
|
1941
|
+
|
|
1942
|
+
function roundByDPR(element, value) {
|
|
1943
|
+
const dpr = getDPR(element);
|
|
1944
|
+
return Math.round(value * dpr) / dpr;
|
|
1945
|
+
}
|
|
1946
|
+
|
|
1947
|
+
function useLatestRef(value) {
|
|
1948
|
+
const ref = React.useRef(value);
|
|
1949
|
+
index(() => {
|
|
1950
|
+
ref.current = value;
|
|
1951
|
+
});
|
|
1952
|
+
return ref;
|
|
1953
|
+
}
|
|
1954
|
+
|
|
1955
|
+
/**
|
|
1956
|
+
* Provides data to position a floating element.
|
|
1957
|
+
* @see https://floating-ui.com/docs/useFloating
|
|
1958
|
+
*/
|
|
1959
|
+
function useFloating(options) {
|
|
1960
|
+
if (options === void 0) {
|
|
1961
|
+
options = {};
|
|
1962
|
+
}
|
|
1963
|
+
const {
|
|
1964
|
+
placement = 'bottom',
|
|
1965
|
+
strategy = 'absolute',
|
|
1966
|
+
middleware = [],
|
|
1967
|
+
platform,
|
|
1968
|
+
elements: {
|
|
1969
|
+
reference: externalReference,
|
|
1970
|
+
floating: externalFloating
|
|
1971
|
+
} = {},
|
|
1972
|
+
transform = true,
|
|
1973
|
+
whileElementsMounted,
|
|
1974
|
+
open
|
|
1975
|
+
} = options;
|
|
1976
|
+
const [data, setData] = React.useState({
|
|
1977
|
+
x: 0,
|
|
1978
|
+
y: 0,
|
|
1979
|
+
strategy,
|
|
1980
|
+
placement,
|
|
1981
|
+
middlewareData: {},
|
|
1982
|
+
isPositioned: false
|
|
1983
|
+
});
|
|
1984
|
+
const [latestMiddleware, setLatestMiddleware] = React.useState(middleware);
|
|
1985
|
+
if (!deepEqual(latestMiddleware, middleware)) {
|
|
1986
|
+
setLatestMiddleware(middleware);
|
|
1987
|
+
}
|
|
1988
|
+
const [_reference, _setReference] = React.useState(null);
|
|
1989
|
+
const [_floating, _setFloating] = React.useState(null);
|
|
1990
|
+
const setReference = React.useCallback(node => {
|
|
1991
|
+
if (node !== referenceRef.current) {
|
|
1992
|
+
referenceRef.current = node;
|
|
1993
|
+
_setReference(node);
|
|
1994
|
+
}
|
|
1995
|
+
}, []);
|
|
1996
|
+
const setFloating = React.useCallback(node => {
|
|
1997
|
+
if (node !== floatingRef.current) {
|
|
1998
|
+
floatingRef.current = node;
|
|
1999
|
+
_setFloating(node);
|
|
2000
|
+
}
|
|
2001
|
+
}, []);
|
|
2002
|
+
const referenceEl = externalReference || _reference;
|
|
2003
|
+
const floatingEl = externalFloating || _floating;
|
|
2004
|
+
const referenceRef = React.useRef(null);
|
|
2005
|
+
const floatingRef = React.useRef(null);
|
|
2006
|
+
const dataRef = React.useRef(data);
|
|
2007
|
+
const hasWhileElementsMounted = whileElementsMounted != null;
|
|
2008
|
+
const whileElementsMountedRef = useLatestRef(whileElementsMounted);
|
|
2009
|
+
const platformRef = useLatestRef(platform);
|
|
2010
|
+
const openRef = useLatestRef(open);
|
|
2011
|
+
const update = React.useCallback(() => {
|
|
2012
|
+
if (!referenceRef.current || !floatingRef.current) {
|
|
2013
|
+
return;
|
|
2014
|
+
}
|
|
2015
|
+
const config = {
|
|
2016
|
+
placement,
|
|
2017
|
+
strategy,
|
|
2018
|
+
middleware: latestMiddleware
|
|
2019
|
+
};
|
|
2020
|
+
if (platformRef.current) {
|
|
2021
|
+
config.platform = platformRef.current;
|
|
2022
|
+
}
|
|
2023
|
+
computePosition(referenceRef.current, floatingRef.current, config).then(data => {
|
|
2024
|
+
const fullData = {
|
|
2025
|
+
...data,
|
|
2026
|
+
// The floating element's position may be recomputed while it's closed
|
|
2027
|
+
// but still mounted (such as when transitioning out). To ensure
|
|
2028
|
+
// `isPositioned` will be `false` initially on the next open, avoid
|
|
2029
|
+
// setting it to `true` when `open === false` (must be specified).
|
|
2030
|
+
isPositioned: openRef.current !== false
|
|
2031
|
+
};
|
|
2032
|
+
if (isMountedRef.current && !deepEqual(dataRef.current, fullData)) {
|
|
2033
|
+
dataRef.current = fullData;
|
|
2034
|
+
ReactDOM.flushSync(() => {
|
|
2035
|
+
setData(fullData);
|
|
639
2036
|
});
|
|
2037
|
+
}
|
|
2038
|
+
});
|
|
2039
|
+
}, [latestMiddleware, placement, strategy, platformRef, openRef]);
|
|
2040
|
+
index(() => {
|
|
2041
|
+
if (open === false && dataRef.current.isPositioned) {
|
|
2042
|
+
dataRef.current.isPositioned = false;
|
|
2043
|
+
setData(data => ({
|
|
2044
|
+
...data,
|
|
2045
|
+
isPositioned: false
|
|
2046
|
+
}));
|
|
640
2047
|
}
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
const isHighlighted = ((_window_getSelection = window.getSelection()) == null ? void 0 : _window_getSelection.toString().length) > 0;
|
|
729
|
-
if (isHighlighted) return;
|
|
730
|
-
const yDelta = event.clientY - pointerStartRef.current.y;
|
|
731
|
-
const xDelta = event.clientX - pointerStartRef.current.x;
|
|
732
|
-
var _props_swipeDirections;
|
|
733
|
-
const swipeDirections = (_props_swipeDirections = props.swipeDirections) != null ? _props_swipeDirections : getDefaultSwipeDirections(position);
|
|
734
|
-
// Determine swipe direction if not already locked
|
|
735
|
-
if (!swipeDirection && (Math.abs(xDelta) > 1 || Math.abs(yDelta) > 1)) {
|
|
736
|
-
setSwipeDirection(Math.abs(xDelta) > Math.abs(yDelta) ? 'x' : 'y');
|
|
737
|
-
}
|
|
738
|
-
let swipeAmount = {
|
|
739
|
-
x: 0,
|
|
740
|
-
y: 0
|
|
741
|
-
};
|
|
742
|
-
const getDampening = (delta)=>{
|
|
743
|
-
const factor = Math.abs(delta) / 20;
|
|
744
|
-
return 1 / (1.5 + factor);
|
|
745
|
-
};
|
|
746
|
-
// Only apply swipe in the locked direction
|
|
747
|
-
if (swipeDirection === 'y') {
|
|
748
|
-
// Handle vertical swipes
|
|
749
|
-
if (swipeDirections.includes('top') || swipeDirections.includes('bottom')) {
|
|
750
|
-
if (swipeDirections.includes('top') && yDelta < 0 || swipeDirections.includes('bottom') && yDelta > 0) {
|
|
751
|
-
swipeAmount.y = yDelta;
|
|
752
|
-
} else {
|
|
753
|
-
// Smoothly transition to dampened movement
|
|
754
|
-
const dampenedDelta = yDelta * getDampening(yDelta);
|
|
755
|
-
// Ensure we don't jump when transitioning to dampened movement
|
|
756
|
-
swipeAmount.y = Math.abs(dampenedDelta) < Math.abs(yDelta) ? dampenedDelta : yDelta;
|
|
757
|
-
}
|
|
758
|
-
}
|
|
759
|
-
} else if (swipeDirection === 'x') {
|
|
760
|
-
// Handle horizontal swipes
|
|
761
|
-
if (swipeDirections.includes('left') || swipeDirections.includes('right')) {
|
|
762
|
-
if (swipeDirections.includes('left') && xDelta < 0 || swipeDirections.includes('right') && xDelta > 0) {
|
|
763
|
-
swipeAmount.x = xDelta;
|
|
764
|
-
} else {
|
|
765
|
-
// Smoothly transition to dampened movement
|
|
766
|
-
const dampenedDelta = xDelta * getDampening(xDelta);
|
|
767
|
-
// Ensure we don't jump when transitioning to dampened movement
|
|
768
|
-
swipeAmount.x = Math.abs(dampenedDelta) < Math.abs(xDelta) ? dampenedDelta : xDelta;
|
|
769
|
-
}
|
|
770
|
-
}
|
|
771
|
-
}
|
|
772
|
-
if (Math.abs(swipeAmount.x) > 0 || Math.abs(swipeAmount.y) > 0) {
|
|
773
|
-
setIsSwiped(true);
|
|
774
|
-
}
|
|
775
|
-
(_toastRef_current = toastRef.current) == null ? void 0 : _toastRef_current.style.setProperty('--swipe-amount-x', `${swipeAmount.x}px`);
|
|
776
|
-
(_toastRef_current1 = toastRef.current) == null ? void 0 : _toastRef_current1.style.setProperty('--swipe-amount-y', `${swipeAmount.y}px`);
|
|
2048
|
+
}, [open]);
|
|
2049
|
+
const isMountedRef = React.useRef(false);
|
|
2050
|
+
index(() => {
|
|
2051
|
+
isMountedRef.current = true;
|
|
2052
|
+
return () => {
|
|
2053
|
+
isMountedRef.current = false;
|
|
2054
|
+
};
|
|
2055
|
+
}, []);
|
|
2056
|
+
index(() => {
|
|
2057
|
+
if (referenceEl) referenceRef.current = referenceEl;
|
|
2058
|
+
if (floatingEl) floatingRef.current = floatingEl;
|
|
2059
|
+
if (referenceEl && floatingEl) {
|
|
2060
|
+
if (whileElementsMountedRef.current) {
|
|
2061
|
+
return whileElementsMountedRef.current(referenceEl, floatingEl, update);
|
|
2062
|
+
}
|
|
2063
|
+
update();
|
|
2064
|
+
}
|
|
2065
|
+
}, [referenceEl, floatingEl, update, whileElementsMountedRef, hasWhileElementsMounted]);
|
|
2066
|
+
const refs = React.useMemo(() => ({
|
|
2067
|
+
reference: referenceRef,
|
|
2068
|
+
floating: floatingRef,
|
|
2069
|
+
setReference,
|
|
2070
|
+
setFloating
|
|
2071
|
+
}), [setReference, setFloating]);
|
|
2072
|
+
const elements = React.useMemo(() => ({
|
|
2073
|
+
reference: referenceEl,
|
|
2074
|
+
floating: floatingEl
|
|
2075
|
+
}), [referenceEl, floatingEl]);
|
|
2076
|
+
const floatingStyles = React.useMemo(() => {
|
|
2077
|
+
const initialStyles = {
|
|
2078
|
+
position: strategy,
|
|
2079
|
+
left: 0,
|
|
2080
|
+
top: 0
|
|
2081
|
+
};
|
|
2082
|
+
if (!elements.floating) {
|
|
2083
|
+
return initialStyles;
|
|
2084
|
+
}
|
|
2085
|
+
const x = roundByDPR(elements.floating, data.x);
|
|
2086
|
+
const y = roundByDPR(elements.floating, data.y);
|
|
2087
|
+
if (transform) {
|
|
2088
|
+
return {
|
|
2089
|
+
...initialStyles,
|
|
2090
|
+
transform: "translate(" + x + "px, " + y + "px)",
|
|
2091
|
+
...(getDPR(elements.floating) >= 1.5 && {
|
|
2092
|
+
willChange: 'transform'
|
|
2093
|
+
})
|
|
2094
|
+
};
|
|
2095
|
+
}
|
|
2096
|
+
return {
|
|
2097
|
+
position: strategy,
|
|
2098
|
+
left: x,
|
|
2099
|
+
top: y
|
|
2100
|
+
};
|
|
2101
|
+
}, [strategy, transform, elements.floating, data.x, data.y]);
|
|
2102
|
+
return React.useMemo(() => ({
|
|
2103
|
+
...data,
|
|
2104
|
+
update,
|
|
2105
|
+
refs,
|
|
2106
|
+
elements,
|
|
2107
|
+
floatingStyles
|
|
2108
|
+
}), [data, update, refs, elements, floatingStyles]);
|
|
2109
|
+
}
|
|
2110
|
+
|
|
2111
|
+
/**
|
|
2112
|
+
* Provides data to position an inner element of the floating element so that it
|
|
2113
|
+
* appears centered to the reference element.
|
|
2114
|
+
* This wraps the core `arrow` middleware to allow React refs as the element.
|
|
2115
|
+
* @see https://floating-ui.com/docs/arrow
|
|
2116
|
+
*/
|
|
2117
|
+
const arrow$1 = options => {
|
|
2118
|
+
function isRef(value) {
|
|
2119
|
+
return {}.hasOwnProperty.call(value, 'current');
|
|
2120
|
+
}
|
|
2121
|
+
return {
|
|
2122
|
+
name: 'arrow',
|
|
2123
|
+
options,
|
|
2124
|
+
fn(state) {
|
|
2125
|
+
const {
|
|
2126
|
+
element,
|
|
2127
|
+
padding
|
|
2128
|
+
} = typeof options === 'function' ? options(state) : options;
|
|
2129
|
+
if (element && isRef(element)) {
|
|
2130
|
+
if (element.current != null) {
|
|
2131
|
+
return arrow$2({
|
|
2132
|
+
element: element.current,
|
|
2133
|
+
padding
|
|
2134
|
+
}).fn(state);
|
|
777
2135
|
}
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
}
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
798
|
-
|
|
799
|
-
|
|
800
|
-
|
|
801
|
-
|
|
802
|
-
|
|
803
|
-
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
2136
|
+
return {};
|
|
2137
|
+
}
|
|
2138
|
+
if (element) {
|
|
2139
|
+
return arrow$2({
|
|
2140
|
+
element,
|
|
2141
|
+
padding
|
|
2142
|
+
}).fn(state);
|
|
2143
|
+
}
|
|
2144
|
+
return {};
|
|
2145
|
+
}
|
|
2146
|
+
};
|
|
2147
|
+
};
|
|
2148
|
+
|
|
2149
|
+
/**
|
|
2150
|
+
* Modifies the placement by translating the floating element along the
|
|
2151
|
+
* specified axes.
|
|
2152
|
+
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
|
2153
|
+
* object may be passed.
|
|
2154
|
+
* @see https://floating-ui.com/docs/offset
|
|
2155
|
+
*/
|
|
2156
|
+
const offset = (options, deps) => {
|
|
2157
|
+
const result = offset$1(options);
|
|
2158
|
+
return {
|
|
2159
|
+
name: result.name,
|
|
2160
|
+
fn: result.fn,
|
|
2161
|
+
options: [options, deps]
|
|
2162
|
+
};
|
|
2163
|
+
};
|
|
2164
|
+
|
|
2165
|
+
/**
|
|
2166
|
+
* Optimizes the visibility of the floating element by shifting it in order to
|
|
2167
|
+
* keep it in view when it will overflow the clipping boundary.
|
|
2168
|
+
* @see https://floating-ui.com/docs/shift
|
|
2169
|
+
*/
|
|
2170
|
+
const shift = (options, deps) => {
|
|
2171
|
+
const result = shift$1(options);
|
|
2172
|
+
return {
|
|
2173
|
+
name: result.name,
|
|
2174
|
+
fn: result.fn,
|
|
2175
|
+
options: [options, deps]
|
|
2176
|
+
};
|
|
2177
|
+
};
|
|
2178
|
+
|
|
2179
|
+
/**
|
|
2180
|
+
* Built-in `limiter` that will stop `shift()` at a certain point.
|
|
2181
|
+
*/
|
|
2182
|
+
const limitShift = (options, deps) => {
|
|
2183
|
+
const result = limitShift$1(options);
|
|
2184
|
+
return {
|
|
2185
|
+
fn: result.fn,
|
|
2186
|
+
options: [options, deps]
|
|
2187
|
+
};
|
|
824
2188
|
};
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
2189
|
+
|
|
2190
|
+
/**
|
|
2191
|
+
* Optimizes the visibility of the floating element by flipping the `placement`
|
|
2192
|
+
* in order to keep it in view when the preferred placement(s) will overflow the
|
|
2193
|
+
* clipping boundary. Alternative to `autoPlacement`.
|
|
2194
|
+
* @see https://floating-ui.com/docs/flip
|
|
2195
|
+
*/
|
|
2196
|
+
const flip = (options, deps) => {
|
|
2197
|
+
const result = flip$1(options);
|
|
2198
|
+
return {
|
|
2199
|
+
name: result.name,
|
|
2200
|
+
fn: result.fn,
|
|
2201
|
+
options: [options, deps]
|
|
2202
|
+
};
|
|
2203
|
+
};
|
|
2204
|
+
|
|
2205
|
+
/**
|
|
2206
|
+
* Provides data that allows you to change the size of the floating element —
|
|
2207
|
+
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
2208
|
+
* width of the reference element.
|
|
2209
|
+
* @see https://floating-ui.com/docs/size
|
|
2210
|
+
*/
|
|
2211
|
+
const size = (options, deps) => {
|
|
2212
|
+
const result = size$1(options);
|
|
2213
|
+
return {
|
|
2214
|
+
name: result.name,
|
|
2215
|
+
fn: result.fn,
|
|
2216
|
+
options: [options, deps]
|
|
2217
|
+
};
|
|
2218
|
+
};
|
|
2219
|
+
|
|
2220
|
+
/**
|
|
2221
|
+
* Provides data to hide the floating element in applicable situations, such as
|
|
2222
|
+
* when it is not in the same clipping context as the reference element.
|
|
2223
|
+
* @see https://floating-ui.com/docs/hide
|
|
2224
|
+
*/
|
|
2225
|
+
const hide = (options, deps) => {
|
|
2226
|
+
const result = hide$1(options);
|
|
2227
|
+
return {
|
|
2228
|
+
name: result.name,
|
|
2229
|
+
fn: result.fn,
|
|
2230
|
+
options: [options, deps]
|
|
2231
|
+
};
|
|
2232
|
+
};
|
|
2233
|
+
|
|
2234
|
+
/**
|
|
2235
|
+
* Provides data to position an inner element of the floating element so that it
|
|
2236
|
+
* appears centered to the reference element.
|
|
2237
|
+
* This wraps the core `arrow` middleware to allow React refs as the element.
|
|
2238
|
+
* @see https://floating-ui.com/docs/arrow
|
|
2239
|
+
*/
|
|
2240
|
+
const arrow = (options, deps) => {
|
|
2241
|
+
const result = arrow$1(options);
|
|
2242
|
+
return {
|
|
2243
|
+
name: result.name,
|
|
2244
|
+
fn: result.fn,
|
|
2245
|
+
options: [options, deps]
|
|
2246
|
+
};
|
|
2247
|
+
};
|
|
2248
|
+
|
|
2249
|
+
// src/arrow.tsx
|
|
2250
|
+
var NAME = "Arrow";
|
|
2251
|
+
var Arrow$1 = React.forwardRef((props, forwardedRef) => {
|
|
2252
|
+
const { children, width = 10, height = 5, ...arrowProps } = props;
|
|
2253
|
+
return /* @__PURE__ */ jsx(
|
|
2254
|
+
Primitive.svg,
|
|
2255
|
+
{
|
|
2256
|
+
...arrowProps,
|
|
2257
|
+
ref: forwardedRef,
|
|
2258
|
+
width,
|
|
2259
|
+
height,
|
|
2260
|
+
viewBox: "0 0 30 10",
|
|
2261
|
+
preserveAspectRatio: "none",
|
|
2262
|
+
children: props.asChild ? children : /* @__PURE__ */ jsx("polygon", { points: "0,0 30,0 15,10" })
|
|
831
2263
|
}
|
|
832
|
-
|
|
833
|
-
}
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
856
|
-
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
'left'
|
|
861
|
-
].forEach((key)=>{
|
|
862
|
-
if (offset[key] === undefined) {
|
|
863
|
-
styles[`${prefix}-${key}`] = defaultValue;
|
|
864
|
-
} else {
|
|
865
|
-
styles[`${prefix}-${key}`] = typeof offset[key] === 'number' ? `${offset[key]}px` : offset[key];
|
|
866
|
-
}
|
|
867
|
-
});
|
|
868
|
-
} else {
|
|
869
|
-
assignAll(defaultValue);
|
|
870
|
-
}
|
|
2264
|
+
);
|
|
2265
|
+
});
|
|
2266
|
+
Arrow$1.displayName = NAME;
|
|
2267
|
+
var Root = Arrow$1;
|
|
2268
|
+
|
|
2269
|
+
var POPPER_NAME = "Popper";
|
|
2270
|
+
var [createPopperContext, createPopperScope] = createContextScope(POPPER_NAME);
|
|
2271
|
+
var [PopperProvider, usePopperContext] = createPopperContext(POPPER_NAME);
|
|
2272
|
+
var Popper = (props) => {
|
|
2273
|
+
const { __scopePopper, children } = props;
|
|
2274
|
+
const [anchor, setAnchor] = React.useState(null);
|
|
2275
|
+
return /* @__PURE__ */ jsx(PopperProvider, { scope: __scopePopper, anchor, onAnchorChange: setAnchor, children });
|
|
2276
|
+
};
|
|
2277
|
+
Popper.displayName = POPPER_NAME;
|
|
2278
|
+
var ANCHOR_NAME = "PopperAnchor";
|
|
2279
|
+
var PopperAnchor = React.forwardRef(
|
|
2280
|
+
(props, forwardedRef) => {
|
|
2281
|
+
const { __scopePopper, virtualRef, ...anchorProps } = props;
|
|
2282
|
+
const context = usePopperContext(ANCHOR_NAME, __scopePopper);
|
|
2283
|
+
const ref = React.useRef(null);
|
|
2284
|
+
const composedRefs = useComposedRefs(forwardedRef, ref);
|
|
2285
|
+
const anchorRef = React.useRef(null);
|
|
2286
|
+
React.useEffect(() => {
|
|
2287
|
+
const previousAnchor = anchorRef.current;
|
|
2288
|
+
anchorRef.current = virtualRef?.current || ref.current;
|
|
2289
|
+
if (previousAnchor !== anchorRef.current) {
|
|
2290
|
+
context.onAnchorChange(anchorRef.current);
|
|
2291
|
+
}
|
|
871
2292
|
});
|
|
872
|
-
return
|
|
873
|
-
}
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
const
|
|
881
|
-
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
886
|
-
|
|
887
|
-
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
const [
|
|
898
|
-
const
|
|
899
|
-
const [
|
|
900
|
-
const
|
|
901
|
-
const
|
|
902
|
-
const
|
|
903
|
-
const
|
|
904
|
-
const
|
|
905
|
-
const
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
2293
|
+
return virtualRef ? null : /* @__PURE__ */ jsx(Primitive.div, { ...anchorProps, ref: composedRefs });
|
|
2294
|
+
}
|
|
2295
|
+
);
|
|
2296
|
+
PopperAnchor.displayName = ANCHOR_NAME;
|
|
2297
|
+
var CONTENT_NAME = "PopperContent";
|
|
2298
|
+
var [PopperContentProvider, useContentContext] = createPopperContext(CONTENT_NAME);
|
|
2299
|
+
var PopperContent = React.forwardRef(
|
|
2300
|
+
(props, forwardedRef) => {
|
|
2301
|
+
const {
|
|
2302
|
+
__scopePopper,
|
|
2303
|
+
side = "bottom",
|
|
2304
|
+
sideOffset = 0,
|
|
2305
|
+
align = "center",
|
|
2306
|
+
alignOffset = 0,
|
|
2307
|
+
arrowPadding = 0,
|
|
2308
|
+
avoidCollisions = true,
|
|
2309
|
+
collisionBoundary = [],
|
|
2310
|
+
collisionPadding: collisionPaddingProp = 0,
|
|
2311
|
+
sticky = "partial",
|
|
2312
|
+
hideWhenDetached = false,
|
|
2313
|
+
updatePositionStrategy = "optimized",
|
|
2314
|
+
onPlaced,
|
|
2315
|
+
...contentProps
|
|
2316
|
+
} = props;
|
|
2317
|
+
const context = usePopperContext(CONTENT_NAME, __scopePopper);
|
|
2318
|
+
const [content, setContent] = React.useState(null);
|
|
2319
|
+
const composedRefs = useComposedRefs(forwardedRef, (node) => setContent(node));
|
|
2320
|
+
const [arrow$1, setArrow] = React.useState(null);
|
|
2321
|
+
const arrowSize = useSize(arrow$1);
|
|
2322
|
+
const arrowWidth = arrowSize?.width ?? 0;
|
|
2323
|
+
const arrowHeight = arrowSize?.height ?? 0;
|
|
2324
|
+
const desiredPlacement = side + (align !== "center" ? "-" + align : "");
|
|
2325
|
+
const collisionPadding = typeof collisionPaddingProp === "number" ? collisionPaddingProp : { top: 0, right: 0, bottom: 0, left: 0, ...collisionPaddingProp };
|
|
2326
|
+
const boundary = Array.isArray(collisionBoundary) ? collisionBoundary : [collisionBoundary];
|
|
2327
|
+
const hasExplicitBoundaries = boundary.length > 0;
|
|
2328
|
+
const detectOverflowOptions = {
|
|
2329
|
+
padding: collisionPadding,
|
|
2330
|
+
boundary: boundary.filter(isNotNull),
|
|
2331
|
+
// with `strategy: 'fixed'`, this is the only way to get it to respect boundaries
|
|
2332
|
+
altBoundary: hasExplicitBoundaries
|
|
2333
|
+
};
|
|
2334
|
+
const { refs, floatingStyles, placement, isPositioned, middlewareData } = useFloating({
|
|
2335
|
+
// default to `fixed` strategy so users don't have to pick and we also avoid focus scroll issues
|
|
2336
|
+
strategy: "fixed",
|
|
2337
|
+
placement: desiredPlacement,
|
|
2338
|
+
whileElementsMounted: (...args) => {
|
|
2339
|
+
const cleanup = autoUpdate(...args, {
|
|
2340
|
+
animationFrame: updatePositionStrategy === "always"
|
|
912
2341
|
});
|
|
913
|
-
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
|
|
917
|
-
|
|
918
|
-
|
|
919
|
-
|
|
920
|
-
|
|
921
|
-
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
|
|
947
|
-
|
|
948
|
-
|
|
949
|
-
|
|
950
|
-
|
|
951
|
-
|
|
952
|
-
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
961
|
-
|
|
962
|
-
|
|
963
|
-
|
|
964
|
-
|
|
965
|
-
|
|
966
|
-
|
|
967
|
-
|
|
968
|
-
|
|
969
|
-
|
|
970
|
-
|
|
971
|
-
|
|
972
|
-
|
|
973
|
-
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
}
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
|
|
993
|
-
|
|
994
|
-
|
|
995
|
-
|
|
996
|
-
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
toasts
|
|
1003
|
-
]);
|
|
1004
|
-
React__default.useEffect(()=>{
|
|
1005
|
-
const handleKeyDown = (event)=>{
|
|
1006
|
-
var _listRef_current;
|
|
1007
|
-
const isHotkeyPressed = hotkey.every((key)=>event[key] || event.code === key);
|
|
1008
|
-
if (isHotkeyPressed) {
|
|
1009
|
-
var _listRef_current1;
|
|
1010
|
-
setExpanded(true);
|
|
1011
|
-
(_listRef_current1 = listRef.current) == null ? void 0 : _listRef_current1.focus();
|
|
1012
|
-
}
|
|
1013
|
-
if (event.code === 'Escape' && (document.activeElement === listRef.current || ((_listRef_current = listRef.current) == null ? void 0 : _listRef_current.contains(document.activeElement)))) {
|
|
1014
|
-
setExpanded(false);
|
|
1015
|
-
}
|
|
1016
|
-
};
|
|
1017
|
-
document.addEventListener('keydown', handleKeyDown);
|
|
1018
|
-
return ()=>document.removeEventListener('keydown', handleKeyDown);
|
|
1019
|
-
}, [
|
|
1020
|
-
hotkey
|
|
1021
|
-
]);
|
|
1022
|
-
React__default.useEffect(()=>{
|
|
1023
|
-
if (listRef.current) {
|
|
1024
|
-
return ()=>{
|
|
1025
|
-
if (lastFocusedElementRef.current) {
|
|
1026
|
-
lastFocusedElementRef.current.focus({
|
|
1027
|
-
preventScroll: true
|
|
1028
|
-
});
|
|
1029
|
-
lastFocusedElementRef.current = null;
|
|
1030
|
-
isFocusWithinRef.current = false;
|
|
2342
|
+
return cleanup;
|
|
2343
|
+
},
|
|
2344
|
+
elements: {
|
|
2345
|
+
reference: context.anchor
|
|
2346
|
+
},
|
|
2347
|
+
middleware: [
|
|
2348
|
+
offset({ mainAxis: sideOffset + arrowHeight, alignmentAxis: alignOffset }),
|
|
2349
|
+
avoidCollisions && shift({
|
|
2350
|
+
mainAxis: true,
|
|
2351
|
+
crossAxis: false,
|
|
2352
|
+
limiter: sticky === "partial" ? limitShift() : void 0,
|
|
2353
|
+
...detectOverflowOptions
|
|
2354
|
+
}),
|
|
2355
|
+
avoidCollisions && flip({ ...detectOverflowOptions }),
|
|
2356
|
+
size({
|
|
2357
|
+
...detectOverflowOptions,
|
|
2358
|
+
apply: ({ elements, rects, availableWidth, availableHeight }) => {
|
|
2359
|
+
const { width: anchorWidth, height: anchorHeight } = rects.reference;
|
|
2360
|
+
const contentStyle = elements.floating.style;
|
|
2361
|
+
contentStyle.setProperty("--radix-popper-available-width", `${availableWidth}px`);
|
|
2362
|
+
contentStyle.setProperty("--radix-popper-available-height", `${availableHeight}px`);
|
|
2363
|
+
contentStyle.setProperty("--radix-popper-anchor-width", `${anchorWidth}px`);
|
|
2364
|
+
contentStyle.setProperty("--radix-popper-anchor-height", `${anchorHeight}px`);
|
|
2365
|
+
}
|
|
2366
|
+
}),
|
|
2367
|
+
arrow$1 && arrow({ element: arrow$1, padding: arrowPadding }),
|
|
2368
|
+
transformOrigin({ arrowWidth, arrowHeight }),
|
|
2369
|
+
hideWhenDetached && hide({ strategy: "referenceHidden", ...detectOverflowOptions })
|
|
2370
|
+
]
|
|
2371
|
+
});
|
|
2372
|
+
const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
|
|
2373
|
+
const handlePlaced = useCallbackRef(onPlaced);
|
|
2374
|
+
useLayoutEffect2(() => {
|
|
2375
|
+
if (isPositioned) {
|
|
2376
|
+
handlePlaced?.();
|
|
2377
|
+
}
|
|
2378
|
+
}, [isPositioned, handlePlaced]);
|
|
2379
|
+
const arrowX = middlewareData.arrow?.x;
|
|
2380
|
+
const arrowY = middlewareData.arrow?.y;
|
|
2381
|
+
const cannotCenterArrow = middlewareData.arrow?.centerOffset !== 0;
|
|
2382
|
+
const [contentZIndex, setContentZIndex] = React.useState();
|
|
2383
|
+
useLayoutEffect2(() => {
|
|
2384
|
+
if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
|
|
2385
|
+
}, [content]);
|
|
2386
|
+
return /* @__PURE__ */ jsx(
|
|
2387
|
+
"div",
|
|
2388
|
+
{
|
|
2389
|
+
ref: refs.setFloating,
|
|
2390
|
+
"data-radix-popper-content-wrapper": "",
|
|
2391
|
+
style: {
|
|
2392
|
+
...floatingStyles,
|
|
2393
|
+
transform: isPositioned ? floatingStyles.transform : "translate(0, -200%)",
|
|
2394
|
+
// keep off the page when measuring
|
|
2395
|
+
minWidth: "max-content",
|
|
2396
|
+
zIndex: contentZIndex,
|
|
2397
|
+
["--radix-popper-transform-origin"]: [
|
|
2398
|
+
middlewareData.transformOrigin?.x,
|
|
2399
|
+
middlewareData.transformOrigin?.y
|
|
2400
|
+
].join(" "),
|
|
2401
|
+
// hide the content if using the hide middleware and should be hidden
|
|
2402
|
+
// set visibility to hidden and disable pointer events so the UI behaves
|
|
2403
|
+
// as if the PopperContent isn't there at all
|
|
2404
|
+
...middlewareData.hide?.referenceHidden && {
|
|
2405
|
+
visibility: "hidden",
|
|
2406
|
+
pointerEvents: "none"
|
|
2407
|
+
}
|
|
2408
|
+
},
|
|
2409
|
+
dir: props.dir,
|
|
2410
|
+
children: /* @__PURE__ */ jsx(
|
|
2411
|
+
PopperContentProvider,
|
|
2412
|
+
{
|
|
2413
|
+
scope: __scopePopper,
|
|
2414
|
+
placedSide,
|
|
2415
|
+
onArrowChange: setArrow,
|
|
2416
|
+
arrowX,
|
|
2417
|
+
arrowY,
|
|
2418
|
+
shouldHideArrow: cannotCenterArrow,
|
|
2419
|
+
children: /* @__PURE__ */ jsx(
|
|
2420
|
+
Primitive.div,
|
|
2421
|
+
{
|
|
2422
|
+
"data-side": placedSide,
|
|
2423
|
+
"data-align": placedAlign,
|
|
2424
|
+
...contentProps,
|
|
2425
|
+
ref: composedRefs,
|
|
2426
|
+
style: {
|
|
2427
|
+
...contentProps.style,
|
|
2428
|
+
// if the PopperContent hasn't been placed yet (not all measurements done)
|
|
2429
|
+
// we prevent animations so that users's animation don't kick in too early referring wrong sides
|
|
2430
|
+
animation: !isPositioned ? "none" : void 0
|
|
1031
2431
|
}
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1036
|
-
|
|
1037
|
-
|
|
1038
|
-
|
|
1039
|
-
|
|
1040
|
-
|
|
1041
|
-
|
|
1042
|
-
|
|
1043
|
-
|
|
1044
|
-
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1049
|
-
|
|
1050
|
-
|
|
1051
|
-
|
|
1052
|
-
|
|
1053
|
-
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
|
|
2432
|
+
}
|
|
2433
|
+
)
|
|
2434
|
+
}
|
|
2435
|
+
)
|
|
2436
|
+
}
|
|
2437
|
+
);
|
|
2438
|
+
}
|
|
2439
|
+
);
|
|
2440
|
+
PopperContent.displayName = CONTENT_NAME;
|
|
2441
|
+
var ARROW_NAME = "PopperArrow";
|
|
2442
|
+
var OPPOSITE_SIDE = {
|
|
2443
|
+
top: "bottom",
|
|
2444
|
+
right: "left",
|
|
2445
|
+
bottom: "top",
|
|
2446
|
+
left: "right"
|
|
2447
|
+
};
|
|
2448
|
+
var PopperArrow = React.forwardRef(function PopperArrow2(props, forwardedRef) {
|
|
2449
|
+
const { __scopePopper, ...arrowProps } = props;
|
|
2450
|
+
const contentContext = useContentContext(ARROW_NAME, __scopePopper);
|
|
2451
|
+
const baseSide = OPPOSITE_SIDE[contentContext.placedSide];
|
|
2452
|
+
return (
|
|
2453
|
+
// we have to use an extra wrapper because `ResizeObserver` (used by `useSize`)
|
|
2454
|
+
// doesn't report size as we'd expect on SVG elements.
|
|
2455
|
+
// it reports their bounding box which is effectively the largest path inside the SVG.
|
|
2456
|
+
/* @__PURE__ */ jsx(
|
|
2457
|
+
"span",
|
|
2458
|
+
{
|
|
2459
|
+
ref: contentContext.onArrowChange,
|
|
2460
|
+
style: {
|
|
2461
|
+
position: "absolute",
|
|
2462
|
+
left: contentContext.arrowX,
|
|
2463
|
+
top: contentContext.arrowY,
|
|
2464
|
+
[baseSide]: 0,
|
|
2465
|
+
transformOrigin: {
|
|
2466
|
+
top: "",
|
|
2467
|
+
right: "0 0",
|
|
2468
|
+
bottom: "center 0",
|
|
2469
|
+
left: "100% 0"
|
|
2470
|
+
}[contentContext.placedSide],
|
|
2471
|
+
transform: {
|
|
2472
|
+
top: "translateY(100%)",
|
|
2473
|
+
right: "translateY(50%) rotate(90deg) translateX(-50%)",
|
|
2474
|
+
bottom: `rotate(180deg)`,
|
|
2475
|
+
left: "translateY(50%) rotate(-90deg) translateX(50%)"
|
|
2476
|
+
}[contentContext.placedSide],
|
|
2477
|
+
visibility: contentContext.shouldHideArrow ? "hidden" : void 0
|
|
2478
|
+
},
|
|
2479
|
+
children: /* @__PURE__ */ jsx(
|
|
2480
|
+
Root,
|
|
2481
|
+
{
|
|
2482
|
+
...arrowProps,
|
|
2483
|
+
ref: forwardedRef,
|
|
1060
2484
|
style: {
|
|
1061
|
-
|
|
1062
|
-
|
|
1063
|
-
|
|
1064
|
-
|
|
1065
|
-
|
|
1066
|
-
|
|
1067
|
-
|
|
1068
|
-
|
|
1069
|
-
|
|
1070
|
-
if (lastFocusedElementRef.current) {
|
|
1071
|
-
lastFocusedElementRef.current.focus({
|
|
1072
|
-
preventScroll: true
|
|
1073
|
-
});
|
|
1074
|
-
lastFocusedElementRef.current = null;
|
|
1075
|
-
}
|
|
1076
|
-
}
|
|
1077
|
-
},
|
|
1078
|
-
onFocus: (event)=>{
|
|
1079
|
-
const isNotDismissible = event.target instanceof HTMLElement && event.target.dataset.dismissible === 'false';
|
|
1080
|
-
if (isNotDismissible) return;
|
|
1081
|
-
if (!isFocusWithinRef.current) {
|
|
1082
|
-
isFocusWithinRef.current = true;
|
|
1083
|
-
lastFocusedElementRef.current = event.relatedTarget;
|
|
1084
|
-
}
|
|
1085
|
-
},
|
|
1086
|
-
onMouseEnter: ()=>setExpanded(true),
|
|
1087
|
-
onMouseMove: ()=>setExpanded(true),
|
|
1088
|
-
onMouseLeave: ()=>{
|
|
1089
|
-
// Avoid setting expanded to false when interacting with a toast, e.g. swiping
|
|
1090
|
-
if (!interacting) {
|
|
1091
|
-
setExpanded(false);
|
|
1092
|
-
}
|
|
1093
|
-
},
|
|
1094
|
-
onDragEnd: ()=>setExpanded(false),
|
|
1095
|
-
onPointerDown: (event)=>{
|
|
1096
|
-
const isNotDismissible = event.target instanceof HTMLElement && event.target.dataset.dismissible === 'false';
|
|
1097
|
-
if (isNotDismissible) return;
|
|
1098
|
-
setInteracting(true);
|
|
1099
|
-
},
|
|
1100
|
-
onPointerUp: ()=>setInteracting(false)
|
|
1101
|
-
}, filteredToasts.filter((toast)=>!toast.position && index === 0 || toast.position === position).map((toast, index)=>{
|
|
1102
|
-
var _toastOptions_duration, _toastOptions_closeButton;
|
|
1103
|
-
return /*#__PURE__*/ React__default.createElement(Toast, {
|
|
1104
|
-
key: toast.id,
|
|
1105
|
-
icons: icons,
|
|
1106
|
-
index: index,
|
|
1107
|
-
toast: toast,
|
|
1108
|
-
defaultRichColors: richColors,
|
|
1109
|
-
duration: (_toastOptions_duration = toastOptions == null ? void 0 : toastOptions.duration) != null ? _toastOptions_duration : duration,
|
|
1110
|
-
className: toastOptions == null ? void 0 : toastOptions.className,
|
|
1111
|
-
descriptionClassName: toastOptions == null ? void 0 : toastOptions.descriptionClassName,
|
|
1112
|
-
invert: invert,
|
|
1113
|
-
visibleToasts: visibleToasts,
|
|
1114
|
-
closeButton: (_toastOptions_closeButton = toastOptions == null ? void 0 : toastOptions.closeButton) != null ? _toastOptions_closeButton : closeButton,
|
|
1115
|
-
interacting: interacting,
|
|
1116
|
-
position: position,
|
|
1117
|
-
style: toastOptions == null ? void 0 : toastOptions.style,
|
|
1118
|
-
unstyled: toastOptions == null ? void 0 : toastOptions.unstyled,
|
|
1119
|
-
classNames: toastOptions == null ? void 0 : toastOptions.classNames,
|
|
1120
|
-
cancelButtonStyle: toastOptions == null ? void 0 : toastOptions.cancelButtonStyle,
|
|
1121
|
-
actionButtonStyle: toastOptions == null ? void 0 : toastOptions.actionButtonStyle,
|
|
1122
|
-
closeButtonAriaLabel: toastOptions == null ? void 0 : toastOptions.closeButtonAriaLabel,
|
|
1123
|
-
removeToast: removeToast,
|
|
1124
|
-
toasts: filteredToasts.filter((t)=>t.position == toast.position),
|
|
1125
|
-
heights: heights.filter((h)=>h.position == toast.position),
|
|
1126
|
-
setHeights: setHeights,
|
|
1127
|
-
expandByDefault: expand,
|
|
1128
|
-
gap: gap,
|
|
1129
|
-
expanded: expanded,
|
|
1130
|
-
swipeDirections: props.swipeDirections
|
|
1131
|
-
});
|
|
1132
|
-
}));
|
|
1133
|
-
})));
|
|
2485
|
+
...arrowProps.style,
|
|
2486
|
+
// ensures the element can be measured correctly (mostly for if SVG)
|
|
2487
|
+
display: "block"
|
|
2488
|
+
}
|
|
2489
|
+
}
|
|
2490
|
+
)
|
|
2491
|
+
}
|
|
2492
|
+
)
|
|
2493
|
+
);
|
|
1134
2494
|
});
|
|
2495
|
+
PopperArrow.displayName = ARROW_NAME;
|
|
2496
|
+
function isNotNull(value) {
|
|
2497
|
+
return value !== null;
|
|
2498
|
+
}
|
|
2499
|
+
var transformOrigin = (options) => ({
|
|
2500
|
+
name: "transformOrigin",
|
|
2501
|
+
options,
|
|
2502
|
+
fn(data) {
|
|
2503
|
+
const { placement, rects, middlewareData } = data;
|
|
2504
|
+
const cannotCenterArrow = middlewareData.arrow?.centerOffset !== 0;
|
|
2505
|
+
const isArrowHidden = cannotCenterArrow;
|
|
2506
|
+
const arrowWidth = isArrowHidden ? 0 : options.arrowWidth;
|
|
2507
|
+
const arrowHeight = isArrowHidden ? 0 : options.arrowHeight;
|
|
2508
|
+
const [placedSide, placedAlign] = getSideAndAlignFromPlacement(placement);
|
|
2509
|
+
const noArrowAlign = { start: "0%", center: "50%", end: "100%" }[placedAlign];
|
|
2510
|
+
const arrowXCenter = (middlewareData.arrow?.x ?? 0) + arrowWidth / 2;
|
|
2511
|
+
const arrowYCenter = (middlewareData.arrow?.y ?? 0) + arrowHeight / 2;
|
|
2512
|
+
let x = "";
|
|
2513
|
+
let y = "";
|
|
2514
|
+
if (placedSide === "bottom") {
|
|
2515
|
+
x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
|
|
2516
|
+
y = `${-arrowHeight}px`;
|
|
2517
|
+
} else if (placedSide === "top") {
|
|
2518
|
+
x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
|
|
2519
|
+
y = `${rects.floating.height + arrowHeight}px`;
|
|
2520
|
+
} else if (placedSide === "right") {
|
|
2521
|
+
x = `${-arrowHeight}px`;
|
|
2522
|
+
y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
|
|
2523
|
+
} else if (placedSide === "left") {
|
|
2524
|
+
x = `${rects.floating.width + arrowHeight}px`;
|
|
2525
|
+
y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
|
|
2526
|
+
}
|
|
2527
|
+
return { data: { x, y } };
|
|
2528
|
+
}
|
|
2529
|
+
});
|
|
2530
|
+
function getSideAndAlignFromPlacement(placement) {
|
|
2531
|
+
const [side, align = "center"] = placement.split("-");
|
|
2532
|
+
return [side, align];
|
|
2533
|
+
}
|
|
2534
|
+
var Root2 = Popper;
|
|
2535
|
+
var Anchor = PopperAnchor;
|
|
2536
|
+
var Content = PopperContent;
|
|
2537
|
+
var Arrow = PopperArrow;
|
|
1135
2538
|
|
|
1136
|
-
export {
|
|
2539
|
+
export { Anchor as A, Content as C, Root2 as R, Arrow as a, isHTMLElement as b, createPopperScope as c, isElement as d, isWebKit as e, floor as f, getOverflowAncestors as g, isLastTraversableNode as h, isShadowRoot as i, getParentNode as j, getComputedStyle$1 as k, isNode as l, getNodeName as m, autoUpdate as n, offset as o, flip as p, shift as s, useFloating as u };
|
|
1137
2540
|
//# sourceMappingURL=index26.js.map
|