@arc-ui/components 11.16.0 → 11.17.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/Calendar/Calendar.cjs.js +21 -0
- package/dist/Calendar/Calendar.esm.js +13 -0
- package/dist/Calendar/package.json +7 -0
- package/dist/Checkbox/Checkbox.cjs.js +3 -2
- package/dist/Checkbox/Checkbox.esm.js +3 -2
- package/dist/DatePicker/DatePicker.cjs.js +565 -0
- package/dist/DatePicker/DatePicker.esm.js +552 -0
- package/dist/DatePicker/package.json +7 -0
- package/dist/FormControl/FormControl.cjs.js +2 -1
- package/dist/FormControl/FormControl.esm.js +2 -1
- package/dist/InformationCard/InformationCard.cjs.js +10 -9
- package/dist/InformationCard/InformationCard.esm.js +8 -7
- package/dist/MediaCard/MediaCard.cjs.js +56 -0
- package/dist/MediaCard/MediaCard.esm.js +48 -0
- package/dist/MediaCard/package.json +7 -0
- package/dist/Modal/Modal.cjs.js +13 -286
- package/dist/Modal/Modal.esm.js +6 -279
- package/dist/RadioGroup/RadioGroup.cjs.js +3 -2
- package/dist/RadioGroup/RadioGroup.esm.js +3 -2
- package/dist/Select/Select.cjs.js +31 -2705
- package/dist/Select/Select.esm.js +13 -2668
- package/dist/SiteFooter/SiteFooter.cjs.js +2 -2
- package/dist/SiteFooter/SiteFooter.esm.js +3 -3
- package/dist/SiteHeader/SiteHeader.cjs.js +2 -2
- package/dist/SiteHeader/SiteHeader.esm.js +2 -2
- package/dist/SiteHeaderV2/SiteHeaderV2.cjs.js +23 -0
- package/dist/SiteHeaderV2/SiteHeaderV2.esm.js +15 -0
- package/dist/SiteHeaderV2/package.json +7 -0
- package/dist/Switch/Switch.cjs.js +4 -3
- package/dist/Switch/Switch.esm.js +4 -3
- package/dist/Tabs/Tabs.cjs.js +5 -5
- package/dist/Tabs/Tabs.esm.js +5 -5
- package/dist/TextArea/TextArea.cjs.js +20 -20
- package/dist/TextArea/TextArea.esm.js +20 -20
- package/dist/TextInput/TextInput.cjs.js +3 -2
- package/dist/TextInput/TextInput.esm.js +3 -2
- package/dist/Toast/Toast.cjs.js +6 -7
- package/dist/Toast/Toast.esm.js +6 -7
- package/dist/TypographyCard/TypographyCard.cjs.js +13 -70
- package/dist/TypographyCard/TypographyCard.esm.js +14 -71
- package/dist/_shared/cjs/Calendar-18e255f8.js +4106 -0
- package/dist/_shared/cjs/CardFooter-43c32239.js +80 -0
- package/dist/_shared/cjs/CardLabel-768abf20.js +54 -0
- package/dist/_shared/cjs/{Checkbox-904ad028.js → Checkbox-4d4b432f.js} +1 -1
- package/dist/_shared/cjs/{index-3d69ea00.js → Combination-9974f2e2.js} +662 -145
- package/dist/_shared/cjs/{FormControl-166e0957.js → FormControl-b26ad353.js} +8 -5
- package/dist/_shared/cjs/{RadioGroup-1eddf86f.js → RadioGroup-23c964ae.js} +1 -1
- package/dist/_shared/cjs/{SiteFooter-97c27b29.js → SiteFooter-65b6360c.js} +2 -2
- package/dist/_shared/cjs/{SiteHeader.rehydrator-af3dddef.js → SiteHeader.rehydrator-df053a52.js} +8 -8
- package/dist/_shared/cjs/SiteHeaderV2-8ce6d4fc.js +610 -0
- package/dist/_shared/cjs/{Tabs-cc77dabb.js → Tabs-34db6bc1.js} +4 -4
- package/dist/_shared/cjs/{TextInput-fd9c756f.js → TextInput-d0370fa8.js} +19 -6
- package/dist/_shared/cjs/{Toast-91e96744.js → Toast-392b1d60.js} +292 -34
- package/dist/_shared/cjs/{index-84e6a68f.js → index-6eb396a3.js} +1 -1
- package/dist/_shared/cjs/{index-6542b467.js → index-74004a9c.js} +1 -1
- package/dist/_shared/cjs/index-77ab5c6a.js +2180 -0
- package/dist/_shared/cjs/{index-d31f2b65.js → index-9f99d686.js} +1 -1
- package/dist/_shared/cjs/{index-1641d0b4.js → index-a31e64a9.js} +1 -1
- package/dist/_shared/cjs/{index-49c72a87.js → index-d38f1bd0.js} +1 -1
- package/dist/_shared/esm/Calendar-4033fa48.js +4093 -0
- package/dist/_shared/esm/CardFooter-dd8d4000.js +74 -0
- package/dist/_shared/esm/CardLabel-d6d71407.js +46 -0
- package/dist/_shared/esm/{Checkbox-8a5bb9a1.js → Checkbox-720b074d.js} +1 -1
- package/dist/_shared/esm/{index-3e2bc99d.js → Combination-e9f7e64e.js} +643 -132
- package/dist/_shared/esm/{FormControl-9d4ddfec.js → FormControl-f0b8fe91.js} +8 -5
- package/dist/_shared/esm/{RadioGroup-238db88d.js → RadioGroup-37fdb06b.js} +1 -1
- package/dist/_shared/esm/{SiteFooter-94316b8b.js → SiteFooter-38ee1536.js} +1 -1
- package/dist/_shared/esm/{SiteHeader.rehydrator-1b507253.js → SiteHeader.rehydrator-32bdcd88.js} +2 -2
- package/dist/_shared/esm/SiteHeaderV2-f8377627.js +604 -0
- package/dist/_shared/esm/{Tabs-8719d952.js → Tabs-df9965dd.js} +4 -4
- package/dist/_shared/esm/{TextInput-c1e2a1dd.js → TextInput-abbab56b.js} +19 -6
- package/dist/_shared/esm/{Toast-7cb1e544.js → Toast-5d66e13f.js} +264 -7
- package/dist/_shared/esm/{index-39019a9b.js → index-044da8d0.js} +1 -1
- package/dist/_shared/esm/{index-6b7b075c.js → index-25a5b393.js} +1 -1
- package/dist/_shared/esm/{index-246b4f18.js → index-2cfab9f2.js} +1 -1
- package/dist/_shared/esm/{index-12f3a407.js → index-7b531fa7.js} +68 -68
- package/dist/_shared/esm/index-b84a20c6.js +2155 -0
- package/dist/_shared/esm/{index-db47e95a.js → index-ca72c9d5.js} +1 -1
- package/dist/_shared/esm/{index-936b5179.js → index-efa9be1a.js} +1 -1
- package/dist/_shared/esm/{index.es-c552c0ea.js → use-media-query-4c807227.js} +9 -9
- package/dist/index.es.js +1135 -791
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +1136 -791
- package/dist/index.js.map +1 -1
- package/dist/styles.css +4 -4
- package/dist/types/components/Calendar/Calendar.d.ts +49 -0
- package/dist/types/components/Calendar/Calendar.provider.d.ts +21 -0
- package/dist/types/components/Calendar/components/CalendarDateSelect/CalendarDateSelect.d.ts +15 -0
- package/dist/types/components/Calendar/components/CalendarDateSelect/index.d.ts +1 -0
- package/dist/types/components/Calendar/components/CalendarDayGrid/CalendarDayGrid.d.ts +6 -0
- package/dist/types/components/Calendar/components/CalendarDayGrid/index.d.ts +1 -0
- package/dist/types/components/Calendar/components/CalendarDayNumber/CalendarDayNumber.d.ts +8 -0
- package/dist/types/components/Calendar/components/CalendarDayNumber/index.d.ts +1 -0
- package/dist/types/components/Calendar/components/CalendarDoubleMonthView/CalendarDoubleMonthView.d.ts +9 -0
- package/dist/types/components/Calendar/components/CalendarDoubleMonthView/index.d.ts +1 -0
- package/dist/types/components/Calendar/components/CalendarFooter/CalendarFooter.d.ts +6 -0
- package/dist/types/components/Calendar/components/CalendarFooter/index.d.ts +1 -0
- package/dist/types/components/Calendar/components/CalendarMonthView/CalendarMonthView.d.ts +9 -0
- package/dist/types/components/Calendar/components/CalendarMonthView/index.d.ts +1 -0
- package/dist/types/components/Calendar/components/CalendarMonthYearView/CalendarMonthYearView.d.ts +11 -0
- package/dist/types/components/Calendar/components/CalendarMonthYearView/index.d.ts +1 -0
- package/dist/types/components/Calendar/components/CalendarNavButton/CalendarNavButton.d.ts +10 -0
- package/dist/types/components/Calendar/components/CalendarNavButton/index.d.ts +1 -0
- package/dist/types/components/Calendar/components/CalendarWrapper/CalendarWrapper.d.ts +5 -0
- package/dist/types/components/Calendar/components/CalendarWrapper/index.d.ts +1 -0
- package/dist/types/components/Calendar/components/index.d.ts +6 -0
- package/dist/types/components/Calendar/constants/day-names.d.ts +5 -0
- package/dist/types/components/Calendar/constants/index.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/contains-date.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/contains-date.test.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/date-without-time.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/date-without-time.test.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/get-calendar-type.d.ts +2 -0
- package/dist/types/components/Calendar/helpers/get-calendar-type.test.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/get-dates-in-month.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/get-dates-in-month.test.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/get-double-month-display-range.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/get-double-month-display-range.test.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/get-focus-date.d.ts +5 -0
- package/dist/types/components/Calendar/helpers/get-focus-date.test.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/get-highlighted-range.d.ts +6 -0
- package/dist/types/components/Calendar/helpers/get-highlighted-range.test.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/get-keydown-date.d.ts +6 -0
- package/dist/types/components/Calendar/helpers/get-keydown-date.test.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/index.d.ts +13 -0
- package/dist/types/components/Calendar/helpers/is-day.d.ts +2 -0
- package/dist/types/components/Calendar/helpers/is-day.test.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/is-disabled-date.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/is-disabled-date.test.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/is-month-after-max-date.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/is-month-after-max-date.test.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/is-month-before-min-date.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/is-month-before-min-date.test.d.ts +1 -0
- package/dist/types/components/Calendar/helpers/process-selected-range.d.ts +9 -0
- package/dist/types/components/Calendar/helpers/process-selected-range.test.d.ts +1 -0
- package/dist/types/components/Calendar/index.d.ts +2 -0
- package/dist/types/components/Calendar/state/handlers/calendar-keydown-handler.d.ts +3 -0
- package/dist/types/components/Calendar/state/handlers/day-grid-leave-handler.d.ts +3 -0
- package/dist/types/components/Calendar/state/handlers/day-number-select-handler.d.ts +3 -0
- package/dist/types/components/Calendar/state/handlers/default-handler.d.ts +2 -0
- package/dist/types/components/Calendar/state/handlers/dropdown-change-month-handler.d.ts +3 -0
- package/dist/types/components/Calendar/state/handlers/dropdown-change-year-handler.d.ts +3 -0
- package/dist/types/components/Calendar/state/handlers/highlight-range-handler.d.ts +3 -0
- package/dist/types/components/Calendar/state/handlers/index.d.ts +12 -0
- package/dist/types/components/Calendar/state/handlers/range-select-handler.d.ts +3 -0
- package/dist/types/components/Calendar/state/handlers/show-next-double-month-handler.d.ts +3 -0
- package/dist/types/components/Calendar/state/handlers/show-next-month-handler.d.ts +3 -0
- package/dist/types/components/Calendar/state/handlers/show-previous-double-month-handler.d.ts +3 -0
- package/dist/types/components/Calendar/state/handlers/show-previous-month-handler.d.ts +3 -0
- package/dist/types/components/Calendar/state/index.d.ts +2 -0
- package/dist/types/components/Calendar/state/reducer.d.ts +3 -0
- package/dist/types/components/Calendar/state/reducer.test.d.ts +1 -0
- package/dist/types/components/Calendar/state/types/actions.d.ts +81 -0
- package/dist/types/components/Calendar/state/types/state-handler.d.ts +3 -0
- package/dist/types/components/Calendar/state/types/state.d.ts +5 -0
- package/dist/types/components/Calendar/types/calendar-type.d.ts +1 -0
- package/dist/types/components/Calendar/types/date-select-value.d.ts +2 -0
- package/dist/types/components/Calendar/types/index.d.ts +6 -0
- package/dist/types/components/Calendar/types/key-names.d.ts +13 -0
- package/dist/types/components/Calendar/types/range-selection.d.ts +10 -0
- package/dist/types/components/Calendar/types/selection-type.d.ts +1 -0
- package/dist/types/components/Calendar/types/week-days.d.ts +18 -0
- package/dist/types/components/DatePicker/DatePicker.d.ts +17 -0
- package/dist/types/components/DatePicker/constants/date-format.d.ts +1 -0
- package/dist/types/components/DatePicker/constants/index.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/convert-date-string-to-date.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/convert-date-string-to-date.test.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/convert-range-string-to-dates.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/convert-range-string-to-dates.test.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/format-date.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/format-date.test.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/index.d.ts +8 -0
- package/dist/types/components/DatePicker/helpers/is-date-valid.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/is-date-valid.test.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/is-disabled-date.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/is-disabled-date.test.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/is-range-valid.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/is-range-valid.test.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/parse-date-string.d.ts +5 -0
- package/dist/types/components/DatePicker/helpers/parse-date-string.test.d.ts +1 -0
- package/dist/types/components/DatePicker/helpers/parse-range-string.d.ts +14 -0
- package/dist/types/components/DatePicker/helpers/parse-range-string.test.d.ts +1 -0
- package/dist/types/components/DatePicker/index.d.ts +6 -0
- package/dist/types/components/FormControl/FormControl.d.ts +4 -0
- package/dist/types/components/RadioGroup/RadioGroup.d.ts +1 -1
- package/dist/types/components/SiteHeaderV2/SiteHeaderV2.d.ts +77 -0
- package/dist/types/components/SiteHeaderV2/components/BackButton/BackButton.d.ts +5 -0
- package/dist/types/components/SiteHeaderV2/components/BackButton/index.d.ts +1 -0
- package/dist/types/components/SiteHeaderV2/components/Column/Column.d.ts +8 -0
- package/dist/types/components/SiteHeaderV2/components/Column/index.d.ts +1 -0
- package/dist/types/components/SiteHeaderV2/components/HorizontalPanel/HorizontalPanel.d.ts +13 -0
- package/dist/types/components/SiteHeaderV2/components/HorizontalPanel/index.d.ts +1 -0
- package/dist/types/components/SiteHeaderV2/components/Item/Item.d.ts +20 -0
- package/dist/types/components/SiteHeaderV2/components/Item/index.d.ts +1 -0
- package/dist/types/components/SiteHeaderV2/components/ItemGroup/ItemGroup.d.ts +27 -0
- package/dist/types/components/SiteHeaderV2/components/ItemGroup/index.d.ts +1 -0
- package/dist/types/components/SiteHeaderV2/components/MenuButton/MenuButton.d.ts +6 -0
- package/dist/types/components/SiteHeaderV2/components/MenuButton/index.d.ts +1 -0
- package/dist/types/components/SiteHeaderV2/components/NavItem/NavItem.d.ts +40 -0
- package/dist/types/components/SiteHeaderV2/components/NavItem/NavItemWithSubNav.d.ts +55 -0
- package/dist/types/components/SiteHeaderV2/components/NavItem/index.d.ts +2 -0
- package/dist/types/components/SiteHeaderV2/components/NodeItem/NodeItem.d.ts +8 -0
- package/dist/types/components/SiteHeaderV2/components/Panel/Panel.d.ts +26 -0
- package/dist/types/components/SiteHeaderV2/components/Panel/index.d.ts +1 -0
- package/dist/types/components/SiteHeaderV2/components/SubNavItem/SubNavItem.d.ts +45 -0
- package/dist/types/components/SiteHeaderV2/components/SubNavItem/index.d.ts +1 -0
- package/dist/types/components/SiteHeaderV2/components/VerticalDivider/VerticalDivider.d.ts +1 -0
- package/dist/types/components/SiteHeaderV2/components/VerticalDivider/index.d.ts +1 -0
- package/dist/types/components/SiteHeaderV2/index.d.ts +1 -0
- package/dist/types/components/TextArea/TextArea.d.ts +4 -0
- package/dist/types/components/TextInput/TextInput.d.ts +22 -3
- package/dist/types/components/index.d.ts +1 -0
- package/dist/types/private-components/CardFooter/CardFooter.d.ts +11 -0
- package/dist/types/private-components/CardFooter/index.d.ts +1 -0
- package/dist/types/private-components/CardHeading/CardHeading.d.ts +19 -0
- package/dist/types/private-components/CardHeading/index.d.ts +1 -0
- package/dist/types/private-components/CardLabel/CardLabel.d.ts +10 -0
- package/dist/types/private-components/CardLabel/index.d.ts +1 -0
- package/dist/types/private-components/index.d.ts +4 -0
- package/dist/types/styles.d.ts +6 -0
- package/package.json +4 -2
- package/dist/_shared/cjs/BtIconArrowRight.esm-8e8ac316.js +0 -30
- package/dist/_shared/cjs/index-4ecad2dd.js +0 -273
- package/dist/_shared/esm/BtIconArrowRight.esm-267916a4.js +0 -24
- package/dist/_shared/esm/index-d0307140.js +0 -264
- package/dist/types/internal-components/index.d.ts +0 -1
- package/dist/_shared/cjs/{index-56a040f4.js → index-dd1d18ea.js} +66 -66
- package/dist/_shared/cjs/{index.es-26dd8c5d.js → use-media-query-e61881d8.js} +8 -8
- /package/dist/types/{internal-components → private-components}/ConditionalWrapper/ConditionalWrapper.d.ts +0 -0
- /package/dist/types/{internal-components → private-components}/ConditionalWrapper/index.d.ts +0 -0
|
@@ -3,2712 +3,38 @@
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
5
|
var filterDataAttrs = require('../_shared/cjs/filter-data-attrs-1c9a530c.js');
|
|
6
|
-
var index$
|
|
6
|
+
var index$6 = require('../_shared/cjs/index-9947ac13.js');
|
|
7
7
|
var React = require('react');
|
|
8
8
|
var _extends = require('../_shared/cjs/extends-8c5e4b48.js');
|
|
9
9
|
var $7SXl2$reactdom = require('react-dom');
|
|
10
|
-
var index$1 = require('../_shared/cjs/index-
|
|
11
|
-
var index
|
|
12
|
-
var index$
|
|
13
|
-
var
|
|
14
|
-
var index$
|
|
15
|
-
var index$
|
|
16
|
-
var index$
|
|
10
|
+
var index$1 = require('../_shared/cjs/index-dd1d18ea.js');
|
|
11
|
+
var index = require('../_shared/cjs/index-9f99d686.js');
|
|
12
|
+
var index$3 = require('../_shared/cjs/index-dcfdd5da.js');
|
|
13
|
+
var Combination = require('../_shared/cjs/Combination-9974f2e2.js');
|
|
14
|
+
var index$4 = require('../_shared/cjs/index-6eb396a3.js');
|
|
15
|
+
var index$2 = require('../_shared/cjs/index-77ab5c6a.js');
|
|
16
|
+
var index$5 = require('../_shared/cjs/index-a31e64a9.js');
|
|
17
17
|
var BtIconChevronDown2Px_esm = require('../_shared/cjs/BtIconChevronDown2Px.esm-39030ee0.js');
|
|
18
18
|
var BtIconTickAlt2Px_esm = require('../_shared/cjs/BtIconTickAlt2Px.esm-57c89acc.js');
|
|
19
19
|
var Icon = require('../_shared/cjs/Icon-a9801f05.js');
|
|
20
|
-
var FormControl = require('../_shared/cjs/FormControl-
|
|
20
|
+
var FormControl = require('../_shared/cjs/FormControl-b26ad353.js');
|
|
21
21
|
var Surface = require('../_shared/cjs/Surface-038db6e1.js');
|
|
22
22
|
var Base = require('../_shared/cjs/Base-f5a86eed.js');
|
|
23
|
+
require('../_shared/cjs/index-74004a9c.js');
|
|
23
24
|
require('../_shared/cjs/suffix-modifier-64dcd338.js');
|
|
24
25
|
require('../_shared/cjs/BtIconAlert.esm-1a0ff9f0.js');
|
|
25
26
|
require('../_shared/cjs/DisclosureMini-d0eeb6bb.js');
|
|
26
27
|
require('../_shared/cjs/Text-606ca3a2.js');
|
|
28
|
+
require('../_shared/cjs/VisuallyHidden-e2c8b291.js');
|
|
27
29
|
|
|
28
30
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
29
31
|
|
|
30
|
-
function _interopNamespace(e) {
|
|
31
|
-
if (e && e.__esModule) return e;
|
|
32
|
-
var n = Object.create(null);
|
|
33
|
-
if (e) {
|
|
34
|
-
Object.keys(e).forEach(function (k) {
|
|
35
|
-
if (k !== 'default') {
|
|
36
|
-
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
37
|
-
Object.defineProperty(n, k, d.get ? d : {
|
|
38
|
-
enumerable: true,
|
|
39
|
-
get: function () { return e[k]; }
|
|
40
|
-
});
|
|
41
|
-
}
|
|
42
|
-
});
|
|
43
|
-
}
|
|
44
|
-
n["default"] = e;
|
|
45
|
-
return Object.freeze(n);
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
var React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
49
32
|
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
|
|
50
|
-
var $7SXl2$reactdom__namespace = /*#__PURE__*/_interopNamespace($7SXl2$reactdom);
|
|
51
|
-
var $7SXl2$reactdom__default = /*#__PURE__*/_interopDefaultLegacy($7SXl2$reactdom);
|
|
52
33
|
|
|
53
34
|
function $ae6933e535247d3d$export$7d15b64cf5a3a4c4(value, [min, max]) {
|
|
54
35
|
return Math.min(max, Math.max(min, value));
|
|
55
36
|
}
|
|
56
37
|
|
|
57
|
-
const $5cb92bef7577960e$var$CONTEXT_UPDATE = 'dismissableLayer.update';
|
|
58
|
-
const $5cb92bef7577960e$var$POINTER_DOWN_OUTSIDE = 'dismissableLayer.pointerDownOutside';
|
|
59
|
-
const $5cb92bef7577960e$var$FOCUS_OUTSIDE = 'dismissableLayer.focusOutside';
|
|
60
|
-
let $5cb92bef7577960e$var$originalBodyPointerEvents;
|
|
61
|
-
const $5cb92bef7577960e$var$DismissableLayerContext = /*#__PURE__*/ React.createContext({
|
|
62
|
-
layers: new Set(),
|
|
63
|
-
layersWithOutsidePointerEventsDisabled: new Set(),
|
|
64
|
-
branches: new Set()
|
|
65
|
-
});
|
|
66
|
-
const $5cb92bef7577960e$export$177fb62ff3ec1f22 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
|
|
67
|
-
var _node$ownerDocument;
|
|
68
|
-
const { disableOutsidePointerEvents: disableOutsidePointerEvents = false , onEscapeKeyDown: onEscapeKeyDown , onPointerDownOutside: onPointerDownOutside , onFocusOutside: onFocusOutside , onInteractOutside: onInteractOutside , onDismiss: onDismiss , ...layerProps } = props;
|
|
69
|
-
const context = React.useContext($5cb92bef7577960e$var$DismissableLayerContext);
|
|
70
|
-
const [node1, setNode] = React.useState(null);
|
|
71
|
-
const ownerDocument = (_node$ownerDocument = node1 === null || node1 === void 0 ? void 0 : node1.ownerDocument) !== null && _node$ownerDocument !== void 0 ? _node$ownerDocument : globalThis === null || globalThis === void 0 ? void 0 : globalThis.document;
|
|
72
|
-
const [, force] = React.useState({});
|
|
73
|
-
const composedRefs = index$1.$6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setNode(node)
|
|
74
|
-
);
|
|
75
|
-
const layers = Array.from(context.layers);
|
|
76
|
-
const [highestLayerWithOutsidePointerEventsDisabled] = [
|
|
77
|
-
...context.layersWithOutsidePointerEventsDisabled
|
|
78
|
-
].slice(-1); // prettier-ignore
|
|
79
|
-
const highestLayerWithOutsidePointerEventsDisabledIndex = layers.indexOf(highestLayerWithOutsidePointerEventsDisabled); // prettier-ignore
|
|
80
|
-
const index = node1 ? layers.indexOf(node1) : -1;
|
|
81
|
-
const isBodyPointerEventsDisabled = context.layersWithOutsidePointerEventsDisabled.size > 0;
|
|
82
|
-
const isPointerEventsEnabled = index >= highestLayerWithOutsidePointerEventsDisabledIndex;
|
|
83
|
-
const pointerDownOutside = $5cb92bef7577960e$var$usePointerDownOutside((event)=>{
|
|
84
|
-
const target = event.target;
|
|
85
|
-
const isPointerDownOnBranch = [
|
|
86
|
-
...context.branches
|
|
87
|
-
].some((branch)=>branch.contains(target)
|
|
88
|
-
);
|
|
89
|
-
if (!isPointerEventsEnabled || isPointerDownOnBranch) return;
|
|
90
|
-
onPointerDownOutside === null || onPointerDownOutside === void 0 || onPointerDownOutside(event);
|
|
91
|
-
onInteractOutside === null || onInteractOutside === void 0 || onInteractOutside(event);
|
|
92
|
-
if (!event.defaultPrevented) onDismiss === null || onDismiss === void 0 || onDismiss();
|
|
93
|
-
}, ownerDocument);
|
|
94
|
-
const focusOutside = $5cb92bef7577960e$var$useFocusOutside((event)=>{
|
|
95
|
-
const target = event.target;
|
|
96
|
-
const isFocusInBranch = [
|
|
97
|
-
...context.branches
|
|
98
|
-
].some((branch)=>branch.contains(target)
|
|
99
|
-
);
|
|
100
|
-
if (isFocusInBranch) return;
|
|
101
|
-
onFocusOutside === null || onFocusOutside === void 0 || onFocusOutside(event);
|
|
102
|
-
onInteractOutside === null || onInteractOutside === void 0 || onInteractOutside(event);
|
|
103
|
-
if (!event.defaultPrevented) onDismiss === null || onDismiss === void 0 || onDismiss();
|
|
104
|
-
}, ownerDocument);
|
|
105
|
-
index$2.$addc16e1bbe58fd0$export$3a72a57244d6e765((event)=>{
|
|
106
|
-
const isHighestLayer = index === context.layers.size - 1;
|
|
107
|
-
if (!isHighestLayer) return;
|
|
108
|
-
onEscapeKeyDown === null || onEscapeKeyDown === void 0 || onEscapeKeyDown(event);
|
|
109
|
-
if (!event.defaultPrevented && onDismiss) {
|
|
110
|
-
event.preventDefault();
|
|
111
|
-
onDismiss();
|
|
112
|
-
}
|
|
113
|
-
}, ownerDocument);
|
|
114
|
-
React.useEffect(()=>{
|
|
115
|
-
if (!node1) return;
|
|
116
|
-
if (disableOutsidePointerEvents) {
|
|
117
|
-
if (context.layersWithOutsidePointerEventsDisabled.size === 0) {
|
|
118
|
-
$5cb92bef7577960e$var$originalBodyPointerEvents = ownerDocument.body.style.pointerEvents;
|
|
119
|
-
ownerDocument.body.style.pointerEvents = 'none';
|
|
120
|
-
}
|
|
121
|
-
context.layersWithOutsidePointerEventsDisabled.add(node1);
|
|
122
|
-
}
|
|
123
|
-
context.layers.add(node1);
|
|
124
|
-
$5cb92bef7577960e$var$dispatchUpdate();
|
|
125
|
-
return ()=>{
|
|
126
|
-
if (disableOutsidePointerEvents && context.layersWithOutsidePointerEventsDisabled.size === 1) ownerDocument.body.style.pointerEvents = $5cb92bef7577960e$var$originalBodyPointerEvents;
|
|
127
|
-
};
|
|
128
|
-
}, [
|
|
129
|
-
node1,
|
|
130
|
-
ownerDocument,
|
|
131
|
-
disableOutsidePointerEvents,
|
|
132
|
-
context
|
|
133
|
-
]);
|
|
134
|
-
/**
|
|
135
|
-
* We purposefully prevent combining this effect with the `disableOutsidePointerEvents` effect
|
|
136
|
-
* because a change to `disableOutsidePointerEvents` would remove this layer from the stack
|
|
137
|
-
* and add it to the end again so the layering order wouldn't be _creation order_.
|
|
138
|
-
* We only want them to be removed from context stacks when unmounted.
|
|
139
|
-
*/ React.useEffect(()=>{
|
|
140
|
-
return ()=>{
|
|
141
|
-
if (!node1) return;
|
|
142
|
-
context.layers.delete(node1);
|
|
143
|
-
context.layersWithOutsidePointerEventsDisabled.delete(node1);
|
|
144
|
-
$5cb92bef7577960e$var$dispatchUpdate();
|
|
145
|
-
};
|
|
146
|
-
}, [
|
|
147
|
-
node1,
|
|
148
|
-
context
|
|
149
|
-
]);
|
|
150
|
-
React.useEffect(()=>{
|
|
151
|
-
const handleUpdate = ()=>force({})
|
|
152
|
-
;
|
|
153
|
-
document.addEventListener($5cb92bef7577960e$var$CONTEXT_UPDATE, handleUpdate);
|
|
154
|
-
return ()=>document.removeEventListener($5cb92bef7577960e$var$CONTEXT_UPDATE, handleUpdate)
|
|
155
|
-
;
|
|
156
|
-
}, []);
|
|
157
|
-
return /*#__PURE__*/ React.createElement(index$1.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({}, layerProps, {
|
|
158
|
-
ref: composedRefs,
|
|
159
|
-
style: {
|
|
160
|
-
pointerEvents: isBodyPointerEventsDisabled ? isPointerEventsEnabled ? 'auto' : 'none' : undefined,
|
|
161
|
-
...props.style
|
|
162
|
-
},
|
|
163
|
-
onFocusCapture: index$1.$e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onFocusCapture, focusOutside.onFocusCapture),
|
|
164
|
-
onBlurCapture: index$1.$e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onBlurCapture, focusOutside.onBlurCapture),
|
|
165
|
-
onPointerDownCapture: index$1.$e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerDownCapture, pointerDownOutside.onPointerDownCapture)
|
|
166
|
-
}));
|
|
167
|
-
});
|
|
168
|
-
/* -----------------------------------------------------------------------------------------------*/ /**
|
|
169
|
-
* Listens for `pointerdown` outside a react subtree. We use `pointerdown` rather than `pointerup`
|
|
170
|
-
* to mimic layer dismissing behaviour present in OS.
|
|
171
|
-
* Returns props to pass to the node we want to check for outside events.
|
|
172
|
-
*/ function $5cb92bef7577960e$var$usePointerDownOutside(onPointerDownOutside, ownerDocument = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) {
|
|
173
|
-
const handlePointerDownOutside = index$1.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onPointerDownOutside);
|
|
174
|
-
const isPointerInsideReactTreeRef = React.useRef(false);
|
|
175
|
-
const handleClickRef = React.useRef(()=>{});
|
|
176
|
-
React.useEffect(()=>{
|
|
177
|
-
const handlePointerDown = (event)=>{
|
|
178
|
-
if (event.target && !isPointerInsideReactTreeRef.current) {
|
|
179
|
-
const eventDetail = {
|
|
180
|
-
originalEvent: event
|
|
181
|
-
};
|
|
182
|
-
function handleAndDispatchPointerDownOutsideEvent() {
|
|
183
|
-
$5cb92bef7577960e$var$handleAndDispatchCustomEvent($5cb92bef7577960e$var$POINTER_DOWN_OUTSIDE, handlePointerDownOutside, eventDetail, {
|
|
184
|
-
discrete: true
|
|
185
|
-
});
|
|
186
|
-
}
|
|
187
|
-
/**
|
|
188
|
-
* On touch devices, we need to wait for a click event because browsers implement
|
|
189
|
-
* a ~350ms delay between the time the user stops touching the display and when the
|
|
190
|
-
* browser executres events. We need to ensure we don't reactivate pointer-events within
|
|
191
|
-
* this timeframe otherwise the browser may execute events that should have been prevented.
|
|
192
|
-
*
|
|
193
|
-
* Additionally, this also lets us deal automatically with cancellations when a click event
|
|
194
|
-
* isn't raised because the page was considered scrolled/drag-scrolled, long-pressed, etc.
|
|
195
|
-
*
|
|
196
|
-
* This is why we also continuously remove the previous listener, because we cannot be
|
|
197
|
-
* certain that it was raised, and therefore cleaned-up.
|
|
198
|
-
*/ if (event.pointerType === 'touch') {
|
|
199
|
-
ownerDocument.removeEventListener('click', handleClickRef.current);
|
|
200
|
-
handleClickRef.current = handleAndDispatchPointerDownOutsideEvent;
|
|
201
|
-
ownerDocument.addEventListener('click', handleClickRef.current, {
|
|
202
|
-
once: true
|
|
203
|
-
});
|
|
204
|
-
} else handleAndDispatchPointerDownOutsideEvent();
|
|
205
|
-
} else // We need to remove the event listener in case the outside click has been canceled.
|
|
206
|
-
// See: https://github.com/radix-ui/primitives/issues/2171
|
|
207
|
-
ownerDocument.removeEventListener('click', handleClickRef.current);
|
|
208
|
-
isPointerInsideReactTreeRef.current = false;
|
|
209
|
-
};
|
|
210
|
-
/**
|
|
211
|
-
* if this hook executes in a component that mounts via a `pointerdown` event, the event
|
|
212
|
-
* would bubble up to the document and trigger a `pointerDownOutside` event. We avoid
|
|
213
|
-
* this by delaying the event listener registration on the document.
|
|
214
|
-
* This is not React specific, but rather how the DOM works, ie:
|
|
215
|
-
* ```
|
|
216
|
-
* button.addEventListener('pointerdown', () => {
|
|
217
|
-
* console.log('I will log');
|
|
218
|
-
* document.addEventListener('pointerdown', () => {
|
|
219
|
-
* console.log('I will also log');
|
|
220
|
-
* })
|
|
221
|
-
* });
|
|
222
|
-
*/ const timerId = window.setTimeout(()=>{
|
|
223
|
-
ownerDocument.addEventListener('pointerdown', handlePointerDown);
|
|
224
|
-
}, 0);
|
|
225
|
-
return ()=>{
|
|
226
|
-
window.clearTimeout(timerId);
|
|
227
|
-
ownerDocument.removeEventListener('pointerdown', handlePointerDown);
|
|
228
|
-
ownerDocument.removeEventListener('click', handleClickRef.current);
|
|
229
|
-
};
|
|
230
|
-
}, [
|
|
231
|
-
ownerDocument,
|
|
232
|
-
handlePointerDownOutside
|
|
233
|
-
]);
|
|
234
|
-
return {
|
|
235
|
-
// ensures we check React component tree (not just DOM tree)
|
|
236
|
-
onPointerDownCapture: ()=>isPointerInsideReactTreeRef.current = true
|
|
237
|
-
};
|
|
238
|
-
}
|
|
239
|
-
/**
|
|
240
|
-
* Listens for when focus happens outside a react subtree.
|
|
241
|
-
* Returns props to pass to the root (node) of the subtree we want to check.
|
|
242
|
-
*/ function $5cb92bef7577960e$var$useFocusOutside(onFocusOutside, ownerDocument = globalThis === null || globalThis === void 0 ? void 0 : globalThis.document) {
|
|
243
|
-
const handleFocusOutside = index$1.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onFocusOutside);
|
|
244
|
-
const isFocusInsideReactTreeRef = React.useRef(false);
|
|
245
|
-
React.useEffect(()=>{
|
|
246
|
-
const handleFocus = (event)=>{
|
|
247
|
-
if (event.target && !isFocusInsideReactTreeRef.current) {
|
|
248
|
-
const eventDetail = {
|
|
249
|
-
originalEvent: event
|
|
250
|
-
};
|
|
251
|
-
$5cb92bef7577960e$var$handleAndDispatchCustomEvent($5cb92bef7577960e$var$FOCUS_OUTSIDE, handleFocusOutside, eventDetail, {
|
|
252
|
-
discrete: false
|
|
253
|
-
});
|
|
254
|
-
}
|
|
255
|
-
};
|
|
256
|
-
ownerDocument.addEventListener('focusin', handleFocus);
|
|
257
|
-
return ()=>ownerDocument.removeEventListener('focusin', handleFocus)
|
|
258
|
-
;
|
|
259
|
-
}, [
|
|
260
|
-
ownerDocument,
|
|
261
|
-
handleFocusOutside
|
|
262
|
-
]);
|
|
263
|
-
return {
|
|
264
|
-
onFocusCapture: ()=>isFocusInsideReactTreeRef.current = true
|
|
265
|
-
,
|
|
266
|
-
onBlurCapture: ()=>isFocusInsideReactTreeRef.current = false
|
|
267
|
-
};
|
|
268
|
-
}
|
|
269
|
-
function $5cb92bef7577960e$var$dispatchUpdate() {
|
|
270
|
-
const event = new CustomEvent($5cb92bef7577960e$var$CONTEXT_UPDATE);
|
|
271
|
-
document.dispatchEvent(event);
|
|
272
|
-
}
|
|
273
|
-
function $5cb92bef7577960e$var$handleAndDispatchCustomEvent(name, handler, detail, { discrete: discrete }) {
|
|
274
|
-
const target = detail.originalEvent.target;
|
|
275
|
-
const event = new CustomEvent(name, {
|
|
276
|
-
bubbles: false,
|
|
277
|
-
cancelable: true,
|
|
278
|
-
detail: detail
|
|
279
|
-
});
|
|
280
|
-
if (handler) target.addEventListener(name, handler, {
|
|
281
|
-
once: true
|
|
282
|
-
});
|
|
283
|
-
if (discrete) index$1.$8927f6f2acc4f386$export$6d1a0317bde7de7f(target, event);
|
|
284
|
-
else target.dispatchEvent(event);
|
|
285
|
-
}
|
|
286
|
-
|
|
287
|
-
const $d3863c46a17e8a28$var$AUTOFOCUS_ON_MOUNT = 'focusScope.autoFocusOnMount';
|
|
288
|
-
const $d3863c46a17e8a28$var$AUTOFOCUS_ON_UNMOUNT = 'focusScope.autoFocusOnUnmount';
|
|
289
|
-
const $d3863c46a17e8a28$var$EVENT_OPTIONS = {
|
|
290
|
-
bubbles: false,
|
|
291
|
-
cancelable: true
|
|
292
|
-
};
|
|
293
|
-
const $d3863c46a17e8a28$export$20e40289641fbbb6 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
|
|
294
|
-
const { loop: loop = false , trapped: trapped = false , onMountAutoFocus: onMountAutoFocusProp , onUnmountAutoFocus: onUnmountAutoFocusProp , ...scopeProps } = props;
|
|
295
|
-
const [container1, setContainer] = React.useState(null);
|
|
296
|
-
const onMountAutoFocus = index$1.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onMountAutoFocusProp);
|
|
297
|
-
const onUnmountAutoFocus = index$1.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onUnmountAutoFocusProp);
|
|
298
|
-
const lastFocusedElementRef = React.useRef(null);
|
|
299
|
-
const composedRefs = index$1.$6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setContainer(node)
|
|
300
|
-
);
|
|
301
|
-
const focusScope = React.useRef({
|
|
302
|
-
paused: false,
|
|
303
|
-
pause () {
|
|
304
|
-
this.paused = true;
|
|
305
|
-
},
|
|
306
|
-
resume () {
|
|
307
|
-
this.paused = false;
|
|
308
|
-
}
|
|
309
|
-
}).current; // Takes care of trapping focus if focus is moved outside programmatically for example
|
|
310
|
-
React.useEffect(()=>{
|
|
311
|
-
if (trapped) {
|
|
312
|
-
function handleFocusIn(event) {
|
|
313
|
-
if (focusScope.paused || !container1) return;
|
|
314
|
-
const target = event.target;
|
|
315
|
-
if (container1.contains(target)) lastFocusedElementRef.current = target;
|
|
316
|
-
else $d3863c46a17e8a28$var$focus(lastFocusedElementRef.current, {
|
|
317
|
-
select: true
|
|
318
|
-
});
|
|
319
|
-
}
|
|
320
|
-
function handleFocusOut(event) {
|
|
321
|
-
if (focusScope.paused || !container1) return;
|
|
322
|
-
const relatedTarget = event.relatedTarget; // A `focusout` event with a `null` `relatedTarget` will happen in at least two cases:
|
|
323
|
-
//
|
|
324
|
-
// 1. When the user switches app/tabs/windows/the browser itself loses focus.
|
|
325
|
-
// 2. In Google Chrome, when the focused element is removed from the DOM.
|
|
326
|
-
//
|
|
327
|
-
// We let the browser do its thing here because:
|
|
328
|
-
//
|
|
329
|
-
// 1. The browser already keeps a memory of what's focused for when the page gets refocused.
|
|
330
|
-
// 2. In Google Chrome, if we try to focus the deleted focused element (as per below), it
|
|
331
|
-
// throws the CPU to 100%, so we avoid doing anything for this reason here too.
|
|
332
|
-
if (relatedTarget === null) return; // If the focus has moved to an actual legitimate element (`relatedTarget !== null`)
|
|
333
|
-
// that is outside the container, we move focus to the last valid focused element inside.
|
|
334
|
-
if (!container1.contains(relatedTarget)) $d3863c46a17e8a28$var$focus(lastFocusedElementRef.current, {
|
|
335
|
-
select: true
|
|
336
|
-
});
|
|
337
|
-
} // When the focused element gets removed from the DOM, browsers move focus
|
|
338
|
-
// back to the document.body. In this case, we move focus to the container
|
|
339
|
-
// to keep focus trapped correctly.
|
|
340
|
-
function handleMutations(mutations) {
|
|
341
|
-
const focusedElement = document.activeElement;
|
|
342
|
-
if (focusedElement !== document.body) return;
|
|
343
|
-
for (const mutation of mutations)if (mutation.removedNodes.length > 0) $d3863c46a17e8a28$var$focus(container1);
|
|
344
|
-
}
|
|
345
|
-
document.addEventListener('focusin', handleFocusIn);
|
|
346
|
-
document.addEventListener('focusout', handleFocusOut);
|
|
347
|
-
const mutationObserver = new MutationObserver(handleMutations);
|
|
348
|
-
if (container1) mutationObserver.observe(container1, {
|
|
349
|
-
childList: true,
|
|
350
|
-
subtree: true
|
|
351
|
-
});
|
|
352
|
-
return ()=>{
|
|
353
|
-
document.removeEventListener('focusin', handleFocusIn);
|
|
354
|
-
document.removeEventListener('focusout', handleFocusOut);
|
|
355
|
-
mutationObserver.disconnect();
|
|
356
|
-
};
|
|
357
|
-
}
|
|
358
|
-
}, [
|
|
359
|
-
trapped,
|
|
360
|
-
container1,
|
|
361
|
-
focusScope.paused
|
|
362
|
-
]);
|
|
363
|
-
React.useEffect(()=>{
|
|
364
|
-
if (container1) {
|
|
365
|
-
$d3863c46a17e8a28$var$focusScopesStack.add(focusScope);
|
|
366
|
-
const previouslyFocusedElement = document.activeElement;
|
|
367
|
-
const hasFocusedCandidate = container1.contains(previouslyFocusedElement);
|
|
368
|
-
if (!hasFocusedCandidate) {
|
|
369
|
-
const mountEvent = new CustomEvent($d3863c46a17e8a28$var$AUTOFOCUS_ON_MOUNT, $d3863c46a17e8a28$var$EVENT_OPTIONS);
|
|
370
|
-
container1.addEventListener($d3863c46a17e8a28$var$AUTOFOCUS_ON_MOUNT, onMountAutoFocus);
|
|
371
|
-
container1.dispatchEvent(mountEvent);
|
|
372
|
-
if (!mountEvent.defaultPrevented) {
|
|
373
|
-
$d3863c46a17e8a28$var$focusFirst($d3863c46a17e8a28$var$removeLinks($d3863c46a17e8a28$var$getTabbableCandidates(container1)), {
|
|
374
|
-
select: true
|
|
375
|
-
});
|
|
376
|
-
if (document.activeElement === previouslyFocusedElement) $d3863c46a17e8a28$var$focus(container1);
|
|
377
|
-
}
|
|
378
|
-
}
|
|
379
|
-
return ()=>{
|
|
380
|
-
container1.removeEventListener($d3863c46a17e8a28$var$AUTOFOCUS_ON_MOUNT, onMountAutoFocus); // We hit a react bug (fixed in v17) with focusing in unmount.
|
|
381
|
-
// We need to delay the focus a little to get around it for now.
|
|
382
|
-
// See: https://github.com/facebook/react/issues/17894
|
|
383
|
-
setTimeout(()=>{
|
|
384
|
-
const unmountEvent = new CustomEvent($d3863c46a17e8a28$var$AUTOFOCUS_ON_UNMOUNT, $d3863c46a17e8a28$var$EVENT_OPTIONS);
|
|
385
|
-
container1.addEventListener($d3863c46a17e8a28$var$AUTOFOCUS_ON_UNMOUNT, onUnmountAutoFocus);
|
|
386
|
-
container1.dispatchEvent(unmountEvent);
|
|
387
|
-
if (!unmountEvent.defaultPrevented) $d3863c46a17e8a28$var$focus(previouslyFocusedElement !== null && previouslyFocusedElement !== void 0 ? previouslyFocusedElement : document.body, {
|
|
388
|
-
select: true
|
|
389
|
-
});
|
|
390
|
-
// we need to remove the listener after we `dispatchEvent`
|
|
391
|
-
container1.removeEventListener($d3863c46a17e8a28$var$AUTOFOCUS_ON_UNMOUNT, onUnmountAutoFocus);
|
|
392
|
-
$d3863c46a17e8a28$var$focusScopesStack.remove(focusScope);
|
|
393
|
-
}, 0);
|
|
394
|
-
};
|
|
395
|
-
}
|
|
396
|
-
}, [
|
|
397
|
-
container1,
|
|
398
|
-
onMountAutoFocus,
|
|
399
|
-
onUnmountAutoFocus,
|
|
400
|
-
focusScope
|
|
401
|
-
]); // Takes care of looping focus (when tabbing whilst at the edges)
|
|
402
|
-
const handleKeyDown = React.useCallback((event)=>{
|
|
403
|
-
if (!loop && !trapped) return;
|
|
404
|
-
if (focusScope.paused) return;
|
|
405
|
-
const isTabKey = event.key === 'Tab' && !event.altKey && !event.ctrlKey && !event.metaKey;
|
|
406
|
-
const focusedElement = document.activeElement;
|
|
407
|
-
if (isTabKey && focusedElement) {
|
|
408
|
-
const container = event.currentTarget;
|
|
409
|
-
const [first, last] = $d3863c46a17e8a28$var$getTabbableEdges(container);
|
|
410
|
-
const hasTabbableElementsInside = first && last; // we can only wrap focus if we have tabbable edges
|
|
411
|
-
if (!hasTabbableElementsInside) {
|
|
412
|
-
if (focusedElement === container) event.preventDefault();
|
|
413
|
-
} else {
|
|
414
|
-
if (!event.shiftKey && focusedElement === last) {
|
|
415
|
-
event.preventDefault();
|
|
416
|
-
if (loop) $d3863c46a17e8a28$var$focus(first, {
|
|
417
|
-
select: true
|
|
418
|
-
});
|
|
419
|
-
} else if (event.shiftKey && focusedElement === first) {
|
|
420
|
-
event.preventDefault();
|
|
421
|
-
if (loop) $d3863c46a17e8a28$var$focus(last, {
|
|
422
|
-
select: true
|
|
423
|
-
});
|
|
424
|
-
}
|
|
425
|
-
}
|
|
426
|
-
}
|
|
427
|
-
}, [
|
|
428
|
-
loop,
|
|
429
|
-
trapped,
|
|
430
|
-
focusScope.paused
|
|
431
|
-
]);
|
|
432
|
-
return /*#__PURE__*/ React.createElement(index$1.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({
|
|
433
|
-
tabIndex: -1
|
|
434
|
-
}, scopeProps, {
|
|
435
|
-
ref: composedRefs,
|
|
436
|
-
onKeyDown: handleKeyDown
|
|
437
|
-
}));
|
|
438
|
-
});
|
|
439
|
-
/* -------------------------------------------------------------------------------------------------
|
|
440
|
-
* Utils
|
|
441
|
-
* -----------------------------------------------------------------------------------------------*/ /**
|
|
442
|
-
* Attempts focusing the first element in a list of candidates.
|
|
443
|
-
* Stops when focus has actually moved.
|
|
444
|
-
*/ function $d3863c46a17e8a28$var$focusFirst(candidates, { select: select = false } = {}) {
|
|
445
|
-
const previouslyFocusedElement = document.activeElement;
|
|
446
|
-
for (const candidate of candidates){
|
|
447
|
-
$d3863c46a17e8a28$var$focus(candidate, {
|
|
448
|
-
select: select
|
|
449
|
-
});
|
|
450
|
-
if (document.activeElement !== previouslyFocusedElement) return;
|
|
451
|
-
}
|
|
452
|
-
}
|
|
453
|
-
/**
|
|
454
|
-
* Returns the first and last tabbable elements inside a container.
|
|
455
|
-
*/ function $d3863c46a17e8a28$var$getTabbableEdges(container) {
|
|
456
|
-
const candidates = $d3863c46a17e8a28$var$getTabbableCandidates(container);
|
|
457
|
-
const first = $d3863c46a17e8a28$var$findVisible(candidates, container);
|
|
458
|
-
const last = $d3863c46a17e8a28$var$findVisible(candidates.reverse(), container);
|
|
459
|
-
return [
|
|
460
|
-
first,
|
|
461
|
-
last
|
|
462
|
-
];
|
|
463
|
-
}
|
|
464
|
-
/**
|
|
465
|
-
* Returns a list of potential tabbable candidates.
|
|
466
|
-
*
|
|
467
|
-
* NOTE: This is only a close approximation. For example it doesn't take into account cases like when
|
|
468
|
-
* elements are not visible. This cannot be worked out easily by just reading a property, but rather
|
|
469
|
-
* necessitate runtime knowledge (computed styles, etc). We deal with these cases separately.
|
|
470
|
-
*
|
|
471
|
-
* See: https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker
|
|
472
|
-
* Credit: https://github.com/discord/focus-layers/blob/master/src/util/wrapFocus.tsx#L1
|
|
473
|
-
*/ function $d3863c46a17e8a28$var$getTabbableCandidates(container) {
|
|
474
|
-
const nodes = [];
|
|
475
|
-
const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {
|
|
476
|
-
acceptNode: (node)=>{
|
|
477
|
-
const isHiddenInput = node.tagName === 'INPUT' && node.type === 'hidden';
|
|
478
|
-
if (node.disabled || node.hidden || isHiddenInput) return NodeFilter.FILTER_SKIP; // `.tabIndex` is not the same as the `tabindex` attribute. It works on the
|
|
479
|
-
// runtime's understanding of tabbability, so this automatically accounts
|
|
480
|
-
// for any kind of element that could be tabbed to.
|
|
481
|
-
return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP;
|
|
482
|
-
}
|
|
483
|
-
});
|
|
484
|
-
while(walker.nextNode())nodes.push(walker.currentNode); // we do not take into account the order of nodes with positive `tabIndex` as it
|
|
485
|
-
// hinders accessibility to have tab order different from visual order.
|
|
486
|
-
return nodes;
|
|
487
|
-
}
|
|
488
|
-
/**
|
|
489
|
-
* Returns the first visible element in a list.
|
|
490
|
-
* NOTE: Only checks visibility up to the `container`.
|
|
491
|
-
*/ function $d3863c46a17e8a28$var$findVisible(elements, container) {
|
|
492
|
-
for (const element of elements){
|
|
493
|
-
// we stop checking if it's hidden at the `container` level (excluding)
|
|
494
|
-
if (!$d3863c46a17e8a28$var$isHidden(element, {
|
|
495
|
-
upTo: container
|
|
496
|
-
})) return element;
|
|
497
|
-
}
|
|
498
|
-
}
|
|
499
|
-
function $d3863c46a17e8a28$var$isHidden(node, { upTo: upTo }) {
|
|
500
|
-
if (getComputedStyle(node).visibility === 'hidden') return true;
|
|
501
|
-
while(node){
|
|
502
|
-
// we stop at `upTo` (excluding it)
|
|
503
|
-
if (upTo !== undefined && node === upTo) return false;
|
|
504
|
-
if (getComputedStyle(node).display === 'none') return true;
|
|
505
|
-
node = node.parentElement;
|
|
506
|
-
}
|
|
507
|
-
return false;
|
|
508
|
-
}
|
|
509
|
-
function $d3863c46a17e8a28$var$isSelectableInput(element) {
|
|
510
|
-
return element instanceof HTMLInputElement && 'select' in element;
|
|
511
|
-
}
|
|
512
|
-
function $d3863c46a17e8a28$var$focus(element, { select: select = false } = {}) {
|
|
513
|
-
// only focus if that element is focusable
|
|
514
|
-
if (element && element.focus) {
|
|
515
|
-
const previouslyFocusedElement = document.activeElement; // NOTE: we prevent scrolling on focus, to minimize jarring transitions for users
|
|
516
|
-
element.focus({
|
|
517
|
-
preventScroll: true
|
|
518
|
-
}); // only select if its not the same element, it supports selection and we need to select
|
|
519
|
-
if (element !== previouslyFocusedElement && $d3863c46a17e8a28$var$isSelectableInput(element) && select) element.select();
|
|
520
|
-
}
|
|
521
|
-
}
|
|
522
|
-
/* -------------------------------------------------------------------------------------------------
|
|
523
|
-
* FocusScope stack
|
|
524
|
-
* -----------------------------------------------------------------------------------------------*/ const $d3863c46a17e8a28$var$focusScopesStack = $d3863c46a17e8a28$var$createFocusScopesStack();
|
|
525
|
-
function $d3863c46a17e8a28$var$createFocusScopesStack() {
|
|
526
|
-
/** A stack of focus scopes, with the active one at the top */ let stack = [];
|
|
527
|
-
return {
|
|
528
|
-
add (focusScope) {
|
|
529
|
-
// pause the currently active focus scope (at the top of the stack)
|
|
530
|
-
const activeFocusScope = stack[0];
|
|
531
|
-
if (focusScope !== activeFocusScope) activeFocusScope === null || activeFocusScope === void 0 || activeFocusScope.pause();
|
|
532
|
-
// remove in case it already exists (because we'll re-add it at the top of the stack)
|
|
533
|
-
stack = $d3863c46a17e8a28$var$arrayRemove(stack, focusScope);
|
|
534
|
-
stack.unshift(focusScope);
|
|
535
|
-
},
|
|
536
|
-
remove (focusScope) {
|
|
537
|
-
var _stack$;
|
|
538
|
-
stack = $d3863c46a17e8a28$var$arrayRemove(stack, focusScope);
|
|
539
|
-
(_stack$ = stack[0]) === null || _stack$ === void 0 || _stack$.resume();
|
|
540
|
-
}
|
|
541
|
-
};
|
|
542
|
-
}
|
|
543
|
-
function $d3863c46a17e8a28$var$arrayRemove(array, item) {
|
|
544
|
-
const updatedArray = [
|
|
545
|
-
...array
|
|
546
|
-
];
|
|
547
|
-
const index = updatedArray.indexOf(item);
|
|
548
|
-
if (index !== -1) updatedArray.splice(index, 1);
|
|
549
|
-
return updatedArray;
|
|
550
|
-
}
|
|
551
|
-
function $d3863c46a17e8a28$var$removeLinks(items) {
|
|
552
|
-
return items.filter((item)=>item.tagName !== 'A'
|
|
553
|
-
);
|
|
554
|
-
}
|
|
555
|
-
|
|
556
|
-
const sides = ['top', 'right', 'bottom', 'left'];
|
|
557
|
-
const min = Math.min;
|
|
558
|
-
const max = Math.max;
|
|
559
|
-
const round = Math.round;
|
|
560
|
-
const floor = Math.floor;
|
|
561
|
-
const createCoords = v => ({
|
|
562
|
-
x: v,
|
|
563
|
-
y: v
|
|
564
|
-
});
|
|
565
|
-
const oppositeSideMap = {
|
|
566
|
-
left: 'right',
|
|
567
|
-
right: 'left',
|
|
568
|
-
bottom: 'top',
|
|
569
|
-
top: 'bottom'
|
|
570
|
-
};
|
|
571
|
-
const oppositeAlignmentMap = {
|
|
572
|
-
start: 'end',
|
|
573
|
-
end: 'start'
|
|
574
|
-
};
|
|
575
|
-
function clamp(start, value, end) {
|
|
576
|
-
return max(start, min(value, end));
|
|
577
|
-
}
|
|
578
|
-
function evaluate(value, param) {
|
|
579
|
-
return typeof value === 'function' ? value(param) : value;
|
|
580
|
-
}
|
|
581
|
-
function getSide(placement) {
|
|
582
|
-
return placement.split('-')[0];
|
|
583
|
-
}
|
|
584
|
-
function getAlignment(placement) {
|
|
585
|
-
return placement.split('-')[1];
|
|
586
|
-
}
|
|
587
|
-
function getOppositeAxis(axis) {
|
|
588
|
-
return axis === 'x' ? 'y' : 'x';
|
|
589
|
-
}
|
|
590
|
-
function getAxisLength(axis) {
|
|
591
|
-
return axis === 'y' ? 'height' : 'width';
|
|
592
|
-
}
|
|
593
|
-
function getSideAxis(placement) {
|
|
594
|
-
return ['top', 'bottom'].includes(getSide(placement)) ? 'y' : 'x';
|
|
595
|
-
}
|
|
596
|
-
function getAlignmentAxis(placement) {
|
|
597
|
-
return getOppositeAxis(getSideAxis(placement));
|
|
598
|
-
}
|
|
599
|
-
function getAlignmentSides(placement, rects, rtl) {
|
|
600
|
-
if (rtl === void 0) {
|
|
601
|
-
rtl = false;
|
|
602
|
-
}
|
|
603
|
-
const alignment = getAlignment(placement);
|
|
604
|
-
const alignmentAxis = getAlignmentAxis(placement);
|
|
605
|
-
const length = getAxisLength(alignmentAxis);
|
|
606
|
-
let mainAlignmentSide = alignmentAxis === 'x' ? alignment === (rtl ? 'end' : 'start') ? 'right' : 'left' : alignment === 'start' ? 'bottom' : 'top';
|
|
607
|
-
if (rects.reference[length] > rects.floating[length]) {
|
|
608
|
-
mainAlignmentSide = getOppositePlacement(mainAlignmentSide);
|
|
609
|
-
}
|
|
610
|
-
return [mainAlignmentSide, getOppositePlacement(mainAlignmentSide)];
|
|
611
|
-
}
|
|
612
|
-
function getExpandedPlacements(placement) {
|
|
613
|
-
const oppositePlacement = getOppositePlacement(placement);
|
|
614
|
-
return [getOppositeAlignmentPlacement(placement), oppositePlacement, getOppositeAlignmentPlacement(oppositePlacement)];
|
|
615
|
-
}
|
|
616
|
-
function getOppositeAlignmentPlacement(placement) {
|
|
617
|
-
return placement.replace(/start|end/g, alignment => oppositeAlignmentMap[alignment]);
|
|
618
|
-
}
|
|
619
|
-
function getSideList(side, isStart, rtl) {
|
|
620
|
-
const lr = ['left', 'right'];
|
|
621
|
-
const rl = ['right', 'left'];
|
|
622
|
-
const tb = ['top', 'bottom'];
|
|
623
|
-
const bt = ['bottom', 'top'];
|
|
624
|
-
switch (side) {
|
|
625
|
-
case 'top':
|
|
626
|
-
case 'bottom':
|
|
627
|
-
if (rtl) return isStart ? rl : lr;
|
|
628
|
-
return isStart ? lr : rl;
|
|
629
|
-
case 'left':
|
|
630
|
-
case 'right':
|
|
631
|
-
return isStart ? tb : bt;
|
|
632
|
-
default:
|
|
633
|
-
return [];
|
|
634
|
-
}
|
|
635
|
-
}
|
|
636
|
-
function getOppositeAxisPlacements(placement, flipAlignment, direction, rtl) {
|
|
637
|
-
const alignment = getAlignment(placement);
|
|
638
|
-
let list = getSideList(getSide(placement), direction === 'start', rtl);
|
|
639
|
-
if (alignment) {
|
|
640
|
-
list = list.map(side => side + "-" + alignment);
|
|
641
|
-
if (flipAlignment) {
|
|
642
|
-
list = list.concat(list.map(getOppositeAlignmentPlacement));
|
|
643
|
-
}
|
|
644
|
-
}
|
|
645
|
-
return list;
|
|
646
|
-
}
|
|
647
|
-
function getOppositePlacement(placement) {
|
|
648
|
-
return placement.replace(/left|right|bottom|top/g, side => oppositeSideMap[side]);
|
|
649
|
-
}
|
|
650
|
-
function expandPaddingObject(padding) {
|
|
651
|
-
return {
|
|
652
|
-
top: 0,
|
|
653
|
-
right: 0,
|
|
654
|
-
bottom: 0,
|
|
655
|
-
left: 0,
|
|
656
|
-
...padding
|
|
657
|
-
};
|
|
658
|
-
}
|
|
659
|
-
function getPaddingObject(padding) {
|
|
660
|
-
return typeof padding !== 'number' ? expandPaddingObject(padding) : {
|
|
661
|
-
top: padding,
|
|
662
|
-
right: padding,
|
|
663
|
-
bottom: padding,
|
|
664
|
-
left: padding
|
|
665
|
-
};
|
|
666
|
-
}
|
|
667
|
-
function rectToClientRect(rect) {
|
|
668
|
-
return {
|
|
669
|
-
...rect,
|
|
670
|
-
top: rect.y,
|
|
671
|
-
left: rect.x,
|
|
672
|
-
right: rect.x + rect.width,
|
|
673
|
-
bottom: rect.y + rect.height
|
|
674
|
-
};
|
|
675
|
-
}
|
|
676
|
-
|
|
677
|
-
function computeCoordsFromPlacement(_ref, placement, rtl) {
|
|
678
|
-
let {
|
|
679
|
-
reference,
|
|
680
|
-
floating
|
|
681
|
-
} = _ref;
|
|
682
|
-
const sideAxis = getSideAxis(placement);
|
|
683
|
-
const alignmentAxis = getAlignmentAxis(placement);
|
|
684
|
-
const alignLength = getAxisLength(alignmentAxis);
|
|
685
|
-
const side = getSide(placement);
|
|
686
|
-
const isVertical = sideAxis === 'y';
|
|
687
|
-
const commonX = reference.x + reference.width / 2 - floating.width / 2;
|
|
688
|
-
const commonY = reference.y + reference.height / 2 - floating.height / 2;
|
|
689
|
-
const commonAlign = reference[alignLength] / 2 - floating[alignLength] / 2;
|
|
690
|
-
let coords;
|
|
691
|
-
switch (side) {
|
|
692
|
-
case 'top':
|
|
693
|
-
coords = {
|
|
694
|
-
x: commonX,
|
|
695
|
-
y: reference.y - floating.height
|
|
696
|
-
};
|
|
697
|
-
break;
|
|
698
|
-
case 'bottom':
|
|
699
|
-
coords = {
|
|
700
|
-
x: commonX,
|
|
701
|
-
y: reference.y + reference.height
|
|
702
|
-
};
|
|
703
|
-
break;
|
|
704
|
-
case 'right':
|
|
705
|
-
coords = {
|
|
706
|
-
x: reference.x + reference.width,
|
|
707
|
-
y: commonY
|
|
708
|
-
};
|
|
709
|
-
break;
|
|
710
|
-
case 'left':
|
|
711
|
-
coords = {
|
|
712
|
-
x: reference.x - floating.width,
|
|
713
|
-
y: commonY
|
|
714
|
-
};
|
|
715
|
-
break;
|
|
716
|
-
default:
|
|
717
|
-
coords = {
|
|
718
|
-
x: reference.x,
|
|
719
|
-
y: reference.y
|
|
720
|
-
};
|
|
721
|
-
}
|
|
722
|
-
switch (getAlignment(placement)) {
|
|
723
|
-
case 'start':
|
|
724
|
-
coords[alignmentAxis] -= commonAlign * (rtl && isVertical ? -1 : 1);
|
|
725
|
-
break;
|
|
726
|
-
case 'end':
|
|
727
|
-
coords[alignmentAxis] += commonAlign * (rtl && isVertical ? -1 : 1);
|
|
728
|
-
break;
|
|
729
|
-
}
|
|
730
|
-
return coords;
|
|
731
|
-
}
|
|
732
|
-
|
|
733
|
-
/**
|
|
734
|
-
* Computes the `x` and `y` coordinates that will place the floating element
|
|
735
|
-
* next to a reference element when it is given a certain positioning strategy.
|
|
736
|
-
*
|
|
737
|
-
* This export does not have any `platform` interface logic. You will need to
|
|
738
|
-
* write one for the platform you are using Floating UI with.
|
|
739
|
-
*/
|
|
740
|
-
const computePosition$1 = async (reference, floating, config) => {
|
|
741
|
-
const {
|
|
742
|
-
placement = 'bottom',
|
|
743
|
-
strategy = 'absolute',
|
|
744
|
-
middleware = [],
|
|
745
|
-
platform
|
|
746
|
-
} = config;
|
|
747
|
-
const validMiddleware = middleware.filter(Boolean);
|
|
748
|
-
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(floating));
|
|
749
|
-
let rects = await platform.getElementRects({
|
|
750
|
-
reference,
|
|
751
|
-
floating,
|
|
752
|
-
strategy
|
|
753
|
-
});
|
|
754
|
-
let {
|
|
755
|
-
x,
|
|
756
|
-
y
|
|
757
|
-
} = computeCoordsFromPlacement(rects, placement, rtl);
|
|
758
|
-
let statefulPlacement = placement;
|
|
759
|
-
let middlewareData = {};
|
|
760
|
-
let resetCount = 0;
|
|
761
|
-
for (let i = 0; i < validMiddleware.length; i++) {
|
|
762
|
-
const {
|
|
763
|
-
name,
|
|
764
|
-
fn
|
|
765
|
-
} = validMiddleware[i];
|
|
766
|
-
const {
|
|
767
|
-
x: nextX,
|
|
768
|
-
y: nextY,
|
|
769
|
-
data,
|
|
770
|
-
reset
|
|
771
|
-
} = await fn({
|
|
772
|
-
x,
|
|
773
|
-
y,
|
|
774
|
-
initialPlacement: placement,
|
|
775
|
-
placement: statefulPlacement,
|
|
776
|
-
strategy,
|
|
777
|
-
middlewareData,
|
|
778
|
-
rects,
|
|
779
|
-
platform,
|
|
780
|
-
elements: {
|
|
781
|
-
reference,
|
|
782
|
-
floating
|
|
783
|
-
}
|
|
784
|
-
});
|
|
785
|
-
x = nextX != null ? nextX : x;
|
|
786
|
-
y = nextY != null ? nextY : y;
|
|
787
|
-
middlewareData = {
|
|
788
|
-
...middlewareData,
|
|
789
|
-
[name]: {
|
|
790
|
-
...middlewareData[name],
|
|
791
|
-
...data
|
|
792
|
-
}
|
|
793
|
-
};
|
|
794
|
-
if (reset && resetCount <= 50) {
|
|
795
|
-
resetCount++;
|
|
796
|
-
if (typeof reset === 'object') {
|
|
797
|
-
if (reset.placement) {
|
|
798
|
-
statefulPlacement = reset.placement;
|
|
799
|
-
}
|
|
800
|
-
if (reset.rects) {
|
|
801
|
-
rects = reset.rects === true ? await platform.getElementRects({
|
|
802
|
-
reference,
|
|
803
|
-
floating,
|
|
804
|
-
strategy
|
|
805
|
-
}) : reset.rects;
|
|
806
|
-
}
|
|
807
|
-
({
|
|
808
|
-
x,
|
|
809
|
-
y
|
|
810
|
-
} = computeCoordsFromPlacement(rects, statefulPlacement, rtl));
|
|
811
|
-
}
|
|
812
|
-
i = -1;
|
|
813
|
-
continue;
|
|
814
|
-
}
|
|
815
|
-
}
|
|
816
|
-
return {
|
|
817
|
-
x,
|
|
818
|
-
y,
|
|
819
|
-
placement: statefulPlacement,
|
|
820
|
-
strategy,
|
|
821
|
-
middlewareData
|
|
822
|
-
};
|
|
823
|
-
};
|
|
824
|
-
|
|
825
|
-
/**
|
|
826
|
-
* Resolves with an object of overflow side offsets that determine how much the
|
|
827
|
-
* element is overflowing a given clipping boundary on each side.
|
|
828
|
-
* - positive = overflowing the boundary by that number of pixels
|
|
829
|
-
* - negative = how many pixels left before it will overflow
|
|
830
|
-
* - 0 = lies flush with the boundary
|
|
831
|
-
* @see https://floating-ui.com/docs/detectOverflow
|
|
832
|
-
*/
|
|
833
|
-
async function detectOverflow(state, options) {
|
|
834
|
-
var _await$platform$isEle;
|
|
835
|
-
if (options === void 0) {
|
|
836
|
-
options = {};
|
|
837
|
-
}
|
|
838
|
-
const {
|
|
839
|
-
x,
|
|
840
|
-
y,
|
|
841
|
-
platform,
|
|
842
|
-
rects,
|
|
843
|
-
elements,
|
|
844
|
-
strategy
|
|
845
|
-
} = state;
|
|
846
|
-
const {
|
|
847
|
-
boundary = 'clippingAncestors',
|
|
848
|
-
rootBoundary = 'viewport',
|
|
849
|
-
elementContext = 'floating',
|
|
850
|
-
altBoundary = false,
|
|
851
|
-
padding = 0
|
|
852
|
-
} = evaluate(options, state);
|
|
853
|
-
const paddingObject = getPaddingObject(padding);
|
|
854
|
-
const altContext = elementContext === 'floating' ? 'reference' : 'floating';
|
|
855
|
-
const element = elements[altBoundary ? altContext : elementContext];
|
|
856
|
-
const clippingClientRect = rectToClientRect(await platform.getClippingRect({
|
|
857
|
-
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))),
|
|
858
|
-
boundary,
|
|
859
|
-
rootBoundary,
|
|
860
|
-
strategy
|
|
861
|
-
}));
|
|
862
|
-
const rect = elementContext === 'floating' ? {
|
|
863
|
-
...rects.floating,
|
|
864
|
-
x,
|
|
865
|
-
y
|
|
866
|
-
} : rects.reference;
|
|
867
|
-
const offsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(elements.floating));
|
|
868
|
-
const offsetScale = (await (platform.isElement == null ? void 0 : platform.isElement(offsetParent))) ? (await (platform.getScale == null ? void 0 : platform.getScale(offsetParent))) || {
|
|
869
|
-
x: 1,
|
|
870
|
-
y: 1
|
|
871
|
-
} : {
|
|
872
|
-
x: 1,
|
|
873
|
-
y: 1
|
|
874
|
-
};
|
|
875
|
-
const elementClientRect = rectToClientRect(platform.convertOffsetParentRelativeRectToViewportRelativeRect ? await platform.convertOffsetParentRelativeRectToViewportRelativeRect({
|
|
876
|
-
rect,
|
|
877
|
-
offsetParent,
|
|
878
|
-
strategy
|
|
879
|
-
}) : rect);
|
|
880
|
-
return {
|
|
881
|
-
top: (clippingClientRect.top - elementClientRect.top + paddingObject.top) / offsetScale.y,
|
|
882
|
-
bottom: (elementClientRect.bottom - clippingClientRect.bottom + paddingObject.bottom) / offsetScale.y,
|
|
883
|
-
left: (clippingClientRect.left - elementClientRect.left + paddingObject.left) / offsetScale.x,
|
|
884
|
-
right: (elementClientRect.right - clippingClientRect.right + paddingObject.right) / offsetScale.x
|
|
885
|
-
};
|
|
886
|
-
}
|
|
887
|
-
|
|
888
|
-
/**
|
|
889
|
-
* Provides data to position an inner element of the floating element so that it
|
|
890
|
-
* appears centered to the reference element.
|
|
891
|
-
* @see https://floating-ui.com/docs/arrow
|
|
892
|
-
*/
|
|
893
|
-
const arrow$1 = options => ({
|
|
894
|
-
name: 'arrow',
|
|
895
|
-
options,
|
|
896
|
-
async fn(state) {
|
|
897
|
-
const {
|
|
898
|
-
x,
|
|
899
|
-
y,
|
|
900
|
-
placement,
|
|
901
|
-
rects,
|
|
902
|
-
platform,
|
|
903
|
-
elements,
|
|
904
|
-
middlewareData
|
|
905
|
-
} = state;
|
|
906
|
-
// Since `element` is required, we don't Partial<> the type.
|
|
907
|
-
const {
|
|
908
|
-
element,
|
|
909
|
-
padding = 0
|
|
910
|
-
} = evaluate(options, state) || {};
|
|
911
|
-
if (element == null) {
|
|
912
|
-
return {};
|
|
913
|
-
}
|
|
914
|
-
const paddingObject = getPaddingObject(padding);
|
|
915
|
-
const coords = {
|
|
916
|
-
x,
|
|
917
|
-
y
|
|
918
|
-
};
|
|
919
|
-
const axis = getAlignmentAxis(placement);
|
|
920
|
-
const length = getAxisLength(axis);
|
|
921
|
-
const arrowDimensions = await platform.getDimensions(element);
|
|
922
|
-
const isYAxis = axis === 'y';
|
|
923
|
-
const minProp = isYAxis ? 'top' : 'left';
|
|
924
|
-
const maxProp = isYAxis ? 'bottom' : 'right';
|
|
925
|
-
const clientProp = isYAxis ? 'clientHeight' : 'clientWidth';
|
|
926
|
-
const endDiff = rects.reference[length] + rects.reference[axis] - coords[axis] - rects.floating[length];
|
|
927
|
-
const startDiff = coords[axis] - rects.reference[axis];
|
|
928
|
-
const arrowOffsetParent = await (platform.getOffsetParent == null ? void 0 : platform.getOffsetParent(element));
|
|
929
|
-
let clientSize = arrowOffsetParent ? arrowOffsetParent[clientProp] : 0;
|
|
930
|
-
|
|
931
|
-
// DOM platform can return `window` as the `offsetParent`.
|
|
932
|
-
if (!clientSize || !(await (platform.isElement == null ? void 0 : platform.isElement(arrowOffsetParent)))) {
|
|
933
|
-
clientSize = elements.floating[clientProp] || rects.floating[length];
|
|
934
|
-
}
|
|
935
|
-
const centerToReference = endDiff / 2 - startDiff / 2;
|
|
936
|
-
|
|
937
|
-
// If the padding is large enough that it causes the arrow to no longer be
|
|
938
|
-
// centered, modify the padding so that it is centered.
|
|
939
|
-
const largestPossiblePadding = clientSize / 2 - arrowDimensions[length] / 2 - 1;
|
|
940
|
-
const minPadding = min(paddingObject[minProp], largestPossiblePadding);
|
|
941
|
-
const maxPadding = min(paddingObject[maxProp], largestPossiblePadding);
|
|
942
|
-
|
|
943
|
-
// Make sure the arrow doesn't overflow the floating element if the center
|
|
944
|
-
// point is outside the floating element's bounds.
|
|
945
|
-
const min$1 = minPadding;
|
|
946
|
-
const max = clientSize - arrowDimensions[length] - maxPadding;
|
|
947
|
-
const center = clientSize / 2 - arrowDimensions[length] / 2 + centerToReference;
|
|
948
|
-
const offset = clamp(min$1, center, max);
|
|
949
|
-
|
|
950
|
-
// If the reference is small enough that the arrow's padding causes it to
|
|
951
|
-
// to point to nothing for an aligned placement, adjust the offset of the
|
|
952
|
-
// floating element itself. To ensure `shift()` continues to take action,
|
|
953
|
-
// a single reset is performed when this is true.
|
|
954
|
-
const shouldAddOffset = !middlewareData.arrow && getAlignment(placement) != null && center != offset && rects.reference[length] / 2 - (center < min$1 ? minPadding : maxPadding) - arrowDimensions[length] / 2 < 0;
|
|
955
|
-
const alignmentOffset = shouldAddOffset ? center < min$1 ? center - min$1 : center - max : 0;
|
|
956
|
-
return {
|
|
957
|
-
[axis]: coords[axis] + alignmentOffset,
|
|
958
|
-
data: {
|
|
959
|
-
[axis]: offset,
|
|
960
|
-
centerOffset: center - offset - alignmentOffset,
|
|
961
|
-
...(shouldAddOffset && {
|
|
962
|
-
alignmentOffset
|
|
963
|
-
})
|
|
964
|
-
},
|
|
965
|
-
reset: shouldAddOffset
|
|
966
|
-
};
|
|
967
|
-
}
|
|
968
|
-
});
|
|
969
|
-
|
|
970
|
-
/**
|
|
971
|
-
* Optimizes the visibility of the floating element by flipping the `placement`
|
|
972
|
-
* in order to keep it in view when the preferred placement(s) will overflow the
|
|
973
|
-
* clipping boundary. Alternative to `autoPlacement`.
|
|
974
|
-
* @see https://floating-ui.com/docs/flip
|
|
975
|
-
*/
|
|
976
|
-
const flip = function (options) {
|
|
977
|
-
if (options === void 0) {
|
|
978
|
-
options = {};
|
|
979
|
-
}
|
|
980
|
-
return {
|
|
981
|
-
name: 'flip',
|
|
982
|
-
options,
|
|
983
|
-
async fn(state) {
|
|
984
|
-
var _middlewareData$arrow, _middlewareData$flip;
|
|
985
|
-
const {
|
|
986
|
-
placement,
|
|
987
|
-
middlewareData,
|
|
988
|
-
rects,
|
|
989
|
-
initialPlacement,
|
|
990
|
-
platform,
|
|
991
|
-
elements
|
|
992
|
-
} = state;
|
|
993
|
-
const {
|
|
994
|
-
mainAxis: checkMainAxis = true,
|
|
995
|
-
crossAxis: checkCrossAxis = true,
|
|
996
|
-
fallbackPlacements: specifiedFallbackPlacements,
|
|
997
|
-
fallbackStrategy = 'bestFit',
|
|
998
|
-
fallbackAxisSideDirection = 'none',
|
|
999
|
-
flipAlignment = true,
|
|
1000
|
-
...detectOverflowOptions
|
|
1001
|
-
} = evaluate(options, state);
|
|
1002
|
-
|
|
1003
|
-
// If a reset by the arrow was caused due to an alignment offset being
|
|
1004
|
-
// added, we should skip any logic now since `flip()` has already done its
|
|
1005
|
-
// work.
|
|
1006
|
-
// https://github.com/floating-ui/floating-ui/issues/2549#issuecomment-1719601643
|
|
1007
|
-
if ((_middlewareData$arrow = middlewareData.arrow) != null && _middlewareData$arrow.alignmentOffset) {
|
|
1008
|
-
return {};
|
|
1009
|
-
}
|
|
1010
|
-
const side = getSide(placement);
|
|
1011
|
-
const isBasePlacement = getSide(initialPlacement) === initialPlacement;
|
|
1012
|
-
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
|
|
1013
|
-
const fallbackPlacements = specifiedFallbackPlacements || (isBasePlacement || !flipAlignment ? [getOppositePlacement(initialPlacement)] : getExpandedPlacements(initialPlacement));
|
|
1014
|
-
if (!specifiedFallbackPlacements && fallbackAxisSideDirection !== 'none') {
|
|
1015
|
-
fallbackPlacements.push(...getOppositeAxisPlacements(initialPlacement, flipAlignment, fallbackAxisSideDirection, rtl));
|
|
1016
|
-
}
|
|
1017
|
-
const placements = [initialPlacement, ...fallbackPlacements];
|
|
1018
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
1019
|
-
const overflows = [];
|
|
1020
|
-
let overflowsData = ((_middlewareData$flip = middlewareData.flip) == null ? void 0 : _middlewareData$flip.overflows) || [];
|
|
1021
|
-
if (checkMainAxis) {
|
|
1022
|
-
overflows.push(overflow[side]);
|
|
1023
|
-
}
|
|
1024
|
-
if (checkCrossAxis) {
|
|
1025
|
-
const sides = getAlignmentSides(placement, rects, rtl);
|
|
1026
|
-
overflows.push(overflow[sides[0]], overflow[sides[1]]);
|
|
1027
|
-
}
|
|
1028
|
-
overflowsData = [...overflowsData, {
|
|
1029
|
-
placement,
|
|
1030
|
-
overflows
|
|
1031
|
-
}];
|
|
1032
|
-
|
|
1033
|
-
// One or more sides is overflowing.
|
|
1034
|
-
if (!overflows.every(side => side <= 0)) {
|
|
1035
|
-
var _middlewareData$flip2, _overflowsData$filter;
|
|
1036
|
-
const nextIndex = (((_middlewareData$flip2 = middlewareData.flip) == null ? void 0 : _middlewareData$flip2.index) || 0) + 1;
|
|
1037
|
-
const nextPlacement = placements[nextIndex];
|
|
1038
|
-
if (nextPlacement) {
|
|
1039
|
-
// Try next placement and re-run the lifecycle.
|
|
1040
|
-
return {
|
|
1041
|
-
data: {
|
|
1042
|
-
index: nextIndex,
|
|
1043
|
-
overflows: overflowsData
|
|
1044
|
-
},
|
|
1045
|
-
reset: {
|
|
1046
|
-
placement: nextPlacement
|
|
1047
|
-
}
|
|
1048
|
-
};
|
|
1049
|
-
}
|
|
1050
|
-
|
|
1051
|
-
// First, find the candidates that fit on the mainAxis side of overflow,
|
|
1052
|
-
// then find the placement that fits the best on the main crossAxis side.
|
|
1053
|
-
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;
|
|
1054
|
-
|
|
1055
|
-
// Otherwise fallback.
|
|
1056
|
-
if (!resetPlacement) {
|
|
1057
|
-
switch (fallbackStrategy) {
|
|
1058
|
-
case 'bestFit':
|
|
1059
|
-
{
|
|
1060
|
-
var _overflowsData$map$so;
|
|
1061
|
-
const placement = (_overflowsData$map$so = overflowsData.map(d => [d.placement, d.overflows.filter(overflow => overflow > 0).reduce((acc, overflow) => acc + overflow, 0)]).sort((a, b) => a[1] - b[1])[0]) == null ? void 0 : _overflowsData$map$so[0];
|
|
1062
|
-
if (placement) {
|
|
1063
|
-
resetPlacement = placement;
|
|
1064
|
-
}
|
|
1065
|
-
break;
|
|
1066
|
-
}
|
|
1067
|
-
case 'initialPlacement':
|
|
1068
|
-
resetPlacement = initialPlacement;
|
|
1069
|
-
break;
|
|
1070
|
-
}
|
|
1071
|
-
}
|
|
1072
|
-
if (placement !== resetPlacement) {
|
|
1073
|
-
return {
|
|
1074
|
-
reset: {
|
|
1075
|
-
placement: resetPlacement
|
|
1076
|
-
}
|
|
1077
|
-
};
|
|
1078
|
-
}
|
|
1079
|
-
}
|
|
1080
|
-
return {};
|
|
1081
|
-
}
|
|
1082
|
-
};
|
|
1083
|
-
};
|
|
1084
|
-
|
|
1085
|
-
function getSideOffsets(overflow, rect) {
|
|
1086
|
-
return {
|
|
1087
|
-
top: overflow.top - rect.height,
|
|
1088
|
-
right: overflow.right - rect.width,
|
|
1089
|
-
bottom: overflow.bottom - rect.height,
|
|
1090
|
-
left: overflow.left - rect.width
|
|
1091
|
-
};
|
|
1092
|
-
}
|
|
1093
|
-
function isAnySideFullyClipped(overflow) {
|
|
1094
|
-
return sides.some(side => overflow[side] >= 0);
|
|
1095
|
-
}
|
|
1096
|
-
/**
|
|
1097
|
-
* Provides data to hide the floating element in applicable situations, such as
|
|
1098
|
-
* when it is not in the same clipping context as the reference element.
|
|
1099
|
-
* @see https://floating-ui.com/docs/hide
|
|
1100
|
-
*/
|
|
1101
|
-
const hide = function (options) {
|
|
1102
|
-
if (options === void 0) {
|
|
1103
|
-
options = {};
|
|
1104
|
-
}
|
|
1105
|
-
return {
|
|
1106
|
-
name: 'hide',
|
|
1107
|
-
options,
|
|
1108
|
-
async fn(state) {
|
|
1109
|
-
const {
|
|
1110
|
-
rects
|
|
1111
|
-
} = state;
|
|
1112
|
-
const {
|
|
1113
|
-
strategy = 'referenceHidden',
|
|
1114
|
-
...detectOverflowOptions
|
|
1115
|
-
} = evaluate(options, state);
|
|
1116
|
-
switch (strategy) {
|
|
1117
|
-
case 'referenceHidden':
|
|
1118
|
-
{
|
|
1119
|
-
const overflow = await detectOverflow(state, {
|
|
1120
|
-
...detectOverflowOptions,
|
|
1121
|
-
elementContext: 'reference'
|
|
1122
|
-
});
|
|
1123
|
-
const offsets = getSideOffsets(overflow, rects.reference);
|
|
1124
|
-
return {
|
|
1125
|
-
data: {
|
|
1126
|
-
referenceHiddenOffsets: offsets,
|
|
1127
|
-
referenceHidden: isAnySideFullyClipped(offsets)
|
|
1128
|
-
}
|
|
1129
|
-
};
|
|
1130
|
-
}
|
|
1131
|
-
case 'escaped':
|
|
1132
|
-
{
|
|
1133
|
-
const overflow = await detectOverflow(state, {
|
|
1134
|
-
...detectOverflowOptions,
|
|
1135
|
-
altBoundary: true
|
|
1136
|
-
});
|
|
1137
|
-
const offsets = getSideOffsets(overflow, rects.floating);
|
|
1138
|
-
return {
|
|
1139
|
-
data: {
|
|
1140
|
-
escapedOffsets: offsets,
|
|
1141
|
-
escaped: isAnySideFullyClipped(offsets)
|
|
1142
|
-
}
|
|
1143
|
-
};
|
|
1144
|
-
}
|
|
1145
|
-
default:
|
|
1146
|
-
{
|
|
1147
|
-
return {};
|
|
1148
|
-
}
|
|
1149
|
-
}
|
|
1150
|
-
}
|
|
1151
|
-
};
|
|
1152
|
-
};
|
|
1153
|
-
|
|
1154
|
-
// For type backwards-compatibility, the `OffsetOptions` type was also
|
|
1155
|
-
// Derivable.
|
|
1156
|
-
async function convertValueToCoords(state, options) {
|
|
1157
|
-
const {
|
|
1158
|
-
placement,
|
|
1159
|
-
platform,
|
|
1160
|
-
elements
|
|
1161
|
-
} = state;
|
|
1162
|
-
const rtl = await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating));
|
|
1163
|
-
const side = getSide(placement);
|
|
1164
|
-
const alignment = getAlignment(placement);
|
|
1165
|
-
const isVertical = getSideAxis(placement) === 'y';
|
|
1166
|
-
const mainAxisMulti = ['left', 'top'].includes(side) ? -1 : 1;
|
|
1167
|
-
const crossAxisMulti = rtl && isVertical ? -1 : 1;
|
|
1168
|
-
const rawValue = evaluate(options, state);
|
|
1169
|
-
|
|
1170
|
-
// eslint-disable-next-line prefer-const
|
|
1171
|
-
let {
|
|
1172
|
-
mainAxis,
|
|
1173
|
-
crossAxis,
|
|
1174
|
-
alignmentAxis
|
|
1175
|
-
} = typeof rawValue === 'number' ? {
|
|
1176
|
-
mainAxis: rawValue,
|
|
1177
|
-
crossAxis: 0,
|
|
1178
|
-
alignmentAxis: null
|
|
1179
|
-
} : {
|
|
1180
|
-
mainAxis: 0,
|
|
1181
|
-
crossAxis: 0,
|
|
1182
|
-
alignmentAxis: null,
|
|
1183
|
-
...rawValue
|
|
1184
|
-
};
|
|
1185
|
-
if (alignment && typeof alignmentAxis === 'number') {
|
|
1186
|
-
crossAxis = alignment === 'end' ? alignmentAxis * -1 : alignmentAxis;
|
|
1187
|
-
}
|
|
1188
|
-
return isVertical ? {
|
|
1189
|
-
x: crossAxis * crossAxisMulti,
|
|
1190
|
-
y: mainAxis * mainAxisMulti
|
|
1191
|
-
} : {
|
|
1192
|
-
x: mainAxis * mainAxisMulti,
|
|
1193
|
-
y: crossAxis * crossAxisMulti
|
|
1194
|
-
};
|
|
1195
|
-
}
|
|
1196
|
-
|
|
1197
|
-
/**
|
|
1198
|
-
* Modifies the placement by translating the floating element along the
|
|
1199
|
-
* specified axes.
|
|
1200
|
-
* A number (shorthand for `mainAxis` or distance), or an axes configuration
|
|
1201
|
-
* object may be passed.
|
|
1202
|
-
* @see https://floating-ui.com/docs/offset
|
|
1203
|
-
*/
|
|
1204
|
-
const offset = function (options) {
|
|
1205
|
-
if (options === void 0) {
|
|
1206
|
-
options = 0;
|
|
1207
|
-
}
|
|
1208
|
-
return {
|
|
1209
|
-
name: 'offset',
|
|
1210
|
-
options,
|
|
1211
|
-
async fn(state) {
|
|
1212
|
-
const {
|
|
1213
|
-
x,
|
|
1214
|
-
y
|
|
1215
|
-
} = state;
|
|
1216
|
-
const diffCoords = await convertValueToCoords(state, options);
|
|
1217
|
-
return {
|
|
1218
|
-
x: x + diffCoords.x,
|
|
1219
|
-
y: y + diffCoords.y,
|
|
1220
|
-
data: diffCoords
|
|
1221
|
-
};
|
|
1222
|
-
}
|
|
1223
|
-
};
|
|
1224
|
-
};
|
|
1225
|
-
|
|
1226
|
-
/**
|
|
1227
|
-
* Optimizes the visibility of the floating element by shifting it in order to
|
|
1228
|
-
* keep it in view when it will overflow the clipping boundary.
|
|
1229
|
-
* @see https://floating-ui.com/docs/shift
|
|
1230
|
-
*/
|
|
1231
|
-
const shift = function (options) {
|
|
1232
|
-
if (options === void 0) {
|
|
1233
|
-
options = {};
|
|
1234
|
-
}
|
|
1235
|
-
return {
|
|
1236
|
-
name: 'shift',
|
|
1237
|
-
options,
|
|
1238
|
-
async fn(state) {
|
|
1239
|
-
const {
|
|
1240
|
-
x,
|
|
1241
|
-
y,
|
|
1242
|
-
placement
|
|
1243
|
-
} = state;
|
|
1244
|
-
const {
|
|
1245
|
-
mainAxis: checkMainAxis = true,
|
|
1246
|
-
crossAxis: checkCrossAxis = false,
|
|
1247
|
-
limiter = {
|
|
1248
|
-
fn: _ref => {
|
|
1249
|
-
let {
|
|
1250
|
-
x,
|
|
1251
|
-
y
|
|
1252
|
-
} = _ref;
|
|
1253
|
-
return {
|
|
1254
|
-
x,
|
|
1255
|
-
y
|
|
1256
|
-
};
|
|
1257
|
-
}
|
|
1258
|
-
},
|
|
1259
|
-
...detectOverflowOptions
|
|
1260
|
-
} = evaluate(options, state);
|
|
1261
|
-
const coords = {
|
|
1262
|
-
x,
|
|
1263
|
-
y
|
|
1264
|
-
};
|
|
1265
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
1266
|
-
const crossAxis = getSideAxis(getSide(placement));
|
|
1267
|
-
const mainAxis = getOppositeAxis(crossAxis);
|
|
1268
|
-
let mainAxisCoord = coords[mainAxis];
|
|
1269
|
-
let crossAxisCoord = coords[crossAxis];
|
|
1270
|
-
if (checkMainAxis) {
|
|
1271
|
-
const minSide = mainAxis === 'y' ? 'top' : 'left';
|
|
1272
|
-
const maxSide = mainAxis === 'y' ? 'bottom' : 'right';
|
|
1273
|
-
const min = mainAxisCoord + overflow[minSide];
|
|
1274
|
-
const max = mainAxisCoord - overflow[maxSide];
|
|
1275
|
-
mainAxisCoord = clamp(min, mainAxisCoord, max);
|
|
1276
|
-
}
|
|
1277
|
-
if (checkCrossAxis) {
|
|
1278
|
-
const minSide = crossAxis === 'y' ? 'top' : 'left';
|
|
1279
|
-
const maxSide = crossAxis === 'y' ? 'bottom' : 'right';
|
|
1280
|
-
const min = crossAxisCoord + overflow[minSide];
|
|
1281
|
-
const max = crossAxisCoord - overflow[maxSide];
|
|
1282
|
-
crossAxisCoord = clamp(min, crossAxisCoord, max);
|
|
1283
|
-
}
|
|
1284
|
-
const limitedCoords = limiter.fn({
|
|
1285
|
-
...state,
|
|
1286
|
-
[mainAxis]: mainAxisCoord,
|
|
1287
|
-
[crossAxis]: crossAxisCoord
|
|
1288
|
-
});
|
|
1289
|
-
return {
|
|
1290
|
-
...limitedCoords,
|
|
1291
|
-
data: {
|
|
1292
|
-
x: limitedCoords.x - x,
|
|
1293
|
-
y: limitedCoords.y - y
|
|
1294
|
-
}
|
|
1295
|
-
};
|
|
1296
|
-
}
|
|
1297
|
-
};
|
|
1298
|
-
};
|
|
1299
|
-
/**
|
|
1300
|
-
* Built-in `limiter` that will stop `shift()` at a certain point.
|
|
1301
|
-
*/
|
|
1302
|
-
const limitShift = function (options) {
|
|
1303
|
-
if (options === void 0) {
|
|
1304
|
-
options = {};
|
|
1305
|
-
}
|
|
1306
|
-
return {
|
|
1307
|
-
options,
|
|
1308
|
-
fn(state) {
|
|
1309
|
-
const {
|
|
1310
|
-
x,
|
|
1311
|
-
y,
|
|
1312
|
-
placement,
|
|
1313
|
-
rects,
|
|
1314
|
-
middlewareData
|
|
1315
|
-
} = state;
|
|
1316
|
-
const {
|
|
1317
|
-
offset = 0,
|
|
1318
|
-
mainAxis: checkMainAxis = true,
|
|
1319
|
-
crossAxis: checkCrossAxis = true
|
|
1320
|
-
} = evaluate(options, state);
|
|
1321
|
-
const coords = {
|
|
1322
|
-
x,
|
|
1323
|
-
y
|
|
1324
|
-
};
|
|
1325
|
-
const crossAxis = getSideAxis(placement);
|
|
1326
|
-
const mainAxis = getOppositeAxis(crossAxis);
|
|
1327
|
-
let mainAxisCoord = coords[mainAxis];
|
|
1328
|
-
let crossAxisCoord = coords[crossAxis];
|
|
1329
|
-
const rawOffset = evaluate(offset, state);
|
|
1330
|
-
const computedOffset = typeof rawOffset === 'number' ? {
|
|
1331
|
-
mainAxis: rawOffset,
|
|
1332
|
-
crossAxis: 0
|
|
1333
|
-
} : {
|
|
1334
|
-
mainAxis: 0,
|
|
1335
|
-
crossAxis: 0,
|
|
1336
|
-
...rawOffset
|
|
1337
|
-
};
|
|
1338
|
-
if (checkMainAxis) {
|
|
1339
|
-
const len = mainAxis === 'y' ? 'height' : 'width';
|
|
1340
|
-
const limitMin = rects.reference[mainAxis] - rects.floating[len] + computedOffset.mainAxis;
|
|
1341
|
-
const limitMax = rects.reference[mainAxis] + rects.reference[len] - computedOffset.mainAxis;
|
|
1342
|
-
if (mainAxisCoord < limitMin) {
|
|
1343
|
-
mainAxisCoord = limitMin;
|
|
1344
|
-
} else if (mainAxisCoord > limitMax) {
|
|
1345
|
-
mainAxisCoord = limitMax;
|
|
1346
|
-
}
|
|
1347
|
-
}
|
|
1348
|
-
if (checkCrossAxis) {
|
|
1349
|
-
var _middlewareData$offse, _middlewareData$offse2;
|
|
1350
|
-
const len = mainAxis === 'y' ? 'width' : 'height';
|
|
1351
|
-
const isOriginSide = ['top', 'left'].includes(getSide(placement));
|
|
1352
|
-
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);
|
|
1353
|
-
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);
|
|
1354
|
-
if (crossAxisCoord < limitMin) {
|
|
1355
|
-
crossAxisCoord = limitMin;
|
|
1356
|
-
} else if (crossAxisCoord > limitMax) {
|
|
1357
|
-
crossAxisCoord = limitMax;
|
|
1358
|
-
}
|
|
1359
|
-
}
|
|
1360
|
-
return {
|
|
1361
|
-
[mainAxis]: mainAxisCoord,
|
|
1362
|
-
[crossAxis]: crossAxisCoord
|
|
1363
|
-
};
|
|
1364
|
-
}
|
|
1365
|
-
};
|
|
1366
|
-
};
|
|
1367
|
-
|
|
1368
|
-
/**
|
|
1369
|
-
* Provides data that allows you to change the size of the floating element —
|
|
1370
|
-
* for instance, prevent it from overflowing the clipping boundary or match the
|
|
1371
|
-
* width of the reference element.
|
|
1372
|
-
* @see https://floating-ui.com/docs/size
|
|
1373
|
-
*/
|
|
1374
|
-
const size = function (options) {
|
|
1375
|
-
if (options === void 0) {
|
|
1376
|
-
options = {};
|
|
1377
|
-
}
|
|
1378
|
-
return {
|
|
1379
|
-
name: 'size',
|
|
1380
|
-
options,
|
|
1381
|
-
async fn(state) {
|
|
1382
|
-
const {
|
|
1383
|
-
placement,
|
|
1384
|
-
rects,
|
|
1385
|
-
platform,
|
|
1386
|
-
elements
|
|
1387
|
-
} = state;
|
|
1388
|
-
const {
|
|
1389
|
-
apply = () => {},
|
|
1390
|
-
...detectOverflowOptions
|
|
1391
|
-
} = evaluate(options, state);
|
|
1392
|
-
const overflow = await detectOverflow(state, detectOverflowOptions);
|
|
1393
|
-
const side = getSide(placement);
|
|
1394
|
-
const alignment = getAlignment(placement);
|
|
1395
|
-
const isYAxis = getSideAxis(placement) === 'y';
|
|
1396
|
-
const {
|
|
1397
|
-
width,
|
|
1398
|
-
height
|
|
1399
|
-
} = rects.floating;
|
|
1400
|
-
let heightSide;
|
|
1401
|
-
let widthSide;
|
|
1402
|
-
if (side === 'top' || side === 'bottom') {
|
|
1403
|
-
heightSide = side;
|
|
1404
|
-
widthSide = alignment === ((await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating))) ? 'start' : 'end') ? 'left' : 'right';
|
|
1405
|
-
} else {
|
|
1406
|
-
widthSide = side;
|
|
1407
|
-
heightSide = alignment === 'end' ? 'top' : 'bottom';
|
|
1408
|
-
}
|
|
1409
|
-
const overflowAvailableHeight = height - overflow[heightSide];
|
|
1410
|
-
const overflowAvailableWidth = width - overflow[widthSide];
|
|
1411
|
-
const noShift = !state.middlewareData.shift;
|
|
1412
|
-
let availableHeight = overflowAvailableHeight;
|
|
1413
|
-
let availableWidth = overflowAvailableWidth;
|
|
1414
|
-
if (isYAxis) {
|
|
1415
|
-
const maximumClippingWidth = width - overflow.left - overflow.right;
|
|
1416
|
-
availableWidth = alignment || noShift ? min(overflowAvailableWidth, maximumClippingWidth) : maximumClippingWidth;
|
|
1417
|
-
} else {
|
|
1418
|
-
const maximumClippingHeight = height - overflow.top - overflow.bottom;
|
|
1419
|
-
availableHeight = alignment || noShift ? min(overflowAvailableHeight, maximumClippingHeight) : maximumClippingHeight;
|
|
1420
|
-
}
|
|
1421
|
-
if (noShift && !alignment) {
|
|
1422
|
-
const xMin = max(overflow.left, 0);
|
|
1423
|
-
const xMax = max(overflow.right, 0);
|
|
1424
|
-
const yMin = max(overflow.top, 0);
|
|
1425
|
-
const yMax = max(overflow.bottom, 0);
|
|
1426
|
-
if (isYAxis) {
|
|
1427
|
-
availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max(overflow.left, overflow.right));
|
|
1428
|
-
} else {
|
|
1429
|
-
availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max(overflow.top, overflow.bottom));
|
|
1430
|
-
}
|
|
1431
|
-
}
|
|
1432
|
-
await apply({
|
|
1433
|
-
...state,
|
|
1434
|
-
availableWidth,
|
|
1435
|
-
availableHeight
|
|
1436
|
-
});
|
|
1437
|
-
const nextDimensions = await platform.getDimensions(elements.floating);
|
|
1438
|
-
if (width !== nextDimensions.width || height !== nextDimensions.height) {
|
|
1439
|
-
return {
|
|
1440
|
-
reset: {
|
|
1441
|
-
rects: true
|
|
1442
|
-
}
|
|
1443
|
-
};
|
|
1444
|
-
}
|
|
1445
|
-
return {};
|
|
1446
|
-
}
|
|
1447
|
-
};
|
|
1448
|
-
};
|
|
1449
|
-
|
|
1450
|
-
function getNodeName(node) {
|
|
1451
|
-
if (isNode(node)) {
|
|
1452
|
-
return (node.nodeName || '').toLowerCase();
|
|
1453
|
-
}
|
|
1454
|
-
// Mocked nodes in testing environments may not be instances of Node. By
|
|
1455
|
-
// returning `#document` an infinite loop won't occur.
|
|
1456
|
-
// https://github.com/floating-ui/floating-ui/issues/2317
|
|
1457
|
-
return '#document';
|
|
1458
|
-
}
|
|
1459
|
-
function getWindow(node) {
|
|
1460
|
-
var _node$ownerDocument;
|
|
1461
|
-
return (node == null ? void 0 : (_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
|
|
1462
|
-
}
|
|
1463
|
-
function getDocumentElement(node) {
|
|
1464
|
-
var _ref;
|
|
1465
|
-
return (_ref = (isNode(node) ? node.ownerDocument : node.document) || window.document) == null ? void 0 : _ref.documentElement;
|
|
1466
|
-
}
|
|
1467
|
-
function isNode(value) {
|
|
1468
|
-
return value instanceof Node || value instanceof getWindow(value).Node;
|
|
1469
|
-
}
|
|
1470
|
-
function isElement(value) {
|
|
1471
|
-
return value instanceof Element || value instanceof getWindow(value).Element;
|
|
1472
|
-
}
|
|
1473
|
-
function isHTMLElement(value) {
|
|
1474
|
-
return value instanceof HTMLElement || value instanceof getWindow(value).HTMLElement;
|
|
1475
|
-
}
|
|
1476
|
-
function isShadowRoot(value) {
|
|
1477
|
-
// Browsers without `ShadowRoot` support.
|
|
1478
|
-
if (typeof ShadowRoot === 'undefined') {
|
|
1479
|
-
return false;
|
|
1480
|
-
}
|
|
1481
|
-
return value instanceof ShadowRoot || value instanceof getWindow(value).ShadowRoot;
|
|
1482
|
-
}
|
|
1483
|
-
function isOverflowElement(element) {
|
|
1484
|
-
const {
|
|
1485
|
-
overflow,
|
|
1486
|
-
overflowX,
|
|
1487
|
-
overflowY,
|
|
1488
|
-
display
|
|
1489
|
-
} = getComputedStyle$1(element);
|
|
1490
|
-
return /auto|scroll|overlay|hidden|clip/.test(overflow + overflowY + overflowX) && !['inline', 'contents'].includes(display);
|
|
1491
|
-
}
|
|
1492
|
-
function isTableElement(element) {
|
|
1493
|
-
return ['table', 'td', 'th'].includes(getNodeName(element));
|
|
1494
|
-
}
|
|
1495
|
-
function isContainingBlock(element) {
|
|
1496
|
-
const webkit = isWebKit();
|
|
1497
|
-
const css = getComputedStyle$1(element);
|
|
1498
|
-
|
|
1499
|
-
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
1500
|
-
return css.transform !== 'none' || css.perspective !== 'none' || (css.containerType ? css.containerType !== 'normal' : false) || !webkit && (css.backdropFilter ? css.backdropFilter !== 'none' : false) || !webkit && (css.filter ? css.filter !== 'none' : false) || ['transform', 'perspective', 'filter'].some(value => (css.willChange || '').includes(value)) || ['paint', 'layout', 'strict', 'content'].some(value => (css.contain || '').includes(value));
|
|
1501
|
-
}
|
|
1502
|
-
function getContainingBlock(element) {
|
|
1503
|
-
let currentNode = getParentNode(element);
|
|
1504
|
-
while (isHTMLElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
1505
|
-
if (isContainingBlock(currentNode)) {
|
|
1506
|
-
return currentNode;
|
|
1507
|
-
} else {
|
|
1508
|
-
currentNode = getParentNode(currentNode);
|
|
1509
|
-
}
|
|
1510
|
-
}
|
|
1511
|
-
return null;
|
|
1512
|
-
}
|
|
1513
|
-
function isWebKit() {
|
|
1514
|
-
if (typeof CSS === 'undefined' || !CSS.supports) return false;
|
|
1515
|
-
return CSS.supports('-webkit-backdrop-filter', 'none');
|
|
1516
|
-
}
|
|
1517
|
-
function isLastTraversableNode(node) {
|
|
1518
|
-
return ['html', 'body', '#document'].includes(getNodeName(node));
|
|
1519
|
-
}
|
|
1520
|
-
function getComputedStyle$1(element) {
|
|
1521
|
-
return getWindow(element).getComputedStyle(element);
|
|
1522
|
-
}
|
|
1523
|
-
function getNodeScroll(element) {
|
|
1524
|
-
if (isElement(element)) {
|
|
1525
|
-
return {
|
|
1526
|
-
scrollLeft: element.scrollLeft,
|
|
1527
|
-
scrollTop: element.scrollTop
|
|
1528
|
-
};
|
|
1529
|
-
}
|
|
1530
|
-
return {
|
|
1531
|
-
scrollLeft: element.pageXOffset,
|
|
1532
|
-
scrollTop: element.pageYOffset
|
|
1533
|
-
};
|
|
1534
|
-
}
|
|
1535
|
-
function getParentNode(node) {
|
|
1536
|
-
if (getNodeName(node) === 'html') {
|
|
1537
|
-
return node;
|
|
1538
|
-
}
|
|
1539
|
-
const result =
|
|
1540
|
-
// Step into the shadow DOM of the parent of a slotted node.
|
|
1541
|
-
node.assignedSlot ||
|
|
1542
|
-
// DOM Element detected.
|
|
1543
|
-
node.parentNode ||
|
|
1544
|
-
// ShadowRoot detected.
|
|
1545
|
-
isShadowRoot(node) && node.host ||
|
|
1546
|
-
// Fallback.
|
|
1547
|
-
getDocumentElement(node);
|
|
1548
|
-
return isShadowRoot(result) ? result.host : result;
|
|
1549
|
-
}
|
|
1550
|
-
function getNearestOverflowAncestor(node) {
|
|
1551
|
-
const parentNode = getParentNode(node);
|
|
1552
|
-
if (isLastTraversableNode(parentNode)) {
|
|
1553
|
-
return node.ownerDocument ? node.ownerDocument.body : node.body;
|
|
1554
|
-
}
|
|
1555
|
-
if (isHTMLElement(parentNode) && isOverflowElement(parentNode)) {
|
|
1556
|
-
return parentNode;
|
|
1557
|
-
}
|
|
1558
|
-
return getNearestOverflowAncestor(parentNode);
|
|
1559
|
-
}
|
|
1560
|
-
function getOverflowAncestors(node, list, traverseIframes) {
|
|
1561
|
-
var _node$ownerDocument2;
|
|
1562
|
-
if (list === void 0) {
|
|
1563
|
-
list = [];
|
|
1564
|
-
}
|
|
1565
|
-
if (traverseIframes === void 0) {
|
|
1566
|
-
traverseIframes = true;
|
|
1567
|
-
}
|
|
1568
|
-
const scrollableAncestor = getNearestOverflowAncestor(node);
|
|
1569
|
-
const isBody = scrollableAncestor === ((_node$ownerDocument2 = node.ownerDocument) == null ? void 0 : _node$ownerDocument2.body);
|
|
1570
|
-
const win = getWindow(scrollableAncestor);
|
|
1571
|
-
if (isBody) {
|
|
1572
|
-
return list.concat(win, win.visualViewport || [], isOverflowElement(scrollableAncestor) ? scrollableAncestor : [], win.frameElement && traverseIframes ? getOverflowAncestors(win.frameElement) : []);
|
|
1573
|
-
}
|
|
1574
|
-
return list.concat(scrollableAncestor, getOverflowAncestors(scrollableAncestor, [], traverseIframes));
|
|
1575
|
-
}
|
|
1576
|
-
|
|
1577
|
-
function getCssDimensions(element) {
|
|
1578
|
-
const css = getComputedStyle$1(element);
|
|
1579
|
-
// In testing environments, the `width` and `height` properties are empty
|
|
1580
|
-
// strings for SVG elements, returning NaN. Fallback to `0` in this case.
|
|
1581
|
-
let width = parseFloat(css.width) || 0;
|
|
1582
|
-
let height = parseFloat(css.height) || 0;
|
|
1583
|
-
const hasOffset = isHTMLElement(element);
|
|
1584
|
-
const offsetWidth = hasOffset ? element.offsetWidth : width;
|
|
1585
|
-
const offsetHeight = hasOffset ? element.offsetHeight : height;
|
|
1586
|
-
const shouldFallback = round(width) !== offsetWidth || round(height) !== offsetHeight;
|
|
1587
|
-
if (shouldFallback) {
|
|
1588
|
-
width = offsetWidth;
|
|
1589
|
-
height = offsetHeight;
|
|
1590
|
-
}
|
|
1591
|
-
return {
|
|
1592
|
-
width,
|
|
1593
|
-
height,
|
|
1594
|
-
$: shouldFallback
|
|
1595
|
-
};
|
|
1596
|
-
}
|
|
1597
|
-
|
|
1598
|
-
function unwrapElement(element) {
|
|
1599
|
-
return !isElement(element) ? element.contextElement : element;
|
|
1600
|
-
}
|
|
1601
|
-
|
|
1602
|
-
function getScale(element) {
|
|
1603
|
-
const domElement = unwrapElement(element);
|
|
1604
|
-
if (!isHTMLElement(domElement)) {
|
|
1605
|
-
return createCoords(1);
|
|
1606
|
-
}
|
|
1607
|
-
const rect = domElement.getBoundingClientRect();
|
|
1608
|
-
const {
|
|
1609
|
-
width,
|
|
1610
|
-
height,
|
|
1611
|
-
$
|
|
1612
|
-
} = getCssDimensions(domElement);
|
|
1613
|
-
let x = ($ ? round(rect.width) : rect.width) / width;
|
|
1614
|
-
let y = ($ ? round(rect.height) : rect.height) / height;
|
|
1615
|
-
|
|
1616
|
-
// 0, NaN, or Infinity should always fallback to 1.
|
|
1617
|
-
|
|
1618
|
-
if (!x || !Number.isFinite(x)) {
|
|
1619
|
-
x = 1;
|
|
1620
|
-
}
|
|
1621
|
-
if (!y || !Number.isFinite(y)) {
|
|
1622
|
-
y = 1;
|
|
1623
|
-
}
|
|
1624
|
-
return {
|
|
1625
|
-
x,
|
|
1626
|
-
y
|
|
1627
|
-
};
|
|
1628
|
-
}
|
|
1629
|
-
|
|
1630
|
-
const noOffsets = /*#__PURE__*/createCoords(0);
|
|
1631
|
-
function getVisualOffsets(element) {
|
|
1632
|
-
const win = getWindow(element);
|
|
1633
|
-
if (!isWebKit() || !win.visualViewport) {
|
|
1634
|
-
return noOffsets;
|
|
1635
|
-
}
|
|
1636
|
-
return {
|
|
1637
|
-
x: win.visualViewport.offsetLeft,
|
|
1638
|
-
y: win.visualViewport.offsetTop
|
|
1639
|
-
};
|
|
1640
|
-
}
|
|
1641
|
-
function shouldAddVisualOffsets(element, isFixed, floatingOffsetParent) {
|
|
1642
|
-
if (isFixed === void 0) {
|
|
1643
|
-
isFixed = false;
|
|
1644
|
-
}
|
|
1645
|
-
if (!floatingOffsetParent || isFixed && floatingOffsetParent !== getWindow(element)) {
|
|
1646
|
-
return false;
|
|
1647
|
-
}
|
|
1648
|
-
return isFixed;
|
|
1649
|
-
}
|
|
1650
|
-
|
|
1651
|
-
function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetParent) {
|
|
1652
|
-
if (includeScale === void 0) {
|
|
1653
|
-
includeScale = false;
|
|
1654
|
-
}
|
|
1655
|
-
if (isFixedStrategy === void 0) {
|
|
1656
|
-
isFixedStrategy = false;
|
|
1657
|
-
}
|
|
1658
|
-
const clientRect = element.getBoundingClientRect();
|
|
1659
|
-
const domElement = unwrapElement(element);
|
|
1660
|
-
let scale = createCoords(1);
|
|
1661
|
-
if (includeScale) {
|
|
1662
|
-
if (offsetParent) {
|
|
1663
|
-
if (isElement(offsetParent)) {
|
|
1664
|
-
scale = getScale(offsetParent);
|
|
1665
|
-
}
|
|
1666
|
-
} else {
|
|
1667
|
-
scale = getScale(element);
|
|
1668
|
-
}
|
|
1669
|
-
}
|
|
1670
|
-
const visualOffsets = shouldAddVisualOffsets(domElement, isFixedStrategy, offsetParent) ? getVisualOffsets(domElement) : createCoords(0);
|
|
1671
|
-
let x = (clientRect.left + visualOffsets.x) / scale.x;
|
|
1672
|
-
let y = (clientRect.top + visualOffsets.y) / scale.y;
|
|
1673
|
-
let width = clientRect.width / scale.x;
|
|
1674
|
-
let height = clientRect.height / scale.y;
|
|
1675
|
-
if (domElement) {
|
|
1676
|
-
const win = getWindow(domElement);
|
|
1677
|
-
const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
|
|
1678
|
-
let currentIFrame = win.frameElement;
|
|
1679
|
-
while (currentIFrame && offsetParent && offsetWin !== win) {
|
|
1680
|
-
const iframeScale = getScale(currentIFrame);
|
|
1681
|
-
const iframeRect = currentIFrame.getBoundingClientRect();
|
|
1682
|
-
const css = getComputedStyle$1(currentIFrame);
|
|
1683
|
-
const left = iframeRect.left + (currentIFrame.clientLeft + parseFloat(css.paddingLeft)) * iframeScale.x;
|
|
1684
|
-
const top = iframeRect.top + (currentIFrame.clientTop + parseFloat(css.paddingTop)) * iframeScale.y;
|
|
1685
|
-
x *= iframeScale.x;
|
|
1686
|
-
y *= iframeScale.y;
|
|
1687
|
-
width *= iframeScale.x;
|
|
1688
|
-
height *= iframeScale.y;
|
|
1689
|
-
x += left;
|
|
1690
|
-
y += top;
|
|
1691
|
-
currentIFrame = getWindow(currentIFrame).frameElement;
|
|
1692
|
-
}
|
|
1693
|
-
}
|
|
1694
|
-
return rectToClientRect({
|
|
1695
|
-
width,
|
|
1696
|
-
height,
|
|
1697
|
-
x,
|
|
1698
|
-
y
|
|
1699
|
-
});
|
|
1700
|
-
}
|
|
1701
|
-
|
|
1702
|
-
function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
|
|
1703
|
-
let {
|
|
1704
|
-
rect,
|
|
1705
|
-
offsetParent,
|
|
1706
|
-
strategy
|
|
1707
|
-
} = _ref;
|
|
1708
|
-
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
1709
|
-
const documentElement = getDocumentElement(offsetParent);
|
|
1710
|
-
if (offsetParent === documentElement) {
|
|
1711
|
-
return rect;
|
|
1712
|
-
}
|
|
1713
|
-
let scroll = {
|
|
1714
|
-
scrollLeft: 0,
|
|
1715
|
-
scrollTop: 0
|
|
1716
|
-
};
|
|
1717
|
-
let scale = createCoords(1);
|
|
1718
|
-
const offsets = createCoords(0);
|
|
1719
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== 'fixed') {
|
|
1720
|
-
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
1721
|
-
scroll = getNodeScroll(offsetParent);
|
|
1722
|
-
}
|
|
1723
|
-
if (isHTMLElement(offsetParent)) {
|
|
1724
|
-
const offsetRect = getBoundingClientRect(offsetParent);
|
|
1725
|
-
scale = getScale(offsetParent);
|
|
1726
|
-
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
1727
|
-
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
1728
|
-
}
|
|
1729
|
-
}
|
|
1730
|
-
return {
|
|
1731
|
-
width: rect.width * scale.x,
|
|
1732
|
-
height: rect.height * scale.y,
|
|
1733
|
-
x: rect.x * scale.x - scroll.scrollLeft * scale.x + offsets.x,
|
|
1734
|
-
y: rect.y * scale.y - scroll.scrollTop * scale.y + offsets.y
|
|
1735
|
-
};
|
|
1736
|
-
}
|
|
1737
|
-
|
|
1738
|
-
function getClientRects(element) {
|
|
1739
|
-
return Array.from(element.getClientRects());
|
|
1740
|
-
}
|
|
1741
|
-
|
|
1742
|
-
function getWindowScrollBarX(element) {
|
|
1743
|
-
// If <html> has a CSS width greater than the viewport, then this will be
|
|
1744
|
-
// incorrect for RTL.
|
|
1745
|
-
return getBoundingClientRect(getDocumentElement(element)).left + getNodeScroll(element).scrollLeft;
|
|
1746
|
-
}
|
|
1747
|
-
|
|
1748
|
-
// Gets the entire size of the scrollable document area, even extending outside
|
|
1749
|
-
// of the `<html>` and `<body>` rect bounds if horizontally scrollable.
|
|
1750
|
-
function getDocumentRect(element) {
|
|
1751
|
-
const html = getDocumentElement(element);
|
|
1752
|
-
const scroll = getNodeScroll(element);
|
|
1753
|
-
const body = element.ownerDocument.body;
|
|
1754
|
-
const width = max(html.scrollWidth, html.clientWidth, body.scrollWidth, body.clientWidth);
|
|
1755
|
-
const height = max(html.scrollHeight, html.clientHeight, body.scrollHeight, body.clientHeight);
|
|
1756
|
-
let x = -scroll.scrollLeft + getWindowScrollBarX(element);
|
|
1757
|
-
const y = -scroll.scrollTop;
|
|
1758
|
-
if (getComputedStyle$1(body).direction === 'rtl') {
|
|
1759
|
-
x += max(html.clientWidth, body.clientWidth) - width;
|
|
1760
|
-
}
|
|
1761
|
-
return {
|
|
1762
|
-
width,
|
|
1763
|
-
height,
|
|
1764
|
-
x,
|
|
1765
|
-
y
|
|
1766
|
-
};
|
|
1767
|
-
}
|
|
1768
|
-
|
|
1769
|
-
function getViewportRect(element, strategy) {
|
|
1770
|
-
const win = getWindow(element);
|
|
1771
|
-
const html = getDocumentElement(element);
|
|
1772
|
-
const visualViewport = win.visualViewport;
|
|
1773
|
-
let width = html.clientWidth;
|
|
1774
|
-
let height = html.clientHeight;
|
|
1775
|
-
let x = 0;
|
|
1776
|
-
let y = 0;
|
|
1777
|
-
if (visualViewport) {
|
|
1778
|
-
width = visualViewport.width;
|
|
1779
|
-
height = visualViewport.height;
|
|
1780
|
-
const visualViewportBased = isWebKit();
|
|
1781
|
-
if (!visualViewportBased || visualViewportBased && strategy === 'fixed') {
|
|
1782
|
-
x = visualViewport.offsetLeft;
|
|
1783
|
-
y = visualViewport.offsetTop;
|
|
1784
|
-
}
|
|
1785
|
-
}
|
|
1786
|
-
return {
|
|
1787
|
-
width,
|
|
1788
|
-
height,
|
|
1789
|
-
x,
|
|
1790
|
-
y
|
|
1791
|
-
};
|
|
1792
|
-
}
|
|
1793
|
-
|
|
1794
|
-
// Returns the inner client rect, subtracting scrollbars if present.
|
|
1795
|
-
function getInnerBoundingClientRect(element, strategy) {
|
|
1796
|
-
const clientRect = getBoundingClientRect(element, true, strategy === 'fixed');
|
|
1797
|
-
const top = clientRect.top + element.clientTop;
|
|
1798
|
-
const left = clientRect.left + element.clientLeft;
|
|
1799
|
-
const scale = isHTMLElement(element) ? getScale(element) : createCoords(1);
|
|
1800
|
-
const width = element.clientWidth * scale.x;
|
|
1801
|
-
const height = element.clientHeight * scale.y;
|
|
1802
|
-
const x = left * scale.x;
|
|
1803
|
-
const y = top * scale.y;
|
|
1804
|
-
return {
|
|
1805
|
-
width,
|
|
1806
|
-
height,
|
|
1807
|
-
x,
|
|
1808
|
-
y
|
|
1809
|
-
};
|
|
1810
|
-
}
|
|
1811
|
-
function getClientRectFromClippingAncestor(element, clippingAncestor, strategy) {
|
|
1812
|
-
let rect;
|
|
1813
|
-
if (clippingAncestor === 'viewport') {
|
|
1814
|
-
rect = getViewportRect(element, strategy);
|
|
1815
|
-
} else if (clippingAncestor === 'document') {
|
|
1816
|
-
rect = getDocumentRect(getDocumentElement(element));
|
|
1817
|
-
} else if (isElement(clippingAncestor)) {
|
|
1818
|
-
rect = getInnerBoundingClientRect(clippingAncestor, strategy);
|
|
1819
|
-
} else {
|
|
1820
|
-
const visualOffsets = getVisualOffsets(element);
|
|
1821
|
-
rect = {
|
|
1822
|
-
...clippingAncestor,
|
|
1823
|
-
x: clippingAncestor.x - visualOffsets.x,
|
|
1824
|
-
y: clippingAncestor.y - visualOffsets.y
|
|
1825
|
-
};
|
|
1826
|
-
}
|
|
1827
|
-
return rectToClientRect(rect);
|
|
1828
|
-
}
|
|
1829
|
-
function hasFixedPositionAncestor(element, stopNode) {
|
|
1830
|
-
const parentNode = getParentNode(element);
|
|
1831
|
-
if (parentNode === stopNode || !isElement(parentNode) || isLastTraversableNode(parentNode)) {
|
|
1832
|
-
return false;
|
|
1833
|
-
}
|
|
1834
|
-
return getComputedStyle$1(parentNode).position === 'fixed' || hasFixedPositionAncestor(parentNode, stopNode);
|
|
1835
|
-
}
|
|
1836
|
-
|
|
1837
|
-
// A "clipping ancestor" is an `overflow` element with the characteristic of
|
|
1838
|
-
// clipping (or hiding) child elements. This returns all clipping ancestors
|
|
1839
|
-
// of the given element up the tree.
|
|
1840
|
-
function getClippingElementAncestors(element, cache) {
|
|
1841
|
-
const cachedResult = cache.get(element);
|
|
1842
|
-
if (cachedResult) {
|
|
1843
|
-
return cachedResult;
|
|
1844
|
-
}
|
|
1845
|
-
let result = getOverflowAncestors(element, [], false).filter(el => isElement(el) && getNodeName(el) !== 'body');
|
|
1846
|
-
let currentContainingBlockComputedStyle = null;
|
|
1847
|
-
const elementIsFixed = getComputedStyle$1(element).position === 'fixed';
|
|
1848
|
-
let currentNode = elementIsFixed ? getParentNode(element) : element;
|
|
1849
|
-
|
|
1850
|
-
// https://developer.mozilla.org/en-US/docs/Web/CSS/Containing_block#identifying_the_containing_block
|
|
1851
|
-
while (isElement(currentNode) && !isLastTraversableNode(currentNode)) {
|
|
1852
|
-
const computedStyle = getComputedStyle$1(currentNode);
|
|
1853
|
-
const currentNodeIsContaining = isContainingBlock(currentNode);
|
|
1854
|
-
if (!currentNodeIsContaining && computedStyle.position === 'fixed') {
|
|
1855
|
-
currentContainingBlockComputedStyle = null;
|
|
1856
|
-
}
|
|
1857
|
-
const shouldDropCurrentNode = elementIsFixed ? !currentNodeIsContaining && !currentContainingBlockComputedStyle : !currentNodeIsContaining && computedStyle.position === 'static' && !!currentContainingBlockComputedStyle && ['absolute', 'fixed'].includes(currentContainingBlockComputedStyle.position) || isOverflowElement(currentNode) && !currentNodeIsContaining && hasFixedPositionAncestor(element, currentNode);
|
|
1858
|
-
if (shouldDropCurrentNode) {
|
|
1859
|
-
// Drop non-containing blocks.
|
|
1860
|
-
result = result.filter(ancestor => ancestor !== currentNode);
|
|
1861
|
-
} else {
|
|
1862
|
-
// Record last containing block for next iteration.
|
|
1863
|
-
currentContainingBlockComputedStyle = computedStyle;
|
|
1864
|
-
}
|
|
1865
|
-
currentNode = getParentNode(currentNode);
|
|
1866
|
-
}
|
|
1867
|
-
cache.set(element, result);
|
|
1868
|
-
return result;
|
|
1869
|
-
}
|
|
1870
|
-
|
|
1871
|
-
// Gets the maximum area that the element is visible in due to any number of
|
|
1872
|
-
// clipping ancestors.
|
|
1873
|
-
function getClippingRect(_ref) {
|
|
1874
|
-
let {
|
|
1875
|
-
element,
|
|
1876
|
-
boundary,
|
|
1877
|
-
rootBoundary,
|
|
1878
|
-
strategy
|
|
1879
|
-
} = _ref;
|
|
1880
|
-
const elementClippingAncestors = boundary === 'clippingAncestors' ? getClippingElementAncestors(element, this._c) : [].concat(boundary);
|
|
1881
|
-
const clippingAncestors = [...elementClippingAncestors, rootBoundary];
|
|
1882
|
-
const firstClippingAncestor = clippingAncestors[0];
|
|
1883
|
-
const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
|
|
1884
|
-
const rect = getClientRectFromClippingAncestor(element, clippingAncestor, strategy);
|
|
1885
|
-
accRect.top = max(rect.top, accRect.top);
|
|
1886
|
-
accRect.right = min(rect.right, accRect.right);
|
|
1887
|
-
accRect.bottom = min(rect.bottom, accRect.bottom);
|
|
1888
|
-
accRect.left = max(rect.left, accRect.left);
|
|
1889
|
-
return accRect;
|
|
1890
|
-
}, getClientRectFromClippingAncestor(element, firstClippingAncestor, strategy));
|
|
1891
|
-
return {
|
|
1892
|
-
width: clippingRect.right - clippingRect.left,
|
|
1893
|
-
height: clippingRect.bottom - clippingRect.top,
|
|
1894
|
-
x: clippingRect.left,
|
|
1895
|
-
y: clippingRect.top
|
|
1896
|
-
};
|
|
1897
|
-
}
|
|
1898
|
-
|
|
1899
|
-
function getDimensions(element) {
|
|
1900
|
-
return getCssDimensions(element);
|
|
1901
|
-
}
|
|
1902
|
-
|
|
1903
|
-
function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
|
|
1904
|
-
const isOffsetParentAnElement = isHTMLElement(offsetParent);
|
|
1905
|
-
const documentElement = getDocumentElement(offsetParent);
|
|
1906
|
-
const isFixed = strategy === 'fixed';
|
|
1907
|
-
const rect = getBoundingClientRect(element, true, isFixed, offsetParent);
|
|
1908
|
-
let scroll = {
|
|
1909
|
-
scrollLeft: 0,
|
|
1910
|
-
scrollTop: 0
|
|
1911
|
-
};
|
|
1912
|
-
const offsets = createCoords(0);
|
|
1913
|
-
if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
|
|
1914
|
-
if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
|
|
1915
|
-
scroll = getNodeScroll(offsetParent);
|
|
1916
|
-
}
|
|
1917
|
-
if (isOffsetParentAnElement) {
|
|
1918
|
-
const offsetRect = getBoundingClientRect(offsetParent, true, isFixed, offsetParent);
|
|
1919
|
-
offsets.x = offsetRect.x + offsetParent.clientLeft;
|
|
1920
|
-
offsets.y = offsetRect.y + offsetParent.clientTop;
|
|
1921
|
-
} else if (documentElement) {
|
|
1922
|
-
offsets.x = getWindowScrollBarX(documentElement);
|
|
1923
|
-
}
|
|
1924
|
-
}
|
|
1925
|
-
return {
|
|
1926
|
-
x: rect.left + scroll.scrollLeft - offsets.x,
|
|
1927
|
-
y: rect.top + scroll.scrollTop - offsets.y,
|
|
1928
|
-
width: rect.width,
|
|
1929
|
-
height: rect.height
|
|
1930
|
-
};
|
|
1931
|
-
}
|
|
1932
|
-
|
|
1933
|
-
function getTrueOffsetParent(element, polyfill) {
|
|
1934
|
-
if (!isHTMLElement(element) || getComputedStyle$1(element).position === 'fixed') {
|
|
1935
|
-
return null;
|
|
1936
|
-
}
|
|
1937
|
-
if (polyfill) {
|
|
1938
|
-
return polyfill(element);
|
|
1939
|
-
}
|
|
1940
|
-
return element.offsetParent;
|
|
1941
|
-
}
|
|
1942
|
-
|
|
1943
|
-
// Gets the closest ancestor positioned element. Handles some edge cases,
|
|
1944
|
-
// such as table ancestors and cross browser bugs.
|
|
1945
|
-
function getOffsetParent(element, polyfill) {
|
|
1946
|
-
const window = getWindow(element);
|
|
1947
|
-
if (!isHTMLElement(element)) {
|
|
1948
|
-
return window;
|
|
1949
|
-
}
|
|
1950
|
-
let offsetParent = getTrueOffsetParent(element, polyfill);
|
|
1951
|
-
while (offsetParent && isTableElement(offsetParent) && getComputedStyle$1(offsetParent).position === 'static') {
|
|
1952
|
-
offsetParent = getTrueOffsetParent(offsetParent, polyfill);
|
|
1953
|
-
}
|
|
1954
|
-
if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle$1(offsetParent).position === 'static' && !isContainingBlock(offsetParent))) {
|
|
1955
|
-
return window;
|
|
1956
|
-
}
|
|
1957
|
-
return offsetParent || getContainingBlock(element) || window;
|
|
1958
|
-
}
|
|
1959
|
-
|
|
1960
|
-
const getElementRects = async function (_ref) {
|
|
1961
|
-
let {
|
|
1962
|
-
reference,
|
|
1963
|
-
floating,
|
|
1964
|
-
strategy
|
|
1965
|
-
} = _ref;
|
|
1966
|
-
const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
|
|
1967
|
-
const getDimensionsFn = this.getDimensions;
|
|
1968
|
-
return {
|
|
1969
|
-
reference: getRectRelativeToOffsetParent(reference, await getOffsetParentFn(floating), strategy),
|
|
1970
|
-
floating: {
|
|
1971
|
-
x: 0,
|
|
1972
|
-
y: 0,
|
|
1973
|
-
...(await getDimensionsFn(floating))
|
|
1974
|
-
}
|
|
1975
|
-
};
|
|
1976
|
-
};
|
|
1977
|
-
|
|
1978
|
-
function isRTL(element) {
|
|
1979
|
-
return getComputedStyle$1(element).direction === 'rtl';
|
|
1980
|
-
}
|
|
1981
|
-
|
|
1982
|
-
const platform = {
|
|
1983
|
-
convertOffsetParentRelativeRectToViewportRelativeRect,
|
|
1984
|
-
getDocumentElement,
|
|
1985
|
-
getClippingRect,
|
|
1986
|
-
getOffsetParent,
|
|
1987
|
-
getElementRects,
|
|
1988
|
-
getClientRects,
|
|
1989
|
-
getDimensions,
|
|
1990
|
-
getScale,
|
|
1991
|
-
isElement,
|
|
1992
|
-
isRTL
|
|
1993
|
-
};
|
|
1994
|
-
|
|
1995
|
-
// https://samthor.au/2021/observing-dom/
|
|
1996
|
-
function observeMove(element, onMove) {
|
|
1997
|
-
let io = null;
|
|
1998
|
-
let timeoutId;
|
|
1999
|
-
const root = getDocumentElement(element);
|
|
2000
|
-
function cleanup() {
|
|
2001
|
-
clearTimeout(timeoutId);
|
|
2002
|
-
io && io.disconnect();
|
|
2003
|
-
io = null;
|
|
2004
|
-
}
|
|
2005
|
-
function refresh(skip, threshold) {
|
|
2006
|
-
if (skip === void 0) {
|
|
2007
|
-
skip = false;
|
|
2008
|
-
}
|
|
2009
|
-
if (threshold === void 0) {
|
|
2010
|
-
threshold = 1;
|
|
2011
|
-
}
|
|
2012
|
-
cleanup();
|
|
2013
|
-
const {
|
|
2014
|
-
left,
|
|
2015
|
-
top,
|
|
2016
|
-
width,
|
|
2017
|
-
height
|
|
2018
|
-
} = element.getBoundingClientRect();
|
|
2019
|
-
if (!skip) {
|
|
2020
|
-
onMove();
|
|
2021
|
-
}
|
|
2022
|
-
if (!width || !height) {
|
|
2023
|
-
return;
|
|
2024
|
-
}
|
|
2025
|
-
const insetTop = floor(top);
|
|
2026
|
-
const insetRight = floor(root.clientWidth - (left + width));
|
|
2027
|
-
const insetBottom = floor(root.clientHeight - (top + height));
|
|
2028
|
-
const insetLeft = floor(left);
|
|
2029
|
-
const rootMargin = -insetTop + "px " + -insetRight + "px " + -insetBottom + "px " + -insetLeft + "px";
|
|
2030
|
-
const options = {
|
|
2031
|
-
rootMargin,
|
|
2032
|
-
threshold: max(0, min(1, threshold)) || 1
|
|
2033
|
-
};
|
|
2034
|
-
let isFirstUpdate = true;
|
|
2035
|
-
function handleObserve(entries) {
|
|
2036
|
-
const ratio = entries[0].intersectionRatio;
|
|
2037
|
-
if (ratio !== threshold) {
|
|
2038
|
-
if (!isFirstUpdate) {
|
|
2039
|
-
return refresh();
|
|
2040
|
-
}
|
|
2041
|
-
if (!ratio) {
|
|
2042
|
-
timeoutId = setTimeout(() => {
|
|
2043
|
-
refresh(false, 1e-7);
|
|
2044
|
-
}, 100);
|
|
2045
|
-
} else {
|
|
2046
|
-
refresh(false, ratio);
|
|
2047
|
-
}
|
|
2048
|
-
}
|
|
2049
|
-
isFirstUpdate = false;
|
|
2050
|
-
}
|
|
2051
|
-
|
|
2052
|
-
// Older browsers don't support a `document` as the root and will throw an
|
|
2053
|
-
// error.
|
|
2054
|
-
try {
|
|
2055
|
-
io = new IntersectionObserver(handleObserve, {
|
|
2056
|
-
...options,
|
|
2057
|
-
// Handle <iframe>s
|
|
2058
|
-
root: root.ownerDocument
|
|
2059
|
-
});
|
|
2060
|
-
} catch (e) {
|
|
2061
|
-
io = new IntersectionObserver(handleObserve, options);
|
|
2062
|
-
}
|
|
2063
|
-
io.observe(element);
|
|
2064
|
-
}
|
|
2065
|
-
refresh(true);
|
|
2066
|
-
return cleanup;
|
|
2067
|
-
}
|
|
2068
|
-
|
|
2069
|
-
/**
|
|
2070
|
-
* Automatically updates the position of the floating element when necessary.
|
|
2071
|
-
* Should only be called when the floating element is mounted on the DOM or
|
|
2072
|
-
* visible on the screen.
|
|
2073
|
-
* @returns cleanup function that should be invoked when the floating element is
|
|
2074
|
-
* removed from the DOM or hidden from the screen.
|
|
2075
|
-
* @see https://floating-ui.com/docs/autoUpdate
|
|
2076
|
-
*/
|
|
2077
|
-
function autoUpdate(reference, floating, update, options) {
|
|
2078
|
-
if (options === void 0) {
|
|
2079
|
-
options = {};
|
|
2080
|
-
}
|
|
2081
|
-
const {
|
|
2082
|
-
ancestorScroll = true,
|
|
2083
|
-
ancestorResize = true,
|
|
2084
|
-
elementResize = typeof ResizeObserver === 'function',
|
|
2085
|
-
layoutShift = typeof IntersectionObserver === 'function',
|
|
2086
|
-
animationFrame = false
|
|
2087
|
-
} = options;
|
|
2088
|
-
const referenceEl = unwrapElement(reference);
|
|
2089
|
-
const ancestors = ancestorScroll || ancestorResize ? [...(referenceEl ? getOverflowAncestors(referenceEl) : []), ...getOverflowAncestors(floating)] : [];
|
|
2090
|
-
ancestors.forEach(ancestor => {
|
|
2091
|
-
ancestorScroll && ancestor.addEventListener('scroll', update, {
|
|
2092
|
-
passive: true
|
|
2093
|
-
});
|
|
2094
|
-
ancestorResize && ancestor.addEventListener('resize', update);
|
|
2095
|
-
});
|
|
2096
|
-
const cleanupIo = referenceEl && layoutShift ? observeMove(referenceEl, update) : null;
|
|
2097
|
-
let reobserveFrame = -1;
|
|
2098
|
-
let resizeObserver = null;
|
|
2099
|
-
if (elementResize) {
|
|
2100
|
-
resizeObserver = new ResizeObserver(_ref => {
|
|
2101
|
-
let [firstEntry] = _ref;
|
|
2102
|
-
if (firstEntry && firstEntry.target === referenceEl && resizeObserver) {
|
|
2103
|
-
// Prevent update loops when using the `size` middleware.
|
|
2104
|
-
// https://github.com/floating-ui/floating-ui/issues/1740
|
|
2105
|
-
resizeObserver.unobserve(floating);
|
|
2106
|
-
cancelAnimationFrame(reobserveFrame);
|
|
2107
|
-
reobserveFrame = requestAnimationFrame(() => {
|
|
2108
|
-
resizeObserver && resizeObserver.observe(floating);
|
|
2109
|
-
});
|
|
2110
|
-
}
|
|
2111
|
-
update();
|
|
2112
|
-
});
|
|
2113
|
-
if (referenceEl && !animationFrame) {
|
|
2114
|
-
resizeObserver.observe(referenceEl);
|
|
2115
|
-
}
|
|
2116
|
-
resizeObserver.observe(floating);
|
|
2117
|
-
}
|
|
2118
|
-
let frameId;
|
|
2119
|
-
let prevRefRect = animationFrame ? getBoundingClientRect(reference) : null;
|
|
2120
|
-
if (animationFrame) {
|
|
2121
|
-
frameLoop();
|
|
2122
|
-
}
|
|
2123
|
-
function frameLoop() {
|
|
2124
|
-
const nextRefRect = getBoundingClientRect(reference);
|
|
2125
|
-
if (prevRefRect && (nextRefRect.x !== prevRefRect.x || nextRefRect.y !== prevRefRect.y || nextRefRect.width !== prevRefRect.width || nextRefRect.height !== prevRefRect.height)) {
|
|
2126
|
-
update();
|
|
2127
|
-
}
|
|
2128
|
-
prevRefRect = nextRefRect;
|
|
2129
|
-
frameId = requestAnimationFrame(frameLoop);
|
|
2130
|
-
}
|
|
2131
|
-
update();
|
|
2132
|
-
return () => {
|
|
2133
|
-
ancestors.forEach(ancestor => {
|
|
2134
|
-
ancestorScroll && ancestor.removeEventListener('scroll', update);
|
|
2135
|
-
ancestorResize && ancestor.removeEventListener('resize', update);
|
|
2136
|
-
});
|
|
2137
|
-
cleanupIo && cleanupIo();
|
|
2138
|
-
resizeObserver && resizeObserver.disconnect();
|
|
2139
|
-
resizeObserver = null;
|
|
2140
|
-
if (animationFrame) {
|
|
2141
|
-
cancelAnimationFrame(frameId);
|
|
2142
|
-
}
|
|
2143
|
-
};
|
|
2144
|
-
}
|
|
2145
|
-
|
|
2146
|
-
/**
|
|
2147
|
-
* Computes the `x` and `y` coordinates that will place the floating element
|
|
2148
|
-
* next to a reference element when it is given a certain CSS positioning
|
|
2149
|
-
* strategy.
|
|
2150
|
-
*/
|
|
2151
|
-
const computePosition = (reference, floating, options) => {
|
|
2152
|
-
// This caches the expensive `getClippingElementAncestors` function so that
|
|
2153
|
-
// multiple lifecycle resets re-use the same result. It only lives for a
|
|
2154
|
-
// single call. If other functions become expensive, we can add them as well.
|
|
2155
|
-
const cache = new Map();
|
|
2156
|
-
const mergedOptions = {
|
|
2157
|
-
platform,
|
|
2158
|
-
...options
|
|
2159
|
-
};
|
|
2160
|
-
const platformWithCache = {
|
|
2161
|
-
...mergedOptions.platform,
|
|
2162
|
-
_c: cache
|
|
2163
|
-
};
|
|
2164
|
-
return computePosition$1(reference, floating, {
|
|
2165
|
-
...mergedOptions,
|
|
2166
|
-
platform: platformWithCache
|
|
2167
|
-
});
|
|
2168
|
-
};
|
|
2169
|
-
|
|
2170
|
-
/**
|
|
2171
|
-
* Provides data to position an inner element of the floating element so that it
|
|
2172
|
-
* appears centered to the reference element.
|
|
2173
|
-
* This wraps the core `arrow` middleware to allow React refs as the element.
|
|
2174
|
-
* @see https://floating-ui.com/docs/arrow
|
|
2175
|
-
*/
|
|
2176
|
-
const arrow = options => {
|
|
2177
|
-
function isRef(value) {
|
|
2178
|
-
return {}.hasOwnProperty.call(value, 'current');
|
|
2179
|
-
}
|
|
2180
|
-
return {
|
|
2181
|
-
name: 'arrow',
|
|
2182
|
-
options,
|
|
2183
|
-
fn(state) {
|
|
2184
|
-
const {
|
|
2185
|
-
element,
|
|
2186
|
-
padding
|
|
2187
|
-
} = typeof options === 'function' ? options(state) : options;
|
|
2188
|
-
if (element && isRef(element)) {
|
|
2189
|
-
if (element.current != null) {
|
|
2190
|
-
return arrow$1({
|
|
2191
|
-
element: element.current,
|
|
2192
|
-
padding
|
|
2193
|
-
}).fn(state);
|
|
2194
|
-
}
|
|
2195
|
-
return {};
|
|
2196
|
-
} else if (element) {
|
|
2197
|
-
return arrow$1({
|
|
2198
|
-
element,
|
|
2199
|
-
padding
|
|
2200
|
-
}).fn(state);
|
|
2201
|
-
}
|
|
2202
|
-
return {};
|
|
2203
|
-
}
|
|
2204
|
-
};
|
|
2205
|
-
};
|
|
2206
|
-
|
|
2207
|
-
var index = typeof document !== 'undefined' ? React.useLayoutEffect : React.useEffect;
|
|
2208
|
-
|
|
2209
|
-
// Fork of `fast-deep-equal` that only does the comparisons we need and compares
|
|
2210
|
-
// functions
|
|
2211
|
-
function deepEqual(a, b) {
|
|
2212
|
-
if (a === b) {
|
|
2213
|
-
return true;
|
|
2214
|
-
}
|
|
2215
|
-
if (typeof a !== typeof b) {
|
|
2216
|
-
return false;
|
|
2217
|
-
}
|
|
2218
|
-
if (typeof a === 'function' && a.toString() === b.toString()) {
|
|
2219
|
-
return true;
|
|
2220
|
-
}
|
|
2221
|
-
let length, i, keys;
|
|
2222
|
-
if (a && b && typeof a == 'object') {
|
|
2223
|
-
if (Array.isArray(a)) {
|
|
2224
|
-
length = a.length;
|
|
2225
|
-
if (length != b.length) return false;
|
|
2226
|
-
for (i = length; i-- !== 0;) {
|
|
2227
|
-
if (!deepEqual(a[i], b[i])) {
|
|
2228
|
-
return false;
|
|
2229
|
-
}
|
|
2230
|
-
}
|
|
2231
|
-
return true;
|
|
2232
|
-
}
|
|
2233
|
-
keys = Object.keys(a);
|
|
2234
|
-
length = keys.length;
|
|
2235
|
-
if (length !== Object.keys(b).length) {
|
|
2236
|
-
return false;
|
|
2237
|
-
}
|
|
2238
|
-
for (i = length; i-- !== 0;) {
|
|
2239
|
-
if (!{}.hasOwnProperty.call(b, keys[i])) {
|
|
2240
|
-
return false;
|
|
2241
|
-
}
|
|
2242
|
-
}
|
|
2243
|
-
for (i = length; i-- !== 0;) {
|
|
2244
|
-
const key = keys[i];
|
|
2245
|
-
if (key === '_owner' && a.$$typeof) {
|
|
2246
|
-
continue;
|
|
2247
|
-
}
|
|
2248
|
-
if (!deepEqual(a[key], b[key])) {
|
|
2249
|
-
return false;
|
|
2250
|
-
}
|
|
2251
|
-
}
|
|
2252
|
-
return true;
|
|
2253
|
-
}
|
|
2254
|
-
return a !== a && b !== b;
|
|
2255
|
-
}
|
|
2256
|
-
|
|
2257
|
-
function getDPR(element) {
|
|
2258
|
-
if (typeof window === 'undefined') {
|
|
2259
|
-
return 1;
|
|
2260
|
-
}
|
|
2261
|
-
const win = element.ownerDocument.defaultView || window;
|
|
2262
|
-
return win.devicePixelRatio || 1;
|
|
2263
|
-
}
|
|
2264
|
-
|
|
2265
|
-
function roundByDPR(element, value) {
|
|
2266
|
-
const dpr = getDPR(element);
|
|
2267
|
-
return Math.round(value * dpr) / dpr;
|
|
2268
|
-
}
|
|
2269
|
-
|
|
2270
|
-
function useLatestRef(value) {
|
|
2271
|
-
const ref = React__namespace.useRef(value);
|
|
2272
|
-
index(() => {
|
|
2273
|
-
ref.current = value;
|
|
2274
|
-
});
|
|
2275
|
-
return ref;
|
|
2276
|
-
}
|
|
2277
|
-
|
|
2278
|
-
/**
|
|
2279
|
-
* Provides data to position a floating element.
|
|
2280
|
-
* @see https://floating-ui.com/docs/react
|
|
2281
|
-
*/
|
|
2282
|
-
function useFloating(options) {
|
|
2283
|
-
if (options === void 0) {
|
|
2284
|
-
options = {};
|
|
2285
|
-
}
|
|
2286
|
-
const {
|
|
2287
|
-
placement = 'bottom',
|
|
2288
|
-
strategy = 'absolute',
|
|
2289
|
-
middleware = [],
|
|
2290
|
-
platform,
|
|
2291
|
-
elements: {
|
|
2292
|
-
reference: externalReference,
|
|
2293
|
-
floating: externalFloating
|
|
2294
|
-
} = {},
|
|
2295
|
-
transform = true,
|
|
2296
|
-
whileElementsMounted,
|
|
2297
|
-
open
|
|
2298
|
-
} = options;
|
|
2299
|
-
const [data, setData] = React__namespace.useState({
|
|
2300
|
-
x: 0,
|
|
2301
|
-
y: 0,
|
|
2302
|
-
strategy,
|
|
2303
|
-
placement,
|
|
2304
|
-
middlewareData: {},
|
|
2305
|
-
isPositioned: false
|
|
2306
|
-
});
|
|
2307
|
-
const [latestMiddleware, setLatestMiddleware] = React__namespace.useState(middleware);
|
|
2308
|
-
if (!deepEqual(latestMiddleware, middleware)) {
|
|
2309
|
-
setLatestMiddleware(middleware);
|
|
2310
|
-
}
|
|
2311
|
-
const [_reference, _setReference] = React__namespace.useState(null);
|
|
2312
|
-
const [_floating, _setFloating] = React__namespace.useState(null);
|
|
2313
|
-
const setReference = React__namespace.useCallback(node => {
|
|
2314
|
-
if (node != referenceRef.current) {
|
|
2315
|
-
referenceRef.current = node;
|
|
2316
|
-
_setReference(node);
|
|
2317
|
-
}
|
|
2318
|
-
}, [_setReference]);
|
|
2319
|
-
const setFloating = React__namespace.useCallback(node => {
|
|
2320
|
-
if (node !== floatingRef.current) {
|
|
2321
|
-
floatingRef.current = node;
|
|
2322
|
-
_setFloating(node);
|
|
2323
|
-
}
|
|
2324
|
-
}, [_setFloating]);
|
|
2325
|
-
const referenceEl = externalReference || _reference;
|
|
2326
|
-
const floatingEl = externalFloating || _floating;
|
|
2327
|
-
const referenceRef = React__namespace.useRef(null);
|
|
2328
|
-
const floatingRef = React__namespace.useRef(null);
|
|
2329
|
-
const dataRef = React__namespace.useRef(data);
|
|
2330
|
-
const whileElementsMountedRef = useLatestRef(whileElementsMounted);
|
|
2331
|
-
const platformRef = useLatestRef(platform);
|
|
2332
|
-
const update = React__namespace.useCallback(() => {
|
|
2333
|
-
if (!referenceRef.current || !floatingRef.current) {
|
|
2334
|
-
return;
|
|
2335
|
-
}
|
|
2336
|
-
const config = {
|
|
2337
|
-
placement,
|
|
2338
|
-
strategy,
|
|
2339
|
-
middleware: latestMiddleware
|
|
2340
|
-
};
|
|
2341
|
-
if (platformRef.current) {
|
|
2342
|
-
config.platform = platformRef.current;
|
|
2343
|
-
}
|
|
2344
|
-
computePosition(referenceRef.current, floatingRef.current, config).then(data => {
|
|
2345
|
-
const fullData = {
|
|
2346
|
-
...data,
|
|
2347
|
-
isPositioned: true
|
|
2348
|
-
};
|
|
2349
|
-
if (isMountedRef.current && !deepEqual(dataRef.current, fullData)) {
|
|
2350
|
-
dataRef.current = fullData;
|
|
2351
|
-
$7SXl2$reactdom__namespace.flushSync(() => {
|
|
2352
|
-
setData(fullData);
|
|
2353
|
-
});
|
|
2354
|
-
}
|
|
2355
|
-
});
|
|
2356
|
-
}, [latestMiddleware, placement, strategy, platformRef]);
|
|
2357
|
-
index(() => {
|
|
2358
|
-
if (open === false && dataRef.current.isPositioned) {
|
|
2359
|
-
dataRef.current.isPositioned = false;
|
|
2360
|
-
setData(data => ({
|
|
2361
|
-
...data,
|
|
2362
|
-
isPositioned: false
|
|
2363
|
-
}));
|
|
2364
|
-
}
|
|
2365
|
-
}, [open]);
|
|
2366
|
-
const isMountedRef = React__namespace.useRef(false);
|
|
2367
|
-
index(() => {
|
|
2368
|
-
isMountedRef.current = true;
|
|
2369
|
-
return () => {
|
|
2370
|
-
isMountedRef.current = false;
|
|
2371
|
-
};
|
|
2372
|
-
}, []);
|
|
2373
|
-
index(() => {
|
|
2374
|
-
if (referenceEl) referenceRef.current = referenceEl;
|
|
2375
|
-
if (floatingEl) floatingRef.current = floatingEl;
|
|
2376
|
-
if (referenceEl && floatingEl) {
|
|
2377
|
-
if (whileElementsMountedRef.current) {
|
|
2378
|
-
return whileElementsMountedRef.current(referenceEl, floatingEl, update);
|
|
2379
|
-
} else {
|
|
2380
|
-
update();
|
|
2381
|
-
}
|
|
2382
|
-
}
|
|
2383
|
-
}, [referenceEl, floatingEl, update, whileElementsMountedRef]);
|
|
2384
|
-
const refs = React__namespace.useMemo(() => ({
|
|
2385
|
-
reference: referenceRef,
|
|
2386
|
-
floating: floatingRef,
|
|
2387
|
-
setReference,
|
|
2388
|
-
setFloating
|
|
2389
|
-
}), [setReference, setFloating]);
|
|
2390
|
-
const elements = React__namespace.useMemo(() => ({
|
|
2391
|
-
reference: referenceEl,
|
|
2392
|
-
floating: floatingEl
|
|
2393
|
-
}), [referenceEl, floatingEl]);
|
|
2394
|
-
const floatingStyles = React__namespace.useMemo(() => {
|
|
2395
|
-
const initialStyles = {
|
|
2396
|
-
position: strategy,
|
|
2397
|
-
left: 0,
|
|
2398
|
-
top: 0
|
|
2399
|
-
};
|
|
2400
|
-
if (!elements.floating) {
|
|
2401
|
-
return initialStyles;
|
|
2402
|
-
}
|
|
2403
|
-
const x = roundByDPR(elements.floating, data.x);
|
|
2404
|
-
const y = roundByDPR(elements.floating, data.y);
|
|
2405
|
-
if (transform) {
|
|
2406
|
-
return {
|
|
2407
|
-
...initialStyles,
|
|
2408
|
-
transform: "translate(" + x + "px, " + y + "px)",
|
|
2409
|
-
...(getDPR(elements.floating) >= 1.5 && {
|
|
2410
|
-
willChange: 'transform'
|
|
2411
|
-
})
|
|
2412
|
-
};
|
|
2413
|
-
}
|
|
2414
|
-
return {
|
|
2415
|
-
position: strategy,
|
|
2416
|
-
left: x,
|
|
2417
|
-
top: y
|
|
2418
|
-
};
|
|
2419
|
-
}, [strategy, transform, elements.floating, data.x, data.y]);
|
|
2420
|
-
return React__namespace.useMemo(() => ({
|
|
2421
|
-
...data,
|
|
2422
|
-
update,
|
|
2423
|
-
refs,
|
|
2424
|
-
elements,
|
|
2425
|
-
floatingStyles
|
|
2426
|
-
}), [data, update, refs, elements, floatingStyles]);
|
|
2427
|
-
}
|
|
2428
|
-
|
|
2429
|
-
function $db6c3485150b8e66$export$1ab7ae714698c4b8(element) {
|
|
2430
|
-
const [size, setSize] = React.useState(undefined);
|
|
2431
|
-
index$1.$9f79659886946c16$export$e5c5a5f917a5871c(()=>{
|
|
2432
|
-
if (element) {
|
|
2433
|
-
// provide size as early as possible
|
|
2434
|
-
setSize({
|
|
2435
|
-
width: element.offsetWidth,
|
|
2436
|
-
height: element.offsetHeight
|
|
2437
|
-
});
|
|
2438
|
-
const resizeObserver = new ResizeObserver((entries)=>{
|
|
2439
|
-
if (!Array.isArray(entries)) return;
|
|
2440
|
-
// Since we only observe the one element, we don't need to loop over the
|
|
2441
|
-
// array
|
|
2442
|
-
if (!entries.length) return;
|
|
2443
|
-
const entry = entries[0];
|
|
2444
|
-
let width;
|
|
2445
|
-
let height;
|
|
2446
|
-
if ('borderBoxSize' in entry) {
|
|
2447
|
-
const borderSizeEntry = entry['borderBoxSize']; // iron out differences between browsers
|
|
2448
|
-
const borderSize = Array.isArray(borderSizeEntry) ? borderSizeEntry[0] : borderSizeEntry;
|
|
2449
|
-
width = borderSize['inlineSize'];
|
|
2450
|
-
height = borderSize['blockSize'];
|
|
2451
|
-
} else {
|
|
2452
|
-
// for browsers that don't support `borderBoxSize`
|
|
2453
|
-
// we calculate it ourselves to get the correct border box.
|
|
2454
|
-
width = element.offsetWidth;
|
|
2455
|
-
height = element.offsetHeight;
|
|
2456
|
-
}
|
|
2457
|
-
setSize({
|
|
2458
|
-
width: width,
|
|
2459
|
-
height: height
|
|
2460
|
-
});
|
|
2461
|
-
});
|
|
2462
|
-
resizeObserver.observe(element, {
|
|
2463
|
-
box: 'border-box'
|
|
2464
|
-
});
|
|
2465
|
-
return ()=>resizeObserver.unobserve(element)
|
|
2466
|
-
;
|
|
2467
|
-
} else // We only want to reset to `undefined` when the element becomes `null`,
|
|
2468
|
-
// not if it changes to another element.
|
|
2469
|
-
setSize(undefined);
|
|
2470
|
-
}, [
|
|
2471
|
-
element
|
|
2472
|
-
]);
|
|
2473
|
-
return size;
|
|
2474
|
-
}
|
|
2475
|
-
|
|
2476
|
-
/* -------------------------------------------------------------------------------------------------
|
|
2477
|
-
* Popper
|
|
2478
|
-
* -----------------------------------------------------------------------------------------------*/ const $cf1ac5d9fe0e8206$var$POPPER_NAME = 'Popper';
|
|
2479
|
-
const [$cf1ac5d9fe0e8206$var$createPopperContext, $cf1ac5d9fe0e8206$export$722aac194ae923] = index$1.$c512c27ab02ef895$export$50c7b4e9d9f19c1($cf1ac5d9fe0e8206$var$POPPER_NAME);
|
|
2480
|
-
const [$cf1ac5d9fe0e8206$var$PopperProvider, $cf1ac5d9fe0e8206$var$usePopperContext] = $cf1ac5d9fe0e8206$var$createPopperContext($cf1ac5d9fe0e8206$var$POPPER_NAME);
|
|
2481
|
-
const $cf1ac5d9fe0e8206$export$badac9ada3a0bdf9 = (props)=>{
|
|
2482
|
-
const { __scopePopper: __scopePopper , children: children } = props;
|
|
2483
|
-
const [anchor, setAnchor] = React.useState(null);
|
|
2484
|
-
return /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$var$PopperProvider, {
|
|
2485
|
-
scope: __scopePopper,
|
|
2486
|
-
anchor: anchor,
|
|
2487
|
-
onAnchorChange: setAnchor
|
|
2488
|
-
}, children);
|
|
2489
|
-
};
|
|
2490
|
-
/* -------------------------------------------------------------------------------------------------
|
|
2491
|
-
* PopperAnchor
|
|
2492
|
-
* -----------------------------------------------------------------------------------------------*/ const $cf1ac5d9fe0e8206$var$ANCHOR_NAME = 'PopperAnchor';
|
|
2493
|
-
const $cf1ac5d9fe0e8206$export$ecd4e1ccab6ed6d = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
|
|
2494
|
-
const { __scopePopper: __scopePopper , virtualRef: virtualRef , ...anchorProps } = props;
|
|
2495
|
-
const context = $cf1ac5d9fe0e8206$var$usePopperContext($cf1ac5d9fe0e8206$var$ANCHOR_NAME, __scopePopper);
|
|
2496
|
-
const ref = React.useRef(null);
|
|
2497
|
-
const composedRefs = index$1.$6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, ref);
|
|
2498
|
-
React.useEffect(()=>{
|
|
2499
|
-
// Consumer can anchor the popper to something that isn't
|
|
2500
|
-
// a DOM node e.g. pointer position, so we override the
|
|
2501
|
-
// `anchorRef` with their virtual ref in this case.
|
|
2502
|
-
context.onAnchorChange((virtualRef === null || virtualRef === void 0 ? void 0 : virtualRef.current) || ref.current);
|
|
2503
|
-
});
|
|
2504
|
-
return virtualRef ? null : /*#__PURE__*/ React.createElement(index$1.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({}, anchorProps, {
|
|
2505
|
-
ref: composedRefs
|
|
2506
|
-
}));
|
|
2507
|
-
});
|
|
2508
|
-
/* -------------------------------------------------------------------------------------------------
|
|
2509
|
-
* PopperContent
|
|
2510
|
-
* -----------------------------------------------------------------------------------------------*/ const $cf1ac5d9fe0e8206$var$CONTENT_NAME = 'PopperContent';
|
|
2511
|
-
const [$cf1ac5d9fe0e8206$var$PopperContentProvider, $cf1ac5d9fe0e8206$var$useContentContext] = $cf1ac5d9fe0e8206$var$createPopperContext($cf1ac5d9fe0e8206$var$CONTENT_NAME);
|
|
2512
|
-
const $cf1ac5d9fe0e8206$export$bc4ae5855d3c4fc = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
|
|
2513
|
-
var _arrowSize$width, _arrowSize$height, _middlewareData$arrow, _middlewareData$arrow2, _middlewareData$arrow3, _middlewareData$trans, _middlewareData$trans2, _middlewareData$hide;
|
|
2514
|
-
const { __scopePopper: __scopePopper , side: side = 'bottom' , sideOffset: sideOffset = 0 , align: align = 'center' , alignOffset: alignOffset = 0 , arrowPadding: arrowPadding = 0 , avoidCollisions: avoidCollisions = true , collisionBoundary: collisionBoundary = [] , collisionPadding: collisionPaddingProp = 0 , sticky: sticky = 'partial' , hideWhenDetached: hideWhenDetached = false , updatePositionStrategy: updatePositionStrategy = 'optimized' , onPlaced: onPlaced , ...contentProps } = props;
|
|
2515
|
-
const context = $cf1ac5d9fe0e8206$var$usePopperContext($cf1ac5d9fe0e8206$var$CONTENT_NAME, __scopePopper);
|
|
2516
|
-
const [content, setContent] = React.useState(null);
|
|
2517
|
-
const composedRefs = index$1.$6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, (node)=>setContent(node)
|
|
2518
|
-
);
|
|
2519
|
-
const [arrow$1, setArrow] = React.useState(null);
|
|
2520
|
-
const arrowSize = $db6c3485150b8e66$export$1ab7ae714698c4b8(arrow$1);
|
|
2521
|
-
const arrowWidth = (_arrowSize$width = arrowSize === null || arrowSize === void 0 ? void 0 : arrowSize.width) !== null && _arrowSize$width !== void 0 ? _arrowSize$width : 0;
|
|
2522
|
-
const arrowHeight = (_arrowSize$height = arrowSize === null || arrowSize === void 0 ? void 0 : arrowSize.height) !== null && _arrowSize$height !== void 0 ? _arrowSize$height : 0;
|
|
2523
|
-
const desiredPlacement = side + (align !== 'center' ? '-' + align : '');
|
|
2524
|
-
const collisionPadding = typeof collisionPaddingProp === 'number' ? collisionPaddingProp : {
|
|
2525
|
-
top: 0,
|
|
2526
|
-
right: 0,
|
|
2527
|
-
bottom: 0,
|
|
2528
|
-
left: 0,
|
|
2529
|
-
...collisionPaddingProp
|
|
2530
|
-
};
|
|
2531
|
-
const boundary = Array.isArray(collisionBoundary) ? collisionBoundary : [
|
|
2532
|
-
collisionBoundary
|
|
2533
|
-
];
|
|
2534
|
-
const hasExplicitBoundaries = boundary.length > 0;
|
|
2535
|
-
const detectOverflowOptions = {
|
|
2536
|
-
padding: collisionPadding,
|
|
2537
|
-
boundary: boundary.filter($cf1ac5d9fe0e8206$var$isNotNull),
|
|
2538
|
-
// with `strategy: 'fixed'`, this is the only way to get it to respect boundaries
|
|
2539
|
-
altBoundary: hasExplicitBoundaries
|
|
2540
|
-
};
|
|
2541
|
-
const { refs: refs , floatingStyles: floatingStyles , placement: placement , isPositioned: isPositioned , middlewareData: middlewareData } = useFloating({
|
|
2542
|
-
// default to `fixed` strategy so users don't have to pick and we also avoid focus scroll issues
|
|
2543
|
-
strategy: 'fixed',
|
|
2544
|
-
placement: desiredPlacement,
|
|
2545
|
-
whileElementsMounted: (...args)=>{
|
|
2546
|
-
const cleanup = autoUpdate(...args, {
|
|
2547
|
-
animationFrame: updatePositionStrategy === 'always'
|
|
2548
|
-
});
|
|
2549
|
-
return cleanup;
|
|
2550
|
-
},
|
|
2551
|
-
elements: {
|
|
2552
|
-
reference: context.anchor
|
|
2553
|
-
},
|
|
2554
|
-
middleware: [
|
|
2555
|
-
offset({
|
|
2556
|
-
mainAxis: sideOffset + arrowHeight,
|
|
2557
|
-
alignmentAxis: alignOffset
|
|
2558
|
-
}),
|
|
2559
|
-
avoidCollisions && shift({
|
|
2560
|
-
mainAxis: true,
|
|
2561
|
-
crossAxis: false,
|
|
2562
|
-
limiter: sticky === 'partial' ? limitShift() : undefined,
|
|
2563
|
-
...detectOverflowOptions
|
|
2564
|
-
}),
|
|
2565
|
-
avoidCollisions && flip({
|
|
2566
|
-
...detectOverflowOptions
|
|
2567
|
-
}),
|
|
2568
|
-
size({
|
|
2569
|
-
...detectOverflowOptions,
|
|
2570
|
-
apply: ({ elements: elements , rects: rects , availableWidth: availableWidth , availableHeight: availableHeight })=>{
|
|
2571
|
-
const { width: anchorWidth , height: anchorHeight } = rects.reference;
|
|
2572
|
-
const contentStyle = elements.floating.style;
|
|
2573
|
-
contentStyle.setProperty('--radix-popper-available-width', `${availableWidth}px`);
|
|
2574
|
-
contentStyle.setProperty('--radix-popper-available-height', `${availableHeight}px`);
|
|
2575
|
-
contentStyle.setProperty('--radix-popper-anchor-width', `${anchorWidth}px`);
|
|
2576
|
-
contentStyle.setProperty('--radix-popper-anchor-height', `${anchorHeight}px`);
|
|
2577
|
-
}
|
|
2578
|
-
}),
|
|
2579
|
-
arrow$1 && arrow({
|
|
2580
|
-
element: arrow$1,
|
|
2581
|
-
padding: arrowPadding
|
|
2582
|
-
}),
|
|
2583
|
-
$cf1ac5d9fe0e8206$var$transformOrigin({
|
|
2584
|
-
arrowWidth: arrowWidth,
|
|
2585
|
-
arrowHeight: arrowHeight
|
|
2586
|
-
}),
|
|
2587
|
-
hideWhenDetached && hide({
|
|
2588
|
-
strategy: 'referenceHidden',
|
|
2589
|
-
...detectOverflowOptions
|
|
2590
|
-
})
|
|
2591
|
-
]
|
|
2592
|
-
});
|
|
2593
|
-
const [placedSide, placedAlign] = $cf1ac5d9fe0e8206$var$getSideAndAlignFromPlacement(placement);
|
|
2594
|
-
const handlePlaced = index$1.$b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onPlaced);
|
|
2595
|
-
index$1.$9f79659886946c16$export$e5c5a5f917a5871c(()=>{
|
|
2596
|
-
if (isPositioned) handlePlaced === null || handlePlaced === void 0 || handlePlaced();
|
|
2597
|
-
}, [
|
|
2598
|
-
isPositioned,
|
|
2599
|
-
handlePlaced
|
|
2600
|
-
]);
|
|
2601
|
-
const arrowX = (_middlewareData$arrow = middlewareData.arrow) === null || _middlewareData$arrow === void 0 ? void 0 : _middlewareData$arrow.x;
|
|
2602
|
-
const arrowY = (_middlewareData$arrow2 = middlewareData.arrow) === null || _middlewareData$arrow2 === void 0 ? void 0 : _middlewareData$arrow2.y;
|
|
2603
|
-
const cannotCenterArrow = ((_middlewareData$arrow3 = middlewareData.arrow) === null || _middlewareData$arrow3 === void 0 ? void 0 : _middlewareData$arrow3.centerOffset) !== 0;
|
|
2604
|
-
const [contentZIndex, setContentZIndex] = React.useState();
|
|
2605
|
-
index$1.$9f79659886946c16$export$e5c5a5f917a5871c(()=>{
|
|
2606
|
-
if (content) setContentZIndex(window.getComputedStyle(content).zIndex);
|
|
2607
|
-
}, [
|
|
2608
|
-
content
|
|
2609
|
-
]);
|
|
2610
|
-
return /*#__PURE__*/ React.createElement("div", {
|
|
2611
|
-
ref: refs.setFloating,
|
|
2612
|
-
"data-radix-popper-content-wrapper": "",
|
|
2613
|
-
style: {
|
|
2614
|
-
...floatingStyles,
|
|
2615
|
-
transform: isPositioned ? floatingStyles.transform : 'translate(0, -200%)',
|
|
2616
|
-
// keep off the page when measuring
|
|
2617
|
-
minWidth: 'max-content',
|
|
2618
|
-
zIndex: contentZIndex,
|
|
2619
|
-
['--radix-popper-transform-origin']: [
|
|
2620
|
-
(_middlewareData$trans = middlewareData.transformOrigin) === null || _middlewareData$trans === void 0 ? void 0 : _middlewareData$trans.x,
|
|
2621
|
-
(_middlewareData$trans2 = middlewareData.transformOrigin) === null || _middlewareData$trans2 === void 0 ? void 0 : _middlewareData$trans2.y
|
|
2622
|
-
].join(' ')
|
|
2623
|
-
} // Floating UI interally calculates logical alignment based the `dir` attribute on
|
|
2624
|
-
,
|
|
2625
|
-
dir: props.dir
|
|
2626
|
-
}, /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$var$PopperContentProvider, {
|
|
2627
|
-
scope: __scopePopper,
|
|
2628
|
-
placedSide: placedSide,
|
|
2629
|
-
onArrowChange: setArrow,
|
|
2630
|
-
arrowX: arrowX,
|
|
2631
|
-
arrowY: arrowY,
|
|
2632
|
-
shouldHideArrow: cannotCenterArrow
|
|
2633
|
-
}, /*#__PURE__*/ React.createElement(index$1.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({
|
|
2634
|
-
"data-side": placedSide,
|
|
2635
|
-
"data-align": placedAlign
|
|
2636
|
-
}, contentProps, {
|
|
2637
|
-
ref: composedRefs,
|
|
2638
|
-
style: {
|
|
2639
|
-
...contentProps.style,
|
|
2640
|
-
// if the PopperContent hasn't been placed yet (not all measurements done)
|
|
2641
|
-
// we prevent animations so that users's animation don't kick in too early referring wrong sides
|
|
2642
|
-
animation: !isPositioned ? 'none' : undefined,
|
|
2643
|
-
// hide the content if using the hide middleware and should be hidden
|
|
2644
|
-
opacity: (_middlewareData$hide = middlewareData.hide) !== null && _middlewareData$hide !== void 0 && _middlewareData$hide.referenceHidden ? 0 : undefined
|
|
2645
|
-
}
|
|
2646
|
-
}))));
|
|
2647
|
-
});
|
|
2648
|
-
/* -----------------------------------------------------------------------------------------------*/ function $cf1ac5d9fe0e8206$var$isNotNull(value) {
|
|
2649
|
-
return value !== null;
|
|
2650
|
-
}
|
|
2651
|
-
const $cf1ac5d9fe0e8206$var$transformOrigin = (options)=>({
|
|
2652
|
-
name: 'transformOrigin',
|
|
2653
|
-
options: options,
|
|
2654
|
-
fn (data) {
|
|
2655
|
-
var _middlewareData$arrow4, _middlewareData$arrow5, _middlewareData$arrow6, _middlewareData$arrow7, _middlewareData$arrow8;
|
|
2656
|
-
const { placement: placement , rects: rects , middlewareData: middlewareData } = data;
|
|
2657
|
-
const cannotCenterArrow = ((_middlewareData$arrow4 = middlewareData.arrow) === null || _middlewareData$arrow4 === void 0 ? void 0 : _middlewareData$arrow4.centerOffset) !== 0;
|
|
2658
|
-
const isArrowHidden = cannotCenterArrow;
|
|
2659
|
-
const arrowWidth = isArrowHidden ? 0 : options.arrowWidth;
|
|
2660
|
-
const arrowHeight = isArrowHidden ? 0 : options.arrowHeight;
|
|
2661
|
-
const [placedSide, placedAlign] = $cf1ac5d9fe0e8206$var$getSideAndAlignFromPlacement(placement);
|
|
2662
|
-
const noArrowAlign = {
|
|
2663
|
-
start: '0%',
|
|
2664
|
-
center: '50%',
|
|
2665
|
-
end: '100%'
|
|
2666
|
-
}[placedAlign];
|
|
2667
|
-
const arrowXCenter = ((_middlewareData$arrow5 = (_middlewareData$arrow6 = middlewareData.arrow) === null || _middlewareData$arrow6 === void 0 ? void 0 : _middlewareData$arrow6.x) !== null && _middlewareData$arrow5 !== void 0 ? _middlewareData$arrow5 : 0) + arrowWidth / 2;
|
|
2668
|
-
const arrowYCenter = ((_middlewareData$arrow7 = (_middlewareData$arrow8 = middlewareData.arrow) === null || _middlewareData$arrow8 === void 0 ? void 0 : _middlewareData$arrow8.y) !== null && _middlewareData$arrow7 !== void 0 ? _middlewareData$arrow7 : 0) + arrowHeight / 2;
|
|
2669
|
-
let x = '';
|
|
2670
|
-
let y = '';
|
|
2671
|
-
if (placedSide === 'bottom') {
|
|
2672
|
-
x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
|
|
2673
|
-
y = `${-arrowHeight}px`;
|
|
2674
|
-
} else if (placedSide === 'top') {
|
|
2675
|
-
x = isArrowHidden ? noArrowAlign : `${arrowXCenter}px`;
|
|
2676
|
-
y = `${rects.floating.height + arrowHeight}px`;
|
|
2677
|
-
} else if (placedSide === 'right') {
|
|
2678
|
-
x = `${-arrowHeight}px`;
|
|
2679
|
-
y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
|
|
2680
|
-
} else if (placedSide === 'left') {
|
|
2681
|
-
x = `${rects.floating.width + arrowHeight}px`;
|
|
2682
|
-
y = isArrowHidden ? noArrowAlign : `${arrowYCenter}px`;
|
|
2683
|
-
}
|
|
2684
|
-
return {
|
|
2685
|
-
data: {
|
|
2686
|
-
x: x,
|
|
2687
|
-
y: y
|
|
2688
|
-
}
|
|
2689
|
-
};
|
|
2690
|
-
}
|
|
2691
|
-
})
|
|
2692
|
-
;
|
|
2693
|
-
function $cf1ac5d9fe0e8206$var$getSideAndAlignFromPlacement(placement) {
|
|
2694
|
-
const [side, align = 'center'] = placement.split('-');
|
|
2695
|
-
return [
|
|
2696
|
-
side,
|
|
2697
|
-
align
|
|
2698
|
-
];
|
|
2699
|
-
}
|
|
2700
|
-
const $cf1ac5d9fe0e8206$export$be92b6f5f03c0fe9 = $cf1ac5d9fe0e8206$export$badac9ada3a0bdf9;
|
|
2701
|
-
const $cf1ac5d9fe0e8206$export$b688253958b8dfe7 = $cf1ac5d9fe0e8206$export$ecd4e1ccab6ed6d;
|
|
2702
|
-
const $cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2 = $cf1ac5d9fe0e8206$export$bc4ae5855d3c4fc;
|
|
2703
|
-
|
|
2704
|
-
const $f1701beae083dbae$export$602eac185826482c = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
|
|
2705
|
-
var _globalThis$document;
|
|
2706
|
-
const { container: container = globalThis === null || globalThis === void 0 ? void 0 : (_globalThis$document = globalThis.document) === null || _globalThis$document === void 0 ? void 0 : _globalThis$document.body , ...portalProps } = props;
|
|
2707
|
-
return container ? /*#__PURE__*/ $7SXl2$reactdom__default["default"].createPortal(/*#__PURE__*/ React.createElement(index$1.$8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends._extends({}, portalProps, {
|
|
2708
|
-
ref: forwardedRef
|
|
2709
|
-
})), container) : null;
|
|
2710
|
-
});
|
|
2711
|
-
|
|
2712
38
|
function $010c2913dbd2fe3d$export$5cae361ad82dce8b(value) {
|
|
2713
39
|
const ref = React.useRef({
|
|
2714
40
|
value: value,
|
|
@@ -2740,12 +66,12 @@ const $cc7e05a45900e73f$var$SELECTION_KEYS = [
|
|
|
2740
66
|
/* -------------------------------------------------------------------------------------------------
|
|
2741
67
|
* Select
|
|
2742
68
|
* -----------------------------------------------------------------------------------------------*/ const $cc7e05a45900e73f$var$SELECT_NAME = 'Select';
|
|
2743
|
-
const [$cc7e05a45900e73f$var$Collection, $cc7e05a45900e73f$var$useCollection, $cc7e05a45900e73f$var$createCollectionScope] = index
|
|
69
|
+
const [$cc7e05a45900e73f$var$Collection, $cc7e05a45900e73f$var$useCollection, $cc7e05a45900e73f$var$createCollectionScope] = index.$e02a7d9cb1dc128c$export$c74125a8e3af6bb2($cc7e05a45900e73f$var$SELECT_NAME);
|
|
2744
70
|
const [$cc7e05a45900e73f$var$createSelectContext, $cc7e05a45900e73f$export$286727a75dc039bd] = index$1.$c512c27ab02ef895$export$50c7b4e9d9f19c1($cc7e05a45900e73f$var$SELECT_NAME, [
|
|
2745
71
|
$cc7e05a45900e73f$var$createCollectionScope,
|
|
2746
|
-
$cf1ac5d9fe0e8206$export$722aac194ae923
|
|
72
|
+
index$2.$cf1ac5d9fe0e8206$export$722aac194ae923
|
|
2747
73
|
]);
|
|
2748
|
-
const $cc7e05a45900e73f$var$usePopperScope = $cf1ac5d9fe0e8206$export$722aac194ae923();
|
|
74
|
+
const $cc7e05a45900e73f$var$usePopperScope = index$2.$cf1ac5d9fe0e8206$export$722aac194ae923();
|
|
2749
75
|
const [$cc7e05a45900e73f$var$SelectProvider, $cc7e05a45900e73f$var$useSelectContext] = $cc7e05a45900e73f$var$createSelectContext($cc7e05a45900e73f$var$SELECT_NAME);
|
|
2750
76
|
const [$cc7e05a45900e73f$var$SelectNativeOptionsProvider, $cc7e05a45900e73f$var$useSelectNativeOptionsContext] = $cc7e05a45900e73f$var$createSelectContext($cc7e05a45900e73f$var$SELECT_NAME);
|
|
2751
77
|
const $cc7e05a45900e73f$export$ef9b1a59e592288f = (props)=>{
|
|
@@ -2754,7 +80,7 @@ const $cc7e05a45900e73f$export$ef9b1a59e592288f = (props)=>{
|
|
|
2754
80
|
const [trigger, setTrigger] = React.useState(null);
|
|
2755
81
|
const [valueNode, setValueNode] = React.useState(null);
|
|
2756
82
|
const [valueNodeHasChildren, setValueNodeHasChildren] = React.useState(false);
|
|
2757
|
-
const direction = index$
|
|
83
|
+
const direction = index$3.$f631663db3294ace$export$b39126d51d94e6f3(dir);
|
|
2758
84
|
const [open = false, setOpen] = index$1.$71cd76cc60e0454e$export$6f32135080cb4c3({
|
|
2759
85
|
prop: openProp,
|
|
2760
86
|
defaultProp: defaultOpen,
|
|
@@ -2774,7 +100,7 @@ const $cc7e05a45900e73f$export$ef9b1a59e592288f = (props)=>{
|
|
|
2774
100
|
// each time the options change.
|
|
2775
101
|
const nativeSelectKey = Array.from(nativeOptionsSet).map((option)=>option.props.value
|
|
2776
102
|
).join(';');
|
|
2777
|
-
return /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$export$be92b6f5f03c0fe9, popperScope, /*#__PURE__*/ React.createElement($cc7e05a45900e73f$var$SelectProvider, {
|
|
103
|
+
return /*#__PURE__*/ React.createElement(index$2.$cf1ac5d9fe0e8206$export$be92b6f5f03c0fe9, popperScope, /*#__PURE__*/ React.createElement($cc7e05a45900e73f$var$SelectProvider, {
|
|
2778
104
|
required: required,
|
|
2779
105
|
scope: __scopeSelect,
|
|
2780
106
|
trigger: trigger,
|
|
@@ -2783,7 +109,7 @@ const $cc7e05a45900e73f$export$ef9b1a59e592288f = (props)=>{
|
|
|
2783
109
|
onValueNodeChange: setValueNode,
|
|
2784
110
|
valueNodeHasChildren: valueNodeHasChildren,
|
|
2785
111
|
onValueNodeHasChildrenChange: setValueNodeHasChildren,
|
|
2786
|
-
contentId: index$
|
|
112
|
+
contentId: index$4.$1746a345f3d73bb7$export$f680877a34711e37(),
|
|
2787
113
|
value: value,
|
|
2788
114
|
onValueChange: setValue,
|
|
2789
115
|
open: open,
|
|
@@ -2846,7 +172,7 @@ const $cc7e05a45900e73f$export$3ac1e88a1c0b9f1 = /*#__PURE__*/ React.forwardRef(
|
|
|
2846
172
|
resetTypeahead();
|
|
2847
173
|
}
|
|
2848
174
|
};
|
|
2849
|
-
return /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$export$b688253958b8dfe7, _extends._extends({
|
|
175
|
+
return /*#__PURE__*/ React.createElement(index$2.$cf1ac5d9fe0e8206$export$b688253958b8dfe7, _extends._extends({
|
|
2850
176
|
asChild: true
|
|
2851
177
|
}, popperScope), /*#__PURE__*/ React.createElement(index$1.$8927f6f2acc4f386$export$250ffa63cdc0d034.button, _extends._extends({
|
|
2852
178
|
type: "button",
|
|
@@ -2932,7 +258,7 @@ const $cc7e05a45900e73f$export$99b400cabb58c515 = /*#__PURE__*/ React.forwardRef
|
|
|
2932
258
|
}), children || '▼');
|
|
2933
259
|
});
|
|
2934
260
|
const $cc7e05a45900e73f$export$b2af6c9944296213 = (props)=>{
|
|
2935
|
-
return /*#__PURE__*/ React.createElement(
|
|
261
|
+
return /*#__PURE__*/ React.createElement(Combination.$f1701beae083dbae$export$602eac185826482c, _extends._extends({
|
|
2936
262
|
asChild: true
|
|
2937
263
|
}, props));
|
|
2938
264
|
};
|
|
@@ -2977,12 +303,12 @@ const $cc7e05a45900e73f$var$SelectContentImpl = /*#__PURE__*/ React.forwardRef((
|
|
|
2977
303
|
const [isPositioned, setIsPositioned] = React.useState(false);
|
|
2978
304
|
const firstValidItemFoundRef = React.useRef(false); // aria-hide everything except the content (better supported equivalent to setting aria-modal)
|
|
2979
305
|
React.useEffect(()=>{
|
|
2980
|
-
if (content) return
|
|
306
|
+
if (content) return Combination.hideOthers(content);
|
|
2981
307
|
}, [
|
|
2982
308
|
content
|
|
2983
309
|
]); // Make sure the whole tree has focus guards as our `Select` may be
|
|
2984
310
|
// the last element in the DOM (because of the `Portal`)
|
|
2985
|
-
|
|
311
|
+
Combination.$3db38b7d1fb3fe6a$export$b7ece24a22aeda8c();
|
|
2986
312
|
const focusFirst = React.useCallback((candidates)=>{
|
|
2987
313
|
const [firstItem, ...restItems] = getItems().map((item)=>item.ref.current
|
|
2988
314
|
);
|
|
@@ -3133,10 +459,10 @@ const $cc7e05a45900e73f$var$SelectContentImpl = /*#__PURE__*/ React.forwardRef((
|
|
|
3133
459
|
position: position,
|
|
3134
460
|
isPositioned: isPositioned,
|
|
3135
461
|
searchRef: searchRef
|
|
3136
|
-
}, /*#__PURE__*/ React.createElement(
|
|
462
|
+
}, /*#__PURE__*/ React.createElement(Combination.$01b9c$RemoveScroll, {
|
|
3137
463
|
as: index$1.$5e63c961fc1ce211$export$8c6ed5c666ac1360,
|
|
3138
464
|
allowPinchZoom: true
|
|
3139
|
-
}, /*#__PURE__*/ React.createElement(
|
|
465
|
+
}, /*#__PURE__*/ React.createElement(Combination.$d3863c46a17e8a28$export$20e40289641fbbb6, {
|
|
3140
466
|
asChild: true // we make sure we're not trapping once it's been closed
|
|
3141
467
|
,
|
|
3142
468
|
trapped: context.open,
|
|
@@ -3151,7 +477,7 @@ const $cc7e05a45900e73f$var$SelectContentImpl = /*#__PURE__*/ React.forwardRef((
|
|
|
3151
477
|
});
|
|
3152
478
|
event.preventDefault();
|
|
3153
479
|
})
|
|
3154
|
-
}, /*#__PURE__*/ React.createElement(
|
|
480
|
+
}, /*#__PURE__*/ React.createElement(Combination.$5cb92bef7577960e$export$177fb62ff3ec1f22, {
|
|
3155
481
|
asChild: true,
|
|
3156
482
|
disableOutsidePointerEvents: true,
|
|
3157
483
|
onEscapeKeyDown: onEscapeKeyDown,
|
|
@@ -3369,7 +695,7 @@ const $cc7e05a45900e73f$var$SelectItemAlignedPosition = /*#__PURE__*/ React.forw
|
|
|
3369
695
|
const $cc7e05a45900e73f$var$SelectPopperPosition = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
|
|
3370
696
|
const { __scopeSelect: __scopeSelect , align: align = 'start' , collisionPadding: collisionPadding = $cc7e05a45900e73f$var$CONTENT_MARGIN , ...popperProps } = props;
|
|
3371
697
|
const popperScope = $cc7e05a45900e73f$var$usePopperScope(__scopeSelect);
|
|
3372
|
-
return /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2, _extends._extends({}, popperScope, popperProps, {
|
|
698
|
+
return /*#__PURE__*/ React.createElement(index$2.$cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2, _extends._extends({}, popperScope, popperProps, {
|
|
3373
699
|
ref: forwardedRef,
|
|
3374
700
|
align: align,
|
|
3375
701
|
collisionPadding: collisionPadding,
|
|
@@ -3460,7 +786,7 @@ const $cc7e05a45900e73f$export$13ef48a934230896 = /*#__PURE__*/ React.forwardRef
|
|
|
3460
786
|
var _contentContext$itemR;
|
|
3461
787
|
return (_contentContext$itemR = contentContext.itemRefCallback) === null || _contentContext$itemR === void 0 ? void 0 : _contentContext$itemR.call(contentContext, node, value, disabled);
|
|
3462
788
|
});
|
|
3463
|
-
const textId = index$
|
|
789
|
+
const textId = index$4.$1746a345f3d73bb7$export$f680877a34711e37();
|
|
3464
790
|
const handleSelect = ()=>{
|
|
3465
791
|
if (!disabled) {
|
|
3466
792
|
context.onValueChange(value);
|
|
@@ -3734,7 +1060,7 @@ const $cc7e05a45900e73f$var$BubbleSelect = /*#__PURE__*/ React.forwardRef((props
|
|
|
3734
1060
|
*
|
|
3735
1061
|
* We use `VisuallyHidden` rather than `display: "none"` because Safari autofill
|
|
3736
1062
|
* won't work otherwise.
|
|
3737
|
-
*/ return /*#__PURE__*/ React.createElement(index$
|
|
1063
|
+
*/ return /*#__PURE__*/ React.createElement(index$5.$ea1ef594cf570d83$export$439d29a4e110a164, {
|
|
3738
1064
|
asChild: true
|
|
3739
1065
|
}, /*#__PURE__*/ React.createElement("select", _extends._extends({}, selectProps, {
|
|
3740
1066
|
ref: composedRefs,
|
|
@@ -3841,7 +1167,7 @@ const BtIconChevronUp2Px = (props) =>
|
|
|
3841
1167
|
/** Use `Select` to choose from a dropdown list of options. */
|
|
3842
1168
|
var Select = function (_a) {
|
|
3843
1169
|
var _b;
|
|
3844
|
-
var isRequired = _a.isRequired, isDisabled = _a.isDisabled, placeholder = _a.placeholder, label = _a.label, _c = _a.ariaLabel, ariaLabel = _c === void 0 ? label : _c, options = _a.options, onOpenChange = _a.onOpenChange, isDefaultOpen = _a.isDefaultOpen, defaultValue = _a.defaultValue, errorMessage = _a.errorMessage, labelSize = _a.labelSize, helper = _a.helper, name = _a.name, width = _a.width, isFluid = _a.isFluid, onBlur = _a.onBlur, onChange = _a.onChange, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, onClickDisclosure = _a.onClickDisclosure, _d = _a.selectSize, selectSize = _d === void 0 ? "m" : _d, props = filterDataAttrs.__rest(_a, ["isRequired", "isDisabled", "placeholder", "label", "ariaLabel", "options", "onOpenChange", "isDefaultOpen", "defaultValue", "errorMessage", "labelSize", "helper", "name", "width", "isFluid", "onBlur", "onChange", "disclosureTitle", "disclosureText", "onClickDisclosure", "selectSize"]);
|
|
1170
|
+
var isRequired = _a.isRequired, isDisabled = _a.isDisabled, placeholder = _a.placeholder, label = _a.label, _c = _a.ariaLabel, ariaLabel = _c === void 0 ? label : _c, options = _a.options, onOpenChange = _a.onOpenChange, isDefaultOpen = _a.isDefaultOpen, defaultValue = _a.defaultValue, errorMessage = _a.errorMessage, labelSize = _a.labelSize, helper = _a.helper, hideLabel = _a.hideLabel, name = _a.name, width = _a.width, isFluid = _a.isFluid, onBlur = _a.onBlur, onChange = _a.onChange, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, onClickDisclosure = _a.onClickDisclosure, _d = _a.selectSize, selectSize = _d === void 0 ? "m" : _d, props = filterDataAttrs.__rest(_a, ["isRequired", "isDisabled", "placeholder", "label", "ariaLabel", "options", "onOpenChange", "isDefaultOpen", "defaultValue", "errorMessage", "labelSize", "helper", "hideLabel", "name", "width", "isFluid", "onBlur", "onChange", "disclosureTitle", "disclosureText", "onClickDisclosure", "selectSize"]);
|
|
3845
1171
|
var id = React.useId();
|
|
3846
1172
|
var arcRootElement = React.useContext(Base.ArcRootElementContext);
|
|
3847
1173
|
var surface = React.useContext(Surface.Context).surface;
|
|
@@ -3864,10 +1190,10 @@ var Select = function (_a) {
|
|
|
3864
1190
|
return 20;
|
|
3865
1191
|
}
|
|
3866
1192
|
};
|
|
3867
|
-
return (React__default["default"].createElement(FormControl.FormControl, { errorMessage: errorMessage, helper: helper, htmlFor: id, label: label, labelSize: labelSize, requirementStatus: isRequired ? "required" : "optional", isDisabled: isDisabled, disclosureText: disclosureText, disclosureTitle: disclosureTitle, onClickDisclosure: onClickDisclosure },
|
|
1193
|
+
return (React__default["default"].createElement(FormControl.FormControl, { errorMessage: errorMessage, helper: helper, htmlFor: id, label: label, hideLabel: hideLabel, labelSize: labelSize, requirementStatus: isRequired ? "required" : "optional", isDisabled: isDisabled, disclosureText: disclosureText, disclosureTitle: disclosureTitle, onClickDisclosure: onClickDisclosure },
|
|
3868
1194
|
React__default["default"].createElement($cc7e05a45900e73f$export$be92b6f5f03c0fe9, { name: name, required: isRequired, disabled: isDisabled, defaultOpen: isDefaultOpen, value: selectedValue, onOpenChange: onOpenChange, onValueChange: function (value) { return onValueChange(value); } },
|
|
3869
1195
|
React__default["default"].createElement("div", { className: "arc-Select-wrapper" },
|
|
3870
|
-
React__default["default"].createElement($cc7e05a45900e73f$export$41fb9f06171c75f4, filterDataAttrs.__assign({ id: id, name: name, onBlur: onBlur, "aria-label": ariaLabel, style: { width: width }, className: index$
|
|
1196
|
+
React__default["default"].createElement($cc7e05a45900e73f$export$41fb9f06171c75f4, filterDataAttrs.__assign({ id: id, name: name, onBlur: onBlur, "aria-label": ariaLabel, style: { width: width }, className: index$6.classNames("arc-Select-trigger", (_b = {
|
|
3871
1197
|
"arc-Select-trigger--constrained": !isFluid,
|
|
3872
1198
|
"arc-Select-trigger--onDarkSurface": surface === "dark",
|
|
3873
1199
|
"arc-Select-trigger--invalid": errorMessage
|
|
@@ -3878,7 +1204,7 @@ var Select = function (_a) {
|
|
|
3878
1204
|
React__default["default"].createElement($cc7e05a45900e73f$export$f04a61298a47a40f, { className: "arc-Select-triggerIcon" },
|
|
3879
1205
|
React__default["default"].createElement(Icon.Icon, { icon: BtIconChevronDown2Px_esm.BtIconChevronDown2Px, size: getIconSize(selectSize) }))),
|
|
3880
1206
|
React__default["default"].createElement($cc7e05a45900e73f$export$602eac185826482c, { container: arcRootElement || undefined },
|
|
3881
|
-
React__default["default"].createElement($cc7e05a45900e73f$export$7c6e2c02157bb7d2, { sideOffset: 5, position: "popper", className: index$
|
|
1207
|
+
React__default["default"].createElement($cc7e05a45900e73f$export$7c6e2c02157bb7d2, { sideOffset: 5, position: "popper", className: index$6.classNames("arc-Select-content", {
|
|
3882
1208
|
"arc-Select-content--onDarkSurface": surface === "dark"
|
|
3883
1209
|
}) },
|
|
3884
1210
|
React__default["default"].createElement($cc7e05a45900e73f$export$2f60d3ec9ad468f2, { className: "arc-Select-scrollButton" },
|