@jobber/components 9.6.0 → 9.6.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/ActivityIndicator-cjs.js +1 -0
- package/dist/ActivityIndicator-es.js +1 -0
- package/dist/Autocomplete/index.cjs +2 -0
- package/dist/Autocomplete/index.mjs +2 -0
- package/dist/Autocomplete-cjs.js +6 -4
- package/dist/Autocomplete-es.js +3 -1
- package/dist/Banner-cjs.js +1 -0
- package/dist/Banner-es.js +1 -0
- package/dist/Card/index.cjs +2 -1
- package/dist/Card/index.mjs +2 -1
- package/dist/Chip/index.cjs +2 -0
- package/dist/Chip/index.mjs +2 -0
- package/dist/Chip-cjs.js +1 -0
- package/dist/Chip-es.js +1 -0
- package/dist/Chips/InternalChipDismissible/hooks/index.cjs +2 -0
- package/dist/Chips/InternalChipDismissible/hooks/index.mjs +2 -0
- package/dist/Chips/InternalChipDismissible/index.cjs +2 -0
- package/dist/Chips/InternalChipDismissible/index.mjs +2 -0
- package/dist/Chips/index.cjs +2 -0
- package/dist/Chips/index.mjs +2 -0
- package/dist/Combobox/index.cjs +4 -2
- package/dist/Combobox/index.mjs +4 -2
- package/dist/{ComboboxSeparator-cjs.js → ComboboxChipRemove-cjs.js} +455 -501
- package/dist/{ComboboxSeparator-es.js → ComboboxChipRemove-es.js} +456 -500
- package/dist/ComboboxPrimitive-cjs.js +30 -29
- package/dist/ComboboxPrimitive-es.js +3 -2
- package/dist/ConfirmationModal/index.cjs +2 -0
- package/dist/ConfirmationModal/index.mjs +2 -0
- package/dist/ConfirmationModal-cjs.js +1 -0
- package/dist/ConfirmationModal-es.js +1 -0
- package/dist/DataDump/index.cjs +2 -1
- package/dist/DataDump/index.mjs +2 -1
- package/dist/DataDump-cjs.js +1 -0
- package/dist/DataDump-es.js +1 -0
- package/dist/DataList/components/DataListActions/index.cjs +2 -0
- package/dist/DataList/components/DataListActions/index.mjs +2 -0
- package/dist/DataList/components/DataListBulkActions/index.cjs +2 -0
- package/dist/DataList/components/DataListBulkActions/index.mjs +2 -0
- package/dist/DataList/components/DataListFilters/components/DataListSort/index.cjs +2 -0
- package/dist/DataList/components/DataListFilters/components/DataListSort/index.mjs +2 -0
- package/dist/DataList/components/DataListFilters/index.cjs +2 -0
- package/dist/DataList/components/DataListFilters/index.mjs +2 -0
- package/dist/DataList/components/DataListHeader/index.cjs +2 -0
- package/dist/DataList/components/DataListHeader/index.mjs +2 -0
- package/dist/DataList/components/DataListItem/index.cjs +2 -0
- package/dist/DataList/components/DataListItem/index.mjs +2 -0
- package/dist/DataList/components/DataListItemActions/index.cjs +2 -0
- package/dist/DataList/components/DataListItemActions/index.mjs +2 -0
- package/dist/DataList/components/DataListItemActionsOverflow/index.cjs +2 -0
- package/dist/DataList/components/DataListItemActionsOverflow/index.mjs +2 -0
- package/dist/DataList/components/DataListItems/index.cjs +2 -0
- package/dist/DataList/components/DataListItems/index.mjs +2 -0
- package/dist/DataList/components/DataListLayout/index.cjs +2 -0
- package/dist/DataList/components/DataListLayout/index.mjs +2 -0
- package/dist/DataList/components/DataListLayoutActions/index.cjs +2 -0
- package/dist/DataList/components/DataListLayoutActions/index.mjs +2 -0
- package/dist/DataList/index.cjs +2 -0
- package/dist/DataList/index.mjs +2 -0
- package/dist/DataTable-cjs.js +1 -0
- package/dist/DataTable-es.js +1 -0
- package/dist/DatePicker/index.cjs +2 -0
- package/dist/DatePicker/index.mjs +2 -0
- package/dist/DatePicker-cjs.js +8 -7
- package/dist/DatePicker-es.js +6 -5
- package/dist/Dialog/index.cjs +2 -1
- package/dist/Dialog/index.mjs +2 -1
- package/dist/DrawerDescription-cjs.js +99 -268
- package/dist/DrawerDescription-es.js +103 -270
- package/dist/DrawerGrid-cjs.js +1 -0
- package/dist/DrawerGrid-es.js +1 -0
- package/dist/DrawerTitle-cjs.js +6 -2
- package/dist/DrawerTitle-es.js +7 -3
- package/dist/FeatureSwitch-cjs.js +1 -0
- package/dist/FeatureSwitch-es.js +1 -0
- package/dist/FieldDescription-cjs.js +181 -184
- package/dist/FieldDescription-es.js +184 -187
- package/dist/FilterPicker/components/FilterPickerActivator/index.cjs +2 -0
- package/dist/FilterPicker/components/FilterPickerActivator/index.mjs +2 -0
- package/dist/FilterPicker/components/FilterPickerContent/index.cjs +2 -0
- package/dist/FilterPicker/components/FilterPickerContent/index.mjs +2 -0
- package/dist/FilterPicker/components/FilterPickerTrigger/index.cjs +2 -0
- package/dist/FilterPicker/components/FilterPickerTrigger/index.mjs +2 -0
- package/dist/FilterPicker/index.cjs +2 -0
- package/dist/FilterPicker/index.mjs +2 -0
- package/dist/FilterPickerContent-cjs.js +5 -4
- package/dist/FilterPickerContent-es.js +2 -1
- package/dist/FormFieldWrapper-cjs.js +1 -0
- package/dist/FormFieldWrapper-es.js +1 -0
- package/dist/FormatFile/index.cjs +2 -0
- package/dist/FormatFile/index.mjs +2 -0
- package/dist/FormatFile-cjs.js +1 -0
- package/dist/FormatFile-es.js +1 -0
- package/dist/Gallery/index.cjs +2 -0
- package/dist/Gallery/index.mjs +2 -0
- package/dist/InputAvatar-cjs.js +1 -0
- package/dist/InputAvatar-es.js +1 -0
- package/dist/InputDate/index.cjs +2 -0
- package/dist/InputDate/index.mjs +2 -0
- package/dist/InputDate-cjs.js +1 -0
- package/dist/InputDate-es.js +1 -0
- package/dist/InputNumber/index.cjs +2 -1
- package/dist/InputNumber/index.mjs +2 -1
- package/dist/InternalChipDismissible-cjs.js +1 -0
- package/dist/InternalChipDismissible-es.js +1 -0
- package/dist/LightBox/index.cjs +2 -0
- package/dist/LightBox/index.mjs +2 -0
- package/dist/LightBox-cjs.js +1 -0
- package/dist/LightBox-es.js +1 -0
- package/dist/Menu/index.cjs +2 -1
- package/dist/Menu/index.mjs +2 -1
- package/dist/Menu-cjs.js +6 -4
- package/dist/Menu-es.js +3 -1
- package/dist/MenuSubmenuTrigger-cjs.js +164 -206
- package/dist/MenuSubmenuTrigger-es.js +152 -194
- package/dist/Modal/index.cjs +3 -1
- package/dist/Modal/index.mjs +4 -2
- package/dist/NumberFieldInput-cjs.js +308 -187
- package/dist/NumberFieldInput-es.js +308 -187
- package/dist/Page/index.cjs +2 -1
- package/dist/Page/index.mjs +2 -1
- package/dist/Page-cjs.js +1 -0
- package/dist/Page-es.js +1 -0
- package/dist/Popover/index.cjs +2 -0
- package/dist/Popover/index.mjs +2 -0
- package/dist/Popover-cjs.js +9 -7
- package/dist/Popover-es.js +3 -1
- package/dist/ProgressBar-cjs.js +1 -0
- package/dist/ProgressBar-es.js +1 -0
- package/dist/ScrollAreaViewport-cjs.js +1093 -747
- package/dist/ScrollAreaViewport-es.js +1081 -734
- package/dist/Select/index.cjs +2 -1
- package/dist/Select/index.mjs +2 -1
- package/dist/SelectGroupLabel-cjs.js +306 -207
- package/dist/SelectGroupLabel-es.js +302 -203
- package/dist/SideDrawer-cjs.js +1 -0
- package/dist/SideDrawer-es.js +1 -0
- package/dist/Spinner-cjs.js +1 -0
- package/dist/Spinner-es.js +1 -0
- package/dist/Tooltip/index.cjs +2 -0
- package/dist/Tooltip/index.mjs +2 -0
- package/dist/Tooltip-cjs.js +7 -6
- package/dist/Tooltip-es.js +2 -1
- package/dist/dialogReturnFocus-cjs.js +1 -1
- package/dist/dialogReturnFocus-es.js +2 -2
- package/dist/floating-ui.react-cjs.js +192 -2564
- package/dist/floating-ui.react-dom-cjs.js +2103 -0
- package/dist/floating-ui.react-dom-es.js +2072 -0
- package/dist/floating-ui.react-es.js +156 -2519
- package/dist/floating-ui.utils-cjs.js +342 -0
- package/dist/floating-ui.utils-es.js +300 -0
- package/dist/index.cjs +4 -3
- package/dist/index.mjs +4 -3
- package/dist/primitives/BottomSheet/index.cjs +1 -1
- package/dist/primitives/BottomSheet/index.mjs +1 -1
- package/dist/primitives/ComboboxPrimitive/index.cjs +4 -2
- package/dist/primitives/ComboboxPrimitive/index.mjs +4 -2
- package/dist/primitives/SelectPrimitive/index.cjs +2 -0
- package/dist/primitives/SelectPrimitive/index.mjs +2 -0
- package/dist/primitives/index.cjs +3 -2
- package/dist/primitives/index.mjs +3 -2
- package/dist/scrollEdges-cjs.js +11 -1
- package/dist/scrollEdges-es.js +11 -1
- package/dist/sharedHelpers/i18n/index.cjs +1 -0
- package/dist/sharedHelpers/i18n/index.d.ts +1 -0
- package/dist/sharedHelpers/i18n/index.mjs +1 -1
- package/dist/sharedHelpers/i18n/releasedLanguages.d.ts +12 -0
- package/dist/sharedHelpers/i18n/useReleasedLocale.d.ts +6 -0
- package/dist/showToast-cjs.js +1 -1
- package/dist/showToast-es.js +1 -1
- package/dist/testUtils/releasedLanguages.d.ts +16 -0
- package/dist/unstyledPrimitives/index.cjs +478 -720
- package/dist/unstyledPrimitives/index.mjs +421 -663
- package/dist/useAtlantisI18n-cjs.js +44 -11
- package/dist/useAtlantisI18n-es.js +44 -12
- package/dist/useCompositeListItem-cjs.js +361 -2108
- package/dist/useCompositeListItem-es.js +331 -2076
- package/dist/useLabel-cjs.js +3 -2
- package/dist/useLabel-es.js +3 -2
- package/dist/useRenderElement-cjs.js +7 -9
- package/dist/useRenderElement-es.js +7 -9
- package/dist/useScrollLock-cjs.js +344 -819
- package/dist/useScrollLock-es.js +296 -732
- package/dist/useScrollToActive-cjs.js +5 -4
- package/dist/useScrollToActive-es.js +2 -1
- package/package.json +3 -3
- package/dist/scrollable-cjs.js +0 -58
- package/dist/scrollable-es.js +0 -54
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
3
|
var React = require('react');
|
|
4
|
+
var floatingUi_utils = require('./floating-ui.utils-cjs.js');
|
|
4
5
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
6
|
var ReactDOM = require('react-dom');
|
|
7
|
+
var floatingUi_reactDom = require('./floating-ui.react-dom-cjs.js');
|
|
6
8
|
|
|
7
9
|
function _interopNamespaceDefault(e) {
|
|
8
10
|
var n = Object.create(null);
|
|
@@ -24,305 +26,6 @@ function _interopNamespaceDefault(e) {
|
|
|
24
26
|
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
25
27
|
var ReactDOM__namespace = /*#__PURE__*/_interopNamespaceDefault(ReactDOM);
|
|
26
28
|
|
|
27
|
-
function hasWindow() {
|
|
28
|
-
return typeof window !== 'undefined';
|
|
29
|
-
}
|
|
30
|
-
function getNodeName(node) {
|
|
31
|
-
if (isNode(node)) {
|
|
32
|
-
return (node.nodeName || '').toLowerCase();
|
|
33
|
-
}
|
|
34
|
-
// Mocked nodes in testing environments may not be instances of Node. By
|
|
35
|
-
// returning `#document` an infinite loop won't occur.
|
|
36
|
-
// https://github.com/floating-ui/floating-ui/issues/2317
|
|
37
|
-
return '#document';
|
|
38
|
-
}
|
|
39
|
-
function getWindow(node) {
|
|
40
|
-
var _node$ownerDocument;
|
|
41
|
-
return (node == null || (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
|
|
42
|
-
}
|
|
43
|
-
function getDocumentElement(node) {
|
|
44
|
-
var _ref;
|
|
45
|
-
return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
|
|
46
|
-
}
|
|
47
|
-
function isNode(value) {
|
|
48
|
-
if (!hasWindow()) {
|
|
49
|
-
return false;
|
|
50
|
-
}
|
|
51
|
-
return value instanceof Node || value instanceof getWindow(value).Node;
|
|
52
|
-
}
|
|
53
|
-
function isElement(value) {
|
|
54
|
-
if (!hasWindow()) {
|
|
55
|
-
return false;
|
|
56
|
-
}
|
|
57
|
-
return value instanceof Element || value instanceof getWindow(value).Element;
|
|
58
|
-
}
|
|
59
|
-
function isHTMLElement(value) {
|
|
60
|
-
if (!hasWindow()) {
|
|
61
|
-
return false;
|
|
62
|
-
}
|
|
63
|
-
return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
|
|
64
|
-
}
|
|
65
|
-
function isShadowRoot(value) {
|
|
66
|
-
if (!hasWindow() || typeof ShadowRoot === 'undefined') {
|
|
67
|
-
return false;
|
|
68
|
-
}
|
|
69
|
-
return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
|
|
70
|
-
}
|
|
71
|
-
function isOverflowElement(element) {
|
|
72
|
-
const {
|
|
73
|
-
overflow,
|
|
74
|
-
overflowX,
|
|
75
|
-
overflowY,
|
|
76
|
-
display
|
|
77
|
-
} = getComputedStyle$1(element);
|
|
78
|
-
return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && display !== 'inline' && display !== 'contents';
|
|
79
|
-
}
|
|
80
|
-
function isTableElement(element) {
|
|
81
|
-
return /^(table|td|th)$/.test(getNodeName(element));
|
|
82
|
-
}
|
|
83
|
-
function isTopLayer(element) {
|
|
84
|
-
try {
|
|
85
|
-
if (element.matches(':popover-open')) {
|
|
86
|
-
return true;
|
|
87
|
-
}
|
|
88
|
-
} catch (_e) {
|
|
89
|
-
// no-op
|
|
90
|
-
}
|
|
91
|
-
try {
|
|
92
|
-
return element.matches(':modal');
|
|
93
|
-
} catch (_e) {
|
|
94
|
-
return false;
|
|
95
|
-
}
|
|
96
|
-
}
|
|
97
|
-
const willChangeRe = /transform|translate|scale|rotate|perspective|filter/;
|
|
98
|
-
const containRe = /paint|layout|strict|content/;
|
|
99
|
-
const isNotNone = value => !!value && value !== 'none';
|
|
100
|
-
let isWebKitValue;
|
|
101
|
-
function isContainingBlock(elementOrCss) {
|
|
102
|
-
const css = isElement(elementOrCss) ? getComputedStyle$1(elementOrCss) : elementOrCss;
|
|
103
|
-
|
|
104
|
-
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
105
|
-
// https://drafts.csswg.org/css-transforms-2/#individual-transforms
|
|
106
|
-
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 || '');
|
|
107
|
-
}
|
|
108
|
-
function getContainingBlock(element) {
|
|
109
|
-
let currentNode = getParentNode(element);
|
|
110
|
-
while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
111
|
-
if (isContainingBlock(currentNode)) {
|
|
112
|
-
return currentNode;
|
|
113
|
-
} else if (isTopLayer(currentNode)) {
|
|
114
|
-
return null;
|
|
115
|
-
}
|
|
116
|
-
currentNode = getParentNode(currentNode);
|
|
117
|
-
}
|
|
118
|
-
return null;
|
|
119
|
-
}
|
|
120
|
-
function isWebKit() {
|
|
121
|
-
if (isWebKitValue == null) {
|
|
122
|
-
isWebKitValue = typeof CSS !== 'undefined' && CSS.supports && CSS.supports('-webkit-backdrop-filter', 'none');
|
|
123
|
-
}
|
|
124
|
-
return isWebKitValue;
|
|
125
|
-
}
|
|
126
|
-
function isLastTraversableNode(node) {
|
|
127
|
-
return /^(html|body|#document)$/.test(getNodeName(node));
|
|
128
|
-
}
|
|
129
|
-
function getComputedStyle$1(element) {
|
|
130
|
-
return getWindow(element).getComputedStyle(element);
|
|
131
|
-
}
|
|
132
|
-
function getNodeScroll(element) {
|
|
133
|
-
if (isElement(element)) {
|
|
134
|
-
return {
|
|
135
|
-
scrollLeft: element.scrollLeft,
|
|
136
|
-
scrollTop: element.scrollTop
|
|
137
|
-
};
|
|
138
|
-
}
|
|
139
|
-
return {
|
|
140
|
-
scrollLeft: element.scrollX,
|
|
141
|
-
scrollTop: element.scrollY
|
|
142
|
-
};
|
|
143
|
-
}
|
|
144
|
-
function getParentNode(node) {
|
|
145
|
-
if (getNodeName(node) === 'html') {
|
|
146
|
-
return node;
|
|
147
|
-
}
|
|
148
|
-
const result =
|
|
149
|
-
// Step into the shadow DOM of the parent of a slotted node.
|
|
150
|
-
node.assignedSlot ||
|
|
151
|
-
// DOM Element detected.
|
|
152
|
-
node.parentNode ||
|
|
153
|
-
// ShadowRoot detected.
|
|
154
|
-
isShadowRoot(node) && node.host ||
|
|
155
|
-
// Fallback.
|
|
156
|
-
getDocumentElement(node);
|
|
157
|
-
return isShadowRoot(result) ? result.host : result;
|
|
158
|
-
}
|
|
159
|
-
function getNearestOverflowAncestor(node) {
|
|
160
|
-
const parentNode = getParentNode(node);
|
|
161
|
-
if (isLastTraversableNode(parentNode)) {
|
|
162
|
-
return node.ownerDocument ? node.ownerDocument.body : node.body;
|
|
163
|
-
}
|
|
164
|
-
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
|
|
165
|
-
return parentNode;
|
|
166
|
-
}
|
|
167
|
-
return getNearestOverflowAncestor(parentNode);
|
|
168
|
-
}
|
|
169
|
-
function getOverflowAncestors(node, list, traverseIframes) {
|
|
170
|
-
var _node$ownerDocument2;
|
|
171
|
-
if (list === void 0) {
|
|
172
|
-
list = [];
|
|
173
|
-
}
|
|
174
|
-
if (traverseIframes === void 0) {
|
|
175
|
-
traverseIframes = true;
|
|
176
|
-
}
|
|
177
|
-
const scrollableAncestor = getNearestOverflowAncestor(node);
|
|
178
|
-
const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
|
|
179
|
-
const win = getWindow(scrollableAncestor);
|
|
180
|
-
if (isBody) {
|
|
181
|
-
const frameElement = getFrameElement(win);
|
|
182
|
-
return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], frameElement && traverseIframes ? getOverflowAncestors(frameElement) : []);
|
|
183
|
-
} else {
|
|
184
|
-
return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
|
|
185
|
-
}
|
|
186
|
-
}
|
|
187
|
-
function getFrameElement(win) {
|
|
188
|
-
return win.parent && Object.getPrototypeOf(win.parent) ? win.frameElement : null;
|
|
189
|
-
}
|
|
190
|
-
|
|
191
|
-
/**
|
|
192
|
-
* Custom positioning reference element.
|
|
193
|
-
* @see https://floating-ui.com/docs/virtual-elements
|
|
194
|
-
*/
|
|
195
|
-
|
|
196
|
-
const sides = ['top', 'right', 'bottom', 'left'];
|
|
197
|
-
const alignments = ['start', 'end'];
|
|
198
|
-
const placements = /*#__PURE__*/sides.reduce((acc, side) => acc.concat(side, side + "-" + alignments[0], side + "-" + alignments[1]), []);
|
|
199
|
-
const min = Math.min;
|
|
200
|
-
const max = Math.max;
|
|
201
|
-
const round = Math.round;
|
|
202
|
-
const floor = Math.floor;
|
|
203
|
-
const createCoords = v => ({
|
|
204
|
-
x: v,
|
|
205
|
-
y: v
|
|
206
|
-
});
|
|
207
|
-
const oppositeSideMap = {
|
|
208
|
-
left: 'right',
|
|
209
|
-
right: 'left',
|
|
210
|
-
bottom: 'top',
|
|
211
|
-
top: 'bottom'
|
|
212
|
-
};
|
|
213
|
-
function clamp(start, value, end) {
|
|
214
|
-
return max(start, min(value, end));
|
|
215
|
-
}
|
|
216
|
-
function evaluate(value, param) {
|
|
217
|
-
return typeof value === 'function' ? value(param) : value;
|
|
218
|
-
}
|
|
219
|
-
function getSide(placement) {
|
|
220
|
-
return placement.split('-')[0];
|
|
221
|
-
}
|
|
222
|
-
function getAlignment(placement) {
|
|
223
|
-
return placement.split('-')[1];
|
|
224
|
-
}
|
|
225
|
-
function getOppositeAxis(axis) {
|
|
226
|
-
return axis === 'x' ? 'y' : 'x';
|
|
227
|
-
}
|
|
228
|
-
function getAxisLength(axis) {
|
|
229
|
-
return axis === 'y' ? 'height' : 'width';
|
|
230
|
-
}
|
|
231
|
-
function getSideAxis(placement) {
|
|
232
|
-
const firstChar = placement[0];
|
|
233
|
-
return firstChar === 't' || firstChar === 'b' ? 'y' : 'x';
|
|
234
|
-
}
|
|
235
|
-
function getAlignmentAxis(placement) {
|
|
236
|
-
return getOppositeAxis(getSideAxis(placement));
|
|
237
|
-
}
|
|
238
|
-
function getAlignmentSides(placement, rects, rtl) {
|
|
239
|
-
if (rtl === void 0) {
|
|
240
|
-
rtl = false;
|
|
241
|
-
}
|
|
242
|
-
const alignment = getAlignment(placement);
|
|
243
|
-
const alignmentAxis = getAlignmentAxis(placement);
|
|
244
|
-
const length = getAxisLength(alignmentAxis);
|
|
245
|
-
let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
|
|
246
|
-
if (rects.reference[length] > rects.floating[length]) {
|
|
247
|
-
mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
|
|
248
|
-
}
|
|
249
|
-
return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
|
|
250
|
-
}
|
|
251
|
-
function getExpandedPlacements(placement) {
|
|
252
|
-
const oppositePlacement = getOppositePlacement(placement);
|
|
253
|
-
return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
|
|
254
|
-
}
|
|
255
|
-
function getOppositeAlignmentPlacement(placement) {
|
|
256
|
-
return placement.includes('start') ? placement.replace('start', 'end') : placement.replace('end', 'start');
|
|
257
|
-
}
|
|
258
|
-
const lrPlacement = ['left', 'right'];
|
|
259
|
-
const rlPlacement = ['right', 'left'];
|
|
260
|
-
const tbPlacement = ['top', 'bottom'];
|
|
261
|
-
const btPlacement = ['bottom', 'top'];
|
|
262
|
-
function getSideList(side, isStart, rtl) {
|
|
263
|
-
switch (side) {
|
|
264
|
-
case 'top':
|
|
265
|
-
case 'bottom':
|
|
266
|
-
if (rtl) return isStart ? rlPlacement : lrPlacement;
|
|
267
|
-
return isStart ? lrPlacement : rlPlacement;
|
|
268
|
-
case 'left':
|
|
269
|
-
case 'right':
|
|
270
|
-
return isStart ? tbPlacement : btPlacement;
|
|
271
|
-
default:
|
|
272
|
-
return [];
|
|
273
|
-
}
|
|
274
|
-
}
|
|
275
|
-
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
|
|
276
|
-
const alignment = getAlignment(placement);
|
|
277
|
-
let list = getSideList(getSide(placement), direction === 'start', rtl);
|
|
278
|
-
if (alignment) {
|
|
279
|
-
list = list.map(side => side + "-" + alignment);
|
|
280
|
-
if (flipAlignment) {
|
|
281
|
-
list = list.concat(list.map(getOppositeAlignmentPlacement));
|
|
282
|
-
}
|
|
283
|
-
}
|
|
284
|
-
return list;
|
|
285
|
-
}
|
|
286
|
-
function getOppositePlacement(placement) {
|
|
287
|
-
const side = getSide(placement);
|
|
288
|
-
return oppositeSideMap[side] + placement.slice(side.length);
|
|
289
|
-
}
|
|
290
|
-
function expandPaddingObject(padding) {
|
|
291
|
-
return {
|
|
292
|
-
top: 0,
|
|
293
|
-
right: 0,
|
|
294
|
-
bottom: 0,
|
|
295
|
-
left: 0,
|
|
296
|
-
...padding
|
|
297
|
-
};
|
|
298
|
-
}
|
|
299
|
-
function getPaddingObject(padding) {
|
|
300
|
-
return typeof padding !== 'number' ? expandPaddingObject(padding) : {
|
|
301
|
-
top: padding,
|
|
302
|
-
right: padding,
|
|
303
|
-
bottom: padding,
|
|
304
|
-
left: padding
|
|
305
|
-
};
|
|
306
|
-
}
|
|
307
|
-
function rectToClientRect(rect) {
|
|
308
|
-
const {
|
|
309
|
-
x,
|
|
310
|
-
y,
|
|
311
|
-
width,
|
|
312
|
-
height
|
|
313
|
-
} = rect;
|
|
314
|
-
return {
|
|
315
|
-
width,
|
|
316
|
-
height,
|
|
317
|
-
top: y,
|
|
318
|
-
left: x,
|
|
319
|
-
right: x + width,
|
|
320
|
-
bottom: y + height,
|
|
321
|
-
x,
|
|
322
|
-
y
|
|
323
|
-
};
|
|
324
|
-
}
|
|
325
|
-
|
|
326
29
|
/*!
|
|
327
30
|
* tabbable 6.4.0
|
|
328
31
|
* @license MIT, https://github.com/focus-trap/tabbable/blob/master/LICENSE
|
|
@@ -959,7 +662,7 @@ function contains(parent, child) {
|
|
|
959
662
|
}
|
|
960
663
|
|
|
961
664
|
// then fallback to custom implementation with Shadow DOM support
|
|
962
|
-
if (rootNode && isShadowRoot(rootNode)) {
|
|
665
|
+
if (rootNode && floatingUi_utils.isShadowRoot(rootNode)) {
|
|
963
666
|
let next = child;
|
|
964
667
|
while (next) {
|
|
965
668
|
if (parent === next) {
|
|
@@ -1001,7 +704,7 @@ function getDocument$1(node) {
|
|
|
1001
704
|
return (node == null ? void 0 : node.ownerDocument) || document;
|
|
1002
705
|
}
|
|
1003
706
|
function isTypeableElement(element) {
|
|
1004
|
-
return isHTMLElement(element) && element.matches(TYPEABLE_SELECTOR);
|
|
707
|
+
return floatingUi_utils.isHTMLElement(element) && element.matches(TYPEABLE_SELECTOR);
|
|
1005
708
|
}
|
|
1006
709
|
function isTypeableCombobox(element) {
|
|
1007
710
|
if (!element) return false;
|
|
@@ -1091,19 +794,19 @@ function isMouseLikePointerType(pointerType, strict) {
|
|
|
1091
794
|
return values.includes(pointerType);
|
|
1092
795
|
}
|
|
1093
796
|
|
|
1094
|
-
var isClient
|
|
797
|
+
var isClient = typeof document !== 'undefined';
|
|
1095
798
|
|
|
1096
|
-
var noop
|
|
1097
|
-
var index
|
|
799
|
+
var noop = function noop() {};
|
|
800
|
+
var index = isClient ? React.useLayoutEffect : noop;
|
|
1098
801
|
|
|
1099
802
|
// https://github.com/mui/material-ui/issues/41190#issuecomment-2040873379
|
|
1100
803
|
const SafeReact$1 = {
|
|
1101
804
|
...React__namespace
|
|
1102
805
|
};
|
|
1103
806
|
|
|
1104
|
-
function useLatestRef
|
|
807
|
+
function useLatestRef(value) {
|
|
1105
808
|
const ref = React__namespace.useRef(value);
|
|
1106
|
-
index
|
|
809
|
+
index(() => {
|
|
1107
810
|
ref.current = value;
|
|
1108
811
|
});
|
|
1109
812
|
return ref;
|
|
@@ -1223,7 +926,7 @@ function getGridNavigatedIndex(listRef, _ref) {
|
|
|
1223
926
|
|
|
1224
927
|
// Remains on the same row/column.
|
|
1225
928
|
if (orientation === 'both') {
|
|
1226
|
-
const prevRow = floor(prevIndex / cols);
|
|
929
|
+
const prevRow = floatingUi_utils.floor(prevIndex / cols);
|
|
1227
930
|
if (event.key === (rtl ? ARROW_LEFT$1 : ARROW_RIGHT$1)) {
|
|
1228
931
|
stop && stopEvent(event);
|
|
1229
932
|
if (prevIndex % cols !== cols - 1) {
|
|
@@ -1273,2211 +976,145 @@ function getGridNavigatedIndex(listRef, _ref) {
|
|
|
1273
976
|
nextIndex = prevIndex;
|
|
1274
977
|
}
|
|
1275
978
|
}
|
|
1276
|
-
const lastRow = floor(maxIndex / cols) === prevRow;
|
|
979
|
+
const lastRow = floatingUi_utils.floor(maxIndex / cols) === prevRow;
|
|
1277
980
|
if (isIndexOutOfListBounds(listRef, nextIndex)) {
|
|
1278
981
|
if (loop && lastRow) {
|
|
1279
982
|
nextIndex = event.key === (rtl ? ARROW_RIGHT$1 : ARROW_LEFT$1) ? maxIndex : findNonDisabledListIndex(listRef, {
|
|
1280
983
|
startingIndex: prevIndex - prevIndex % cols - 1,
|
|
1281
984
|
disabledIndices
|
|
1282
985
|
});
|
|
1283
|
-
} else {
|
|
1284
|
-
nextIndex = prevIndex;
|
|
1285
|
-
}
|
|
1286
|
-
}
|
|
1287
|
-
}
|
|
1288
|
-
return nextIndex;
|
|
1289
|
-
}
|
|
1290
|
-
|
|
1291
|
-
/** For each cell index, gets the item index that occupies that cell */
|
|
1292
|
-
function createGridCellMap(sizes, cols, dense) {
|
|
1293
|
-
const cellMap = [];
|
|
1294
|
-
let startIndex = 0;
|
|
1295
|
-
sizes.forEach((_ref2, index) => {
|
|
1296
|
-
let {
|
|
1297
|
-
width,
|
|
1298
|
-
height
|
|
1299
|
-
} = _ref2;
|
|
1300
|
-
if (width > cols) {
|
|
1301
|
-
if (process.env.NODE_ENV !== "production") {
|
|
1302
|
-
throw new Error("[Floating UI]: Invalid grid - item width at index " + index + " is greater than grid columns");
|
|
1303
|
-
}
|
|
1304
|
-
}
|
|
1305
|
-
let itemPlaced = false;
|
|
1306
|
-
if (dense) {
|
|
1307
|
-
startIndex = 0;
|
|
1308
|
-
}
|
|
1309
|
-
while (!itemPlaced) {
|
|
1310
|
-
const targetCells = [];
|
|
1311
|
-
for (let i = 0; i < width; i++) {
|
|
1312
|
-
for (let j = 0; j < height; j++) {
|
|
1313
|
-
targetCells.push(startIndex + i + j * cols);
|
|
1314
|
-
}
|
|
1315
|
-
}
|
|
1316
|
-
if (startIndex % cols + width <= cols && targetCells.every(cell => cellMap[cell] == null)) {
|
|
1317
|
-
targetCells.forEach(cell => {
|
|
1318
|
-
cellMap[cell] = index;
|
|
1319
|
-
});
|
|
1320
|
-
itemPlaced = true;
|
|
1321
|
-
} else {
|
|
1322
|
-
startIndex++;
|
|
1323
|
-
}
|
|
1324
|
-
}
|
|
1325
|
-
});
|
|
1326
|
-
|
|
1327
|
-
// convert into a non-sparse array
|
|
1328
|
-
return [...cellMap];
|
|
1329
|
-
}
|
|
1330
|
-
|
|
1331
|
-
/** Gets cell index of an item's corner or -1 when index is -1. */
|
|
1332
|
-
function getGridCellIndexOfCorner(index, sizes, cellMap, cols, corner) {
|
|
1333
|
-
if (index === -1) return -1;
|
|
1334
|
-
const firstCellIndex = cellMap.indexOf(index);
|
|
1335
|
-
const sizeItem = sizes[index];
|
|
1336
|
-
switch (corner) {
|
|
1337
|
-
case 'tl':
|
|
1338
|
-
return firstCellIndex;
|
|
1339
|
-
case 'tr':
|
|
1340
|
-
if (!sizeItem) {
|
|
1341
|
-
return firstCellIndex;
|
|
1342
|
-
}
|
|
1343
|
-
return firstCellIndex + sizeItem.width - 1;
|
|
1344
|
-
case 'bl':
|
|
1345
|
-
if (!sizeItem) {
|
|
1346
|
-
return firstCellIndex;
|
|
1347
|
-
}
|
|
1348
|
-
return firstCellIndex + (sizeItem.height - 1) * cols;
|
|
1349
|
-
case 'br':
|
|
1350
|
-
return cellMap.lastIndexOf(index);
|
|
1351
|
-
}
|
|
1352
|
-
}
|
|
1353
|
-
|
|
1354
|
-
/** Gets all cell indices that correspond to the specified indices */
|
|
1355
|
-
function getGridCellIndices(indices, cellMap) {
|
|
1356
|
-
return cellMap.flatMap((index, cellIndex) => indices.includes(index) ? [cellIndex] : []);
|
|
1357
|
-
}
|
|
1358
|
-
function isListIndexDisabled(listRef, index, disabledIndices) {
|
|
1359
|
-
if (typeof disabledIndices === 'function') {
|
|
1360
|
-
return disabledIndices(index);
|
|
1361
|
-
} else if (disabledIndices) {
|
|
1362
|
-
return disabledIndices.includes(index);
|
|
1363
|
-
}
|
|
1364
|
-
const element = listRef.current[index];
|
|
1365
|
-
return element == null || element.hasAttribute('disabled') || element.getAttribute('aria-disabled') === 'true';
|
|
1366
|
-
}
|
|
1367
|
-
|
|
1368
|
-
const getTabbableOptions = () => ({
|
|
1369
|
-
getShadowRoot: true,
|
|
1370
|
-
displayCheck:
|
|
1371
|
-
// JSDOM does not support the `tabbable` library. To solve this we can
|
|
1372
|
-
// check if `ResizeObserver` is a real function (not polyfilled), which
|
|
1373
|
-
// determines if the current environment is JSDOM-like.
|
|
1374
|
-
typeof ResizeObserver === 'function' && ResizeObserver.toString().includes('[native code]') ? 'full' : 'none'
|
|
1375
|
-
});
|
|
1376
|
-
function getTabbableIn(container, dir) {
|
|
1377
|
-
const list = tabbable(container, getTabbableOptions());
|
|
1378
|
-
const len = list.length;
|
|
1379
|
-
if (len === 0) return;
|
|
1380
|
-
const active = activeElement(getDocument$1(container));
|
|
1381
|
-
const index = list.indexOf(active);
|
|
1382
|
-
const nextIndex = index === -1 ? dir === 1 ? 0 : len - 1 : index + dir;
|
|
1383
|
-
return list[nextIndex];
|
|
1384
|
-
}
|
|
1385
|
-
function getNextTabbable(referenceElement) {
|
|
1386
|
-
return getTabbableIn(getDocument$1(referenceElement).body, 1) || referenceElement;
|
|
1387
|
-
}
|
|
1388
|
-
function getPreviousTabbable(referenceElement) {
|
|
1389
|
-
return getTabbableIn(getDocument$1(referenceElement).body, -1) || referenceElement;
|
|
1390
|
-
}
|
|
1391
|
-
function isOutsideEvent(event, container) {
|
|
1392
|
-
const containerElement = container || event.currentTarget;
|
|
1393
|
-
const relatedTarget = event.relatedTarget;
|
|
1394
|
-
return !relatedTarget || !contains(containerElement, relatedTarget);
|
|
1395
|
-
}
|
|
1396
|
-
function disableFocusInside(container) {
|
|
1397
|
-
const tabbableElements = tabbable(container, getTabbableOptions());
|
|
1398
|
-
tabbableElements.forEach(element => {
|
|
1399
|
-
element.dataset.tabindex = element.getAttribute('tabindex') || '';
|
|
1400
|
-
element.setAttribute('tabindex', '-1');
|
|
1401
|
-
});
|
|
1402
|
-
}
|
|
1403
|
-
function enableFocusInside(container) {
|
|
1404
|
-
const elements = container.querySelectorAll('[data-tabindex]');
|
|
1405
|
-
elements.forEach(element => {
|
|
1406
|
-
const tabindex = element.dataset.tabindex;
|
|
1407
|
-
delete element.dataset.tabindex;
|
|
1408
|
-
if (tabindex) {
|
|
1409
|
-
element.setAttribute('tabindex', tabindex);
|
|
1410
|
-
} else {
|
|
1411
|
-
element.removeAttribute('tabindex');
|
|
1412
|
-
}
|
|
1413
|
-
});
|
|
1414
|
-
}
|
|
1415
|
-
|
|
1416
|
-
function computeCoordsFromPlacement(_ref, placement, rtl) {
|
|
1417
|
-
let {
|
|
1418
|
-
reference,
|
|
1419
|
-
floating
|
|
1420
|
-
} = _ref;
|
|
1421
|
-
const sideAxis = getSideAxis(placement);
|
|
1422
|
-
const alignmentAxis = getAlignmentAxis(placement);
|
|
1423
|
-
const alignLength = getAxisLength(alignmentAxis);
|
|
1424
|
-
const side = getSide(placement);
|
|
1425
|
-
const isVertical = sideAxis === 'y';
|
|
1426
|
-
const commonX = reference.x + reference.width / 2 - floating.width / 2;
|
|
1427
|
-
const commonY = reference.y + reference.height / 2 - floating.height / 2;
|
|
1428
|
-
const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
|
|
1429
|
-
let coords;
|
|
1430
|
-
switch (side) {
|
|
1431
|
-
case 'top':
|
|
1432
|
-
coords = {
|
|
1433
|
-
x: commonX,
|
|
1434
|
-
y: reference.y - floating.height
|
|
1435
|
-
};
|
|
1436
|
-
break;
|
|
1437
|
-
case 'bottom':
|
|
1438
|
-
coords = {
|
|
1439
|
-
x: commonX,
|
|
1440
|
-
y: reference.y + reference.height
|
|
1441
|
-
};
|
|
1442
|
-
break;
|
|
1443
|
-
case 'right':
|
|
1444
|
-
coords = {
|
|
1445
|
-
x: reference.x + reference.width,
|
|
1446
|
-
y: commonY
|
|
1447
|
-
};
|
|
1448
|
-
break;
|
|
1449
|
-
case 'left':
|
|
1450
|
-
coords = {
|
|
1451
|
-
x: reference.x - floating.width,
|
|
1452
|
-
y: commonY
|
|
1453
|
-
};
|
|
1454
|
-
break;
|
|
1455
|
-
default:
|
|
1456
|
-
coords = {
|
|
1457
|
-
x: reference.x,
|
|
1458
|
-
y: reference.y
|
|
1459
|
-
};
|
|
1460
|
-
}
|
|
1461
|
-
switch (getAlignment(placement)) {
|
|
1462
|
-
case 'start':
|
|
1463
|
-
coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
|
|
1464
|
-
break;
|
|
1465
|
-
case 'end':
|
|
1466
|
-
coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
|
|
1467
|
-
break;
|
|
1468
|
-
}
|
|
1469
|
-
return coords;
|
|
1470
|
-
}
|
|
1471
|
-
|
|
1472
|
-
/**
|
|
1473
|
-
* Resolves with an object of overflow side offsets that determine how much the
|
|
1474
|
-
* element is overflowing a given clipping boundary on each side.
|
|
1475
|
-
* - positive = overflowing the boundary by that number of pixels
|
|
1476
|
-
* - negative = how many pixels left before it will overflow
|
|
1477
|
-
* - 0 = lies flush with the boundary
|
|
1478
|
-
* @see https://floating-ui.com/docs/detectOverflow
|
|
1479
|
-
*/
|
|
1480
|
-
async function detectOverflow(state, options) {
|
|
1481
|
-
var _await$platform$isEle;
|
|
1482
|
-
if (options === void 0) {
|
|
1483
|
-
options = {};
|
|
1484
|
-
}
|
|
1485
|
-
const {
|
|
1486
|
-
x,
|
|
1487
|
-
y,
|
|
1488
|
-
platform,
|
|
1489
|
-
rects,
|
|
1490
|
-
elements,
|
|
1491
|
-
strategy
|
|
1492
|
-
} = state;
|
|
1493
|
-
const {
|
|
1494
|
-
boundary = 'clippingAncestors',
|
|
1495
|
-
rootBoundary = 'viewport',
|
|
1496
|
-
elementContext = 'floating',
|
|
1497
|
-
altBoundary = false,
|
|
1498
|
-
padding = 0
|
|
1499
|
-
} = evaluate(options, state);
|
|
1500
|
-
const paddingObject = getPaddingObject(padding);
|
|
1501
|
-
const altContext = elementContext === 'floating' ? 'reference' : 'floating';
|
|
1502
|
-
const element = elements[altBoundary ? altContext : elementContext];
|
|
1503
|
-
const clippingClientRect = rectToClientRect(await platform.getClippingRect({
|
|
1504
|
-
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))),
|
|
1505
|
-
boundary,
|
|
1506
|
-
rootBoundary,
|
|
1507
|
-
strategy
|
|
1508
|
-
}));
|
|
1509
|
-
const rect = elementContext === 'floating' ? {
|
|
1510
|
-
x,
|
|
1511
|
-
y,
|
|
1512
|
-
width: rects.floating.width,
|
|
1513
|
-
height: rects.floating.height
|
|
1514
|
-
} : rects.reference;
|
|
1515
|
-
const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
|
|
1516
|
-
const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
|
|
1517
|
-
x: 1,
|
|
1518
|
-
y: 1
|
|
1519
|
-
} : {
|
|
1520
|
-
x: 1,
|
|
1521
|
-
y: 1
|
|
1522
|
-
};
|
|
1523
|
-
const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
1524
|
-
elements,
|
|
1525
|
-
rect,
|
|
1526
|
-
offsetParent,
|
|
1527
|
-
strategy
|
|
1528
|
-
}) : rect);
|
|
1529
|
-
return {
|
|
1530
|
-
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
1531
|
-
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
1532
|
-
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
1533
|
-
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
1534
|
-
};
|
|
1535
|
-
}
|
|
1536
|
-
|
|
1537
|
-
// Maximum number of resets that can occur before bailing to avoid infinite reset loops.
|
|
1538
|
-
const MAX_RESET_COUNT = 50;
|
|
1539
|
-
|
|
1540
|
-
/**
|
|
1541
|
-
* Computes the `x` and `y` coordinates that will place the floating element
|
|
1542
|
-
* next to a given reference element.
|
|
1543
|
-
*
|
|
1544
|
-
* This export does not have any `platform` interface logic. You will need to
|
|
1545
|
-
* write one for the platform you are using Floating UI with.
|
|
1546
|
-
*/
|
|
1547
|
-
const computePosition$1 = async (reference, floating, config) => {
|
|
1548
|
-
const {
|
|
1549
|
-
placement = 'bottom',
|
|
1550
|
-
strategy = 'absolute',
|
|
1551
|
-
middleware = [],
|
|
1552
|
-
platform
|
|
1553
|
-
} = config;
|
|
1554
|
-
const platformWithDetectOverflow = platform.detectOverflow ? platform : {
|
|
1555
|
-
...platform,
|
|
1556
|
-
detectOverflow
|
|
1557
|
-
};
|
|
1558
|
-
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
|
|
1559
|
-
let rects = await platform.getElementRects({
|
|
1560
|
-
reference,
|
|
1561
|
-
floating,
|
|
1562
|
-
strategy
|
|
1563
|
-
});
|
|
1564
|
-
let {
|
|
1565
|
-
x,
|
|
1566
|
-
y
|
|
1567
|
-
} = computeCoordsFromPlacement(rects, placement, rtl);
|
|
1568
|
-
let statefulPlacement = placement;
|
|
1569
|
-
let resetCount = 0;
|
|
1570
|
-
const middlewareData = {};
|
|
1571
|
-
for (let i = 0; i < middleware.length; i++) {
|
|
1572
|
-
const currentMiddleware = middleware[i];
|
|
1573
|
-
if (!currentMiddleware) {
|
|
1574
|
-
continue;
|
|
1575
|
-
}
|
|
1576
|
-
const {
|
|
1577
|
-
name,
|
|
1578
|
-
fn
|
|
1579
|
-
} = currentMiddleware;
|
|
1580
|
-
const {
|
|
1581
|
-
x: nextX,
|
|
1582
|
-
y: nextY,
|
|
1583
|
-
data,
|
|
1584
|
-
reset
|
|
1585
|
-
} = await fn({
|
|
1586
|
-
x,
|
|
1587
|
-
y,
|
|
1588
|
-
initialPlacement: placement,
|
|
1589
|
-
placement: statefulPlacement,
|
|
1590
|
-
strategy,
|
|
1591
|
-
middlewareData,
|
|
1592
|
-
rects,
|
|
1593
|
-
platform: platformWithDetectOverflow,
|
|
1594
|
-
elements: {
|
|
1595
|
-
reference,
|
|
1596
|
-
floating
|
|
1597
|
-
}
|
|
1598
|
-
});
|
|
1599
|
-
x = nextX != null ? nextX : x;
|
|
1600
|
-
y = nextY != null ? nextY : y;
|
|
1601
|
-
middlewareData[name] = {
|
|
1602
|
-
...middlewareData[name],
|
|
1603
|
-
...data
|
|
1604
|
-
};
|
|
1605
|
-
if (reset && resetCount < MAX_RESET_COUNT) {
|
|
1606
|
-
resetCount++;
|
|
1607
|
-
if (typeof reset === 'object') {
|
|
1608
|
-
if (reset.placement) {
|
|
1609
|
-
statefulPlacement = reset.placement;
|
|
1610
|
-
}
|
|
1611
|
-
if (reset.rects) {
|
|
1612
|
-
rects = reset.rects === true ? await platform.getElementRects({
|
|
1613
|
-
reference,
|
|
1614
|
-
floating,
|
|
1615
|
-
strategy
|
|
1616
|
-
}) : reset.rects;
|
|
1617
|
-
}
|
|
1618
|
-
({
|
|
1619
|
-
x,
|
|
1620
|
-
y
|
|
1621
|
-
} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
|
|
1622
|
-
}
|
|
1623
|
-
i = -1;
|
|
1624
|
-
}
|
|
1625
|
-
}
|
|
1626
|
-
return {
|
|
1627
|
-
x,
|
|
1628
|
-
y,
|
|
1629
|
-
placement: statefulPlacement,
|
|
1630
|
-
strategy,
|
|
1631
|
-
middlewareData
|
|
1632
|
-
};
|
|
1633
|
-
};
|
|
1634
|
-
|
|
1635
|
-
/**
|
|
1636
|
-
* Provides data to position an inner element of the floating element so that it
|
|
1637
|
-
* appears centered to the reference element.
|
|
1638
|
-
* @see https://floating-ui.com/docs/arrow
|
|
1639
|
-
*/
|
|
1640
|
-
const arrow$3 = options => ({
|
|
1641
|
-
name: 'arrow',
|
|
1642
|
-
options,
|
|
1643
|
-
async fn(state) {
|
|
1644
|
-
const {
|
|
1645
|
-
x,
|
|
1646
|
-
y,
|
|
1647
|
-
placement,
|
|
1648
|
-
rects,
|
|
1649
|
-
platform,
|
|
1650
|
-
elements,
|
|
1651
|
-
middlewareData
|
|
1652
|
-
} = state;
|
|
1653
|
-
// Since `element` is required, we don't Partial<> the type.
|
|
1654
|
-
const {
|
|
1655
|
-
element,
|
|
1656
|
-
padding = 0
|
|
1657
|
-
} = evaluate(options, state) || {};
|
|
1658
|
-
if (element == null) {
|
|
1659
|
-
return {};
|
|
1660
|
-
}
|
|
1661
|
-
const paddingObject = getPaddingObject(padding);
|
|
1662
|
-
const coords = {
|
|
1663
|
-
x,
|
|
1664
|
-
y
|
|
1665
|
-
};
|
|
1666
|
-
const axis = getAlignmentAxis(placement);
|
|
1667
|
-
const length = getAxisLength(axis);
|
|
1668
|
-
const arrowDimensions = await platform.getDimensions(element);
|
|
1669
|
-
const isYAxis = axis === 'y';
|
|
1670
|
-
const minProp = isYAxis ? 'top' : 'left';
|
|
1671
|
-
const maxProp = isYAxis ? 'bottom' : 'right';
|
|
1672
|
-
const clientProp = isYAxis ? 'clientHeight' : 'clientWidth';
|
|
1673
|
-
const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
|
|
1674
|
-
const startDiff = coords[axis] - rects.reference[axis];
|
|
1675
|
-
const arrowOffsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(element));
|
|
1676
|
-
let clientSize = arrowOffsetParent ? arrowOffsetParent[clientProp] : 0;
|
|
1677
|
-
|
|
1678
|
-
// DOM platform can return `window` as the `offsetParent`.
|
|
1679
|
-
if (!clientSize || !(await (platform.isElement == null ? void 0 : platform.isElement(arrowOffsetParent)))) {
|
|
1680
|
-
clientSize = elements.floating[clientProp] || rects.floating[length];
|
|
1681
|
-
}
|
|
1682
|
-
const centerToReference = endDiff / 2 - startDiff / 2;
|
|
1683
|
-
|
|
1684
|
-
// If the padding is large enough that it causes the arrow to no longer be
|
|
1685
|
-
// centered, modify the padding so that it is centered.
|
|
1686
|
-
const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1;
|
|
1687
|
-
const minPadding = min(paddingObject[minProp], largestPossiblePadding);
|
|
1688
|
-
const maxPadding = min(paddingObject[maxProp], largestPossiblePadding);
|
|
1689
|
-
|
|
1690
|
-
// Make sure the arrow doesn't overflow the floating element if the center
|
|
1691
|
-
// point is outside the floating element's bounds.
|
|
1692
|
-
const min$1 = minPadding;
|
|
1693
|
-
const max = clientSize - arrowDimensions[length] - maxPadding;
|
|
1694
|
-
const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
|
|
1695
|
-
const offset = clamp(min$1, center, max);
|
|
1696
|
-
|
|
1697
|
-
// If the reference is small enough that the arrow's padding causes it to
|
|
1698
|
-
// to point to nothing for an aligned placement, adjust the offset of the
|
|
1699
|
-
// floating element itself. To ensure `shift()` continues to take action,
|
|
1700
|
-
// a single reset is performed when this is true.
|
|
1701
|
-
const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center !== offset && rects.reference[length] / 2 - (center < min$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
|
|
1702
|
-
const alignmentOffset = shouldAddOffset ? center < min$1 ? center - min$1 : center - max : 0;
|
|
1703
|
-
return {
|
|
1704
|
-
[axis]: coords[axis] + alignmentOffset,
|
|
1705
|
-
data: {
|
|
1706
|
-
[axis]: offset,
|
|
1707
|
-
centerOffset: center - offset - alignmentOffset,
|
|
1708
|
-
...(shouldAddOffset && {
|
|
1709
|
-
alignmentOffset
|
|
1710
|
-
})
|
|
1711
|
-
},
|
|
1712
|
-
reset: shouldAddOffset
|
|
1713
|
-
};
|
|
1714
|
-
}
|
|
1715
|
-
});
|
|
1716
|
-
|
|
1717
|
-
function getPlacementList(alignment, autoAlignment, allowedPlacements) {
|
|
1718
|
-
const allowedPlacementsSortedByAlignment = alignment ? [...allowedPlacements.filter(placement => getAlignment(placement) === alignment), ...allowedPlacements.filter(placement => getAlignment(placement) !== alignment)] : allowedPlacements.filter(placement => getSide(placement) === placement);
|
|
1719
|
-
return allowedPlacementsSortedByAlignment.filter(placement => {
|
|
1720
|
-
if (alignment) {
|
|
1721
|
-
return getAlignment(placement) === alignment || (autoAlignment ? getOppositeAlignmentPlacement(placement) !== placement : false);
|
|
1722
|
-
}
|
|
1723
|
-
return true;
|
|
1724
|
-
});
|
|
1725
|
-
}
|
|
1726
|
-
/**
|
|
1727
|
-
* Optimizes the visibility of the floating element by choosing the placement
|
|
1728
|
-
* that has the most space available automatically, without needing to specify a
|
|
1729
|
-
* preferred placement. Alternative to `flip`.
|
|
1730
|
-
* @see https://floating-ui.com/docs/autoPlacement
|
|
1731
|
-
*/
|
|
1732
|
-
const autoPlacement$2 = function (options) {
|
|
1733
|
-
if (options === void 0) {
|
|
1734
|
-
options = {};
|
|
1735
|
-
}
|
|
1736
|
-
return {
|
|
1737
|
-
name: 'autoPlacement',
|
|
1738
|
-
options,
|
|
1739
|
-
async fn(state) {
|
|
1740
|
-
var _middlewareData$autoP, _middlewareData$autoP2, _placementsThatFitOnE;
|
|
1741
|
-
const {
|
|
1742
|
-
rects,
|
|
1743
|
-
middlewareData,
|
|
1744
|
-
placement,
|
|
1745
|
-
platform,
|
|
1746
|
-
elements
|
|
1747
|
-
} = state;
|
|
1748
|
-
const {
|
|
1749
|
-
crossAxis = false,
|
|
1750
|
-
alignment,
|
|
1751
|
-
allowedPlacements = placements,
|
|
1752
|
-
autoAlignment = true,
|
|
1753
|
-
...detectOverflowOptions
|
|
1754
|
-
} = evaluate(options, state);
|
|
1755
|
-
const placements$1 = alignment !== undefined || allowedPlacements === placements ? getPlacementList(alignment || null, autoAlignment, allowedPlacements) : allowedPlacements;
|
|
1756
|
-
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
1757
|
-
const currentIndex = ((_middlewareData$autoP = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP.index) || 0;
|
|
1758
|
-
const currentPlacement = placements$1[currentIndex];
|
|
1759
|
-
if (currentPlacement == null) {
|
|
1760
|
-
return {};
|
|
1761
|
-
}
|
|
1762
|
-
const alignmentSides = getAlignmentSides(currentPlacement, rects, await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating)));
|
|
1763
|
-
|
|
1764
|
-
// Make `computeCoords` start from the right place.
|
|
1765
|
-
if (placement !== currentPlacement) {
|
|
1766
|
-
return {
|
|
1767
|
-
reset: {
|
|
1768
|
-
placement: placements$1[0]
|
|
1769
|
-
}
|
|
1770
|
-
};
|
|
1771
|
-
}
|
|
1772
|
-
const currentOverflows = [overflow[getSide(currentPlacement)], overflow[alignmentSides[0]], overflow[alignmentSides[1]]];
|
|
1773
|
-
const allOverflows = [...(((_middlewareData$autoP2 = middlewareData.autoPlacement) == null ? void 0 : _middlewareData$autoP2.overflows) || []), {
|
|
1774
|
-
placement: currentPlacement,
|
|
1775
|
-
overflows: currentOverflows
|
|
1776
|
-
}];
|
|
1777
|
-
const nextPlacement = placements$1[currentIndex + 1];
|
|
1778
|
-
|
|
1779
|
-
// There are more placements to check.
|
|
1780
|
-
if (nextPlacement) {
|
|
1781
|
-
return {
|
|
1782
|
-
data: {
|
|
1783
|
-
index: currentIndex + 1,
|
|
1784
|
-
overflows: allOverflows
|
|
1785
|
-
},
|
|
1786
|
-
reset: {
|
|
1787
|
-
placement: nextPlacement
|
|
1788
|
-
}
|
|
1789
|
-
};
|
|
1790
|
-
}
|
|
1791
|
-
const placementsSortedByMostSpace = allOverflows.map(d => {
|
|
1792
|
-
const alignment = getAlignment(d.placement);
|
|
1793
|
-
return [d.placement, alignment && crossAxis ?
|
|
1794
|
-
// Check along the mainAxis and main crossAxis side.
|
|
1795
|
-
d.overflows.slice(0, 2).reduce((acc, v) => acc + v, 0) :
|
|
1796
|
-
// Check only the mainAxis.
|
|
1797
|
-
d.overflows[0], d.overflows];
|
|
1798
|
-
}).sort((a, b) => a[1] - b[1]);
|
|
1799
|
-
const placementsThatFitOnEachSide = placementsSortedByMostSpace.filter(d => d[2].slice(0,
|
|
1800
|
-
// Aligned placements should not check their opposite crossAxis
|
|
1801
|
-
// side.
|
|
1802
|
-
getAlignment(d[0]) ? 2 : 3).every(v => v <= 0));
|
|
1803
|
-
const resetPlacement = ((_placementsThatFitOnE = placementsThatFitOnEachSide[0]) == null ? void 0 : _placementsThatFitOnE[0]) || placementsSortedByMostSpace[0][0];
|
|
1804
|
-
if (resetPlacement !== placement) {
|
|
1805
|
-
return {
|
|
1806
|
-
data: {
|
|
1807
|
-
index: currentIndex + 1,
|
|
1808
|
-
overflows: allOverflows
|
|
1809
|
-
},
|
|
1810
|
-
reset: {
|
|
1811
|
-
placement: resetPlacement
|
|
1812
|
-
}
|
|
1813
|
-
};
|
|
1814
|
-
}
|
|
1815
|
-
return {};
|
|
1816
|
-
}
|
|
1817
|
-
};
|
|
1818
|
-
};
|
|
1819
|
-
|
|
1820
|
-
/**
|
|
1821
|
-
* Optimizes the visibility of the floating element by flipping the `placement`
|
|
1822
|
-
* in order to keep it in view when the preferred placement(s) will overflow the
|
|
1823
|
-
* clipping boundary. Alternative to `autoPlacement`.
|
|
1824
|
-
* @see https://floating-ui.com/docs/flip
|
|
1825
|
-
*/
|
|
1826
|
-
const flip$2 = function (options) {
|
|
1827
|
-
if (options === void 0) {
|
|
1828
|
-
options = {};
|
|
1829
|
-
}
|
|
1830
|
-
return {
|
|
1831
|
-
name: 'flip',
|
|
1832
|
-
options,
|
|
1833
|
-
async fn(state) {
|
|
1834
|
-
var _middlewareData$arrow, _middlewareData$flip;
|
|
1835
|
-
const {
|
|
1836
|
-
placement,
|
|
1837
|
-
middlewareData,
|
|
1838
|
-
rects,
|
|
1839
|
-
initialPlacement,
|
|
1840
|
-
platform,
|
|
1841
|
-
elements
|
|
1842
|
-
} = state;
|
|
1843
|
-
const {
|
|
1844
|
-
mainAxis: checkMainAxis = true,
|
|
1845
|
-
crossAxis: checkCrossAxis = true,
|
|
1846
|
-
fallbackPlacements: specifiedFallbackPlacements,
|
|
1847
|
-
fallbackStrategy = 'bestFit',
|
|
1848
|
-
fallbackAxisSideDirection = 'none',
|
|
1849
|
-
flipAlignment = true,
|
|
1850
|
-
...detectOverflowOptions
|
|
1851
|
-
} = evaluate(options, state);
|
|
1852
|
-
|
|
1853
|
-
// If a reset by the arrow was caused due to an alignment offset being
|
|
1854
|
-
// added, we should skip any logic now since `flip()` has already done its
|
|
1855
|
-
// work.
|
|
1856
|
-
// https://github.com/floating-ui/floating-ui/issues/2549#issuecomment-1719601643
|
|
1857
|
-
if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
1858
|
-
return {};
|
|
1859
|
-
}
|
|
1860
|
-
const side = getSide(placement);
|
|
1861
|
-
const initialSideAxis = getSideAxis(initialPlacement);
|
|
1862
|
-
const isBasePlacement = getSide(initialPlacement) === initialPlacement;
|
|
1863
|
-
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
|
|
1864
|
-
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
|
|
1865
|
-
const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== 'none';
|
|
1866
|
-
if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) {
|
|
1867
|
-
fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
|
|
1868
|
-
}
|
|
1869
|
-
const placements = [initialPlacement, ...fallbackPlacements];
|
|
1870
|
-
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
1871
|
-
const overflows = [];
|
|
1872
|
-
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
|
|
1873
|
-
if (checkMainAxis) {
|
|
1874
|
-
overflows.push(overflow[side]);
|
|
1875
|
-
}
|
|
1876
|
-
if (checkCrossAxis) {
|
|
1877
|
-
const sides = getAlignmentSides(placement, rects, rtl);
|
|
1878
|
-
overflows.push(overflow[sides[0]], overflow[sides[1]]);
|
|
1879
|
-
}
|
|
1880
|
-
overflowsData = [...overflowsData, {
|
|
1881
|
-
placement,
|
|
1882
|
-
overflows
|
|
1883
|
-
}];
|
|
1884
|
-
|
|
1885
|
-
// One or more sides is overflowing.
|
|
1886
|
-
if (!overflows.every(side => side <= 0)) {
|
|
1887
|
-
var _middlewareData$flip2, _overflowsData$filter;
|
|
1888
|
-
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
|
|
1889
|
-
const nextPlacement = placements[nextIndex];
|
|
1890
|
-
if (nextPlacement) {
|
|
1891
|
-
const ignoreCrossAxisOverflow = checkCrossAxis === 'alignment' ? initialSideAxis !== getSideAxis(nextPlacement) : false;
|
|
1892
|
-
if (!ignoreCrossAxisOverflow ||
|
|
1893
|
-
// We leave the current main axis only if every placement on that axis
|
|
1894
|
-
// overflows the main axis.
|
|
1895
|
-
overflowsData.every(d => getSideAxis(d.placement) === initialSideAxis ? d.overflows[0] > 0 : true)) {
|
|
1896
|
-
// Try next placement and re-run the lifecycle.
|
|
1897
|
-
return {
|
|
1898
|
-
data: {
|
|
1899
|
-
index: nextIndex,
|
|
1900
|
-
overflows: overflowsData
|
|
1901
|
-
},
|
|
1902
|
-
reset: {
|
|
1903
|
-
placement: nextPlacement
|
|
1904
|
-
}
|
|
1905
|
-
};
|
|
1906
|
-
}
|
|
1907
|
-
}
|
|
1908
|
-
|
|
1909
|
-
// First, find the candidates that fit on the mainAxis side of overflow,
|
|
1910
|
-
// then find the placement that fits the best on the main crossAxis side.
|
|
1911
|
-
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;
|
|
1912
|
-
|
|
1913
|
-
// Otherwise fallback.
|
|
1914
|
-
if (!resetPlacement) {
|
|
1915
|
-
switch (fallbackStrategy) {
|
|
1916
|
-
case 'bestFit':
|
|
1917
|
-
{
|
|
1918
|
-
var _overflowsData$filter2;
|
|
1919
|
-
const placement = (_overflowsData$filter2 = overflowsData.filter(d => {
|
|
1920
|
-
if (hasFallbackAxisSideDirection) {
|
|
1921
|
-
const currentSideAxis = getSideAxis(d.placement);
|
|
1922
|
-
return currentSideAxis === initialSideAxis ||
|
|
1923
|
-
// Create a bias to the `y` side axis due to horizontal
|
|
1924
|
-
// reading directions favoring greater width.
|
|
1925
|
-
currentSideAxis === 'y';
|
|
1926
|
-
}
|
|
1927
|
-
return true;
|
|
1928
|
-
}).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];
|
|
1929
|
-
if (placement) {
|
|
1930
|
-
resetPlacement = placement;
|
|
1931
|
-
}
|
|
1932
|
-
break;
|
|
1933
|
-
}
|
|
1934
|
-
case 'initialPlacement':
|
|
1935
|
-
resetPlacement = initialPlacement;
|
|
1936
|
-
break;
|
|
1937
|
-
}
|
|
1938
|
-
}
|
|
1939
|
-
if (placement !== resetPlacement) {
|
|
1940
|
-
return {
|
|
1941
|
-
reset: {
|
|
1942
|
-
placement: resetPlacement
|
|
1943
|
-
}
|
|
1944
|
-
};
|
|
1945
|
-
}
|
|
1946
|
-
}
|
|
1947
|
-
return {};
|
|
1948
|
-
}
|
|
1949
|
-
};
|
|
1950
|
-
};
|
|
1951
|
-
|
|
1952
|
-
function getSideOffsets(overflow, rect) {
|
|
1953
|
-
return {
|
|
1954
|
-
top: overflow.top - rect.height,
|
|
1955
|
-
right: overflow.right - rect.width,
|
|
1956
|
-
bottom: overflow.bottom - rect.height,
|
|
1957
|
-
left: overflow.left - rect.width
|
|
1958
|
-
};
|
|
1959
|
-
}
|
|
1960
|
-
function isAnySideFullyClipped(overflow) {
|
|
1961
|
-
return sides.some(side => overflow[side] >= 0);
|
|
1962
|
-
}
|
|
1963
|
-
/**
|
|
1964
|
-
* Provides data to hide the floating element in applicable situations, such as
|
|
1965
|
-
* when it is not in the same clipping context as the reference element.
|
|
1966
|
-
* @see https://floating-ui.com/docs/hide
|
|
1967
|
-
*/
|
|
1968
|
-
const hide$2 = function (options) {
|
|
1969
|
-
if (options === void 0) {
|
|
1970
|
-
options = {};
|
|
1971
|
-
}
|
|
1972
|
-
return {
|
|
1973
|
-
name: 'hide',
|
|
1974
|
-
options,
|
|
1975
|
-
async fn(state) {
|
|
1976
|
-
const {
|
|
1977
|
-
rects,
|
|
1978
|
-
platform
|
|
1979
|
-
} = state;
|
|
1980
|
-
const {
|
|
1981
|
-
strategy = 'referenceHidden',
|
|
1982
|
-
...detectOverflowOptions
|
|
1983
|
-
} = evaluate(options, state);
|
|
1984
|
-
switch (strategy) {
|
|
1985
|
-
case 'referenceHidden':
|
|
1986
|
-
{
|
|
1987
|
-
const overflow = await platform.detectOverflow(state, {
|
|
1988
|
-
...detectOverflowOptions,
|
|
1989
|
-
elementContext: 'reference'
|
|
1990
|
-
});
|
|
1991
|
-
const offsets = getSideOffsets(overflow, rects.reference);
|
|
1992
|
-
return {
|
|
1993
|
-
data: {
|
|
1994
|
-
referenceHiddenOffsets: offsets,
|
|
1995
|
-
referenceHidden: isAnySideFullyClipped(offsets)
|
|
1996
|
-
}
|
|
1997
|
-
};
|
|
1998
|
-
}
|
|
1999
|
-
case 'escaped':
|
|
2000
|
-
{
|
|
2001
|
-
const overflow = await platform.detectOverflow(state, {
|
|
2002
|
-
...detectOverflowOptions,
|
|
2003
|
-
altBoundary: true
|
|
2004
|
-
});
|
|
2005
|
-
const offsets = getSideOffsets(overflow, rects.floating);
|
|
2006
|
-
return {
|
|
2007
|
-
data: {
|
|
2008
|
-
escapedOffsets: offsets,
|
|
2009
|
-
escaped: isAnySideFullyClipped(offsets)
|
|
2010
|
-
}
|
|
2011
|
-
};
|
|
2012
|
-
}
|
|
2013
|
-
default:
|
|
2014
|
-
{
|
|
2015
|
-
return {};
|
|
2016
|
-
}
|
|
2017
|
-
}
|
|
2018
|
-
}
|
|
2019
|
-
};
|
|
2020
|
-
};
|
|
2021
|
-
|
|
2022
|
-
const originSides = /*#__PURE__*/new Set(['left', 'top']);
|
|
2023
|
-
|
|
2024
|
-
// For type backwards-compatibility, the `OffsetOptions` type was also
|
|
2025
|
-
// Derivable.
|
|
2026
|
-
|
|
2027
|
-
async function convertValueToCoords(state, options) {
|
|
2028
|
-
const {
|
|
2029
|
-
placement,
|
|
2030
|
-
platform,
|
|
2031
|
-
elements
|
|
2032
|
-
} = state;
|
|
2033
|
-
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
|
|
2034
|
-
const side = getSide(placement);
|
|
2035
|
-
const alignment = getAlignment(placement);
|
|
2036
|
-
const isVertical = getSideAxis(placement) === 'y';
|
|
2037
|
-
const mainAxisMulti = originSides.has(side) ? -1 : 1;
|
|
2038
|
-
const crossAxisMulti = rtl && isVertical ? -1 : 1;
|
|
2039
|
-
const rawValue = evaluate(options, state);
|
|
2040
|
-
|
|
2041
|
-
// eslint-disable-next-line prefer-const
|
|
2042
|
-
let {
|
|
2043
|
-
mainAxis,
|
|
2044
|
-
crossAxis,
|
|
2045
|
-
alignmentAxis
|
|
2046
|
-
} = typeof rawValue === 'number' ? {
|
|
2047
|
-
mainAxis: rawValue,
|
|
2048
|
-
crossAxis: 0,
|
|
2049
|
-
alignmentAxis: null
|
|
2050
|
-
} : {
|
|
2051
|
-
mainAxis: rawValue.mainAxis || 0,
|
|
2052
|
-
crossAxis: rawValue.crossAxis || 0,
|
|
2053
|
-
alignmentAxis: rawValue.alignmentAxis
|
|
2054
|
-
};
|
|
2055
|
-
if (alignment && typeof alignmentAxis === 'number') {
|
|
2056
|
-
crossAxis = alignment === 'end' ? alignmentAxis * -1 : alignmentAxis;
|
|
2057
|
-
}
|
|
2058
|
-
return isVertical ? {
|
|
2059
|
-
x: crossAxis * crossAxisMulti,
|
|
2060
|
-
y: mainAxis * mainAxisMulti
|
|
2061
|
-
} : {
|
|
2062
|
-
x: mainAxis * mainAxisMulti,
|
|
2063
|
-
y: crossAxis * crossAxisMulti
|
|
2064
|
-
};
|
|
2065
|
-
}
|
|
2066
|
-
|
|
2067
|
-
/**
|
|
2068
|
-
* Modifies the placement by translating the floating element along the
|
|
2069
|
-
* specified axes.
|
|
2070
|
-
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
|
2071
|
-
* object may be passed.
|
|
2072
|
-
* @see https://floating-ui.com/docs/offset
|
|
2073
|
-
*/
|
|
2074
|
-
const offset$2 = function (options) {
|
|
2075
|
-
if (options === void 0) {
|
|
2076
|
-
options = 0;
|
|
2077
|
-
}
|
|
2078
|
-
return {
|
|
2079
|
-
name: 'offset',
|
|
2080
|
-
options,
|
|
2081
|
-
async fn(state) {
|
|
2082
|
-
var _middlewareData$offse, _middlewareData$arrow;
|
|
2083
|
-
const {
|
|
2084
|
-
x,
|
|
2085
|
-
y,
|
|
2086
|
-
placement,
|
|
2087
|
-
middlewareData
|
|
2088
|
-
} = state;
|
|
2089
|
-
const diffCoords = await convertValueToCoords(state, options);
|
|
2090
|
-
|
|
2091
|
-
// If the placement is the same and the arrow caused an alignment offset
|
|
2092
|
-
// then we don't need to change the positioning coordinates.
|
|
2093
|
-
if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
2094
|
-
return {};
|
|
2095
|
-
}
|
|
2096
|
-
return {
|
|
2097
|
-
x: x + diffCoords.x,
|
|
2098
|
-
y: y + diffCoords.y,
|
|
2099
|
-
data: {
|
|
2100
|
-
...diffCoords,
|
|
2101
|
-
placement
|
|
2102
|
-
}
|
|
2103
|
-
};
|
|
2104
|
-
}
|
|
2105
|
-
};
|
|
2106
|
-
};
|
|
2107
|
-
|
|
2108
|
-
/**
|
|
2109
|
-
* Optimizes the visibility of the floating element by shifting it in order to
|
|
2110
|
-
* keep it in view when it will overflow the clipping boundary.
|
|
2111
|
-
* @see https://floating-ui.com/docs/shift
|
|
2112
|
-
*/
|
|
2113
|
-
const shift$2 = function (options) {
|
|
2114
|
-
if (options === void 0) {
|
|
2115
|
-
options = {};
|
|
2116
|
-
}
|
|
2117
|
-
return {
|
|
2118
|
-
name: 'shift',
|
|
2119
|
-
options,
|
|
2120
|
-
async fn(state) {
|
|
2121
|
-
const {
|
|
2122
|
-
x,
|
|
2123
|
-
y,
|
|
2124
|
-
placement,
|
|
2125
|
-
platform
|
|
2126
|
-
} = state;
|
|
2127
|
-
const {
|
|
2128
|
-
mainAxis: checkMainAxis = true,
|
|
2129
|
-
crossAxis: checkCrossAxis = false,
|
|
2130
|
-
limiter = {
|
|
2131
|
-
fn: _ref => {
|
|
2132
|
-
let {
|
|
2133
|
-
x,
|
|
2134
|
-
y
|
|
2135
|
-
} = _ref;
|
|
2136
|
-
return {
|
|
2137
|
-
x,
|
|
2138
|
-
y
|
|
2139
|
-
};
|
|
2140
|
-
}
|
|
2141
|
-
},
|
|
2142
|
-
...detectOverflowOptions
|
|
2143
|
-
} = evaluate(options, state);
|
|
2144
|
-
const coords = {
|
|
2145
|
-
x,
|
|
2146
|
-
y
|
|
2147
|
-
};
|
|
2148
|
-
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
2149
|
-
const crossAxis = getSideAxis(getSide(placement));
|
|
2150
|
-
const mainAxis = getOppositeAxis(crossAxis);
|
|
2151
|
-
let mainAxisCoord = coords[mainAxis];
|
|
2152
|
-
let crossAxisCoord = coords[crossAxis];
|
|
2153
|
-
if (checkMainAxis) {
|
|
2154
|
-
const minSide = mainAxis === 'y' ? 'top' : 'left';
|
|
2155
|
-
const maxSide = mainAxis === 'y' ? 'bottom' : 'right';
|
|
2156
|
-
const min = mainAxisCoord + overflow[minSide];
|
|
2157
|
-
const max = mainAxisCoord - overflow[maxSide];
|
|
2158
|
-
mainAxisCoord = clamp(min, mainAxisCoord, max);
|
|
2159
|
-
}
|
|
2160
|
-
if (checkCrossAxis) {
|
|
2161
|
-
const minSide = crossAxis === 'y' ? 'top' : 'left';
|
|
2162
|
-
const maxSide = crossAxis === 'y' ? 'bottom' : 'right';
|
|
2163
|
-
const min = crossAxisCoord + overflow[minSide];
|
|
2164
|
-
const max = crossAxisCoord - overflow[maxSide];
|
|
2165
|
-
crossAxisCoord = clamp(min, crossAxisCoord, max);
|
|
2166
|
-
}
|
|
2167
|
-
const limitedCoords = limiter.fn({
|
|
2168
|
-
...state,
|
|
2169
|
-
[mainAxis]: mainAxisCoord,
|
|
2170
|
-
[crossAxis]: crossAxisCoord
|
|
2171
|
-
});
|
|
2172
|
-
return {
|
|
2173
|
-
...limitedCoords,
|
|
2174
|
-
data: {
|
|
2175
|
-
x: limitedCoords.x - x,
|
|
2176
|
-
y: limitedCoords.y - y,
|
|
2177
|
-
enabled: {
|
|
2178
|
-
[mainAxis]: checkMainAxis,
|
|
2179
|
-
[crossAxis]: checkCrossAxis
|
|
2180
|
-
}
|
|
2181
|
-
}
|
|
2182
|
-
};
|
|
2183
|
-
}
|
|
2184
|
-
};
|
|
2185
|
-
};
|
|
2186
|
-
/**
|
|
2187
|
-
* Built-in `limiter` that will stop `shift()` at a certain point.
|
|
2188
|
-
*/
|
|
2189
|
-
const limitShift$2 = function (options) {
|
|
2190
|
-
if (options === void 0) {
|
|
2191
|
-
options = {};
|
|
2192
|
-
}
|
|
2193
|
-
return {
|
|
2194
|
-
options,
|
|
2195
|
-
fn(state) {
|
|
2196
|
-
const {
|
|
2197
|
-
x,
|
|
2198
|
-
y,
|
|
2199
|
-
placement,
|
|
2200
|
-
rects,
|
|
2201
|
-
middlewareData
|
|
2202
|
-
} = state;
|
|
2203
|
-
const {
|
|
2204
|
-
offset = 0,
|
|
2205
|
-
mainAxis: checkMainAxis = true,
|
|
2206
|
-
crossAxis: checkCrossAxis = true
|
|
2207
|
-
} = evaluate(options, state);
|
|
2208
|
-
const coords = {
|
|
2209
|
-
x,
|
|
2210
|
-
y
|
|
2211
|
-
};
|
|
2212
|
-
const crossAxis = getSideAxis(placement);
|
|
2213
|
-
const mainAxis = getOppositeAxis(crossAxis);
|
|
2214
|
-
let mainAxisCoord = coords[mainAxis];
|
|
2215
|
-
let crossAxisCoord = coords[crossAxis];
|
|
2216
|
-
const rawOffset = evaluate(offset, state);
|
|
2217
|
-
const computedOffset = typeof rawOffset === 'number' ? {
|
|
2218
|
-
mainAxis: rawOffset,
|
|
2219
|
-
crossAxis: 0
|
|
2220
|
-
} : {
|
|
2221
|
-
mainAxis: 0,
|
|
2222
|
-
crossAxis: 0,
|
|
2223
|
-
...rawOffset
|
|
2224
|
-
};
|
|
2225
|
-
if (checkMainAxis) {
|
|
2226
|
-
const len = mainAxis === 'y' ? 'height' : 'width';
|
|
2227
|
-
const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis;
|
|
2228
|
-
const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis;
|
|
2229
|
-
if (mainAxisCoord < limitMin) {
|
|
2230
|
-
mainAxisCoord = limitMin;
|
|
2231
|
-
} else if (mainAxisCoord > limitMax) {
|
|
2232
|
-
mainAxisCoord = limitMax;
|
|
2233
|
-
}
|
|
2234
|
-
}
|
|
2235
|
-
if (checkCrossAxis) {
|
|
2236
|
-
var _middlewareData$offse, _middlewareData$offse2;
|
|
2237
|
-
const len = mainAxis === 'y' ? 'width' : 'height';
|
|
2238
|
-
const isOriginSide = originSides.has(getSide(placement));
|
|
2239
|
-
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);
|
|
2240
|
-
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);
|
|
2241
|
-
if (crossAxisCoord < limitMin) {
|
|
2242
|
-
crossAxisCoord = limitMin;
|
|
2243
|
-
} else if (crossAxisCoord > limitMax) {
|
|
2244
|
-
crossAxisCoord = limitMax;
|
|
2245
|
-
}
|
|
2246
|
-
}
|
|
2247
|
-
return {
|
|
2248
|
-
[mainAxis]: mainAxisCoord,
|
|
2249
|
-
[crossAxis]: crossAxisCoord
|
|
2250
|
-
};
|
|
2251
|
-
}
|
|
2252
|
-
};
|
|
2253
|
-
};
|
|
2254
|
-
|
|
2255
|
-
/**
|
|
2256
|
-
* Provides data that allows you to change the size of the floating element —
|
|
2257
|
-
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
2258
|
-
* width of the reference element.
|
|
2259
|
-
* @see https://floating-ui.com/docs/size
|
|
2260
|
-
*/
|
|
2261
|
-
const size$2 = function (options) {
|
|
2262
|
-
if (options === void 0) {
|
|
2263
|
-
options = {};
|
|
2264
|
-
}
|
|
2265
|
-
return {
|
|
2266
|
-
name: 'size',
|
|
2267
|
-
options,
|
|
2268
|
-
async fn(state) {
|
|
2269
|
-
var _state$middlewareData, _state$middlewareData2;
|
|
2270
|
-
const {
|
|
2271
|
-
placement,
|
|
2272
|
-
rects,
|
|
2273
|
-
platform,
|
|
2274
|
-
elements
|
|
2275
|
-
} = state;
|
|
2276
|
-
const {
|
|
2277
|
-
apply = () => {},
|
|
2278
|
-
...detectOverflowOptions
|
|
2279
|
-
} = evaluate(options, state);
|
|
2280
|
-
const overflow = await platform.detectOverflow(state, detectOverflowOptions);
|
|
2281
|
-
const side = getSide(placement);
|
|
2282
|
-
const alignment = getAlignment(placement);
|
|
2283
|
-
const isYAxis = getSideAxis(placement) === 'y';
|
|
2284
|
-
const {
|
|
2285
|
-
width,
|
|
2286
|
-
height
|
|
2287
|
-
} = rects.floating;
|
|
2288
|
-
let heightSide;
|
|
2289
|
-
let widthSide;
|
|
2290
|
-
if (side === 'top' || side === 'bottom') {
|
|
2291
|
-
heightSide = side;
|
|
2292
|
-
widthSide = alignment === ((await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating))) ? 'start' : 'end') ? 'left' : 'right';
|
|
2293
|
-
} else {
|
|
2294
|
-
widthSide = side;
|
|
2295
|
-
heightSide = alignment === 'end' ? 'top' : 'bottom';
|
|
2296
|
-
}
|
|
2297
|
-
const maximumClippingHeight = height - overflow.top - overflow.bottom;
|
|
2298
|
-
const maximumClippingWidth = width - overflow.left - overflow.right;
|
|
2299
|
-
const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight);
|
|
2300
|
-
const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
|
|
2301
|
-
const noShift = !state.middlewareData.shift;
|
|
2302
|
-
let availableHeight = overflowAvailableHeight;
|
|
2303
|
-
let availableWidth = overflowAvailableWidth;
|
|
2304
|
-
if ((_state$middlewareData = state.middlewareData.shift) != null && _state$middlewareData.enabled.x) {
|
|
2305
|
-
availableWidth = maximumClippingWidth;
|
|
2306
|
-
}
|
|
2307
|
-
if ((_state$middlewareData2 = state.middlewareData.shift) != null && _state$middlewareData2.enabled.y) {
|
|
2308
|
-
availableHeight = maximumClippingHeight;
|
|
2309
|
-
}
|
|
2310
|
-
if (noShift && !alignment) {
|
|
2311
|
-
const xMin = max(overflow.left, 0);
|
|
2312
|
-
const xMax = max(overflow.right, 0);
|
|
2313
|
-
const yMin = max(overflow.top, 0);
|
|
2314
|
-
const yMax = max(overflow.bottom, 0);
|
|
2315
|
-
if (isYAxis) {
|
|
2316
|
-
availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
|
|
2317
|
-
} else {
|
|
2318
|
-
availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
|
|
2319
|
-
}
|
|
2320
|
-
}
|
|
2321
|
-
await apply({
|
|
2322
|
-
...state,
|
|
2323
|
-
availableWidth,
|
|
2324
|
-
availableHeight
|
|
2325
|
-
});
|
|
2326
|
-
const nextDimensions = await platform.getDimensions(elements.floating);
|
|
2327
|
-
if (width !== nextDimensions.width || height !== nextDimensions.height) {
|
|
2328
|
-
return {
|
|
2329
|
-
reset: {
|
|
2330
|
-
rects: true
|
|
2331
|
-
}
|
|
2332
|
-
};
|
|
2333
|
-
}
|
|
2334
|
-
return {};
|
|
2335
|
-
}
|
|
2336
|
-
};
|
|
2337
|
-
};
|
|
2338
|
-
|
|
2339
|
-
function getCssDimensions(element) {
|
|
2340
|
-
const css = getComputedStyle$1(element);
|
|
2341
|
-
// In testing environments, the `width` and `height` properties are empty
|
|
2342
|
-
// strings for SVG elements, returning NaN. Fallback to `0` in this case.
|
|
2343
|
-
let width = parseFloat(css.width) || 0;
|
|
2344
|
-
let height = parseFloat(css.height) || 0;
|
|
2345
|
-
const hasOffset = isHTMLElement(element);
|
|
2346
|
-
const offsetWidth = hasOffset ? element.offsetWidth : width;
|
|
2347
|
-
const offsetHeight = hasOffset ? element.offsetHeight : height;
|
|
2348
|
-
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
|
|
2349
|
-
if (shouldFallback) {
|
|
2350
|
-
width = offsetWidth;
|
|
2351
|
-
height = offsetHeight;
|
|
2352
|
-
}
|
|
2353
|
-
return {
|
|
2354
|
-
width,
|
|
2355
|
-
height,
|
|
2356
|
-
$: shouldFallback
|
|
2357
|
-
};
|
|
2358
|
-
}
|
|
2359
|
-
|
|
2360
|
-
function unwrapElement(element) {
|
|
2361
|
-
return !isElement(element) ? element.contextElement : element;
|
|
2362
|
-
}
|
|
2363
|
-
|
|
2364
|
-
function getScale(element) {
|
|
2365
|
-
const domElement = unwrapElement(element);
|
|
2366
|
-
if (!isHTMLElement(domElement)) {
|
|
2367
|
-
return createCoords(1);
|
|
2368
|
-
}
|
|
2369
|
-
const rect = domElement.getBoundingClientRect();
|
|
2370
|
-
const {
|
|
2371
|
-
width,
|
|
2372
|
-
height,
|
|
2373
|
-
$
|
|
2374
|
-
} = getCssDimensions(domElement);
|
|
2375
|
-
let x = ($ ? round(rect.width) : rect.width) / width;
|
|
2376
|
-
let y = ($ ? round(rect.height) : rect.height) / height;
|
|
2377
|
-
|
|
2378
|
-
// 0, NaN, or Infinity should always fallback to 1.
|
|
2379
|
-
|
|
2380
|
-
if (!x || !Number.isFinite(x)) {
|
|
2381
|
-
x = 1;
|
|
2382
|
-
}
|
|
2383
|
-
if (!y || !Number.isFinite(y)) {
|
|
2384
|
-
y = 1;
|
|
2385
|
-
}
|
|
2386
|
-
return {
|
|
2387
|
-
x,
|
|
2388
|
-
y
|
|
2389
|
-
};
|
|
2390
|
-
}
|
|
2391
|
-
|
|
2392
|
-
const noOffsets = /*#__PURE__*/createCoords(0);
|
|
2393
|
-
function getVisualOffsets(element) {
|
|
2394
|
-
const win = getWindow(element);
|
|
2395
|
-
if (!isWebKit() || !win.visualViewport) {
|
|
2396
|
-
return noOffsets;
|
|
2397
|
-
}
|
|
2398
|
-
return {
|
|
2399
|
-
x: win.visualViewport.offsetLeft,
|
|
2400
|
-
y: win.visualViewport.offsetTop
|
|
2401
|
-
};
|
|
2402
|
-
}
|
|
2403
|
-
function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
|
|
2404
|
-
if (isFixed === void 0) {
|
|
2405
|
-
isFixed = false;
|
|
2406
|
-
}
|
|
2407
|
-
if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
|
|
2408
|
-
return false;
|
|
2409
|
-
}
|
|
2410
|
-
return isFixed;
|
|
2411
|
-
}
|
|
2412
|
-
|
|
2413
|
-
function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
|
|
2414
|
-
if (includeScale === void 0) {
|
|
2415
|
-
includeScale = false;
|
|
2416
|
-
}
|
|
2417
|
-
if (isFixedStrategy === void 0) {
|
|
2418
|
-
isFixedStrategy = false;
|
|
2419
|
-
}
|
|
2420
|
-
const clientRect = element.getBoundingClientRect();
|
|
2421
|
-
const domElement = unwrapElement(element);
|
|
2422
|
-
let scale = createCoords(1);
|
|
2423
|
-
if (includeScale) {
|
|
2424
|
-
if (offsetParent) {
|
|
2425
|
-
if (isElement(offsetParent)) {
|
|
2426
|
-
scale = getScale(offsetParent);
|
|
2427
|
-
}
|
|
2428
|
-
} else {
|
|
2429
|
-
scale = getScale(element);
|
|
2430
|
-
}
|
|
2431
|
-
}
|
|
2432
|
-
const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
|
|
2433
|
-
let x = (clientRect.left + visualOffsets.x) / scale.x;
|
|
2434
|
-
let y = (clientRect.top + visualOffsets.y) / scale.y;
|
|
2435
|
-
let width = clientRect.width / scale.x;
|
|
2436
|
-
let height = clientRect.height / scale.y;
|
|
2437
|
-
if (domElement) {
|
|
2438
|
-
const win = getWindow(domElement);
|
|
2439
|
-
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
|
|
2440
|
-
let currentWin = win;
|
|
2441
|
-
let currentIFrame = getFrameElement(currentWin);
|
|
2442
|
-
while (currentIFrame && offsetParent && offsetWin !== currentWin) {
|
|
2443
|
-
const iframeScale = getScale(currentIFrame);
|
|
2444
|
-
const iframeRect = currentIFrame.getBoundingClientRect();
|
|
2445
|
-
const css = getComputedStyle$1(currentIFrame);
|
|
2446
|
-
const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
|
|
2447
|
-
const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
|
|
2448
|
-
x *= iframeScale.x;
|
|
2449
|
-
y *= iframeScale.y;
|
|
2450
|
-
width *= iframeScale.x;
|
|
2451
|
-
height *= iframeScale.y;
|
|
2452
|
-
x += left;
|
|
2453
|
-
y += top;
|
|
2454
|
-
currentWin = getWindow(currentIFrame);
|
|
2455
|
-
currentIFrame = getFrameElement(currentWin);
|
|
2456
|
-
}
|
|
2457
|
-
}
|
|
2458
|
-
return rectToClientRect({
|
|
2459
|
-
width,
|
|
2460
|
-
height,
|
|
2461
|
-
x,
|
|
2462
|
-
y
|
|
2463
|
-
});
|
|
2464
|
-
}
|
|
2465
|
-
|
|
2466
|
-
// If <html> has a CSS width greater than the viewport, then this will be
|
|
2467
|
-
// incorrect for RTL.
|
|
2468
|
-
function getWindowScrollBarX(element, rect) {
|
|
2469
|
-
const leftScroll = getNodeScroll(element).scrollLeft;
|
|
2470
|
-
if (!rect) {
|
|
2471
|
-
return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
|
|
2472
|
-
}
|
|
2473
|
-
return rect.left + leftScroll;
|
|
2474
|
-
}
|
|
2475
|
-
|
|
2476
|
-
function getHTMLOffset(documentElement, scroll) {
|
|
2477
|
-
const htmlRect = documentElement.getBoundingClientRect();
|
|
2478
|
-
const x = htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect);
|
|
2479
|
-
const y = htmlRect.top + scroll.scrollTop;
|
|
2480
|
-
return {
|
|
2481
|
-
x,
|
|
2482
|
-
y
|
|
2483
|
-
};
|
|
2484
|
-
}
|
|
2485
|
-
|
|
2486
|
-
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
2487
|
-
let {
|
|
2488
|
-
elements,
|
|
2489
|
-
rect,
|
|
2490
|
-
offsetParent,
|
|
2491
|
-
strategy
|
|
2492
|
-
} = _ref;
|
|
2493
|
-
const isFixed = strategy === 'fixed';
|
|
2494
|
-
const documentElement = getDocumentElement(offsetParent);
|
|
2495
|
-
const topLayer = elements ? isTopLayer(elements.floating) : false;
|
|
2496
|
-
if (offsetParent === documentElement || topLayer && isFixed) {
|
|
2497
|
-
return rect;
|
|
2498
|
-
}
|
|
2499
|
-
let scroll = {
|
|
2500
|
-
scrollLeft: 0,
|
|
2501
|
-
scrollTop: 0
|
|
2502
|
-
};
|
|
2503
|
-
let scale = createCoords(1);
|
|
2504
|
-
const offsets = createCoords(0);
|
|
2505
|
-
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
2506
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
2507
|
-
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
2508
|
-
scroll = getNodeScroll(offsetParent);
|
|
2509
|
-
}
|
|
2510
|
-
if (isOffsetParentAnElement) {
|
|
2511
|
-
const offsetRect = getBoundingClientRect(offsetParent);
|
|
2512
|
-
scale = getScale(offsetParent);
|
|
2513
|
-
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
2514
|
-
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
2515
|
-
}
|
|
2516
|
-
}
|
|
2517
|
-
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
2518
|
-
return {
|
|
2519
|
-
width: rect.width * scale.x,
|
|
2520
|
-
height: rect.height * scale.y,
|
|
2521
|
-
x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
|
|
2522
|
-
y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
|
|
2523
|
-
};
|
|
2524
|
-
}
|
|
2525
|
-
|
|
2526
|
-
function getClientRects(element) {
|
|
2527
|
-
return Array.from(element.getClientRects());
|
|
2528
|
-
}
|
|
2529
|
-
|
|
2530
|
-
// Gets the entire size of the scrollable document area, even extending outside
|
|
2531
|
-
// of the `<html>` and `<body>` rect bounds if horizontally scrollable.
|
|
2532
|
-
function getDocumentRect(element) {
|
|
2533
|
-
const html = getDocumentElement(element);
|
|
2534
|
-
const scroll = getNodeScroll(element);
|
|
2535
|
-
const body = element.ownerDocument.body;
|
|
2536
|
-
const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
|
|
2537
|
-
const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
|
|
2538
|
-
let x = -scroll.scrollLeft + getWindowScrollBarX(element);
|
|
2539
|
-
const y = -scroll.scrollTop;
|
|
2540
|
-
if (getComputedStyle$1(body).direction === 'rtl') {
|
|
2541
|
-
x += max(html.clientWidth, body.clientWidth) - width;
|
|
2542
|
-
}
|
|
2543
|
-
return {
|
|
2544
|
-
width,
|
|
2545
|
-
height,
|
|
2546
|
-
x,
|
|
2547
|
-
y
|
|
2548
|
-
};
|
|
2549
|
-
}
|
|
2550
|
-
|
|
2551
|
-
// Safety check: ensure the scrollbar space is reasonable in case this
|
|
2552
|
-
// calculation is affected by unusual styles.
|
|
2553
|
-
// Most scrollbars leave 15-18px of space.
|
|
2554
|
-
const SCROLLBAR_MAX = 25;
|
|
2555
|
-
function getViewportRect(element, strategy) {
|
|
2556
|
-
const win = getWindow(element);
|
|
2557
|
-
const html = getDocumentElement(element);
|
|
2558
|
-
const visualViewport = win.visualViewport;
|
|
2559
|
-
let width = html.clientWidth;
|
|
2560
|
-
let height = html.clientHeight;
|
|
2561
|
-
let x = 0;
|
|
2562
|
-
let y = 0;
|
|
2563
|
-
if (visualViewport) {
|
|
2564
|
-
width = visualViewport.width;
|
|
2565
|
-
height = visualViewport.height;
|
|
2566
|
-
const visualViewportBased = isWebKit();
|
|
2567
|
-
if (!visualViewportBased || visualViewportBased && strategy === 'fixed') {
|
|
2568
|
-
x = visualViewport.offsetLeft;
|
|
2569
|
-
y = visualViewport.offsetTop;
|
|
2570
|
-
}
|
|
2571
|
-
}
|
|
2572
|
-
const windowScrollbarX = getWindowScrollBarX(html);
|
|
2573
|
-
// <html> `overflow: hidden` + `scrollbar-gutter: stable` reduces the
|
|
2574
|
-
// visual width of the <html> but this is not considered in the size
|
|
2575
|
-
// of `html.clientWidth`.
|
|
2576
|
-
if (windowScrollbarX <= 0) {
|
|
2577
|
-
const doc = html.ownerDocument;
|
|
2578
|
-
const body = doc.body;
|
|
2579
|
-
const bodyStyles = getComputedStyle(body);
|
|
2580
|
-
const bodyMarginInline = doc.compatMode === 'CSS1Compat' ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
|
|
2581
|
-
const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
|
|
2582
|
-
if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) {
|
|
2583
|
-
width -= clippingStableScrollbarWidth;
|
|
2584
|
-
}
|
|
2585
|
-
} else if (windowScrollbarX <= SCROLLBAR_MAX) {
|
|
2586
|
-
// If the <body> scrollbar is on the left, the width needs to be extended
|
|
2587
|
-
// by the scrollbar amount so there isn't extra space on the right.
|
|
2588
|
-
width += windowScrollbarX;
|
|
2589
|
-
}
|
|
2590
|
-
return {
|
|
2591
|
-
width,
|
|
2592
|
-
height,
|
|
2593
|
-
x,
|
|
2594
|
-
y
|
|
2595
|
-
};
|
|
2596
|
-
}
|
|
2597
|
-
|
|
2598
|
-
// Returns the inner client rect, subtracting scrollbars if present.
|
|
2599
|
-
function getInnerBoundingClientRect(element, strategy) {
|
|
2600
|
-
const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
|
|
2601
|
-
const top = clientRect.top + element.clientTop;
|
|
2602
|
-
const left = clientRect.left + element.clientLeft;
|
|
2603
|
-
const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
|
|
2604
|
-
const width = element.clientWidth * scale.x;
|
|
2605
|
-
const height = element.clientHeight * scale.y;
|
|
2606
|
-
const x = left * scale.x;
|
|
2607
|
-
const y = top * scale.y;
|
|
2608
|
-
return {
|
|
2609
|
-
width,
|
|
2610
|
-
height,
|
|
2611
|
-
x,
|
|
2612
|
-
y
|
|
2613
|
-
};
|
|
2614
|
-
}
|
|
2615
|
-
function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
|
|
2616
|
-
let rect;
|
|
2617
|
-
if (clippingAncestor === 'viewport') {
|
|
2618
|
-
rect = getViewportRect(element, strategy);
|
|
2619
|
-
} else if (clippingAncestor === 'document') {
|
|
2620
|
-
rect = getDocumentRect(getDocumentElement(element));
|
|
2621
|
-
} else if (isElement(clippingAncestor)) {
|
|
2622
|
-
rect = getInnerBoundingClientRect(clippingAncestor, strategy);
|
|
2623
|
-
} else {
|
|
2624
|
-
const visualOffsets = getVisualOffsets(element);
|
|
2625
|
-
rect = {
|
|
2626
|
-
x: clippingAncestor.x - visualOffsets.x,
|
|
2627
|
-
y: clippingAncestor.y - visualOffsets.y,
|
|
2628
|
-
width: clippingAncestor.width,
|
|
2629
|
-
height: clippingAncestor.height
|
|
2630
|
-
};
|
|
2631
|
-
}
|
|
2632
|
-
return rectToClientRect(rect);
|
|
2633
|
-
}
|
|
2634
|
-
function hasFixedPositionAncestor(element, stopNode) {
|
|
2635
|
-
const parentNode = getParentNode(element);
|
|
2636
|
-
if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
|
|
2637
|
-
return false;
|
|
2638
|
-
}
|
|
2639
|
-
return getComputedStyle$1(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
|
|
2640
|
-
}
|
|
2641
|
-
|
|
2642
|
-
// A "clipping ancestor" is an `overflow` element with the characteristic of
|
|
2643
|
-
// clipping (or hiding) child elements. This returns all clipping ancestors
|
|
2644
|
-
// of the given element up the tree.
|
|
2645
|
-
function getClippingElementAncestors(element, cache) {
|
|
2646
|
-
const cachedResult = cache.get(element);
|
|
2647
|
-
if (cachedResult) {
|
|
2648
|
-
return cachedResult;
|
|
2649
|
-
}
|
|
2650
|
-
let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
|
|
2651
|
-
let currentContainingBlockComputedStyle = null;
|
|
2652
|
-
const elementIsFixed = getComputedStyle$1(element).position === 'fixed';
|
|
2653
|
-
let currentNode = elementIsFixed ? getParentNode(element) : element;
|
|
2654
|
-
|
|
2655
|
-
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
2656
|
-
while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
2657
|
-
const computedStyle = getComputedStyle$1(currentNode);
|
|
2658
|
-
const currentNodeIsContaining = isContainingBlock(currentNode);
|
|
2659
|
-
if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
|
|
2660
|
-
currentContainingBlockComputedStyle = null;
|
|
2661
|
-
}
|
|
2662
|
-
const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && (currentContainingBlockComputedStyle.position === 'absolute' || currentContainingBlockComputedStyle.position === 'fixed') || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
|
|
2663
|
-
if (shouldDropCurrentNode) {
|
|
2664
|
-
// Drop non-containing blocks.
|
|
2665
|
-
result = result.filter(ancestor => ancestor !== currentNode);
|
|
2666
|
-
} else {
|
|
2667
|
-
// Record last containing block for next iteration.
|
|
2668
|
-
currentContainingBlockComputedStyle = computedStyle;
|
|
2669
|
-
}
|
|
2670
|
-
currentNode = getParentNode(currentNode);
|
|
2671
|
-
}
|
|
2672
|
-
cache.set(element, result);
|
|
2673
|
-
return result;
|
|
2674
|
-
}
|
|
2675
|
-
|
|
2676
|
-
// Gets the maximum area that the element is visible in due to any number of
|
|
2677
|
-
// clipping ancestors.
|
|
2678
|
-
function getClippingRect(_ref) {
|
|
2679
|
-
let {
|
|
2680
|
-
element,
|
|
2681
|
-
boundary,
|
|
2682
|
-
rootBoundary,
|
|
2683
|
-
strategy
|
|
2684
|
-
} = _ref;
|
|
2685
|
-
const elementClippingAncestors = boundary === 'clippingAncestors' ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
|
|
2686
|
-
const clippingAncestors = [...elementClippingAncestors, rootBoundary];
|
|
2687
|
-
const firstRect = getClientRectFromClippingAncestor(element, clippingAncestors[0], strategy);
|
|
2688
|
-
let top = firstRect.top;
|
|
2689
|
-
let right = firstRect.right;
|
|
2690
|
-
let bottom = firstRect.bottom;
|
|
2691
|
-
let left = firstRect.left;
|
|
2692
|
-
for (let i = 1; i < clippingAncestors.length; i++) {
|
|
2693
|
-
const rect = getClientRectFromClippingAncestor(element, clippingAncestors[i], strategy);
|
|
2694
|
-
top = max(rect.top, top);
|
|
2695
|
-
right = min(rect.right, right);
|
|
2696
|
-
bottom = min(rect.bottom, bottom);
|
|
2697
|
-
left = max(rect.left, left);
|
|
2698
|
-
}
|
|
2699
|
-
return {
|
|
2700
|
-
width: right - left,
|
|
2701
|
-
height: bottom - top,
|
|
2702
|
-
x: left,
|
|
2703
|
-
y: top
|
|
2704
|
-
};
|
|
2705
|
-
}
|
|
2706
|
-
|
|
2707
|
-
function getDimensions(element) {
|
|
2708
|
-
const {
|
|
2709
|
-
width,
|
|
2710
|
-
height
|
|
2711
|
-
} = getCssDimensions(element);
|
|
2712
|
-
return {
|
|
2713
|
-
width,
|
|
2714
|
-
height
|
|
2715
|
-
};
|
|
2716
|
-
}
|
|
2717
|
-
|
|
2718
|
-
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
2719
|
-
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
2720
|
-
const documentElement = getDocumentElement(offsetParent);
|
|
2721
|
-
const isFixed = strategy === 'fixed';
|
|
2722
|
-
const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
|
|
2723
|
-
let scroll = {
|
|
2724
|
-
scrollLeft: 0,
|
|
2725
|
-
scrollTop: 0
|
|
2726
|
-
};
|
|
2727
|
-
const offsets = createCoords(0);
|
|
2728
|
-
|
|
2729
|
-
// If the <body> scrollbar appears on the left (e.g. RTL systems). Use
|
|
2730
|
-
// Firefox with layout.scrollbar.side = 3 in about:config to test this.
|
|
2731
|
-
function setLeftRTLScrollbarOffset() {
|
|
2732
|
-
offsets.x = getWindowScrollBarX(documentElement);
|
|
2733
|
-
}
|
|
2734
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
2735
|
-
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
2736
|
-
scroll = getNodeScroll(offsetParent);
|
|
2737
|
-
}
|
|
2738
|
-
if (isOffsetParentAnElement) {
|
|
2739
|
-
const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
|
|
2740
|
-
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
2741
|
-
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
2742
|
-
} else if (documentElement) {
|
|
2743
|
-
setLeftRTLScrollbarOffset();
|
|
2744
|
-
}
|
|
2745
|
-
}
|
|
2746
|
-
if (isFixed && !isOffsetParentAnElement && documentElement) {
|
|
2747
|
-
setLeftRTLScrollbarOffset();
|
|
2748
|
-
}
|
|
2749
|
-
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
2750
|
-
const x = rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x;
|
|
2751
|
-
const y = rect.top + scroll.scrollTop - offsets.y - htmlOffset.y;
|
|
2752
|
-
return {
|
|
2753
|
-
x,
|
|
2754
|
-
y,
|
|
2755
|
-
width: rect.width,
|
|
2756
|
-
height: rect.height
|
|
2757
|
-
};
|
|
2758
|
-
}
|
|
2759
|
-
|
|
2760
|
-
function isStaticPositioned(element) {
|
|
2761
|
-
return getComputedStyle$1(element).position === 'static';
|
|
2762
|
-
}
|
|
2763
|
-
|
|
2764
|
-
function getTrueOffsetParent(element, polyfill) {
|
|
2765
|
-
if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
|
|
2766
|
-
return null;
|
|
2767
|
-
}
|
|
2768
|
-
if (polyfill) {
|
|
2769
|
-
return polyfill(element);
|
|
2770
|
-
}
|
|
2771
|
-
let rawOffsetParent = element.offsetParent;
|
|
2772
|
-
|
|
2773
|
-
// Firefox returns the <html> element as the offsetParent if it's non-static,
|
|
2774
|
-
// while Chrome and Safari return the <body> element. The <body> element must
|
|
2775
|
-
// be used to perform the correct calculations even if the <html> element is
|
|
2776
|
-
// non-static.
|
|
2777
|
-
if (getDocumentElement(element) === rawOffsetParent) {
|
|
2778
|
-
rawOffsetParent = rawOffsetParent.ownerDocument.body;
|
|
2779
|
-
}
|
|
2780
|
-
return rawOffsetParent;
|
|
2781
|
-
}
|
|
2782
|
-
|
|
2783
|
-
// Gets the closest ancestor positioned element. Handles some edge cases,
|
|
2784
|
-
// such as table ancestors and cross browser bugs.
|
|
2785
|
-
function getOffsetParent(element, polyfill) {
|
|
2786
|
-
const win = getWindow(element);
|
|
2787
|
-
if (isTopLayer(element)) {
|
|
2788
|
-
return win;
|
|
2789
|
-
}
|
|
2790
|
-
if (!isHTMLElement(element)) {
|
|
2791
|
-
let svgOffsetParent = getParentNode(element);
|
|
2792
|
-
while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
|
|
2793
|
-
if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
|
|
2794
|
-
return svgOffsetParent;
|
|
2795
|
-
}
|
|
2796
|
-
svgOffsetParent = getParentNode(svgOffsetParent);
|
|
2797
|
-
}
|
|
2798
|
-
return win;
|
|
2799
|
-
}
|
|
2800
|
-
let offsetParent = getTrueOffsetParent(element, polyfill);
|
|
2801
|
-
while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
|
|
2802
|
-
offsetParent = getTrueOffsetParent(offsetParent, polyfill);
|
|
2803
|
-
}
|
|
2804
|
-
if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
|
|
2805
|
-
return win;
|
|
2806
|
-
}
|
|
2807
|
-
return offsetParent || getContainingBlock(element) || win;
|
|
2808
|
-
}
|
|
2809
|
-
|
|
2810
|
-
const getElementRects = async function (data) {
|
|
2811
|
-
const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
|
|
2812
|
-
const getDimensionsFn = this.getDimensions;
|
|
2813
|
-
const floatingDimensions = await getDimensionsFn(data.floating);
|
|
2814
|
-
return {
|
|
2815
|
-
reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
|
|
2816
|
-
floating: {
|
|
2817
|
-
x: 0,
|
|
2818
|
-
y: 0,
|
|
2819
|
-
width: floatingDimensions.width,
|
|
2820
|
-
height: floatingDimensions.height
|
|
2821
|
-
}
|
|
2822
|
-
};
|
|
2823
|
-
};
|
|
2824
|
-
|
|
2825
|
-
function isRTL(element) {
|
|
2826
|
-
return getComputedStyle$1(element).direction === 'rtl';
|
|
2827
|
-
}
|
|
2828
|
-
|
|
2829
|
-
const platform = {
|
|
2830
|
-
convertOffsetParentRelativeRectToViewportRelativeRect,
|
|
2831
|
-
getDocumentElement,
|
|
2832
|
-
getClippingRect,
|
|
2833
|
-
getOffsetParent,
|
|
2834
|
-
getElementRects,
|
|
2835
|
-
getClientRects,
|
|
2836
|
-
getDimensions,
|
|
2837
|
-
getScale,
|
|
2838
|
-
isElement,
|
|
2839
|
-
isRTL
|
|
2840
|
-
};
|
|
2841
|
-
|
|
2842
|
-
function rectsAreEqual(a, b) {
|
|
2843
|
-
return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
|
|
2844
|
-
}
|
|
2845
|
-
|
|
2846
|
-
// https://samthor.au/2021/observing-dom/
|
|
2847
|
-
function observeMove(element, onMove) {
|
|
2848
|
-
let io = null;
|
|
2849
|
-
let timeoutId;
|
|
2850
|
-
const root = getDocumentElement(element);
|
|
2851
|
-
function cleanup() {
|
|
2852
|
-
var _io;
|
|
2853
|
-
clearTimeout(timeoutId);
|
|
2854
|
-
(_io = io) == null || _io.disconnect();
|
|
2855
|
-
io = null;
|
|
2856
|
-
}
|
|
2857
|
-
function refresh(skip, threshold) {
|
|
2858
|
-
if (skip === void 0) {
|
|
2859
|
-
skip = false;
|
|
2860
|
-
}
|
|
2861
|
-
if (threshold === void 0) {
|
|
2862
|
-
threshold = 1;
|
|
2863
|
-
}
|
|
2864
|
-
cleanup();
|
|
2865
|
-
const elementRectForRootMargin = element.getBoundingClientRect();
|
|
2866
|
-
const {
|
|
2867
|
-
left,
|
|
2868
|
-
top,
|
|
2869
|
-
width,
|
|
2870
|
-
height
|
|
2871
|
-
} = elementRectForRootMargin;
|
|
2872
|
-
if (!skip) {
|
|
2873
|
-
onMove();
|
|
2874
|
-
}
|
|
2875
|
-
if (!width || !height) {
|
|
2876
|
-
return;
|
|
2877
|
-
}
|
|
2878
|
-
const insetTop = floor(top);
|
|
2879
|
-
const insetRight = floor(root.clientWidth - (left + width));
|
|
2880
|
-
const insetBottom = floor(root.clientHeight - (top + height));
|
|
2881
|
-
const insetLeft = floor(left);
|
|
2882
|
-
const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
|
|
2883
|
-
const options = {
|
|
2884
|
-
rootMargin,
|
|
2885
|
-
threshold: max(0, min(1, threshold)) || 1
|
|
2886
|
-
};
|
|
2887
|
-
let isFirstUpdate = true;
|
|
2888
|
-
function handleObserve(entries) {
|
|
2889
|
-
const ratio = entries[0].intersectionRatio;
|
|
2890
|
-
if (ratio !== threshold) {
|
|
2891
|
-
if (!isFirstUpdate) {
|
|
2892
|
-
return refresh();
|
|
2893
|
-
}
|
|
2894
|
-
if (!ratio) {
|
|
2895
|
-
// If the reference is clipped, the ratio is 0. Throttle the refresh
|
|
2896
|
-
// to prevent an infinite loop of updates.
|
|
2897
|
-
timeoutId = setTimeout(() => {
|
|
2898
|
-
refresh(false, 1e-7);
|
|
2899
|
-
}, 1000);
|
|
2900
|
-
} else {
|
|
2901
|
-
refresh(false, ratio);
|
|
2902
|
-
}
|
|
2903
|
-
}
|
|
2904
|
-
if (ratio === 1 && !rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) {
|
|
2905
|
-
// It's possible that even though the ratio is reported as 1, the
|
|
2906
|
-
// element is not actually fully within the IntersectionObserver's root
|
|
2907
|
-
// area anymore. This can happen under performance constraints. This may
|
|
2908
|
-
// be a bug in the browser's IntersectionObserver implementation. To
|
|
2909
|
-
// work around this, we compare the element's bounding rect now with
|
|
2910
|
-
// what it was at the time we created the IntersectionObserver. If they
|
|
2911
|
-
// are not equal then the element moved, so we refresh.
|
|
2912
|
-
refresh();
|
|
2913
|
-
}
|
|
2914
|
-
isFirstUpdate = false;
|
|
2915
|
-
}
|
|
2916
|
-
|
|
2917
|
-
// Older browsers don't support a `document` as the root and will throw an
|
|
2918
|
-
// error.
|
|
2919
|
-
try {
|
|
2920
|
-
io = new IntersectionObserver(handleObserve, {
|
|
2921
|
-
...options,
|
|
2922
|
-
// Handle <iframe>s
|
|
2923
|
-
root: root.ownerDocument
|
|
2924
|
-
});
|
|
2925
|
-
} catch (_e) {
|
|
2926
|
-
io = new IntersectionObserver(handleObserve, options);
|
|
2927
|
-
}
|
|
2928
|
-
io.observe(element);
|
|
2929
|
-
}
|
|
2930
|
-
refresh(true);
|
|
2931
|
-
return cleanup;
|
|
2932
|
-
}
|
|
2933
|
-
|
|
2934
|
-
/**
|
|
2935
|
-
* Automatically updates the position of the floating element when necessary.
|
|
2936
|
-
* Should only be called when the floating element is mounted on the DOM or
|
|
2937
|
-
* visible on the screen.
|
|
2938
|
-
* @returns cleanup function that should be invoked when the floating element is
|
|
2939
|
-
* removed from the DOM or hidden from the screen.
|
|
2940
|
-
* @see https://floating-ui.com/docs/autoUpdate
|
|
2941
|
-
*/
|
|
2942
|
-
function autoUpdate(reference, floating, update, options) {
|
|
2943
|
-
if (options === void 0) {
|
|
2944
|
-
options = {};
|
|
2945
|
-
}
|
|
2946
|
-
const {
|
|
2947
|
-
ancestorScroll = true,
|
|
2948
|
-
ancestorResize = true,
|
|
2949
|
-
elementResize = typeof ResizeObserver === 'function',
|
|
2950
|
-
layoutShift = typeof IntersectionObserver === 'function',
|
|
2951
|
-
animationFrame = false
|
|
2952
|
-
} = options;
|
|
2953
|
-
const referenceEl = unwrapElement(reference);
|
|
2954
|
-
const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...(floating ? getOverflowAncestors(floating) : [])] : [];
|
|
2955
|
-
ancestors.forEach(ancestor => {
|
|
2956
|
-
ancestorScroll && ancestor.addEventListener('scroll', update, {
|
|
2957
|
-
passive: true
|
|
2958
|
-
});
|
|
2959
|
-
ancestorResize && ancestor.addEventListener('resize', update);
|
|
2960
|
-
});
|
|
2961
|
-
const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
|
|
2962
|
-
let reobserveFrame = -1;
|
|
2963
|
-
let resizeObserver = null;
|
|
2964
|
-
if (elementResize) {
|
|
2965
|
-
resizeObserver = new ResizeObserver(_ref => {
|
|
2966
|
-
let [firstEntry] = _ref;
|
|
2967
|
-
if (firstEntry && firstEntry.target === referenceEl && resizeObserver && floating) {
|
|
2968
|
-
// Prevent update loops when using the `size` middleware.
|
|
2969
|
-
// https://github.com/floating-ui/floating-ui/issues/1740
|
|
2970
|
-
resizeObserver.unobserve(floating);
|
|
2971
|
-
cancelAnimationFrame(reobserveFrame);
|
|
2972
|
-
reobserveFrame = requestAnimationFrame(() => {
|
|
2973
|
-
var _resizeObserver;
|
|
2974
|
-
(_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
|
|
2975
|
-
});
|
|
2976
|
-
}
|
|
2977
|
-
update();
|
|
2978
|
-
});
|
|
2979
|
-
if (referenceEl && !animationFrame) {
|
|
2980
|
-
resizeObserver.observe(referenceEl);
|
|
2981
|
-
}
|
|
2982
|
-
if (floating) {
|
|
2983
|
-
resizeObserver.observe(floating);
|
|
2984
|
-
}
|
|
2985
|
-
}
|
|
2986
|
-
let frameId;
|
|
2987
|
-
let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
|
|
2988
|
-
if (animationFrame) {
|
|
2989
|
-
frameLoop();
|
|
2990
|
-
}
|
|
2991
|
-
function frameLoop() {
|
|
2992
|
-
const nextRefRect = getBoundingClientRect(reference);
|
|
2993
|
-
if (prevRefRect && !rectsAreEqual(prevRefRect, nextRefRect)) {
|
|
2994
|
-
update();
|
|
2995
|
-
}
|
|
2996
|
-
prevRefRect = nextRefRect;
|
|
2997
|
-
frameId = requestAnimationFrame(frameLoop);
|
|
2998
|
-
}
|
|
2999
|
-
update();
|
|
3000
|
-
return () => {
|
|
3001
|
-
var _resizeObserver2;
|
|
3002
|
-
ancestors.forEach(ancestor => {
|
|
3003
|
-
ancestorScroll && ancestor.removeEventListener('scroll', update);
|
|
3004
|
-
ancestorResize && ancestor.removeEventListener('resize', update);
|
|
3005
|
-
});
|
|
3006
|
-
cleanupIo == null || cleanupIo();
|
|
3007
|
-
(_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
|
|
3008
|
-
resizeObserver = null;
|
|
3009
|
-
if (animationFrame) {
|
|
3010
|
-
cancelAnimationFrame(frameId);
|
|
3011
|
-
}
|
|
3012
|
-
};
|
|
3013
|
-
}
|
|
3014
|
-
|
|
3015
|
-
/**
|
|
3016
|
-
* Modifies the placement by translating the floating element along the
|
|
3017
|
-
* specified axes.
|
|
3018
|
-
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
|
3019
|
-
* object may be passed.
|
|
3020
|
-
* @see https://floating-ui.com/docs/offset
|
|
3021
|
-
*/
|
|
3022
|
-
const offset$1 = offset$2;
|
|
3023
|
-
|
|
3024
|
-
/**
|
|
3025
|
-
* Optimizes the visibility of the floating element by choosing the placement
|
|
3026
|
-
* that has the most space available automatically, without needing to specify a
|
|
3027
|
-
* preferred placement. Alternative to `flip`.
|
|
3028
|
-
* @see https://floating-ui.com/docs/autoPlacement
|
|
3029
|
-
*/
|
|
3030
|
-
const autoPlacement$1 = autoPlacement$2;
|
|
3031
|
-
|
|
3032
|
-
/**
|
|
3033
|
-
* Optimizes the visibility of the floating element by shifting it in order to
|
|
3034
|
-
* keep it in view when it will overflow the clipping boundary.
|
|
3035
|
-
* @see https://floating-ui.com/docs/shift
|
|
3036
|
-
*/
|
|
3037
|
-
const shift$1 = shift$2;
|
|
3038
|
-
|
|
3039
|
-
/**
|
|
3040
|
-
* Optimizes the visibility of the floating element by flipping the `placement`
|
|
3041
|
-
* in order to keep it in view when the preferred placement(s) will overflow the
|
|
3042
|
-
* clipping boundary. Alternative to `autoPlacement`.
|
|
3043
|
-
* @see https://floating-ui.com/docs/flip
|
|
3044
|
-
*/
|
|
3045
|
-
const flip$1 = flip$2;
|
|
3046
|
-
|
|
3047
|
-
/**
|
|
3048
|
-
* Provides data that allows you to change the size of the floating element —
|
|
3049
|
-
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
3050
|
-
* width of the reference element.
|
|
3051
|
-
* @see https://floating-ui.com/docs/size
|
|
3052
|
-
*/
|
|
3053
|
-
const size$1 = size$2;
|
|
3054
|
-
|
|
3055
|
-
/**
|
|
3056
|
-
* Provides data to hide the floating element in applicable situations, such as
|
|
3057
|
-
* when it is not in the same clipping context as the reference element.
|
|
3058
|
-
* @see https://floating-ui.com/docs/hide
|
|
3059
|
-
*/
|
|
3060
|
-
const hide$1 = hide$2;
|
|
3061
|
-
|
|
3062
|
-
/**
|
|
3063
|
-
* Provides data to position an inner element of the floating element so that it
|
|
3064
|
-
* appears centered to the reference element.
|
|
3065
|
-
* @see https://floating-ui.com/docs/arrow
|
|
3066
|
-
*/
|
|
3067
|
-
const arrow$2 = arrow$3;
|
|
3068
|
-
|
|
3069
|
-
/**
|
|
3070
|
-
* Built-in `limiter` that will stop `shift()` at a certain point.
|
|
3071
|
-
*/
|
|
3072
|
-
const limitShift$1 = limitShift$2;
|
|
3073
|
-
|
|
3074
|
-
/**
|
|
3075
|
-
* Computes the `x` and `y` coordinates that will place the floating element
|
|
3076
|
-
* next to a given reference element.
|
|
3077
|
-
*/
|
|
3078
|
-
const computePosition = (reference, floating, options) => {
|
|
3079
|
-
// This caches the expensive `getClippingElementAncestors` function so that
|
|
3080
|
-
// multiple lifecycle resets re-use the same result. It only lives for a
|
|
3081
|
-
// single call. If other functions become expensive, we can add them as well.
|
|
3082
|
-
const cache = new Map();
|
|
3083
|
-
const mergedOptions = {
|
|
3084
|
-
platform,
|
|
3085
|
-
...options
|
|
3086
|
-
};
|
|
3087
|
-
const platformWithCache = {
|
|
3088
|
-
...mergedOptions.platform,
|
|
3089
|
-
_c: cache
|
|
3090
|
-
};
|
|
3091
|
-
return computePosition$1(reference, floating, {
|
|
3092
|
-
...mergedOptions,
|
|
3093
|
-
platform: platformWithCache
|
|
3094
|
-
});
|
|
3095
|
-
};
|
|
3096
|
-
|
|
3097
|
-
var isClient = typeof document !== 'undefined';
|
|
3098
|
-
|
|
3099
|
-
var noop = function noop() {};
|
|
3100
|
-
var index = isClient ? React.useLayoutEffect : noop;
|
|
3101
|
-
|
|
3102
|
-
// Fork of `fast-deep-equal` that only does the comparisons we need and compares
|
|
3103
|
-
// functions
|
|
3104
|
-
function deepEqual(a, b) {
|
|
3105
|
-
if (a === b) {
|
|
3106
|
-
return true;
|
|
3107
|
-
}
|
|
3108
|
-
if (typeof a !== typeof b) {
|
|
3109
|
-
return false;
|
|
3110
|
-
}
|
|
3111
|
-
if (typeof a === 'function' && a.toString() === b.toString()) {
|
|
3112
|
-
return true;
|
|
986
|
+
} else {
|
|
987
|
+
nextIndex = prevIndex;
|
|
988
|
+
}
|
|
989
|
+
}
|
|
3113
990
|
}
|
|
3114
|
-
|
|
3115
|
-
|
|
3116
|
-
|
|
3117
|
-
|
|
3118
|
-
|
|
3119
|
-
|
|
3120
|
-
|
|
3121
|
-
|
|
3122
|
-
|
|
3123
|
-
|
|
3124
|
-
|
|
991
|
+
return nextIndex;
|
|
992
|
+
}
|
|
993
|
+
|
|
994
|
+
/** For each cell index, gets the item index that occupies that cell */
|
|
995
|
+
function createGridCellMap(sizes, cols, dense) {
|
|
996
|
+
const cellMap = [];
|
|
997
|
+
let startIndex = 0;
|
|
998
|
+
sizes.forEach((_ref2, index) => {
|
|
999
|
+
let {
|
|
1000
|
+
width,
|
|
1001
|
+
height
|
|
1002
|
+
} = _ref2;
|
|
1003
|
+
if (width > cols) {
|
|
1004
|
+
if (process.env.NODE_ENV !== "production") {
|
|
1005
|
+
throw new Error("[Floating UI]: Invalid grid - item width at index " + index + " is greater than grid columns");
|
|
3125
1006
|
}
|
|
3126
|
-
return true;
|
|
3127
1007
|
}
|
|
3128
|
-
|
|
3129
|
-
|
|
3130
|
-
|
|
3131
|
-
return false;
|
|
1008
|
+
let itemPlaced = false;
|
|
1009
|
+
if (dense) {
|
|
1010
|
+
startIndex = 0;
|
|
3132
1011
|
}
|
|
3133
|
-
|
|
3134
|
-
|
|
3135
|
-
|
|
1012
|
+
while (!itemPlaced) {
|
|
1013
|
+
const targetCells = [];
|
|
1014
|
+
for (let i = 0; i < width; i++) {
|
|
1015
|
+
for (let j = 0; j < height; j++) {
|
|
1016
|
+
targetCells.push(startIndex + i + j * cols);
|
|
1017
|
+
}
|
|
1018
|
+
}
|
|
1019
|
+
if (startIndex % cols + width <= cols && targetCells.every(cell => cellMap[cell] == null)) {
|
|
1020
|
+
targetCells.forEach(cell => {
|
|
1021
|
+
cellMap[cell] = index;
|
|
1022
|
+
});
|
|
1023
|
+
itemPlaced = true;
|
|
1024
|
+
} else {
|
|
1025
|
+
startIndex++;
|
|
3136
1026
|
}
|
|
3137
1027
|
}
|
|
3138
|
-
|
|
3139
|
-
|
|
3140
|
-
|
|
3141
|
-
|
|
1028
|
+
});
|
|
1029
|
+
|
|
1030
|
+
// convert into a non-sparse array
|
|
1031
|
+
return [...cellMap];
|
|
1032
|
+
}
|
|
1033
|
+
|
|
1034
|
+
/** Gets cell index of an item's corner or -1 when index is -1. */
|
|
1035
|
+
function getGridCellIndexOfCorner(index, sizes, cellMap, cols, corner) {
|
|
1036
|
+
if (index === -1) return -1;
|
|
1037
|
+
const firstCellIndex = cellMap.indexOf(index);
|
|
1038
|
+
const sizeItem = sizes[index];
|
|
1039
|
+
switch (corner) {
|
|
1040
|
+
case 'tl':
|
|
1041
|
+
return firstCellIndex;
|
|
1042
|
+
case 'tr':
|
|
1043
|
+
if (!sizeItem) {
|
|
1044
|
+
return firstCellIndex;
|
|
3142
1045
|
}
|
|
3143
|
-
|
|
3144
|
-
|
|
1046
|
+
return firstCellIndex + sizeItem.width - 1;
|
|
1047
|
+
case 'bl':
|
|
1048
|
+
if (!sizeItem) {
|
|
1049
|
+
return firstCellIndex;
|
|
3145
1050
|
}
|
|
3146
|
-
|
|
3147
|
-
|
|
1051
|
+
return firstCellIndex + (sizeItem.height - 1) * cols;
|
|
1052
|
+
case 'br':
|
|
1053
|
+
return cellMap.lastIndexOf(index);
|
|
3148
1054
|
}
|
|
3149
|
-
return a !== a && b !== b;
|
|
3150
1055
|
}
|
|
3151
1056
|
|
|
3152
|
-
|
|
3153
|
-
|
|
3154
|
-
|
|
1057
|
+
/** Gets all cell indices that correspond to the specified indices */
|
|
1058
|
+
function getGridCellIndices(indices, cellMap) {
|
|
1059
|
+
return cellMap.flatMap((index, cellIndex) => indices.includes(index) ? [cellIndex] : []);
|
|
1060
|
+
}
|
|
1061
|
+
function isListIndexDisabled(listRef, index, disabledIndices) {
|
|
1062
|
+
if (typeof disabledIndices === 'function') {
|
|
1063
|
+
return disabledIndices(index);
|
|
1064
|
+
} else if (disabledIndices) {
|
|
1065
|
+
return disabledIndices.includes(index);
|
|
3155
1066
|
}
|
|
3156
|
-
const
|
|
3157
|
-
return
|
|
1067
|
+
const element = listRef.current[index];
|
|
1068
|
+
return element == null || element.hasAttribute('disabled') || element.getAttribute('aria-disabled') === 'true';
|
|
3158
1069
|
}
|
|
3159
1070
|
|
|
3160
|
-
|
|
3161
|
-
|
|
3162
|
-
|
|
1071
|
+
const getTabbableOptions = () => ({
|
|
1072
|
+
getShadowRoot: true,
|
|
1073
|
+
displayCheck:
|
|
1074
|
+
// JSDOM does not support the `tabbable` library. To solve this we can
|
|
1075
|
+
// check if `ResizeObserver` is a real function (not polyfilled), which
|
|
1076
|
+
// determines if the current environment is JSDOM-like.
|
|
1077
|
+
typeof ResizeObserver === 'function' && ResizeObserver.toString().includes('[native code]') ? 'full' : 'none'
|
|
1078
|
+
});
|
|
1079
|
+
function getTabbableIn(container, dir) {
|
|
1080
|
+
const list = tabbable(container, getTabbableOptions());
|
|
1081
|
+
const len = list.length;
|
|
1082
|
+
if (len === 0) return;
|
|
1083
|
+
const active = activeElement(getDocument$1(container));
|
|
1084
|
+
const index = list.indexOf(active);
|
|
1085
|
+
const nextIndex = index === -1 ? dir === 1 ? 0 : len - 1 : index + dir;
|
|
1086
|
+
return list[nextIndex];
|
|
3163
1087
|
}
|
|
3164
|
-
|
|
3165
|
-
|
|
3166
|
-
const ref = React__namespace.useRef(value);
|
|
3167
|
-
index(() => {
|
|
3168
|
-
ref.current = value;
|
|
3169
|
-
});
|
|
3170
|
-
return ref;
|
|
1088
|
+
function getNextTabbable(referenceElement) {
|
|
1089
|
+
return getTabbableIn(getDocument$1(referenceElement).body, 1) || referenceElement;
|
|
3171
1090
|
}
|
|
3172
|
-
|
|
3173
|
-
|
|
3174
|
-
|
|
3175
|
-
|
|
3176
|
-
|
|
3177
|
-
|
|
3178
|
-
|
|
3179
|
-
|
|
3180
|
-
|
|
3181
|
-
const
|
|
3182
|
-
|
|
3183
|
-
|
|
3184
|
-
|
|
3185
|
-
platform,
|
|
3186
|
-
elements: {
|
|
3187
|
-
reference: externalReference,
|
|
3188
|
-
floating: externalFloating
|
|
3189
|
-
} = {},
|
|
3190
|
-
transform = true,
|
|
3191
|
-
whileElementsMounted,
|
|
3192
|
-
open
|
|
3193
|
-
} = options;
|
|
3194
|
-
const [data, setData] = React__namespace.useState({
|
|
3195
|
-
x: 0,
|
|
3196
|
-
y: 0,
|
|
3197
|
-
strategy,
|
|
3198
|
-
placement,
|
|
3199
|
-
middlewareData: {},
|
|
3200
|
-
isPositioned: false
|
|
1091
|
+
function getPreviousTabbable(referenceElement) {
|
|
1092
|
+
return getTabbableIn(getDocument$1(referenceElement).body, -1) || referenceElement;
|
|
1093
|
+
}
|
|
1094
|
+
function isOutsideEvent(event, container) {
|
|
1095
|
+
const containerElement = container || event.currentTarget;
|
|
1096
|
+
const relatedTarget = event.relatedTarget;
|
|
1097
|
+
return !relatedTarget || !contains(containerElement, relatedTarget);
|
|
1098
|
+
}
|
|
1099
|
+
function disableFocusInside(container) {
|
|
1100
|
+
const tabbableElements = tabbable(container, getTabbableOptions());
|
|
1101
|
+
tabbableElements.forEach(element => {
|
|
1102
|
+
element.dataset.tabindex = element.getAttribute('tabindex') || '';
|
|
1103
|
+
element.setAttribute('tabindex', '-1');
|
|
3201
1104
|
});
|
|
3202
|
-
const [latestMiddleware, setLatestMiddleware] = React__namespace.useState(middleware);
|
|
3203
|
-
if (!deepEqual(latestMiddleware, middleware)) {
|
|
3204
|
-
setLatestMiddleware(middleware);
|
|
3205
|
-
}
|
|
3206
|
-
const [_reference, _setReference] = React__namespace.useState(null);
|
|
3207
|
-
const [_floating, _setFloating] = React__namespace.useState(null);
|
|
3208
|
-
const setReference = React__namespace.useCallback(node => {
|
|
3209
|
-
if (node !== referenceRef.current) {
|
|
3210
|
-
referenceRef.current = node;
|
|
3211
|
-
_setReference(node);
|
|
3212
|
-
}
|
|
3213
|
-
}, []);
|
|
3214
|
-
const setFloating = React__namespace.useCallback(node => {
|
|
3215
|
-
if (node !== floatingRef.current) {
|
|
3216
|
-
floatingRef.current = node;
|
|
3217
|
-
_setFloating(node);
|
|
3218
|
-
}
|
|
3219
|
-
}, []);
|
|
3220
|
-
const referenceEl = externalReference || _reference;
|
|
3221
|
-
const floatingEl = externalFloating || _floating;
|
|
3222
|
-
const referenceRef = React__namespace.useRef(null);
|
|
3223
|
-
const floatingRef = React__namespace.useRef(null);
|
|
3224
|
-
const dataRef = React__namespace.useRef(data);
|
|
3225
|
-
const hasWhileElementsMounted = whileElementsMounted != null;
|
|
3226
|
-
const whileElementsMountedRef = useLatestRef(whileElementsMounted);
|
|
3227
|
-
const platformRef = useLatestRef(platform);
|
|
3228
|
-
const openRef = useLatestRef(open);
|
|
3229
|
-
const update = React__namespace.useCallback(() => {
|
|
3230
|
-
if (!referenceRef.current || !floatingRef.current) {
|
|
3231
|
-
return;
|
|
3232
|
-
}
|
|
3233
|
-
const config = {
|
|
3234
|
-
placement,
|
|
3235
|
-
strategy,
|
|
3236
|
-
middleware: latestMiddleware
|
|
3237
|
-
};
|
|
3238
|
-
if (platformRef.current) {
|
|
3239
|
-
config.platform = platformRef.current;
|
|
3240
|
-
}
|
|
3241
|
-
computePosition(referenceRef.current, floatingRef.current, config).then(data => {
|
|
3242
|
-
const fullData = {
|
|
3243
|
-
...data,
|
|
3244
|
-
// The floating element's position may be recomputed while it's closed
|
|
3245
|
-
// but still mounted (such as when transitioning out). To ensure
|
|
3246
|
-
// `isPositioned` will be `false` initially on the next open, avoid
|
|
3247
|
-
// setting it to `true` when `open === false` (must be specified).
|
|
3248
|
-
isPositioned: openRef.current !== false
|
|
3249
|
-
};
|
|
3250
|
-
if (isMountedRef.current && !deepEqual(dataRef.current, fullData)) {
|
|
3251
|
-
dataRef.current = fullData;
|
|
3252
|
-
ReactDOM__namespace.flushSync(() => {
|
|
3253
|
-
setData(fullData);
|
|
3254
|
-
});
|
|
3255
|
-
}
|
|
3256
|
-
});
|
|
3257
|
-
}, [latestMiddleware, placement, strategy, platformRef, openRef]);
|
|
3258
|
-
index(() => {
|
|
3259
|
-
if (open === false && dataRef.current.isPositioned) {
|
|
3260
|
-
dataRef.current.isPositioned = false;
|
|
3261
|
-
setData(data => ({
|
|
3262
|
-
...data,
|
|
3263
|
-
isPositioned: false
|
|
3264
|
-
}));
|
|
3265
|
-
}
|
|
3266
|
-
}, [open]);
|
|
3267
|
-
const isMountedRef = React__namespace.useRef(false);
|
|
3268
|
-
index(() => {
|
|
3269
|
-
isMountedRef.current = true;
|
|
3270
|
-
return () => {
|
|
3271
|
-
isMountedRef.current = false;
|
|
3272
|
-
};
|
|
3273
|
-
}, []);
|
|
3274
|
-
index(() => {
|
|
3275
|
-
if (referenceEl) referenceRef.current = referenceEl;
|
|
3276
|
-
if (floatingEl) floatingRef.current = floatingEl;
|
|
3277
|
-
if (referenceEl && floatingEl) {
|
|
3278
|
-
if (whileElementsMountedRef.current) {
|
|
3279
|
-
return whileElementsMountedRef.current(referenceEl, floatingEl, update);
|
|
3280
|
-
}
|
|
3281
|
-
update();
|
|
3282
|
-
}
|
|
3283
|
-
}, [referenceEl, floatingEl, update, whileElementsMountedRef, hasWhileElementsMounted]);
|
|
3284
|
-
const refs = React__namespace.useMemo(() => ({
|
|
3285
|
-
reference: referenceRef,
|
|
3286
|
-
floating: floatingRef,
|
|
3287
|
-
setReference,
|
|
3288
|
-
setFloating
|
|
3289
|
-
}), [setReference, setFloating]);
|
|
3290
|
-
const elements = React__namespace.useMemo(() => ({
|
|
3291
|
-
reference: referenceEl,
|
|
3292
|
-
floating: floatingEl
|
|
3293
|
-
}), [referenceEl, floatingEl]);
|
|
3294
|
-
const floatingStyles = React__namespace.useMemo(() => {
|
|
3295
|
-
const initialStyles = {
|
|
3296
|
-
position: strategy,
|
|
3297
|
-
left: 0,
|
|
3298
|
-
top: 0
|
|
3299
|
-
};
|
|
3300
|
-
if (!elements.floating) {
|
|
3301
|
-
return initialStyles;
|
|
3302
|
-
}
|
|
3303
|
-
const x = roundByDPR(elements.floating, data.x);
|
|
3304
|
-
const y = roundByDPR(elements.floating, data.y);
|
|
3305
|
-
if (transform) {
|
|
3306
|
-
return {
|
|
3307
|
-
...initialStyles,
|
|
3308
|
-
transform: "translate(" + x + "px, " + y + "px)",
|
|
3309
|
-
...(getDPR(elements.floating) >= 1.5 && {
|
|
3310
|
-
willChange: 'transform'
|
|
3311
|
-
})
|
|
3312
|
-
};
|
|
3313
|
-
}
|
|
3314
|
-
return {
|
|
3315
|
-
position: strategy,
|
|
3316
|
-
left: x,
|
|
3317
|
-
top: y
|
|
3318
|
-
};
|
|
3319
|
-
}, [strategy, transform, elements.floating, data.x, data.y]);
|
|
3320
|
-
return React__namespace.useMemo(() => ({
|
|
3321
|
-
...data,
|
|
3322
|
-
update,
|
|
3323
|
-
refs,
|
|
3324
|
-
elements,
|
|
3325
|
-
floatingStyles
|
|
3326
|
-
}), [data, update, refs, elements, floatingStyles]);
|
|
3327
1105
|
}
|
|
3328
|
-
|
|
3329
|
-
|
|
3330
|
-
|
|
3331
|
-
|
|
3332
|
-
|
|
3333
|
-
|
|
3334
|
-
|
|
3335
|
-
|
|
3336
|
-
|
|
3337
|
-
return {}.hasOwnProperty.call(value, 'current');
|
|
3338
|
-
}
|
|
3339
|
-
return {
|
|
3340
|
-
name: 'arrow',
|
|
3341
|
-
options,
|
|
3342
|
-
fn(state) {
|
|
3343
|
-
const {
|
|
3344
|
-
element,
|
|
3345
|
-
padding
|
|
3346
|
-
} = typeof options === 'function' ? options(state) : options;
|
|
3347
|
-
if (element && isRef(element)) {
|
|
3348
|
-
if (element.current != null) {
|
|
3349
|
-
return arrow$2({
|
|
3350
|
-
element: element.current,
|
|
3351
|
-
padding
|
|
3352
|
-
}).fn(state);
|
|
3353
|
-
}
|
|
3354
|
-
return {};
|
|
3355
|
-
}
|
|
3356
|
-
if (element) {
|
|
3357
|
-
return arrow$2({
|
|
3358
|
-
element,
|
|
3359
|
-
padding
|
|
3360
|
-
}).fn(state);
|
|
3361
|
-
}
|
|
3362
|
-
return {};
|
|
1106
|
+
function enableFocusInside(container) {
|
|
1107
|
+
const elements = container.querySelectorAll('[data-tabindex]');
|
|
1108
|
+
elements.forEach(element => {
|
|
1109
|
+
const tabindex = element.dataset.tabindex;
|
|
1110
|
+
delete element.dataset.tabindex;
|
|
1111
|
+
if (tabindex) {
|
|
1112
|
+
element.setAttribute('tabindex', tabindex);
|
|
1113
|
+
} else {
|
|
1114
|
+
element.removeAttribute('tabindex');
|
|
3363
1115
|
}
|
|
3364
|
-
};
|
|
3365
|
-
}
|
|
3366
|
-
|
|
3367
|
-
/**
|
|
3368
|
-
* Modifies the placement by translating the floating element along the
|
|
3369
|
-
* specified axes.
|
|
3370
|
-
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
|
3371
|
-
* object may be passed.
|
|
3372
|
-
* @see https://floating-ui.com/docs/offset
|
|
3373
|
-
*/
|
|
3374
|
-
const offset = (options, deps) => {
|
|
3375
|
-
const result = offset$1(options);
|
|
3376
|
-
return {
|
|
3377
|
-
name: result.name,
|
|
3378
|
-
fn: result.fn,
|
|
3379
|
-
options: [options, deps]
|
|
3380
|
-
};
|
|
3381
|
-
};
|
|
3382
|
-
|
|
3383
|
-
/**
|
|
3384
|
-
* Optimizes the visibility of the floating element by shifting it in order to
|
|
3385
|
-
* keep it in view when it will overflow the clipping boundary.
|
|
3386
|
-
* @see https://floating-ui.com/docs/shift
|
|
3387
|
-
*/
|
|
3388
|
-
const shift = (options, deps) => {
|
|
3389
|
-
const result = shift$1(options);
|
|
3390
|
-
return {
|
|
3391
|
-
name: result.name,
|
|
3392
|
-
fn: result.fn,
|
|
3393
|
-
options: [options, deps]
|
|
3394
|
-
};
|
|
3395
|
-
};
|
|
3396
|
-
|
|
3397
|
-
/**
|
|
3398
|
-
* Built-in `limiter` that will stop `shift()` at a certain point.
|
|
3399
|
-
*/
|
|
3400
|
-
const limitShift = (options, deps) => {
|
|
3401
|
-
const result = limitShift$1(options);
|
|
3402
|
-
return {
|
|
3403
|
-
fn: result.fn,
|
|
3404
|
-
options: [options, deps]
|
|
3405
|
-
};
|
|
3406
|
-
};
|
|
3407
|
-
|
|
3408
|
-
/**
|
|
3409
|
-
* Optimizes the visibility of the floating element by flipping the `placement`
|
|
3410
|
-
* in order to keep it in view when the preferred placement(s) will overflow the
|
|
3411
|
-
* clipping boundary. Alternative to `autoPlacement`.
|
|
3412
|
-
* @see https://floating-ui.com/docs/flip
|
|
3413
|
-
*/
|
|
3414
|
-
const flip = (options, deps) => {
|
|
3415
|
-
const result = flip$1(options);
|
|
3416
|
-
return {
|
|
3417
|
-
name: result.name,
|
|
3418
|
-
fn: result.fn,
|
|
3419
|
-
options: [options, deps]
|
|
3420
|
-
};
|
|
3421
|
-
};
|
|
3422
|
-
|
|
3423
|
-
/**
|
|
3424
|
-
* Provides data that allows you to change the size of the floating element —
|
|
3425
|
-
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
3426
|
-
* width of the reference element.
|
|
3427
|
-
* @see https://floating-ui.com/docs/size
|
|
3428
|
-
*/
|
|
3429
|
-
const size = (options, deps) => {
|
|
3430
|
-
const result = size$1(options);
|
|
3431
|
-
return {
|
|
3432
|
-
name: result.name,
|
|
3433
|
-
fn: result.fn,
|
|
3434
|
-
options: [options, deps]
|
|
3435
|
-
};
|
|
3436
|
-
};
|
|
3437
|
-
|
|
3438
|
-
/**
|
|
3439
|
-
* Optimizes the visibility of the floating element by choosing the placement
|
|
3440
|
-
* that has the most space available automatically, without needing to specify a
|
|
3441
|
-
* preferred placement. Alternative to `flip`.
|
|
3442
|
-
* @see https://floating-ui.com/docs/autoPlacement
|
|
3443
|
-
*/
|
|
3444
|
-
const autoPlacement = (options, deps) => {
|
|
3445
|
-
const result = autoPlacement$1(options);
|
|
3446
|
-
return {
|
|
3447
|
-
name: result.name,
|
|
3448
|
-
fn: result.fn,
|
|
3449
|
-
options: [options, deps]
|
|
3450
|
-
};
|
|
3451
|
-
};
|
|
3452
|
-
|
|
3453
|
-
/**
|
|
3454
|
-
* Provides data to hide the floating element in applicable situations, such as
|
|
3455
|
-
* when it is not in the same clipping context as the reference element.
|
|
3456
|
-
* @see https://floating-ui.com/docs/hide
|
|
3457
|
-
*/
|
|
3458
|
-
const hide = (options, deps) => {
|
|
3459
|
-
const result = hide$1(options);
|
|
3460
|
-
return {
|
|
3461
|
-
name: result.name,
|
|
3462
|
-
fn: result.fn,
|
|
3463
|
-
options: [options, deps]
|
|
3464
|
-
};
|
|
3465
|
-
};
|
|
3466
|
-
|
|
3467
|
-
/**
|
|
3468
|
-
* Provides data to position an inner element of the floating element so that it
|
|
3469
|
-
* appears centered to the reference element.
|
|
3470
|
-
* This wraps the core `arrow` middleware to allow React refs as the element.
|
|
3471
|
-
* @see https://floating-ui.com/docs/arrow
|
|
3472
|
-
*/
|
|
3473
|
-
const arrow = (options, deps) => {
|
|
3474
|
-
const result = arrow$1(options);
|
|
3475
|
-
return {
|
|
3476
|
-
name: result.name,
|
|
3477
|
-
fn: result.fn,
|
|
3478
|
-
options: [options, deps]
|
|
3479
|
-
};
|
|
3480
|
-
};
|
|
1116
|
+
});
|
|
1117
|
+
}
|
|
3481
1118
|
|
|
3482
1119
|
const FOCUSABLE_ATTRIBUTE = 'data-floating-ui-focusable';
|
|
3483
1120
|
const ACTIVE_KEY = 'active';
|
|
@@ -3499,7 +1136,7 @@ const genId = () => // Ensure the id is unique with multiple independent version
|
|
|
3499
1136
|
"floating-ui-" + Math.random().toString(36).slice(2, 6) + count++;
|
|
3500
1137
|
function useFloatingId() {
|
|
3501
1138
|
const [id, setId] = React__namespace.useState(() => serverHandoffComplete ? genId() : undefined);
|
|
3502
|
-
index
|
|
1139
|
+
index(() => {
|
|
3503
1140
|
if (id == null) {
|
|
3504
1141
|
setId(genId());
|
|
3505
1142
|
}
|
|
@@ -3587,9 +1224,9 @@ const FloatingArrow = /*#__PURE__*/React__namespace.forwardRef(function Floating
|
|
|
3587
1224
|
const [isRTL, setIsRTL] = React__namespace.useState(false);
|
|
3588
1225
|
|
|
3589
1226
|
// https://github.com/floating-ui/floating-ui/issues/2932
|
|
3590
|
-
index
|
|
1227
|
+
index(() => {
|
|
3591
1228
|
if (!floating) return;
|
|
3592
|
-
const isRTL = getComputedStyle
|
|
1229
|
+
const isRTL = floatingUi_utils.getComputedStyle(floating).direction === 'rtl';
|
|
3593
1230
|
if (isRTL) {
|
|
3594
1231
|
setIsRTL(true);
|
|
3595
1232
|
}
|
|
@@ -3710,7 +1347,7 @@ function useFloatingNodeId(customParentId) {
|
|
|
3710
1347
|
const tree = useFloatingTree();
|
|
3711
1348
|
const reactParentId = useFloatingParentNodeId();
|
|
3712
1349
|
const parentId = reactParentId;
|
|
3713
|
-
index
|
|
1350
|
+
index(() => {
|
|
3714
1351
|
if (!id) return;
|
|
3715
1352
|
const node = {
|
|
3716
1353
|
id,
|
|
@@ -3862,7 +1499,7 @@ function applyAttributeToOthers(uncorrectedAvoidElements, body, ariaHidden, iner
|
|
|
3862
1499
|
return;
|
|
3863
1500
|
}
|
|
3864
1501
|
[].forEach.call(parent.children, node => {
|
|
3865
|
-
if (getNodeName(node) === 'script') return;
|
|
1502
|
+
if (floatingUi_utils.getNodeName(node) === 'script') return;
|
|
3866
1503
|
if (elementsToKeep.has(node)) {
|
|
3867
1504
|
deep(node);
|
|
3868
1505
|
} else {
|
|
@@ -3941,7 +1578,7 @@ const HIDDEN_STYLES = {
|
|
|
3941
1578
|
};
|
|
3942
1579
|
const FocusGuard = /*#__PURE__*/React__namespace.forwardRef(function FocusGuard(props, ref) {
|
|
3943
1580
|
const [role, setRole] = React__namespace.useState();
|
|
3944
|
-
index
|
|
1581
|
+
index(() => {
|
|
3945
1582
|
if (isSafari()) {
|
|
3946
1583
|
// Unlike other screen readers such as NVDA and JAWS, the virtual cursor
|
|
3947
1584
|
// on VoiceOver does trigger the onFocus event, so we can use the focus
|
|
@@ -3983,7 +1620,7 @@ function useFloatingPortalNode(props) {
|
|
|
3983
1620
|
const portalContext = usePortalContext();
|
|
3984
1621
|
const [portalNode, setPortalNode] = React__namespace.useState(null);
|
|
3985
1622
|
const portalNodeRef = React__namespace.useRef(null);
|
|
3986
|
-
index
|
|
1623
|
+
index(() => {
|
|
3987
1624
|
return () => {
|
|
3988
1625
|
portalNode == null || portalNode.remove();
|
|
3989
1626
|
// Allow the subsequent layout effects to create a new node on updates.
|
|
@@ -3994,7 +1631,7 @@ function useFloatingPortalNode(props) {
|
|
|
3994
1631
|
});
|
|
3995
1632
|
};
|
|
3996
1633
|
}, [portalNode]);
|
|
3997
|
-
index
|
|
1634
|
+
index(() => {
|
|
3998
1635
|
// Wait for the uniqueId to be generated before creating the portal node in
|
|
3999
1636
|
// React <18 (using `useFloatingId` instead of the native `useId`).
|
|
4000
1637
|
// https://github.com/floating-ui/floating-ui/issues/2778
|
|
@@ -4009,14 +1646,14 @@ function useFloatingPortalNode(props) {
|
|
|
4009
1646
|
portalNodeRef.current = subRoot;
|
|
4010
1647
|
setPortalNode(subRoot);
|
|
4011
1648
|
}, [id, uniqueId]);
|
|
4012
|
-
index
|
|
1649
|
+
index(() => {
|
|
4013
1650
|
// Wait for the root to exist before creating the portal node. The root must
|
|
4014
1651
|
// be stored in state, not a ref, for this to work reactively.
|
|
4015
1652
|
if (root === null) return;
|
|
4016
1653
|
if (!uniqueId) return;
|
|
4017
1654
|
if (portalNodeRef.current) return;
|
|
4018
1655
|
let container = root || (portalContext == null ? void 0 : portalContext.portalNode);
|
|
4019
|
-
if (container && !isNode(container)) container = container.current;
|
|
1656
|
+
if (container && !floatingUi_utils.isNode(container)) container = container.current;
|
|
4020
1657
|
container = container || document.body;
|
|
4021
1658
|
let idWrapper = null;
|
|
4022
1659
|
if (id) {
|
|
@@ -4164,7 +1801,7 @@ function clearDisconnectedPreviouslyFocusedElements() {
|
|
|
4164
1801
|
}
|
|
4165
1802
|
function addPreviouslyFocusedElement(element) {
|
|
4166
1803
|
clearDisconnectedPreviouslyFocusedElements();
|
|
4167
|
-
if (element && getNodeName(element) !== 'body') {
|
|
1804
|
+
if (element && floatingUi_utils.getNodeName(element) !== 'body') {
|
|
4168
1805
|
previouslyFocusedElements.push(element);
|
|
4169
1806
|
if (previouslyFocusedElements.length > LIST_LIMIT) {
|
|
4170
1807
|
previouslyFocusedElements = previouslyFocusedElements.slice(-20);
|
|
@@ -4259,9 +1896,9 @@ function FloatingFocusManager(props) {
|
|
|
4259
1896
|
const inertSupported = supportsInert();
|
|
4260
1897
|
const guards = inertSupported ? _guards : true;
|
|
4261
1898
|
const useInert = !guards || inertSupported && outsideElementsInert;
|
|
4262
|
-
const orderRef = useLatestRef
|
|
4263
|
-
const initialFocusRef = useLatestRef
|
|
4264
|
-
const returnFocusRef = useLatestRef
|
|
1899
|
+
const orderRef = useLatestRef(order);
|
|
1900
|
+
const initialFocusRef = useLatestRef(initialFocus);
|
|
1901
|
+
const returnFocusRef = useLatestRef(returnFocus);
|
|
4265
1902
|
const tree = useFloatingTree();
|
|
4266
1903
|
const portalContext = usePortalContext();
|
|
4267
1904
|
const startDismissButtonRef = React__namespace.useRef(null);
|
|
@@ -4370,13 +2007,13 @@ function FloatingFocusManager(props) {
|
|
|
4370
2007
|
if (restoreFocus && currentTarget !== domReference && !(target != null && target.isConnected) && activeElement(getDocument$1(floatingFocusElement)) === getDocument$1(floatingFocusElement).body) {
|
|
4371
2008
|
// Let `FloatingPortal` effect knows that focus is still inside the
|
|
4372
2009
|
// floating tree.
|
|
4373
|
-
if (isHTMLElement(floatingFocusElement)) {
|
|
2010
|
+
if (floatingUi_utils.isHTMLElement(floatingFocusElement)) {
|
|
4374
2011
|
floatingFocusElement.focus();
|
|
4375
2012
|
}
|
|
4376
2013
|
const prevTabbableIndex = tabbableIndexRef.current;
|
|
4377
2014
|
const tabbableContent = getTabbableContent();
|
|
4378
2015
|
const nodeToFocus = tabbableContent[prevTabbableIndex] || tabbableContent[tabbableContent.length - 1] || floatingFocusElement;
|
|
4379
|
-
if (isHTMLElement(nodeToFocus)) {
|
|
2016
|
+
if (floatingUi_utils.isHTMLElement(nodeToFocus)) {
|
|
4380
2017
|
nodeToFocus.focus();
|
|
4381
2018
|
}
|
|
4382
2019
|
}
|
|
@@ -4405,7 +2042,7 @@ function FloatingFocusManager(props) {
|
|
|
4405
2042
|
dataRef.current.insideReactTree = false;
|
|
4406
2043
|
});
|
|
4407
2044
|
}
|
|
4408
|
-
if (floating && isHTMLElement(domReference)) {
|
|
2045
|
+
if (floating && floatingUi_utils.isHTMLElement(domReference)) {
|
|
4409
2046
|
domReference.addEventListener('focusout', handleFocusOutside);
|
|
4410
2047
|
domReference.addEventListener('pointerdown', handlePointerDown);
|
|
4411
2048
|
floating.addEventListener('focusout', handleFocusOutside);
|
|
@@ -4444,8 +2081,8 @@ function FloatingFocusManager(props) {
|
|
|
4444
2081
|
cleanup();
|
|
4445
2082
|
};
|
|
4446
2083
|
}, [disabled, domReference, floating, modal, orderRef, portalContext, isUntrappedTypeableCombobox, guards, useInert, tree, getNodeId, getInsideElements]);
|
|
4447
|
-
index
|
|
4448
|
-
if (disabled || !isHTMLElement(floatingFocusElement)) return;
|
|
2084
|
+
index(() => {
|
|
2085
|
+
if (disabled || !floatingUi_utils.isHTMLElement(floatingFocusElement)) return;
|
|
4449
2086
|
const doc = getDocument$1(floatingFocusElement);
|
|
4450
2087
|
const previouslyFocusedElement = activeElement(doc);
|
|
4451
2088
|
|
|
@@ -4462,7 +2099,7 @@ function FloatingFocusManager(props) {
|
|
|
4462
2099
|
}
|
|
4463
2100
|
});
|
|
4464
2101
|
}, [disabled, open, floatingFocusElement, ignoreInitialFocus, getTabbableElements, initialFocusRef]);
|
|
4465
|
-
index
|
|
2102
|
+
index(() => {
|
|
4466
2103
|
if (disabled || !floatingFocusElement) return;
|
|
4467
2104
|
const doc = getDocument$1(floatingFocusElement);
|
|
4468
2105
|
const previouslyFocusedElement = activeElement(doc);
|
|
@@ -4527,7 +2164,7 @@ function FloatingFocusManager(props) {
|
|
|
4527
2164
|
const tabbableReturnElement = getFirstTabbableElement(returnElement);
|
|
4528
2165
|
if (
|
|
4529
2166
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
4530
|
-
returnFocusRef.current && !preventReturnFocusRef.current && isHTMLElement(tabbableReturnElement) && (
|
|
2167
|
+
returnFocusRef.current && !preventReturnFocusRef.current && floatingUi_utils.isHTMLElement(tabbableReturnElement) && (
|
|
4531
2168
|
// If the focus moved somewhere else after mount, avoid returning focus
|
|
4532
2169
|
// since it likely entered a different element which should be
|
|
4533
2170
|
// respected: https://github.com/floating-ui/floating-ui/issues/2607
|
|
@@ -4553,7 +2190,7 @@ function FloatingFocusManager(props) {
|
|
|
4553
2190
|
|
|
4554
2191
|
// Synchronize the `context` & `modal` value to the FloatingPortal context.
|
|
4555
2192
|
// It will decide whether or not it needs to render its own guards.
|
|
4556
|
-
index
|
|
2193
|
+
index(() => {
|
|
4557
2194
|
if (disabled) return;
|
|
4558
2195
|
if (!portalContext) return;
|
|
4559
2196
|
portalContext.setFocusManagerState({
|
|
@@ -4567,7 +2204,7 @@ function FloatingFocusManager(props) {
|
|
|
4567
2204
|
portalContext.setFocusManagerState(null);
|
|
4568
2205
|
};
|
|
4569
2206
|
}, [disabled, portalContext, modal, open, onOpenChange, closeOnFocusOut, domReference]);
|
|
4570
|
-
index
|
|
2207
|
+
index(() => {
|
|
4571
2208
|
if (disabled) return;
|
|
4572
2209
|
if (!floatingFocusElement) return;
|
|
4573
2210
|
handleTabIndex(floatingFocusElement, orderRef);
|
|
@@ -4689,7 +2326,7 @@ const FloatingOverlay = /*#__PURE__*/React__namespace.forwardRef(function Floati
|
|
|
4689
2326
|
lockScroll = false,
|
|
4690
2327
|
...rest
|
|
4691
2328
|
} = props;
|
|
4692
|
-
index
|
|
2329
|
+
index(() => {
|
|
4693
2330
|
if (!lockScroll) return;
|
|
4694
2331
|
lockCount++;
|
|
4695
2332
|
if (lockCount === 1) {
|
|
@@ -4718,10 +2355,10 @@ const FloatingOverlay = /*#__PURE__*/React__namespace.forwardRef(function Floati
|
|
|
4718
2355
|
});
|
|
4719
2356
|
|
|
4720
2357
|
function isButtonTarget(event) {
|
|
4721
|
-
return isHTMLElement(event.target) && event.target.tagName === 'BUTTON';
|
|
2358
|
+
return floatingUi_utils.isHTMLElement(event.target) && event.target.tagName === 'BUTTON';
|
|
4722
2359
|
}
|
|
4723
2360
|
function isAnchorTarget(event) {
|
|
4724
|
-
return isHTMLElement(event.target) && event.target.tagName === 'A';
|
|
2361
|
+
return floatingUi_utils.isHTMLElement(event.target) && event.target.tagName === 'A';
|
|
4725
2362
|
}
|
|
4726
2363
|
function isSpaceIgnored(element) {
|
|
4727
2364
|
return isTypeableElement(element);
|
|
@@ -4946,10 +2583,10 @@ function useDismiss(context, props) {
|
|
|
4946
2583
|
const target = getTarget(event);
|
|
4947
2584
|
const inertSelector = "[" + createAttribute('inert') + "]";
|
|
4948
2585
|
const markers = getDocument$1(elements.floating).querySelectorAll(inertSelector);
|
|
4949
|
-
let targetRootAncestor = isElement(target) ? target : null;
|
|
4950
|
-
while (targetRootAncestor && !isLastTraversableNode(targetRootAncestor)) {
|
|
4951
|
-
const nextParent = getParentNode(targetRootAncestor);
|
|
4952
|
-
if (isLastTraversableNode(nextParent) || !isElement(nextParent)) {
|
|
2586
|
+
let targetRootAncestor = floatingUi_utils.isElement(target) ? target : null;
|
|
2587
|
+
while (targetRootAncestor && !floatingUi_utils.isLastTraversableNode(targetRootAncestor)) {
|
|
2588
|
+
const nextParent = floatingUi_utils.getParentNode(targetRootAncestor);
|
|
2589
|
+
if (floatingUi_utils.isLastTraversableNode(nextParent) || !floatingUi_utils.isElement(nextParent)) {
|
|
4953
2590
|
break;
|
|
4954
2591
|
}
|
|
4955
2592
|
targetRootAncestor = nextParent;
|
|
@@ -4957,7 +2594,7 @@ function useDismiss(context, props) {
|
|
|
4957
2594
|
|
|
4958
2595
|
// Check if the click occurred on a third-party element injected after the
|
|
4959
2596
|
// floating element rendered.
|
|
4960
|
-
if (markers.length && isElement(target) && !isRootElement(target) &&
|
|
2597
|
+
if (markers.length && floatingUi_utils.isElement(target) && !isRootElement(target) &&
|
|
4961
2598
|
// Clicked on a direct ancestor (e.g. FloatingOverlay).
|
|
4962
2599
|
!contains(target, elements.floating) &&
|
|
4963
2600
|
// If the target root element contains none of the markers, then the
|
|
@@ -4967,9 +2604,9 @@ function useDismiss(context, props) {
|
|
|
4967
2604
|
}
|
|
4968
2605
|
|
|
4969
2606
|
// Check if the click occurred on the scrollbar
|
|
4970
|
-
if (isHTMLElement(target) && floating) {
|
|
4971
|
-
const lastTraversableNode = isLastTraversableNode(target);
|
|
4972
|
-
const style = getComputedStyle
|
|
2607
|
+
if (floatingUi_utils.isHTMLElement(target) && floating) {
|
|
2608
|
+
const lastTraversableNode = floatingUi_utils.isLastTraversableNode(target);
|
|
2609
|
+
const style = floatingUi_utils.getComputedStyle(target);
|
|
4973
2610
|
const scrollRe = /auto|scroll/;
|
|
4974
2611
|
const isScrollableX = lastTraversableNode || scrollRe.test(style.overflowX);
|
|
4975
2612
|
const isScrollableY = lastTraversableNode || scrollRe.test(style.overflowY);
|
|
@@ -5044,7 +2681,7 @@ function useDismiss(context, props) {
|
|
|
5044
2681
|
},
|
|
5045
2682
|
// 0ms or 1ms don't work in Safari. 5ms appears to consistently work.
|
|
5046
2683
|
// Only apply to WebKit for the test to remain 0ms.
|
|
5047
|
-
isWebKit() ? 5 : 0);
|
|
2684
|
+
floatingUi_utils.isWebKit() ? 5 : 0);
|
|
5048
2685
|
}
|
|
5049
2686
|
const doc = getDocument$1(elements.floating);
|
|
5050
2687
|
if (escapeKey) {
|
|
@@ -5055,14 +2692,14 @@ function useDismiss(context, props) {
|
|
|
5055
2692
|
outsidePress && doc.addEventListener(outsidePressEvent, outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture);
|
|
5056
2693
|
let ancestors = [];
|
|
5057
2694
|
if (ancestorScroll) {
|
|
5058
|
-
if (isElement(elements.domReference)) {
|
|
5059
|
-
ancestors = getOverflowAncestors(elements.domReference);
|
|
2695
|
+
if (floatingUi_utils.isElement(elements.domReference)) {
|
|
2696
|
+
ancestors = floatingUi_utils.getOverflowAncestors(elements.domReference);
|
|
5060
2697
|
}
|
|
5061
|
-
if (isElement(elements.floating)) {
|
|
5062
|
-
ancestors = ancestors.concat(getOverflowAncestors(elements.floating));
|
|
2698
|
+
if (floatingUi_utils.isElement(elements.floating)) {
|
|
2699
|
+
ancestors = ancestors.concat(floatingUi_utils.getOverflowAncestors(elements.floating));
|
|
5063
2700
|
}
|
|
5064
|
-
if (!isElement(elements.reference) && elements.reference && elements.reference.contextElement) {
|
|
5065
|
-
ancestors = ancestors.concat(getOverflowAncestors(elements.reference.contextElement));
|
|
2701
|
+
if (!floatingUi_utils.isElement(elements.reference) && elements.reference && elements.reference.contextElement) {
|
|
2702
|
+
ancestors = ancestors.concat(floatingUi_utils.getOverflowAncestors(elements.reference.contextElement));
|
|
5066
2703
|
}
|
|
5067
2704
|
}
|
|
5068
2705
|
|
|
@@ -5135,7 +2772,7 @@ function useFloatingRootContext(options) {
|
|
|
5135
2772
|
const nested = useFloatingParentNodeId() != null;
|
|
5136
2773
|
if (process.env.NODE_ENV !== "production") {
|
|
5137
2774
|
const optionDomReference = elementsProp.reference;
|
|
5138
|
-
if (optionDomReference && !isElement(optionDomReference)) {
|
|
2775
|
+
if (optionDomReference && !floatingUi_utils.isElement(optionDomReference)) {
|
|
5139
2776
|
error('Cannot pass a virtual element to the `elements.reference` option,', 'as it must be a real DOM element. Use `refs.setPositionReference()`', 'instead.');
|
|
5140
2777
|
}
|
|
5141
2778
|
}
|
|
@@ -5196,12 +2833,12 @@ function useFloating(options) {
|
|
|
5196
2833
|
const domReference = optionDomReference || _domReference;
|
|
5197
2834
|
const domReferenceRef = React__namespace.useRef(null);
|
|
5198
2835
|
const tree = useFloatingTree();
|
|
5199
|
-
index
|
|
2836
|
+
index(() => {
|
|
5200
2837
|
if (domReference) {
|
|
5201
2838
|
domReferenceRef.current = domReference;
|
|
5202
2839
|
}
|
|
5203
2840
|
}, [domReference]);
|
|
5204
|
-
const position = useFloating
|
|
2841
|
+
const position = floatingUi_reactDom.useFloating({
|
|
5205
2842
|
...options,
|
|
5206
2843
|
elements: {
|
|
5207
2844
|
...computedElements,
|
|
@@ -5211,7 +2848,7 @@ function useFloating(options) {
|
|
|
5211
2848
|
}
|
|
5212
2849
|
});
|
|
5213
2850
|
const setPositionReference = React__namespace.useCallback(node => {
|
|
5214
|
-
const computedPositionReference = isElement(node) ? {
|
|
2851
|
+
const computedPositionReference = floatingUi_utils.isElement(node) ? {
|
|
5215
2852
|
getBoundingClientRect: () => node.getBoundingClientRect(),
|
|
5216
2853
|
getClientRects: () => node.getClientRects(),
|
|
5217
2854
|
contextElement: node
|
|
@@ -5222,18 +2859,18 @@ function useFloating(options) {
|
|
|
5222
2859
|
position.refs.setReference(computedPositionReference);
|
|
5223
2860
|
}, [position.refs]);
|
|
5224
2861
|
const setReference = React__namespace.useCallback(node => {
|
|
5225
|
-
if (isElement(node) || node === null) {
|
|
2862
|
+
if (floatingUi_utils.isElement(node) || node === null) {
|
|
5226
2863
|
domReferenceRef.current = node;
|
|
5227
2864
|
setDomReference(node);
|
|
5228
2865
|
}
|
|
5229
2866
|
|
|
5230
2867
|
// Backwards-compatibility for passing a virtual element to `reference`
|
|
5231
2868
|
// after it has set the DOM reference.
|
|
5232
|
-
if (isElement(position.refs.reference.current) || position.refs.reference.current === null ||
|
|
2869
|
+
if (floatingUi_utils.isElement(position.refs.reference.current) || position.refs.reference.current === null ||
|
|
5233
2870
|
// Don't allow setting virtual elements using the old technique back to
|
|
5234
2871
|
// `null` to support `positionReference` + an unstable `reference`
|
|
5235
2872
|
// callback ref.
|
|
5236
|
-
node !== null && !isElement(node)) {
|
|
2873
|
+
node !== null && !floatingUi_utils.isElement(node)) {
|
|
5237
2874
|
position.refs.setReference(node);
|
|
5238
2875
|
}
|
|
5239
2876
|
}, [position.refs]);
|
|
@@ -5254,7 +2891,7 @@ function useFloating(options) {
|
|
|
5254
2891
|
elements,
|
|
5255
2892
|
nodeId
|
|
5256
2893
|
}), [position, refs, elements, nodeId, rootContext]);
|
|
5257
|
-
index
|
|
2894
|
+
index(() => {
|
|
5258
2895
|
rootContext.dataRef.current.floatingContext = context;
|
|
5259
2896
|
const node = tree == null ? void 0 : tree.nodesRef.current.find(node => node.id === nodeId);
|
|
5260
2897
|
if (node) {
|
|
@@ -5437,10 +3074,10 @@ function useListNavigation(context, props) {
|
|
|
5437
3074
|
}
|
|
5438
3075
|
}
|
|
5439
3076
|
const floatingFocusElement = getFloatingFocusElement(elements.floating);
|
|
5440
|
-
const floatingFocusElementRef = useLatestRef
|
|
3077
|
+
const floatingFocusElementRef = useLatestRef(floatingFocusElement);
|
|
5441
3078
|
const parentId = useFloatingParentNodeId();
|
|
5442
3079
|
const tree = useFloatingTree();
|
|
5443
|
-
index
|
|
3080
|
+
index(() => {
|
|
5444
3081
|
context.dataRef.current.orientation = orientation;
|
|
5445
3082
|
}, [context, orientation]);
|
|
5446
3083
|
const onNavigate = useEffectEvent(() => {
|
|
@@ -5456,10 +3093,10 @@ function useListNavigation(context, props) {
|
|
|
5456
3093
|
const previousOpenRef = React__namespace.useRef(open);
|
|
5457
3094
|
const forceSyncFocusRef = React__namespace.useRef(false);
|
|
5458
3095
|
const forceScrollIntoViewRef = React__namespace.useRef(false);
|
|
5459
|
-
const disabledIndicesRef = useLatestRef
|
|
5460
|
-
const latestOpenRef = useLatestRef
|
|
5461
|
-
const scrollItemIntoViewRef = useLatestRef
|
|
5462
|
-
const selectedIndexRef = useLatestRef
|
|
3096
|
+
const disabledIndicesRef = useLatestRef(disabledIndices);
|
|
3097
|
+
const latestOpenRef = useLatestRef(open);
|
|
3098
|
+
const scrollItemIntoViewRef = useLatestRef(scrollItemIntoView);
|
|
3099
|
+
const selectedIndexRef = useLatestRef(selectedIndex);
|
|
5463
3100
|
const [activeId, setActiveId] = React__namespace.useState();
|
|
5464
3101
|
const [virtualId, setVirtualId] = React__namespace.useState();
|
|
5465
3102
|
const focusItem = useEffectEvent(() => {
|
|
@@ -5508,7 +3145,7 @@ function useListNavigation(context, props) {
|
|
|
5508
3145
|
|
|
5509
3146
|
// Sync `selectedIndex` to be the `activeIndex` upon opening the floating
|
|
5510
3147
|
// element. Also, reset `activeIndex` upon closing the floating element.
|
|
5511
|
-
index
|
|
3148
|
+
index(() => {
|
|
5512
3149
|
if (!enabled) return;
|
|
5513
3150
|
if (open && elements.floating) {
|
|
5514
3151
|
if (focusItemOnOpenRef.current && selectedIndex != null) {
|
|
@@ -5529,7 +3166,7 @@ function useListNavigation(context, props) {
|
|
|
5529
3166
|
|
|
5530
3167
|
// Sync `activeIndex` to be the focused item while the floating element is
|
|
5531
3168
|
// open.
|
|
5532
|
-
index
|
|
3169
|
+
index(() => {
|
|
5533
3170
|
if (!enabled) return;
|
|
5534
3171
|
if (!open) return;
|
|
5535
3172
|
if (!elements.floating) return;
|
|
@@ -5575,7 +3212,7 @@ function useListNavigation(context, props) {
|
|
|
5575
3212
|
|
|
5576
3213
|
// Ensure the parent floating element has focus when a nested child closes
|
|
5577
3214
|
// to allow arrow key navigation to work after the pointer leaves the child.
|
|
5578
|
-
index
|
|
3215
|
+
index(() => {
|
|
5579
3216
|
var _nodes$find;
|
|
5580
3217
|
if (!enabled || elements.floating || !tree || virtual || !previousMountedRef.current) {
|
|
5581
3218
|
return;
|
|
@@ -5590,7 +3227,7 @@ function useListNavigation(context, props) {
|
|
|
5590
3227
|
});
|
|
5591
3228
|
}
|
|
5592
3229
|
}, [enabled, elements.floating, tree, parentId, virtual]);
|
|
5593
|
-
index
|
|
3230
|
+
index(() => {
|
|
5594
3231
|
if (!enabled) return;
|
|
5595
3232
|
if (!tree) return;
|
|
5596
3233
|
if (!virtual) return;
|
|
@@ -5606,12 +3243,12 @@ function useListNavigation(context, props) {
|
|
|
5606
3243
|
tree.events.off('virtualfocus', handleVirtualFocus);
|
|
5607
3244
|
};
|
|
5608
3245
|
}, [enabled, tree, virtual, parentId, virtualItemRef]);
|
|
5609
|
-
index
|
|
3246
|
+
index(() => {
|
|
5610
3247
|
previousOnNavigateRef.current = onNavigate;
|
|
5611
3248
|
previousOpenRef.current = open;
|
|
5612
3249
|
previousMountedRef.current = !!elements.floating;
|
|
5613
3250
|
});
|
|
5614
|
-
index
|
|
3251
|
+
index(() => {
|
|
5615
3252
|
if (!open) {
|
|
5616
3253
|
keyRef.current = null;
|
|
5617
3254
|
focusItemOnOpenRef.current = focusItemOnOpen;
|
|
@@ -5706,7 +3343,7 @@ function useListNavigation(context, props) {
|
|
|
5706
3343
|
stopEvent(event);
|
|
5707
3344
|
}
|
|
5708
3345
|
onOpenChange(false, event.nativeEvent, 'list-navigation');
|
|
5709
|
-
if (isHTMLElement(elements.domReference)) {
|
|
3346
|
+
if (floatingUi_utils.isHTMLElement(elements.domReference)) {
|
|
5710
3347
|
if (virtual) {
|
|
5711
3348
|
tree == null || tree.events.emit('virtualfocus', elements.domReference);
|
|
5712
3349
|
} else {
|
|
@@ -6089,7 +3726,7 @@ function useTransitionStatus(context, props) {
|
|
|
6089
3726
|
if (!isMounted && status === 'close') {
|
|
6090
3727
|
setStatus('unmounted');
|
|
6091
3728
|
}
|
|
6092
|
-
index
|
|
3729
|
+
index(() => {
|
|
6093
3730
|
if (!floating) return;
|
|
6094
3731
|
if (open) {
|
|
6095
3732
|
setStatus('initial');
|
|
@@ -6149,11 +3786,11 @@ function useTransitionStyles(context, props) {
|
|
|
6149
3786
|
} = useTransitionStatus(context, {
|
|
6150
3787
|
duration
|
|
6151
3788
|
});
|
|
6152
|
-
const initialRef = useLatestRef
|
|
6153
|
-
const openRef = useLatestRef
|
|
6154
|
-
const closeRef = useLatestRef
|
|
6155
|
-
const commonRef = useLatestRef
|
|
6156
|
-
index
|
|
3789
|
+
const initialRef = useLatestRef(unstable_initial);
|
|
3790
|
+
const openRef = useLatestRef(unstable_open);
|
|
3791
|
+
const closeRef = useLatestRef(unstable_close);
|
|
3792
|
+
const commonRef = useLatestRef(unstable_common);
|
|
3793
|
+
index(() => {
|
|
6157
3794
|
const initialStyles = execWithArgsOrReturn(initialRef.current, fnArgs);
|
|
6158
3795
|
const closeStyles = execWithArgsOrReturn(closeRef.current, fnArgs);
|
|
6159
3796
|
const commonStyles = execWithArgsOrReturn(commonRef.current, fnArgs);
|
|
@@ -6198,15 +3835,6 @@ exports.FloatingNode = FloatingNode;
|
|
|
6198
3835
|
exports.FloatingOverlay = FloatingOverlay;
|
|
6199
3836
|
exports.FloatingPortal = FloatingPortal;
|
|
6200
3837
|
exports.FloatingTree = FloatingTree;
|
|
6201
|
-
exports.arrow = arrow;
|
|
6202
|
-
exports.autoPlacement = autoPlacement;
|
|
6203
|
-
exports.autoUpdate = autoUpdate;
|
|
6204
|
-
exports.flip = flip;
|
|
6205
|
-
exports.hide = hide;
|
|
6206
|
-
exports.limitShift = limitShift;
|
|
6207
|
-
exports.offset = offset;
|
|
6208
|
-
exports.shift = shift;
|
|
6209
|
-
exports.size = size;
|
|
6210
3838
|
exports.useClick = useClick;
|
|
6211
3839
|
exports.useDismiss = useDismiss;
|
|
6212
3840
|
exports.useFloating = useFloating;
|