@arc-ui/components 11.24.2 → 11.26.0
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/Button/Button.cjs.js +1 -1
- package/dist/Button/Button.esm.js +1 -1
- package/dist/DatePicker/DatePicker.cjs.js +1276 -22
- package/dist/DatePicker/DatePicker.esm.js +1245 -10
- package/dist/InformationCard/InformationCard.cjs.js +1 -1
- package/dist/InformationCard/InformationCard.esm.js +1 -1
- package/dist/Modal/Modal.cjs.js +438 -225
- package/dist/Modal/Modal.esm.js +420 -225
- package/dist/PaginationSimple/PaginationSimple.cjs.js +23 -2
- package/dist/PaginationSimple/PaginationSimple.esm.js +23 -2
- package/dist/Select/Select.cjs.js +1514 -1065
- package/dist/Select/Select.esm.js +1496 -1066
- package/dist/SiteHeader/SiteHeader.cjs.js +2 -2
- package/dist/SiteHeader/SiteHeader.esm.js +2 -2
- package/dist/SiteHeaderV2/SiteHeaderV2.cjs.js +2 -2
- package/dist/SiteHeaderV2/SiteHeaderV2.esm.js +2 -2
- package/dist/Tabs/Tabs.cjs.js +4 -6
- package/dist/Tabs/Tabs.esm.js +4 -6
- package/dist/TextArea/TextArea.cjs.js +10 -13
- package/dist/TextArea/TextArea.esm.js +10 -13
- package/dist/Toast/Toast.cjs.js +4 -6
- package/dist/Toast/Toast.esm.js +4 -6
- package/dist/UniversalHeader/UniversalHeader.cjs.js +2 -2
- package/dist/UniversalHeader/UniversalHeader.esm.js +2 -2
- package/dist/_shared/cjs/{Button-6ba21d3b.js → Button-5b28f0ce.js} +3 -3
- package/dist/_shared/cjs/{SiteHeader.rehydrator-9d8f3dad.js → SiteHeader.rehydrator-8fa9d174.js} +1 -1
- package/dist/_shared/cjs/{SiteHeaderV2-ce1c8737.js → SiteHeaderV2-ca2f13a8.js} +1 -1
- package/dist/_shared/cjs/{Tabs-bc9fac46.js → Tabs-89455281.js} +19 -15
- package/dist/_shared/cjs/{Toast-26207fef.js → Toast-c760c89d.js} +32 -14
- package/dist/_shared/cjs/{UniversalHeader-b8389447.js → UniversalHeader-73e154eb.js} +6 -2
- package/dist/_shared/cjs/component-4979b2e7.js +409 -0
- package/dist/_shared/cjs/{index-77ab5c6a.js → floating-ui.react-dom-08b8b87c.js} +12 -284
- package/dist/_shared/cjs/index-1efbba95.js +1252 -0
- package/dist/_shared/cjs/{index-74004a9c.js → index-4edec793.js} +1 -1
- package/dist/_shared/cjs/{index-dd1d18ea.js → index-7641213c.js} +127 -2
- package/dist/_shared/cjs/{index-9f99d686.js → index-af744fa9.js} +1 -1
- package/dist/_shared/cjs/{index-6eb396a3.js → index-fb0cad18.js} +1 -1
- package/dist/_shared/esm/{Button-a7d134c6.js → Button-5b48b7ce.js} +3 -3
- package/dist/_shared/esm/{SiteHeader.rehydrator-2ec02ee7.js → SiteHeader.rehydrator-8f3c5d6e.js} +1 -1
- package/dist/_shared/esm/{SiteHeaderV2-a7c1b1cb.js → SiteHeaderV2-cb081752.js} +1 -1
- package/dist/_shared/esm/{Tabs-9485cab6.js → Tabs-959e885d.js} +10 -6
- package/dist/_shared/esm/{Toast-fcbfc194.js → Toast-a590067d.js} +25 -7
- package/dist/_shared/esm/{UniversalHeader-80c7313f.js → UniversalHeader-96bfbacc.js} +6 -2
- package/dist/_shared/esm/component-d7b471ff.js +382 -0
- package/dist/_shared/esm/{index-b84a20c6.js → floating-ui.react-dom-1bb71aae.js} +4 -281
- package/dist/_shared/esm/{index-7b531fa7.js → index-0ae23b06.js} +126 -2
- package/dist/_shared/esm/index-307f1bbc.js +1212 -0
- package/dist/_shared/esm/{index-044da8d0.js → index-9e54cc7d.js} +1 -1
- package/dist/_shared/esm/{index-efa9be1a.js → index-af7b6e55.js} +1 -1
- package/dist/_shared/esm/{index-2cfab9f2.js → index-ebe72f34.js} +1 -1
- package/dist/index.es.js +3608 -2938
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +3591 -2921
- package/dist/index.js.map +1 -1
- package/dist/styles.css +2 -2
- package/dist/types/components/Button/Button.d.ts +12 -0
- package/dist/types/components/PaginationSimple/PaginationSimple.d.ts +28 -0
- package/dist/types/components/UniversalHeader/UniversalHeader.d.ts +4 -0
- package/package.json +3 -3
- package/dist/_shared/cjs/Combination-9974f2e2.js +0 -1330
- package/dist/_shared/cjs/index-a31e64a9.js +0 -27
- package/dist/_shared/cjs/index-d38f1bd0.js +0 -131
- package/dist/_shared/cjs/index-dcfdd5da.js +0 -11
- package/dist/_shared/esm/Combination-e9f7e64e.js +0 -1301
- package/dist/_shared/esm/index-25a5b393.js +0 -25
- package/dist/_shared/esm/index-a624de47.js +0 -9
- package/dist/_shared/esm/index-ca72c9d5.js +0 -129
|
@@ -5,13 +5,14 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
5
5
|
var Calendar = require('../_shared/cjs/Calendar-b022545c.js');
|
|
6
6
|
var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
|
|
7
7
|
var React = require('react');
|
|
8
|
-
var index$
|
|
8
|
+
var index$3 = require('../_shared/cjs/index-9947ac13.js');
|
|
9
9
|
var _extends = require('../_shared/cjs/extends-8c5e4b48.js');
|
|
10
|
-
var index = require('../_shared/cjs/index-
|
|
11
|
-
var
|
|
12
|
-
var index$2 = require('../_shared/cjs/index-
|
|
13
|
-
var
|
|
14
|
-
var
|
|
10
|
+
var index = require('../_shared/cjs/index-7641213c.js');
|
|
11
|
+
var index$1 = require('../_shared/cjs/index-4edec793.js');
|
|
12
|
+
var index$2 = require('../_shared/cjs/index-fb0cad18.js');
|
|
13
|
+
var floatingUi_reactDom = require('../_shared/cjs/floating-ui.react-dom-08b8b87c.js');
|
|
14
|
+
var ReactDOM = require('react-dom');
|
|
15
|
+
var component = require('../_shared/cjs/component-4979b2e7.js');
|
|
15
16
|
var Base = require('../_shared/cjs/Base-4676f12e.js');
|
|
16
17
|
var TextInput = require('../_shared/cjs/TextInput-8d139489.js');
|
|
17
18
|
require('../_shared/cjs/use-media-query-e61881d8.js');
|
|
@@ -23,8 +24,6 @@ require('../_shared/cjs/Heading-27cba320.js');
|
|
|
23
24
|
require('../_shared/cjs/BtIconChevronLeftMid.esm-0aaa6770.js');
|
|
24
25
|
require('../_shared/cjs/BtIconChevronRightMid.esm-d01ebbd4.js');
|
|
25
26
|
require('../_shared/cjs/Icon-b46897a3.js');
|
|
26
|
-
require('react-dom');
|
|
27
|
-
require('../_shared/cjs/index-74004a9c.js');
|
|
28
27
|
require('../_shared/cjs/FormControl-68258ce1.js');
|
|
29
28
|
require('../_shared/cjs/BtIconAlert.esm-1a0ff9f0.js');
|
|
30
29
|
require('../_shared/cjs/DisclosureMini-09c749e5.js');
|
|
@@ -32,7 +31,27 @@ require('../_shared/cjs/BtIconChevronDown2Px.esm-39030ee0.js');
|
|
|
32
31
|
|
|
33
32
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
34
33
|
|
|
34
|
+
function _interopNamespace(e) {
|
|
35
|
+
if (e && e.__esModule) return e;
|
|
36
|
+
var n = Object.create(null);
|
|
37
|
+
if (e) {
|
|
38
|
+
Object.keys(e).forEach(function (k) {
|
|
39
|
+
if (k !== 'default') {
|
|
40
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
41
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
42
|
+
enumerable: true,
|
|
43
|
+
get: function () { return e[k]; }
|
|
44
|
+
});
|
|
45
|
+
}
|
|
46
|
+
});
|
|
47
|
+
}
|
|
48
|
+
n["default"] = e;
|
|
49
|
+
return Object.freeze(n);
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
35
53
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
54
|
+
var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
|
|
36
55
|
|
|
37
56
|
/**
|
|
38
57
|
* @name startOfDay
|
|
@@ -139,13 +158,1248 @@ var isRangeValid = function (value) {
|
|
|
139
158
|
|
|
140
159
|
var DATE_FORMAT = "dd/MM/yyyy";
|
|
141
160
|
|
|
161
|
+
const $5cb92bef7577960e$var$CONTEXT_UPDATE = 'dismissableLayer.update';
|
|
162
|
+
const $5cb92bef7577960e$var$POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';
|
|
163
|
+
const $5cb92bef7577960e$var$FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';
|
|
164
|
+
let $5cb92bef7577960e$var$originalBodyPointerEvents;
|
|
165
|
+
const $5cb92bef7577960e$var$DismissableLayerContext = /*#__PURE__*/ React.createContext({
|
|
166
|
+
layers: new Set(),
|
|
167
|
+
layersWithOutsidePointerEventsDisabled: new Set(),
|
|
168
|
+
branches: new Set()
|
|
169
|
+
});
|
|
170
|
+
const $5cb92bef7577960e$export$177fb62ff3ec1f22 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
|
|
171
|
+
var _node$ownerDocument;
|
|
172
|
+
const { disableOutsidePointerEvents: disableOutsidePointerEvents = false , onEscapeKeyDown: onEscapeKeyDown , onPointerDownOutside: onPointerDownOutside , onFocusOutside: onFocusOutside , onInteractOutside: onInteractOutside , onDismiss: onDismiss , ...layerProps } = props;
|
|
173
|
+
const context = React.useContext($5cb92bef7577960e$var$DismissableLayerContext);
|
|
174
|
+
const [node1, setNode] = React.useState(null);
|
|
175
|
+
const ownerDocument = (_node$ownerDocument = node1 === null || node1 === void 0 ? void 0 : node1.ownerDocument) !== null && _node$ownerDocument !== void 0 ? _node$ownerDocument : globalThis === null || globalThis === void 0 ? void 0 : globalThis.document;
|
|
176
|
+
const [, force] = React.useState({});
|
|
177
|
+
const composedRefs = index.$6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setNode(node)
|
|
178
|
+
);
|
|
179
|
+
const layers = Array.from(context.layers);
|
|
180
|
+
const [highestLayerWithOutsidePointerEventsDisabled] = [
|
|
181
|
+
...context.layersWithOutsidePointerEventsDisabled
|
|
182
|
+
].slice(-1); // prettier-ignore
|
|
183
|
+
const highestLayerWithOutsidePointerEventsDisabledIndex = layers.indexOf(highestLayerWithOutsidePointerEventsDisabled); // prettier-ignore
|
|
184
|
+
const index$2 = node1 ? layers.indexOf(node1) : -1;
|
|
185
|
+
const isBodyPointerEventsDisabled = context.layersWithOutsidePointerEventsDisabled.size > 0;
|
|
186
|
+
const isPointerEventsEnabled = index$2 >= highestLayerWithOutsidePointerEventsDisabledIndex;
|
|
187
|
+
const pointerDownOutside = $5cb92bef7577960e$var$usePointerDownOutside((event)=>{
|
|
188
|
+
const target = event.target;
|
|
189
|
+
const isPointerDownOnBranch = [
|
|
190
|
+
...context.branches
|
|
191
|
+
].some((branch)=>branch.contains(target)
|
|
192
|
+
);
|
|
193
|
+
if (!isPointerEventsEnabled || isPointerDownOnBranch) return;
|
|
194
|
+
onPointerDownOutside === null || onPointerDownOutside === void 0 || onPointerDownOutside(event);
|
|
195
|
+
onInteractOutside === null || onInteractOutside === void 0 || onInteractOutside(event);
|
|
196
|
+
if (!event.defaultPrevented) onDismiss === null || onDismiss === void 0 || onDismiss();
|
|
197
|
+
}, ownerDocument);
|
|
198
|
+
const focusOutside = $5cb92bef7577960e$var$useFocusOutside((event)=>{
|
|
199
|
+
const target = event.target;
|
|
200
|
+
const isFocusInBranch = [
|
|
201
|
+
...context.branches
|
|
202
|
+
].some((branch)=>branch.contains(target)
|
|
203
|
+
);
|
|
204
|
+
if (isFocusInBranch) return;
|
|
205
|
+
onFocusOutside === null || onFocusOutside === void 0 || onFocusOutside(event);
|
|
206
|
+
onInteractOutside === null || onInteractOutside === void 0 || onInteractOutside(event);
|
|
207
|
+
if (!event.defaultPrevented) onDismiss === null || onDismiss === void 0 || onDismiss();
|
|
208
|
+
}, ownerDocument);
|
|
209
|
+
index$1.$addc16e1bbe58fd0$export$3a72a57244d6e765((event)=>{
|
|
210
|
+
const isHighestLayer = index$2 === context.layers.size - 1;
|
|
211
|
+
if (!isHighestLayer) return;
|
|
212
|
+
onEscapeKeyDown === null || onEscapeKeyDown === void 0 || onEscapeKeyDown(event);
|
|
213
|
+
if (!event.defaultPrevented && onDismiss) {
|
|
214
|
+
event.preventDefault();
|
|
215
|
+
onDismiss();
|
|
216
|
+
}
|
|
217
|
+
}, ownerDocument);
|
|
218
|
+
React.useEffect(()=>{
|
|
219
|
+
if (!node1) return;
|
|
220
|
+
if (disableOutsidePointerEvents) {
|
|
221
|
+
if (context.layersWithOutsidePointerEventsDisabled.size === 0) {
|
|
222
|
+
$5cb92bef7577960e$var$originalBodyPointerEvents = ownerDocument.body.style.pointerEvents;
|
|
223
|
+
ownerDocument.body.style.pointerEvents = 'none';
|
|
224
|
+
}
|
|
225
|
+
context.layersWithOutsidePointerEventsDisabled.add(node1);
|
|
226
|
+
}
|
|
227
|
+
context.layers.add(node1);
|
|
228
|
+
$5cb92bef7577960e$var$dispatchUpdate();
|
|
229
|
+
return ()=>{
|
|
230
|
+
if (disableOutsidePointerEvents && context.layersWithOutsidePointerEventsDisabled.size === 1) ownerDocument.body.style.pointerEvents = $5cb92bef7577960e$var$originalBodyPointerEvents;
|
|
231
|
+
};
|
|
232
|
+
}, [
|
|
233
|
+
node1,
|
|
234
|
+
ownerDocument,
|
|
235
|
+
disableOutsidePointerEvents,
|
|
236
|
+
context
|
|
237
|
+
]);
|
|
238
|
+
/**
|
|
239
|
+
* We purposefully prevent combining this effect with the `disableOutsidePointerEvents` effect
|
|
240
|
+
* because a change to `disableOutsidePointerEvents` would remove this layer from the stack
|
|
241
|
+
* and add it to the end again so the layering order wouldn't be _creation order_.
|
|
242
|
+
* We only want them to be removed from context stacks when unmounted.
|
|
243
|
+
*/ React.useEffect(()=>{
|
|
244
|
+
return ()=>{
|
|
245
|
+
if (!node1) return;
|
|
246
|
+
context.layers.delete(node1);
|
|
247
|
+
context.layersWithOutsidePointerEventsDisabled.delete(node1);
|
|
248
|
+
$5cb92bef7577960e$var$dispatchUpdate();
|
|
249
|
+
};
|
|
250
|
+
}, [
|
|
251
|
+
node1,
|
|
252
|
+
context
|
|
253
|
+
]);
|
|
254
|
+
React.useEffect(()=>{
|
|
255
|
+
const handleUpdate = ()=>force({})
|
|
256
|
+
;
|
|
257
|
+
document.addEventListener($5cb92bef7577960e$var$CONTEXT_UPDATE, handleUpdate);
|
|
258
|
+
return ()=>document.removeEventListener($5cb92bef7577960e$var$CONTEXT_UPDATE, handleUpdate)
|
|
259
|
+
;
|
|
260
|
+
}, []);
|
|
261
|
+
return /*#__PURE__*/ React.createElement(index.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({}, layerProps, {
|
|
262
|
+
ref: composedRefs,
|
|
263
|
+
style: {
|
|
264
|
+
pointerEvents: isBodyPointerEventsDisabled ? isPointerEventsEnabled ? 'auto' : 'none' : undefined,
|
|
265
|
+
...props.style
|
|
266
|
+
},
|
|
267
|
+
onFocusCapture: index.$e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onFocusCapture, focusOutside.onFocusCapture),
|
|
268
|
+
onBlurCapture: index.$e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onBlurCapture, focusOutside.onBlurCapture),
|
|
269
|
+
onPointerDownCapture: index.$e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerDownCapture, pointerDownOutside.onPointerDownCapture)
|
|
270
|
+
}));
|
|
271
|
+
});
|
|
272
|
+
/* -----------------------------------------------------------------------------------------------*/ /**
|
|
273
|
+
* Listens for `pointerdown` outside a react subtree. We use `pointerdown` rather than `pointerup`
|
|
274
|
+
* to mimic layer dismissing behaviour present in OS.
|
|
275
|
+
* Returns props to pass to the node we want to check for outside events.
|
|
276
|
+
*/ function $5cb92bef7577960e$var$usePointerDownOutside(onPointerDownOutside, ownerDocument = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) {
|
|
277
|
+
const handlePointerDownOutside = index.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onPointerDownOutside);
|
|
278
|
+
const isPointerInsideReactTreeRef = React.useRef(false);
|
|
279
|
+
const handleClickRef = React.useRef(()=>{});
|
|
280
|
+
React.useEffect(()=>{
|
|
281
|
+
const handlePointerDown = (event)=>{
|
|
282
|
+
if (event.target && !isPointerInsideReactTreeRef.current) {
|
|
283
|
+
const eventDetail = {
|
|
284
|
+
originalEvent: event
|
|
285
|
+
};
|
|
286
|
+
function handleAndDispatchPointerDownOutsideEvent() {
|
|
287
|
+
$5cb92bef7577960e$var$handleAndDispatchCustomEvent($5cb92bef7577960e$var$POINTER_DOWN_OUTSIDE, handlePointerDownOutside, eventDetail, {
|
|
288
|
+
discrete: true
|
|
289
|
+
});
|
|
290
|
+
}
|
|
291
|
+
/**
|
|
292
|
+
* On touch devices, we need to wait for a click event because browsers implement
|
|
293
|
+
* a ~350ms delay between the time the user stops touching the display and when the
|
|
294
|
+
* browser executres events. We need to ensure we don't reactivate pointer-events within
|
|
295
|
+
* this timeframe otherwise the browser may execute events that should have been prevented.
|
|
296
|
+
*
|
|
297
|
+
* Additionally, this also lets us deal automatically with cancellations when a click event
|
|
298
|
+
* isn't raised because the page was considered scrolled/drag-scrolled, long-pressed, etc.
|
|
299
|
+
*
|
|
300
|
+
* This is why we also continuously remove the previous listener, because we cannot be
|
|
301
|
+
* certain that it was raised, and therefore cleaned-up.
|
|
302
|
+
*/ if (event.pointerType === 'touch') {
|
|
303
|
+
ownerDocument.removeEventListener('click', handleClickRef.current);
|
|
304
|
+
handleClickRef.current = handleAndDispatchPointerDownOutsideEvent;
|
|
305
|
+
ownerDocument.addEventListener('click', handleClickRef.current, {
|
|
306
|
+
once: true
|
|
307
|
+
});
|
|
308
|
+
} else handleAndDispatchPointerDownOutsideEvent();
|
|
309
|
+
} else // We need to remove the event listener in case the outside click has been canceled.
|
|
310
|
+
// See: https://github.com/radix-ui/primitives/issues/2171
|
|
311
|
+
ownerDocument.removeEventListener('click', handleClickRef.current);
|
|
312
|
+
isPointerInsideReactTreeRef.current = false;
|
|
313
|
+
};
|
|
314
|
+
/**
|
|
315
|
+
* if this hook executes in a component that mounts via a `pointerdown` event, the event
|
|
316
|
+
* would bubble up to the document and trigger a `pointerDownOutside` event. We avoid
|
|
317
|
+
* this by delaying the event listener registration on the document.
|
|
318
|
+
* This is not React specific, but rather how the DOM works, ie:
|
|
319
|
+
* ```
|
|
320
|
+
* button.addEventListener('pointerdown', () => {
|
|
321
|
+
* console.log('I will log');
|
|
322
|
+
* document.addEventListener('pointerdown', () => {
|
|
323
|
+
* console.log('I will also log');
|
|
324
|
+
* })
|
|
325
|
+
* });
|
|
326
|
+
*/ const timerId = window.setTimeout(()=>{
|
|
327
|
+
ownerDocument.addEventListener('pointerdown', handlePointerDown);
|
|
328
|
+
}, 0);
|
|
329
|
+
return ()=>{
|
|
330
|
+
window.clearTimeout(timerId);
|
|
331
|
+
ownerDocument.removeEventListener('pointerdown', handlePointerDown);
|
|
332
|
+
ownerDocument.removeEventListener('click', handleClickRef.current);
|
|
333
|
+
};
|
|
334
|
+
}, [
|
|
335
|
+
ownerDocument,
|
|
336
|
+
handlePointerDownOutside
|
|
337
|
+
]);
|
|
338
|
+
return {
|
|
339
|
+
// ensures we check React component tree (not just DOM tree)
|
|
340
|
+
onPointerDownCapture: ()=>isPointerInsideReactTreeRef.current = true
|
|
341
|
+
};
|
|
342
|
+
}
|
|
343
|
+
/**
|
|
344
|
+
* Listens for when focus happens outside a react subtree.
|
|
345
|
+
* Returns props to pass to the root (node) of the subtree we want to check.
|
|
346
|
+
*/ function $5cb92bef7577960e$var$useFocusOutside(onFocusOutside, ownerDocument = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) {
|
|
347
|
+
const handleFocusOutside = index.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onFocusOutside);
|
|
348
|
+
const isFocusInsideReactTreeRef = React.useRef(false);
|
|
349
|
+
React.useEffect(()=>{
|
|
350
|
+
const handleFocus = (event)=>{
|
|
351
|
+
if (event.target && !isFocusInsideReactTreeRef.current) {
|
|
352
|
+
const eventDetail = {
|
|
353
|
+
originalEvent: event
|
|
354
|
+
};
|
|
355
|
+
$5cb92bef7577960e$var$handleAndDispatchCustomEvent($5cb92bef7577960e$var$FOCUS_OUTSIDE, handleFocusOutside, eventDetail, {
|
|
356
|
+
discrete: false
|
|
357
|
+
});
|
|
358
|
+
}
|
|
359
|
+
};
|
|
360
|
+
ownerDocument.addEventListener('focusin', handleFocus);
|
|
361
|
+
return ()=>ownerDocument.removeEventListener('focusin', handleFocus)
|
|
362
|
+
;
|
|
363
|
+
}, [
|
|
364
|
+
ownerDocument,
|
|
365
|
+
handleFocusOutside
|
|
366
|
+
]);
|
|
367
|
+
return {
|
|
368
|
+
onFocusCapture: ()=>isFocusInsideReactTreeRef.current = true
|
|
369
|
+
,
|
|
370
|
+
onBlurCapture: ()=>isFocusInsideReactTreeRef.current = false
|
|
371
|
+
};
|
|
372
|
+
}
|
|
373
|
+
function $5cb92bef7577960e$var$dispatchUpdate() {
|
|
374
|
+
const event = new CustomEvent($5cb92bef7577960e$var$CONTEXT_UPDATE);
|
|
375
|
+
document.dispatchEvent(event);
|
|
376
|
+
}
|
|
377
|
+
function $5cb92bef7577960e$var$handleAndDispatchCustomEvent(name, handler, detail, { discrete: discrete }) {
|
|
378
|
+
const target = detail.originalEvent.target;
|
|
379
|
+
const event = new CustomEvent(name, {
|
|
380
|
+
bubbles: false,
|
|
381
|
+
cancelable: true,
|
|
382
|
+
detail: detail
|
|
383
|
+
});
|
|
384
|
+
if (handler) target.addEventListener(name, handler, {
|
|
385
|
+
once: true
|
|
386
|
+
});
|
|
387
|
+
if (discrete) index.$8927f6f2acc4f386$export$6d1a0317bde7de7f(target, event);
|
|
388
|
+
else target.dispatchEvent(event);
|
|
389
|
+
}
|
|
390
|
+
|
|
391
|
+
/** Number of components which have requested interest to have focus guards */ let $3db38b7d1fb3fe6a$var$count = 0;
|
|
392
|
+
/**
|
|
393
|
+
* Injects a pair of focus guards at the edges of the whole DOM tree
|
|
394
|
+
* to ensure `focusin` & `focusout` events can be caught consistently.
|
|
395
|
+
*/ function $3db38b7d1fb3fe6a$export$b7ece24a22aeda8c() {
|
|
396
|
+
React.useEffect(()=>{
|
|
397
|
+
var _edgeGuards$, _edgeGuards$2;
|
|
398
|
+
const edgeGuards = document.querySelectorAll('[data-radix-focus-guard]');
|
|
399
|
+
document.body.insertAdjacentElement('afterbegin', (_edgeGuards$ = edgeGuards[0]) !== null && _edgeGuards$ !== void 0 ? _edgeGuards$ : $3db38b7d1fb3fe6a$var$createFocusGuard());
|
|
400
|
+
document.body.insertAdjacentElement('beforeend', (_edgeGuards$2 = edgeGuards[1]) !== null && _edgeGuards$2 !== void 0 ? _edgeGuards$2 : $3db38b7d1fb3fe6a$var$createFocusGuard());
|
|
401
|
+
$3db38b7d1fb3fe6a$var$count++;
|
|
402
|
+
return ()=>{
|
|
403
|
+
if ($3db38b7d1fb3fe6a$var$count === 1) document.querySelectorAll('[data-radix-focus-guard]').forEach((node)=>node.remove()
|
|
404
|
+
);
|
|
405
|
+
$3db38b7d1fb3fe6a$var$count--;
|
|
406
|
+
};
|
|
407
|
+
}, []);
|
|
408
|
+
}
|
|
409
|
+
function $3db38b7d1fb3fe6a$var$createFocusGuard() {
|
|
410
|
+
const element = document.createElement('span');
|
|
411
|
+
element.setAttribute('data-radix-focus-guard', '');
|
|
412
|
+
element.tabIndex = 0;
|
|
413
|
+
element.style.cssText = 'outline: none; opacity: 0; position: fixed; pointer-events: none';
|
|
414
|
+
return element;
|
|
415
|
+
}
|
|
416
|
+
|
|
417
|
+
const $d3863c46a17e8a28$var$AUTOFOCUS_ON_MOUNT = 'focusScope.autoFocusOnMount';
|
|
418
|
+
const $d3863c46a17e8a28$var$AUTOFOCUS_ON_UNMOUNT = 'focusScope.autoFocusOnUnmount';
|
|
419
|
+
const $d3863c46a17e8a28$var$EVENT_OPTIONS = {
|
|
420
|
+
bubbles: false,
|
|
421
|
+
cancelable: true
|
|
422
|
+
};
|
|
423
|
+
const $d3863c46a17e8a28$export$20e40289641fbbb6 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
|
|
424
|
+
const { loop: loop = false , trapped: trapped = false , onMountAutoFocus: onMountAutoFocusProp , onUnmountAutoFocus: onUnmountAutoFocusProp , ...scopeProps } = props;
|
|
425
|
+
const [container1, setContainer] = React.useState(null);
|
|
426
|
+
const onMountAutoFocus = index.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onMountAutoFocusProp);
|
|
427
|
+
const onUnmountAutoFocus = index.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onUnmountAutoFocusProp);
|
|
428
|
+
const lastFocusedElementRef = React.useRef(null);
|
|
429
|
+
const composedRefs = index.$6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setContainer(node)
|
|
430
|
+
);
|
|
431
|
+
const focusScope = React.useRef({
|
|
432
|
+
paused: false,
|
|
433
|
+
pause () {
|
|
434
|
+
this.paused = true;
|
|
435
|
+
},
|
|
436
|
+
resume () {
|
|
437
|
+
this.paused = false;
|
|
438
|
+
}
|
|
439
|
+
}).current; // Takes care of trapping focus if focus is moved outside programmatically for example
|
|
440
|
+
React.useEffect(()=>{
|
|
441
|
+
if (trapped) {
|
|
442
|
+
function handleFocusIn(event) {
|
|
443
|
+
if (focusScope.paused || !container1) return;
|
|
444
|
+
const target = event.target;
|
|
445
|
+
if (container1.contains(target)) lastFocusedElementRef.current = target;
|
|
446
|
+
else $d3863c46a17e8a28$var$focus(lastFocusedElementRef.current, {
|
|
447
|
+
select: true
|
|
448
|
+
});
|
|
449
|
+
}
|
|
450
|
+
function handleFocusOut(event) {
|
|
451
|
+
if (focusScope.paused || !container1) return;
|
|
452
|
+
const relatedTarget = event.relatedTarget; // A `focusout` event with a `null` `relatedTarget` will happen in at least two cases:
|
|
453
|
+
//
|
|
454
|
+
// 1. When the user switches app/tabs/windows/the browser itself loses focus.
|
|
455
|
+
// 2. In Google Chrome, when the focused element is removed from the DOM.
|
|
456
|
+
//
|
|
457
|
+
// We let the browser do its thing here because:
|
|
458
|
+
//
|
|
459
|
+
// 1. The browser already keeps a memory of what's focused for when the page gets refocused.
|
|
460
|
+
// 2. In Google Chrome, if we try to focus the deleted focused element (as per below), it
|
|
461
|
+
// throws the CPU to 100%, so we avoid doing anything for this reason here too.
|
|
462
|
+
if (relatedTarget === null) return; // If the focus has moved to an actual legitimate element (`relatedTarget !== null`)
|
|
463
|
+
// that is outside the container, we move focus to the last valid focused element inside.
|
|
464
|
+
if (!container1.contains(relatedTarget)) $d3863c46a17e8a28$var$focus(lastFocusedElementRef.current, {
|
|
465
|
+
select: true
|
|
466
|
+
});
|
|
467
|
+
} // When the focused element gets removed from the DOM, browsers move focus
|
|
468
|
+
// back to the document.body. In this case, we move focus to the container
|
|
469
|
+
// to keep focus trapped correctly.
|
|
470
|
+
function handleMutations(mutations) {
|
|
471
|
+
const focusedElement = document.activeElement;
|
|
472
|
+
if (focusedElement !== document.body) return;
|
|
473
|
+
for (const mutation of mutations)if (mutation.removedNodes.length > 0) $d3863c46a17e8a28$var$focus(container1);
|
|
474
|
+
}
|
|
475
|
+
document.addEventListener('focusin', handleFocusIn);
|
|
476
|
+
document.addEventListener('focusout', handleFocusOut);
|
|
477
|
+
const mutationObserver = new MutationObserver(handleMutations);
|
|
478
|
+
if (container1) mutationObserver.observe(container1, {
|
|
479
|
+
childList: true,
|
|
480
|
+
subtree: true
|
|
481
|
+
});
|
|
482
|
+
return ()=>{
|
|
483
|
+
document.removeEventListener('focusin', handleFocusIn);
|
|
484
|
+
document.removeEventListener('focusout', handleFocusOut);
|
|
485
|
+
mutationObserver.disconnect();
|
|
486
|
+
};
|
|
487
|
+
}
|
|
488
|
+
}, [
|
|
489
|
+
trapped,
|
|
490
|
+
container1,
|
|
491
|
+
focusScope.paused
|
|
492
|
+
]);
|
|
493
|
+
React.useEffect(()=>{
|
|
494
|
+
if (container1) {
|
|
495
|
+
$d3863c46a17e8a28$var$focusScopesStack.add(focusScope);
|
|
496
|
+
const previouslyFocusedElement = document.activeElement;
|
|
497
|
+
const hasFocusedCandidate = container1.contains(previouslyFocusedElement);
|
|
498
|
+
if (!hasFocusedCandidate) {
|
|
499
|
+
const mountEvent = new CustomEvent($d3863c46a17e8a28$var$AUTOFOCUS_ON_MOUNT, $d3863c46a17e8a28$var$EVENT_OPTIONS);
|
|
500
|
+
container1.addEventListener($d3863c46a17e8a28$var$AUTOFOCUS_ON_MOUNT, onMountAutoFocus);
|
|
501
|
+
container1.dispatchEvent(mountEvent);
|
|
502
|
+
if (!mountEvent.defaultPrevented) {
|
|
503
|
+
$d3863c46a17e8a28$var$focusFirst($d3863c46a17e8a28$var$removeLinks($d3863c46a17e8a28$var$getTabbableCandidates(container1)), {
|
|
504
|
+
select: true
|
|
505
|
+
});
|
|
506
|
+
if (document.activeElement === previouslyFocusedElement) $d3863c46a17e8a28$var$focus(container1);
|
|
507
|
+
}
|
|
508
|
+
}
|
|
509
|
+
return ()=>{
|
|
510
|
+
container1.removeEventListener($d3863c46a17e8a28$var$AUTOFOCUS_ON_MOUNT, onMountAutoFocus); // We hit a react bug (fixed in v17) with focusing in unmount.
|
|
511
|
+
// We need to delay the focus a little to get around it for now.
|
|
512
|
+
// See: https://github.com/facebook/react/issues/17894
|
|
513
|
+
setTimeout(()=>{
|
|
514
|
+
const unmountEvent = new CustomEvent($d3863c46a17e8a28$var$AUTOFOCUS_ON_UNMOUNT, $d3863c46a17e8a28$var$EVENT_OPTIONS);
|
|
515
|
+
container1.addEventListener($d3863c46a17e8a28$var$AUTOFOCUS_ON_UNMOUNT, onUnmountAutoFocus);
|
|
516
|
+
container1.dispatchEvent(unmountEvent);
|
|
517
|
+
if (!unmountEvent.defaultPrevented) $d3863c46a17e8a28$var$focus(previouslyFocusedElement !== null && previouslyFocusedElement !== void 0 ? previouslyFocusedElement : document.body, {
|
|
518
|
+
select: true
|
|
519
|
+
});
|
|
520
|
+
// we need to remove the listener after we `dispatchEvent`
|
|
521
|
+
container1.removeEventListener($d3863c46a17e8a28$var$AUTOFOCUS_ON_UNMOUNT, onUnmountAutoFocus);
|
|
522
|
+
$d3863c46a17e8a28$var$focusScopesStack.remove(focusScope);
|
|
523
|
+
}, 0);
|
|
524
|
+
};
|
|
525
|
+
}
|
|
526
|
+
}, [
|
|
527
|
+
container1,
|
|
528
|
+
onMountAutoFocus,
|
|
529
|
+
onUnmountAutoFocus,
|
|
530
|
+
focusScope
|
|
531
|
+
]); // Takes care of looping focus (when tabbing whilst at the edges)
|
|
532
|
+
const handleKeyDown = React.useCallback((event)=>{
|
|
533
|
+
if (!loop && !trapped) return;
|
|
534
|
+
if (focusScope.paused) return;
|
|
535
|
+
const isTabKey = event.key === 'Tab' && !event.altKey && !event.ctrlKey && !event.metaKey;
|
|
536
|
+
const focusedElement = document.activeElement;
|
|
537
|
+
if (isTabKey && focusedElement) {
|
|
538
|
+
const container = event.currentTarget;
|
|
539
|
+
const [first, last] = $d3863c46a17e8a28$var$getTabbableEdges(container);
|
|
540
|
+
const hasTabbableElementsInside = first && last; // we can only wrap focus if we have tabbable edges
|
|
541
|
+
if (!hasTabbableElementsInside) {
|
|
542
|
+
if (focusedElement === container) event.preventDefault();
|
|
543
|
+
} else {
|
|
544
|
+
if (!event.shiftKey && focusedElement === last) {
|
|
545
|
+
event.preventDefault();
|
|
546
|
+
if (loop) $d3863c46a17e8a28$var$focus(first, {
|
|
547
|
+
select: true
|
|
548
|
+
});
|
|
549
|
+
} else if (event.shiftKey && focusedElement === first) {
|
|
550
|
+
event.preventDefault();
|
|
551
|
+
if (loop) $d3863c46a17e8a28$var$focus(last, {
|
|
552
|
+
select: true
|
|
553
|
+
});
|
|
554
|
+
}
|
|
555
|
+
}
|
|
556
|
+
}
|
|
557
|
+
}, [
|
|
558
|
+
loop,
|
|
559
|
+
trapped,
|
|
560
|
+
focusScope.paused
|
|
561
|
+
]);
|
|
562
|
+
return /*#__PURE__*/ React.createElement(index.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({
|
|
563
|
+
tabIndex: -1
|
|
564
|
+
}, scopeProps, {
|
|
565
|
+
ref: composedRefs,
|
|
566
|
+
onKeyDown: handleKeyDown
|
|
567
|
+
}));
|
|
568
|
+
});
|
|
569
|
+
/* -------------------------------------------------------------------------------------------------
|
|
570
|
+
* Utils
|
|
571
|
+
* -----------------------------------------------------------------------------------------------*/ /**
|
|
572
|
+
* Attempts focusing the first element in a list of candidates.
|
|
573
|
+
* Stops when focus has actually moved.
|
|
574
|
+
*/ function $d3863c46a17e8a28$var$focusFirst(candidates, { select: select = false } = {}) {
|
|
575
|
+
const previouslyFocusedElement = document.activeElement;
|
|
576
|
+
for (const candidate of candidates){
|
|
577
|
+
$d3863c46a17e8a28$var$focus(candidate, {
|
|
578
|
+
select: select
|
|
579
|
+
});
|
|
580
|
+
if (document.activeElement !== previouslyFocusedElement) return;
|
|
581
|
+
}
|
|
582
|
+
}
|
|
583
|
+
/**
|
|
584
|
+
* Returns the first and last tabbable elements inside a container.
|
|
585
|
+
*/ function $d3863c46a17e8a28$var$getTabbableEdges(container) {
|
|
586
|
+
const candidates = $d3863c46a17e8a28$var$getTabbableCandidates(container);
|
|
587
|
+
const first = $d3863c46a17e8a28$var$findVisible(candidates, container);
|
|
588
|
+
const last = $d3863c46a17e8a28$var$findVisible(candidates.reverse(), container);
|
|
589
|
+
return [
|
|
590
|
+
first,
|
|
591
|
+
last
|
|
592
|
+
];
|
|
593
|
+
}
|
|
594
|
+
/**
|
|
595
|
+
* Returns a list of potential tabbable candidates.
|
|
596
|
+
*
|
|
597
|
+
* NOTE: This is only a close approximation. For example it doesn't take into account cases like when
|
|
598
|
+
* elements are not visible. This cannot be worked out easily by just reading a property, but rather
|
|
599
|
+
* necessitate runtime knowledge (computed styles, etc). We deal with these cases separately.
|
|
600
|
+
*
|
|
601
|
+
* See: https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker
|
|
602
|
+
* Credit: https://github.com/discord/focus-layers/blob/master/src/util/wrapFocus.tsx#L1
|
|
603
|
+
*/ function $d3863c46a17e8a28$var$getTabbableCandidates(container) {
|
|
604
|
+
const nodes = [];
|
|
605
|
+
const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
|
|
606
|
+
acceptNode: (node)=>{
|
|
607
|
+
const isHiddenInput = node.tagName === 'INPUT' && node.type === 'hidden';
|
|
608
|
+
if (node.disabled || node.hidden || isHiddenInput) return NodeFilter.FILTER_SKIP; // `.tabIndex` is not the same as the `tabindex` attribute. It works on the
|
|
609
|
+
// runtime's understanding of tabbability, so this automatically accounts
|
|
610
|
+
// for any kind of element that could be tabbed to.
|
|
611
|
+
return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
|
|
612
|
+
}
|
|
613
|
+
});
|
|
614
|
+
while(walker.nextNode())nodes.push(walker.currentNode); // we do not take into account the order of nodes with positive `tabIndex` as it
|
|
615
|
+
// hinders accessibility to have tab order different from visual order.
|
|
616
|
+
return nodes;
|
|
617
|
+
}
|
|
618
|
+
/**
|
|
619
|
+
* Returns the first visible element in a list.
|
|
620
|
+
* NOTE: Only checks visibility up to the `container`.
|
|
621
|
+
*/ function $d3863c46a17e8a28$var$findVisible(elements, container) {
|
|
622
|
+
for (const element of elements){
|
|
623
|
+
// we stop checking if it's hidden at the `container` level (excluding)
|
|
624
|
+
if (!$d3863c46a17e8a28$var$isHidden(element, {
|
|
625
|
+
upTo: container
|
|
626
|
+
})) return element;
|
|
627
|
+
}
|
|
628
|
+
}
|
|
629
|
+
function $d3863c46a17e8a28$var$isHidden(node, { upTo: upTo }) {
|
|
630
|
+
if (getComputedStyle(node).visibility === 'hidden') return true;
|
|
631
|
+
while(node){
|
|
632
|
+
// we stop at `upTo` (excluding it)
|
|
633
|
+
if (upTo !== undefined && node === upTo) return false;
|
|
634
|
+
if (getComputedStyle(node).display === 'none') return true;
|
|
635
|
+
node = node.parentElement;
|
|
636
|
+
}
|
|
637
|
+
return false;
|
|
638
|
+
}
|
|
639
|
+
function $d3863c46a17e8a28$var$isSelectableInput(element) {
|
|
640
|
+
return element instanceof HTMLInputElement && 'select' in element;
|
|
641
|
+
}
|
|
642
|
+
function $d3863c46a17e8a28$var$focus(element, { select: select = false } = {}) {
|
|
643
|
+
// only focus if that element is focusable
|
|
644
|
+
if (element && element.focus) {
|
|
645
|
+
const previouslyFocusedElement = document.activeElement; // NOTE: we prevent scrolling on focus, to minimize jarring transitions for users
|
|
646
|
+
element.focus({
|
|
647
|
+
preventScroll: true
|
|
648
|
+
}); // only select if its not the same element, it supports selection and we need to select
|
|
649
|
+
if (element !== previouslyFocusedElement && $d3863c46a17e8a28$var$isSelectableInput(element) && select) element.select();
|
|
650
|
+
}
|
|
651
|
+
}
|
|
652
|
+
/* -------------------------------------------------------------------------------------------------
|
|
653
|
+
* FocusScope stack
|
|
654
|
+
* -----------------------------------------------------------------------------------------------*/ const $d3863c46a17e8a28$var$focusScopesStack = $d3863c46a17e8a28$var$createFocusScopesStack();
|
|
655
|
+
function $d3863c46a17e8a28$var$createFocusScopesStack() {
|
|
656
|
+
/** A stack of focus scopes, with the active one at the top */ let stack = [];
|
|
657
|
+
return {
|
|
658
|
+
add (focusScope) {
|
|
659
|
+
// pause the currently active focus scope (at the top of the stack)
|
|
660
|
+
const activeFocusScope = stack[0];
|
|
661
|
+
if (focusScope !== activeFocusScope) activeFocusScope === null || activeFocusScope === void 0 || activeFocusScope.pause();
|
|
662
|
+
// remove in case it already exists (because we'll re-add it at the top of the stack)
|
|
663
|
+
stack = $d3863c46a17e8a28$var$arrayRemove(stack, focusScope);
|
|
664
|
+
stack.unshift(focusScope);
|
|
665
|
+
},
|
|
666
|
+
remove (focusScope) {
|
|
667
|
+
var _stack$;
|
|
668
|
+
stack = $d3863c46a17e8a28$var$arrayRemove(stack, focusScope);
|
|
669
|
+
(_stack$ = stack[0]) === null || _stack$ === void 0 || _stack$.resume();
|
|
670
|
+
}
|
|
671
|
+
};
|
|
672
|
+
}
|
|
673
|
+
function $d3863c46a17e8a28$var$arrayRemove(array, item) {
|
|
674
|
+
const updatedArray = [
|
|
675
|
+
...array
|
|
676
|
+
];
|
|
677
|
+
const index = updatedArray.indexOf(item);
|
|
678
|
+
if (index !== -1) updatedArray.splice(index, 1);
|
|
679
|
+
return updatedArray;
|
|
680
|
+
}
|
|
681
|
+
function $d3863c46a17e8a28$var$removeLinks(items) {
|
|
682
|
+
return items.filter((item)=>item.tagName !== 'A'
|
|
683
|
+
);
|
|
684
|
+
}
|
|
685
|
+
|
|
686
|
+
function $db6c3485150b8e66$export$1ab7ae714698c4b8(element) {
|
|
687
|
+
const [size, setSize] = React.useState(undefined);
|
|
688
|
+
index.$9f79659886946c16$export$e5c5a5f917a5871c(()=>{
|
|
689
|
+
if (element) {
|
|
690
|
+
// provide size as early as possible
|
|
691
|
+
setSize({
|
|
692
|
+
width: element.offsetWidth,
|
|
693
|
+
height: element.offsetHeight
|
|
694
|
+
});
|
|
695
|
+
const resizeObserver = new ResizeObserver((entries)=>{
|
|
696
|
+
if (!Array.isArray(entries)) return;
|
|
697
|
+
// Since we only observe the one element, we don't need to loop over the
|
|
698
|
+
// array
|
|
699
|
+
if (!entries.length) return;
|
|
700
|
+
const entry = entries[0];
|
|
701
|
+
let width;
|
|
702
|
+
let height;
|
|
703
|
+
if ('borderBoxSize' in entry) {
|
|
704
|
+
const borderSizeEntry = entry['borderBoxSize']; // iron out differences between browsers
|
|
705
|
+
const borderSize = Array.isArray(borderSizeEntry) ? borderSizeEntry[0] : borderSizeEntry;
|
|
706
|
+
width = borderSize['inlineSize'];
|
|
707
|
+
height = borderSize['blockSize'];
|
|
708
|
+
} else {
|
|
709
|
+
// for browsers that don't support `borderBoxSize`
|
|
710
|
+
// we calculate it ourselves to get the correct border box.
|
|
711
|
+
width = element.offsetWidth;
|
|
712
|
+
height = element.offsetHeight;
|
|
713
|
+
}
|
|
714
|
+
setSize({
|
|
715
|
+
width: width,
|
|
716
|
+
height: height
|
|
717
|
+
});
|
|
718
|
+
});
|
|
719
|
+
resizeObserver.observe(element, {
|
|
720
|
+
box: 'border-box'
|
|
721
|
+
});
|
|
722
|
+
return ()=>resizeObserver.unobserve(element)
|
|
723
|
+
;
|
|
724
|
+
} else // We only want to reset to `undefined` when the element becomes `null`,
|
|
725
|
+
// not if it changes to another element.
|
|
726
|
+
setSize(undefined);
|
|
727
|
+
}, [
|
|
728
|
+
element
|
|
729
|
+
]);
|
|
730
|
+
return size;
|
|
731
|
+
}
|
|
732
|
+
|
|
733
|
+
/* -------------------------------------------------------------------------------------------------
|
|
734
|
+
* Popper
|
|
735
|
+
* -----------------------------------------------------------------------------------------------*/ const $cf1ac5d9fe0e8206$var$POPPER_NAME = 'Popper';
|
|
736
|
+
const [$cf1ac5d9fe0e8206$var$createPopperContext, $cf1ac5d9fe0e8206$export$722aac194ae923] = index.$c512c27ab02ef895$export$50c7b4e9d9f19c1($cf1ac5d9fe0e8206$var$POPPER_NAME);
|
|
737
|
+
const [$cf1ac5d9fe0e8206$var$PopperProvider, $cf1ac5d9fe0e8206$var$usePopperContext] = $cf1ac5d9fe0e8206$var$createPopperContext($cf1ac5d9fe0e8206$var$POPPER_NAME);
|
|
738
|
+
const $cf1ac5d9fe0e8206$export$badac9ada3a0bdf9 = (props)=>{
|
|
739
|
+
const { __scopePopper: __scopePopper , children: children } = props;
|
|
740
|
+
const [anchor, setAnchor] = React.useState(null);
|
|
741
|
+
return /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$var$PopperProvider, {
|
|
742
|
+
scope: __scopePopper,
|
|
743
|
+
anchor: anchor,
|
|
744
|
+
onAnchorChange: setAnchor
|
|
745
|
+
}, children);
|
|
746
|
+
};
|
|
747
|
+
/* -------------------------------------------------------------------------------------------------
|
|
748
|
+
* PopperAnchor
|
|
749
|
+
* -----------------------------------------------------------------------------------------------*/ const $cf1ac5d9fe0e8206$var$ANCHOR_NAME = 'PopperAnchor';
|
|
750
|
+
const $cf1ac5d9fe0e8206$export$ecd4e1ccab6ed6d = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
|
|
751
|
+
const { __scopePopper: __scopePopper , virtualRef: virtualRef , ...anchorProps } = props;
|
|
752
|
+
const context = $cf1ac5d9fe0e8206$var$usePopperContext($cf1ac5d9fe0e8206$var$ANCHOR_NAME, __scopePopper);
|
|
753
|
+
const ref = React.useRef(null);
|
|
754
|
+
const composedRefs = index.$6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, ref);
|
|
755
|
+
React.useEffect(()=>{
|
|
756
|
+
// Consumer can anchor the popper to something that isn't
|
|
757
|
+
// a DOM node e.g. pointer position, so we override the
|
|
758
|
+
// `anchorRef` with their virtual ref in this case.
|
|
759
|
+
context.onAnchorChange((virtualRef === null || virtualRef === void 0 ? void 0 : virtualRef.current) || ref.current);
|
|
760
|
+
});
|
|
761
|
+
return virtualRef ? null : /*#__PURE__*/ React.createElement(index.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({}, anchorProps, {
|
|
762
|
+
ref: composedRefs
|
|
763
|
+
}));
|
|
764
|
+
});
|
|
765
|
+
/* -------------------------------------------------------------------------------------------------
|
|
766
|
+
* PopperContent
|
|
767
|
+
* -----------------------------------------------------------------------------------------------*/ const $cf1ac5d9fe0e8206$var$CONTENT_NAME = 'PopperContent';
|
|
768
|
+
const [$cf1ac5d9fe0e8206$var$PopperContentProvider, $cf1ac5d9fe0e8206$var$useContentContext] = $cf1ac5d9fe0e8206$var$createPopperContext($cf1ac5d9fe0e8206$var$CONTENT_NAME);
|
|
769
|
+
const $cf1ac5d9fe0e8206$export$bc4ae5855d3c4fc = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
|
|
770
|
+
var _arrowSize$width, _arrowSize$height, _middlewareData$arrow, _middlewareData$arrow2, _middlewareData$arrow3, _middlewareData$trans, _middlewareData$trans2, _middlewareData$hide;
|
|
771
|
+
const { __scopePopper: __scopePopper , side: side = 'bottom' , sideOffset: sideOffset = 0 , align: align = 'center' , alignOffset: alignOffset = 0 , arrowPadding: arrowPadding = 0 , avoidCollisions: avoidCollisions = true , collisionBoundary: collisionBoundary = [] , collisionPadding: collisionPaddingProp = 0 , sticky: sticky = 'partial' , hideWhenDetached: hideWhenDetached = false , updatePositionStrategy: updatePositionStrategy = 'optimized' , onPlaced: onPlaced , ...contentProps } = props;
|
|
772
|
+
const context = $cf1ac5d9fe0e8206$var$usePopperContext($cf1ac5d9fe0e8206$var$CONTENT_NAME, __scopePopper);
|
|
773
|
+
const [content, setContent] = React.useState(null);
|
|
774
|
+
const composedRefs = index.$6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setContent(node)
|
|
775
|
+
);
|
|
776
|
+
const [arrow, setArrow] = React.useState(null);
|
|
777
|
+
const arrowSize = $db6c3485150b8e66$export$1ab7ae714698c4b8(arrow);
|
|
778
|
+
const arrowWidth = (_arrowSize$width = arrowSize === null || arrowSize === void 0 ? void 0 : arrowSize.width) !== null && _arrowSize$width !== void 0 ? _arrowSize$width : 0;
|
|
779
|
+
const arrowHeight = (_arrowSize$height = arrowSize === null || arrowSize === void 0 ? void 0 : arrowSize.height) !== null && _arrowSize$height !== void 0 ? _arrowSize$height : 0;
|
|
780
|
+
const desiredPlacement = side + (align !== 'center' ? '-' + align : '');
|
|
781
|
+
const collisionPadding = typeof collisionPaddingProp === 'number' ? collisionPaddingProp : {
|
|
782
|
+
top: 0,
|
|
783
|
+
right: 0,
|
|
784
|
+
bottom: 0,
|
|
785
|
+
left: 0,
|
|
786
|
+
...collisionPaddingProp
|
|
787
|
+
};
|
|
788
|
+
const boundary = Array.isArray(collisionBoundary) ? collisionBoundary : [
|
|
789
|
+
collisionBoundary
|
|
790
|
+
];
|
|
791
|
+
const hasExplicitBoundaries = boundary.length > 0;
|
|
792
|
+
const detectOverflowOptions = {
|
|
793
|
+
padding: collisionPadding,
|
|
794
|
+
boundary: boundary.filter($cf1ac5d9fe0e8206$var$isNotNull),
|
|
795
|
+
// with `strategy: 'fixed'`, this is the only way to get it to respect boundaries
|
|
796
|
+
altBoundary: hasExplicitBoundaries
|
|
797
|
+
};
|
|
798
|
+
const { refs: refs , floatingStyles: floatingStyles , placement: placement , isPositioned: isPositioned , middlewareData: middlewareData } = floatingUi_reactDom.useFloating({
|
|
799
|
+
// default to `fixed` strategy so users don't have to pick and we also avoid focus scroll issues
|
|
800
|
+
strategy: 'fixed',
|
|
801
|
+
placement: desiredPlacement,
|
|
802
|
+
whileElementsMounted: (...args)=>{
|
|
803
|
+
const cleanup = floatingUi_reactDom.autoUpdate(...args, {
|
|
804
|
+
animationFrame: updatePositionStrategy === 'always'
|
|
805
|
+
});
|
|
806
|
+
return cleanup;
|
|
807
|
+
},
|
|
808
|
+
elements: {
|
|
809
|
+
reference: context.anchor
|
|
810
|
+
},
|
|
811
|
+
middleware: [
|
|
812
|
+
floatingUi_reactDom.offset({
|
|
813
|
+
mainAxis: sideOffset + arrowHeight,
|
|
814
|
+
alignmentAxis: alignOffset
|
|
815
|
+
}),
|
|
816
|
+
avoidCollisions && floatingUi_reactDom.shift({
|
|
817
|
+
mainAxis: true,
|
|
818
|
+
crossAxis: false,
|
|
819
|
+
limiter: sticky === 'partial' ? floatingUi_reactDom.limitShift() : undefined,
|
|
820
|
+
...detectOverflowOptions
|
|
821
|
+
}),
|
|
822
|
+
avoidCollisions && floatingUi_reactDom.flip({
|
|
823
|
+
...detectOverflowOptions
|
|
824
|
+
}),
|
|
825
|
+
floatingUi_reactDom.size({
|
|
826
|
+
...detectOverflowOptions,
|
|
827
|
+
apply: ({ elements: elements , rects: rects , availableWidth: availableWidth , availableHeight: availableHeight })=>{
|
|
828
|
+
const { width: anchorWidth , height: anchorHeight } = rects.reference;
|
|
829
|
+
const contentStyle = elements.floating.style;
|
|
830
|
+
contentStyle.setProperty('--radix-popper-available-width', `${availableWidth}px`);
|
|
831
|
+
contentStyle.setProperty('--radix-popper-available-height', `${availableHeight}px`);
|
|
832
|
+
contentStyle.setProperty('--radix-popper-anchor-width', `${anchorWidth}px`);
|
|
833
|
+
contentStyle.setProperty('--radix-popper-anchor-height', `${anchorHeight}px`);
|
|
834
|
+
}
|
|
835
|
+
}),
|
|
836
|
+
arrow && floatingUi_reactDom.arrow({
|
|
837
|
+
element: arrow,
|
|
838
|
+
padding: arrowPadding
|
|
839
|
+
}),
|
|
840
|
+
$cf1ac5d9fe0e8206$var$transformOrigin({
|
|
841
|
+
arrowWidth: arrowWidth,
|
|
842
|
+
arrowHeight: arrowHeight
|
|
843
|
+
}),
|
|
844
|
+
hideWhenDetached && floatingUi_reactDom.hide({
|
|
845
|
+
strategy: 'referenceHidden',
|
|
846
|
+
...detectOverflowOptions
|
|
847
|
+
})
|
|
848
|
+
]
|
|
849
|
+
});
|
|
850
|
+
const [placedSide, placedAlign] = $cf1ac5d9fe0e8206$var$getSideAndAlignFromPlacement(placement);
|
|
851
|
+
const handlePlaced = index.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onPlaced);
|
|
852
|
+
index.$9f79659886946c16$export$e5c5a5f917a5871c(()=>{
|
|
853
|
+
if (isPositioned) handlePlaced === null || handlePlaced === void 0 || handlePlaced();
|
|
854
|
+
}, [
|
|
855
|
+
isPositioned,
|
|
856
|
+
handlePlaced
|
|
857
|
+
]);
|
|
858
|
+
const arrowX = (_middlewareData$arrow = middlewareData.arrow) === null || _middlewareData$arrow === void 0 ? void 0 : _middlewareData$arrow.x;
|
|
859
|
+
const arrowY = (_middlewareData$arrow2 = middlewareData.arrow) === null || _middlewareData$arrow2 === void 0 ? void 0 : _middlewareData$arrow2.y;
|
|
860
|
+
const cannotCenterArrow = ((_middlewareData$arrow3 = middlewareData.arrow) === null || _middlewareData$arrow3 === void 0 ? void 0 : _middlewareData$arrow3.centerOffset) !== 0;
|
|
861
|
+
const [contentZIndex, setContentZIndex] = React.useState();
|
|
862
|
+
index.$9f79659886946c16$export$e5c5a5f917a5871c(()=>{
|
|
863
|
+
if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
|
|
864
|
+
}, [
|
|
865
|
+
content
|
|
866
|
+
]);
|
|
867
|
+
return /*#__PURE__*/ React.createElement("div", {
|
|
868
|
+
ref: refs.setFloating,
|
|
869
|
+
"data-radix-popper-content-wrapper": "",
|
|
870
|
+
style: {
|
|
871
|
+
...floatingStyles,
|
|
872
|
+
transform: isPositioned ? floatingStyles.transform : 'translate(0, -200%)',
|
|
873
|
+
// keep off the page when measuring
|
|
874
|
+
minWidth: 'max-content',
|
|
875
|
+
zIndex: contentZIndex,
|
|
876
|
+
['--radix-popper-transform-origin']: [
|
|
877
|
+
(_middlewareData$trans = middlewareData.transformOrigin) === null || _middlewareData$trans === void 0 ? void 0 : _middlewareData$trans.x,
|
|
878
|
+
(_middlewareData$trans2 = middlewareData.transformOrigin) === null || _middlewareData$trans2 === void 0 ? void 0 : _middlewareData$trans2.y
|
|
879
|
+
].join(' ')
|
|
880
|
+
} // Floating UI interally calculates logical alignment based the `dir` attribute on
|
|
881
|
+
,
|
|
882
|
+
dir: props.dir
|
|
883
|
+
}, /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$var$PopperContentProvider, {
|
|
884
|
+
scope: __scopePopper,
|
|
885
|
+
placedSide: placedSide,
|
|
886
|
+
onArrowChange: setArrow,
|
|
887
|
+
arrowX: arrowX,
|
|
888
|
+
arrowY: arrowY,
|
|
889
|
+
shouldHideArrow: cannotCenterArrow
|
|
890
|
+
}, /*#__PURE__*/ React.createElement(index.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({
|
|
891
|
+
"data-side": placedSide,
|
|
892
|
+
"data-align": placedAlign
|
|
893
|
+
}, contentProps, {
|
|
894
|
+
ref: composedRefs,
|
|
895
|
+
style: {
|
|
896
|
+
...contentProps.style,
|
|
897
|
+
// if the PopperContent hasn't been placed yet (not all measurements done)
|
|
898
|
+
// we prevent animations so that users's animation don't kick in too early referring wrong sides
|
|
899
|
+
animation: !isPositioned ? 'none' : undefined,
|
|
900
|
+
// hide the content if using the hide middleware and should be hidden
|
|
901
|
+
opacity: (_middlewareData$hide = middlewareData.hide) !== null && _middlewareData$hide !== void 0 && _middlewareData$hide.referenceHidden ? 0 : undefined
|
|
902
|
+
}
|
|
903
|
+
}))));
|
|
904
|
+
});
|
|
905
|
+
/* -----------------------------------------------------------------------------------------------*/ function $cf1ac5d9fe0e8206$var$isNotNull(value) {
|
|
906
|
+
return value !== null;
|
|
907
|
+
}
|
|
908
|
+
const $cf1ac5d9fe0e8206$var$transformOrigin = (options)=>({
|
|
909
|
+
name: 'transformOrigin',
|
|
910
|
+
options: options,
|
|
911
|
+
fn (data) {
|
|
912
|
+
var _middlewareData$arrow4, _middlewareData$arrow5, _middlewareData$arrow6, _middlewareData$arrow7, _middlewareData$arrow8;
|
|
913
|
+
const { placement: placement , rects: rects , middlewareData: middlewareData } = data;
|
|
914
|
+
const cannotCenterArrow = ((_middlewareData$arrow4 = middlewareData.arrow) === null || _middlewareData$arrow4 === void 0 ? void 0 : _middlewareData$arrow4.centerOffset) !== 0;
|
|
915
|
+
const isArrowHidden = cannotCenterArrow;
|
|
916
|
+
const arrowWidth = isArrowHidden ? 0 : options.arrowWidth;
|
|
917
|
+
const arrowHeight = isArrowHidden ? 0 : options.arrowHeight;
|
|
918
|
+
const [placedSide, placedAlign] = $cf1ac5d9fe0e8206$var$getSideAndAlignFromPlacement(placement);
|
|
919
|
+
const noArrowAlign = {
|
|
920
|
+
start: '0%',
|
|
921
|
+
center: '50%',
|
|
922
|
+
end: '100%'
|
|
923
|
+
}[placedAlign];
|
|
924
|
+
const arrowXCenter = ((_middlewareData$arrow5 = (_middlewareData$arrow6 = middlewareData.arrow) === null || _middlewareData$arrow6 === void 0 ? void 0 : _middlewareData$arrow6.x) !== null && _middlewareData$arrow5 !== void 0 ? _middlewareData$arrow5 : 0) + arrowWidth / 2;
|
|
925
|
+
const arrowYCenter = ((_middlewareData$arrow7 = (_middlewareData$arrow8 = middlewareData.arrow) === null || _middlewareData$arrow8 === void 0 ? void 0 : _middlewareData$arrow8.y) !== null && _middlewareData$arrow7 !== void 0 ? _middlewareData$arrow7 : 0) + arrowHeight / 2;
|
|
926
|
+
let x = '';
|
|
927
|
+
let y = '';
|
|
928
|
+
if (placedSide === 'bottom') {
|
|
929
|
+
x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
|
|
930
|
+
y = `${-arrowHeight}px`;
|
|
931
|
+
} else if (placedSide === 'top') {
|
|
932
|
+
x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
|
|
933
|
+
y = `${rects.floating.height + arrowHeight}px`;
|
|
934
|
+
} else if (placedSide === 'right') {
|
|
935
|
+
x = `${-arrowHeight}px`;
|
|
936
|
+
y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
|
|
937
|
+
} else if (placedSide === 'left') {
|
|
938
|
+
x = `${rects.floating.width + arrowHeight}px`;
|
|
939
|
+
y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
|
|
940
|
+
}
|
|
941
|
+
return {
|
|
942
|
+
data: {
|
|
943
|
+
x: x,
|
|
944
|
+
y: y
|
|
945
|
+
}
|
|
946
|
+
};
|
|
947
|
+
}
|
|
948
|
+
})
|
|
949
|
+
;
|
|
950
|
+
function $cf1ac5d9fe0e8206$var$getSideAndAlignFromPlacement(placement) {
|
|
951
|
+
const [side, align = 'center'] = placement.split('-');
|
|
952
|
+
return [
|
|
953
|
+
side,
|
|
954
|
+
align
|
|
955
|
+
];
|
|
956
|
+
}
|
|
957
|
+
const $cf1ac5d9fe0e8206$export$be92b6f5f03c0fe9 = $cf1ac5d9fe0e8206$export$badac9ada3a0bdf9;
|
|
958
|
+
const $cf1ac5d9fe0e8206$export$b688253958b8dfe7 = $cf1ac5d9fe0e8206$export$ecd4e1ccab6ed6d;
|
|
959
|
+
const $cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2 = $cf1ac5d9fe0e8206$export$bc4ae5855d3c4fc;
|
|
960
|
+
|
|
961
|
+
const $f1701beae083dbae$export$602eac185826482c = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
|
|
962
|
+
var _globalThis$document;
|
|
963
|
+
const { container: container = globalThis === null || globalThis === void 0 ? void 0 : (_globalThis$document = globalThis.document) === null || _globalThis$document === void 0 ? void 0 : _globalThis$document.body , ...portalProps } = props;
|
|
964
|
+
return container ? /*#__PURE__*/ ReactDOM__default["default"].createPortal(/*#__PURE__*/ React.createElement(index.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({}, portalProps, {
|
|
965
|
+
ref: forwardedRef
|
|
966
|
+
})), container) : null;
|
|
967
|
+
});
|
|
968
|
+
|
|
969
|
+
var getDefaultParent = function (originalTarget) {
|
|
970
|
+
if (typeof document === 'undefined') {
|
|
971
|
+
return null;
|
|
972
|
+
}
|
|
973
|
+
var sampleTarget = Array.isArray(originalTarget) ? originalTarget[0] : originalTarget;
|
|
974
|
+
return sampleTarget.ownerDocument.body;
|
|
975
|
+
};
|
|
976
|
+
var counterMap = new WeakMap();
|
|
977
|
+
var uncontrolledNodes = new WeakMap();
|
|
978
|
+
var markerMap = {};
|
|
979
|
+
var lockCount = 0;
|
|
980
|
+
var unwrapHost = function (node) {
|
|
981
|
+
return node && (node.host || unwrapHost(node.parentNode));
|
|
982
|
+
};
|
|
983
|
+
var correctTargets = function (parent, targets) {
|
|
984
|
+
return targets
|
|
985
|
+
.map(function (target) {
|
|
986
|
+
if (parent.contains(target)) {
|
|
987
|
+
return target;
|
|
988
|
+
}
|
|
989
|
+
var correctedTarget = unwrapHost(target);
|
|
990
|
+
if (correctedTarget && parent.contains(correctedTarget)) {
|
|
991
|
+
return correctedTarget;
|
|
992
|
+
}
|
|
993
|
+
console.error('aria-hidden', target, 'in not contained inside', parent, '. Doing nothing');
|
|
994
|
+
return null;
|
|
995
|
+
})
|
|
996
|
+
.filter(function (x) { return Boolean(x); });
|
|
997
|
+
};
|
|
998
|
+
/**
|
|
999
|
+
* Marks everything except given node(or nodes) as aria-hidden
|
|
1000
|
+
* @param {Element | Element[]} originalTarget - elements to keep on the page
|
|
1001
|
+
* @param [parentNode] - top element, defaults to document.body
|
|
1002
|
+
* @param {String} [markerName] - a special attribute to mark every node
|
|
1003
|
+
* @param {String} [controlAttribute] - html Attribute to control
|
|
1004
|
+
* @return {Undo} undo command
|
|
1005
|
+
*/
|
|
1006
|
+
var applyAttributeToOthers = function (originalTarget, parentNode, markerName, controlAttribute) {
|
|
1007
|
+
var targets = correctTargets(parentNode, Array.isArray(originalTarget) ? originalTarget : [originalTarget]);
|
|
1008
|
+
if (!markerMap[markerName]) {
|
|
1009
|
+
markerMap[markerName] = new WeakMap();
|
|
1010
|
+
}
|
|
1011
|
+
var markerCounter = markerMap[markerName];
|
|
1012
|
+
var hiddenNodes = [];
|
|
1013
|
+
var elementsToKeep = new Set();
|
|
1014
|
+
var elementsToStop = new Set(targets);
|
|
1015
|
+
var keep = function (el) {
|
|
1016
|
+
if (!el || elementsToKeep.has(el)) {
|
|
1017
|
+
return;
|
|
1018
|
+
}
|
|
1019
|
+
elementsToKeep.add(el);
|
|
1020
|
+
keep(el.parentNode);
|
|
1021
|
+
};
|
|
1022
|
+
targets.forEach(keep);
|
|
1023
|
+
var deep = function (parent) {
|
|
1024
|
+
if (!parent || elementsToStop.has(parent)) {
|
|
1025
|
+
return;
|
|
1026
|
+
}
|
|
1027
|
+
Array.prototype.forEach.call(parent.children, function (node) {
|
|
1028
|
+
if (elementsToKeep.has(node)) {
|
|
1029
|
+
deep(node);
|
|
1030
|
+
}
|
|
1031
|
+
else {
|
|
1032
|
+
var attr = node.getAttribute(controlAttribute);
|
|
1033
|
+
var alreadyHidden = attr !== null && attr !== 'false';
|
|
1034
|
+
var counterValue = (counterMap.get(node) || 0) + 1;
|
|
1035
|
+
var markerValue = (markerCounter.get(node) || 0) + 1;
|
|
1036
|
+
counterMap.set(node, counterValue);
|
|
1037
|
+
markerCounter.set(node, markerValue);
|
|
1038
|
+
hiddenNodes.push(node);
|
|
1039
|
+
if (counterValue === 1 && alreadyHidden) {
|
|
1040
|
+
uncontrolledNodes.set(node, true);
|
|
1041
|
+
}
|
|
1042
|
+
if (markerValue === 1) {
|
|
1043
|
+
node.setAttribute(markerName, 'true');
|
|
1044
|
+
}
|
|
1045
|
+
if (!alreadyHidden) {
|
|
1046
|
+
node.setAttribute(controlAttribute, 'true');
|
|
1047
|
+
}
|
|
1048
|
+
}
|
|
1049
|
+
});
|
|
1050
|
+
};
|
|
1051
|
+
deep(parentNode);
|
|
1052
|
+
elementsToKeep.clear();
|
|
1053
|
+
lockCount++;
|
|
1054
|
+
return function () {
|
|
1055
|
+
hiddenNodes.forEach(function (node) {
|
|
1056
|
+
var counterValue = counterMap.get(node) - 1;
|
|
1057
|
+
var markerValue = markerCounter.get(node) - 1;
|
|
1058
|
+
counterMap.set(node, counterValue);
|
|
1059
|
+
markerCounter.set(node, markerValue);
|
|
1060
|
+
if (!counterValue) {
|
|
1061
|
+
if (!uncontrolledNodes.has(node)) {
|
|
1062
|
+
node.removeAttribute(controlAttribute);
|
|
1063
|
+
}
|
|
1064
|
+
uncontrolledNodes.delete(node);
|
|
1065
|
+
}
|
|
1066
|
+
if (!markerValue) {
|
|
1067
|
+
node.removeAttribute(markerName);
|
|
1068
|
+
}
|
|
1069
|
+
});
|
|
1070
|
+
lockCount--;
|
|
1071
|
+
if (!lockCount) {
|
|
1072
|
+
// clear
|
|
1073
|
+
counterMap = new WeakMap();
|
|
1074
|
+
counterMap = new WeakMap();
|
|
1075
|
+
uncontrolledNodes = new WeakMap();
|
|
1076
|
+
markerMap = {};
|
|
1077
|
+
}
|
|
1078
|
+
};
|
|
1079
|
+
};
|
|
1080
|
+
/**
|
|
1081
|
+
* Marks everything except given node(or nodes) as aria-hidden
|
|
1082
|
+
* @param {Element | Element[]} originalTarget - elements to keep on the page
|
|
1083
|
+
* @param [parentNode] - top element, defaults to document.body
|
|
1084
|
+
* @param {String} [markerName] - a special attribute to mark every node
|
|
1085
|
+
* @return {Undo} undo command
|
|
1086
|
+
*/
|
|
1087
|
+
var hideOthers = function (originalTarget, parentNode, markerName) {
|
|
1088
|
+
if (markerName === void 0) { markerName = 'data-aria-hidden'; }
|
|
1089
|
+
var targets = Array.from(Array.isArray(originalTarget) ? originalTarget : [originalTarget]);
|
|
1090
|
+
var activeParentNode = parentNode || getDefaultParent(originalTarget);
|
|
1091
|
+
if (!activeParentNode) {
|
|
1092
|
+
return function () { return null; };
|
|
1093
|
+
}
|
|
1094
|
+
// we should not hide ariaLive elements - https://github.com/theKashey/aria-hidden/issues/10
|
|
1095
|
+
targets.push.apply(targets, Array.from(activeParentNode.querySelectorAll('[aria-live]')));
|
|
1096
|
+
return applyAttributeToOthers(targets, activeParentNode, markerName, 'aria-hidden');
|
|
1097
|
+
};
|
|
1098
|
+
|
|
1099
|
+
var effectCar = component.createSidecarMedium();
|
|
1100
|
+
|
|
1101
|
+
var nothing = function () {
|
|
1102
|
+
return;
|
|
1103
|
+
};
|
|
1104
|
+
/**
|
|
1105
|
+
* Removes scrollbar from the page and contain the scroll within the Lock
|
|
1106
|
+
*/
|
|
1107
|
+
var RemoveScroll = React__namespace.forwardRef(function (props, parentRef) {
|
|
1108
|
+
var ref = React__namespace.useRef(null);
|
|
1109
|
+
var _a = React__namespace.useState({
|
|
1110
|
+
onScrollCapture: nothing,
|
|
1111
|
+
onWheelCapture: nothing,
|
|
1112
|
+
onTouchMoveCapture: nothing,
|
|
1113
|
+
}), callbacks = _a[0], setCallbacks = _a[1];
|
|
1114
|
+
var forwardProps = props.forwardProps, children = props.children, className = props.className, removeScrollBar = props.removeScrollBar, enabled = props.enabled, shards = props.shards, sideCar = props.sideCar, noIsolation = props.noIsolation, inert = props.inert, allowPinchZoom = props.allowPinchZoom, _b = props.as, Container = _b === void 0 ? 'div' : _b, rest = filterDataAttrs.__rest(props, ["forwardProps", "children", "className", "removeScrollBar", "enabled", "shards", "sideCar", "noIsolation", "inert", "allowPinchZoom", "as"]);
|
|
1115
|
+
var SideCar = sideCar;
|
|
1116
|
+
var containerRef = component.useMergeRefs([ref, parentRef]);
|
|
1117
|
+
var containerProps = filterDataAttrs.__assign(filterDataAttrs.__assign({}, rest), callbacks);
|
|
1118
|
+
return (React__namespace.createElement(React__namespace.Fragment, null,
|
|
1119
|
+
enabled && (React__namespace.createElement(SideCar, { sideCar: effectCar, removeScrollBar: removeScrollBar, shards: shards, noIsolation: noIsolation, inert: inert, setCallbacks: setCallbacks, allowPinchZoom: !!allowPinchZoom, lockRef: ref })),
|
|
1120
|
+
forwardProps ? (React__namespace.cloneElement(React__namespace.Children.only(children), filterDataAttrs.__assign(filterDataAttrs.__assign({}, containerProps), { ref: containerRef }))) : (React__namespace.createElement(Container, filterDataAttrs.__assign({}, containerProps, { className: className, ref: containerRef }), children))));
|
|
1121
|
+
});
|
|
1122
|
+
RemoveScroll.defaultProps = {
|
|
1123
|
+
enabled: true,
|
|
1124
|
+
removeScrollBar: true,
|
|
1125
|
+
inert: false,
|
|
1126
|
+
};
|
|
1127
|
+
RemoveScroll.classNames = {
|
|
1128
|
+
fullWidth: component.fullWidthClassName,
|
|
1129
|
+
zeroRight: component.zeroRightClassName,
|
|
1130
|
+
};
|
|
1131
|
+
|
|
1132
|
+
var passiveSupported = false;
|
|
1133
|
+
if (typeof window !== 'undefined') {
|
|
1134
|
+
try {
|
|
1135
|
+
var options = Object.defineProperty({}, 'passive', {
|
|
1136
|
+
get: function () {
|
|
1137
|
+
passiveSupported = true;
|
|
1138
|
+
return true;
|
|
1139
|
+
},
|
|
1140
|
+
});
|
|
1141
|
+
// @ts-ignore
|
|
1142
|
+
window.addEventListener('test', options, options);
|
|
1143
|
+
// @ts-ignore
|
|
1144
|
+
window.removeEventListener('test', options, options);
|
|
1145
|
+
}
|
|
1146
|
+
catch (err) {
|
|
1147
|
+
passiveSupported = false;
|
|
1148
|
+
}
|
|
1149
|
+
}
|
|
1150
|
+
var nonPassive = passiveSupported ? { passive: false } : false;
|
|
1151
|
+
|
|
1152
|
+
var alwaysContainsScroll = function (node) {
|
|
1153
|
+
// textarea will always _contain_ scroll inside self. It only can be hidden
|
|
1154
|
+
return node.tagName === 'TEXTAREA';
|
|
1155
|
+
};
|
|
1156
|
+
var elementCanBeScrolled = function (node, overflow) {
|
|
1157
|
+
var styles = window.getComputedStyle(node);
|
|
1158
|
+
return (
|
|
1159
|
+
// not-not-scrollable
|
|
1160
|
+
styles[overflow] !== 'hidden' &&
|
|
1161
|
+
// contains scroll inside self
|
|
1162
|
+
!(styles.overflowY === styles.overflowX && !alwaysContainsScroll(node) && styles[overflow] === 'visible'));
|
|
1163
|
+
};
|
|
1164
|
+
var elementCouldBeVScrolled = function (node) { return elementCanBeScrolled(node, 'overflowY'); };
|
|
1165
|
+
var elementCouldBeHScrolled = function (node) { return elementCanBeScrolled(node, 'overflowX'); };
|
|
1166
|
+
var locationCouldBeScrolled = function (axis, node) {
|
|
1167
|
+
var current = node;
|
|
1168
|
+
do {
|
|
1169
|
+
// Skip over shadow root
|
|
1170
|
+
if (typeof ShadowRoot !== 'undefined' && current instanceof ShadowRoot) {
|
|
1171
|
+
current = current.host;
|
|
1172
|
+
}
|
|
1173
|
+
var isScrollable = elementCouldBeScrolled(axis, current);
|
|
1174
|
+
if (isScrollable) {
|
|
1175
|
+
var _a = getScrollVariables(axis, current), s = _a[1], d = _a[2];
|
|
1176
|
+
if (s > d) {
|
|
1177
|
+
return true;
|
|
1178
|
+
}
|
|
1179
|
+
}
|
|
1180
|
+
current = current.parentNode;
|
|
1181
|
+
} while (current && current !== document.body);
|
|
1182
|
+
return false;
|
|
1183
|
+
};
|
|
1184
|
+
var getVScrollVariables = function (_a) {
|
|
1185
|
+
var scrollTop = _a.scrollTop, scrollHeight = _a.scrollHeight, clientHeight = _a.clientHeight;
|
|
1186
|
+
return [
|
|
1187
|
+
scrollTop,
|
|
1188
|
+
scrollHeight,
|
|
1189
|
+
clientHeight,
|
|
1190
|
+
];
|
|
1191
|
+
};
|
|
1192
|
+
var getHScrollVariables = function (_a) {
|
|
1193
|
+
var scrollLeft = _a.scrollLeft, scrollWidth = _a.scrollWidth, clientWidth = _a.clientWidth;
|
|
1194
|
+
return [
|
|
1195
|
+
scrollLeft,
|
|
1196
|
+
scrollWidth,
|
|
1197
|
+
clientWidth,
|
|
1198
|
+
];
|
|
1199
|
+
};
|
|
1200
|
+
var elementCouldBeScrolled = function (axis, node) {
|
|
1201
|
+
return axis === 'v' ? elementCouldBeVScrolled(node) : elementCouldBeHScrolled(node);
|
|
1202
|
+
};
|
|
1203
|
+
var getScrollVariables = function (axis, node) {
|
|
1204
|
+
return axis === 'v' ? getVScrollVariables(node) : getHScrollVariables(node);
|
|
1205
|
+
};
|
|
1206
|
+
var getDirectionFactor = function (axis, direction) {
|
|
1207
|
+
/**
|
|
1208
|
+
* If the element's direction is rtl (right-to-left), then scrollLeft is 0 when the scrollbar is at its rightmost position,
|
|
1209
|
+
* and then increasingly negative as you scroll towards the end of the content.
|
|
1210
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft
|
|
1211
|
+
*/
|
|
1212
|
+
return axis === 'h' && direction === 'rtl' ? -1 : 1;
|
|
1213
|
+
};
|
|
1214
|
+
var handleScroll = function (axis, endTarget, event, sourceDelta, noOverscroll) {
|
|
1215
|
+
var directionFactor = getDirectionFactor(axis, window.getComputedStyle(endTarget).direction);
|
|
1216
|
+
var delta = directionFactor * sourceDelta;
|
|
1217
|
+
// find scrollable target
|
|
1218
|
+
var target = event.target;
|
|
1219
|
+
var targetInLock = endTarget.contains(target);
|
|
1220
|
+
var shouldCancelScroll = false;
|
|
1221
|
+
var isDeltaPositive = delta > 0;
|
|
1222
|
+
var availableScroll = 0;
|
|
1223
|
+
var availableScrollTop = 0;
|
|
1224
|
+
do {
|
|
1225
|
+
var _a = getScrollVariables(axis, target), position = _a[0], scroll_1 = _a[1], capacity = _a[2];
|
|
1226
|
+
var elementScroll = scroll_1 - capacity - directionFactor * position;
|
|
1227
|
+
if (position || elementScroll) {
|
|
1228
|
+
if (elementCouldBeScrolled(axis, target)) {
|
|
1229
|
+
availableScroll += elementScroll;
|
|
1230
|
+
availableScrollTop += position;
|
|
1231
|
+
}
|
|
1232
|
+
}
|
|
1233
|
+
target = target.parentNode;
|
|
1234
|
+
} while (
|
|
1235
|
+
// portaled content
|
|
1236
|
+
(!targetInLock && target !== document.body) ||
|
|
1237
|
+
// self content
|
|
1238
|
+
(targetInLock && (endTarget.contains(target) || endTarget === target)));
|
|
1239
|
+
if (isDeltaPositive && ((noOverscroll && availableScroll === 0) || (!noOverscroll && delta > availableScroll))) {
|
|
1240
|
+
shouldCancelScroll = true;
|
|
1241
|
+
}
|
|
1242
|
+
else if (!isDeltaPositive &&
|
|
1243
|
+
((noOverscroll && availableScrollTop === 0) || (!noOverscroll && -delta > availableScrollTop))) {
|
|
1244
|
+
shouldCancelScroll = true;
|
|
1245
|
+
}
|
|
1246
|
+
return shouldCancelScroll;
|
|
1247
|
+
};
|
|
1248
|
+
|
|
1249
|
+
var getTouchXY = function (event) {
|
|
1250
|
+
return 'changedTouches' in event ? [event.changedTouches[0].clientX, event.changedTouches[0].clientY] : [0, 0];
|
|
1251
|
+
};
|
|
1252
|
+
var getDeltaXY = function (event) { return [event.deltaX, event.deltaY]; };
|
|
1253
|
+
var extractRef = function (ref) {
|
|
1254
|
+
return ref && 'current' in ref ? ref.current : ref;
|
|
1255
|
+
};
|
|
1256
|
+
var deltaCompare = function (x, y) { return x[0] === y[0] && x[1] === y[1]; };
|
|
1257
|
+
var generateStyle = function (id) { return "\n .block-interactivity-".concat(id, " {pointer-events: none;}\n .allow-interactivity-").concat(id, " {pointer-events: all;}\n"); };
|
|
1258
|
+
var idCounter = 0;
|
|
1259
|
+
var lockStack = [];
|
|
1260
|
+
function RemoveScrollSideCar(props) {
|
|
1261
|
+
var shouldPreventQueue = React__namespace.useRef([]);
|
|
1262
|
+
var touchStartRef = React__namespace.useRef([0, 0]);
|
|
1263
|
+
var activeAxis = React__namespace.useRef();
|
|
1264
|
+
var id = React__namespace.useState(idCounter++)[0];
|
|
1265
|
+
var Style = React__namespace.useState(function () { return component.styleSingleton(); })[0];
|
|
1266
|
+
var lastProps = React__namespace.useRef(props);
|
|
1267
|
+
React__namespace.useEffect(function () {
|
|
1268
|
+
lastProps.current = props;
|
|
1269
|
+
}, [props]);
|
|
1270
|
+
React__namespace.useEffect(function () {
|
|
1271
|
+
if (props.inert) {
|
|
1272
|
+
document.body.classList.add("block-interactivity-".concat(id));
|
|
1273
|
+
var allow_1 = filterDataAttrs.__spreadArray([props.lockRef.current], (props.shards || []).map(extractRef), true).filter(Boolean);
|
|
1274
|
+
allow_1.forEach(function (el) { return el.classList.add("allow-interactivity-".concat(id)); });
|
|
1275
|
+
return function () {
|
|
1276
|
+
document.body.classList.remove("block-interactivity-".concat(id));
|
|
1277
|
+
allow_1.forEach(function (el) { return el.classList.remove("allow-interactivity-".concat(id)); });
|
|
1278
|
+
};
|
|
1279
|
+
}
|
|
1280
|
+
return;
|
|
1281
|
+
}, [props.inert, props.lockRef.current, props.shards]);
|
|
1282
|
+
var shouldCancelEvent = React__namespace.useCallback(function (event, parent) {
|
|
1283
|
+
if ('touches' in event && event.touches.length === 2) {
|
|
1284
|
+
return !lastProps.current.allowPinchZoom;
|
|
1285
|
+
}
|
|
1286
|
+
var touch = getTouchXY(event);
|
|
1287
|
+
var touchStart = touchStartRef.current;
|
|
1288
|
+
var deltaX = 'deltaX' in event ? event.deltaX : touchStart[0] - touch[0];
|
|
1289
|
+
var deltaY = 'deltaY' in event ? event.deltaY : touchStart[1] - touch[1];
|
|
1290
|
+
var currentAxis;
|
|
1291
|
+
var target = event.target;
|
|
1292
|
+
var moveDirection = Math.abs(deltaX) > Math.abs(deltaY) ? 'h' : 'v';
|
|
1293
|
+
// allow horizontal touch move on Range inputs. They will not cause any scroll
|
|
1294
|
+
if ('touches' in event && moveDirection === 'h' && target.type === 'range') {
|
|
1295
|
+
return false;
|
|
1296
|
+
}
|
|
1297
|
+
var canBeScrolledInMainDirection = locationCouldBeScrolled(moveDirection, target);
|
|
1298
|
+
if (!canBeScrolledInMainDirection) {
|
|
1299
|
+
return true;
|
|
1300
|
+
}
|
|
1301
|
+
if (canBeScrolledInMainDirection) {
|
|
1302
|
+
currentAxis = moveDirection;
|
|
1303
|
+
}
|
|
1304
|
+
else {
|
|
1305
|
+
currentAxis = moveDirection === 'v' ? 'h' : 'v';
|
|
1306
|
+
canBeScrolledInMainDirection = locationCouldBeScrolled(moveDirection, target);
|
|
1307
|
+
// other axis might be not scrollable
|
|
1308
|
+
}
|
|
1309
|
+
if (!canBeScrolledInMainDirection) {
|
|
1310
|
+
return false;
|
|
1311
|
+
}
|
|
1312
|
+
if (!activeAxis.current && 'changedTouches' in event && (deltaX || deltaY)) {
|
|
1313
|
+
activeAxis.current = currentAxis;
|
|
1314
|
+
}
|
|
1315
|
+
if (!currentAxis) {
|
|
1316
|
+
return true;
|
|
1317
|
+
}
|
|
1318
|
+
var cancelingAxis = activeAxis.current || currentAxis;
|
|
1319
|
+
return handleScroll(cancelingAxis, parent, event, cancelingAxis === 'h' ? deltaX : deltaY, true);
|
|
1320
|
+
}, []);
|
|
1321
|
+
var shouldPrevent = React__namespace.useCallback(function (_event) {
|
|
1322
|
+
var event = _event;
|
|
1323
|
+
if (!lockStack.length || lockStack[lockStack.length - 1] !== Style) {
|
|
1324
|
+
// not the last active
|
|
1325
|
+
return;
|
|
1326
|
+
}
|
|
1327
|
+
var delta = 'deltaY' in event ? getDeltaXY(event) : getTouchXY(event);
|
|
1328
|
+
var sourceEvent = shouldPreventQueue.current.filter(function (e) { return e.name === event.type && e.target === event.target && deltaCompare(e.delta, delta); })[0];
|
|
1329
|
+
// self event, and should be canceled
|
|
1330
|
+
if (sourceEvent && sourceEvent.should) {
|
|
1331
|
+
if (event.cancelable) {
|
|
1332
|
+
event.preventDefault();
|
|
1333
|
+
}
|
|
1334
|
+
return;
|
|
1335
|
+
}
|
|
1336
|
+
// outside or shard event
|
|
1337
|
+
if (!sourceEvent) {
|
|
1338
|
+
var shardNodes = (lastProps.current.shards || [])
|
|
1339
|
+
.map(extractRef)
|
|
1340
|
+
.filter(Boolean)
|
|
1341
|
+
.filter(function (node) { return node.contains(event.target); });
|
|
1342
|
+
var shouldStop = shardNodes.length > 0 ? shouldCancelEvent(event, shardNodes[0]) : !lastProps.current.noIsolation;
|
|
1343
|
+
if (shouldStop) {
|
|
1344
|
+
if (event.cancelable) {
|
|
1345
|
+
event.preventDefault();
|
|
1346
|
+
}
|
|
1347
|
+
}
|
|
1348
|
+
}
|
|
1349
|
+
}, []);
|
|
1350
|
+
var shouldCancel = React__namespace.useCallback(function (name, delta, target, should) {
|
|
1351
|
+
var event = { name: name, delta: delta, target: target, should: should };
|
|
1352
|
+
shouldPreventQueue.current.push(event);
|
|
1353
|
+
setTimeout(function () {
|
|
1354
|
+
shouldPreventQueue.current = shouldPreventQueue.current.filter(function (e) { return e !== event; });
|
|
1355
|
+
}, 1);
|
|
1356
|
+
}, []);
|
|
1357
|
+
var scrollTouchStart = React__namespace.useCallback(function (event) {
|
|
1358
|
+
touchStartRef.current = getTouchXY(event);
|
|
1359
|
+
activeAxis.current = undefined;
|
|
1360
|
+
}, []);
|
|
1361
|
+
var scrollWheel = React__namespace.useCallback(function (event) {
|
|
1362
|
+
shouldCancel(event.type, getDeltaXY(event), event.target, shouldCancelEvent(event, props.lockRef.current));
|
|
1363
|
+
}, []);
|
|
1364
|
+
var scrollTouchMove = React__namespace.useCallback(function (event) {
|
|
1365
|
+
shouldCancel(event.type, getTouchXY(event), event.target, shouldCancelEvent(event, props.lockRef.current));
|
|
1366
|
+
}, []);
|
|
1367
|
+
React__namespace.useEffect(function () {
|
|
1368
|
+
lockStack.push(Style);
|
|
1369
|
+
props.setCallbacks({
|
|
1370
|
+
onScrollCapture: scrollWheel,
|
|
1371
|
+
onWheelCapture: scrollWheel,
|
|
1372
|
+
onTouchMoveCapture: scrollTouchMove,
|
|
1373
|
+
});
|
|
1374
|
+
document.addEventListener('wheel', shouldPrevent, nonPassive);
|
|
1375
|
+
document.addEventListener('touchmove', shouldPrevent, nonPassive);
|
|
1376
|
+
document.addEventListener('touchstart', scrollTouchStart, nonPassive);
|
|
1377
|
+
return function () {
|
|
1378
|
+
lockStack = lockStack.filter(function (inst) { return inst !== Style; });
|
|
1379
|
+
document.removeEventListener('wheel', shouldPrevent, nonPassive);
|
|
1380
|
+
document.removeEventListener('touchmove', shouldPrevent, nonPassive);
|
|
1381
|
+
document.removeEventListener('touchstart', scrollTouchStart, nonPassive);
|
|
1382
|
+
};
|
|
1383
|
+
}, []);
|
|
1384
|
+
var removeScrollBar = props.removeScrollBar, inert = props.inert;
|
|
1385
|
+
return (React__namespace.createElement(React__namespace.Fragment, null,
|
|
1386
|
+
inert ? React__namespace.createElement(Style, { styles: generateStyle(id) }) : null,
|
|
1387
|
+
removeScrollBar ? React__namespace.createElement(component.RemoveScrollBar, { gapMode: "margin" }) : null));
|
|
1388
|
+
}
|
|
1389
|
+
|
|
1390
|
+
var SideCar = component.exportSidecar(effectCar, RemoveScrollSideCar);
|
|
1391
|
+
|
|
1392
|
+
var ReactRemoveScroll = React__namespace.forwardRef(function (props, ref) { return (React__namespace.createElement(RemoveScroll, filterDataAttrs.__assign({}, props, { ref: ref, sideCar: SideCar }))); });
|
|
1393
|
+
ReactRemoveScroll.classNames = RemoveScroll.classNames;
|
|
1394
|
+
var $am6gm$RemoveScroll = ReactRemoveScroll;
|
|
1395
|
+
|
|
142
1396
|
/* -------------------------------------------------------------------------------------------------
|
|
143
1397
|
* Popover
|
|
144
1398
|
* -----------------------------------------------------------------------------------------------*/ const $cb5cc270b50c6fcd$var$POPOVER_NAME = 'Popover';
|
|
145
1399
|
const [$cb5cc270b50c6fcd$var$createPopoverContext, $cb5cc270b50c6fcd$export$c8393c9e73286932] = index.$c512c27ab02ef895$export$50c7b4e9d9f19c1($cb5cc270b50c6fcd$var$POPOVER_NAME, [
|
|
146
|
-
|
|
1400
|
+
$cf1ac5d9fe0e8206$export$722aac194ae923
|
|
147
1401
|
]);
|
|
148
|
-
const $cb5cc270b50c6fcd$var$usePopperScope =
|
|
1402
|
+
const $cb5cc270b50c6fcd$var$usePopperScope = $cf1ac5d9fe0e8206$export$722aac194ae923();
|
|
149
1403
|
const [$cb5cc270b50c6fcd$var$PopoverProvider, $cb5cc270b50c6fcd$var$usePopoverContext] = $cb5cc270b50c6fcd$var$createPopoverContext($cb5cc270b50c6fcd$var$POPOVER_NAME);
|
|
150
1404
|
const $cb5cc270b50c6fcd$export$5b6b19405a83ff9d = (props)=>{
|
|
151
1405
|
const { __scopePopover: __scopePopover , children: children , open: openProp , defaultOpen: defaultOpen , onOpenChange: onOpenChange , modal: modal = false } = props;
|
|
@@ -157,7 +1411,7 @@ const $cb5cc270b50c6fcd$export$5b6b19405a83ff9d = (props)=>{
|
|
|
157
1411
|
defaultProp: defaultOpen,
|
|
158
1412
|
onChange: onOpenChange
|
|
159
1413
|
});
|
|
160
|
-
return /*#__PURE__*/ React.createElement(
|
|
1414
|
+
return /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$export$be92b6f5f03c0fe9, popperScope, /*#__PURE__*/ React.createElement($cb5cc270b50c6fcd$var$PopoverProvider, {
|
|
161
1415
|
scope: __scopePopover,
|
|
162
1416
|
contentId: index$2.$1746a345f3d73bb7$export$f680877a34711e37(),
|
|
163
1417
|
triggerRef: triggerRef,
|
|
@@ -192,7 +1446,7 @@ const $cb5cc270b50c6fcd$export$96e5381f42521a79 = /*#__PURE__*/ React.forwardRef
|
|
|
192
1446
|
onCustomAnchorAdd,
|
|
193
1447
|
onCustomAnchorRemove
|
|
194
1448
|
]);
|
|
195
|
-
return /*#__PURE__*/ React.createElement(
|
|
1449
|
+
return /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$export$b688253958b8dfe7, _extends._extends({}, popperScope, anchorProps, {
|
|
196
1450
|
ref: forwardedRef
|
|
197
1451
|
}));
|
|
198
1452
|
});
|
|
@@ -208,9 +1462,9 @@ const $cb5cc270b50c6fcd$export$dd679ffb4362d2d4 = (props)=>{
|
|
|
208
1462
|
return /*#__PURE__*/ React.createElement($cb5cc270b50c6fcd$var$PortalProvider, {
|
|
209
1463
|
scope: __scopePopover,
|
|
210
1464
|
forceMount: forceMount
|
|
211
|
-
}, /*#__PURE__*/ React.createElement(index
|
|
1465
|
+
}, /*#__PURE__*/ React.createElement(index.$921a889cee6df7e8$export$99c2b779aa4e8b8b, {
|
|
212
1466
|
present: forceMount || context.open
|
|
213
|
-
}, /*#__PURE__*/ React.createElement(
|
|
1467
|
+
}, /*#__PURE__*/ React.createElement($f1701beae083dbae$export$602eac185826482c, {
|
|
214
1468
|
asChild: true,
|
|
215
1469
|
container: container
|
|
216
1470
|
}, children)));
|
|
@@ -222,7 +1476,7 @@ const $cb5cc270b50c6fcd$export$d7e1f420b25549ff = /*#__PURE__*/ React.forwardRef
|
|
|
222
1476
|
const portalContext = $cb5cc270b50c6fcd$var$usePortalContext($cb5cc270b50c6fcd$var$CONTENT_NAME, props.__scopePopover);
|
|
223
1477
|
const { forceMount: forceMount = portalContext.forceMount , ...contentProps } = props;
|
|
224
1478
|
const context = $cb5cc270b50c6fcd$var$usePopoverContext($cb5cc270b50c6fcd$var$CONTENT_NAME, props.__scopePopover);
|
|
225
|
-
return /*#__PURE__*/ React.createElement(index
|
|
1479
|
+
return /*#__PURE__*/ React.createElement(index.$921a889cee6df7e8$export$99c2b779aa4e8b8b, {
|
|
226
1480
|
present: forceMount || context.open
|
|
227
1481
|
}, context.modal ? /*#__PURE__*/ React.createElement($cb5cc270b50c6fcd$var$PopoverContentModal, _extends._extends({}, contentProps, {
|
|
228
1482
|
ref: forwardedRef
|
|
@@ -237,9 +1491,9 @@ const $cb5cc270b50c6fcd$export$d7e1f420b25549ff = /*#__PURE__*/ React.forwardRef
|
|
|
237
1491
|
const isRightClickOutsideRef = React.useRef(false); // aria-hide everything except the content (better supported equivalent to setting aria-modal)
|
|
238
1492
|
React.useEffect(()=>{
|
|
239
1493
|
const content = contentRef.current;
|
|
240
|
-
if (content) return
|
|
1494
|
+
if (content) return hideOthers(content);
|
|
241
1495
|
}, []);
|
|
242
|
-
return /*#__PURE__*/ React.createElement(
|
|
1496
|
+
return /*#__PURE__*/ React.createElement($am6gm$RemoveScroll, {
|
|
243
1497
|
as: index.$5e63c961fc1ce211$export$8c6ed5c666ac1360,
|
|
244
1498
|
allowPinchZoom: true
|
|
245
1499
|
}, /*#__PURE__*/ React.createElement($cb5cc270b50c6fcd$var$PopoverContentImpl, _extends._extends({}, props, {
|
|
@@ -310,14 +1564,14 @@ const $cb5cc270b50c6fcd$var$PopoverContentNonModal = /*#__PURE__*/ React.forward
|
|
|
310
1564
|
const context = $cb5cc270b50c6fcd$var$usePopoverContext($cb5cc270b50c6fcd$var$CONTENT_NAME, __scopePopover);
|
|
311
1565
|
const popperScope = $cb5cc270b50c6fcd$var$usePopperScope(__scopePopover); // Make sure the whole tree has focus guards as our `Popover` may be
|
|
312
1566
|
// the last element in the DOM (beacuse of the `Portal`)
|
|
313
|
-
|
|
314
|
-
return /*#__PURE__*/ React.createElement(
|
|
1567
|
+
$3db38b7d1fb3fe6a$export$b7ece24a22aeda8c();
|
|
1568
|
+
return /*#__PURE__*/ React.createElement($d3863c46a17e8a28$export$20e40289641fbbb6, {
|
|
315
1569
|
asChild: true,
|
|
316
1570
|
loop: true,
|
|
317
1571
|
trapped: trapFocus,
|
|
318
1572
|
onMountAutoFocus: onOpenAutoFocus,
|
|
319
1573
|
onUnmountAutoFocus: onCloseAutoFocus
|
|
320
|
-
}, /*#__PURE__*/ React.createElement(
|
|
1574
|
+
}, /*#__PURE__*/ React.createElement($5cb92bef7577960e$export$177fb62ff3ec1f22, {
|
|
321
1575
|
asChild: true,
|
|
322
1576
|
disableOutsidePointerEvents: disableOutsidePointerEvents,
|
|
323
1577
|
onInteractOutside: onInteractOutside,
|
|
@@ -325,7 +1579,7 @@ const $cb5cc270b50c6fcd$var$PopoverContentNonModal = /*#__PURE__*/ React.forward
|
|
|
325
1579
|
onPointerDownOutside: onPointerDownOutside,
|
|
326
1580
|
onFocusOutside: onFocusOutside,
|
|
327
1581
|
onDismiss: ()=>context.onOpenChange(false)
|
|
328
|
-
}, /*#__PURE__*/ React.createElement(
|
|
1582
|
+
}, /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2, _extends._extends({
|
|
329
1583
|
"data-state": $cb5cc270b50c6fcd$var$getState(context.open),
|
|
330
1584
|
role: "dialog",
|
|
331
1585
|
id: context.contentId
|
|
@@ -543,7 +1797,7 @@ var DatePicker = React.forwardRef(function (_a, ref) {
|
|
|
543
1797
|
var handleAutoFocus = function (e) {
|
|
544
1798
|
e.preventDefault();
|
|
545
1799
|
};
|
|
546
|
-
return (React__default["default"].createElement("div", { className: index$
|
|
1800
|
+
return (React__default["default"].createElement("div", { className: index$3.classNames({
|
|
547
1801
|
"arc-DatePicker--constrained": !isFluid
|
|
548
1802
|
}) },
|
|
549
1803
|
React__default["default"].createElement(TextInput.TextInputWithPlaceHolder, filterDataAttrs.__assign({ ref: getDatePickerRef, iconButton: {
|