@preply/ds-web-lib 11.0.0 → 11.1.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/Accordion-B0hR-tcI.js +96 -0
- package/dist/AlertBannerProvider-Cf7w9AOq.js +76 -0
- package/dist/AlertDialog-BG-diKBi.js +475 -0
- package/dist/Avatar-B-JdqVyg.js +66 -0
- package/dist/AvatarWithStatus-CD9jEqEB.js +36 -0
- package/dist/Badge-Dd-CLBoW.js +50 -0
- package/dist/Box-BJBE9KNm.js +91 -0
- package/dist/BubbleCounter.module-BU2S0euA.js +16 -0
- package/dist/Button-C35BZJZT.js +91 -0
- package/dist/ButtonBase-8eUyTWxX.js +215 -0
- package/dist/Checkbox-CtolNbxI.js +108 -0
- package/dist/Chips-BRGw7Uup.js +99 -0
- package/dist/ChipsPrimitive-Bezq7ptE.js +1179 -0
- package/dist/CountryFlag-DVDKHmQH.js +43 -0
- package/dist/Dialog.module-Db2BJAn4.js +21 -0
- package/dist/DialogCloseButton-DjDd9Mid.js +98 -0
- package/dist/DialogDescription-8zw9t6pm.js +44 -0
- package/dist/DialogRoot-B67oJduC.js +335 -0
- package/dist/DialogRootContext-Bz8RW-Mq.js +12 -0
- package/dist/DialogTitle-C2Nn2ys-.js +43 -0
- package/dist/Divider-DvwDWB9_.js +17 -0
- package/dist/DropdownMenu.primitives-BrsTBvMk.js +4007 -0
- package/dist/FieldButton-B2slox8P.js +32 -0
- package/dist/FormControl-qnbQL1iF.js +128 -0
- package/dist/Heading-DA9gHfsx.js +71 -0
- package/dist/Icon-CixAeOSd.js +48 -0
- package/dist/IconButton-BPKpgfep.js +31 -0
- package/dist/InputContainer-CzzuOe_p.js +38 -0
- package/dist/LayoutFlex-e9auDvWD.js +86 -0
- package/dist/LayoutFlexItem-D9ziMmHe.js +48 -0
- package/dist/LayoutGridItem-Q8Lnvrri.js +34 -0
- package/dist/Link-CdoJVeER.js +66 -0
- package/dist/Loader-BMOxdJce.js +26 -0
- package/dist/OnboardingTooltip-B47_Yrsj.js +165 -0
- package/dist/OnboardingTour-DUUoI5WE.js +131 -0
- package/dist/PasswordField-Bx5YG62t.js +93 -0
- package/dist/PreplyLogo-abgOre30.js +112 -0
- package/dist/ProgressBar-CEU4GyHn.js +31 -0
- package/dist/ProgressSteps-BSqopxqv.js +45 -0
- package/dist/Select-Bo7PX_8V.js +124 -0
- package/dist/Slider-Crg4DEn_.js +64 -0
- package/dist/Spinner-Ck8KQA22.js +86 -0
- package/dist/Stars-D5QspUBE.js +72 -0
- package/dist/Steps-DbN5vFrP.js +173 -0
- package/dist/Switch-Ck_xB0ID.js +49 -0
- package/dist/Text-CaOF75Z-.js +121 -0
- package/dist/TextHighlighted-Dwq9Clgn.js +34 -0
- package/dist/TextInline-BcA4H2Tk.js +34 -0
- package/dist/Toast-wJAjSLfo.js +1019 -0
- package/dist/TokyoUIChevronDown-DGcVqR1z.js +14 -0
- package/dist/Tooltip-grvKQxTN.js +84 -0
- package/dist/VisuallyHidden-CtcHcZCK.js +29 -0
- package/dist/align-self-VrZUceie.js +42 -0
- package/dist/assets/Accordion.css +2 -2
- package/dist/assets/AlertBannerProvider.css +2 -2
- package/dist/assets/AlertDialog.css +2 -2
- package/dist/assets/Avatar.css +3 -3
- package/dist/assets/AvatarWithStatus.css +2 -2
- package/dist/assets/Badge.css +1 -1
- package/dist/assets/Box.css +3 -3
- package/dist/assets/BubbleCounter.css +1 -1
- package/dist/assets/Button.css +4 -4
- package/dist/assets/ButtonBase.css +40 -46
- package/dist/assets/Checkbox.css +1 -1
- package/dist/assets/Chips.css +2 -2
- package/dist/assets/ChipsPrimitive.css +2 -2
- package/dist/assets/CountryFlag.css +1 -1
- package/dist/assets/Dialog.css +13 -4
- package/dist/assets/Divider.css +1 -1
- package/dist/assets/DropdownMenu.css +2 -2
- package/dist/assets/FieldButton.css +3 -3
- package/dist/assets/FormControl.css +1 -1
- package/dist/assets/Heading.css +3 -3
- package/dist/assets/Icon.css +3 -3
- package/dist/assets/InputContainer.css +2 -2
- package/dist/assets/LayoutFlex.css +1 -1
- package/dist/assets/LayoutFlexItem.css +1 -1
- package/dist/assets/Link.css +3 -3
- package/dist/assets/Loader.css +1 -1
- package/dist/assets/OnboardingTooltip.css +1 -1
- package/dist/assets/OnboardingTour.css +1 -1
- package/dist/assets/PreplyLogo.css +1 -1
- package/dist/assets/ProgressBar.css +1 -1
- package/dist/assets/ProgressSteps.css +1 -1
- package/dist/assets/Select.css +2 -2
- package/dist/assets/Slider.css +1 -1
- package/dist/assets/Spinner.css +3 -3
- package/dist/assets/Stars.css +3 -3
- package/dist/assets/Steps.css +2 -2
- package/dist/assets/Switch.css +1 -1
- package/dist/assets/Text.css +3 -3
- package/dist/assets/TextHighlighted.css +3 -3
- package/dist/assets/TextInline.css +3 -3
- package/dist/assets/Toast.css +2 -2
- package/dist/assets/Tooltip.css +1 -1
- package/dist/assets/align-self.css +1 -1
- package/dist/assets/{IconTile.css → components.css} +1 -1
- package/dist/assets/exp-color.css +2 -2
- package/dist/assets/index.css +1 -1
- package/dist/assets/layout-gap.css +3 -3
- package/dist/assets/layout-grid.css +3 -3
- package/dist/assets/layout-hide.css +1 -1
- package/dist/assets/layout-padding.css +3 -3
- package/dist/assets/layout-relative.css +1 -1
- package/dist/assets/text-accent.css +2 -2
- package/dist/assets/text-centered.css +1 -1
- package/dist/assets/text-weight.css +2 -2
- package/dist/chunk-BVTlhY3a.js +24 -0
- package/dist/components/Accordion/Accordion.js +4 -60
- package/dist/components/Accordion/hooks/useOnOpenChange.js +19 -28
- package/dist/components/AlertBanner/AlertBanner.js +11 -26
- package/dist/components/AlertBanner/AlertBannerProvider.js +3 -8
- package/dist/components/AlertBanner/primitives/AlertBannerAction.js +11 -69
- package/dist/components/AlertBanner/primitives/AlertBannerIcon.js +77 -39
- package/dist/components/AlertBanner/primitives/AlertBannerRoot.js +26 -22
- package/dist/components/AlertBanner/primitives/AlertBannerText.js +11 -70
- package/dist/components/AlertDialog/AlertDialog.js +5 -430
- package/dist/components/Avatar/Avatar.js +3 -71
- package/dist/components/AvatarWithStatus/AvatarWithStatus.js +3 -43
- package/dist/components/Badge/Badge.js +4 -62
- package/dist/components/Box/Box.js +3 -95
- package/dist/components/BubbleCounter/BubbleCounter.js +23 -28
- package/dist/components/Button/Button.js +4 -80
- package/dist/components/CalloutBanner/CalloutBanner.js +61 -12
- package/dist/components/CalloutBanner/primitives/CalloutBannerDismissButton.js +50 -22
- package/dist/components/CalloutBanner/primitives/CalloutBannerIcon.js +86 -45
- package/dist/components/CalloutBanner/primitives/CalloutBannerRoot.js +50 -24
- package/dist/components/CalloutBanner/primitives/CalloutBannerText.js +41 -11
- package/dist/components/Checkbox/Checkbox.js +4 -78
- package/dist/components/Checkbox/hooks/useIndeterminate.js +24 -30
- package/dist/components/Chips/Chips.types.js +0 -1
- package/dist/components/Chips/DismissibleChips.js +117 -86
- package/dist/components/Chips/MultiSelectChips.js +98 -64
- package/dist/components/Chips/SingleSelectChips.js +94 -57
- package/dist/components/Chips/private/ChipsPrimitive.js +4 -17
- package/dist/components/CountryFlag/CountryFlag.js +3 -44
- package/dist/components/Dialog/Dialog.js +56 -31
- package/dist/components/Dialog/DialogSteps.js +40 -29
- package/dist/components/Dialog/primitives/DialogActions.js +26 -19
- package/dist/components/Dialog/primitives/DialogButtonStack.d.ts.map +1 -1
- package/dist/components/Dialog/primitives/DialogButtonStack.js +22 -15
- package/dist/components/Dialog/primitives/DialogCloseButton.d.ts +1 -1
- package/dist/components/Dialog/primitives/DialogCloseButton.d.ts.map +1 -1
- package/dist/components/Dialog/primitives/DialogCloseButton.js +4 -67
- package/dist/components/Dialog/primitives/DialogDescription.js +3 -43
- package/dist/components/Dialog/primitives/DialogFooter.js +37 -34
- package/dist/components/Dialog/primitives/DialogRoot.js +4 -315
- package/dist/components/Dialog/primitives/DialogTitle.js +3 -42
- package/dist/components/Divider/Divider.js +3 -14
- package/dist/components/DropdownMenu/DropdownMenu.js +253 -188
- package/dist/components/DropdownMenu/primitives/DropdownMenu.primitives.js +5 -34
- package/dist/components/DropdownMenu/primitives/DropdownMenuSelectItem.primitives.js +121 -71
- package/dist/components/FieldButton/FieldButton.js +3 -37
- package/dist/components/FormControl/FormControl.js +3 -105
- package/dist/components/Heading/Heading.js +3 -78
- package/dist/components/Icon/Icon.js +4 -49
- package/dist/components/IconButton/IconButton.d.ts +5 -1
- package/dist/components/IconButton/IconButton.d.ts.map +1 -1
- package/dist/components/IconButton/IconButton.js +4 -28
- package/dist/components/IconTile/IconTile.js +11 -69
- package/dist/components/IntlFormatted/IntlFormattedAggregatedDateTime.js +16 -32
- package/dist/components/IntlFormatted/IntlFormattedCurrency.js +20 -42
- package/dist/components/IntlFormatted/IntlFormattedDate.js +73 -195
- package/dist/components/IntlFormatted/IntlFormattedTime.js +14 -24
- package/dist/components/IntlFormatted/Wrapper.js +14 -8
- package/dist/components/LayoutFlex/LayoutFlex.js +3 -100
- package/dist/components/LayoutFlex/style/getStyleAttrs.js +71 -143
- package/dist/components/LayoutFlex/tests/AlignItems.js +67 -97
- package/dist/components/LayoutFlex/tests/ColumnReverse.js +63 -100
- package/dist/components/LayoutFlex/tests/DataOverride.js +1498 -1093
- package/dist/components/LayoutFlex/tests/Default.js +19 -20
- package/dist/components/LayoutFlex/tests/Direction.js +65 -88
- package/dist/components/LayoutFlex/tests/Gap.js +115 -197
- package/dist/components/LayoutFlex/tests/HideInline.js +95 -136
- package/dist/components/LayoutFlex/tests/JustifyContent.js +75 -108
- package/dist/components/LayoutFlex/tests/Nowrap.js +35 -42
- package/dist/components/LayoutFlex/tests/Padding.js +207 -263
- package/dist/components/LayoutFlex/tests/Relative.js +49 -64
- package/dist/components/LayoutFlexItem/LayoutFlexItem.js +3 -54
- package/dist/components/LayoutGrid/LayoutGrid.js +26 -34
- package/dist/components/LayoutGridItem/LayoutGridItem.js +3 -41
- package/dist/components/Link/Link.js +3 -72
- package/dist/components/Loader/Loader.js +3 -32
- package/dist/components/NumberField/NumberField.js +33 -35
- package/dist/components/ObserveIntersection/ObserveIntersection.js +41 -42
- package/dist/components/OnboardingTooltip/OnboardingTooltip.js +4 -115
- package/dist/components/OnboardingTour/OnboardingTour.js +4 -114
- package/dist/components/PasswordField/PasswordField.js +3 -78
- package/dist/components/PreplyLogo/PreplyLogo.js +3 -81
- package/dist/components/ProgressBar/ProgressBar.js +3 -27
- package/dist/components/ProgressSteps/ProgressSteps.js +3 -48
- package/dist/components/Rating/Rating.js +29 -20
- package/dist/components/Rating/RatingInput.js +57 -59
- package/dist/components/Rating/Stars.js +4 -8
- package/dist/components/Rating/hooks/useHasError.js +11 -15
- package/dist/components/Rating/hooks/useHoverPercentage.js +37 -45
- package/dist/components/Rating/hooks/useInputState.js +18 -24
- package/dist/components/Rating/hooks/useLocalizations.js +12 -24
- package/dist/components/Rating/utils/roundToHalfDecimal.js +4 -4
- package/dist/components/SelectField/Select.js +5 -112
- package/dist/components/SelectField/SelectField.js +29 -24
- package/dist/components/SelectField/hooks/useBreakpointMatch.js +18 -19
- package/dist/components/ShowOnIntersection/ShowOnIntersection.js +32 -21
- package/dist/components/Slider/RangeSlider.js +62 -52
- package/dist/components/Slider/Slider.js +3 -10
- package/dist/components/Steps/Steps.js +4 -210
- package/dist/components/Switch/Switch.js +3 -51
- package/dist/components/Text/Text.js +3 -128
- package/dist/components/TextField/TextField.js +27 -29
- package/dist/components/TextHighlighted/TextHighlighted.js +3 -41
- package/dist/components/TextInline/TextInline.js +3 -40
- package/dist/components/TextareaField/TextareaField.js +26 -28
- package/dist/components/Toast/Toast.js +4 -1168
- package/dist/components/Tooltip/Tooltip.js +3 -66
- package/dist/components/deprecated/Chips/Chips.js +4 -76
- package/dist/components/deprecated/NativeSelectField/NativeSelect.js +40 -32
- package/dist/components/deprecated/NativeSelectField/NativeSelectField.js +34 -33
- package/dist/components/deprecated/index.js +5 -6
- package/dist/components/index.js +50 -150
- package/dist/components/private/ButtonBase/ButtonBase.d.ts +7 -11
- package/dist/components/private/ButtonBase/ButtonBase.d.ts.map +1 -1
- package/dist/components/private/ButtonBase/ButtonBase.js +3 -247
- package/dist/components/private/Input/Input.js +27 -19
- package/dist/components/private/Input/InputContainer.js +3 -5
- package/dist/components/private/Input/Textarea.js +24 -20
- package/dist/components/private/Input/index.js +2 -4
- package/dist/components/private/Spinner/Spinner.js +3 -52
- package/dist/components/private/VisuallyHidden/VisuallyHidden.js +3 -15
- package/dist/components-BIYP8wHJ.js +200 -0
- package/dist/exp-color-C5mKAN91.js +74 -0
- package/dist/floating-ui.utils.dom-CoeTbDZx.js +215 -0
- package/dist/index.js +50 -150
- package/dist/index.module-1c7ENvxc.js +7 -0
- package/dist/jsx-runtime-i4KUlhDu.js +743 -0
- package/dist/layout-gap.module-DLD8bcR4.js +95 -0
- package/dist/layout-grid.module-CZfhrKrB.js +101 -0
- package/dist/layout-hide.module-B1P0N4i3.js +53 -0
- package/dist/layout-padding-ugY-yd2q.js +389 -0
- package/dist/layout-relative.module-B5xrFD9j.js +6 -0
- package/dist/render-icon-Ch3b2dE0.js +290 -0
- package/dist/shared-styles/align-self/align-self.js +2 -36
- package/dist/shared-styles/exp-color/exp-color.js +2 -68
- package/dist/shared-styles/layout-gap/layout-gap.js +13 -7
- package/dist/shared-styles/layout-grid/layout-grid.js +28 -28
- package/dist/shared-styles/layout-grid-responsive-columns/layout-grid-responsive-columns.js +29 -43
- package/dist/shared-styles/layout-hide/layout-hide.js +8 -8
- package/dist/shared-styles/layout-padding/layout-padding.js +2 -5
- package/dist/shared-styles/layout-relative/layout-relative.js +14 -8
- package/dist/shared-styles/text-accent/text-accent.js +2 -25
- package/dist/shared-styles/text-centered/text-centered.js +2 -24
- package/dist/shared-styles/text-weight/text-weight.js +2 -15
- package/dist/store-sN_eYeZT.js +1064 -0
- package/dist/storybook-utils/consts.js +6 -8
- package/dist/storybook-utils/index.js +1 -5
- package/dist/text-accent-CfUFx-1K.js +30 -0
- package/dist/text-centered-Dwp2_-Yp.js +30 -0
- package/dist/text-weight-CwoqmM4o.js +21 -0
- package/dist/useBaseUiId-CWAD_PSs.js +13 -0
- package/dist/useBreakpointMatch-D9a3CTNK.js +338 -0
- package/dist/useButton-DHTh3Hm7.js +148 -0
- package/dist/useDialogClose-BzFIyWco.js +22 -0
- package/dist/useId-CJsH-2wV.js +34 -0
- package/dist/useOpenInteractionType-D8vA_ZKI.js +4104 -0
- package/dist/useRenderElement-ZBds6eRN.js +341 -0
- package/dist/utils/Orientation/OrientationProvider.js +54 -23
- package/dist/utils/Orientation/index.js +2 -4
- package/dist/utils/RovingTabIndex/RovingTabIndexProvider.js +70 -44
- package/dist/utils/RovingTabIndex/index.js +2 -4
- package/dist/utils/createRequiredContext.js +23 -13
- package/dist/utils/filterAttributesPassedByRadixUIAtRuntime.js +28 -25
- package/dist/utils/render-icon.js +3 -320
- package/dist/utils/shared-strings.js +24 -32
- package/dist/utils/useBreakpointMatch.d.ts.map +1 -1
- package/dist/utils/useBreakpointMatch.js +2 -183
- package/dist/utils/useControllableState/useControllableState.js +31 -25
- package/dist/utils/useMergeRefs.js +29 -14
- package/dist/utils/useStableCallback/useStableCallback.js +28 -13
- package/package.json +17 -22
- package/dist/AlertBannerProvider-DTx2Xp3V.js +0 -50
- package/dist/BubbleCounter.module-QMwXWFIS.js +0 -16
- package/dist/ChipsPrimitive-DzsaOWgY.js +0 -1244
- package/dist/Dialog.module-Ba1X7b3N.js +0 -29
- package/dist/DialogRootContext-BCXmmJAw.js +0 -15
- package/dist/DropdownMenu.primitives-B3WK71bR.js +0 -5871
- package/dist/IconTile-D1G7MljH.js +0 -172
- package/dist/InputContainer-oHJlLWIi.js +0 -30
- package/dist/Slider-DB4Maswa.js +0 -55
- package/dist/Stars-C_mHop2H.js +0 -67
- package/dist/TokyoUIChevronDown-D_tD1yU8.js +0 -11
- package/dist/floating-ui.utils.dom-3OgjGonN.js +0 -234
- package/dist/index.module-Q9TzIR6B.js +0 -11
- package/dist/layout-gap.module-MKn_un_k.js +0 -97
- package/dist/layout-grid.module-P4B4WVUy.js +0 -103
- package/dist/layout-hide.module-Bpl3Pl-a.js +0 -55
- package/dist/layout-padding-D5I6rRlL.js +0 -373
- package/dist/layout-relative.module-1z75aSwo.js +0 -8
- package/dist/store-BUKWfVf3.js +0 -1155
- package/dist/useBaseUiId-DavsGYu9.js +0 -8
- package/dist/useButton-CFPpP0o5.js +0 -193
- package/dist/useDialogClose-C9x1leGd.js +0 -34
- package/dist/useId-BhIOp2JG.js +0 -28
- package/dist/useOpenInteractionType-Cj41-8Yk.js +0 -2880
- package/dist/useRenderElement-DtYPTE_y.js +0 -350
|
@@ -0,0 +1,4104 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { t as require_jsx_runtime } from "./jsx-runtime-i4KUlhDu.js";
|
|
3
|
+
import { a as useMergedRefs, d as NOOP, f as useRefWithInit, i as isReactVersionAtLeast, u as EMPTY_OBJECT } from "./useRenderElement-ZBds6eRN.js";
|
|
4
|
+
import { S as useEventCallback, _ as isTableElement, a as getNodeName, b as createChangeEventDetails, c as getParentNode, d as isElement, f as isHTMLElement, g as isShadowRoot, h as isOverflowElement, i as getFrameElement, l as getWindow, m as isNode, n as getContainingBlock, o as getNodeScroll, p as isLastTraversableNode, r as getDocumentElement, s as getOverflowAncestors, t as getComputedStyle$1, u as isContainingBlock, v as isTopLayer, x as useIsoLayoutEffect, y as isWebKit$1 } from "./floating-ui.utils.dom-CoeTbDZx.js";
|
|
5
|
+
import { t as useId$1 } from "./useId-CJsH-2wV.js";
|
|
6
|
+
import * as React$1 from "react";
|
|
7
|
+
import { useLayoutEffect } from "react";
|
|
8
|
+
import * as ReactDOM$1 from "react-dom";
|
|
9
|
+
//#region ../../node_modules/@base-ui-components/utils/esm/useOnMount.js
|
|
10
|
+
var EMPTY$2 = [];
|
|
11
|
+
/**
|
|
12
|
+
* A React.useEffect equivalent that runs once, when the component is mounted.
|
|
13
|
+
*/
|
|
14
|
+
function useOnMount(fn) {
|
|
15
|
+
React$1.useEffect(fn, EMPTY$2);
|
|
16
|
+
}
|
|
17
|
+
//#endregion
|
|
18
|
+
//#region \0@oxc-project+runtime@0.115.0/helpers/typeof.js
|
|
19
|
+
function _typeof(o) {
|
|
20
|
+
"@babel/helpers - typeof";
|
|
21
|
+
return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) {
|
|
22
|
+
return typeof o;
|
|
23
|
+
} : function(o) {
|
|
24
|
+
return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
|
|
25
|
+
}, _typeof(o);
|
|
26
|
+
}
|
|
27
|
+
//#endregion
|
|
28
|
+
//#region \0@oxc-project+runtime@0.115.0/helpers/toPrimitive.js
|
|
29
|
+
function toPrimitive(t, r) {
|
|
30
|
+
if ("object" != _typeof(t) || !t) return t;
|
|
31
|
+
var e = t[Symbol.toPrimitive];
|
|
32
|
+
if (void 0 !== e) {
|
|
33
|
+
var i = e.call(t, r || "default");
|
|
34
|
+
if ("object" != _typeof(i)) return i;
|
|
35
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
36
|
+
}
|
|
37
|
+
return ("string" === r ? String : Number)(t);
|
|
38
|
+
}
|
|
39
|
+
//#endregion
|
|
40
|
+
//#region \0@oxc-project+runtime@0.115.0/helpers/toPropertyKey.js
|
|
41
|
+
function toPropertyKey(t) {
|
|
42
|
+
var i = toPrimitive(t, "string");
|
|
43
|
+
return "symbol" == _typeof(i) ? i : i + "";
|
|
44
|
+
}
|
|
45
|
+
//#endregion
|
|
46
|
+
//#region \0@oxc-project+runtime@0.115.0/helpers/defineProperty.js
|
|
47
|
+
function _defineProperty(e, r, t) {
|
|
48
|
+
return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
|
|
49
|
+
value: t,
|
|
50
|
+
enumerable: !0,
|
|
51
|
+
configurable: !0,
|
|
52
|
+
writable: !0
|
|
53
|
+
}) : e[r] = t, e;
|
|
54
|
+
}
|
|
55
|
+
//#endregion
|
|
56
|
+
//#region ../../node_modules/@base-ui-components/utils/esm/useAnimationFrame.js
|
|
57
|
+
/** Unlike `setTimeout`, rAF doesn't guarantee a positive integer return value, so we can't have
|
|
58
|
+
* a monomorphic `uint` type with `0` meaning empty.
|
|
59
|
+
* See warning note at:
|
|
60
|
+
* https://developer.mozilla.org/en-US/docs/Web/API/Window/requestAnimationFrame#return_value */
|
|
61
|
+
var EMPTY$1 = null;
|
|
62
|
+
var LAST_RAF = globalThis.requestAnimationFrame;
|
|
63
|
+
var Scheduler = class {
|
|
64
|
+
constructor() {
|
|
65
|
+
_defineProperty(this, "callbacks", []);
|
|
66
|
+
_defineProperty(this, "callbacksCount", 0);
|
|
67
|
+
_defineProperty(this, "nextId", 1);
|
|
68
|
+
_defineProperty(this, "startId", 1);
|
|
69
|
+
_defineProperty(this, "isScheduled", false);
|
|
70
|
+
_defineProperty(this, "tick", (timestamp) => {
|
|
71
|
+
this.isScheduled = false;
|
|
72
|
+
const currentCallbacks = this.callbacks;
|
|
73
|
+
const currentCallbacksCount = this.callbacksCount;
|
|
74
|
+
this.callbacks = [];
|
|
75
|
+
this.callbacksCount = 0;
|
|
76
|
+
this.startId = this.nextId;
|
|
77
|
+
if (currentCallbacksCount > 0) for (let i = 0; i < currentCallbacks.length; i += 1) {
|
|
78
|
+
var _currentCallbacks$i;
|
|
79
|
+
(_currentCallbacks$i = currentCallbacks[i]) === null || _currentCallbacks$i === void 0 || _currentCallbacks$i.call(currentCallbacks, timestamp);
|
|
80
|
+
}
|
|
81
|
+
});
|
|
82
|
+
}
|
|
83
|
+
request(fn) {
|
|
84
|
+
const id = this.nextId;
|
|
85
|
+
this.nextId += 1;
|
|
86
|
+
this.callbacks.push(fn);
|
|
87
|
+
this.callbacksCount += 1;
|
|
88
|
+
const didRAFChange = process.env.NODE_ENV === "test" && LAST_RAF !== requestAnimationFrame && (LAST_RAF = requestAnimationFrame, true);
|
|
89
|
+
if (!this.isScheduled || didRAFChange) {
|
|
90
|
+
requestAnimationFrame(this.tick);
|
|
91
|
+
this.isScheduled = true;
|
|
92
|
+
}
|
|
93
|
+
return id;
|
|
94
|
+
}
|
|
95
|
+
cancel(id) {
|
|
96
|
+
const index = id - this.startId;
|
|
97
|
+
if (index < 0 || index >= this.callbacks.length) return;
|
|
98
|
+
this.callbacks[index] = null;
|
|
99
|
+
this.callbacksCount -= 1;
|
|
100
|
+
}
|
|
101
|
+
};
|
|
102
|
+
var scheduler = new Scheduler();
|
|
103
|
+
var AnimationFrame = class AnimationFrame {
|
|
104
|
+
constructor() {
|
|
105
|
+
_defineProperty(this, "currentId", EMPTY$1);
|
|
106
|
+
_defineProperty(this, "cancel", () => {
|
|
107
|
+
if (this.currentId !== EMPTY$1) {
|
|
108
|
+
scheduler.cancel(this.currentId);
|
|
109
|
+
this.currentId = EMPTY$1;
|
|
110
|
+
}
|
|
111
|
+
});
|
|
112
|
+
_defineProperty(this, "disposeEffect", () => {
|
|
113
|
+
return this.cancel;
|
|
114
|
+
});
|
|
115
|
+
}
|
|
116
|
+
static create() {
|
|
117
|
+
return new AnimationFrame();
|
|
118
|
+
}
|
|
119
|
+
static request(fn) {
|
|
120
|
+
return scheduler.request(fn);
|
|
121
|
+
}
|
|
122
|
+
static cancel(id) {
|
|
123
|
+
return scheduler.cancel(id);
|
|
124
|
+
}
|
|
125
|
+
/**
|
|
126
|
+
* Executes `fn` after `delay`, clearing any previously scheduled call.
|
|
127
|
+
*/
|
|
128
|
+
request(fn) {
|
|
129
|
+
this.cancel();
|
|
130
|
+
this.currentId = scheduler.request(() => {
|
|
131
|
+
this.currentId = EMPTY$1;
|
|
132
|
+
fn();
|
|
133
|
+
});
|
|
134
|
+
}
|
|
135
|
+
};
|
|
136
|
+
/**
|
|
137
|
+
* A `requestAnimationFrame` with automatic cleanup and guard.
|
|
138
|
+
*/
|
|
139
|
+
function useAnimationFrame() {
|
|
140
|
+
const timeout = useRefWithInit(AnimationFrame.create).current;
|
|
141
|
+
useOnMount(timeout.disposeEffect);
|
|
142
|
+
return timeout;
|
|
143
|
+
}
|
|
144
|
+
//#endregion
|
|
145
|
+
//#region ../../node_modules/@base-ui-components/react/esm/utils/useAnimationsFinished.js
|
|
146
|
+
/**
|
|
147
|
+
* Executes a function once all animations have finished on the provided element.
|
|
148
|
+
* @param elementOrRef - The element to watch for animations.
|
|
149
|
+
* @param waitForNextTick - Whether to wait for the next tick before checking for animations.
|
|
150
|
+
*/
|
|
151
|
+
function useAnimationsFinished(elementOrRef, waitForNextTick = false) {
|
|
152
|
+
const frame = useAnimationFrame();
|
|
153
|
+
return useEventCallback((fnToExecute, signal = null) => {
|
|
154
|
+
frame.cancel();
|
|
155
|
+
if (elementOrRef == null) return;
|
|
156
|
+
let element;
|
|
157
|
+
if ("current" in elementOrRef) {
|
|
158
|
+
if (elementOrRef.current == null) return;
|
|
159
|
+
element = elementOrRef.current;
|
|
160
|
+
} else element = elementOrRef;
|
|
161
|
+
if (typeof element.getAnimations !== "function" || globalThis.BASE_UI_ANIMATIONS_DISABLED) fnToExecute();
|
|
162
|
+
else frame.request(() => {
|
|
163
|
+
function exec() {
|
|
164
|
+
if (!element) return;
|
|
165
|
+
Promise.allSettled(element.getAnimations().map((anim) => anim.finished)).then(() => {
|
|
166
|
+
if (signal != null && signal.aborted) return;
|
|
167
|
+
ReactDOM$1.flushSync(fnToExecute);
|
|
168
|
+
});
|
|
169
|
+
}
|
|
170
|
+
if (waitForNextTick) frame.request(exec);
|
|
171
|
+
else exec();
|
|
172
|
+
});
|
|
173
|
+
});
|
|
174
|
+
}
|
|
175
|
+
//#endregion
|
|
176
|
+
//#region ../../node_modules/@base-ui-components/react/esm/utils/useTransitionStatus.js
|
|
177
|
+
/**
|
|
178
|
+
* Provides a status string for CSS animations.
|
|
179
|
+
* @param open - a boolean that determines if the element is open.
|
|
180
|
+
* @param enableIdleState - a boolean that enables the `'idle'` state between `'starting'` and `'ending'`
|
|
181
|
+
*/
|
|
182
|
+
function useTransitionStatus(open, enableIdleState = false, deferEndingState = false) {
|
|
183
|
+
const [transitionStatus, setTransitionStatus] = React$1.useState(open && enableIdleState ? "idle" : void 0);
|
|
184
|
+
const [mounted, setMounted] = React$1.useState(open);
|
|
185
|
+
if (open && !mounted) {
|
|
186
|
+
setMounted(true);
|
|
187
|
+
setTransitionStatus("starting");
|
|
188
|
+
}
|
|
189
|
+
if (!open && mounted && transitionStatus !== "ending" && !deferEndingState) setTransitionStatus("ending");
|
|
190
|
+
if (!open && !mounted && transitionStatus === "ending") setTransitionStatus(void 0);
|
|
191
|
+
useIsoLayoutEffect(() => {
|
|
192
|
+
if (!open && mounted && transitionStatus !== "ending" && deferEndingState) {
|
|
193
|
+
const frame = AnimationFrame.request(() => {
|
|
194
|
+
setTransitionStatus("ending");
|
|
195
|
+
});
|
|
196
|
+
return () => {
|
|
197
|
+
AnimationFrame.cancel(frame);
|
|
198
|
+
};
|
|
199
|
+
}
|
|
200
|
+
}, [
|
|
201
|
+
open,
|
|
202
|
+
mounted,
|
|
203
|
+
transitionStatus,
|
|
204
|
+
deferEndingState
|
|
205
|
+
]);
|
|
206
|
+
useIsoLayoutEffect(() => {
|
|
207
|
+
if (!open || enableIdleState) return;
|
|
208
|
+
const frame = AnimationFrame.request(() => {
|
|
209
|
+
ReactDOM$1.flushSync(() => {
|
|
210
|
+
setTransitionStatus(void 0);
|
|
211
|
+
});
|
|
212
|
+
});
|
|
213
|
+
return () => {
|
|
214
|
+
AnimationFrame.cancel(frame);
|
|
215
|
+
};
|
|
216
|
+
}, [enableIdleState, open]);
|
|
217
|
+
useIsoLayoutEffect(() => {
|
|
218
|
+
if (!open || !enableIdleState) return;
|
|
219
|
+
if (open && mounted && transitionStatus !== "idle") setTransitionStatus("starting");
|
|
220
|
+
const frame = AnimationFrame.request(() => {
|
|
221
|
+
setTransitionStatus("idle");
|
|
222
|
+
});
|
|
223
|
+
return () => {
|
|
224
|
+
AnimationFrame.cancel(frame);
|
|
225
|
+
};
|
|
226
|
+
}, [
|
|
227
|
+
enableIdleState,
|
|
228
|
+
open,
|
|
229
|
+
mounted,
|
|
230
|
+
setTransitionStatus,
|
|
231
|
+
transitionStatus
|
|
232
|
+
]);
|
|
233
|
+
return React$1.useMemo(() => ({
|
|
234
|
+
mounted,
|
|
235
|
+
setMounted,
|
|
236
|
+
transitionStatus
|
|
237
|
+
}), [mounted, transitionStatus]);
|
|
238
|
+
}
|
|
239
|
+
//#endregion
|
|
240
|
+
//#region ../../node_modules/@base-ui-components/react/esm/utils/stateAttributesMapping.js
|
|
241
|
+
var TransitionStatusDataAttributes = /* @__PURE__ */ function(TransitionStatusDataAttributes) {
|
|
242
|
+
/**
|
|
243
|
+
* Present when the component is animating in.
|
|
244
|
+
*/
|
|
245
|
+
TransitionStatusDataAttributes["startingStyle"] = "data-starting-style";
|
|
246
|
+
/**
|
|
247
|
+
* Present when the component is animating out.
|
|
248
|
+
*/
|
|
249
|
+
TransitionStatusDataAttributes["endingStyle"] = "data-ending-style";
|
|
250
|
+
return TransitionStatusDataAttributes;
|
|
251
|
+
}({});
|
|
252
|
+
var STARTING_HOOK = { [TransitionStatusDataAttributes.startingStyle]: "" };
|
|
253
|
+
var ENDING_HOOK = { [TransitionStatusDataAttributes.endingStyle]: "" };
|
|
254
|
+
var transitionStatusMapping = { transitionStatus(value) {
|
|
255
|
+
if (value === "starting") return STARTING_HOOK;
|
|
256
|
+
if (value === "ending") return ENDING_HOOK;
|
|
257
|
+
return null;
|
|
258
|
+
} };
|
|
259
|
+
//#endregion
|
|
260
|
+
//#region ../../node_modules/@base-ui-components/utils/esm/detectBrowser.js
|
|
261
|
+
var hasNavigator = typeof navigator !== "undefined";
|
|
262
|
+
var nav = getNavigatorData();
|
|
263
|
+
var platform$1 = getPlatform();
|
|
264
|
+
var userAgent = getUserAgent();
|
|
265
|
+
var isWebKit = typeof CSS === "undefined" || !CSS.supports ? false : CSS.supports("-webkit-backdrop-filter:none");
|
|
266
|
+
var isIOS = nav.platform === "MacIntel" && nav.maxTouchPoints > 1 ? true : /iP(hone|ad|od)|iOS/.test(nav.platform);
|
|
267
|
+
hasNavigator && /firefox/i.test(userAgent);
|
|
268
|
+
var isSafari = hasNavigator && /apple/i.test(navigator.vendor);
|
|
269
|
+
var isAndroid = hasNavigator && /android/i.test(platform$1) || /android/i.test(userAgent);
|
|
270
|
+
var isMac = hasNavigator && platform$1.toLowerCase().startsWith("mac") && !navigator.maxTouchPoints;
|
|
271
|
+
var isJSDOM = userAgent.includes("jsdom/");
|
|
272
|
+
function getNavigatorData() {
|
|
273
|
+
var _navigator$platform, _navigator$maxTouchPo;
|
|
274
|
+
if (!hasNavigator) return {
|
|
275
|
+
platform: "",
|
|
276
|
+
maxTouchPoints: -1
|
|
277
|
+
};
|
|
278
|
+
const uaData = navigator.userAgentData;
|
|
279
|
+
if (uaData === null || uaData === void 0 ? void 0 : uaData.platform) return {
|
|
280
|
+
platform: uaData.platform,
|
|
281
|
+
maxTouchPoints: navigator.maxTouchPoints
|
|
282
|
+
};
|
|
283
|
+
return {
|
|
284
|
+
platform: (_navigator$platform = navigator.platform) !== null && _navigator$platform !== void 0 ? _navigator$platform : "",
|
|
285
|
+
maxTouchPoints: (_navigator$maxTouchPo = navigator.maxTouchPoints) !== null && _navigator$maxTouchPo !== void 0 ? _navigator$maxTouchPo : -1
|
|
286
|
+
};
|
|
287
|
+
}
|
|
288
|
+
function getUserAgent() {
|
|
289
|
+
if (!hasNavigator) return "";
|
|
290
|
+
const uaData = navigator.userAgentData;
|
|
291
|
+
if (uaData && Array.isArray(uaData.brands)) return uaData.brands.map(({ brand, version }) => `${brand}/${version}`).join(" ");
|
|
292
|
+
return navigator.userAgent;
|
|
293
|
+
}
|
|
294
|
+
function getPlatform() {
|
|
295
|
+
var _navigator$platform2;
|
|
296
|
+
if (!hasNavigator) return "";
|
|
297
|
+
const uaData = navigator.userAgentData;
|
|
298
|
+
if (uaData === null || uaData === void 0 ? void 0 : uaData.platform) return uaData.platform;
|
|
299
|
+
return (_navigator$platform2 = navigator.platform) !== null && _navigator$platform2 !== void 0 ? _navigator$platform2 : "";
|
|
300
|
+
}
|
|
301
|
+
//#endregion
|
|
302
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/utils/constants.js
|
|
303
|
+
var FOCUSABLE_ATTRIBUTE = "data-base-ui-focusable";
|
|
304
|
+
var ARROW_LEFT$1 = "ArrowLeft";
|
|
305
|
+
var ARROW_RIGHT$1 = "ArrowRight";
|
|
306
|
+
var ARROW_UP$1 = "ArrowUp";
|
|
307
|
+
var ARROW_DOWN$1 = "ArrowDown";
|
|
308
|
+
//#endregion
|
|
309
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/utils/element.js
|
|
310
|
+
function activeElement(doc) {
|
|
311
|
+
var _element$shadowRoot;
|
|
312
|
+
let element = doc.activeElement;
|
|
313
|
+
while ((element === null || element === void 0 || (_element$shadowRoot = element.shadowRoot) === null || _element$shadowRoot === void 0 ? void 0 : _element$shadowRoot.activeElement) != null) element = element.shadowRoot.activeElement;
|
|
314
|
+
return element;
|
|
315
|
+
}
|
|
316
|
+
function contains(parent, child) {
|
|
317
|
+
var _child$getRootNode;
|
|
318
|
+
if (!parent || !child) return false;
|
|
319
|
+
const rootNode = (_child$getRootNode = child.getRootNode) === null || _child$getRootNode === void 0 ? void 0 : _child$getRootNode.call(child);
|
|
320
|
+
if (parent.contains(child)) return true;
|
|
321
|
+
if (rootNode && isShadowRoot(rootNode)) {
|
|
322
|
+
let next = child;
|
|
323
|
+
while (next) {
|
|
324
|
+
if (parent === next) return true;
|
|
325
|
+
next = next.parentNode || next.host;
|
|
326
|
+
}
|
|
327
|
+
}
|
|
328
|
+
return false;
|
|
329
|
+
}
|
|
330
|
+
function getTarget(event) {
|
|
331
|
+
if ("composedPath" in event) return event.composedPath()[0];
|
|
332
|
+
return event.target;
|
|
333
|
+
}
|
|
334
|
+
function isEventTargetWithin(event, node) {
|
|
335
|
+
if (node == null) return false;
|
|
336
|
+
if ("composedPath" in event) return event.composedPath().includes(node);
|
|
337
|
+
const eventAgain = event;
|
|
338
|
+
return eventAgain.target != null && node.contains(eventAgain.target);
|
|
339
|
+
}
|
|
340
|
+
function isRootElement(element) {
|
|
341
|
+
return element.matches("html,body");
|
|
342
|
+
}
|
|
343
|
+
function getDocument(node) {
|
|
344
|
+
return (node === null || node === void 0 ? void 0 : node.ownerDocument) || document;
|
|
345
|
+
}
|
|
346
|
+
function isTypeableElement(element) {
|
|
347
|
+
return isHTMLElement(element) && element.matches("input:not([type='hidden']):not([disabled]),[contenteditable]:not([contenteditable='false']),textarea:not([disabled])");
|
|
348
|
+
}
|
|
349
|
+
function isTypeableCombobox(element) {
|
|
350
|
+
if (!element) return false;
|
|
351
|
+
return element.getAttribute("role") === "combobox" && isTypeableElement(element);
|
|
352
|
+
}
|
|
353
|
+
function matchesFocusVisible(element) {
|
|
354
|
+
if (!element || isJSDOM) return true;
|
|
355
|
+
try {
|
|
356
|
+
return element.matches(":focus-visible");
|
|
357
|
+
} catch (_e) {
|
|
358
|
+
return true;
|
|
359
|
+
}
|
|
360
|
+
}
|
|
361
|
+
function getFloatingFocusElement(floatingElement) {
|
|
362
|
+
if (!floatingElement) return null;
|
|
363
|
+
return floatingElement.hasAttribute("data-base-ui-focusable") ? floatingElement : floatingElement.querySelector(`[data-base-ui-focusable]`) || floatingElement;
|
|
364
|
+
}
|
|
365
|
+
//#endregion
|
|
366
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/utils/nodes.js
|
|
367
|
+
function getNodeChildren(nodes, id, onlyOpenChildren = true) {
|
|
368
|
+
return nodes.filter((node) => {
|
|
369
|
+
var _node$context;
|
|
370
|
+
return node.parentId === id && (!onlyOpenChildren || ((_node$context = node.context) === null || _node$context === void 0 ? void 0 : _node$context.open));
|
|
371
|
+
}).flatMap((child) => [child, ...getNodeChildren(nodes, child.id, onlyOpenChildren)]);
|
|
372
|
+
}
|
|
373
|
+
function getNodeAncestors(nodes, id) {
|
|
374
|
+
var _nodes$find;
|
|
375
|
+
let allAncestors = [];
|
|
376
|
+
let currentParentId = (_nodes$find = nodes.find((node) => node.id === id)) === null || _nodes$find === void 0 ? void 0 : _nodes$find.parentId;
|
|
377
|
+
while (currentParentId) {
|
|
378
|
+
const currentNode = nodes.find((node) => node.id === currentParentId);
|
|
379
|
+
currentParentId = currentNode === null || currentNode === void 0 ? void 0 : currentNode.parentId;
|
|
380
|
+
if (currentNode) allAncestors = allAncestors.concat(currentNode);
|
|
381
|
+
}
|
|
382
|
+
return allAncestors;
|
|
383
|
+
}
|
|
384
|
+
//#endregion
|
|
385
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/utils/event.js
|
|
386
|
+
function stopEvent(event) {
|
|
387
|
+
event.preventDefault();
|
|
388
|
+
event.stopPropagation();
|
|
389
|
+
}
|
|
390
|
+
function isReactEvent(event) {
|
|
391
|
+
return "nativeEvent" in event;
|
|
392
|
+
}
|
|
393
|
+
function isVirtualClick(event) {
|
|
394
|
+
if (event.mozInputSource === 0 && event.isTrusted) return true;
|
|
395
|
+
if (isAndroid && event.pointerType) return event.type === "click" && event.buttons === 1;
|
|
396
|
+
return event.detail === 0 && !event.pointerType;
|
|
397
|
+
}
|
|
398
|
+
function isVirtualPointerEvent(event) {
|
|
399
|
+
if (isJSDOM) return false;
|
|
400
|
+
return !isAndroid && event.width === 0 && event.height === 0 || isAndroid && event.width === 1 && event.height === 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === "mouse" || event.width < 1 && event.height < 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === "touch";
|
|
401
|
+
}
|
|
402
|
+
function isMouseLikePointerType(pointerType, strict) {
|
|
403
|
+
const values = ["mouse", "pen"];
|
|
404
|
+
if (!strict) values.push("", void 0);
|
|
405
|
+
return values.includes(pointerType);
|
|
406
|
+
}
|
|
407
|
+
//#endregion
|
|
408
|
+
//#region ../../node_modules/@floating-ui/utils/dist/floating-ui.utils.mjs
|
|
409
|
+
/**
|
|
410
|
+
* Custom positioning reference element.
|
|
411
|
+
* @see https://floating-ui.com/docs/virtual-elements
|
|
412
|
+
*/
|
|
413
|
+
var sides = [
|
|
414
|
+
"top",
|
|
415
|
+
"right",
|
|
416
|
+
"bottom",
|
|
417
|
+
"left"
|
|
418
|
+
];
|
|
419
|
+
var min = Math.min;
|
|
420
|
+
var max = Math.max;
|
|
421
|
+
var round = Math.round;
|
|
422
|
+
var floor = Math.floor;
|
|
423
|
+
var createCoords = (v) => ({
|
|
424
|
+
x: v,
|
|
425
|
+
y: v
|
|
426
|
+
});
|
|
427
|
+
var oppositeSideMap = {
|
|
428
|
+
left: "right",
|
|
429
|
+
right: "left",
|
|
430
|
+
bottom: "top",
|
|
431
|
+
top: "bottom"
|
|
432
|
+
};
|
|
433
|
+
var oppositeAlignmentMap = {
|
|
434
|
+
start: "end",
|
|
435
|
+
end: "start"
|
|
436
|
+
};
|
|
437
|
+
function clamp(start, value, end) {
|
|
438
|
+
return max(start, min(value, end));
|
|
439
|
+
}
|
|
440
|
+
function evaluate(value, param) {
|
|
441
|
+
return typeof value === "function" ? value(param) : value;
|
|
442
|
+
}
|
|
443
|
+
function getSide(placement) {
|
|
444
|
+
return placement.split("-")[0];
|
|
445
|
+
}
|
|
446
|
+
function getAlignment(placement) {
|
|
447
|
+
return placement.split("-")[1];
|
|
448
|
+
}
|
|
449
|
+
function getOppositeAxis(axis) {
|
|
450
|
+
return axis === "x" ? "y" : "x";
|
|
451
|
+
}
|
|
452
|
+
function getAxisLength(axis) {
|
|
453
|
+
return axis === "y" ? "height" : "width";
|
|
454
|
+
}
|
|
455
|
+
var yAxisSides = /* @__PURE__ */ new Set(["top", "bottom"]);
|
|
456
|
+
function getSideAxis(placement) {
|
|
457
|
+
return yAxisSides.has(getSide(placement)) ? "y" : "x";
|
|
458
|
+
}
|
|
459
|
+
function getAlignmentAxis(placement) {
|
|
460
|
+
return getOppositeAxis(getSideAxis(placement));
|
|
461
|
+
}
|
|
462
|
+
function getAlignmentSides(placement, rects, rtl) {
|
|
463
|
+
if (rtl === void 0) rtl = false;
|
|
464
|
+
const alignment = getAlignment(placement);
|
|
465
|
+
const alignmentAxis = getAlignmentAxis(placement);
|
|
466
|
+
const length = getAxisLength(alignmentAxis);
|
|
467
|
+
let mainAlignmentSide = alignmentAxis === "x" ? alignment === (rtl ? "end" : "start") ? "right" : "left" : alignment === "start" ? "bottom" : "top";
|
|
468
|
+
if (rects.reference[length] > rects.floating[length]) mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
|
|
469
|
+
return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
|
|
470
|
+
}
|
|
471
|
+
function getExpandedPlacements(placement) {
|
|
472
|
+
const oppositePlacement = getOppositePlacement(placement);
|
|
473
|
+
return [
|
|
474
|
+
getOppositeAlignmentPlacement(placement),
|
|
475
|
+
oppositePlacement,
|
|
476
|
+
getOppositeAlignmentPlacement(oppositePlacement)
|
|
477
|
+
];
|
|
478
|
+
}
|
|
479
|
+
function getOppositeAlignmentPlacement(placement) {
|
|
480
|
+
return placement.replace(/start|end/g, (alignment) => oppositeAlignmentMap[alignment]);
|
|
481
|
+
}
|
|
482
|
+
var lrPlacement = ["left", "right"];
|
|
483
|
+
var rlPlacement = ["right", "left"];
|
|
484
|
+
var tbPlacement = ["top", "bottom"];
|
|
485
|
+
var btPlacement = ["bottom", "top"];
|
|
486
|
+
function getSideList(side, isStart, rtl) {
|
|
487
|
+
switch (side) {
|
|
488
|
+
case "top":
|
|
489
|
+
case "bottom":
|
|
490
|
+
if (rtl) return isStart ? rlPlacement : lrPlacement;
|
|
491
|
+
return isStart ? lrPlacement : rlPlacement;
|
|
492
|
+
case "left":
|
|
493
|
+
case "right": return isStart ? tbPlacement : btPlacement;
|
|
494
|
+
default: return [];
|
|
495
|
+
}
|
|
496
|
+
}
|
|
497
|
+
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
|
|
498
|
+
const alignment = getAlignment(placement);
|
|
499
|
+
let list = getSideList(getSide(placement), direction === "start", rtl);
|
|
500
|
+
if (alignment) {
|
|
501
|
+
list = list.map((side) => side + "-" + alignment);
|
|
502
|
+
if (flipAlignment) list = list.concat(list.map(getOppositeAlignmentPlacement));
|
|
503
|
+
}
|
|
504
|
+
return list;
|
|
505
|
+
}
|
|
506
|
+
function getOppositePlacement(placement) {
|
|
507
|
+
return placement.replace(/left|right|bottom|top/g, (side) => oppositeSideMap[side]);
|
|
508
|
+
}
|
|
509
|
+
function expandPaddingObject(padding) {
|
|
510
|
+
return {
|
|
511
|
+
top: 0,
|
|
512
|
+
right: 0,
|
|
513
|
+
bottom: 0,
|
|
514
|
+
left: 0,
|
|
515
|
+
...padding
|
|
516
|
+
};
|
|
517
|
+
}
|
|
518
|
+
function getPaddingObject(padding) {
|
|
519
|
+
return typeof padding !== "number" ? expandPaddingObject(padding) : {
|
|
520
|
+
top: padding,
|
|
521
|
+
right: padding,
|
|
522
|
+
bottom: padding,
|
|
523
|
+
left: padding
|
|
524
|
+
};
|
|
525
|
+
}
|
|
526
|
+
function rectToClientRect(rect) {
|
|
527
|
+
const { x, y, width, height } = rect;
|
|
528
|
+
return {
|
|
529
|
+
width,
|
|
530
|
+
height,
|
|
531
|
+
top: y,
|
|
532
|
+
left: x,
|
|
533
|
+
right: x + width,
|
|
534
|
+
bottom: y + height,
|
|
535
|
+
x,
|
|
536
|
+
y
|
|
537
|
+
};
|
|
538
|
+
}
|
|
539
|
+
var candidateSelector = /* @__PURE__ */ [
|
|
540
|
+
"input:not([inert])",
|
|
541
|
+
"select:not([inert])",
|
|
542
|
+
"textarea:not([inert])",
|
|
543
|
+
"a[href]:not([inert])",
|
|
544
|
+
"button:not([inert])",
|
|
545
|
+
"[tabindex]:not(slot):not([inert])",
|
|
546
|
+
"audio[controls]:not([inert])",
|
|
547
|
+
"video[controls]:not([inert])",
|
|
548
|
+
"[contenteditable]:not([contenteditable=\"false\"]):not([inert])",
|
|
549
|
+
"details>summary:first-of-type:not([inert])",
|
|
550
|
+
"details:not([inert])"
|
|
551
|
+
].join(",");
|
|
552
|
+
var NoElement = typeof Element === "undefined";
|
|
553
|
+
var matches = NoElement ? function() {} : Element.prototype.matches || Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector;
|
|
554
|
+
var getRootNode = !NoElement && Element.prototype.getRootNode ? function(element) {
|
|
555
|
+
var _element$getRootNode;
|
|
556
|
+
return element === null || element === void 0 ? void 0 : (_element$getRootNode = element.getRootNode) === null || _element$getRootNode === void 0 ? void 0 : _element$getRootNode.call(element);
|
|
557
|
+
} : function(element) {
|
|
558
|
+
return element === null || element === void 0 ? void 0 : element.ownerDocument;
|
|
559
|
+
};
|
|
560
|
+
/**
|
|
561
|
+
* Determines if a node is inert or in an inert ancestor.
|
|
562
|
+
* @param {Element} [node]
|
|
563
|
+
* @param {boolean} [lookUp] If true and `node` is not inert, looks up at ancestors to
|
|
564
|
+
* see if any of them are inert. If false, only `node` itself is considered.
|
|
565
|
+
* @returns {boolean} True if inert itself or by way of being in an inert ancestor.
|
|
566
|
+
* False if `node` is falsy.
|
|
567
|
+
*/
|
|
568
|
+
var isInert = function isInert(node, lookUp) {
|
|
569
|
+
var _node$getAttribute;
|
|
570
|
+
if (lookUp === void 0) lookUp = true;
|
|
571
|
+
var inertAtt = node === null || node === void 0 ? void 0 : (_node$getAttribute = node.getAttribute) === null || _node$getAttribute === void 0 ? void 0 : _node$getAttribute.call(node, "inert");
|
|
572
|
+
return inertAtt === "" || inertAtt === "true" || lookUp && node && isInert(node.parentNode);
|
|
573
|
+
};
|
|
574
|
+
/**
|
|
575
|
+
* Determines if a node's content is editable.
|
|
576
|
+
* @param {Element} [node]
|
|
577
|
+
* @returns True if it's content-editable; false if it's not or `node` is falsy.
|
|
578
|
+
*/
|
|
579
|
+
var isContentEditable = function isContentEditable(node) {
|
|
580
|
+
var _node$getAttribute2;
|
|
581
|
+
var attValue = node === null || node === void 0 ? void 0 : (_node$getAttribute2 = node.getAttribute) === null || _node$getAttribute2 === void 0 ? void 0 : _node$getAttribute2.call(node, "contenteditable");
|
|
582
|
+
return attValue === "" || attValue === "true";
|
|
583
|
+
};
|
|
584
|
+
/**
|
|
585
|
+
* @param {Element} el container to check in
|
|
586
|
+
* @param {boolean} includeContainer add container to check
|
|
587
|
+
* @param {(node: Element) => boolean} filter filter candidates
|
|
588
|
+
* @returns {Element[]}
|
|
589
|
+
*/
|
|
590
|
+
var getCandidates = function getCandidates(el, includeContainer, filter) {
|
|
591
|
+
if (isInert(el)) return [];
|
|
592
|
+
var candidates = Array.prototype.slice.apply(el.querySelectorAll(candidateSelector));
|
|
593
|
+
if (includeContainer && matches.call(el, candidateSelector)) candidates.unshift(el);
|
|
594
|
+
candidates = candidates.filter(filter);
|
|
595
|
+
return candidates;
|
|
596
|
+
};
|
|
597
|
+
/**
|
|
598
|
+
* @callback GetShadowRoot
|
|
599
|
+
* @param {Element} element to check for shadow root
|
|
600
|
+
* @returns {ShadowRoot|boolean} ShadowRoot if available or boolean indicating if a shadowRoot is attached but not available.
|
|
601
|
+
*/
|
|
602
|
+
/**
|
|
603
|
+
* @callback ShadowRootFilter
|
|
604
|
+
* @param {Element} shadowHostNode the element which contains shadow content
|
|
605
|
+
* @returns {boolean} true if a shadow root could potentially contain valid candidates.
|
|
606
|
+
*/
|
|
607
|
+
/**
|
|
608
|
+
* @typedef {Object} CandidateScope
|
|
609
|
+
* @property {Element} scopeParent contains inner candidates
|
|
610
|
+
* @property {Element[]} candidates list of candidates found in the scope parent
|
|
611
|
+
*/
|
|
612
|
+
/**
|
|
613
|
+
* @typedef {Object} IterativeOptions
|
|
614
|
+
* @property {GetShadowRoot|boolean} getShadowRoot true if shadow support is enabled; falsy if not;
|
|
615
|
+
* if a function, implies shadow support is enabled and either returns the shadow root of an element
|
|
616
|
+
* or a boolean stating if it has an undisclosed shadow root
|
|
617
|
+
* @property {(node: Element) => boolean} filter filter candidates
|
|
618
|
+
* @property {boolean} flatten if true then result will flatten any CandidateScope into the returned list
|
|
619
|
+
* @property {ShadowRootFilter} shadowRootFilter filter shadow roots;
|
|
620
|
+
*/
|
|
621
|
+
/**
|
|
622
|
+
* @param {Element[]} elements list of element containers to match candidates from
|
|
623
|
+
* @param {boolean} includeContainer add container list to check
|
|
624
|
+
* @param {IterativeOptions} options
|
|
625
|
+
* @returns {Array.<Element|CandidateScope>}
|
|
626
|
+
*/
|
|
627
|
+
var getCandidatesIteratively = function getCandidatesIteratively(elements, includeContainer, options) {
|
|
628
|
+
var candidates = [];
|
|
629
|
+
var elementsToCheck = Array.from(elements);
|
|
630
|
+
while (elementsToCheck.length) {
|
|
631
|
+
var element = elementsToCheck.shift();
|
|
632
|
+
if (isInert(element, false)) continue;
|
|
633
|
+
if (element.tagName === "SLOT") {
|
|
634
|
+
var assigned = element.assignedElements();
|
|
635
|
+
var nestedCandidates = getCandidatesIteratively(assigned.length ? assigned : element.children, true, options);
|
|
636
|
+
if (options.flatten) candidates.push.apply(candidates, nestedCandidates);
|
|
637
|
+
else candidates.push({
|
|
638
|
+
scopeParent: element,
|
|
639
|
+
candidates: nestedCandidates
|
|
640
|
+
});
|
|
641
|
+
} else {
|
|
642
|
+
if (matches.call(element, candidateSelector) && options.filter(element) && (includeContainer || !elements.includes(element))) candidates.push(element);
|
|
643
|
+
var shadowRoot = element.shadowRoot || typeof options.getShadowRoot === "function" && options.getShadowRoot(element);
|
|
644
|
+
var validShadowRoot = !isInert(shadowRoot, false) && (!options.shadowRootFilter || options.shadowRootFilter(element));
|
|
645
|
+
if (shadowRoot && validShadowRoot) {
|
|
646
|
+
var _nestedCandidates = getCandidatesIteratively(shadowRoot === true ? element.children : shadowRoot.children, true, options);
|
|
647
|
+
if (options.flatten) candidates.push.apply(candidates, _nestedCandidates);
|
|
648
|
+
else candidates.push({
|
|
649
|
+
scopeParent: element,
|
|
650
|
+
candidates: _nestedCandidates
|
|
651
|
+
});
|
|
652
|
+
} else elementsToCheck.unshift.apply(elementsToCheck, element.children);
|
|
653
|
+
}
|
|
654
|
+
}
|
|
655
|
+
return candidates;
|
|
656
|
+
};
|
|
657
|
+
/**
|
|
658
|
+
* @private
|
|
659
|
+
* Determines if the node has an explicitly specified `tabindex` attribute.
|
|
660
|
+
* @param {HTMLElement} node
|
|
661
|
+
* @returns {boolean} True if so; false if not.
|
|
662
|
+
*/
|
|
663
|
+
var hasTabIndex = function hasTabIndex(node) {
|
|
664
|
+
return !isNaN(parseInt(node.getAttribute("tabindex"), 10));
|
|
665
|
+
};
|
|
666
|
+
/**
|
|
667
|
+
* Determine the tab index of a given node.
|
|
668
|
+
* @param {HTMLElement} node
|
|
669
|
+
* @returns {number} Tab order (negative, 0, or positive number).
|
|
670
|
+
* @throws {Error} If `node` is falsy.
|
|
671
|
+
*/
|
|
672
|
+
var getTabIndex = function getTabIndex(node) {
|
|
673
|
+
if (!node) throw new Error("No node provided");
|
|
674
|
+
if (node.tabIndex < 0) {
|
|
675
|
+
if ((/^(AUDIO|VIDEO|DETAILS)$/.test(node.tagName) || isContentEditable(node)) && !hasTabIndex(node)) return 0;
|
|
676
|
+
}
|
|
677
|
+
return node.tabIndex;
|
|
678
|
+
};
|
|
679
|
+
/**
|
|
680
|
+
* Determine the tab index of a given node __for sort order purposes__.
|
|
681
|
+
* @param {HTMLElement} node
|
|
682
|
+
* @param {boolean} [isScope] True for a custom element with shadow root or slot that, by default,
|
|
683
|
+
* has tabIndex -1, but needs to be sorted by document order in order for its content to be
|
|
684
|
+
* inserted into the correct sort position.
|
|
685
|
+
* @returns {number} Tab order (negative, 0, or positive number).
|
|
686
|
+
*/
|
|
687
|
+
var getSortOrderTabIndex = function getSortOrderTabIndex(node, isScope) {
|
|
688
|
+
var tabIndex = getTabIndex(node);
|
|
689
|
+
if (tabIndex < 0 && isScope && !hasTabIndex(node)) return 0;
|
|
690
|
+
return tabIndex;
|
|
691
|
+
};
|
|
692
|
+
var sortOrderedTabbables = function sortOrderedTabbables(a, b) {
|
|
693
|
+
return a.tabIndex === b.tabIndex ? a.documentOrder - b.documentOrder : a.tabIndex - b.tabIndex;
|
|
694
|
+
};
|
|
695
|
+
var isInput = function isInput(node) {
|
|
696
|
+
return node.tagName === "INPUT";
|
|
697
|
+
};
|
|
698
|
+
var isHiddenInput = function isHiddenInput(node) {
|
|
699
|
+
return isInput(node) && node.type === "hidden";
|
|
700
|
+
};
|
|
701
|
+
var isDetailsWithSummary = function isDetailsWithSummary(node) {
|
|
702
|
+
return node.tagName === "DETAILS" && Array.prototype.slice.apply(node.children).some(function(child) {
|
|
703
|
+
return child.tagName === "SUMMARY";
|
|
704
|
+
});
|
|
705
|
+
};
|
|
706
|
+
var getCheckedRadio = function getCheckedRadio(nodes, form) {
|
|
707
|
+
for (var i = 0; i < nodes.length; i++) if (nodes[i].checked && nodes[i].form === form) return nodes[i];
|
|
708
|
+
};
|
|
709
|
+
var isTabbableRadio = function isTabbableRadio(node) {
|
|
710
|
+
if (!node.name) return true;
|
|
711
|
+
var radioScope = node.form || getRootNode(node);
|
|
712
|
+
var queryRadios = function queryRadios(name) {
|
|
713
|
+
return radioScope.querySelectorAll("input[type=\"radio\"][name=\"" + name + "\"]");
|
|
714
|
+
};
|
|
715
|
+
var radioSet;
|
|
716
|
+
if (typeof window !== "undefined" && typeof window.CSS !== "undefined" && typeof window.CSS.escape === "function") radioSet = queryRadios(window.CSS.escape(node.name));
|
|
717
|
+
else try {
|
|
718
|
+
radioSet = queryRadios(node.name);
|
|
719
|
+
} catch (err) {
|
|
720
|
+
console.error("Looks like you have a radio button with a name attribute containing invalid CSS selector characters and need the CSS.escape polyfill: %s", err.message);
|
|
721
|
+
return false;
|
|
722
|
+
}
|
|
723
|
+
var checked = getCheckedRadio(radioSet, node.form);
|
|
724
|
+
return !checked || checked === node;
|
|
725
|
+
};
|
|
726
|
+
var isRadio = function isRadio(node) {
|
|
727
|
+
return isInput(node) && node.type === "radio";
|
|
728
|
+
};
|
|
729
|
+
var isNonTabbableRadio = function isNonTabbableRadio(node) {
|
|
730
|
+
return isRadio(node) && !isTabbableRadio(node);
|
|
731
|
+
};
|
|
732
|
+
var isNodeAttached = function isNodeAttached(node) {
|
|
733
|
+
var _nodeRoot;
|
|
734
|
+
var nodeRoot = node && getRootNode(node);
|
|
735
|
+
var nodeRootHost = (_nodeRoot = nodeRoot) === null || _nodeRoot === void 0 ? void 0 : _nodeRoot.host;
|
|
736
|
+
var attached = false;
|
|
737
|
+
if (nodeRoot && nodeRoot !== node) {
|
|
738
|
+
var _nodeRootHost, _nodeRootHost$ownerDo, _node$ownerDocument;
|
|
739
|
+
attached = !!((_nodeRootHost = nodeRootHost) !== null && _nodeRootHost !== void 0 && (_nodeRootHost$ownerDo = _nodeRootHost.ownerDocument) !== null && _nodeRootHost$ownerDo !== void 0 && _nodeRootHost$ownerDo.contains(nodeRootHost) || node !== null && node !== void 0 && (_node$ownerDocument = node.ownerDocument) !== null && _node$ownerDocument !== void 0 && _node$ownerDocument.contains(node));
|
|
740
|
+
while (!attached && nodeRootHost) {
|
|
741
|
+
var _nodeRoot2, _nodeRootHost2, _nodeRootHost2$ownerD;
|
|
742
|
+
nodeRoot = getRootNode(nodeRootHost);
|
|
743
|
+
nodeRootHost = (_nodeRoot2 = nodeRoot) === null || _nodeRoot2 === void 0 ? void 0 : _nodeRoot2.host;
|
|
744
|
+
attached = !!((_nodeRootHost2 = nodeRootHost) !== null && _nodeRootHost2 !== void 0 && (_nodeRootHost2$ownerD = _nodeRootHost2.ownerDocument) !== null && _nodeRootHost2$ownerD !== void 0 && _nodeRootHost2$ownerD.contains(nodeRootHost));
|
|
745
|
+
}
|
|
746
|
+
}
|
|
747
|
+
return attached;
|
|
748
|
+
};
|
|
749
|
+
var isZeroArea = function isZeroArea(node) {
|
|
750
|
+
var _node$getBoundingClie = node.getBoundingClientRect(), width = _node$getBoundingClie.width, height = _node$getBoundingClie.height;
|
|
751
|
+
return width === 0 && height === 0;
|
|
752
|
+
};
|
|
753
|
+
var isHidden = function isHidden(node, _ref) {
|
|
754
|
+
var displayCheck = _ref.displayCheck, getShadowRoot = _ref.getShadowRoot;
|
|
755
|
+
if (getComputedStyle(node).visibility === "hidden") return true;
|
|
756
|
+
var nodeUnderDetails = matches.call(node, "details>summary:first-of-type") ? node.parentElement : node;
|
|
757
|
+
if (matches.call(nodeUnderDetails, "details:not([open]) *")) return true;
|
|
758
|
+
if (!displayCheck || displayCheck === "full" || displayCheck === "legacy-full") {
|
|
759
|
+
if (typeof getShadowRoot === "function") {
|
|
760
|
+
var originalNode = node;
|
|
761
|
+
while (node) {
|
|
762
|
+
var parentElement = node.parentElement;
|
|
763
|
+
var rootNode = getRootNode(node);
|
|
764
|
+
if (parentElement && !parentElement.shadowRoot && getShadowRoot(parentElement) === true) return isZeroArea(node);
|
|
765
|
+
else if (node.assignedSlot) node = node.assignedSlot;
|
|
766
|
+
else if (!parentElement && rootNode !== node.ownerDocument) node = rootNode.host;
|
|
767
|
+
else node = parentElement;
|
|
768
|
+
}
|
|
769
|
+
node = originalNode;
|
|
770
|
+
}
|
|
771
|
+
if (isNodeAttached(node)) return !node.getClientRects().length;
|
|
772
|
+
if (displayCheck !== "legacy-full") return true;
|
|
773
|
+
} else if (displayCheck === "non-zero-area") return isZeroArea(node);
|
|
774
|
+
return false;
|
|
775
|
+
};
|
|
776
|
+
var isDisabledFromFieldset = function isDisabledFromFieldset(node) {
|
|
777
|
+
if (/^(INPUT|BUTTON|SELECT|TEXTAREA)$/.test(node.tagName)) {
|
|
778
|
+
var parentNode = node.parentElement;
|
|
779
|
+
while (parentNode) {
|
|
780
|
+
if (parentNode.tagName === "FIELDSET" && parentNode.disabled) {
|
|
781
|
+
for (var i = 0; i < parentNode.children.length; i++) {
|
|
782
|
+
var child = parentNode.children.item(i);
|
|
783
|
+
if (child.tagName === "LEGEND") return matches.call(parentNode, "fieldset[disabled] *") ? true : !child.contains(node);
|
|
784
|
+
}
|
|
785
|
+
return true;
|
|
786
|
+
}
|
|
787
|
+
parentNode = parentNode.parentElement;
|
|
788
|
+
}
|
|
789
|
+
}
|
|
790
|
+
return false;
|
|
791
|
+
};
|
|
792
|
+
var isNodeMatchingSelectorFocusable = function isNodeMatchingSelectorFocusable(options, node) {
|
|
793
|
+
if (node.disabled || isInert(node) || isHiddenInput(node) || isHidden(node, options) || isDetailsWithSummary(node) || isDisabledFromFieldset(node)) return false;
|
|
794
|
+
return true;
|
|
795
|
+
};
|
|
796
|
+
var isNodeMatchingSelectorTabbable = function isNodeMatchingSelectorTabbable(options, node) {
|
|
797
|
+
if (isNonTabbableRadio(node) || getTabIndex(node) < 0 || !isNodeMatchingSelectorFocusable(options, node)) return false;
|
|
798
|
+
return true;
|
|
799
|
+
};
|
|
800
|
+
var isValidShadowRootTabbable = function isValidShadowRootTabbable(shadowHostNode) {
|
|
801
|
+
var tabIndex = parseInt(shadowHostNode.getAttribute("tabindex"), 10);
|
|
802
|
+
if (isNaN(tabIndex) || tabIndex >= 0) return true;
|
|
803
|
+
return false;
|
|
804
|
+
};
|
|
805
|
+
/**
|
|
806
|
+
* @param {Array.<Element|CandidateScope>} candidates
|
|
807
|
+
* @returns Element[]
|
|
808
|
+
*/
|
|
809
|
+
var sortByOrder = function sortByOrder(candidates) {
|
|
810
|
+
var regularTabbables = [];
|
|
811
|
+
var orderedTabbables = [];
|
|
812
|
+
candidates.forEach(function(item, i) {
|
|
813
|
+
var isScope = !!item.scopeParent;
|
|
814
|
+
var element = isScope ? item.scopeParent : item;
|
|
815
|
+
var candidateTabindex = getSortOrderTabIndex(element, isScope);
|
|
816
|
+
var elements = isScope ? sortByOrder(item.candidates) : element;
|
|
817
|
+
if (candidateTabindex === 0) isScope ? regularTabbables.push.apply(regularTabbables, elements) : regularTabbables.push(element);
|
|
818
|
+
else orderedTabbables.push({
|
|
819
|
+
documentOrder: i,
|
|
820
|
+
tabIndex: candidateTabindex,
|
|
821
|
+
item,
|
|
822
|
+
isScope,
|
|
823
|
+
content: elements
|
|
824
|
+
});
|
|
825
|
+
});
|
|
826
|
+
return orderedTabbables.sort(sortOrderedTabbables).reduce(function(acc, sortable) {
|
|
827
|
+
sortable.isScope ? acc.push.apply(acc, sortable.content) : acc.push(sortable.content);
|
|
828
|
+
return acc;
|
|
829
|
+
}, []).concat(regularTabbables);
|
|
830
|
+
};
|
|
831
|
+
var tabbable = function tabbable(container, options) {
|
|
832
|
+
options = options || {};
|
|
833
|
+
var candidates;
|
|
834
|
+
if (options.getShadowRoot) candidates = getCandidatesIteratively([container], options.includeContainer, {
|
|
835
|
+
filter: isNodeMatchingSelectorTabbable.bind(null, options),
|
|
836
|
+
flatten: false,
|
|
837
|
+
getShadowRoot: options.getShadowRoot,
|
|
838
|
+
shadowRootFilter: isValidShadowRootTabbable
|
|
839
|
+
});
|
|
840
|
+
else candidates = getCandidates(container, options.includeContainer, isNodeMatchingSelectorTabbable.bind(null, options));
|
|
841
|
+
return sortByOrder(candidates);
|
|
842
|
+
};
|
|
843
|
+
var focusable = function focusable(container, options) {
|
|
844
|
+
options = options || {};
|
|
845
|
+
var candidates;
|
|
846
|
+
if (options.getShadowRoot) candidates = getCandidatesIteratively([container], options.includeContainer, {
|
|
847
|
+
filter: isNodeMatchingSelectorFocusable.bind(null, options),
|
|
848
|
+
flatten: true,
|
|
849
|
+
getShadowRoot: options.getShadowRoot
|
|
850
|
+
});
|
|
851
|
+
else candidates = getCandidates(container, options.includeContainer, isNodeMatchingSelectorFocusable.bind(null, options));
|
|
852
|
+
return candidates;
|
|
853
|
+
};
|
|
854
|
+
var isTabbable = function isTabbable(node, options) {
|
|
855
|
+
options = options || {};
|
|
856
|
+
if (!node) throw new Error("No node provided");
|
|
857
|
+
if (matches.call(node, candidateSelector) === false) return false;
|
|
858
|
+
return isNodeMatchingSelectorTabbable(options, node);
|
|
859
|
+
};
|
|
860
|
+
//#endregion
|
|
861
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/utils/tabbable.js
|
|
862
|
+
var getTabbableOptions = () => ({
|
|
863
|
+
getShadowRoot: true,
|
|
864
|
+
displayCheck: typeof ResizeObserver === "function" && ResizeObserver.toString().includes("[native code]") ? "full" : "none"
|
|
865
|
+
});
|
|
866
|
+
function getTabbableIn(container, dir) {
|
|
867
|
+
const list = tabbable(container, getTabbableOptions());
|
|
868
|
+
const len = list.length;
|
|
869
|
+
if (len === 0) return;
|
|
870
|
+
const active = activeElement(getDocument(container));
|
|
871
|
+
const index = list.indexOf(active);
|
|
872
|
+
return list[index === -1 ? dir === 1 ? 0 : len - 1 : index + dir];
|
|
873
|
+
}
|
|
874
|
+
function getNextTabbable(referenceElement) {
|
|
875
|
+
return getTabbableIn(getDocument(referenceElement).body, 1) || referenceElement;
|
|
876
|
+
}
|
|
877
|
+
function getPreviousTabbable(referenceElement) {
|
|
878
|
+
return getTabbableIn(getDocument(referenceElement).body, -1) || referenceElement;
|
|
879
|
+
}
|
|
880
|
+
function isOutsideEvent(event, container) {
|
|
881
|
+
const containerElement = container || event.currentTarget;
|
|
882
|
+
const relatedTarget = event.relatedTarget;
|
|
883
|
+
return !relatedTarget || !contains(containerElement, relatedTarget);
|
|
884
|
+
}
|
|
885
|
+
function disableFocusInside(container) {
|
|
886
|
+
tabbable(container, getTabbableOptions()).forEach((element) => {
|
|
887
|
+
element.dataset.tabindex = element.getAttribute("tabindex") || "";
|
|
888
|
+
element.setAttribute("tabindex", "-1");
|
|
889
|
+
});
|
|
890
|
+
}
|
|
891
|
+
function enableFocusInside(container) {
|
|
892
|
+
container.querySelectorAll("[data-tabindex]").forEach((element) => {
|
|
893
|
+
const tabindex = element.dataset.tabindex;
|
|
894
|
+
delete element.dataset.tabindex;
|
|
895
|
+
if (tabindex) element.setAttribute("tabindex", tabindex);
|
|
896
|
+
else element.removeAttribute("tabindex");
|
|
897
|
+
});
|
|
898
|
+
}
|
|
899
|
+
//#endregion
|
|
900
|
+
//#region ../../node_modules/@base-ui-components/react/esm/composite/composite.js
|
|
901
|
+
var ARROW_UP = "ArrowUp";
|
|
902
|
+
var ARROW_DOWN = "ArrowDown";
|
|
903
|
+
var ARROW_LEFT = "ArrowLeft";
|
|
904
|
+
var ARROW_RIGHT = "ArrowRight";
|
|
905
|
+
var HOME = "Home";
|
|
906
|
+
var HORIZONTAL_KEYS = new Set([ARROW_LEFT, ARROW_RIGHT]);
|
|
907
|
+
var VERTICAL_KEYS = new Set([ARROW_UP, ARROW_DOWN]);
|
|
908
|
+
var ARROW_KEYS = new Set([...HORIZONTAL_KEYS, ...VERTICAL_KEYS]);
|
|
909
|
+
new Set([
|
|
910
|
+
...ARROW_KEYS,
|
|
911
|
+
HOME,
|
|
912
|
+
"End"
|
|
913
|
+
]);
|
|
914
|
+
var COMPOSITE_KEYS = new Set([
|
|
915
|
+
ARROW_UP,
|
|
916
|
+
ARROW_DOWN,
|
|
917
|
+
ARROW_LEFT,
|
|
918
|
+
ARROW_RIGHT,
|
|
919
|
+
HOME,
|
|
920
|
+
"End"
|
|
921
|
+
]);
|
|
922
|
+
//#endregion
|
|
923
|
+
//#region ../../node_modules/@base-ui-components/utils/esm/useLatestRef.js
|
|
924
|
+
function useLatestRef$1(value) {
|
|
925
|
+
const latest = useRefWithInit(createLatestRef, value).current;
|
|
926
|
+
latest.next = value;
|
|
927
|
+
useIsoLayoutEffect(latest.effect);
|
|
928
|
+
return latest;
|
|
929
|
+
}
|
|
930
|
+
function createLatestRef(value) {
|
|
931
|
+
const latest = {
|
|
932
|
+
current: value,
|
|
933
|
+
next: value,
|
|
934
|
+
effect: () => {
|
|
935
|
+
latest.current = latest.next;
|
|
936
|
+
}
|
|
937
|
+
};
|
|
938
|
+
return latest;
|
|
939
|
+
}
|
|
940
|
+
//#endregion
|
|
941
|
+
//#region ../../node_modules/@base-ui-components/react/esm/utils/useOpenChangeComplete.js
|
|
942
|
+
/**
|
|
943
|
+
* Calls the provided function when the CSS open/close animation or transition completes.
|
|
944
|
+
*/
|
|
945
|
+
function useOpenChangeComplete(parameters) {
|
|
946
|
+
const { enabled = true, open, ref, onComplete: onCompleteParam } = parameters;
|
|
947
|
+
const openRef = useLatestRef$1(open);
|
|
948
|
+
const onComplete = useEventCallback(onCompleteParam);
|
|
949
|
+
const runOnceAnimationsFinish = useAnimationsFinished(ref, open);
|
|
950
|
+
React$1.useEffect(() => {
|
|
951
|
+
if (!enabled) return;
|
|
952
|
+
runOnceAnimationsFinish(() => {
|
|
953
|
+
if (open === openRef.current) onComplete();
|
|
954
|
+
});
|
|
955
|
+
}, [
|
|
956
|
+
enabled,
|
|
957
|
+
open,
|
|
958
|
+
onComplete,
|
|
959
|
+
runOnceAnimationsFinish,
|
|
960
|
+
openRef
|
|
961
|
+
]);
|
|
962
|
+
}
|
|
963
|
+
//#endregion
|
|
964
|
+
//#region ../../node_modules/@base-ui-components/react/esm/utils/popupStateMapping.js
|
|
965
|
+
var CommonPopupDataAttributes = function(CommonPopupDataAttributes) {
|
|
966
|
+
/**
|
|
967
|
+
* Present when the popup is open.
|
|
968
|
+
*/
|
|
969
|
+
CommonPopupDataAttributes["open"] = "data-open";
|
|
970
|
+
/**
|
|
971
|
+
* Present when the popup is closed.
|
|
972
|
+
*/
|
|
973
|
+
CommonPopupDataAttributes["closed"] = "data-closed";
|
|
974
|
+
/**
|
|
975
|
+
* Present when the popup is animating in.
|
|
976
|
+
*/
|
|
977
|
+
CommonPopupDataAttributes[CommonPopupDataAttributes["startingStyle"] = TransitionStatusDataAttributes.startingStyle] = "startingStyle";
|
|
978
|
+
/**
|
|
979
|
+
* Present when the popup is animating out.
|
|
980
|
+
*/
|
|
981
|
+
CommonPopupDataAttributes[CommonPopupDataAttributes["endingStyle"] = TransitionStatusDataAttributes.endingStyle] = "endingStyle";
|
|
982
|
+
/**
|
|
983
|
+
* Present when the anchor is hidden.
|
|
984
|
+
*/
|
|
985
|
+
CommonPopupDataAttributes["anchorHidden"] = "data-anchor-hidden";
|
|
986
|
+
return CommonPopupDataAttributes;
|
|
987
|
+
}({});
|
|
988
|
+
var CommonTriggerDataAttributes = /* @__PURE__ */ function(CommonTriggerDataAttributes) {
|
|
989
|
+
/**
|
|
990
|
+
* Present when the popup is open.
|
|
991
|
+
*/
|
|
992
|
+
CommonTriggerDataAttributes["popupOpen"] = "data-popup-open";
|
|
993
|
+
/**
|
|
994
|
+
* Present when a pressable trigger is pressed.
|
|
995
|
+
*/
|
|
996
|
+
CommonTriggerDataAttributes["pressed"] = "data-pressed";
|
|
997
|
+
return CommonTriggerDataAttributes;
|
|
998
|
+
}({});
|
|
999
|
+
var TRIGGER_HOOK = { [CommonTriggerDataAttributes.popupOpen]: "" };
|
|
1000
|
+
var PRESSABLE_TRIGGER_HOOK = {
|
|
1001
|
+
[CommonTriggerDataAttributes.popupOpen]: "",
|
|
1002
|
+
[CommonTriggerDataAttributes.pressed]: ""
|
|
1003
|
+
};
|
|
1004
|
+
var POPUP_OPEN_HOOK = { [CommonPopupDataAttributes.open]: "" };
|
|
1005
|
+
var POPUP_CLOSED_HOOK = { [CommonPopupDataAttributes.closed]: "" };
|
|
1006
|
+
var ANCHOR_HIDDEN_HOOK = { [CommonPopupDataAttributes.anchorHidden]: "" };
|
|
1007
|
+
var triggerOpenStateMapping = { open(value) {
|
|
1008
|
+
if (value) return TRIGGER_HOOK;
|
|
1009
|
+
return null;
|
|
1010
|
+
} };
|
|
1011
|
+
var pressableTriggerOpenStateMapping = { open(value) {
|
|
1012
|
+
if (value) return PRESSABLE_TRIGGER_HOOK;
|
|
1013
|
+
return null;
|
|
1014
|
+
} };
|
|
1015
|
+
var popupStateMapping = {
|
|
1016
|
+
open(value) {
|
|
1017
|
+
if (value) return POPUP_OPEN_HOOK;
|
|
1018
|
+
return POPUP_CLOSED_HOOK;
|
|
1019
|
+
},
|
|
1020
|
+
anchorHidden(value) {
|
|
1021
|
+
if (value) return ANCHOR_HIDDEN_HOOK;
|
|
1022
|
+
return null;
|
|
1023
|
+
}
|
|
1024
|
+
};
|
|
1025
|
+
//#endregion
|
|
1026
|
+
//#region ../../node_modules/@base-ui-components/utils/esm/inertValue.js
|
|
1027
|
+
function inertValue(value) {
|
|
1028
|
+
if (isReactVersionAtLeast(19)) return value;
|
|
1029
|
+
return value ? "true" : void 0;
|
|
1030
|
+
}
|
|
1031
|
+
//#endregion
|
|
1032
|
+
//#region ../../node_modules/@base-ui-components/utils/esm/useTimeout.js
|
|
1033
|
+
var EMPTY = 0;
|
|
1034
|
+
var Timeout = class Timeout {
|
|
1035
|
+
constructor() {
|
|
1036
|
+
_defineProperty(this, "currentId", EMPTY);
|
|
1037
|
+
_defineProperty(this, "clear", () => {
|
|
1038
|
+
if (this.currentId !== EMPTY) {
|
|
1039
|
+
clearTimeout(this.currentId);
|
|
1040
|
+
this.currentId = EMPTY;
|
|
1041
|
+
}
|
|
1042
|
+
});
|
|
1043
|
+
_defineProperty(this, "disposeEffect", () => {
|
|
1044
|
+
return this.clear;
|
|
1045
|
+
});
|
|
1046
|
+
}
|
|
1047
|
+
static create() {
|
|
1048
|
+
return new Timeout();
|
|
1049
|
+
}
|
|
1050
|
+
/**
|
|
1051
|
+
* Executes `fn` after `delay`, clearing any previously scheduled call.
|
|
1052
|
+
*/
|
|
1053
|
+
start(delay, fn) {
|
|
1054
|
+
this.clear();
|
|
1055
|
+
this.currentId = setTimeout(() => {
|
|
1056
|
+
this.currentId = EMPTY;
|
|
1057
|
+
fn();
|
|
1058
|
+
}, delay);
|
|
1059
|
+
}
|
|
1060
|
+
isStarted() {
|
|
1061
|
+
return this.currentId !== EMPTY;
|
|
1062
|
+
}
|
|
1063
|
+
};
|
|
1064
|
+
/**
|
|
1065
|
+
* A `setTimeout` with automatic cleanup and guard.
|
|
1066
|
+
*/
|
|
1067
|
+
function useTimeout() {
|
|
1068
|
+
const timeout = useRefWithInit(Timeout.create).current;
|
|
1069
|
+
useOnMount(timeout.disposeEffect);
|
|
1070
|
+
return timeout;
|
|
1071
|
+
}
|
|
1072
|
+
//#endregion
|
|
1073
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/utils/createEventEmitter.js
|
|
1074
|
+
function createEventEmitter() {
|
|
1075
|
+
const map = /* @__PURE__ */ new Map();
|
|
1076
|
+
return {
|
|
1077
|
+
emit(event, data) {
|
|
1078
|
+
var _map$get;
|
|
1079
|
+
(_map$get = map.get(event)) === null || _map$get === void 0 || _map$get.forEach((listener) => listener(data));
|
|
1080
|
+
},
|
|
1081
|
+
on(event, listener) {
|
|
1082
|
+
if (!map.has(event)) map.set(event, /* @__PURE__ */ new Set());
|
|
1083
|
+
map.get(event).add(listener);
|
|
1084
|
+
},
|
|
1085
|
+
off(event, listener) {
|
|
1086
|
+
var _map$get2;
|
|
1087
|
+
(_map$get2 = map.get(event)) === null || _map$get2 === void 0 || _map$get2.delete(listener);
|
|
1088
|
+
}
|
|
1089
|
+
};
|
|
1090
|
+
}
|
|
1091
|
+
//#endregion
|
|
1092
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/components/FloatingTree.js
|
|
1093
|
+
var import_jsx_runtime = require_jsx_runtime();
|
|
1094
|
+
var FloatingNodeContext = /* @__PURE__ */ React$1.createContext(null);
|
|
1095
|
+
if (process.env.NODE_ENV !== "production") FloatingNodeContext.displayName = "FloatingNodeContext";
|
|
1096
|
+
var FloatingTreeContext = /* @__PURE__ */ React$1.createContext(null);
|
|
1097
|
+
/**
|
|
1098
|
+
* Returns the parent node id for nested floating elements, if available.
|
|
1099
|
+
* Returns `null` for top-level floating elements.
|
|
1100
|
+
*/
|
|
1101
|
+
if (process.env.NODE_ENV !== "production") FloatingTreeContext.displayName = "FloatingTreeContext";
|
|
1102
|
+
var useFloatingParentNodeId = () => {
|
|
1103
|
+
var _React$useContext;
|
|
1104
|
+
return ((_React$useContext = React$1.useContext(FloatingNodeContext)) === null || _React$useContext === void 0 ? void 0 : _React$useContext.id) || null;
|
|
1105
|
+
};
|
|
1106
|
+
/**
|
|
1107
|
+
* Returns the nearest floating tree context, if available.
|
|
1108
|
+
*/
|
|
1109
|
+
var useFloatingTree = () => React$1.useContext(FloatingTreeContext);
|
|
1110
|
+
/**
|
|
1111
|
+
* Registers a node into the `FloatingTree`, returning its id.
|
|
1112
|
+
* @see https://floating-ui.com/docs/FloatingTree
|
|
1113
|
+
*/
|
|
1114
|
+
function useFloatingNodeId(customParentId) {
|
|
1115
|
+
const id = useId$1();
|
|
1116
|
+
const tree = useFloatingTree();
|
|
1117
|
+
const reactParentId = useFloatingParentNodeId();
|
|
1118
|
+
const parentId = customParentId || reactParentId;
|
|
1119
|
+
useIsoLayoutEffect(() => {
|
|
1120
|
+
if (!id) return;
|
|
1121
|
+
const node = {
|
|
1122
|
+
id,
|
|
1123
|
+
parentId
|
|
1124
|
+
};
|
|
1125
|
+
tree === null || tree === void 0 || tree.addNode(node);
|
|
1126
|
+
return () => {
|
|
1127
|
+
tree === null || tree === void 0 || tree.removeNode(node);
|
|
1128
|
+
};
|
|
1129
|
+
}, [
|
|
1130
|
+
tree,
|
|
1131
|
+
id,
|
|
1132
|
+
parentId
|
|
1133
|
+
]);
|
|
1134
|
+
return id;
|
|
1135
|
+
}
|
|
1136
|
+
/**
|
|
1137
|
+
* Provides parent node context for nested floating elements.
|
|
1138
|
+
* @see https://floating-ui.com/docs/FloatingTree
|
|
1139
|
+
* @internal
|
|
1140
|
+
*/
|
|
1141
|
+
function FloatingNode(props) {
|
|
1142
|
+
const { children, id } = props;
|
|
1143
|
+
const parentId = useFloatingParentNodeId();
|
|
1144
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FloatingNodeContext.Provider, {
|
|
1145
|
+
value: React$1.useMemo(() => ({
|
|
1146
|
+
id,
|
|
1147
|
+
parentId
|
|
1148
|
+
}), [id, parentId]),
|
|
1149
|
+
children
|
|
1150
|
+
});
|
|
1151
|
+
}
|
|
1152
|
+
/**
|
|
1153
|
+
* Provides context for nested floating elements when they are not children of
|
|
1154
|
+
* each other on the DOM.
|
|
1155
|
+
* This is not necessary in all cases, except when there must be explicit communication between parent and child floating elements. It is necessary for:
|
|
1156
|
+
* - The `bubbles` option in the `useDismiss()` Hook
|
|
1157
|
+
* - Nested virtual list navigation
|
|
1158
|
+
* - Nested floating elements that each open on hover
|
|
1159
|
+
* - Custom communication between parent and child floating elements
|
|
1160
|
+
* @see https://floating-ui.com/docs/FloatingTree
|
|
1161
|
+
* @internal
|
|
1162
|
+
*/
|
|
1163
|
+
function FloatingTree(props) {
|
|
1164
|
+
const { children } = props;
|
|
1165
|
+
const nodesRef = React$1.useRef([]);
|
|
1166
|
+
const addNode = React$1.useCallback((node) => {
|
|
1167
|
+
nodesRef.current = [...nodesRef.current, node];
|
|
1168
|
+
}, []);
|
|
1169
|
+
const removeNode = React$1.useCallback((node) => {
|
|
1170
|
+
nodesRef.current = nodesRef.current.filter((n) => n !== node);
|
|
1171
|
+
}, []);
|
|
1172
|
+
const [events] = React$1.useState(() => createEventEmitter());
|
|
1173
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FloatingTreeContext.Provider, {
|
|
1174
|
+
value: React$1.useMemo(() => ({
|
|
1175
|
+
nodesRef,
|
|
1176
|
+
addNode,
|
|
1177
|
+
removeNode,
|
|
1178
|
+
events
|
|
1179
|
+
}), [
|
|
1180
|
+
addNode,
|
|
1181
|
+
removeNode,
|
|
1182
|
+
events
|
|
1183
|
+
]),
|
|
1184
|
+
children
|
|
1185
|
+
});
|
|
1186
|
+
}
|
|
1187
|
+
//#endregion
|
|
1188
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/utils/createAttribute.js
|
|
1189
|
+
function createAttribute(name) {
|
|
1190
|
+
return `data-base-ui-${name}`;
|
|
1191
|
+
}
|
|
1192
|
+
//#endregion
|
|
1193
|
+
//#region ../../node_modules/@base-ui-components/utils/esm/visuallyHidden.js
|
|
1194
|
+
var visuallyHidden = {
|
|
1195
|
+
clip: "rect(0 0 0 0)",
|
|
1196
|
+
overflow: "hidden",
|
|
1197
|
+
whiteSpace: "nowrap",
|
|
1198
|
+
position: "fixed",
|
|
1199
|
+
top: 0,
|
|
1200
|
+
left: 0,
|
|
1201
|
+
border: 0,
|
|
1202
|
+
padding: 0,
|
|
1203
|
+
width: 1,
|
|
1204
|
+
height: 1,
|
|
1205
|
+
margin: -1
|
|
1206
|
+
};
|
|
1207
|
+
//#endregion
|
|
1208
|
+
//#region ../../node_modules/@base-ui-components/utils/esm/owner.js
|
|
1209
|
+
function ownerDocument(node) {
|
|
1210
|
+
return (node === null || node === void 0 ? void 0 : node.ownerDocument) || document;
|
|
1211
|
+
}
|
|
1212
|
+
//#endregion
|
|
1213
|
+
//#region ../../node_modules/@base-ui-components/react/esm/utils/FocusGuard.js
|
|
1214
|
+
/**
|
|
1215
|
+
* @internal
|
|
1216
|
+
*/
|
|
1217
|
+
var FocusGuard = /* @__PURE__ */ React$1.forwardRef(function FocusGuard(props, ref) {
|
|
1218
|
+
const [role, setRole] = React$1.useState();
|
|
1219
|
+
useIsoLayoutEffect(() => {
|
|
1220
|
+
if (isSafari) setRole("button");
|
|
1221
|
+
}, []);
|
|
1222
|
+
const restProps = {
|
|
1223
|
+
tabIndex: 0,
|
|
1224
|
+
role
|
|
1225
|
+
};
|
|
1226
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
|
|
1227
|
+
...props,
|
|
1228
|
+
ref,
|
|
1229
|
+
style: visuallyHidden,
|
|
1230
|
+
"aria-hidden": role ? void 0 : true,
|
|
1231
|
+
...restProps,
|
|
1232
|
+
"data-base-ui-focus-guard": ""
|
|
1233
|
+
});
|
|
1234
|
+
});
|
|
1235
|
+
if (process.env.NODE_ENV !== "production") FocusGuard.displayName = "FocusGuard";
|
|
1236
|
+
//#endregion
|
|
1237
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/utils/enqueueFocus.js
|
|
1238
|
+
var rafId = 0;
|
|
1239
|
+
function enqueueFocus(el, options = {}) {
|
|
1240
|
+
const { preventScroll = false, cancelPrevious = true, sync = false } = options;
|
|
1241
|
+
if (cancelPrevious) cancelAnimationFrame(rafId);
|
|
1242
|
+
const exec = () => el === null || el === void 0 ? void 0 : el.focus({ preventScroll });
|
|
1243
|
+
if (sync) exec();
|
|
1244
|
+
else rafId = requestAnimationFrame(exec);
|
|
1245
|
+
}
|
|
1246
|
+
//#endregion
|
|
1247
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/utils/markOthers.js
|
|
1248
|
+
var counters = {
|
|
1249
|
+
inert: /* @__PURE__ */ new WeakMap(),
|
|
1250
|
+
"aria-hidden": /* @__PURE__ */ new WeakMap(),
|
|
1251
|
+
none: /* @__PURE__ */ new WeakMap()
|
|
1252
|
+
};
|
|
1253
|
+
function getCounterMap(control) {
|
|
1254
|
+
if (control === "inert") return counters.inert;
|
|
1255
|
+
if (control === "aria-hidden") return counters["aria-hidden"];
|
|
1256
|
+
return counters.none;
|
|
1257
|
+
}
|
|
1258
|
+
var uncontrolledElementsSet = /* @__PURE__ */ new WeakSet();
|
|
1259
|
+
var markerMap = {};
|
|
1260
|
+
var lockCount = 0;
|
|
1261
|
+
var unwrapHost = (node) => node && (node.host || unwrapHost(node.parentNode));
|
|
1262
|
+
var correctElements = (parent, targets) => targets.map((target) => {
|
|
1263
|
+
if (parent.contains(target)) return target;
|
|
1264
|
+
const correctedTarget = unwrapHost(target);
|
|
1265
|
+
if (parent.contains(correctedTarget)) return correctedTarget;
|
|
1266
|
+
return null;
|
|
1267
|
+
}).filter((x) => x != null);
|
|
1268
|
+
function applyAttributeToOthers(uncorrectedAvoidElements, body, ariaHidden, inert) {
|
|
1269
|
+
const markerName = "data-base-ui-inert";
|
|
1270
|
+
const controlAttribute = inert ? "inert" : ariaHidden ? "aria-hidden" : null;
|
|
1271
|
+
const avoidElements = correctElements(body, uncorrectedAvoidElements);
|
|
1272
|
+
const elementsToKeep = /* @__PURE__ */ new Set();
|
|
1273
|
+
const elementsToStop = new Set(avoidElements);
|
|
1274
|
+
const hiddenElements = [];
|
|
1275
|
+
if (!markerMap[markerName]) markerMap[markerName] = /* @__PURE__ */ new WeakMap();
|
|
1276
|
+
const markerCounter = markerMap[markerName];
|
|
1277
|
+
avoidElements.forEach(keep);
|
|
1278
|
+
deep(body);
|
|
1279
|
+
elementsToKeep.clear();
|
|
1280
|
+
function keep(el) {
|
|
1281
|
+
if (!el || elementsToKeep.has(el)) return;
|
|
1282
|
+
elementsToKeep.add(el);
|
|
1283
|
+
if (el.parentNode) keep(el.parentNode);
|
|
1284
|
+
}
|
|
1285
|
+
function deep(parent) {
|
|
1286
|
+
if (!parent || elementsToStop.has(parent)) return;
|
|
1287
|
+
[].forEach.call(parent.children, (node) => {
|
|
1288
|
+
if (getNodeName(node) === "script") return;
|
|
1289
|
+
if (elementsToKeep.has(node)) deep(node);
|
|
1290
|
+
else {
|
|
1291
|
+
const attr = controlAttribute ? node.getAttribute(controlAttribute) : null;
|
|
1292
|
+
const alreadyHidden = attr !== null && attr !== "false";
|
|
1293
|
+
const counterMap = getCounterMap(controlAttribute);
|
|
1294
|
+
const counterValue = (counterMap.get(node) || 0) + 1;
|
|
1295
|
+
const markerValue = (markerCounter.get(node) || 0) + 1;
|
|
1296
|
+
counterMap.set(node, counterValue);
|
|
1297
|
+
markerCounter.set(node, markerValue);
|
|
1298
|
+
hiddenElements.push(node);
|
|
1299
|
+
if (counterValue === 1 && alreadyHidden) uncontrolledElementsSet.add(node);
|
|
1300
|
+
if (markerValue === 1) node.setAttribute(markerName, "");
|
|
1301
|
+
if (!alreadyHidden && controlAttribute) node.setAttribute(controlAttribute, controlAttribute === "inert" ? "" : "true");
|
|
1302
|
+
}
|
|
1303
|
+
});
|
|
1304
|
+
}
|
|
1305
|
+
lockCount += 1;
|
|
1306
|
+
return () => {
|
|
1307
|
+
hiddenElements.forEach((element) => {
|
|
1308
|
+
const counterMap = getCounterMap(controlAttribute);
|
|
1309
|
+
const counterValue = (counterMap.get(element) || 0) - 1;
|
|
1310
|
+
const markerValue = (markerCounter.get(element) || 0) - 1;
|
|
1311
|
+
counterMap.set(element, counterValue);
|
|
1312
|
+
markerCounter.set(element, markerValue);
|
|
1313
|
+
if (!counterValue) {
|
|
1314
|
+
if (!uncontrolledElementsSet.has(element) && controlAttribute) element.removeAttribute(controlAttribute);
|
|
1315
|
+
uncontrolledElementsSet.delete(element);
|
|
1316
|
+
}
|
|
1317
|
+
if (!markerValue) element.removeAttribute(markerName);
|
|
1318
|
+
});
|
|
1319
|
+
lockCount -= 1;
|
|
1320
|
+
if (!lockCount) {
|
|
1321
|
+
counters.inert = /* @__PURE__ */ new WeakMap();
|
|
1322
|
+
counters["aria-hidden"] = /* @__PURE__ */ new WeakMap();
|
|
1323
|
+
counters.none = /* @__PURE__ */ new WeakMap();
|
|
1324
|
+
uncontrolledElementsSet = /* @__PURE__ */ new WeakSet();
|
|
1325
|
+
markerMap = {};
|
|
1326
|
+
}
|
|
1327
|
+
};
|
|
1328
|
+
}
|
|
1329
|
+
function markOthers(avoidElements, ariaHidden = false, inert = false) {
|
|
1330
|
+
const body = getDocument(avoidElements[0]).body;
|
|
1331
|
+
return applyAttributeToOthers(avoidElements.concat(Array.from(body.querySelectorAll("[aria-live]"))), body, ariaHidden, inert);
|
|
1332
|
+
}
|
|
1333
|
+
//#endregion
|
|
1334
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/components/FloatingPortal.js
|
|
1335
|
+
var PortalContext = /* @__PURE__ */ React$1.createContext(null);
|
|
1336
|
+
if (process.env.NODE_ENV !== "production") PortalContext.displayName = "PortalContext";
|
|
1337
|
+
var usePortalContext = () => React$1.useContext(PortalContext);
|
|
1338
|
+
var attr = createAttribute("portal");
|
|
1339
|
+
/**
|
|
1340
|
+
* @see https://floating-ui.com/docs/FloatingPortal#usefloatingportalnode
|
|
1341
|
+
*/
|
|
1342
|
+
function useFloatingPortalNode(props = {}) {
|
|
1343
|
+
const { id, root } = props;
|
|
1344
|
+
const uniqueId = useId$1();
|
|
1345
|
+
const portalContext = usePortalContext();
|
|
1346
|
+
const [portalNode, setPortalNode] = React$1.useState(null);
|
|
1347
|
+
const portalNodeRef = React$1.useRef(null);
|
|
1348
|
+
useIsoLayoutEffect(() => {
|
|
1349
|
+
return () => {
|
|
1350
|
+
portalNode === null || portalNode === void 0 || portalNode.remove();
|
|
1351
|
+
queueMicrotask(() => {
|
|
1352
|
+
portalNodeRef.current = null;
|
|
1353
|
+
});
|
|
1354
|
+
};
|
|
1355
|
+
}, [portalNode]);
|
|
1356
|
+
useIsoLayoutEffect(() => {
|
|
1357
|
+
if (!uniqueId) return;
|
|
1358
|
+
if (portalNodeRef.current) return;
|
|
1359
|
+
const existingIdRoot = id ? document.getElementById(id) : null;
|
|
1360
|
+
if (!existingIdRoot) return;
|
|
1361
|
+
const subRoot = document.createElement("div");
|
|
1362
|
+
subRoot.id = uniqueId;
|
|
1363
|
+
subRoot.setAttribute(attr, "");
|
|
1364
|
+
existingIdRoot.appendChild(subRoot);
|
|
1365
|
+
portalNodeRef.current = subRoot;
|
|
1366
|
+
setPortalNode(subRoot);
|
|
1367
|
+
}, [id, uniqueId]);
|
|
1368
|
+
useIsoLayoutEffect(() => {
|
|
1369
|
+
if (root === null) return;
|
|
1370
|
+
if (!uniqueId) return;
|
|
1371
|
+
if (portalNodeRef.current) return;
|
|
1372
|
+
let container = root || (portalContext === null || portalContext === void 0 ? void 0 : portalContext.portalNode);
|
|
1373
|
+
if (container && !isNode(container)) container = container.current;
|
|
1374
|
+
container = container || document.body;
|
|
1375
|
+
let idWrapper = null;
|
|
1376
|
+
if (id) {
|
|
1377
|
+
idWrapper = document.createElement("div");
|
|
1378
|
+
idWrapper.id = id;
|
|
1379
|
+
container.appendChild(idWrapper);
|
|
1380
|
+
}
|
|
1381
|
+
const subRoot = document.createElement("div");
|
|
1382
|
+
subRoot.id = uniqueId;
|
|
1383
|
+
subRoot.setAttribute(attr, "");
|
|
1384
|
+
container = idWrapper || container;
|
|
1385
|
+
container.appendChild(subRoot);
|
|
1386
|
+
portalNodeRef.current = subRoot;
|
|
1387
|
+
setPortalNode(subRoot);
|
|
1388
|
+
}, [
|
|
1389
|
+
id,
|
|
1390
|
+
root,
|
|
1391
|
+
uniqueId,
|
|
1392
|
+
portalContext
|
|
1393
|
+
]);
|
|
1394
|
+
return portalNode;
|
|
1395
|
+
}
|
|
1396
|
+
/**
|
|
1397
|
+
* Portals the floating element into a given container element — by default,
|
|
1398
|
+
* outside of the app root and into the body.
|
|
1399
|
+
* This is necessary to ensure the floating element can appear outside any
|
|
1400
|
+
* potential parent containers that cause clipping (such as `overflow: hidden`),
|
|
1401
|
+
* while retaining its location in the React tree.
|
|
1402
|
+
* @see https://floating-ui.com/docs/FloatingPortal
|
|
1403
|
+
* @internal
|
|
1404
|
+
*/
|
|
1405
|
+
function FloatingPortal(props) {
|
|
1406
|
+
const { children, id, root, preserveTabOrder = true } = props;
|
|
1407
|
+
const portalNode = useFloatingPortalNode({
|
|
1408
|
+
id,
|
|
1409
|
+
root
|
|
1410
|
+
});
|
|
1411
|
+
const [focusManagerState, setFocusManagerState] = React$1.useState(null);
|
|
1412
|
+
const beforeOutsideRef = React$1.useRef(null);
|
|
1413
|
+
const afterOutsideRef = React$1.useRef(null);
|
|
1414
|
+
const beforeInsideRef = React$1.useRef(null);
|
|
1415
|
+
const afterInsideRef = React$1.useRef(null);
|
|
1416
|
+
const modal = focusManagerState === null || focusManagerState === void 0 ? void 0 : focusManagerState.modal;
|
|
1417
|
+
const open = focusManagerState === null || focusManagerState === void 0 ? void 0 : focusManagerState.open;
|
|
1418
|
+
const shouldRenderGuards = !!focusManagerState && !focusManagerState.modal && focusManagerState.open && preserveTabOrder && !!(root || portalNode);
|
|
1419
|
+
React$1.useEffect(() => {
|
|
1420
|
+
if (!portalNode || !preserveTabOrder || modal) return;
|
|
1421
|
+
function onFocus(event) {
|
|
1422
|
+
if (portalNode && isOutsideEvent(event)) (event.type === "focusin" ? enableFocusInside : disableFocusInside)(portalNode);
|
|
1423
|
+
}
|
|
1424
|
+
portalNode.addEventListener("focusin", onFocus, true);
|
|
1425
|
+
portalNode.addEventListener("focusout", onFocus, true);
|
|
1426
|
+
return () => {
|
|
1427
|
+
portalNode.removeEventListener("focusin", onFocus, true);
|
|
1428
|
+
portalNode.removeEventListener("focusout", onFocus, true);
|
|
1429
|
+
};
|
|
1430
|
+
}, [
|
|
1431
|
+
portalNode,
|
|
1432
|
+
preserveTabOrder,
|
|
1433
|
+
modal
|
|
1434
|
+
]);
|
|
1435
|
+
React$1.useEffect(() => {
|
|
1436
|
+
if (!portalNode) return;
|
|
1437
|
+
if (open) return;
|
|
1438
|
+
enableFocusInside(portalNode);
|
|
1439
|
+
}, [open, portalNode]);
|
|
1440
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(PortalContext.Provider, {
|
|
1441
|
+
value: React$1.useMemo(() => ({
|
|
1442
|
+
preserveTabOrder,
|
|
1443
|
+
beforeOutsideRef,
|
|
1444
|
+
afterOutsideRef,
|
|
1445
|
+
beforeInsideRef,
|
|
1446
|
+
afterInsideRef,
|
|
1447
|
+
portalNode,
|
|
1448
|
+
setFocusManagerState
|
|
1449
|
+
}), [preserveTabOrder, portalNode]),
|
|
1450
|
+
children: [
|
|
1451
|
+
shouldRenderGuards && portalNode && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FocusGuard, {
|
|
1452
|
+
"data-type": "outside",
|
|
1453
|
+
ref: beforeOutsideRef,
|
|
1454
|
+
onFocus: (event) => {
|
|
1455
|
+
if (isOutsideEvent(event, portalNode)) {
|
|
1456
|
+
var _beforeInsideRef$curr;
|
|
1457
|
+
(_beforeInsideRef$curr = beforeInsideRef.current) === null || _beforeInsideRef$curr === void 0 || _beforeInsideRef$curr.focus();
|
|
1458
|
+
} else {
|
|
1459
|
+
const prevTabbable = getPreviousTabbable(focusManagerState ? focusManagerState.domReference : null);
|
|
1460
|
+
prevTabbable === null || prevTabbable === void 0 || prevTabbable.focus();
|
|
1461
|
+
}
|
|
1462
|
+
}
|
|
1463
|
+
}),
|
|
1464
|
+
shouldRenderGuards && portalNode && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
|
|
1465
|
+
"aria-owns": portalNode.id,
|
|
1466
|
+
style: visuallyHidden
|
|
1467
|
+
}),
|
|
1468
|
+
portalNode && /* @__PURE__ */ ReactDOM$1.createPortal(children, portalNode),
|
|
1469
|
+
shouldRenderGuards && portalNode && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FocusGuard, {
|
|
1470
|
+
"data-type": "outside",
|
|
1471
|
+
ref: afterOutsideRef,
|
|
1472
|
+
onFocus: (event) => {
|
|
1473
|
+
if (isOutsideEvent(event, portalNode)) {
|
|
1474
|
+
var _afterInsideRef$curre;
|
|
1475
|
+
(_afterInsideRef$curre = afterInsideRef.current) === null || _afterInsideRef$curre === void 0 || _afterInsideRef$curre.focus();
|
|
1476
|
+
} else {
|
|
1477
|
+
const nextTabbable = getNextTabbable(focusManagerState ? focusManagerState.domReference : null);
|
|
1478
|
+
nextTabbable === null || nextTabbable === void 0 || nextTabbable.focus();
|
|
1479
|
+
if (focusManagerState === null || focusManagerState === void 0 ? void 0 : focusManagerState.closeOnFocusOut) focusManagerState === null || focusManagerState === void 0 || focusManagerState.onOpenChange(false, createChangeEventDetails("focus-out", event.nativeEvent));
|
|
1480
|
+
}
|
|
1481
|
+
}
|
|
1482
|
+
})
|
|
1483
|
+
]
|
|
1484
|
+
});
|
|
1485
|
+
}
|
|
1486
|
+
//#endregion
|
|
1487
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/components/FloatingFocusManager.js
|
|
1488
|
+
function getEventType(event, lastInteractionType) {
|
|
1489
|
+
const win = getWindow(event.target);
|
|
1490
|
+
if (event instanceof win.KeyboardEvent) return "keyboard";
|
|
1491
|
+
if (event instanceof win.FocusEvent) return lastInteractionType || "keyboard";
|
|
1492
|
+
if ("pointerType" in event) return event.pointerType || "keyboard";
|
|
1493
|
+
if ("touches" in event) return "touch";
|
|
1494
|
+
if (event instanceof win.MouseEvent) return lastInteractionType || (event.detail === 0 ? "keyboard" : "mouse");
|
|
1495
|
+
return "";
|
|
1496
|
+
}
|
|
1497
|
+
var LIST_LIMIT = 20;
|
|
1498
|
+
var previouslyFocusedElements = [];
|
|
1499
|
+
function clearDisconnectedPreviouslyFocusedElements() {
|
|
1500
|
+
previouslyFocusedElements = previouslyFocusedElements.filter((el) => el.isConnected);
|
|
1501
|
+
}
|
|
1502
|
+
function addPreviouslyFocusedElement(element) {
|
|
1503
|
+
clearDisconnectedPreviouslyFocusedElements();
|
|
1504
|
+
if (element && getNodeName(element) !== "body") {
|
|
1505
|
+
previouslyFocusedElements.push(element);
|
|
1506
|
+
if (previouslyFocusedElements.length > LIST_LIMIT) previouslyFocusedElements = previouslyFocusedElements.slice(-LIST_LIMIT);
|
|
1507
|
+
}
|
|
1508
|
+
}
|
|
1509
|
+
function getPreviouslyFocusedElement() {
|
|
1510
|
+
clearDisconnectedPreviouslyFocusedElements();
|
|
1511
|
+
return previouslyFocusedElements[previouslyFocusedElements.length - 1];
|
|
1512
|
+
}
|
|
1513
|
+
function getFirstTabbableElement(container) {
|
|
1514
|
+
if (!container) return null;
|
|
1515
|
+
const tabbableOptions = getTabbableOptions();
|
|
1516
|
+
if (isTabbable(container, tabbableOptions)) return container;
|
|
1517
|
+
return tabbable(container, tabbableOptions)[0] || container;
|
|
1518
|
+
}
|
|
1519
|
+
function handleTabIndex(floatingFocusElement, orderRef) {
|
|
1520
|
+
var _floatingFocusElement;
|
|
1521
|
+
if (!orderRef.current.includes("floating") && !((_floatingFocusElement = floatingFocusElement.getAttribute("role")) === null || _floatingFocusElement === void 0 ? void 0 : _floatingFocusElement.includes("dialog"))) return;
|
|
1522
|
+
const options = getTabbableOptions();
|
|
1523
|
+
const tabbableContent = focusable(floatingFocusElement, options).filter((element) => {
|
|
1524
|
+
const dataTabIndex = element.getAttribute("data-tabindex") || "";
|
|
1525
|
+
return isTabbable(element, options) || element.hasAttribute("data-tabindex") && !dataTabIndex.startsWith("-");
|
|
1526
|
+
});
|
|
1527
|
+
const tabIndex = floatingFocusElement.getAttribute("tabindex");
|
|
1528
|
+
if (orderRef.current.includes("floating") || tabbableContent.length === 0) {
|
|
1529
|
+
if (tabIndex !== "0") floatingFocusElement.setAttribute("tabindex", "0");
|
|
1530
|
+
} else if (tabIndex !== "-1" || floatingFocusElement.hasAttribute("data-tabindex") && floatingFocusElement.getAttribute("data-tabindex") !== "-1") {
|
|
1531
|
+
floatingFocusElement.setAttribute("tabindex", "-1");
|
|
1532
|
+
floatingFocusElement.setAttribute("data-tabindex", "-1");
|
|
1533
|
+
}
|
|
1534
|
+
}
|
|
1535
|
+
/**
|
|
1536
|
+
* Provides focus management for the floating element.
|
|
1537
|
+
* @see https://floating-ui.com/docs/FloatingFocusManager
|
|
1538
|
+
* @internal
|
|
1539
|
+
*/
|
|
1540
|
+
function FloatingFocusManager(props) {
|
|
1541
|
+
const { context, children, disabled = false, order = ["content"], initialFocus = true, returnFocus = true, restoreFocus = false, modal = true, closeOnFocusOut = true, openInteractionType = "", getInsideElements: getInsideElementsProp = () => [] } = props;
|
|
1542
|
+
const { open, onOpenChange, events, dataRef, elements: { domReference, floating } } = context;
|
|
1543
|
+
const getNodeId = useEventCallback(() => {
|
|
1544
|
+
var _dataRef$current$floa;
|
|
1545
|
+
return (_dataRef$current$floa = dataRef.current.floatingContext) === null || _dataRef$current$floa === void 0 ? void 0 : _dataRef$current$floa.nodeId;
|
|
1546
|
+
});
|
|
1547
|
+
const getInsideElements = useEventCallback(getInsideElementsProp);
|
|
1548
|
+
const ignoreInitialFocus = initialFocus === false;
|
|
1549
|
+
const isUntrappedTypeableCombobox = isTypeableCombobox(domReference) && ignoreInitialFocus;
|
|
1550
|
+
const orderRef = useLatestRef$1(order);
|
|
1551
|
+
const initialFocusRef = useLatestRef$1(initialFocus);
|
|
1552
|
+
const returnFocusRef = useLatestRef$1(returnFocus);
|
|
1553
|
+
const openInteractionTypeRef = useLatestRef$1(openInteractionType);
|
|
1554
|
+
const tree = useFloatingTree();
|
|
1555
|
+
const portalContext = usePortalContext();
|
|
1556
|
+
const startDismissButtonRef = React$1.useRef(null);
|
|
1557
|
+
const endDismissButtonRef = React$1.useRef(null);
|
|
1558
|
+
const preventReturnFocusRef = React$1.useRef(false);
|
|
1559
|
+
const isPointerDownRef = React$1.useRef(false);
|
|
1560
|
+
const tabbableIndexRef = React$1.useRef(-1);
|
|
1561
|
+
const closeTypeRef = React$1.useRef("");
|
|
1562
|
+
const lastInteractionTypeRef = React$1.useRef("");
|
|
1563
|
+
const blurTimeout = useTimeout();
|
|
1564
|
+
const pointerDownTimeout = useTimeout();
|
|
1565
|
+
const restoreFocusFrame = useAnimationFrame();
|
|
1566
|
+
const isInsidePortal = portalContext != null;
|
|
1567
|
+
const floatingFocusElement = getFloatingFocusElement(floating);
|
|
1568
|
+
const getTabbableContent = useEventCallback((container = floatingFocusElement) => {
|
|
1569
|
+
return container ? tabbable(container, getTabbableOptions()) : [];
|
|
1570
|
+
});
|
|
1571
|
+
const getTabbableElements = useEventCallback((container) => {
|
|
1572
|
+
const content = getTabbableContent(container);
|
|
1573
|
+
return orderRef.current.map(() => content).filter(Boolean).flat();
|
|
1574
|
+
});
|
|
1575
|
+
React$1.useEffect(() => {
|
|
1576
|
+
if (disabled) return;
|
|
1577
|
+
if (!modal) return;
|
|
1578
|
+
function onKeyDown(event) {
|
|
1579
|
+
if (event.key === "Tab") {
|
|
1580
|
+
if (contains(floatingFocusElement, activeElement(getDocument(floatingFocusElement))) && getTabbableContent().length === 0 && !isUntrappedTypeableCombobox) stopEvent(event);
|
|
1581
|
+
}
|
|
1582
|
+
}
|
|
1583
|
+
const doc = getDocument(floatingFocusElement);
|
|
1584
|
+
doc.addEventListener("keydown", onKeyDown);
|
|
1585
|
+
return () => {
|
|
1586
|
+
doc.removeEventListener("keydown", onKeyDown);
|
|
1587
|
+
};
|
|
1588
|
+
}, [
|
|
1589
|
+
disabled,
|
|
1590
|
+
domReference,
|
|
1591
|
+
floatingFocusElement,
|
|
1592
|
+
modal,
|
|
1593
|
+
orderRef,
|
|
1594
|
+
isUntrappedTypeableCombobox,
|
|
1595
|
+
getTabbableContent,
|
|
1596
|
+
getTabbableElements
|
|
1597
|
+
]);
|
|
1598
|
+
React$1.useEffect(() => {
|
|
1599
|
+
if (disabled) return;
|
|
1600
|
+
if (!floating) return;
|
|
1601
|
+
function handleFocusIn(event) {
|
|
1602
|
+
const target = getTarget(event);
|
|
1603
|
+
const tabbableIndex = getTabbableContent().indexOf(target);
|
|
1604
|
+
if (tabbableIndex !== -1) tabbableIndexRef.current = tabbableIndex;
|
|
1605
|
+
}
|
|
1606
|
+
floating.addEventListener("focusin", handleFocusIn);
|
|
1607
|
+
return () => {
|
|
1608
|
+
floating.removeEventListener("focusin", handleFocusIn);
|
|
1609
|
+
};
|
|
1610
|
+
}, [
|
|
1611
|
+
disabled,
|
|
1612
|
+
floating,
|
|
1613
|
+
getTabbableContent
|
|
1614
|
+
]);
|
|
1615
|
+
React$1.useEffect(() => {
|
|
1616
|
+
if (disabled || !open) return;
|
|
1617
|
+
const doc = getDocument(floatingFocusElement);
|
|
1618
|
+
function onPointerDown(event) {
|
|
1619
|
+
lastInteractionTypeRef.current = event.pointerType || "keyboard";
|
|
1620
|
+
}
|
|
1621
|
+
function onKeyDown() {
|
|
1622
|
+
lastInteractionTypeRef.current = "keyboard";
|
|
1623
|
+
}
|
|
1624
|
+
doc.addEventListener("pointerdown", onPointerDown, true);
|
|
1625
|
+
doc.addEventListener("keydown", onKeyDown, true);
|
|
1626
|
+
return () => {
|
|
1627
|
+
doc.removeEventListener("pointerdown", onPointerDown, true);
|
|
1628
|
+
doc.removeEventListener("keydown", onKeyDown, true);
|
|
1629
|
+
};
|
|
1630
|
+
}, [
|
|
1631
|
+
disabled,
|
|
1632
|
+
floating,
|
|
1633
|
+
domReference,
|
|
1634
|
+
floatingFocusElement,
|
|
1635
|
+
open
|
|
1636
|
+
]);
|
|
1637
|
+
React$1.useEffect(() => {
|
|
1638
|
+
if (disabled) return;
|
|
1639
|
+
if (!closeOnFocusOut) return;
|
|
1640
|
+
function handlePointerDown() {
|
|
1641
|
+
isPointerDownRef.current = true;
|
|
1642
|
+
pointerDownTimeout.start(0, () => {
|
|
1643
|
+
isPointerDownRef.current = false;
|
|
1644
|
+
});
|
|
1645
|
+
}
|
|
1646
|
+
function handleFocusOutside(event) {
|
|
1647
|
+
const relatedTarget = event.relatedTarget;
|
|
1648
|
+
const currentTarget = event.currentTarget;
|
|
1649
|
+
const target = getTarget(event);
|
|
1650
|
+
queueMicrotask(() => {
|
|
1651
|
+
const nodeId = getNodeId();
|
|
1652
|
+
const movedToUnrelatedNode = !(contains(domReference, relatedTarget) || contains(floating, relatedTarget) || contains(relatedTarget, floating) || contains(portalContext === null || portalContext === void 0 ? void 0 : portalContext.portalNode, relatedTarget) || (relatedTarget === null || relatedTarget === void 0 ? void 0 : relatedTarget.hasAttribute(createAttribute("focus-guard"))) || tree && (getNodeChildren(tree.nodesRef.current, nodeId).find((node) => {
|
|
1653
|
+
var _node$context, _node$context2;
|
|
1654
|
+
return contains((_node$context = node.context) === null || _node$context === void 0 ? void 0 : _node$context.elements.floating, relatedTarget) || contains((_node$context2 = node.context) === null || _node$context2 === void 0 ? void 0 : _node$context2.elements.domReference, relatedTarget);
|
|
1655
|
+
}) || getNodeAncestors(tree.nodesRef.current, nodeId).find((node) => {
|
|
1656
|
+
var _node$context3, _node$context4, _node$context5;
|
|
1657
|
+
return [(_node$context3 = node.context) === null || _node$context3 === void 0 ? void 0 : _node$context3.elements.floating, getFloatingFocusElement((_node$context4 = node.context) === null || _node$context4 === void 0 ? void 0 : _node$context4.elements.floating)].includes(relatedTarget) || ((_node$context5 = node.context) === null || _node$context5 === void 0 ? void 0 : _node$context5.elements.domReference) === relatedTarget;
|
|
1658
|
+
})));
|
|
1659
|
+
if (currentTarget === domReference && floatingFocusElement) handleTabIndex(floatingFocusElement, orderRef);
|
|
1660
|
+
if (restoreFocus && currentTarget !== domReference && !(target === null || target === void 0 ? void 0 : target.isConnected) && activeElement(getDocument(floatingFocusElement)) === getDocument(floatingFocusElement).body) {
|
|
1661
|
+
if (isHTMLElement(floatingFocusElement)) {
|
|
1662
|
+
floatingFocusElement.focus();
|
|
1663
|
+
if (restoreFocus === "popup") {
|
|
1664
|
+
restoreFocusFrame.request(() => {
|
|
1665
|
+
floatingFocusElement.focus();
|
|
1666
|
+
});
|
|
1667
|
+
return;
|
|
1668
|
+
}
|
|
1669
|
+
}
|
|
1670
|
+
const prevTabbableIndex = tabbableIndexRef.current;
|
|
1671
|
+
const tabbableContent = getTabbableContent();
|
|
1672
|
+
const nodeToFocus = tabbableContent[prevTabbableIndex] || tabbableContent[tabbableContent.length - 1] || floatingFocusElement;
|
|
1673
|
+
if (isHTMLElement(nodeToFocus)) nodeToFocus.focus();
|
|
1674
|
+
}
|
|
1675
|
+
if (dataRef.current.insideReactTree) {
|
|
1676
|
+
dataRef.current.insideReactTree = false;
|
|
1677
|
+
return;
|
|
1678
|
+
}
|
|
1679
|
+
if ((isUntrappedTypeableCombobox ? true : !modal) && relatedTarget && movedToUnrelatedNode && (isUntrappedTypeableCombobox || relatedTarget !== getPreviouslyFocusedElement())) {
|
|
1680
|
+
preventReturnFocusRef.current = true;
|
|
1681
|
+
onOpenChange(false, createChangeEventDetails("focus-out", event));
|
|
1682
|
+
}
|
|
1683
|
+
});
|
|
1684
|
+
}
|
|
1685
|
+
function markInsideReactTree() {
|
|
1686
|
+
dataRef.current.insideReactTree = true;
|
|
1687
|
+
blurTimeout.start(0, () => {
|
|
1688
|
+
dataRef.current.insideReactTree = false;
|
|
1689
|
+
});
|
|
1690
|
+
}
|
|
1691
|
+
if (floating && isHTMLElement(domReference)) {
|
|
1692
|
+
domReference.addEventListener("focusout", handleFocusOutside);
|
|
1693
|
+
domReference.addEventListener("pointerdown", handlePointerDown);
|
|
1694
|
+
floating.addEventListener("focusout", handleFocusOutside);
|
|
1695
|
+
if (portalContext) floating.addEventListener("focusout", markInsideReactTree, true);
|
|
1696
|
+
return () => {
|
|
1697
|
+
domReference.removeEventListener("focusout", handleFocusOutside);
|
|
1698
|
+
domReference.removeEventListener("pointerdown", handlePointerDown);
|
|
1699
|
+
floating.removeEventListener("focusout", handleFocusOutside);
|
|
1700
|
+
if (portalContext) floating.removeEventListener("focusout", markInsideReactTree, true);
|
|
1701
|
+
};
|
|
1702
|
+
}
|
|
1703
|
+
}, [
|
|
1704
|
+
disabled,
|
|
1705
|
+
domReference,
|
|
1706
|
+
floating,
|
|
1707
|
+
floatingFocusElement,
|
|
1708
|
+
modal,
|
|
1709
|
+
tree,
|
|
1710
|
+
portalContext,
|
|
1711
|
+
onOpenChange,
|
|
1712
|
+
closeOnFocusOut,
|
|
1713
|
+
restoreFocus,
|
|
1714
|
+
getTabbableContent,
|
|
1715
|
+
isUntrappedTypeableCombobox,
|
|
1716
|
+
getNodeId,
|
|
1717
|
+
orderRef,
|
|
1718
|
+
dataRef,
|
|
1719
|
+
blurTimeout,
|
|
1720
|
+
pointerDownTimeout,
|
|
1721
|
+
restoreFocusFrame
|
|
1722
|
+
]);
|
|
1723
|
+
const beforeGuardRef = React$1.useRef(null);
|
|
1724
|
+
const afterGuardRef = React$1.useRef(null);
|
|
1725
|
+
const mergedBeforeGuardRef = useMergedRefs(beforeGuardRef, portalContext === null || portalContext === void 0 ? void 0 : portalContext.beforeInsideRef);
|
|
1726
|
+
const mergedAfterGuardRef = useMergedRefs(afterGuardRef, portalContext === null || portalContext === void 0 ? void 0 : portalContext.afterInsideRef);
|
|
1727
|
+
React$1.useEffect(() => {
|
|
1728
|
+
var _portalContext$portal, _ancestors$find;
|
|
1729
|
+
if (disabled || !floating || !open) return;
|
|
1730
|
+
const portalNodes = Array.from((portalContext === null || portalContext === void 0 || (_portalContext$portal = portalContext.portalNode) === null || _portalContext$portal === void 0 ? void 0 : _portalContext$portal.querySelectorAll(`[${createAttribute("portal")}]`)) || []);
|
|
1731
|
+
const cleanup = markOthers([
|
|
1732
|
+
floating,
|
|
1733
|
+
(_ancestors$find = (tree ? getNodeAncestors(tree.nodesRef.current, getNodeId()) : []).find((node) => {
|
|
1734
|
+
var _node$context6;
|
|
1735
|
+
return isTypeableCombobox(((_node$context6 = node.context) === null || _node$context6 === void 0 ? void 0 : _node$context6.elements.domReference) || null);
|
|
1736
|
+
})) === null || _ancestors$find === void 0 || (_ancestors$find = _ancestors$find.context) === null || _ancestors$find === void 0 ? void 0 : _ancestors$find.elements.domReference,
|
|
1737
|
+
...portalNodes,
|
|
1738
|
+
...getInsideElements(),
|
|
1739
|
+
startDismissButtonRef.current,
|
|
1740
|
+
endDismissButtonRef.current,
|
|
1741
|
+
beforeGuardRef.current,
|
|
1742
|
+
afterGuardRef.current,
|
|
1743
|
+
portalContext === null || portalContext === void 0 ? void 0 : portalContext.beforeOutsideRef.current,
|
|
1744
|
+
portalContext === null || portalContext === void 0 ? void 0 : portalContext.afterOutsideRef.current,
|
|
1745
|
+
isUntrappedTypeableCombobox ? domReference : null
|
|
1746
|
+
].filter((x) => x != null), modal || isUntrappedTypeableCombobox);
|
|
1747
|
+
return () => {
|
|
1748
|
+
cleanup();
|
|
1749
|
+
};
|
|
1750
|
+
}, [
|
|
1751
|
+
open,
|
|
1752
|
+
disabled,
|
|
1753
|
+
domReference,
|
|
1754
|
+
floating,
|
|
1755
|
+
modal,
|
|
1756
|
+
orderRef,
|
|
1757
|
+
portalContext,
|
|
1758
|
+
isUntrappedTypeableCombobox,
|
|
1759
|
+
tree,
|
|
1760
|
+
getNodeId,
|
|
1761
|
+
getInsideElements
|
|
1762
|
+
]);
|
|
1763
|
+
useIsoLayoutEffect(() => {
|
|
1764
|
+
if (disabled || !isHTMLElement(floatingFocusElement)) return;
|
|
1765
|
+
const previouslyFocusedElement = activeElement(getDocument(floatingFocusElement));
|
|
1766
|
+
queueMicrotask(() => {
|
|
1767
|
+
const focusableElements = getTabbableElements(floatingFocusElement);
|
|
1768
|
+
const initialFocusValueOrFn = initialFocusRef.current;
|
|
1769
|
+
const resolvedInitialFocus = typeof initialFocusValueOrFn === "function" ? initialFocusValueOrFn(openInteractionTypeRef.current || "") : initialFocusValueOrFn;
|
|
1770
|
+
if (resolvedInitialFocus === void 0 || resolvedInitialFocus === false) return;
|
|
1771
|
+
let elToFocus;
|
|
1772
|
+
if (resolvedInitialFocus === true || resolvedInitialFocus === null) elToFocus = focusableElements[0] || floatingFocusElement;
|
|
1773
|
+
else if ("current" in resolvedInitialFocus) elToFocus = resolvedInitialFocus.current;
|
|
1774
|
+
else elToFocus = resolvedInitialFocus;
|
|
1775
|
+
elToFocus = elToFocus || focusableElements[0] || floatingFocusElement;
|
|
1776
|
+
if (!contains(floatingFocusElement, previouslyFocusedElement) && open) enqueueFocus(elToFocus, { preventScroll: elToFocus === floatingFocusElement });
|
|
1777
|
+
});
|
|
1778
|
+
}, [
|
|
1779
|
+
disabled,
|
|
1780
|
+
open,
|
|
1781
|
+
floatingFocusElement,
|
|
1782
|
+
ignoreInitialFocus,
|
|
1783
|
+
getTabbableElements,
|
|
1784
|
+
initialFocusRef,
|
|
1785
|
+
openInteractionTypeRef
|
|
1786
|
+
]);
|
|
1787
|
+
useIsoLayoutEffect(() => {
|
|
1788
|
+
if (disabled || !floatingFocusElement) return;
|
|
1789
|
+
const doc = getDocument(floatingFocusElement);
|
|
1790
|
+
addPreviouslyFocusedElement(activeElement(doc));
|
|
1791
|
+
function onOpenChangeLocal(details) {
|
|
1792
|
+
if (!details.open) closeTypeRef.current = getEventType(details.nativeEvent, lastInteractionTypeRef.current);
|
|
1793
|
+
if (details.reason === "trigger-hover" && details.nativeEvent.type === "mouseleave") preventReturnFocusRef.current = true;
|
|
1794
|
+
if (details.reason !== "outside-press") return;
|
|
1795
|
+
if (details.nested) preventReturnFocusRef.current = false;
|
|
1796
|
+
else if (isVirtualClick(details.nativeEvent) || isVirtualPointerEvent(details.nativeEvent)) preventReturnFocusRef.current = false;
|
|
1797
|
+
else {
|
|
1798
|
+
let isPreventScrollSupported = false;
|
|
1799
|
+
document.createElement("div").focus({ get preventScroll() {
|
|
1800
|
+
isPreventScrollSupported = true;
|
|
1801
|
+
return false;
|
|
1802
|
+
} });
|
|
1803
|
+
if (isPreventScrollSupported) preventReturnFocusRef.current = false;
|
|
1804
|
+
else preventReturnFocusRef.current = true;
|
|
1805
|
+
}
|
|
1806
|
+
}
|
|
1807
|
+
events.on("openchange", onOpenChangeLocal);
|
|
1808
|
+
const fallbackEl = doc.createElement("span");
|
|
1809
|
+
fallbackEl.setAttribute("tabindex", "-1");
|
|
1810
|
+
fallbackEl.setAttribute("aria-hidden", "true");
|
|
1811
|
+
Object.assign(fallbackEl.style, visuallyHidden);
|
|
1812
|
+
if (isInsidePortal && domReference) domReference.insertAdjacentElement("afterend", fallbackEl);
|
|
1813
|
+
function getReturnElement() {
|
|
1814
|
+
const returnFocusValueOrFn = returnFocusRef.current;
|
|
1815
|
+
let resolvedReturnFocusValue = typeof returnFocusValueOrFn === "function" ? returnFocusValueOrFn(closeTypeRef.current) : returnFocusValueOrFn;
|
|
1816
|
+
if (resolvedReturnFocusValue === void 0 || resolvedReturnFocusValue === false) return null;
|
|
1817
|
+
if (resolvedReturnFocusValue === null) resolvedReturnFocusValue = true;
|
|
1818
|
+
if (typeof resolvedReturnFocusValue === "boolean") {
|
|
1819
|
+
const el = domReference || getPreviouslyFocusedElement();
|
|
1820
|
+
return el && el.isConnected ? el : fallbackEl;
|
|
1821
|
+
}
|
|
1822
|
+
const fallback = domReference || getPreviouslyFocusedElement() || fallbackEl;
|
|
1823
|
+
if ("current" in resolvedReturnFocusValue) return resolvedReturnFocusValue.current || fallback;
|
|
1824
|
+
return resolvedReturnFocusValue || fallback;
|
|
1825
|
+
}
|
|
1826
|
+
return () => {
|
|
1827
|
+
events.off("openchange", onOpenChangeLocal);
|
|
1828
|
+
const activeEl = activeElement(doc);
|
|
1829
|
+
const isFocusInsideFloatingTree = contains(floating, activeEl) || tree && getNodeChildren(tree.nodesRef.current, getNodeId(), false).some((node) => {
|
|
1830
|
+
var _node$context7;
|
|
1831
|
+
return contains((_node$context7 = node.context) === null || _node$context7 === void 0 ? void 0 : _node$context7.elements.floating, activeEl);
|
|
1832
|
+
});
|
|
1833
|
+
const returnElement = getReturnElement();
|
|
1834
|
+
queueMicrotask(() => {
|
|
1835
|
+
const tabbableReturnElement = getFirstTabbableElement(returnElement);
|
|
1836
|
+
const hasExplicitReturnFocus = typeof returnFocusRef.current !== "boolean";
|
|
1837
|
+
if (returnFocusRef.current && !preventReturnFocusRef.current && isHTMLElement(tabbableReturnElement) && (!hasExplicitReturnFocus && tabbableReturnElement !== activeEl && activeEl !== doc.body ? isFocusInsideFloatingTree : true)) tabbableReturnElement.focus({ preventScroll: true });
|
|
1838
|
+
fallbackEl.remove();
|
|
1839
|
+
});
|
|
1840
|
+
};
|
|
1841
|
+
}, [
|
|
1842
|
+
disabled,
|
|
1843
|
+
floating,
|
|
1844
|
+
floatingFocusElement,
|
|
1845
|
+
returnFocusRef,
|
|
1846
|
+
dataRef,
|
|
1847
|
+
events,
|
|
1848
|
+
tree,
|
|
1849
|
+
isInsidePortal,
|
|
1850
|
+
domReference,
|
|
1851
|
+
getNodeId
|
|
1852
|
+
]);
|
|
1853
|
+
React$1.useEffect(() => {
|
|
1854
|
+
queueMicrotask(() => {
|
|
1855
|
+
preventReturnFocusRef.current = false;
|
|
1856
|
+
});
|
|
1857
|
+
}, [disabled]);
|
|
1858
|
+
React$1.useEffect(() => {
|
|
1859
|
+
if (disabled || !open) return;
|
|
1860
|
+
function handlePointerDown(event) {
|
|
1861
|
+
const target = getTarget(event);
|
|
1862
|
+
if (target === null || target === void 0 ? void 0 : target.closest(`[data-base-ui-click-trigger]`)) isPointerDownRef.current = true;
|
|
1863
|
+
}
|
|
1864
|
+
const doc = getDocument(floatingFocusElement);
|
|
1865
|
+
doc.addEventListener("pointerdown", handlePointerDown, true);
|
|
1866
|
+
return () => {
|
|
1867
|
+
doc.removeEventListener("pointerdown", handlePointerDown, true);
|
|
1868
|
+
};
|
|
1869
|
+
}, [
|
|
1870
|
+
disabled,
|
|
1871
|
+
open,
|
|
1872
|
+
floatingFocusElement
|
|
1873
|
+
]);
|
|
1874
|
+
useIsoLayoutEffect(() => {
|
|
1875
|
+
if (disabled) return;
|
|
1876
|
+
if (!portalContext) return;
|
|
1877
|
+
portalContext.setFocusManagerState({
|
|
1878
|
+
modal,
|
|
1879
|
+
closeOnFocusOut,
|
|
1880
|
+
open,
|
|
1881
|
+
onOpenChange,
|
|
1882
|
+
domReference
|
|
1883
|
+
});
|
|
1884
|
+
return () => {
|
|
1885
|
+
portalContext.setFocusManagerState(null);
|
|
1886
|
+
};
|
|
1887
|
+
}, [
|
|
1888
|
+
disabled,
|
|
1889
|
+
portalContext,
|
|
1890
|
+
modal,
|
|
1891
|
+
open,
|
|
1892
|
+
onOpenChange,
|
|
1893
|
+
closeOnFocusOut,
|
|
1894
|
+
domReference
|
|
1895
|
+
]);
|
|
1896
|
+
useIsoLayoutEffect(() => {
|
|
1897
|
+
if (disabled || !floatingFocusElement) return;
|
|
1898
|
+
handleTabIndex(floatingFocusElement, orderRef);
|
|
1899
|
+
return () => {
|
|
1900
|
+
queueMicrotask(clearDisconnectedPreviouslyFocusedElements);
|
|
1901
|
+
};
|
|
1902
|
+
}, [
|
|
1903
|
+
disabled,
|
|
1904
|
+
floatingFocusElement,
|
|
1905
|
+
orderRef
|
|
1906
|
+
]);
|
|
1907
|
+
const shouldRenderGuards = !disabled && (modal ? !isUntrappedTypeableCombobox : true) && (isInsidePortal || modal);
|
|
1908
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(React$1.Fragment, { children: [
|
|
1909
|
+
shouldRenderGuards && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FocusGuard, {
|
|
1910
|
+
"data-type": "inside",
|
|
1911
|
+
ref: mergedBeforeGuardRef,
|
|
1912
|
+
onFocus: (event) => {
|
|
1913
|
+
if (modal) {
|
|
1914
|
+
const els = getTabbableElements();
|
|
1915
|
+
enqueueFocus(els[els.length - 1]);
|
|
1916
|
+
} else if ((portalContext === null || portalContext === void 0 ? void 0 : portalContext.preserveTabOrder) && portalContext.portalNode) {
|
|
1917
|
+
preventReturnFocusRef.current = false;
|
|
1918
|
+
if (isOutsideEvent(event, portalContext.portalNode)) {
|
|
1919
|
+
const nextTabbable = getNextTabbable(domReference);
|
|
1920
|
+
nextTabbable === null || nextTabbable === void 0 || nextTabbable.focus();
|
|
1921
|
+
} else {
|
|
1922
|
+
var _portalContext$before;
|
|
1923
|
+
(_portalContext$before = portalContext.beforeOutsideRef.current) === null || _portalContext$before === void 0 || _portalContext$before.focus();
|
|
1924
|
+
}
|
|
1925
|
+
}
|
|
1926
|
+
}
|
|
1927
|
+
}),
|
|
1928
|
+
children,
|
|
1929
|
+
shouldRenderGuards && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FocusGuard, {
|
|
1930
|
+
"data-type": "inside",
|
|
1931
|
+
ref: mergedAfterGuardRef,
|
|
1932
|
+
onFocus: (event) => {
|
|
1933
|
+
if (modal) enqueueFocus(getTabbableElements()[0]);
|
|
1934
|
+
else if ((portalContext === null || portalContext === void 0 ? void 0 : portalContext.preserveTabOrder) && portalContext.portalNode) {
|
|
1935
|
+
if (closeOnFocusOut) preventReturnFocusRef.current = true;
|
|
1936
|
+
if (isOutsideEvent(event, portalContext.portalNode)) {
|
|
1937
|
+
const prevTabbable = getPreviousTabbable(domReference);
|
|
1938
|
+
prevTabbable === null || prevTabbable === void 0 || prevTabbable.focus();
|
|
1939
|
+
} else {
|
|
1940
|
+
var _portalContext$afterO;
|
|
1941
|
+
(_portalContext$afterO = portalContext.afterOutsideRef.current) === null || _portalContext$afterO === void 0 || _portalContext$afterO.focus();
|
|
1942
|
+
}
|
|
1943
|
+
}
|
|
1944
|
+
}
|
|
1945
|
+
})
|
|
1946
|
+
] });
|
|
1947
|
+
}
|
|
1948
|
+
//#endregion
|
|
1949
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/hooks/useClick.js
|
|
1950
|
+
/**
|
|
1951
|
+
* Opens or closes the floating element when clicking the reference element.
|
|
1952
|
+
* @see https://floating-ui.com/docs/useClick
|
|
1953
|
+
*/
|
|
1954
|
+
function useClick(context, props = {}) {
|
|
1955
|
+
const { open, onOpenChange, dataRef } = context;
|
|
1956
|
+
const { enabled = true, event: eventOption = "click", toggle = true, ignoreMouse = false, stickIfOpen = true, touchOpenDelay = 0 } = props;
|
|
1957
|
+
const pointerTypeRef = React$1.useRef(void 0);
|
|
1958
|
+
const frame = useAnimationFrame();
|
|
1959
|
+
const touchOpenTimeout = useTimeout();
|
|
1960
|
+
const reference = React$1.useMemo(() => ({
|
|
1961
|
+
onPointerDown(event) {
|
|
1962
|
+
pointerTypeRef.current = event.pointerType;
|
|
1963
|
+
},
|
|
1964
|
+
onMouseDown(event) {
|
|
1965
|
+
const pointerType = pointerTypeRef.current;
|
|
1966
|
+
const nativeEvent = event.nativeEvent;
|
|
1967
|
+
if (event.button !== 0 || eventOption === "click" || isMouseLikePointerType(pointerType, true) && ignoreMouse) return;
|
|
1968
|
+
const openEvent = dataRef.current.openEvent;
|
|
1969
|
+
const openEventType = openEvent === null || openEvent === void 0 ? void 0 : openEvent.type;
|
|
1970
|
+
const nextOpen = !(open && toggle && (openEvent && stickIfOpen ? openEventType === "click" || openEventType === "mousedown" : true));
|
|
1971
|
+
if (isTypeableElement(nativeEvent.target)) {
|
|
1972
|
+
const details = createChangeEventDetails("trigger-press", nativeEvent);
|
|
1973
|
+
if (nextOpen && pointerType === "touch" && touchOpenDelay > 0) touchOpenTimeout.start(touchOpenDelay, () => {
|
|
1974
|
+
onOpenChange(true, details);
|
|
1975
|
+
});
|
|
1976
|
+
else onOpenChange(nextOpen, details);
|
|
1977
|
+
return;
|
|
1978
|
+
}
|
|
1979
|
+
frame.request(() => {
|
|
1980
|
+
const details = createChangeEventDetails("trigger-press", nativeEvent);
|
|
1981
|
+
if (nextOpen && pointerType === "touch" && touchOpenDelay > 0) touchOpenTimeout.start(touchOpenDelay, () => {
|
|
1982
|
+
onOpenChange(true, details);
|
|
1983
|
+
});
|
|
1984
|
+
else onOpenChange(nextOpen, details);
|
|
1985
|
+
});
|
|
1986
|
+
},
|
|
1987
|
+
onClick(event) {
|
|
1988
|
+
if (eventOption === "mousedown-only") return;
|
|
1989
|
+
const pointerType = pointerTypeRef.current;
|
|
1990
|
+
if (eventOption === "mousedown" && pointerType) {
|
|
1991
|
+
pointerTypeRef.current = void 0;
|
|
1992
|
+
return;
|
|
1993
|
+
}
|
|
1994
|
+
if (isMouseLikePointerType(pointerType, true) && ignoreMouse) return;
|
|
1995
|
+
const openEvent = dataRef.current.openEvent;
|
|
1996
|
+
const openEventType = openEvent === null || openEvent === void 0 ? void 0 : openEvent.type;
|
|
1997
|
+
const nextOpen = !(open && toggle && (openEvent && stickIfOpen ? openEventType === "click" || openEventType === "mousedown" || openEventType === "keydown" || openEventType === "keyup" : true));
|
|
1998
|
+
const details = createChangeEventDetails("trigger-press", event.nativeEvent);
|
|
1999
|
+
if (nextOpen && pointerType === "touch" && touchOpenDelay > 0) touchOpenTimeout.start(touchOpenDelay, () => {
|
|
2000
|
+
onOpenChange(true, details);
|
|
2001
|
+
});
|
|
2002
|
+
else onOpenChange(nextOpen, details);
|
|
2003
|
+
},
|
|
2004
|
+
onKeyDown() {
|
|
2005
|
+
pointerTypeRef.current = void 0;
|
|
2006
|
+
}
|
|
2007
|
+
}), [
|
|
2008
|
+
dataRef,
|
|
2009
|
+
eventOption,
|
|
2010
|
+
ignoreMouse,
|
|
2011
|
+
onOpenChange,
|
|
2012
|
+
open,
|
|
2013
|
+
stickIfOpen,
|
|
2014
|
+
toggle,
|
|
2015
|
+
frame,
|
|
2016
|
+
touchOpenTimeout,
|
|
2017
|
+
touchOpenDelay
|
|
2018
|
+
]);
|
|
2019
|
+
return React$1.useMemo(() => enabled ? { reference } : EMPTY_OBJECT, [enabled, reference]);
|
|
2020
|
+
}
|
|
2021
|
+
//#endregion
|
|
2022
|
+
//#region ../../node_modules/@floating-ui/core/dist/floating-ui.core.mjs
|
|
2023
|
+
function computeCoordsFromPlacement(_ref, placement, rtl) {
|
|
2024
|
+
let { reference, floating } = _ref;
|
|
2025
|
+
const sideAxis = getSideAxis(placement);
|
|
2026
|
+
const alignmentAxis = getAlignmentAxis(placement);
|
|
2027
|
+
const alignLength = getAxisLength(alignmentAxis);
|
|
2028
|
+
const side = getSide(placement);
|
|
2029
|
+
const isVertical = sideAxis === "y";
|
|
2030
|
+
const commonX = reference.x + reference.width / 2 - floating.width / 2;
|
|
2031
|
+
const commonY = reference.y + reference.height / 2 - floating.height / 2;
|
|
2032
|
+
const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
|
|
2033
|
+
let coords;
|
|
2034
|
+
switch (side) {
|
|
2035
|
+
case "top":
|
|
2036
|
+
coords = {
|
|
2037
|
+
x: commonX,
|
|
2038
|
+
y: reference.y - floating.height
|
|
2039
|
+
};
|
|
2040
|
+
break;
|
|
2041
|
+
case "bottom":
|
|
2042
|
+
coords = {
|
|
2043
|
+
x: commonX,
|
|
2044
|
+
y: reference.y + reference.height
|
|
2045
|
+
};
|
|
2046
|
+
break;
|
|
2047
|
+
case "right":
|
|
2048
|
+
coords = {
|
|
2049
|
+
x: reference.x + reference.width,
|
|
2050
|
+
y: commonY
|
|
2051
|
+
};
|
|
2052
|
+
break;
|
|
2053
|
+
case "left":
|
|
2054
|
+
coords = {
|
|
2055
|
+
x: reference.x - floating.width,
|
|
2056
|
+
y: commonY
|
|
2057
|
+
};
|
|
2058
|
+
break;
|
|
2059
|
+
default: coords = {
|
|
2060
|
+
x: reference.x,
|
|
2061
|
+
y: reference.y
|
|
2062
|
+
};
|
|
2063
|
+
}
|
|
2064
|
+
switch (getAlignment(placement)) {
|
|
2065
|
+
case "start":
|
|
2066
|
+
coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
|
|
2067
|
+
break;
|
|
2068
|
+
case "end":
|
|
2069
|
+
coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
|
|
2070
|
+
break;
|
|
2071
|
+
}
|
|
2072
|
+
return coords;
|
|
2073
|
+
}
|
|
2074
|
+
/**
|
|
2075
|
+
* Computes the `x` and `y` coordinates that will place the floating element
|
|
2076
|
+
* next to a given reference element.
|
|
2077
|
+
*
|
|
2078
|
+
* This export does not have any `platform` interface logic. You will need to
|
|
2079
|
+
* write one for the platform you are using Floating UI with.
|
|
2080
|
+
*/
|
|
2081
|
+
var computePosition$1 = async (reference, floating, config) => {
|
|
2082
|
+
const { placement = "bottom", strategy = "absolute", middleware = [], platform } = config;
|
|
2083
|
+
const validMiddleware = middleware.filter(Boolean);
|
|
2084
|
+
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
|
|
2085
|
+
let rects = await platform.getElementRects({
|
|
2086
|
+
reference,
|
|
2087
|
+
floating,
|
|
2088
|
+
strategy
|
|
2089
|
+
});
|
|
2090
|
+
let { x, y } = computeCoordsFromPlacement(rects, placement, rtl);
|
|
2091
|
+
let statefulPlacement = placement;
|
|
2092
|
+
let middlewareData = {};
|
|
2093
|
+
let resetCount = 0;
|
|
2094
|
+
for (let i = 0; i < validMiddleware.length; i++) {
|
|
2095
|
+
const { name, fn } = validMiddleware[i];
|
|
2096
|
+
const { x: nextX, y: nextY, data, reset } = await fn({
|
|
2097
|
+
x,
|
|
2098
|
+
y,
|
|
2099
|
+
initialPlacement: placement,
|
|
2100
|
+
placement: statefulPlacement,
|
|
2101
|
+
strategy,
|
|
2102
|
+
middlewareData,
|
|
2103
|
+
rects,
|
|
2104
|
+
platform,
|
|
2105
|
+
elements: {
|
|
2106
|
+
reference,
|
|
2107
|
+
floating
|
|
2108
|
+
}
|
|
2109
|
+
});
|
|
2110
|
+
x = nextX != null ? nextX : x;
|
|
2111
|
+
y = nextY != null ? nextY : y;
|
|
2112
|
+
middlewareData = {
|
|
2113
|
+
...middlewareData,
|
|
2114
|
+
[name]: {
|
|
2115
|
+
...middlewareData[name],
|
|
2116
|
+
...data
|
|
2117
|
+
}
|
|
2118
|
+
};
|
|
2119
|
+
if (reset && resetCount <= 50) {
|
|
2120
|
+
resetCount++;
|
|
2121
|
+
if (typeof reset === "object") {
|
|
2122
|
+
if (reset.placement) statefulPlacement = reset.placement;
|
|
2123
|
+
if (reset.rects) rects = reset.rects === true ? await platform.getElementRects({
|
|
2124
|
+
reference,
|
|
2125
|
+
floating,
|
|
2126
|
+
strategy
|
|
2127
|
+
}) : reset.rects;
|
|
2128
|
+
({x, y} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
|
|
2129
|
+
}
|
|
2130
|
+
i = -1;
|
|
2131
|
+
}
|
|
2132
|
+
}
|
|
2133
|
+
return {
|
|
2134
|
+
x,
|
|
2135
|
+
y,
|
|
2136
|
+
placement: statefulPlacement,
|
|
2137
|
+
strategy,
|
|
2138
|
+
middlewareData
|
|
2139
|
+
};
|
|
2140
|
+
};
|
|
2141
|
+
/**
|
|
2142
|
+
* Resolves with an object of overflow side offsets that determine how much the
|
|
2143
|
+
* element is overflowing a given clipping boundary on each side.
|
|
2144
|
+
* - positive = overflowing the boundary by that number of pixels
|
|
2145
|
+
* - negative = how many pixels left before it will overflow
|
|
2146
|
+
* - 0 = lies flush with the boundary
|
|
2147
|
+
* @see https://floating-ui.com/docs/detectOverflow
|
|
2148
|
+
*/
|
|
2149
|
+
async function detectOverflow(state, options) {
|
|
2150
|
+
var _await$platform$isEle;
|
|
2151
|
+
if (options === void 0) options = {};
|
|
2152
|
+
const { x, y, platform, rects, elements, strategy } = state;
|
|
2153
|
+
const { boundary = "clippingAncestors", rootBoundary = "viewport", elementContext = "floating", altBoundary = false, padding = 0 } = evaluate(options, state);
|
|
2154
|
+
const paddingObject = getPaddingObject(padding);
|
|
2155
|
+
const element = elements[altBoundary ? elementContext === "floating" ? "reference" : "floating" : elementContext];
|
|
2156
|
+
const clippingClientRect = rectToClientRect(await platform.getClippingRect({
|
|
2157
|
+
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)),
|
|
2158
|
+
boundary,
|
|
2159
|
+
rootBoundary,
|
|
2160
|
+
strategy
|
|
2161
|
+
}));
|
|
2162
|
+
const rect = elementContext === "floating" ? {
|
|
2163
|
+
x,
|
|
2164
|
+
y,
|
|
2165
|
+
width: rects.floating.width,
|
|
2166
|
+
height: rects.floating.height
|
|
2167
|
+
} : rects.reference;
|
|
2168
|
+
const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
|
|
2169
|
+
const offsetScale = await (platform.isElement == null ? void 0 : platform.isElement(offsetParent)) ? await (platform.getScale == null ? void 0 : platform.getScale(offsetParent)) || {
|
|
2170
|
+
x: 1,
|
|
2171
|
+
y: 1
|
|
2172
|
+
} : {
|
|
2173
|
+
x: 1,
|
|
2174
|
+
y: 1
|
|
2175
|
+
};
|
|
2176
|
+
const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
2177
|
+
elements,
|
|
2178
|
+
rect,
|
|
2179
|
+
offsetParent,
|
|
2180
|
+
strategy
|
|
2181
|
+
}) : rect);
|
|
2182
|
+
return {
|
|
2183
|
+
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
2184
|
+
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
2185
|
+
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
2186
|
+
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
2187
|
+
};
|
|
2188
|
+
}
|
|
2189
|
+
/**
|
|
2190
|
+
* Optimizes the visibility of the floating element by flipping the `placement`
|
|
2191
|
+
* in order to keep it in view when the preferred placement(s) will overflow the
|
|
2192
|
+
* clipping boundary. Alternative to `autoPlacement`.
|
|
2193
|
+
* @see https://floating-ui.com/docs/flip
|
|
2194
|
+
*/
|
|
2195
|
+
var flip$2 = function(options) {
|
|
2196
|
+
if (options === void 0) options = {};
|
|
2197
|
+
return {
|
|
2198
|
+
name: "flip",
|
|
2199
|
+
options,
|
|
2200
|
+
async fn(state) {
|
|
2201
|
+
var _middlewareData$arrow, _middlewareData$flip;
|
|
2202
|
+
const { placement, middlewareData, rects, initialPlacement, platform, elements } = state;
|
|
2203
|
+
const { mainAxis: checkMainAxis = true, crossAxis: checkCrossAxis = true, fallbackPlacements: specifiedFallbackPlacements, fallbackStrategy = "bestFit", fallbackAxisSideDirection = "none", flipAlignment = true, ...detectOverflowOptions } = evaluate(options, state);
|
|
2204
|
+
if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) return {};
|
|
2205
|
+
const side = getSide(placement);
|
|
2206
|
+
const initialSideAxis = getSideAxis(initialPlacement);
|
|
2207
|
+
const isBasePlacement = getSide(initialPlacement) === initialPlacement;
|
|
2208
|
+
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
|
|
2209
|
+
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
|
|
2210
|
+
const hasFallbackAxisSideDirection = fallbackAxisSideDirection !== "none";
|
|
2211
|
+
if (!specifiedFallbackPlacements && hasFallbackAxisSideDirection) fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
|
|
2212
|
+
const placements = [initialPlacement, ...fallbackPlacements];
|
|
2213
|
+
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
2214
|
+
const overflows = [];
|
|
2215
|
+
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
|
|
2216
|
+
if (checkMainAxis) overflows.push(overflow[side]);
|
|
2217
|
+
if (checkCrossAxis) {
|
|
2218
|
+
const sides = getAlignmentSides(placement, rects, rtl);
|
|
2219
|
+
overflows.push(overflow[sides[0]], overflow[sides[1]]);
|
|
2220
|
+
}
|
|
2221
|
+
overflowsData = [...overflowsData, {
|
|
2222
|
+
placement,
|
|
2223
|
+
overflows
|
|
2224
|
+
}];
|
|
2225
|
+
if (!overflows.every((side) => side <= 0)) {
|
|
2226
|
+
var _middlewareData$flip2, _overflowsData$filter;
|
|
2227
|
+
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
|
|
2228
|
+
const nextPlacement = placements[nextIndex];
|
|
2229
|
+
if (nextPlacement) {
|
|
2230
|
+
if (!(checkCrossAxis === "alignment" ? initialSideAxis !== getSideAxis(nextPlacement) : false) || overflowsData.every((d) => getSideAxis(d.placement) === initialSideAxis ? d.overflows[0] > 0 : true)) return {
|
|
2231
|
+
data: {
|
|
2232
|
+
index: nextIndex,
|
|
2233
|
+
overflows: overflowsData
|
|
2234
|
+
},
|
|
2235
|
+
reset: { placement: nextPlacement }
|
|
2236
|
+
};
|
|
2237
|
+
}
|
|
2238
|
+
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;
|
|
2239
|
+
if (!resetPlacement) switch (fallbackStrategy) {
|
|
2240
|
+
case "bestFit": {
|
|
2241
|
+
var _overflowsData$filter2;
|
|
2242
|
+
const placement = (_overflowsData$filter2 = overflowsData.filter((d) => {
|
|
2243
|
+
if (hasFallbackAxisSideDirection) {
|
|
2244
|
+
const currentSideAxis = getSideAxis(d.placement);
|
|
2245
|
+
return currentSideAxis === initialSideAxis || currentSideAxis === "y";
|
|
2246
|
+
}
|
|
2247
|
+
return true;
|
|
2248
|
+
}).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];
|
|
2249
|
+
if (placement) resetPlacement = placement;
|
|
2250
|
+
break;
|
|
2251
|
+
}
|
|
2252
|
+
case "initialPlacement":
|
|
2253
|
+
resetPlacement = initialPlacement;
|
|
2254
|
+
break;
|
|
2255
|
+
}
|
|
2256
|
+
if (placement !== resetPlacement) return { reset: { placement: resetPlacement } };
|
|
2257
|
+
}
|
|
2258
|
+
return {};
|
|
2259
|
+
}
|
|
2260
|
+
};
|
|
2261
|
+
};
|
|
2262
|
+
function getSideOffsets(overflow, rect) {
|
|
2263
|
+
return {
|
|
2264
|
+
top: overflow.top - rect.height,
|
|
2265
|
+
right: overflow.right - rect.width,
|
|
2266
|
+
bottom: overflow.bottom - rect.height,
|
|
2267
|
+
left: overflow.left - rect.width
|
|
2268
|
+
};
|
|
2269
|
+
}
|
|
2270
|
+
function isAnySideFullyClipped(overflow) {
|
|
2271
|
+
return sides.some((side) => overflow[side] >= 0);
|
|
2272
|
+
}
|
|
2273
|
+
/**
|
|
2274
|
+
* Provides data to hide the floating element in applicable situations, such as
|
|
2275
|
+
* when it is not in the same clipping context as the reference element.
|
|
2276
|
+
* @see https://floating-ui.com/docs/hide
|
|
2277
|
+
*/
|
|
2278
|
+
var hide$2 = function(options) {
|
|
2279
|
+
if (options === void 0) options = {};
|
|
2280
|
+
return {
|
|
2281
|
+
name: "hide",
|
|
2282
|
+
options,
|
|
2283
|
+
async fn(state) {
|
|
2284
|
+
const { rects } = state;
|
|
2285
|
+
const { strategy = "referenceHidden", ...detectOverflowOptions } = evaluate(options, state);
|
|
2286
|
+
switch (strategy) {
|
|
2287
|
+
case "referenceHidden": {
|
|
2288
|
+
const offsets = getSideOffsets(await detectOverflow(state, {
|
|
2289
|
+
...detectOverflowOptions,
|
|
2290
|
+
elementContext: "reference"
|
|
2291
|
+
}), rects.reference);
|
|
2292
|
+
return { data: {
|
|
2293
|
+
referenceHiddenOffsets: offsets,
|
|
2294
|
+
referenceHidden: isAnySideFullyClipped(offsets)
|
|
2295
|
+
} };
|
|
2296
|
+
}
|
|
2297
|
+
case "escaped": {
|
|
2298
|
+
const offsets = getSideOffsets(await detectOverflow(state, {
|
|
2299
|
+
...detectOverflowOptions,
|
|
2300
|
+
altBoundary: true
|
|
2301
|
+
}), rects.floating);
|
|
2302
|
+
return { data: {
|
|
2303
|
+
escapedOffsets: offsets,
|
|
2304
|
+
escaped: isAnySideFullyClipped(offsets)
|
|
2305
|
+
} };
|
|
2306
|
+
}
|
|
2307
|
+
default: return {};
|
|
2308
|
+
}
|
|
2309
|
+
}
|
|
2310
|
+
};
|
|
2311
|
+
};
|
|
2312
|
+
var originSides = /* @__PURE__ */ new Set(["left", "top"]);
|
|
2313
|
+
async function convertValueToCoords(state, options) {
|
|
2314
|
+
const { placement, platform, elements } = state;
|
|
2315
|
+
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
|
|
2316
|
+
const side = getSide(placement);
|
|
2317
|
+
const alignment = getAlignment(placement);
|
|
2318
|
+
const isVertical = getSideAxis(placement) === "y";
|
|
2319
|
+
const mainAxisMulti = originSides.has(side) ? -1 : 1;
|
|
2320
|
+
const crossAxisMulti = rtl && isVertical ? -1 : 1;
|
|
2321
|
+
const rawValue = evaluate(options, state);
|
|
2322
|
+
let { mainAxis, crossAxis, alignmentAxis } = typeof rawValue === "number" ? {
|
|
2323
|
+
mainAxis: rawValue,
|
|
2324
|
+
crossAxis: 0,
|
|
2325
|
+
alignmentAxis: null
|
|
2326
|
+
} : {
|
|
2327
|
+
mainAxis: rawValue.mainAxis || 0,
|
|
2328
|
+
crossAxis: rawValue.crossAxis || 0,
|
|
2329
|
+
alignmentAxis: rawValue.alignmentAxis
|
|
2330
|
+
};
|
|
2331
|
+
if (alignment && typeof alignmentAxis === "number") crossAxis = alignment === "end" ? alignmentAxis * -1 : alignmentAxis;
|
|
2332
|
+
return isVertical ? {
|
|
2333
|
+
x: crossAxis * crossAxisMulti,
|
|
2334
|
+
y: mainAxis * mainAxisMulti
|
|
2335
|
+
} : {
|
|
2336
|
+
x: mainAxis * mainAxisMulti,
|
|
2337
|
+
y: crossAxis * crossAxisMulti
|
|
2338
|
+
};
|
|
2339
|
+
}
|
|
2340
|
+
/**
|
|
2341
|
+
* Modifies the placement by translating the floating element along the
|
|
2342
|
+
* specified axes.
|
|
2343
|
+
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
|
2344
|
+
* object may be passed.
|
|
2345
|
+
* @see https://floating-ui.com/docs/offset
|
|
2346
|
+
*/
|
|
2347
|
+
var offset$2 = function(options) {
|
|
2348
|
+
if (options === void 0) options = 0;
|
|
2349
|
+
return {
|
|
2350
|
+
name: "offset",
|
|
2351
|
+
options,
|
|
2352
|
+
async fn(state) {
|
|
2353
|
+
var _middlewareData$offse, _middlewareData$arrow;
|
|
2354
|
+
const { x, y, placement, middlewareData } = state;
|
|
2355
|
+
const diffCoords = await convertValueToCoords(state, options);
|
|
2356
|
+
if (placement === ((_middlewareData$offse = middlewareData.offset) == null ? void 0 : _middlewareData$offse.placement) && (_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) return {};
|
|
2357
|
+
return {
|
|
2358
|
+
x: x + diffCoords.x,
|
|
2359
|
+
y: y + diffCoords.y,
|
|
2360
|
+
data: {
|
|
2361
|
+
...diffCoords,
|
|
2362
|
+
placement
|
|
2363
|
+
}
|
|
2364
|
+
};
|
|
2365
|
+
}
|
|
2366
|
+
};
|
|
2367
|
+
};
|
|
2368
|
+
/**
|
|
2369
|
+
* Optimizes the visibility of the floating element by shifting it in order to
|
|
2370
|
+
* keep it in view when it will overflow the clipping boundary.
|
|
2371
|
+
* @see https://floating-ui.com/docs/shift
|
|
2372
|
+
*/
|
|
2373
|
+
var shift$2 = function(options) {
|
|
2374
|
+
if (options === void 0) options = {};
|
|
2375
|
+
return {
|
|
2376
|
+
name: "shift",
|
|
2377
|
+
options,
|
|
2378
|
+
async fn(state) {
|
|
2379
|
+
const { x, y, placement } = state;
|
|
2380
|
+
const { mainAxis: checkMainAxis = true, crossAxis: checkCrossAxis = false, limiter = { fn: (_ref) => {
|
|
2381
|
+
let { x, y } = _ref;
|
|
2382
|
+
return {
|
|
2383
|
+
x,
|
|
2384
|
+
y
|
|
2385
|
+
};
|
|
2386
|
+
} }, ...detectOverflowOptions } = evaluate(options, state);
|
|
2387
|
+
const coords = {
|
|
2388
|
+
x,
|
|
2389
|
+
y
|
|
2390
|
+
};
|
|
2391
|
+
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
2392
|
+
const crossAxis = getSideAxis(getSide(placement));
|
|
2393
|
+
const mainAxis = getOppositeAxis(crossAxis);
|
|
2394
|
+
let mainAxisCoord = coords[mainAxis];
|
|
2395
|
+
let crossAxisCoord = coords[crossAxis];
|
|
2396
|
+
if (checkMainAxis) {
|
|
2397
|
+
const minSide = mainAxis === "y" ? "top" : "left";
|
|
2398
|
+
const maxSide = mainAxis === "y" ? "bottom" : "right";
|
|
2399
|
+
const min = mainAxisCoord + overflow[minSide];
|
|
2400
|
+
const max = mainAxisCoord - overflow[maxSide];
|
|
2401
|
+
mainAxisCoord = clamp(min, mainAxisCoord, max);
|
|
2402
|
+
}
|
|
2403
|
+
if (checkCrossAxis) {
|
|
2404
|
+
const minSide = crossAxis === "y" ? "top" : "left";
|
|
2405
|
+
const maxSide = crossAxis === "y" ? "bottom" : "right";
|
|
2406
|
+
const min = crossAxisCoord + overflow[minSide];
|
|
2407
|
+
const max = crossAxisCoord - overflow[maxSide];
|
|
2408
|
+
crossAxisCoord = clamp(min, crossAxisCoord, max);
|
|
2409
|
+
}
|
|
2410
|
+
const limitedCoords = limiter.fn({
|
|
2411
|
+
...state,
|
|
2412
|
+
[mainAxis]: mainAxisCoord,
|
|
2413
|
+
[crossAxis]: crossAxisCoord
|
|
2414
|
+
});
|
|
2415
|
+
return {
|
|
2416
|
+
...limitedCoords,
|
|
2417
|
+
data: {
|
|
2418
|
+
x: limitedCoords.x - x,
|
|
2419
|
+
y: limitedCoords.y - y,
|
|
2420
|
+
enabled: {
|
|
2421
|
+
[mainAxis]: checkMainAxis,
|
|
2422
|
+
[crossAxis]: checkCrossAxis
|
|
2423
|
+
}
|
|
2424
|
+
}
|
|
2425
|
+
};
|
|
2426
|
+
}
|
|
2427
|
+
};
|
|
2428
|
+
};
|
|
2429
|
+
/**
|
|
2430
|
+
* Built-in `limiter` that will stop `shift()` at a certain point.
|
|
2431
|
+
*/
|
|
2432
|
+
var limitShift$2 = function(options) {
|
|
2433
|
+
if (options === void 0) options = {};
|
|
2434
|
+
return {
|
|
2435
|
+
options,
|
|
2436
|
+
fn(state) {
|
|
2437
|
+
const { x, y, placement, rects, middlewareData } = state;
|
|
2438
|
+
const { offset = 0, mainAxis: checkMainAxis = true, crossAxis: checkCrossAxis = true } = evaluate(options, state);
|
|
2439
|
+
const coords = {
|
|
2440
|
+
x,
|
|
2441
|
+
y
|
|
2442
|
+
};
|
|
2443
|
+
const crossAxis = getSideAxis(placement);
|
|
2444
|
+
const mainAxis = getOppositeAxis(crossAxis);
|
|
2445
|
+
let mainAxisCoord = coords[mainAxis];
|
|
2446
|
+
let crossAxisCoord = coords[crossAxis];
|
|
2447
|
+
const rawOffset = evaluate(offset, state);
|
|
2448
|
+
const computedOffset = typeof rawOffset === "number" ? {
|
|
2449
|
+
mainAxis: rawOffset,
|
|
2450
|
+
crossAxis: 0
|
|
2451
|
+
} : {
|
|
2452
|
+
mainAxis: 0,
|
|
2453
|
+
crossAxis: 0,
|
|
2454
|
+
...rawOffset
|
|
2455
|
+
};
|
|
2456
|
+
if (checkMainAxis) {
|
|
2457
|
+
const len = mainAxis === "y" ? "height" : "width";
|
|
2458
|
+
const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis;
|
|
2459
|
+
const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis;
|
|
2460
|
+
if (mainAxisCoord < limitMin) mainAxisCoord = limitMin;
|
|
2461
|
+
else if (mainAxisCoord > limitMax) mainAxisCoord = limitMax;
|
|
2462
|
+
}
|
|
2463
|
+
if (checkCrossAxis) {
|
|
2464
|
+
var _middlewareData$offse, _middlewareData$offse2;
|
|
2465
|
+
const len = mainAxis === "y" ? "width" : "height";
|
|
2466
|
+
const isOriginSide = originSides.has(getSide(placement));
|
|
2467
|
+
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);
|
|
2468
|
+
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);
|
|
2469
|
+
if (crossAxisCoord < limitMin) crossAxisCoord = limitMin;
|
|
2470
|
+
else if (crossAxisCoord > limitMax) crossAxisCoord = limitMax;
|
|
2471
|
+
}
|
|
2472
|
+
return {
|
|
2473
|
+
[mainAxis]: mainAxisCoord,
|
|
2474
|
+
[crossAxis]: crossAxisCoord
|
|
2475
|
+
};
|
|
2476
|
+
}
|
|
2477
|
+
};
|
|
2478
|
+
};
|
|
2479
|
+
/**
|
|
2480
|
+
* Provides data that allows you to change the size of the floating element —
|
|
2481
|
+
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
2482
|
+
* width of the reference element.
|
|
2483
|
+
* @see https://floating-ui.com/docs/size
|
|
2484
|
+
*/
|
|
2485
|
+
var size$2 = function(options) {
|
|
2486
|
+
if (options === void 0) options = {};
|
|
2487
|
+
return {
|
|
2488
|
+
name: "size",
|
|
2489
|
+
options,
|
|
2490
|
+
async fn(state) {
|
|
2491
|
+
var _state$middlewareData, _state$middlewareData2;
|
|
2492
|
+
const { placement, rects, platform, elements } = state;
|
|
2493
|
+
const { apply = () => {}, ...detectOverflowOptions } = evaluate(options, state);
|
|
2494
|
+
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
2495
|
+
const side = getSide(placement);
|
|
2496
|
+
const alignment = getAlignment(placement);
|
|
2497
|
+
const isYAxis = getSideAxis(placement) === "y";
|
|
2498
|
+
const { width, height } = rects.floating;
|
|
2499
|
+
let heightSide;
|
|
2500
|
+
let widthSide;
|
|
2501
|
+
if (side === "top" || side === "bottom") {
|
|
2502
|
+
heightSide = side;
|
|
2503
|
+
widthSide = alignment === (await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating)) ? "start" : "end") ? "left" : "right";
|
|
2504
|
+
} else {
|
|
2505
|
+
widthSide = side;
|
|
2506
|
+
heightSide = alignment === "end" ? "top" : "bottom";
|
|
2507
|
+
}
|
|
2508
|
+
const maximumClippingHeight = height - overflow.top - overflow.bottom;
|
|
2509
|
+
const maximumClippingWidth = width - overflow.left - overflow.right;
|
|
2510
|
+
const overflowAvailableHeight = min(height - overflow[heightSide], maximumClippingHeight);
|
|
2511
|
+
const overflowAvailableWidth = min(width - overflow[widthSide], maximumClippingWidth);
|
|
2512
|
+
const noShift = !state.middlewareData.shift;
|
|
2513
|
+
let availableHeight = overflowAvailableHeight;
|
|
2514
|
+
let availableWidth = overflowAvailableWidth;
|
|
2515
|
+
if ((_state$middlewareData = state.middlewareData.shift) != null && _state$middlewareData.enabled.x) availableWidth = maximumClippingWidth;
|
|
2516
|
+
if ((_state$middlewareData2 = state.middlewareData.shift) != null && _state$middlewareData2.enabled.y) availableHeight = maximumClippingHeight;
|
|
2517
|
+
if (noShift && !alignment) {
|
|
2518
|
+
const xMin = max(overflow.left, 0);
|
|
2519
|
+
const xMax = max(overflow.right, 0);
|
|
2520
|
+
const yMin = max(overflow.top, 0);
|
|
2521
|
+
const yMax = max(overflow.bottom, 0);
|
|
2522
|
+
if (isYAxis) availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
|
|
2523
|
+
else availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
|
|
2524
|
+
}
|
|
2525
|
+
await apply({
|
|
2526
|
+
...state,
|
|
2527
|
+
availableWidth,
|
|
2528
|
+
availableHeight
|
|
2529
|
+
});
|
|
2530
|
+
const nextDimensions = await platform.getDimensions(elements.floating);
|
|
2531
|
+
if (width !== nextDimensions.width || height !== nextDimensions.height) return { reset: { rects: true } };
|
|
2532
|
+
return {};
|
|
2533
|
+
}
|
|
2534
|
+
};
|
|
2535
|
+
};
|
|
2536
|
+
//#endregion
|
|
2537
|
+
//#region ../../node_modules/@floating-ui/dom/dist/floating-ui.dom.mjs
|
|
2538
|
+
function getCssDimensions(element) {
|
|
2539
|
+
const css = getComputedStyle$1(element);
|
|
2540
|
+
let width = parseFloat(css.width) || 0;
|
|
2541
|
+
let height = parseFloat(css.height) || 0;
|
|
2542
|
+
const hasOffset = isHTMLElement(element);
|
|
2543
|
+
const offsetWidth = hasOffset ? element.offsetWidth : width;
|
|
2544
|
+
const offsetHeight = hasOffset ? element.offsetHeight : height;
|
|
2545
|
+
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
|
|
2546
|
+
if (shouldFallback) {
|
|
2547
|
+
width = offsetWidth;
|
|
2548
|
+
height = offsetHeight;
|
|
2549
|
+
}
|
|
2550
|
+
return {
|
|
2551
|
+
width,
|
|
2552
|
+
height,
|
|
2553
|
+
$: shouldFallback
|
|
2554
|
+
};
|
|
2555
|
+
}
|
|
2556
|
+
function unwrapElement(element) {
|
|
2557
|
+
return !isElement(element) ? element.contextElement : element;
|
|
2558
|
+
}
|
|
2559
|
+
function getScale(element) {
|
|
2560
|
+
const domElement = unwrapElement(element);
|
|
2561
|
+
if (!isHTMLElement(domElement)) return createCoords(1);
|
|
2562
|
+
const rect = domElement.getBoundingClientRect();
|
|
2563
|
+
const { width, height, $ } = getCssDimensions(domElement);
|
|
2564
|
+
let x = ($ ? round(rect.width) : rect.width) / width;
|
|
2565
|
+
let y = ($ ? round(rect.height) : rect.height) / height;
|
|
2566
|
+
if (!x || !Number.isFinite(x)) x = 1;
|
|
2567
|
+
if (!y || !Number.isFinite(y)) y = 1;
|
|
2568
|
+
return {
|
|
2569
|
+
x,
|
|
2570
|
+
y
|
|
2571
|
+
};
|
|
2572
|
+
}
|
|
2573
|
+
var noOffsets = /* @__PURE__ */ createCoords(0);
|
|
2574
|
+
function getVisualOffsets(element) {
|
|
2575
|
+
const win = getWindow(element);
|
|
2576
|
+
if (!isWebKit$1() || !win.visualViewport) return noOffsets;
|
|
2577
|
+
return {
|
|
2578
|
+
x: win.visualViewport.offsetLeft,
|
|
2579
|
+
y: win.visualViewport.offsetTop
|
|
2580
|
+
};
|
|
2581
|
+
}
|
|
2582
|
+
function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
|
|
2583
|
+
if (isFixed === void 0) isFixed = false;
|
|
2584
|
+
if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) return false;
|
|
2585
|
+
return isFixed;
|
|
2586
|
+
}
|
|
2587
|
+
function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
|
|
2588
|
+
if (includeScale === void 0) includeScale = false;
|
|
2589
|
+
if (isFixedStrategy === void 0) isFixedStrategy = false;
|
|
2590
|
+
const clientRect = element.getBoundingClientRect();
|
|
2591
|
+
const domElement = unwrapElement(element);
|
|
2592
|
+
let scale = createCoords(1);
|
|
2593
|
+
if (includeScale) if (offsetParent) {
|
|
2594
|
+
if (isElement(offsetParent)) scale = getScale(offsetParent);
|
|
2595
|
+
} else scale = getScale(element);
|
|
2596
|
+
const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
|
|
2597
|
+
let x = (clientRect.left + visualOffsets.x) / scale.x;
|
|
2598
|
+
let y = (clientRect.top + visualOffsets.y) / scale.y;
|
|
2599
|
+
let width = clientRect.width / scale.x;
|
|
2600
|
+
let height = clientRect.height / scale.y;
|
|
2601
|
+
if (domElement) {
|
|
2602
|
+
const win = getWindow(domElement);
|
|
2603
|
+
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
|
|
2604
|
+
let currentWin = win;
|
|
2605
|
+
let currentIFrame = getFrameElement(currentWin);
|
|
2606
|
+
while (currentIFrame && offsetParent && offsetWin !== currentWin) {
|
|
2607
|
+
const iframeScale = getScale(currentIFrame);
|
|
2608
|
+
const iframeRect = currentIFrame.getBoundingClientRect();
|
|
2609
|
+
const css = getComputedStyle$1(currentIFrame);
|
|
2610
|
+
const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
|
|
2611
|
+
const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
|
|
2612
|
+
x *= iframeScale.x;
|
|
2613
|
+
y *= iframeScale.y;
|
|
2614
|
+
width *= iframeScale.x;
|
|
2615
|
+
height *= iframeScale.y;
|
|
2616
|
+
x += left;
|
|
2617
|
+
y += top;
|
|
2618
|
+
currentWin = getWindow(currentIFrame);
|
|
2619
|
+
currentIFrame = getFrameElement(currentWin);
|
|
2620
|
+
}
|
|
2621
|
+
}
|
|
2622
|
+
return rectToClientRect({
|
|
2623
|
+
width,
|
|
2624
|
+
height,
|
|
2625
|
+
x,
|
|
2626
|
+
y
|
|
2627
|
+
});
|
|
2628
|
+
}
|
|
2629
|
+
function getWindowScrollBarX(element, rect) {
|
|
2630
|
+
const leftScroll = getNodeScroll(element).scrollLeft;
|
|
2631
|
+
if (!rect) return getBoundingClientRect(getDocumentElement(element)).left + leftScroll;
|
|
2632
|
+
return rect.left + leftScroll;
|
|
2633
|
+
}
|
|
2634
|
+
function getHTMLOffset(documentElement, scroll) {
|
|
2635
|
+
const htmlRect = documentElement.getBoundingClientRect();
|
|
2636
|
+
return {
|
|
2637
|
+
x: htmlRect.left + scroll.scrollLeft - getWindowScrollBarX(documentElement, htmlRect),
|
|
2638
|
+
y: htmlRect.top + scroll.scrollTop
|
|
2639
|
+
};
|
|
2640
|
+
}
|
|
2641
|
+
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
2642
|
+
let { elements, rect, offsetParent, strategy } = _ref;
|
|
2643
|
+
const isFixed = strategy === "fixed";
|
|
2644
|
+
const documentElement = getDocumentElement(offsetParent);
|
|
2645
|
+
const topLayer = elements ? isTopLayer(elements.floating) : false;
|
|
2646
|
+
if (offsetParent === documentElement || topLayer && isFixed) return rect;
|
|
2647
|
+
let scroll = {
|
|
2648
|
+
scrollLeft: 0,
|
|
2649
|
+
scrollTop: 0
|
|
2650
|
+
};
|
|
2651
|
+
let scale = createCoords(1);
|
|
2652
|
+
const offsets = createCoords(0);
|
|
2653
|
+
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
2654
|
+
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
2655
|
+
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) scroll = getNodeScroll(offsetParent);
|
|
2656
|
+
if (isHTMLElement(offsetParent)) {
|
|
2657
|
+
const offsetRect = getBoundingClientRect(offsetParent);
|
|
2658
|
+
scale = getScale(offsetParent);
|
|
2659
|
+
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
2660
|
+
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
2661
|
+
}
|
|
2662
|
+
}
|
|
2663
|
+
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
2664
|
+
return {
|
|
2665
|
+
width: rect.width * scale.x,
|
|
2666
|
+
height: rect.height * scale.y,
|
|
2667
|
+
x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x + htmlOffset.x,
|
|
2668
|
+
y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y + htmlOffset.y
|
|
2669
|
+
};
|
|
2670
|
+
}
|
|
2671
|
+
function getClientRects(element) {
|
|
2672
|
+
return Array.from(element.getClientRects());
|
|
2673
|
+
}
|
|
2674
|
+
function getDocumentRect(element) {
|
|
2675
|
+
const html = getDocumentElement(element);
|
|
2676
|
+
const scroll = getNodeScroll(element);
|
|
2677
|
+
const body = element.ownerDocument.body;
|
|
2678
|
+
const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
|
|
2679
|
+
const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
|
|
2680
|
+
let x = -scroll.scrollLeft + getWindowScrollBarX(element);
|
|
2681
|
+
const y = -scroll.scrollTop;
|
|
2682
|
+
if (getComputedStyle$1(body).direction === "rtl") x += max(html.clientWidth, body.clientWidth) - width;
|
|
2683
|
+
return {
|
|
2684
|
+
width,
|
|
2685
|
+
height,
|
|
2686
|
+
x,
|
|
2687
|
+
y
|
|
2688
|
+
};
|
|
2689
|
+
}
|
|
2690
|
+
var SCROLLBAR_MAX = 25;
|
|
2691
|
+
function getViewportRect(element, strategy) {
|
|
2692
|
+
const win = getWindow(element);
|
|
2693
|
+
const html = getDocumentElement(element);
|
|
2694
|
+
const visualViewport = win.visualViewport;
|
|
2695
|
+
let width = html.clientWidth;
|
|
2696
|
+
let height = html.clientHeight;
|
|
2697
|
+
let x = 0;
|
|
2698
|
+
let y = 0;
|
|
2699
|
+
if (visualViewport) {
|
|
2700
|
+
width = visualViewport.width;
|
|
2701
|
+
height = visualViewport.height;
|
|
2702
|
+
const visualViewportBased = isWebKit$1();
|
|
2703
|
+
if (!visualViewportBased || visualViewportBased && strategy === "fixed") {
|
|
2704
|
+
x = visualViewport.offsetLeft;
|
|
2705
|
+
y = visualViewport.offsetTop;
|
|
2706
|
+
}
|
|
2707
|
+
}
|
|
2708
|
+
const windowScrollbarX = getWindowScrollBarX(html);
|
|
2709
|
+
if (windowScrollbarX <= 0) {
|
|
2710
|
+
const doc = html.ownerDocument;
|
|
2711
|
+
const body = doc.body;
|
|
2712
|
+
const bodyStyles = getComputedStyle(body);
|
|
2713
|
+
const bodyMarginInline = doc.compatMode === "CSS1Compat" ? parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight) || 0 : 0;
|
|
2714
|
+
const clippingStableScrollbarWidth = Math.abs(html.clientWidth - body.clientWidth - bodyMarginInline);
|
|
2715
|
+
if (clippingStableScrollbarWidth <= SCROLLBAR_MAX) width -= clippingStableScrollbarWidth;
|
|
2716
|
+
} else if (windowScrollbarX <= SCROLLBAR_MAX) width += windowScrollbarX;
|
|
2717
|
+
return {
|
|
2718
|
+
width,
|
|
2719
|
+
height,
|
|
2720
|
+
x,
|
|
2721
|
+
y
|
|
2722
|
+
};
|
|
2723
|
+
}
|
|
2724
|
+
var absoluteOrFixed = /* @__PURE__ */ new Set(["absolute", "fixed"]);
|
|
2725
|
+
function getInnerBoundingClientRect(element, strategy) {
|
|
2726
|
+
const clientRect = getBoundingClientRect(element, true, strategy === "fixed");
|
|
2727
|
+
const top = clientRect.top + element.clientTop;
|
|
2728
|
+
const left = clientRect.left + element.clientLeft;
|
|
2729
|
+
const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
|
|
2730
|
+
return {
|
|
2731
|
+
width: element.clientWidth * scale.x,
|
|
2732
|
+
height: element.clientHeight * scale.y,
|
|
2733
|
+
x: left * scale.x,
|
|
2734
|
+
y: top * scale.y
|
|
2735
|
+
};
|
|
2736
|
+
}
|
|
2737
|
+
function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
|
|
2738
|
+
let rect;
|
|
2739
|
+
if (clippingAncestor === "viewport") rect = getViewportRect(element, strategy);
|
|
2740
|
+
else if (clippingAncestor === "document") rect = getDocumentRect(getDocumentElement(element));
|
|
2741
|
+
else if (isElement(clippingAncestor)) rect = getInnerBoundingClientRect(clippingAncestor, strategy);
|
|
2742
|
+
else {
|
|
2743
|
+
const visualOffsets = getVisualOffsets(element);
|
|
2744
|
+
rect = {
|
|
2745
|
+
x: clippingAncestor.x - visualOffsets.x,
|
|
2746
|
+
y: clippingAncestor.y - visualOffsets.y,
|
|
2747
|
+
width: clippingAncestor.width,
|
|
2748
|
+
height: clippingAncestor.height
|
|
2749
|
+
};
|
|
2750
|
+
}
|
|
2751
|
+
return rectToClientRect(rect);
|
|
2752
|
+
}
|
|
2753
|
+
function hasFixedPositionAncestor(element, stopNode) {
|
|
2754
|
+
const parentNode = getParentNode(element);
|
|
2755
|
+
if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) return false;
|
|
2756
|
+
return getComputedStyle$1(parentNode).position === "fixed" || hasFixedPositionAncestor(parentNode, stopNode);
|
|
2757
|
+
}
|
|
2758
|
+
function getClippingElementAncestors(element, cache) {
|
|
2759
|
+
const cachedResult = cache.get(element);
|
|
2760
|
+
if (cachedResult) return cachedResult;
|
|
2761
|
+
let result = getOverflowAncestors(element, [], false).filter((el) => isElement(el) && getNodeName(el) !== "body");
|
|
2762
|
+
let currentContainingBlockComputedStyle = null;
|
|
2763
|
+
const elementIsFixed = getComputedStyle$1(element).position === "fixed";
|
|
2764
|
+
let currentNode = elementIsFixed ? getParentNode(element) : element;
|
|
2765
|
+
while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
2766
|
+
const computedStyle = getComputedStyle$1(currentNode);
|
|
2767
|
+
const currentNodeIsContaining = isContainingBlock(currentNode);
|
|
2768
|
+
if (!currentNodeIsContaining && computedStyle.position === "fixed") currentContainingBlockComputedStyle = null;
|
|
2769
|
+
if (elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === "static" && !!currentContainingBlockComputedStyle && absoluteOrFixed.has(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode)) result = result.filter((ancestor) => ancestor !== currentNode);
|
|
2770
|
+
else currentContainingBlockComputedStyle = computedStyle;
|
|
2771
|
+
currentNode = getParentNode(currentNode);
|
|
2772
|
+
}
|
|
2773
|
+
cache.set(element, result);
|
|
2774
|
+
return result;
|
|
2775
|
+
}
|
|
2776
|
+
function getClippingRect(_ref) {
|
|
2777
|
+
let { element, boundary, rootBoundary, strategy } = _ref;
|
|
2778
|
+
const clippingAncestors = [...boundary === "clippingAncestors" ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary), rootBoundary];
|
|
2779
|
+
const firstClippingAncestor = clippingAncestors[0];
|
|
2780
|
+
const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
|
|
2781
|
+
const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
|
|
2782
|
+
accRect.top = max(rect.top, accRect.top);
|
|
2783
|
+
accRect.right = min(rect.right, accRect.right);
|
|
2784
|
+
accRect.bottom = min(rect.bottom, accRect.bottom);
|
|
2785
|
+
accRect.left = max(rect.left, accRect.left);
|
|
2786
|
+
return accRect;
|
|
2787
|
+
}, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
|
|
2788
|
+
return {
|
|
2789
|
+
width: clippingRect.right - clippingRect.left,
|
|
2790
|
+
height: clippingRect.bottom - clippingRect.top,
|
|
2791
|
+
x: clippingRect.left,
|
|
2792
|
+
y: clippingRect.top
|
|
2793
|
+
};
|
|
2794
|
+
}
|
|
2795
|
+
function getDimensions(element) {
|
|
2796
|
+
const { width, height } = getCssDimensions(element);
|
|
2797
|
+
return {
|
|
2798
|
+
width,
|
|
2799
|
+
height
|
|
2800
|
+
};
|
|
2801
|
+
}
|
|
2802
|
+
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
2803
|
+
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
2804
|
+
const documentElement = getDocumentElement(offsetParent);
|
|
2805
|
+
const isFixed = strategy === "fixed";
|
|
2806
|
+
const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
|
|
2807
|
+
let scroll = {
|
|
2808
|
+
scrollLeft: 0,
|
|
2809
|
+
scrollTop: 0
|
|
2810
|
+
};
|
|
2811
|
+
const offsets = createCoords(0);
|
|
2812
|
+
function setLeftRTLScrollbarOffset() {
|
|
2813
|
+
offsets.x = getWindowScrollBarX(documentElement);
|
|
2814
|
+
}
|
|
2815
|
+
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
2816
|
+
if (getNodeName(offsetParent) !== "body" || isOverflowElement(documentElement)) scroll = getNodeScroll(offsetParent);
|
|
2817
|
+
if (isOffsetParentAnElement) {
|
|
2818
|
+
const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
|
|
2819
|
+
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
2820
|
+
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
2821
|
+
} else if (documentElement) setLeftRTLScrollbarOffset();
|
|
2822
|
+
}
|
|
2823
|
+
if (isFixed && !isOffsetParentAnElement && documentElement) setLeftRTLScrollbarOffset();
|
|
2824
|
+
const htmlOffset = documentElement && !isOffsetParentAnElement && !isFixed ? getHTMLOffset(documentElement, scroll) : createCoords(0);
|
|
2825
|
+
return {
|
|
2826
|
+
x: rect.left + scroll.scrollLeft - offsets.x - htmlOffset.x,
|
|
2827
|
+
y: rect.top + scroll.scrollTop - offsets.y - htmlOffset.y,
|
|
2828
|
+
width: rect.width,
|
|
2829
|
+
height: rect.height
|
|
2830
|
+
};
|
|
2831
|
+
}
|
|
2832
|
+
function isStaticPositioned(element) {
|
|
2833
|
+
return getComputedStyle$1(element).position === "static";
|
|
2834
|
+
}
|
|
2835
|
+
function getTrueOffsetParent(element, polyfill) {
|
|
2836
|
+
if (!isHTMLElement(element) || getComputedStyle$1(element).position === "fixed") return null;
|
|
2837
|
+
if (polyfill) return polyfill(element);
|
|
2838
|
+
let rawOffsetParent = element.offsetParent;
|
|
2839
|
+
if (getDocumentElement(element) === rawOffsetParent) rawOffsetParent = rawOffsetParent.ownerDocument.body;
|
|
2840
|
+
return rawOffsetParent;
|
|
2841
|
+
}
|
|
2842
|
+
function getOffsetParent(element, polyfill) {
|
|
2843
|
+
const win = getWindow(element);
|
|
2844
|
+
if (isTopLayer(element)) return win;
|
|
2845
|
+
if (!isHTMLElement(element)) {
|
|
2846
|
+
let svgOffsetParent = getParentNode(element);
|
|
2847
|
+
while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
|
|
2848
|
+
if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) return svgOffsetParent;
|
|
2849
|
+
svgOffsetParent = getParentNode(svgOffsetParent);
|
|
2850
|
+
}
|
|
2851
|
+
return win;
|
|
2852
|
+
}
|
|
2853
|
+
let offsetParent = getTrueOffsetParent(element, polyfill);
|
|
2854
|
+
while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) offsetParent = getTrueOffsetParent(offsetParent, polyfill);
|
|
2855
|
+
if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) return win;
|
|
2856
|
+
return offsetParent || getContainingBlock(element) || win;
|
|
2857
|
+
}
|
|
2858
|
+
var getElementRects = async function(data) {
|
|
2859
|
+
const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
|
|
2860
|
+
const getDimensionsFn = this.getDimensions;
|
|
2861
|
+
const floatingDimensions = await getDimensionsFn(data.floating);
|
|
2862
|
+
return {
|
|
2863
|
+
reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
|
|
2864
|
+
floating: {
|
|
2865
|
+
x: 0,
|
|
2866
|
+
y: 0,
|
|
2867
|
+
width: floatingDimensions.width,
|
|
2868
|
+
height: floatingDimensions.height
|
|
2869
|
+
}
|
|
2870
|
+
};
|
|
2871
|
+
};
|
|
2872
|
+
function isRTL(element) {
|
|
2873
|
+
return getComputedStyle$1(element).direction === "rtl";
|
|
2874
|
+
}
|
|
2875
|
+
var platform = {
|
|
2876
|
+
convertOffsetParentRelativeRectToViewportRelativeRect,
|
|
2877
|
+
getDocumentElement,
|
|
2878
|
+
getClippingRect,
|
|
2879
|
+
getOffsetParent,
|
|
2880
|
+
getElementRects,
|
|
2881
|
+
getClientRects,
|
|
2882
|
+
getDimensions,
|
|
2883
|
+
getScale,
|
|
2884
|
+
isElement,
|
|
2885
|
+
isRTL
|
|
2886
|
+
};
|
|
2887
|
+
function rectsAreEqual(a, b) {
|
|
2888
|
+
return a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
|
|
2889
|
+
}
|
|
2890
|
+
function observeMove(element, onMove) {
|
|
2891
|
+
let io = null;
|
|
2892
|
+
let timeoutId;
|
|
2893
|
+
const root = getDocumentElement(element);
|
|
2894
|
+
function cleanup() {
|
|
2895
|
+
var _io;
|
|
2896
|
+
clearTimeout(timeoutId);
|
|
2897
|
+
(_io = io) == null || _io.disconnect();
|
|
2898
|
+
io = null;
|
|
2899
|
+
}
|
|
2900
|
+
function refresh(skip, threshold) {
|
|
2901
|
+
if (skip === void 0) skip = false;
|
|
2902
|
+
if (threshold === void 0) threshold = 1;
|
|
2903
|
+
cleanup();
|
|
2904
|
+
const elementRectForRootMargin = element.getBoundingClientRect();
|
|
2905
|
+
const { left, top, width, height } = elementRectForRootMargin;
|
|
2906
|
+
if (!skip) onMove();
|
|
2907
|
+
if (!width || !height) return;
|
|
2908
|
+
const insetTop = floor(top);
|
|
2909
|
+
const insetRight = floor(root.clientWidth - (left + width));
|
|
2910
|
+
const insetBottom = floor(root.clientHeight - (top + height));
|
|
2911
|
+
const insetLeft = floor(left);
|
|
2912
|
+
const options = {
|
|
2913
|
+
rootMargin: -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px",
|
|
2914
|
+
threshold: max(0, min(1, threshold)) || 1
|
|
2915
|
+
};
|
|
2916
|
+
let isFirstUpdate = true;
|
|
2917
|
+
function handleObserve(entries) {
|
|
2918
|
+
const ratio = entries[0].intersectionRatio;
|
|
2919
|
+
if (ratio !== threshold) {
|
|
2920
|
+
if (!isFirstUpdate) return refresh();
|
|
2921
|
+
if (!ratio) timeoutId = setTimeout(() => {
|
|
2922
|
+
refresh(false, 1e-7);
|
|
2923
|
+
}, 1e3);
|
|
2924
|
+
else refresh(false, ratio);
|
|
2925
|
+
}
|
|
2926
|
+
if (ratio === 1 && !rectsAreEqual(elementRectForRootMargin, element.getBoundingClientRect())) refresh();
|
|
2927
|
+
isFirstUpdate = false;
|
|
2928
|
+
}
|
|
2929
|
+
try {
|
|
2930
|
+
io = new IntersectionObserver(handleObserve, {
|
|
2931
|
+
...options,
|
|
2932
|
+
root: root.ownerDocument
|
|
2933
|
+
});
|
|
2934
|
+
} catch (_e) {
|
|
2935
|
+
io = new IntersectionObserver(handleObserve, options);
|
|
2936
|
+
}
|
|
2937
|
+
io.observe(element);
|
|
2938
|
+
}
|
|
2939
|
+
refresh(true);
|
|
2940
|
+
return cleanup;
|
|
2941
|
+
}
|
|
2942
|
+
/**
|
|
2943
|
+
* Automatically updates the position of the floating element when necessary.
|
|
2944
|
+
* Should only be called when the floating element is mounted on the DOM or
|
|
2945
|
+
* visible on the screen.
|
|
2946
|
+
* @returns cleanup function that should be invoked when the floating element is
|
|
2947
|
+
* removed from the DOM or hidden from the screen.
|
|
2948
|
+
* @see https://floating-ui.com/docs/autoUpdate
|
|
2949
|
+
*/
|
|
2950
|
+
function autoUpdate(reference, floating, update, options) {
|
|
2951
|
+
if (options === void 0) options = {};
|
|
2952
|
+
const { ancestorScroll = true, ancestorResize = true, elementResize = typeof ResizeObserver === "function", layoutShift = typeof IntersectionObserver === "function", animationFrame = false } = options;
|
|
2953
|
+
const referenceEl = unwrapElement(reference);
|
|
2954
|
+
const ancestors = ancestorScroll || ancestorResize ? [...referenceEl ? getOverflowAncestors(referenceEl) : [], ...getOverflowAncestors(floating)] : [];
|
|
2955
|
+
ancestors.forEach((ancestor) => {
|
|
2956
|
+
ancestorScroll && ancestor.addEventListener("scroll", update, { passive: true });
|
|
2957
|
+
ancestorResize && ancestor.addEventListener("resize", update);
|
|
2958
|
+
});
|
|
2959
|
+
const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
|
|
2960
|
+
let reobserveFrame = -1;
|
|
2961
|
+
let resizeObserver = null;
|
|
2962
|
+
if (elementResize) {
|
|
2963
|
+
resizeObserver = new ResizeObserver((_ref) => {
|
|
2964
|
+
let [firstEntry] = _ref;
|
|
2965
|
+
if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
|
|
2966
|
+
resizeObserver.unobserve(floating);
|
|
2967
|
+
cancelAnimationFrame(reobserveFrame);
|
|
2968
|
+
reobserveFrame = requestAnimationFrame(() => {
|
|
2969
|
+
var _resizeObserver;
|
|
2970
|
+
(_resizeObserver = resizeObserver) == null || _resizeObserver.observe(floating);
|
|
2971
|
+
});
|
|
2972
|
+
}
|
|
2973
|
+
update();
|
|
2974
|
+
});
|
|
2975
|
+
if (referenceEl && !animationFrame) resizeObserver.observe(referenceEl);
|
|
2976
|
+
resizeObserver.observe(floating);
|
|
2977
|
+
}
|
|
2978
|
+
let frameId;
|
|
2979
|
+
let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
|
|
2980
|
+
if (animationFrame) frameLoop();
|
|
2981
|
+
function frameLoop() {
|
|
2982
|
+
const nextRefRect = getBoundingClientRect(reference);
|
|
2983
|
+
if (prevRefRect && !rectsAreEqual(prevRefRect, nextRefRect)) update();
|
|
2984
|
+
prevRefRect = nextRefRect;
|
|
2985
|
+
frameId = requestAnimationFrame(frameLoop);
|
|
2986
|
+
}
|
|
2987
|
+
update();
|
|
2988
|
+
return () => {
|
|
2989
|
+
var _resizeObserver2;
|
|
2990
|
+
ancestors.forEach((ancestor) => {
|
|
2991
|
+
ancestorScroll && ancestor.removeEventListener("scroll", update);
|
|
2992
|
+
ancestorResize && ancestor.removeEventListener("resize", update);
|
|
2993
|
+
});
|
|
2994
|
+
cleanupIo == null || cleanupIo();
|
|
2995
|
+
(_resizeObserver2 = resizeObserver) == null || _resizeObserver2.disconnect();
|
|
2996
|
+
resizeObserver = null;
|
|
2997
|
+
if (animationFrame) cancelAnimationFrame(frameId);
|
|
2998
|
+
};
|
|
2999
|
+
}
|
|
3000
|
+
/**
|
|
3001
|
+
* Modifies the placement by translating the floating element along the
|
|
3002
|
+
* specified axes.
|
|
3003
|
+
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
|
3004
|
+
* object may be passed.
|
|
3005
|
+
* @see https://floating-ui.com/docs/offset
|
|
3006
|
+
*/
|
|
3007
|
+
var offset$1 = offset$2;
|
|
3008
|
+
/**
|
|
3009
|
+
* Optimizes the visibility of the floating element by shifting it in order to
|
|
3010
|
+
* keep it in view when it will overflow the clipping boundary.
|
|
3011
|
+
* @see https://floating-ui.com/docs/shift
|
|
3012
|
+
*/
|
|
3013
|
+
var shift$1 = shift$2;
|
|
3014
|
+
/**
|
|
3015
|
+
* Optimizes the visibility of the floating element by flipping the `placement`
|
|
3016
|
+
* in order to keep it in view when the preferred placement(s) will overflow the
|
|
3017
|
+
* clipping boundary. Alternative to `autoPlacement`.
|
|
3018
|
+
* @see https://floating-ui.com/docs/flip
|
|
3019
|
+
*/
|
|
3020
|
+
var flip$1 = flip$2;
|
|
3021
|
+
/**
|
|
3022
|
+
* Provides data that allows you to change the size of the floating element —
|
|
3023
|
+
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
3024
|
+
* width of the reference element.
|
|
3025
|
+
* @see https://floating-ui.com/docs/size
|
|
3026
|
+
*/
|
|
3027
|
+
var size$1 = size$2;
|
|
3028
|
+
/**
|
|
3029
|
+
* Provides data to hide the floating element in applicable situations, such as
|
|
3030
|
+
* when it is not in the same clipping context as the reference element.
|
|
3031
|
+
* @see https://floating-ui.com/docs/hide
|
|
3032
|
+
*/
|
|
3033
|
+
var hide$1 = hide$2;
|
|
3034
|
+
/**
|
|
3035
|
+
* Built-in `limiter` that will stop `shift()` at a certain point.
|
|
3036
|
+
*/
|
|
3037
|
+
var limitShift$1 = limitShift$2;
|
|
3038
|
+
/**
|
|
3039
|
+
* Computes the `x` and `y` coordinates that will place the floating element
|
|
3040
|
+
* next to a given reference element.
|
|
3041
|
+
*/
|
|
3042
|
+
var computePosition = (reference, floating, options) => {
|
|
3043
|
+
const cache = /* @__PURE__ */ new Map();
|
|
3044
|
+
const mergedOptions = {
|
|
3045
|
+
platform,
|
|
3046
|
+
...options
|
|
3047
|
+
};
|
|
3048
|
+
const platformWithCache = {
|
|
3049
|
+
...mergedOptions.platform,
|
|
3050
|
+
_c: cache
|
|
3051
|
+
};
|
|
3052
|
+
return computePosition$1(reference, floating, {
|
|
3053
|
+
...mergedOptions,
|
|
3054
|
+
platform: platformWithCache
|
|
3055
|
+
});
|
|
3056
|
+
};
|
|
3057
|
+
//#endregion
|
|
3058
|
+
//#region ../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.mjs
|
|
3059
|
+
var index = typeof document !== "undefined" ? useLayoutEffect : function noop() {};
|
|
3060
|
+
function deepEqual(a, b) {
|
|
3061
|
+
if (a === b) return true;
|
|
3062
|
+
if (typeof a !== typeof b) return false;
|
|
3063
|
+
if (typeof a === "function" && a.toString() === b.toString()) return true;
|
|
3064
|
+
let length;
|
|
3065
|
+
let i;
|
|
3066
|
+
let keys;
|
|
3067
|
+
if (a && b && typeof a === "object") {
|
|
3068
|
+
if (Array.isArray(a)) {
|
|
3069
|
+
length = a.length;
|
|
3070
|
+
if (length !== b.length) return false;
|
|
3071
|
+
for (i = length; i-- !== 0;) if (!deepEqual(a[i], b[i])) return false;
|
|
3072
|
+
return true;
|
|
3073
|
+
}
|
|
3074
|
+
keys = Object.keys(a);
|
|
3075
|
+
length = keys.length;
|
|
3076
|
+
if (length !== Object.keys(b).length) return false;
|
|
3077
|
+
for (i = length; i-- !== 0;) if (!{}.hasOwnProperty.call(b, keys[i])) return false;
|
|
3078
|
+
for (i = length; i-- !== 0;) {
|
|
3079
|
+
const key = keys[i];
|
|
3080
|
+
if (key === "_owner" && a.$$typeof) continue;
|
|
3081
|
+
if (!deepEqual(a[key], b[key])) return false;
|
|
3082
|
+
}
|
|
3083
|
+
return true;
|
|
3084
|
+
}
|
|
3085
|
+
return a !== a && b !== b;
|
|
3086
|
+
}
|
|
3087
|
+
function getDPR(element) {
|
|
3088
|
+
if (typeof window === "undefined") return 1;
|
|
3089
|
+
return (element.ownerDocument.defaultView || window).devicePixelRatio || 1;
|
|
3090
|
+
}
|
|
3091
|
+
function roundByDPR(element, value) {
|
|
3092
|
+
const dpr = getDPR(element);
|
|
3093
|
+
return Math.round(value * dpr) / dpr;
|
|
3094
|
+
}
|
|
3095
|
+
function useLatestRef(value) {
|
|
3096
|
+
const ref = React$1.useRef(value);
|
|
3097
|
+
index(() => {
|
|
3098
|
+
ref.current = value;
|
|
3099
|
+
});
|
|
3100
|
+
return ref;
|
|
3101
|
+
}
|
|
3102
|
+
/**
|
|
3103
|
+
* Provides data to position a floating element.
|
|
3104
|
+
* @see https://floating-ui.com/docs/useFloating
|
|
3105
|
+
*/
|
|
3106
|
+
function useFloating(options) {
|
|
3107
|
+
if (options === void 0) options = {};
|
|
3108
|
+
const { placement = "bottom", strategy = "absolute", middleware = [], platform, elements: { reference: externalReference, floating: externalFloating } = {}, transform = true, whileElementsMounted, open } = options;
|
|
3109
|
+
const [data, setData] = React$1.useState({
|
|
3110
|
+
x: 0,
|
|
3111
|
+
y: 0,
|
|
3112
|
+
strategy,
|
|
3113
|
+
placement,
|
|
3114
|
+
middlewareData: {},
|
|
3115
|
+
isPositioned: false
|
|
3116
|
+
});
|
|
3117
|
+
const [latestMiddleware, setLatestMiddleware] = React$1.useState(middleware);
|
|
3118
|
+
if (!deepEqual(latestMiddleware, middleware)) setLatestMiddleware(middleware);
|
|
3119
|
+
const [_reference, _setReference] = React$1.useState(null);
|
|
3120
|
+
const [_floating, _setFloating] = React$1.useState(null);
|
|
3121
|
+
const setReference = React$1.useCallback((node) => {
|
|
3122
|
+
if (node !== referenceRef.current) {
|
|
3123
|
+
referenceRef.current = node;
|
|
3124
|
+
_setReference(node);
|
|
3125
|
+
}
|
|
3126
|
+
}, []);
|
|
3127
|
+
const setFloating = React$1.useCallback((node) => {
|
|
3128
|
+
if (node !== floatingRef.current) {
|
|
3129
|
+
floatingRef.current = node;
|
|
3130
|
+
_setFloating(node);
|
|
3131
|
+
}
|
|
3132
|
+
}, []);
|
|
3133
|
+
const referenceEl = externalReference || _reference;
|
|
3134
|
+
const floatingEl = externalFloating || _floating;
|
|
3135
|
+
const referenceRef = React$1.useRef(null);
|
|
3136
|
+
const floatingRef = React$1.useRef(null);
|
|
3137
|
+
const dataRef = React$1.useRef(data);
|
|
3138
|
+
const hasWhileElementsMounted = whileElementsMounted != null;
|
|
3139
|
+
const whileElementsMountedRef = useLatestRef(whileElementsMounted);
|
|
3140
|
+
const platformRef = useLatestRef(platform);
|
|
3141
|
+
const openRef = useLatestRef(open);
|
|
3142
|
+
const update = React$1.useCallback(() => {
|
|
3143
|
+
if (!referenceRef.current || !floatingRef.current) return;
|
|
3144
|
+
const config = {
|
|
3145
|
+
placement,
|
|
3146
|
+
strategy,
|
|
3147
|
+
middleware: latestMiddleware
|
|
3148
|
+
};
|
|
3149
|
+
if (platformRef.current) config.platform = platformRef.current;
|
|
3150
|
+
computePosition(referenceRef.current, floatingRef.current, config).then((data) => {
|
|
3151
|
+
const fullData = {
|
|
3152
|
+
...data,
|
|
3153
|
+
isPositioned: openRef.current !== false
|
|
3154
|
+
};
|
|
3155
|
+
if (isMountedRef.current && !deepEqual(dataRef.current, fullData)) {
|
|
3156
|
+
dataRef.current = fullData;
|
|
3157
|
+
ReactDOM$1.flushSync(() => {
|
|
3158
|
+
setData(fullData);
|
|
3159
|
+
});
|
|
3160
|
+
}
|
|
3161
|
+
});
|
|
3162
|
+
}, [
|
|
3163
|
+
latestMiddleware,
|
|
3164
|
+
placement,
|
|
3165
|
+
strategy,
|
|
3166
|
+
platformRef,
|
|
3167
|
+
openRef
|
|
3168
|
+
]);
|
|
3169
|
+
index(() => {
|
|
3170
|
+
if (open === false && dataRef.current.isPositioned) {
|
|
3171
|
+
dataRef.current.isPositioned = false;
|
|
3172
|
+
setData((data) => ({
|
|
3173
|
+
...data,
|
|
3174
|
+
isPositioned: false
|
|
3175
|
+
}));
|
|
3176
|
+
}
|
|
3177
|
+
}, [open]);
|
|
3178
|
+
const isMountedRef = React$1.useRef(false);
|
|
3179
|
+
index(() => {
|
|
3180
|
+
isMountedRef.current = true;
|
|
3181
|
+
return () => {
|
|
3182
|
+
isMountedRef.current = false;
|
|
3183
|
+
};
|
|
3184
|
+
}, []);
|
|
3185
|
+
index(() => {
|
|
3186
|
+
if (referenceEl) referenceRef.current = referenceEl;
|
|
3187
|
+
if (floatingEl) floatingRef.current = floatingEl;
|
|
3188
|
+
if (referenceEl && floatingEl) {
|
|
3189
|
+
if (whileElementsMountedRef.current) return whileElementsMountedRef.current(referenceEl, floatingEl, update);
|
|
3190
|
+
update();
|
|
3191
|
+
}
|
|
3192
|
+
}, [
|
|
3193
|
+
referenceEl,
|
|
3194
|
+
floatingEl,
|
|
3195
|
+
update,
|
|
3196
|
+
whileElementsMountedRef,
|
|
3197
|
+
hasWhileElementsMounted
|
|
3198
|
+
]);
|
|
3199
|
+
const refs = React$1.useMemo(() => ({
|
|
3200
|
+
reference: referenceRef,
|
|
3201
|
+
floating: floatingRef,
|
|
3202
|
+
setReference,
|
|
3203
|
+
setFloating
|
|
3204
|
+
}), [setReference, setFloating]);
|
|
3205
|
+
const elements = React$1.useMemo(() => ({
|
|
3206
|
+
reference: referenceEl,
|
|
3207
|
+
floating: floatingEl
|
|
3208
|
+
}), [referenceEl, floatingEl]);
|
|
3209
|
+
const floatingStyles = React$1.useMemo(() => {
|
|
3210
|
+
const initialStyles = {
|
|
3211
|
+
position: strategy,
|
|
3212
|
+
left: 0,
|
|
3213
|
+
top: 0
|
|
3214
|
+
};
|
|
3215
|
+
if (!elements.floating) return initialStyles;
|
|
3216
|
+
const x = roundByDPR(elements.floating, data.x);
|
|
3217
|
+
const y = roundByDPR(elements.floating, data.y);
|
|
3218
|
+
if (transform) return {
|
|
3219
|
+
...initialStyles,
|
|
3220
|
+
transform: "translate(" + x + "px, " + y + "px)",
|
|
3221
|
+
...getDPR(elements.floating) >= 1.5 && { willChange: "transform" }
|
|
3222
|
+
};
|
|
3223
|
+
return {
|
|
3224
|
+
position: strategy,
|
|
3225
|
+
left: x,
|
|
3226
|
+
top: y
|
|
3227
|
+
};
|
|
3228
|
+
}, [
|
|
3229
|
+
strategy,
|
|
3230
|
+
transform,
|
|
3231
|
+
elements.floating,
|
|
3232
|
+
data.x,
|
|
3233
|
+
data.y
|
|
3234
|
+
]);
|
|
3235
|
+
return React$1.useMemo(() => ({
|
|
3236
|
+
...data,
|
|
3237
|
+
update,
|
|
3238
|
+
refs,
|
|
3239
|
+
elements,
|
|
3240
|
+
floatingStyles
|
|
3241
|
+
}), [
|
|
3242
|
+
data,
|
|
3243
|
+
update,
|
|
3244
|
+
refs,
|
|
3245
|
+
elements,
|
|
3246
|
+
floatingStyles
|
|
3247
|
+
]);
|
|
3248
|
+
}
|
|
3249
|
+
/**
|
|
3250
|
+
* Modifies the placement by translating the floating element along the
|
|
3251
|
+
* specified axes.
|
|
3252
|
+
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
|
3253
|
+
* object may be passed.
|
|
3254
|
+
* @see https://floating-ui.com/docs/offset
|
|
3255
|
+
*/
|
|
3256
|
+
var offset = (options, deps) => ({
|
|
3257
|
+
...offset$1(options),
|
|
3258
|
+
options: [options, deps]
|
|
3259
|
+
});
|
|
3260
|
+
/**
|
|
3261
|
+
* Optimizes the visibility of the floating element by shifting it in order to
|
|
3262
|
+
* keep it in view when it will overflow the clipping boundary.
|
|
3263
|
+
* @see https://floating-ui.com/docs/shift
|
|
3264
|
+
*/
|
|
3265
|
+
var shift = (options, deps) => ({
|
|
3266
|
+
...shift$1(options),
|
|
3267
|
+
options: [options, deps]
|
|
3268
|
+
});
|
|
3269
|
+
/**
|
|
3270
|
+
* Built-in `limiter` that will stop `shift()` at a certain point.
|
|
3271
|
+
*/
|
|
3272
|
+
var limitShift = (options, deps) => ({
|
|
3273
|
+
...limitShift$1(options),
|
|
3274
|
+
options: [options, deps]
|
|
3275
|
+
});
|
|
3276
|
+
/**
|
|
3277
|
+
* Optimizes the visibility of the floating element by flipping the `placement`
|
|
3278
|
+
* in order to keep it in view when the preferred placement(s) will overflow the
|
|
3279
|
+
* clipping boundary. Alternative to `autoPlacement`.
|
|
3280
|
+
* @see https://floating-ui.com/docs/flip
|
|
3281
|
+
*/
|
|
3282
|
+
var flip = (options, deps) => ({
|
|
3283
|
+
...flip$1(options),
|
|
3284
|
+
options: [options, deps]
|
|
3285
|
+
});
|
|
3286
|
+
/**
|
|
3287
|
+
* Provides data that allows you to change the size of the floating element —
|
|
3288
|
+
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
3289
|
+
* width of the reference element.
|
|
3290
|
+
* @see https://floating-ui.com/docs/size
|
|
3291
|
+
*/
|
|
3292
|
+
var size = (options, deps) => ({
|
|
3293
|
+
...size$1(options),
|
|
3294
|
+
options: [options, deps]
|
|
3295
|
+
});
|
|
3296
|
+
/**
|
|
3297
|
+
* Provides data to hide the floating element in applicable situations, such as
|
|
3298
|
+
* when it is not in the same clipping context as the reference element.
|
|
3299
|
+
* @see https://floating-ui.com/docs/hide
|
|
3300
|
+
*/
|
|
3301
|
+
var hide = (options, deps) => ({
|
|
3302
|
+
...hide$1(options),
|
|
3303
|
+
options: [options, deps]
|
|
3304
|
+
});
|
|
3305
|
+
//#endregion
|
|
3306
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/hooks/useDismiss.js
|
|
3307
|
+
var bubbleHandlerKeys = {
|
|
3308
|
+
intentional: "onClick",
|
|
3309
|
+
sloppy: "onPointerDown"
|
|
3310
|
+
};
|
|
3311
|
+
function normalizeProp(normalizable) {
|
|
3312
|
+
var _normalizable$escapeK, _normalizable$outside;
|
|
3313
|
+
return {
|
|
3314
|
+
escapeKey: typeof normalizable === "boolean" ? normalizable : (_normalizable$escapeK = normalizable === null || normalizable === void 0 ? void 0 : normalizable.escapeKey) !== null && _normalizable$escapeK !== void 0 ? _normalizable$escapeK : false,
|
|
3315
|
+
outsidePress: typeof normalizable === "boolean" ? normalizable : (_normalizable$outside = normalizable === null || normalizable === void 0 ? void 0 : normalizable.outsidePress) !== null && _normalizable$outside !== void 0 ? _normalizable$outside : true
|
|
3316
|
+
};
|
|
3317
|
+
}
|
|
3318
|
+
/**
|
|
3319
|
+
* Closes the floating element when a dismissal is requested — by default, when
|
|
3320
|
+
* the user presses the `escape` key or outside of the floating element.
|
|
3321
|
+
* @see https://floating-ui.com/docs/useDismiss
|
|
3322
|
+
*/
|
|
3323
|
+
function useDismiss(context, props = {}) {
|
|
3324
|
+
const { open, onOpenChange, elements, dataRef } = context;
|
|
3325
|
+
const { enabled = true, escapeKey = true, outsidePress: outsidePressProp = true, outsidePressEvent = "sloppy", referencePress = false, referencePressEvent = "sloppy", ancestorScroll = false, bubbles, capture } = props;
|
|
3326
|
+
const tree = useFloatingTree();
|
|
3327
|
+
const outsidePressFn = useEventCallback(typeof outsidePressProp === "function" ? outsidePressProp : () => false);
|
|
3328
|
+
const outsidePress = typeof outsidePressProp === "function" ? outsidePressFn : outsidePressProp;
|
|
3329
|
+
const endedOrStartedInsideRef = React$1.useRef(false);
|
|
3330
|
+
const { escapeKey: escapeKeyBubbles, outsidePress: outsidePressBubbles } = normalizeProp(bubbles);
|
|
3331
|
+
const { escapeKey: escapeKeyCapture, outsidePress: outsidePressCapture } = normalizeProp(capture);
|
|
3332
|
+
const touchStateRef = React$1.useRef(null);
|
|
3333
|
+
const cancelDismissOnEndTimeout = useTimeout();
|
|
3334
|
+
const insideReactTreeTimeout = useTimeout();
|
|
3335
|
+
const isComposingRef = React$1.useRef(false);
|
|
3336
|
+
const currentPointerTypeRef = React$1.useRef("");
|
|
3337
|
+
const trackPointerType = useEventCallback((event) => {
|
|
3338
|
+
currentPointerTypeRef.current = event.pointerType;
|
|
3339
|
+
});
|
|
3340
|
+
const getOutsidePressEvent = useEventCallback(() => {
|
|
3341
|
+
const type = currentPointerTypeRef.current;
|
|
3342
|
+
const computedType = type === "pen" || !type ? "mouse" : type;
|
|
3343
|
+
const resolved = typeof outsidePressEvent === "function" ? outsidePressEvent() : outsidePressEvent;
|
|
3344
|
+
if (typeof resolved === "string") return resolved;
|
|
3345
|
+
return resolved[computedType];
|
|
3346
|
+
});
|
|
3347
|
+
const closeOnEscapeKeyDown = useEventCallback((event) => {
|
|
3348
|
+
var _dataRef$current$floa;
|
|
3349
|
+
if (!open || !enabled || !escapeKey || event.key !== "Escape") return;
|
|
3350
|
+
if (isComposingRef.current) return;
|
|
3351
|
+
const nodeId = (_dataRef$current$floa = dataRef.current.floatingContext) === null || _dataRef$current$floa === void 0 ? void 0 : _dataRef$current$floa.nodeId;
|
|
3352
|
+
const children = tree ? getNodeChildren(tree.nodesRef.current, nodeId) : [];
|
|
3353
|
+
if (!escapeKeyBubbles) {
|
|
3354
|
+
if (children.length > 0) {
|
|
3355
|
+
let shouldDismiss = true;
|
|
3356
|
+
children.forEach((child) => {
|
|
3357
|
+
var _child$context;
|
|
3358
|
+
if (((_child$context = child.context) === null || _child$context === void 0 ? void 0 : _child$context.open) && !child.context.dataRef.current.__escapeKeyBubbles) shouldDismiss = false;
|
|
3359
|
+
});
|
|
3360
|
+
if (!shouldDismiss) return;
|
|
3361
|
+
}
|
|
3362
|
+
}
|
|
3363
|
+
const eventDetails = createChangeEventDetails("escape-key", isReactEvent(event) ? event.nativeEvent : event);
|
|
3364
|
+
onOpenChange(false, eventDetails);
|
|
3365
|
+
if (!escapeKeyBubbles && !eventDetails.isPropagationAllowed) event.stopPropagation();
|
|
3366
|
+
});
|
|
3367
|
+
const shouldIgnoreEvent = useEventCallback((event) => {
|
|
3368
|
+
const computedOutsidePressEvent = getOutsidePressEvent();
|
|
3369
|
+
return computedOutsidePressEvent === "intentional" && event.type !== "click" || computedOutsidePressEvent === "sloppy" && event.type === "click";
|
|
3370
|
+
});
|
|
3371
|
+
const closeOnEscapeKeyDownCapture = useEventCallback((event) => {
|
|
3372
|
+
var _getTarget2;
|
|
3373
|
+
const callback = () => {
|
|
3374
|
+
var _getTarget;
|
|
3375
|
+
closeOnEscapeKeyDown(event);
|
|
3376
|
+
(_getTarget = getTarget(event)) === null || _getTarget === void 0 || _getTarget.removeEventListener("keydown", callback);
|
|
3377
|
+
};
|
|
3378
|
+
(_getTarget2 = getTarget(event)) === null || _getTarget2 === void 0 || _getTarget2.addEventListener("keydown", callback);
|
|
3379
|
+
});
|
|
3380
|
+
const closeOnPressOutside = useEventCallback((event, endedOrStartedInside = false) => {
|
|
3381
|
+
var _dataRef$current$floa2;
|
|
3382
|
+
if (shouldIgnoreEvent(event)) return;
|
|
3383
|
+
const insideReactTree = dataRef.current.insideReactTree;
|
|
3384
|
+
dataRef.current.insideReactTree = false;
|
|
3385
|
+
if (getOutsidePressEvent() === "intentional" && endedOrStartedInside) return;
|
|
3386
|
+
if (insideReactTree) return;
|
|
3387
|
+
if (typeof outsidePress === "function" && !outsidePress(event)) return;
|
|
3388
|
+
const target = getTarget(event);
|
|
3389
|
+
const inertSelector = `[${createAttribute("inert")}]`;
|
|
3390
|
+
const markers = getDocument(elements.floating).querySelectorAll(inertSelector);
|
|
3391
|
+
let targetRootAncestor = isElement(target) ? target : null;
|
|
3392
|
+
while (targetRootAncestor && !isLastTraversableNode(targetRootAncestor)) {
|
|
3393
|
+
const nextParent = getParentNode(targetRootAncestor);
|
|
3394
|
+
if (isLastTraversableNode(nextParent) || !isElement(nextParent)) break;
|
|
3395
|
+
targetRootAncestor = nextParent;
|
|
3396
|
+
}
|
|
3397
|
+
if (markers.length && isElement(target) && !isRootElement(target) && !contains(target, elements.floating) && Array.from(markers).every((marker) => !contains(targetRootAncestor, marker))) return;
|
|
3398
|
+
if (isHTMLElement(target)) {
|
|
3399
|
+
const lastTraversableNode = isLastTraversableNode(target);
|
|
3400
|
+
const style = getComputedStyle$1(target);
|
|
3401
|
+
const scrollRe = /auto|scroll/;
|
|
3402
|
+
const isScrollableX = lastTraversableNode || scrollRe.test(style.overflowX);
|
|
3403
|
+
const isScrollableY = lastTraversableNode || scrollRe.test(style.overflowY);
|
|
3404
|
+
const canScrollX = isScrollableX && target.clientWidth > 0 && target.scrollWidth > target.clientWidth;
|
|
3405
|
+
const canScrollY = isScrollableY && target.clientHeight > 0 && target.scrollHeight > target.clientHeight;
|
|
3406
|
+
const isRTL = style.direction === "rtl";
|
|
3407
|
+
const pressedVerticalScrollbar = canScrollY && (isRTL ? event.offsetX <= target.offsetWidth - target.clientWidth : event.offsetX > target.clientWidth);
|
|
3408
|
+
const pressedHorizontalScrollbar = canScrollX && event.offsetY > target.clientHeight;
|
|
3409
|
+
if (pressedVerticalScrollbar || pressedHorizontalScrollbar) return;
|
|
3410
|
+
}
|
|
3411
|
+
const nodeId = (_dataRef$current$floa2 = dataRef.current.floatingContext) === null || _dataRef$current$floa2 === void 0 ? void 0 : _dataRef$current$floa2.nodeId;
|
|
3412
|
+
const targetIsInsideChildren = tree && getNodeChildren(tree.nodesRef.current, nodeId).some((node) => {
|
|
3413
|
+
var _node$context;
|
|
3414
|
+
return isEventTargetWithin(event, (_node$context = node.context) === null || _node$context === void 0 ? void 0 : _node$context.elements.floating);
|
|
3415
|
+
});
|
|
3416
|
+
if (isEventTargetWithin(event, elements.floating) || isEventTargetWithin(event, elements.domReference) || targetIsInsideChildren) return;
|
|
3417
|
+
const children = tree ? getNodeChildren(tree.nodesRef.current, nodeId) : [];
|
|
3418
|
+
if (children.length > 0) {
|
|
3419
|
+
let shouldDismiss = true;
|
|
3420
|
+
children.forEach((child) => {
|
|
3421
|
+
var _child$context2;
|
|
3422
|
+
if (((_child$context2 = child.context) === null || _child$context2 === void 0 ? void 0 : _child$context2.open) && !child.context.dataRef.current.__outsidePressBubbles) shouldDismiss = false;
|
|
3423
|
+
});
|
|
3424
|
+
if (!shouldDismiss) return;
|
|
3425
|
+
}
|
|
3426
|
+
onOpenChange(false, createChangeEventDetails("outside-press", event));
|
|
3427
|
+
});
|
|
3428
|
+
const handlePointerDown = useEventCallback((event) => {
|
|
3429
|
+
if (getOutsidePressEvent() !== "sloppy" || !open || !enabled || isEventTargetWithin(event, elements.floating) || isEventTargetWithin(event, elements.domReference)) return;
|
|
3430
|
+
if (event.pointerType === "touch") {
|
|
3431
|
+
touchStateRef.current = {
|
|
3432
|
+
startTime: Date.now(),
|
|
3433
|
+
startX: event.clientX,
|
|
3434
|
+
startY: event.clientY,
|
|
3435
|
+
dismissOnPointerUp: false,
|
|
3436
|
+
dismissOnMouseDown: true
|
|
3437
|
+
};
|
|
3438
|
+
cancelDismissOnEndTimeout.start(1e3, () => {
|
|
3439
|
+
if (touchStateRef.current) {
|
|
3440
|
+
touchStateRef.current.dismissOnPointerUp = false;
|
|
3441
|
+
touchStateRef.current.dismissOnMouseDown = false;
|
|
3442
|
+
}
|
|
3443
|
+
});
|
|
3444
|
+
return;
|
|
3445
|
+
}
|
|
3446
|
+
closeOnPressOutside(event);
|
|
3447
|
+
});
|
|
3448
|
+
const closeOnPressOutsideCapture = useEventCallback((event) => {
|
|
3449
|
+
var _getTarget4;
|
|
3450
|
+
const endedOrStartedInside = endedOrStartedInsideRef.current;
|
|
3451
|
+
endedOrStartedInsideRef.current = false;
|
|
3452
|
+
if (shouldIgnoreEvent(event)) return;
|
|
3453
|
+
cancelDismissOnEndTimeout.clear();
|
|
3454
|
+
if (event.type === "mousedown" && touchStateRef.current && !touchStateRef.current.dismissOnMouseDown) return;
|
|
3455
|
+
const callback = () => {
|
|
3456
|
+
var _getTarget3;
|
|
3457
|
+
if (event.type === "pointerdown") handlePointerDown(event);
|
|
3458
|
+
else closeOnPressOutside(event, endedOrStartedInside);
|
|
3459
|
+
(_getTarget3 = getTarget(event)) === null || _getTarget3 === void 0 || _getTarget3.removeEventListener(event.type, callback);
|
|
3460
|
+
};
|
|
3461
|
+
(_getTarget4 = getTarget(event)) === null || _getTarget4 === void 0 || _getTarget4.addEventListener(event.type, callback);
|
|
3462
|
+
});
|
|
3463
|
+
const handlePointerMove = useEventCallback((event) => {
|
|
3464
|
+
if (getOutsidePressEvent() !== "sloppy" || event.pointerType !== "touch" || !touchStateRef.current || isEventTargetWithin(event, elements.floating) || isEventTargetWithin(event, elements.domReference)) return;
|
|
3465
|
+
const deltaX = Math.abs(event.clientX - touchStateRef.current.startX);
|
|
3466
|
+
const deltaY = Math.abs(event.clientY - touchStateRef.current.startY);
|
|
3467
|
+
const distance = Math.sqrt(deltaX * deltaX + deltaY * deltaY);
|
|
3468
|
+
if (distance > 5) touchStateRef.current.dismissOnPointerUp = true;
|
|
3469
|
+
if (distance > 10) {
|
|
3470
|
+
closeOnPressOutside(event);
|
|
3471
|
+
cancelDismissOnEndTimeout.clear();
|
|
3472
|
+
touchStateRef.current = null;
|
|
3473
|
+
}
|
|
3474
|
+
});
|
|
3475
|
+
const handlePointerUp = useEventCallback((event) => {
|
|
3476
|
+
if (getOutsidePressEvent() !== "sloppy" || event.pointerType !== "touch" || !touchStateRef.current || isEventTargetWithin(event, elements.floating) || isEventTargetWithin(event, elements.domReference)) return;
|
|
3477
|
+
if (touchStateRef.current.dismissOnPointerUp) closeOnPressOutside(event);
|
|
3478
|
+
cancelDismissOnEndTimeout.clear();
|
|
3479
|
+
touchStateRef.current = null;
|
|
3480
|
+
});
|
|
3481
|
+
React$1.useEffect(() => {
|
|
3482
|
+
if (!open || !enabled) return;
|
|
3483
|
+
dataRef.current.__escapeKeyBubbles = escapeKeyBubbles;
|
|
3484
|
+
dataRef.current.__outsidePressBubbles = outsidePressBubbles;
|
|
3485
|
+
const compositionTimeout = new Timeout();
|
|
3486
|
+
function onScroll(event) {
|
|
3487
|
+
onOpenChange(false, createChangeEventDetails("none", event));
|
|
3488
|
+
}
|
|
3489
|
+
function handleCompositionStart() {
|
|
3490
|
+
compositionTimeout.clear();
|
|
3491
|
+
isComposingRef.current = true;
|
|
3492
|
+
}
|
|
3493
|
+
function handleCompositionEnd() {
|
|
3494
|
+
compositionTimeout.start(isWebKit$1() ? 5 : 0, () => {
|
|
3495
|
+
isComposingRef.current = false;
|
|
3496
|
+
});
|
|
3497
|
+
}
|
|
3498
|
+
const doc = getDocument(elements.floating);
|
|
3499
|
+
doc.addEventListener("pointerdown", trackPointerType, true);
|
|
3500
|
+
if (escapeKey) {
|
|
3501
|
+
doc.addEventListener("keydown", escapeKeyCapture ? closeOnEscapeKeyDownCapture : closeOnEscapeKeyDown, escapeKeyCapture);
|
|
3502
|
+
doc.addEventListener("compositionstart", handleCompositionStart);
|
|
3503
|
+
doc.addEventListener("compositionend", handleCompositionEnd);
|
|
3504
|
+
}
|
|
3505
|
+
if (outsidePress) {
|
|
3506
|
+
doc.addEventListener("click", outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture);
|
|
3507
|
+
doc.addEventListener("pointerdown", outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture);
|
|
3508
|
+
doc.addEventListener("pointermove", handlePointerMove, outsidePressCapture);
|
|
3509
|
+
doc.addEventListener("pointerup", handlePointerUp, outsidePressCapture);
|
|
3510
|
+
doc.addEventListener("mousedown", closeOnPressOutsideCapture, outsidePressCapture);
|
|
3511
|
+
}
|
|
3512
|
+
let ancestors = [];
|
|
3513
|
+
if (ancestorScroll) {
|
|
3514
|
+
if (isElement(elements.domReference)) ancestors = getOverflowAncestors(elements.domReference);
|
|
3515
|
+
if (isElement(elements.floating)) ancestors = ancestors.concat(getOverflowAncestors(elements.floating));
|
|
3516
|
+
if (!isElement(elements.reference) && elements.reference && elements.reference.contextElement) ancestors = ancestors.concat(getOverflowAncestors(elements.reference.contextElement));
|
|
3517
|
+
}
|
|
3518
|
+
ancestors = ancestors.filter((ancestor) => {
|
|
3519
|
+
var _doc$defaultView;
|
|
3520
|
+
return ancestor !== ((_doc$defaultView = doc.defaultView) === null || _doc$defaultView === void 0 ? void 0 : _doc$defaultView.visualViewport);
|
|
3521
|
+
});
|
|
3522
|
+
ancestors.forEach((ancestor) => {
|
|
3523
|
+
ancestor.addEventListener("scroll", onScroll, { passive: true });
|
|
3524
|
+
});
|
|
3525
|
+
return () => {
|
|
3526
|
+
doc.removeEventListener("pointerdown", trackPointerType, true);
|
|
3527
|
+
if (escapeKey) {
|
|
3528
|
+
doc.removeEventListener("keydown", escapeKeyCapture ? closeOnEscapeKeyDownCapture : closeOnEscapeKeyDown, escapeKeyCapture);
|
|
3529
|
+
doc.removeEventListener("compositionstart", handleCompositionStart);
|
|
3530
|
+
doc.removeEventListener("compositionend", handleCompositionEnd);
|
|
3531
|
+
}
|
|
3532
|
+
if (outsidePress) {
|
|
3533
|
+
doc.removeEventListener("click", outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture);
|
|
3534
|
+
doc.removeEventListener("pointerdown", outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture);
|
|
3535
|
+
doc.removeEventListener("pointermove", handlePointerMove, outsidePressCapture);
|
|
3536
|
+
doc.removeEventListener("pointerup", handlePointerUp, outsidePressCapture);
|
|
3537
|
+
doc.removeEventListener("mousedown", closeOnPressOutsideCapture, outsidePressCapture);
|
|
3538
|
+
}
|
|
3539
|
+
ancestors.forEach((ancestor) => {
|
|
3540
|
+
ancestor.removeEventListener("scroll", onScroll);
|
|
3541
|
+
});
|
|
3542
|
+
compositionTimeout.clear();
|
|
3543
|
+
};
|
|
3544
|
+
}, [
|
|
3545
|
+
dataRef,
|
|
3546
|
+
elements,
|
|
3547
|
+
escapeKey,
|
|
3548
|
+
outsidePress,
|
|
3549
|
+
open,
|
|
3550
|
+
onOpenChange,
|
|
3551
|
+
ancestorScroll,
|
|
3552
|
+
enabled,
|
|
3553
|
+
escapeKeyBubbles,
|
|
3554
|
+
outsidePressBubbles,
|
|
3555
|
+
closeOnEscapeKeyDown,
|
|
3556
|
+
escapeKeyCapture,
|
|
3557
|
+
closeOnEscapeKeyDownCapture,
|
|
3558
|
+
closeOnPressOutside,
|
|
3559
|
+
outsidePressCapture,
|
|
3560
|
+
closeOnPressOutsideCapture,
|
|
3561
|
+
handlePointerDown,
|
|
3562
|
+
handlePointerMove,
|
|
3563
|
+
handlePointerUp,
|
|
3564
|
+
trackPointerType
|
|
3565
|
+
]);
|
|
3566
|
+
React$1.useEffect(() => {
|
|
3567
|
+
dataRef.current.insideReactTree = false;
|
|
3568
|
+
}, [dataRef, outsidePress]);
|
|
3569
|
+
const reference = React$1.useMemo(() => ({
|
|
3570
|
+
onKeyDown: closeOnEscapeKeyDown,
|
|
3571
|
+
...referencePress && {
|
|
3572
|
+
[bubbleHandlerKeys[referencePressEvent]]: (event) => {
|
|
3573
|
+
onOpenChange(false, createChangeEventDetails("trigger-press", event.nativeEvent));
|
|
3574
|
+
},
|
|
3575
|
+
...referencePressEvent !== "intentional" && { onClick(event) {
|
|
3576
|
+
onOpenChange(false, createChangeEventDetails("trigger-press", event.nativeEvent));
|
|
3577
|
+
} }
|
|
3578
|
+
}
|
|
3579
|
+
}), [
|
|
3580
|
+
closeOnEscapeKeyDown,
|
|
3581
|
+
onOpenChange,
|
|
3582
|
+
referencePress,
|
|
3583
|
+
referencePressEvent
|
|
3584
|
+
]);
|
|
3585
|
+
const handlePressedInside = useEventCallback((event) => {
|
|
3586
|
+
const target = getTarget(event.nativeEvent);
|
|
3587
|
+
if (!contains(elements.floating, target) || event.button !== 0) return;
|
|
3588
|
+
endedOrStartedInsideRef.current = true;
|
|
3589
|
+
});
|
|
3590
|
+
const handleCaptureInside = useEventCallback(() => {
|
|
3591
|
+
dataRef.current.insideReactTree = true;
|
|
3592
|
+
insideReactTreeTimeout.start(0, () => {
|
|
3593
|
+
dataRef.current.insideReactTree = false;
|
|
3594
|
+
});
|
|
3595
|
+
});
|
|
3596
|
+
const floating = React$1.useMemo(() => ({
|
|
3597
|
+
onKeyDown: closeOnEscapeKeyDown,
|
|
3598
|
+
onMouseDown: handlePressedInside,
|
|
3599
|
+
onMouseUp: handlePressedInside,
|
|
3600
|
+
onPointerDownCapture: handleCaptureInside,
|
|
3601
|
+
onMouseDownCapture: handleCaptureInside,
|
|
3602
|
+
onClickCapture: handleCaptureInside,
|
|
3603
|
+
onMouseUpCapture: handleCaptureInside
|
|
3604
|
+
}), [
|
|
3605
|
+
closeOnEscapeKeyDown,
|
|
3606
|
+
handlePressedInside,
|
|
3607
|
+
handleCaptureInside
|
|
3608
|
+
]);
|
|
3609
|
+
return React$1.useMemo(() => enabled ? {
|
|
3610
|
+
reference,
|
|
3611
|
+
floating
|
|
3612
|
+
} : {}, [
|
|
3613
|
+
enabled,
|
|
3614
|
+
reference,
|
|
3615
|
+
floating
|
|
3616
|
+
]);
|
|
3617
|
+
}
|
|
3618
|
+
//#endregion
|
|
3619
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/hooks/useFloatingRootContext.js
|
|
3620
|
+
function useFloatingRootContext(options) {
|
|
3621
|
+
const { open = false, onOpenChange: onOpenChangeProp, elements: elementsProp } = options;
|
|
3622
|
+
const floatingId = useId$1();
|
|
3623
|
+
const dataRef = React$1.useRef({});
|
|
3624
|
+
const [events] = React$1.useState(() => createEventEmitter());
|
|
3625
|
+
const nested = useFloatingParentNodeId() != null;
|
|
3626
|
+
if (process.env.NODE_ENV !== "production") {
|
|
3627
|
+
const optionDomReference = elementsProp.reference;
|
|
3628
|
+
if (optionDomReference && !isElement(optionDomReference)) console.error("Cannot pass a virtual element to the `elements.reference` option,", "as it must be a real DOM element. Use `refs.setPositionReference()`", "instead.");
|
|
3629
|
+
}
|
|
3630
|
+
const [positionReference, setPositionReference] = React$1.useState(elementsProp.reference);
|
|
3631
|
+
const onOpenChange = useEventCallback((newOpen, eventDetails) => {
|
|
3632
|
+
dataRef.current.openEvent = newOpen ? eventDetails.event : void 0;
|
|
3633
|
+
if (!options.noEmit) {
|
|
3634
|
+
const details = {
|
|
3635
|
+
open: newOpen,
|
|
3636
|
+
reason: eventDetails.reason,
|
|
3637
|
+
nativeEvent: eventDetails.event,
|
|
3638
|
+
nested
|
|
3639
|
+
};
|
|
3640
|
+
events.emit("openchange", details);
|
|
3641
|
+
}
|
|
3642
|
+
onOpenChangeProp === null || onOpenChangeProp === void 0 || onOpenChangeProp(newOpen, eventDetails);
|
|
3643
|
+
});
|
|
3644
|
+
const refs = React$1.useMemo(() => ({ setPositionReference }), []);
|
|
3645
|
+
const elements = React$1.useMemo(() => ({
|
|
3646
|
+
reference: positionReference || elementsProp.reference || null,
|
|
3647
|
+
floating: elementsProp.floating || null,
|
|
3648
|
+
domReference: elementsProp.reference
|
|
3649
|
+
}), [
|
|
3650
|
+
positionReference,
|
|
3651
|
+
elementsProp.reference,
|
|
3652
|
+
elementsProp.floating
|
|
3653
|
+
]);
|
|
3654
|
+
return React$1.useMemo(() => ({
|
|
3655
|
+
dataRef,
|
|
3656
|
+
open,
|
|
3657
|
+
onOpenChange,
|
|
3658
|
+
elements,
|
|
3659
|
+
events,
|
|
3660
|
+
floatingId,
|
|
3661
|
+
refs
|
|
3662
|
+
}), [
|
|
3663
|
+
open,
|
|
3664
|
+
onOpenChange,
|
|
3665
|
+
elements,
|
|
3666
|
+
events,
|
|
3667
|
+
floatingId,
|
|
3668
|
+
refs
|
|
3669
|
+
]);
|
|
3670
|
+
}
|
|
3671
|
+
function getEmptyContext() {
|
|
3672
|
+
return {
|
|
3673
|
+
open: false,
|
|
3674
|
+
onOpenChange: () => {},
|
|
3675
|
+
dataRef: { current: {} },
|
|
3676
|
+
elements: {
|
|
3677
|
+
floating: null,
|
|
3678
|
+
reference: null,
|
|
3679
|
+
domReference: null
|
|
3680
|
+
},
|
|
3681
|
+
events: {
|
|
3682
|
+
on: () => {},
|
|
3683
|
+
off: () => {},
|
|
3684
|
+
emit: () => {}
|
|
3685
|
+
},
|
|
3686
|
+
floatingId: "",
|
|
3687
|
+
refs: { setPositionReference: () => {} }
|
|
3688
|
+
};
|
|
3689
|
+
}
|
|
3690
|
+
//#endregion
|
|
3691
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/hooks/useInteractions.js
|
|
3692
|
+
/**
|
|
3693
|
+
* Merges an array of interaction hooks' props into prop getters, allowing
|
|
3694
|
+
* event handler functions to be composed together without overwriting one
|
|
3695
|
+
* another.
|
|
3696
|
+
* @see https://floating-ui.com/docs/useInteractions
|
|
3697
|
+
*/
|
|
3698
|
+
function useInteractions(propsList = []) {
|
|
3699
|
+
const referenceDeps = propsList.map((key) => key === null || key === void 0 ? void 0 : key.reference);
|
|
3700
|
+
const floatingDeps = propsList.map((key) => key === null || key === void 0 ? void 0 : key.floating);
|
|
3701
|
+
const itemDeps = propsList.map((key) => key === null || key === void 0 ? void 0 : key.item);
|
|
3702
|
+
const getReferenceProps = React$1.useCallback((userProps) => mergeProps(userProps, propsList, "reference"), referenceDeps);
|
|
3703
|
+
const getFloatingProps = React$1.useCallback((userProps) => mergeProps(userProps, propsList, "floating"), floatingDeps);
|
|
3704
|
+
const getItemProps = React$1.useCallback((userProps) => mergeProps(userProps, propsList, "item"), itemDeps);
|
|
3705
|
+
return React$1.useMemo(() => ({
|
|
3706
|
+
getReferenceProps,
|
|
3707
|
+
getFloatingProps,
|
|
3708
|
+
getItemProps
|
|
3709
|
+
}), [
|
|
3710
|
+
getReferenceProps,
|
|
3711
|
+
getFloatingProps,
|
|
3712
|
+
getItemProps
|
|
3713
|
+
]);
|
|
3714
|
+
}
|
|
3715
|
+
function mergeProps(userProps, propsList, elementKey) {
|
|
3716
|
+
const eventHandlers = /* @__PURE__ */ new Map();
|
|
3717
|
+
const isItem = elementKey === "item";
|
|
3718
|
+
const outputProps = {};
|
|
3719
|
+
if (elementKey === "floating") {
|
|
3720
|
+
outputProps.tabIndex = -1;
|
|
3721
|
+
outputProps[FOCUSABLE_ATTRIBUTE] = "";
|
|
3722
|
+
}
|
|
3723
|
+
for (const key in userProps) {
|
|
3724
|
+
if (isItem && userProps) {
|
|
3725
|
+
if (key === "active" || key === "selected") continue;
|
|
3726
|
+
}
|
|
3727
|
+
outputProps[key] = userProps[key];
|
|
3728
|
+
}
|
|
3729
|
+
for (let i = 0; i < propsList.length; i += 1) {
|
|
3730
|
+
var _propsList$i;
|
|
3731
|
+
let props;
|
|
3732
|
+
const propsOrGetProps = (_propsList$i = propsList[i]) === null || _propsList$i === void 0 ? void 0 : _propsList$i[elementKey];
|
|
3733
|
+
if (typeof propsOrGetProps === "function") props = userProps ? propsOrGetProps(userProps) : null;
|
|
3734
|
+
else props = propsOrGetProps;
|
|
3735
|
+
if (!props) continue;
|
|
3736
|
+
mutablyMergeProps(outputProps, props, isItem, eventHandlers);
|
|
3737
|
+
}
|
|
3738
|
+
mutablyMergeProps(outputProps, userProps, isItem, eventHandlers);
|
|
3739
|
+
return outputProps;
|
|
3740
|
+
}
|
|
3741
|
+
function mutablyMergeProps(outputProps, props, isItem, eventHandlers) {
|
|
3742
|
+
for (const key in props) {
|
|
3743
|
+
const value = props[key];
|
|
3744
|
+
if (isItem && (key === "active" || key === "selected")) continue;
|
|
3745
|
+
if (!key.startsWith("on")) outputProps[key] = value;
|
|
3746
|
+
else {
|
|
3747
|
+
if (!eventHandlers.has(key)) eventHandlers.set(key, []);
|
|
3748
|
+
if (typeof value === "function") {
|
|
3749
|
+
var _eventHandlers$get;
|
|
3750
|
+
(_eventHandlers$get = eventHandlers.get(key)) === null || _eventHandlers$get === void 0 || _eventHandlers$get.push(value);
|
|
3751
|
+
outputProps[key] = (...args) => {
|
|
3752
|
+
var _eventHandlers$get2;
|
|
3753
|
+
return (_eventHandlers$get2 = eventHandlers.get(key)) === null || _eventHandlers$get2 === void 0 ? void 0 : _eventHandlers$get2.map((fn) => fn(...args)).find((val) => val !== void 0);
|
|
3754
|
+
};
|
|
3755
|
+
}
|
|
3756
|
+
}
|
|
3757
|
+
}
|
|
3758
|
+
}
|
|
3759
|
+
//#endregion
|
|
3760
|
+
//#region ../../node_modules/@base-ui-components/react/esm/floating-ui-react/hooks/useRole.js
|
|
3761
|
+
var componentRoleToAriaRoleMap = new Map([
|
|
3762
|
+
["select", "listbox"],
|
|
3763
|
+
["combobox", "listbox"],
|
|
3764
|
+
["label", false]
|
|
3765
|
+
]);
|
|
3766
|
+
/**
|
|
3767
|
+
* Adds base screen reader props to the reference and floating elements for a
|
|
3768
|
+
* given floating element `role`.
|
|
3769
|
+
* @see https://floating-ui.com/docs/useRole
|
|
3770
|
+
*/
|
|
3771
|
+
function useRole(context, props = {}) {
|
|
3772
|
+
var _elements$domReferenc, _componentRoleToAriaR;
|
|
3773
|
+
const { open, elements, floatingId: defaultFloatingId } = context;
|
|
3774
|
+
const { enabled = true, role = "dialog" } = props;
|
|
3775
|
+
const defaultReferenceId = useId$1();
|
|
3776
|
+
const referenceId = ((_elements$domReferenc = elements.domReference) === null || _elements$domReferenc === void 0 ? void 0 : _elements$domReferenc.id) || defaultReferenceId;
|
|
3777
|
+
const floatingId = React$1.useMemo(() => {
|
|
3778
|
+
var _getFloatingFocusElem;
|
|
3779
|
+
return ((_getFloatingFocusElem = getFloatingFocusElement(elements.floating)) === null || _getFloatingFocusElem === void 0 ? void 0 : _getFloatingFocusElem.id) || defaultFloatingId;
|
|
3780
|
+
}, [elements.floating, defaultFloatingId]);
|
|
3781
|
+
const ariaRole = (_componentRoleToAriaR = componentRoleToAriaRoleMap.get(role)) !== null && _componentRoleToAriaR !== void 0 ? _componentRoleToAriaR : role;
|
|
3782
|
+
const isNested = useFloatingParentNodeId() != null;
|
|
3783
|
+
const reference = React$1.useMemo(() => {
|
|
3784
|
+
if (ariaRole === "tooltip" || role === "label") return { [`aria-${role === "label" ? "labelledby" : "describedby"}`]: open ? floatingId : void 0 };
|
|
3785
|
+
return {
|
|
3786
|
+
"aria-expanded": open ? "true" : "false",
|
|
3787
|
+
"aria-haspopup": ariaRole === "alertdialog" ? "dialog" : ariaRole,
|
|
3788
|
+
"aria-controls": open ? floatingId : void 0,
|
|
3789
|
+
...ariaRole === "listbox" && { role: "combobox" },
|
|
3790
|
+
...ariaRole === "menu" && { id: referenceId },
|
|
3791
|
+
...ariaRole === "menu" && isNested && { role: "menuitem" },
|
|
3792
|
+
...role === "select" && { "aria-autocomplete": "none" },
|
|
3793
|
+
...role === "combobox" && { "aria-autocomplete": "list" }
|
|
3794
|
+
};
|
|
3795
|
+
}, [
|
|
3796
|
+
ariaRole,
|
|
3797
|
+
floatingId,
|
|
3798
|
+
isNested,
|
|
3799
|
+
open,
|
|
3800
|
+
referenceId,
|
|
3801
|
+
role
|
|
3802
|
+
]);
|
|
3803
|
+
const floating = React$1.useMemo(() => {
|
|
3804
|
+
const floatingProps = {
|
|
3805
|
+
id: floatingId,
|
|
3806
|
+
...ariaRole && { role: ariaRole }
|
|
3807
|
+
};
|
|
3808
|
+
if (ariaRole === "tooltip" || role === "label") return floatingProps;
|
|
3809
|
+
return {
|
|
3810
|
+
...floatingProps,
|
|
3811
|
+
...ariaRole === "menu" && { "aria-labelledby": referenceId }
|
|
3812
|
+
};
|
|
3813
|
+
}, [
|
|
3814
|
+
ariaRole,
|
|
3815
|
+
floatingId,
|
|
3816
|
+
referenceId,
|
|
3817
|
+
role
|
|
3818
|
+
]);
|
|
3819
|
+
const item = React$1.useCallback(({ active, selected }) => {
|
|
3820
|
+
const commonProps = {
|
|
3821
|
+
role: "option",
|
|
3822
|
+
...active && { id: `${floatingId}-fui-option` }
|
|
3823
|
+
};
|
|
3824
|
+
switch (role) {
|
|
3825
|
+
case "select":
|
|
3826
|
+
case "combobox": return {
|
|
3827
|
+
...commonProps,
|
|
3828
|
+
"aria-selected": selected
|
|
3829
|
+
};
|
|
3830
|
+
default:
|
|
3831
|
+
}
|
|
3832
|
+
return {};
|
|
3833
|
+
}, [floatingId, role]);
|
|
3834
|
+
return React$1.useMemo(() => enabled ? {
|
|
3835
|
+
reference,
|
|
3836
|
+
floating,
|
|
3837
|
+
item
|
|
3838
|
+
} : {}, [
|
|
3839
|
+
enabled,
|
|
3840
|
+
reference,
|
|
3841
|
+
floating,
|
|
3842
|
+
item
|
|
3843
|
+
]);
|
|
3844
|
+
}
|
|
3845
|
+
//#endregion
|
|
3846
|
+
//#region ../../node_modules/@base-ui-components/react/esm/utils/InternalBackdrop.js
|
|
3847
|
+
/**
|
|
3848
|
+
* @internal
|
|
3849
|
+
*/
|
|
3850
|
+
var InternalBackdrop = /* @__PURE__ */ React$1.forwardRef(function InternalBackdrop(props, ref) {
|
|
3851
|
+
const { cutout, ...otherProps } = props;
|
|
3852
|
+
let clipPath;
|
|
3853
|
+
if (cutout) {
|
|
3854
|
+
const rect = cutout === null || cutout === void 0 ? void 0 : cutout.getBoundingClientRect();
|
|
3855
|
+
clipPath = `polygon(
|
|
3856
|
+
0% 0%,
|
|
3857
|
+
100% 0%,
|
|
3858
|
+
100% 100%,
|
|
3859
|
+
0% 100%,
|
|
3860
|
+
0% 0%,
|
|
3861
|
+
${rect.left}px ${rect.top}px,
|
|
3862
|
+
${rect.left}px ${rect.bottom}px,
|
|
3863
|
+
${rect.right}px ${rect.bottom}px,
|
|
3864
|
+
${rect.right}px ${rect.top}px,
|
|
3865
|
+
${rect.left}px ${rect.top}px
|
|
3866
|
+
)`;
|
|
3867
|
+
}
|
|
3868
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
|
|
3869
|
+
ref,
|
|
3870
|
+
role: "presentation",
|
|
3871
|
+
"data-base-ui-inert": "",
|
|
3872
|
+
...otherProps,
|
|
3873
|
+
style: {
|
|
3874
|
+
position: "fixed",
|
|
3875
|
+
inset: 0,
|
|
3876
|
+
userSelect: "none",
|
|
3877
|
+
WebkitUserSelect: "none",
|
|
3878
|
+
clipPath
|
|
3879
|
+
}
|
|
3880
|
+
});
|
|
3881
|
+
});
|
|
3882
|
+
if (process.env.NODE_ENV !== "production") InternalBackdrop.displayName = "InternalBackdrop";
|
|
3883
|
+
//#endregion
|
|
3884
|
+
//#region ../../node_modules/@base-ui-components/react/esm/utils/useScrollLock.js
|
|
3885
|
+
var originalHtmlStyles = {};
|
|
3886
|
+
var originalBodyStyles = {};
|
|
3887
|
+
var originalHtmlScrollBehavior = "";
|
|
3888
|
+
function hasInsetScrollbars(referenceElement) {
|
|
3889
|
+
if (typeof document === "undefined") return false;
|
|
3890
|
+
const doc = ownerDocument(referenceElement);
|
|
3891
|
+
return getWindow(doc).innerWidth - doc.documentElement.clientWidth > 0;
|
|
3892
|
+
}
|
|
3893
|
+
function preventScrollBasic(referenceElement) {
|
|
3894
|
+
const html = ownerDocument(referenceElement).documentElement;
|
|
3895
|
+
const originalOverflow = html.style.overflow;
|
|
3896
|
+
html.style.overflow = "hidden";
|
|
3897
|
+
return () => {
|
|
3898
|
+
html.style.overflow = originalOverflow;
|
|
3899
|
+
};
|
|
3900
|
+
}
|
|
3901
|
+
function preventScrollStandard(referenceElement) {
|
|
3902
|
+
var _win$visualViewport$s, _win$visualViewport;
|
|
3903
|
+
const doc = ownerDocument(referenceElement);
|
|
3904
|
+
const html = doc.documentElement;
|
|
3905
|
+
const body = doc.body;
|
|
3906
|
+
const win = getWindow(html);
|
|
3907
|
+
let scrollTop = 0;
|
|
3908
|
+
let scrollLeft = 0;
|
|
3909
|
+
const resizeFrame = AnimationFrame.create();
|
|
3910
|
+
if (isWebKit && ((_win$visualViewport$s = (_win$visualViewport = win.visualViewport) === null || _win$visualViewport === void 0 ? void 0 : _win$visualViewport.scale) !== null && _win$visualViewport$s !== void 0 ? _win$visualViewport$s : 1) !== 1) return () => {};
|
|
3911
|
+
function lockScroll() {
|
|
3912
|
+
var _CSS$supports, _CSS;
|
|
3913
|
+
const htmlStyles = win.getComputedStyle(html);
|
|
3914
|
+
const bodyStyles = win.getComputedStyle(body);
|
|
3915
|
+
scrollTop = html.scrollTop;
|
|
3916
|
+
scrollLeft = html.scrollLeft;
|
|
3917
|
+
originalHtmlStyles = {
|
|
3918
|
+
scrollbarGutter: html.style.scrollbarGutter,
|
|
3919
|
+
overflowY: html.style.overflowY,
|
|
3920
|
+
overflowX: html.style.overflowX
|
|
3921
|
+
};
|
|
3922
|
+
originalHtmlScrollBehavior = html.style.scrollBehavior;
|
|
3923
|
+
originalBodyStyles = {
|
|
3924
|
+
position: body.style.position,
|
|
3925
|
+
height: body.style.height,
|
|
3926
|
+
width: body.style.width,
|
|
3927
|
+
boxSizing: body.style.boxSizing,
|
|
3928
|
+
overflowY: body.style.overflowY,
|
|
3929
|
+
overflowX: body.style.overflowX,
|
|
3930
|
+
scrollBehavior: body.style.scrollBehavior
|
|
3931
|
+
};
|
|
3932
|
+
const supportsStableScrollbarGutter = typeof CSS !== "undefined" && ((_CSS$supports = (_CSS = CSS).supports) === null || _CSS$supports === void 0 ? void 0 : _CSS$supports.call(_CSS, "scrollbar-gutter", "stable"));
|
|
3933
|
+
const isScrollableY = html.scrollHeight > html.clientHeight;
|
|
3934
|
+
const isScrollableX = html.scrollWidth > html.clientWidth;
|
|
3935
|
+
const hasConstantOverflowY = htmlStyles.overflowY === "scroll" || bodyStyles.overflowY === "scroll";
|
|
3936
|
+
const hasConstantOverflowX = htmlStyles.overflowX === "scroll" || bodyStyles.overflowX === "scroll";
|
|
3937
|
+
const scrollbarWidth = Math.max(0, win.innerWidth - html.clientWidth);
|
|
3938
|
+
const scrollbarHeight = Math.max(0, win.innerHeight - html.clientHeight);
|
|
3939
|
+
const marginY = parseFloat(bodyStyles.marginTop) + parseFloat(bodyStyles.marginBottom);
|
|
3940
|
+
const marginX = parseFloat(bodyStyles.marginLeft) + parseFloat(bodyStyles.marginRight);
|
|
3941
|
+
Object.assign(html.style, {
|
|
3942
|
+
scrollbarGutter: "stable",
|
|
3943
|
+
overflowY: !supportsStableScrollbarGutter && (isScrollableY || hasConstantOverflowY) ? "scroll" : "hidden",
|
|
3944
|
+
overflowX: !supportsStableScrollbarGutter && (isScrollableX || hasConstantOverflowX) ? "scroll" : "hidden"
|
|
3945
|
+
});
|
|
3946
|
+
Object.assign(body.style, {
|
|
3947
|
+
position: "relative",
|
|
3948
|
+
height: marginY || scrollbarHeight ? `calc(100dvh - ${marginY + scrollbarHeight}px)` : "100dvh",
|
|
3949
|
+
width: marginX || scrollbarWidth ? `calc(100vw - ${marginX + scrollbarWidth}px)` : "100vw",
|
|
3950
|
+
boxSizing: "border-box",
|
|
3951
|
+
overflow: "hidden",
|
|
3952
|
+
scrollBehavior: "unset"
|
|
3953
|
+
});
|
|
3954
|
+
body.scrollTop = scrollTop;
|
|
3955
|
+
body.scrollLeft = scrollLeft;
|
|
3956
|
+
html.setAttribute("data-base-ui-scroll-locked", "");
|
|
3957
|
+
html.style.scrollBehavior = "unset";
|
|
3958
|
+
}
|
|
3959
|
+
function cleanup() {
|
|
3960
|
+
Object.assign(html.style, originalHtmlStyles);
|
|
3961
|
+
Object.assign(body.style, originalBodyStyles);
|
|
3962
|
+
html.scrollTop = scrollTop;
|
|
3963
|
+
html.scrollLeft = scrollLeft;
|
|
3964
|
+
html.removeAttribute("data-base-ui-scroll-locked");
|
|
3965
|
+
html.style.scrollBehavior = originalHtmlScrollBehavior;
|
|
3966
|
+
}
|
|
3967
|
+
function handleResize() {
|
|
3968
|
+
cleanup();
|
|
3969
|
+
resizeFrame.request(lockScroll);
|
|
3970
|
+
}
|
|
3971
|
+
lockScroll();
|
|
3972
|
+
win.addEventListener("resize", handleResize);
|
|
3973
|
+
return () => {
|
|
3974
|
+
resizeFrame.cancel();
|
|
3975
|
+
cleanup();
|
|
3976
|
+
win.removeEventListener("resize", handleResize);
|
|
3977
|
+
};
|
|
3978
|
+
}
|
|
3979
|
+
var ScrollLocker = class {
|
|
3980
|
+
constructor() {
|
|
3981
|
+
_defineProperty(this, "lockCount", 0);
|
|
3982
|
+
_defineProperty(this, "restore", null);
|
|
3983
|
+
_defineProperty(this, "timeoutLock", Timeout.create());
|
|
3984
|
+
_defineProperty(this, "timeoutUnlock", Timeout.create());
|
|
3985
|
+
_defineProperty(this, "release", () => {
|
|
3986
|
+
this.lockCount -= 1;
|
|
3987
|
+
if (this.lockCount === 0 && this.restore) this.timeoutUnlock.start(0, this.unlock);
|
|
3988
|
+
});
|
|
3989
|
+
_defineProperty(this, "unlock", () => {
|
|
3990
|
+
if (this.lockCount === 0 && this.restore) {
|
|
3991
|
+
var _this$restore;
|
|
3992
|
+
(_this$restore = this.restore) === null || _this$restore === void 0 || _this$restore.call(this);
|
|
3993
|
+
this.restore = null;
|
|
3994
|
+
}
|
|
3995
|
+
});
|
|
3996
|
+
}
|
|
3997
|
+
acquire(referenceElement) {
|
|
3998
|
+
this.lockCount += 1;
|
|
3999
|
+
if (this.lockCount === 1 && this.restore === null) this.timeoutLock.start(0, () => this.lock(referenceElement));
|
|
4000
|
+
return this.release;
|
|
4001
|
+
}
|
|
4002
|
+
lock(referenceElement) {
|
|
4003
|
+
if (this.lockCount === 0 || this.restore !== null) return;
|
|
4004
|
+
const html = ownerDocument(referenceElement).documentElement;
|
|
4005
|
+
const htmlOverflowY = getWindow(html).getComputedStyle(html).overflowY;
|
|
4006
|
+
if (htmlOverflowY === "hidden" || htmlOverflowY === "clip") {
|
|
4007
|
+
this.restore = NOOP;
|
|
4008
|
+
return;
|
|
4009
|
+
}
|
|
4010
|
+
this.restore = isIOS || !hasInsetScrollbars(referenceElement) ? preventScrollBasic(referenceElement) : preventScrollStandard(referenceElement);
|
|
4011
|
+
}
|
|
4012
|
+
};
|
|
4013
|
+
var SCROLL_LOCKER = new ScrollLocker();
|
|
4014
|
+
/**
|
|
4015
|
+
* Locks the scroll of the document when enabled.
|
|
4016
|
+
*
|
|
4017
|
+
* @param enabled - Whether to enable the scroll lock.
|
|
4018
|
+
*/
|
|
4019
|
+
function useScrollLock(params) {
|
|
4020
|
+
const { enabled = true, mounted, open, referenceElement = null } = params;
|
|
4021
|
+
useIsoLayoutEffect(() => {
|
|
4022
|
+
if (enabled && isWebKit && mounted && !open) {
|
|
4023
|
+
const doc = ownerDocument(referenceElement);
|
|
4024
|
+
const originalUserSelect = doc.body.style.userSelect;
|
|
4025
|
+
const originalWebkitUserSelect = doc.body.style.webkitUserSelect;
|
|
4026
|
+
doc.body.style.userSelect = "none";
|
|
4027
|
+
doc.body.style.webkitUserSelect = "none";
|
|
4028
|
+
return () => {
|
|
4029
|
+
doc.body.style.userSelect = originalUserSelect;
|
|
4030
|
+
doc.body.style.webkitUserSelect = originalWebkitUserSelect;
|
|
4031
|
+
};
|
|
4032
|
+
}
|
|
4033
|
+
}, [
|
|
4034
|
+
enabled,
|
|
4035
|
+
mounted,
|
|
4036
|
+
open,
|
|
4037
|
+
referenceElement
|
|
4038
|
+
]);
|
|
4039
|
+
useIsoLayoutEffect(() => {
|
|
4040
|
+
if (!enabled) return;
|
|
4041
|
+
return SCROLL_LOCKER.acquire(referenceElement);
|
|
4042
|
+
}, [enabled, referenceElement]);
|
|
4043
|
+
}
|
|
4044
|
+
//#endregion
|
|
4045
|
+
//#region ../../node_modules/@base-ui-components/utils/esm/useEnhancedClickHandler.js
|
|
4046
|
+
/**
|
|
4047
|
+
* Provides a cross-browser way to determine the type of the pointer used to click.
|
|
4048
|
+
* Safari and Firefox do not provide the PointerEvent to the click handler (they use MouseEvent) yet.
|
|
4049
|
+
* Additionally, this implementation detects if the click was triggered by the keyboard.
|
|
4050
|
+
*
|
|
4051
|
+
* @param handler The function to be called when the button is clicked. The first parameter is the original event and the second parameter is the pointer type.
|
|
4052
|
+
*/
|
|
4053
|
+
function useEnhancedClickHandler(handler) {
|
|
4054
|
+
const lastClickInteractionTypeRef = React$1.useRef("");
|
|
4055
|
+
const handlePointerDown = React$1.useCallback((event) => {
|
|
4056
|
+
if (event.defaultPrevented) return;
|
|
4057
|
+
lastClickInteractionTypeRef.current = event.pointerType;
|
|
4058
|
+
handler(event, event.pointerType);
|
|
4059
|
+
}, [handler]);
|
|
4060
|
+
return {
|
|
4061
|
+
onClick: React$1.useCallback((event) => {
|
|
4062
|
+
if (event.detail === 0) {
|
|
4063
|
+
handler(event, "keyboard");
|
|
4064
|
+
return;
|
|
4065
|
+
}
|
|
4066
|
+
if ("pointerType" in event) handler(event, event.pointerType);
|
|
4067
|
+
handler(event, lastClickInteractionTypeRef.current);
|
|
4068
|
+
lastClickInteractionTypeRef.current = "";
|
|
4069
|
+
}, [handler]),
|
|
4070
|
+
onPointerDown: handlePointerDown
|
|
4071
|
+
};
|
|
4072
|
+
}
|
|
4073
|
+
//#endregion
|
|
4074
|
+
//#region ../../node_modules/@base-ui-components/react/esm/utils/useOpenInteractionType.js
|
|
4075
|
+
/**
|
|
4076
|
+
* Determines the interaction type (keyboard, mouse, touch, etc.) that opened the component.
|
|
4077
|
+
*
|
|
4078
|
+
* @param open The open state of the component.
|
|
4079
|
+
*/
|
|
4080
|
+
function useOpenInteractionType(open) {
|
|
4081
|
+
const [openMethod, setOpenMethod] = React$1.useState(null);
|
|
4082
|
+
const handleTriggerClick = useEventCallback((_, interactionType) => {
|
|
4083
|
+
if (!open) setOpenMethod(interactionType);
|
|
4084
|
+
});
|
|
4085
|
+
const reset = useEventCallback(() => {
|
|
4086
|
+
setOpenMethod(null);
|
|
4087
|
+
});
|
|
4088
|
+
const { onClick, onPointerDown } = useEnhancedClickHandler(handleTriggerClick);
|
|
4089
|
+
return React$1.useMemo(() => ({
|
|
4090
|
+
openMethod,
|
|
4091
|
+
reset,
|
|
4092
|
+
triggerProps: {
|
|
4093
|
+
onClick,
|
|
4094
|
+
onPointerDown
|
|
4095
|
+
}
|
|
4096
|
+
}), [
|
|
4097
|
+
openMethod,
|
|
4098
|
+
reset,
|
|
4099
|
+
onClick,
|
|
4100
|
+
onPointerDown
|
|
4101
|
+
]);
|
|
4102
|
+
}
|
|
4103
|
+
//#endregion
|
|
4104
|
+
export { contains as $, inertValue as A, floor as B, FloatingNode as C, useFloatingTree as D, useFloatingParentNodeId as E, useOpenChangeComplete as F, getSide as G, getAlignmentAxis as H, useLatestRef$1 as I, isVirtualClick as J, getSideAxis as K, COMPOSITE_KEYS as L, popupStateMapping as M, pressableTriggerOpenStateMapping as N, Timeout as O, triggerOpenStateMapping as P, activeElement as Q, clamp as R, createAttribute as S, useFloatingNodeId as T, getAxisLength as U, getAlignment as V, getPaddingObject as W, stopEvent as X, isVirtualPointerEvent as Y, getNodeChildren as Z, useClick as _, useInteractions as a, matchesFocusVisible as at, enqueueFocus as b, useDismiss as c, ARROW_RIGHT$1 as ct, limitShift as d, isSafari as dt, getDocument as et, offset as f, transitionStatusMapping as ft, autoUpdate as g, useFloating as h, useRole as i, isTypeableElement as it, CommonPopupDataAttributes as j, useTimeout as k, flip as l, ARROW_UP$1 as lt, size as m, _defineProperty as mt, useScrollLock as n, getTarget as nt, getEmptyContext as o, ARROW_DOWN$1 as ot, shift as p, useTransitionStatus as pt, isMouseLikePointerType as q, InternalBackdrop as r, isTypeableCombobox as rt, useFloatingRootContext as s, ARROW_LEFT$1 as st, useOpenInteractionType as t, getFloatingFocusElement as tt, hide as u, isMac as ut, FloatingFocusManager as v, FloatingTree as w, ownerDocument as x, FloatingPortal as y, evaluate as z };
|