@eightshift/ui-components 1.7.2 → 1.9.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.
Files changed (113) hide show
  1. package/dist/{Button-VbCAu4hd.js → Button-BMFbEXg1.js} +7 -7
  2. package/dist/{Color-BpLubxWI.js → Color-B-cqXgPz.js} +5 -17
  3. package/dist/{ColorSwatch-CinC14s3.js → ColorSwatch-B6s54Jb3.js} +4 -4
  4. package/dist/ComboBox-VR9-vNZv.js +1886 -0
  5. package/dist/Dialog-BlYTPzgB.js +2177 -0
  6. package/dist/{FieldError-BttM1Nxd.js → FieldError-DKicm3R0.js} +2 -2
  7. package/dist/{FocusScope-CtCX0OGo.js → FocusScope-EoLYfbMp.js} +11 -12
  8. package/dist/{Group-XzWUooix.js → Group-D96edUPC.js} +5 -5
  9. package/dist/{Heading-DZelepHV.js → Heading-GytTjUsy.js} +1 -1
  10. package/dist/{Hidden-CcFqOzrp.js → Hidden-D3hHnmPI.js} +2 -2
  11. package/dist/{Input-CV1qVS6t.js → Input-BXSxJ_44.js} +10 -10
  12. package/dist/{Label-BwqMVkuV.js → Label-BtoiUpt8.js} +2 -2
  13. package/dist/{List-Bx2anbX-.js → List-Ct3nzFZG.js} +1 -1
  14. package/dist/{ListBox-DuZPdnkk.js → ListBox-BMpo-Cem.js} +19 -18
  15. package/dist/{NumberFormatter-U_Gx0UDq.js → NumberFormatter-DA8u1Ot7.js} +4 -6
  16. package/dist/OverlayArrow-4epQ99-E.js +567 -0
  17. package/dist/{Select-c7902d94.esm-DtzFQzf-.js → Select-aab027f3.esm-C7BxKjSc.js} +4 -4
  18. package/dist/{SelectionManager-x27KqnAT.js → SelectionManager-D-89MUJW.js} +276 -291
  19. package/dist/{Separator-BM58t3PP.js → Separator-DUhFmbD-.js} +62 -52
  20. package/dist/{Slider-D9Cs6yKr.js → Slider-QNPrj4N9.js} +16 -14
  21. package/dist/{Text-BVIXT8qq.js → Text-DNDWaukZ.js} +1 -1
  22. package/dist/{VisuallyHidden-WhC7vZaL.js → VisuallyHidden-BHNhi-ls.js} +2 -2
  23. package/dist/assets/style.css +1 -1
  24. package/dist/assets/wp-ui-enhancements.css +1 -1
  25. package/dist/components/animated-visibility/animated-visibility.js +67 -7245
  26. package/dist/components/base-control/base-control.js +1 -1
  27. package/dist/components/button/button.js +10 -7
  28. package/dist/components/checkbox/checkbox.js +22 -13
  29. package/dist/components/color-pickers/color-picker.js +1 -1
  30. package/dist/components/color-pickers/color-swatch.js +3 -3
  31. package/dist/components/color-pickers/gradient-editor.js +2 -2
  32. package/dist/components/color-pickers/solid-color-picker.js +21 -21
  33. package/dist/components/component-toggle/component-toggle.js +1 -1
  34. package/dist/components/container-panel/container-panel.js +6 -4
  35. package/dist/components/draggable/draggable-handle.js +2 -2
  36. package/dist/components/draggable/draggable.js +2 -2
  37. package/dist/components/draggable-list/draggable-list-item.js +2 -2
  38. package/dist/components/draggable-list/draggable-list.js +2 -2
  39. package/dist/components/expandable/expandable.js +221 -26
  40. package/dist/components/index.js +8 -4
  41. package/dist/components/input-field/input-field.js +7 -7
  42. package/dist/components/item-collection/item-collection.js +1 -1
  43. package/dist/components/link-input/link-input.js +10 -1872
  44. package/dist/components/list-box/list-box.js +2 -2
  45. package/dist/components/matrix-align/matrix-align.js +2 -2
  46. package/dist/components/menu/menu.js +7 -974
  47. package/dist/components/modal/modal.js +7 -7
  48. package/dist/components/number-picker/number-picker.js +10 -10
  49. package/dist/components/option-select/option-select.js +1 -1
  50. package/dist/components/options-panel/options-panel.js +1 -1
  51. package/dist/components/placeholders/file-placeholder.js +1 -1
  52. package/dist/components/popover/popover.js +2 -2
  53. package/dist/components/radio/radio.js +13 -13
  54. package/dist/components/repeater/repeater-item.js +1 -1
  55. package/dist/components/repeater/repeater.js +2 -2
  56. package/dist/components/responsive/mini-responsive.js +3 -3
  57. package/dist/components/responsive/responsive-legacy.js +2 -2
  58. package/dist/components/responsive/responsive.js +2 -2
  59. package/dist/components/responsive-preview/responsive-preview.js +1 -1
  60. package/dist/components/select/async-multi-select.js +3 -3
  61. package/dist/components/select/async-single-select.js +2 -2
  62. package/dist/components/select/custom-select-default-components.js +1 -1
  63. package/dist/components/select/multi-select-components.js +1 -1
  64. package/dist/components/select/multi-select.js +3 -3
  65. package/dist/components/select/react-select-component-wrappers.js +1 -1
  66. package/dist/components/select/single-select.js +2 -2
  67. package/dist/components/select/v2/async-select.js +307 -0
  68. package/dist/components/select/v2/shared.js +24 -0
  69. package/dist/components/select/v2/single-select.js +993 -0
  70. package/dist/components/slider/column-config-slider.js +3 -3
  71. package/dist/components/slider/slider.js +3 -3
  72. package/dist/components/slider/utils.js +1 -1
  73. package/dist/components/tabs/tabs.js +16 -16
  74. package/dist/components/toggle/switch.js +6 -6
  75. package/dist/components/toggle/toggle.js +1 -1
  76. package/dist/components/toggle-button/toggle-button.js +55 -12
  77. package/dist/components/tooltip/tooltip.js +532 -8
  78. package/dist/{context-Cs-ZD1nu.js → context-KeRYAbEi.js} +2 -2
  79. package/dist/{default-i18n-DRnM8y4w.js → default-i18n-CM1-Xvzf.js} +183 -176
  80. package/dist/{focusSafely-CgFLw4FA.js → focusSafely-CZY36ssv.js} +14 -14
  81. package/dist/icons/icons.js +131 -0
  82. package/dist/icons/jsx-svg.js +16 -3
  83. package/dist/{index-a301f526.esm-BMg114iK.js → index-641ee5b8.esm-DEB-c58F.js} +226 -75
  84. package/dist/index-BYHhzLf-.js +444 -0
  85. package/dist/index.js +7 -3
  86. package/dist/{multi-select-components-DTvEidE3.js → multi-select-components-DM3GsNfb.js} +112 -45
  87. package/dist/{react-jsx-parser.min-B5HVwW_W.js → react-jsx-parser.min-CVit0rZn.js} +5620 -7409
  88. package/dist/{react-select-async.esm-CxA8wpeT.js → react-select-async.esm-Bq3N1-Wi.js} +3 -3
  89. package/dist/{react-select.esm-CeE7o5M9.js → react-select.esm-B38nY7_U.js} +3 -3
  90. package/dist/{textSelection-CvK0YHTZ.js → textSelection-G2G-nukT.js} +1 -1
  91. package/dist/{useButton-Cy9eEev7.js → useButton-CFtcz1T6.js} +4 -4
  92. package/dist/{useEvent-LZebwyrb.js → useEvent-B0yfN_Zu.js} +1 -1
  93. package/dist/{useFocusRing-BMOTWmOx.js → useFocusRing-DMAlRYjX.js} +1 -1
  94. package/dist/{useFocusable-ByyKSVQv.js → useFocusable-BlkOMLma.js} +4 -4
  95. package/dist/{useFormReset-B8m1uz1J.js → useFormReset-BAEM0o25.js} +1 -1
  96. package/dist/{useFormValidationState-BjMhz_VI.js → useFormValidation-BNzOc2t9.js} +92 -88
  97. package/dist/{useLabel-B6uO0wVK.js → useLabel-D6FSp5_M.js} +2 -2
  98. package/dist/{useLabels-5dFkeiXx.js → useLabels-CraZ2Sej.js} +1 -1
  99. package/dist/{useListState-eKxv7HPC.js → useListState-C3dnPq2F.js} +1 -1
  100. package/dist/{useLocalizedStringFormatter-BaKmjFNp.js → useLocalizedStringFormatter-B73fhEA7.js} +1 -1
  101. package/dist/{useNumberField-DMMUTZ-h.js → useNumberField-CQP9-nH5.js} +27 -20
  102. package/dist/{useNumberFormatter-Cyx5Dxkf.js → useNumberFormatter-Cdctl6fg.js} +2 -2
  103. package/dist/{usePress-D8nPoIQm.js → usePress-xTkcGUkt.js} +4 -4
  104. package/dist/{useSingleSelectListState-CABciySJ.js → useSingleSelectListState-BGXQSTy7.js} +2 -2
  105. package/dist/{useToggle-BmltE9Zr.js → useToggle-Dpw3WpSw.js} +4 -4
  106. package/dist/{useToggleState-DZXLEnA_.js → useToggleState-BSKwCUIW.js} +1 -1
  107. package/dist/{utils-BCJajCwh.js → utils-BSLBwuuO.js} +16 -15
  108. package/package.json +30 -31
  109. package/dist/Dialog-BN5EE7UH.js +0 -934
  110. package/dist/index-BTCzc3zb.js +0 -28261
  111. package/dist/isScrollable-Dh9D9IOd.js +0 -9
  112. package/dist/tooltip-eKaARDoV.js +0 -1084
  113. package/dist/useMenuTrigger-4fwEmto8.js +0 -246
@@ -1,980 +1,13 @@
1
1
  import { jsxs, jsx } from "react/jsx-runtime";
2
- import { $ as $982254629710d113$export$b95089534ab7c1fd, a as $453cc9f0df89c0a5$export$77d5aafae4e095b2, d as $431f98aba6844401$export$6615d83f6de245ce, e as $72a5793c14baf454$export$e0e4026c12a8bdbb, f as $72a5793c14baf454$export$8b251419efc915eb, g as $431f98aba6844401$export$1ff3c3f08ae963c0 } from "../../Separator-BM58t3PP.js";
3
- import { c as $880e95eb8b93ba9a$export$ecf600387e221c37, $ as $7af3f5b51489e0b5$export$253fe78d46329472, a as $7613b1592d41b092$export$6cd28814d92fa9c9, b as $d496c0a20b6e58ec$export$6c8a5aaad13c9852, l as $e1995378a142960e$export$e953bb1cd0f19726, g as $7135fc7d473fd974$export$4feb769f8ddf26c5, d as $e1995378a142960e$export$18af5c7a9e9b3664, e as $e1995378a142960e$export$bf788dd355e3a401, f as $e1995378a142960e$export$fb8073518f34e6ec, h as $7135fc7d473fd974$export$d40e14dec8b060a8, k as $7135fc7d473fd974$export$90e00781bc59d8f9, m as $7135fc7d473fd974$export$6e2c8f0811a474ce } from "../../SelectionManager-x27KqnAT.js";
4
- import { c as $3ef42575df84b30b$export$9d1611c77c2fe928, k as $bdb11010cef70236$export$b4cc09c592e8fdb8, e as $bdb11010cef70236$export$f680877a34711e37, f as $8ae05eaa5c114e9c$export$7f54fc3180508a52, j as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, i as $64fa3d84918910a7$export$2881499e37b75b9a, l as $df56164dff5785e2$export$4338b53315abf666, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, a as $64fa3d84918910a7$export$29f1550f4b0d4415, b as $64fa3d84918910a7$export$4d86445c2cf5e3, g as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8 } from "../../utils-BCJajCwh.js";
5
- import React__default, { useRef, useState, useEffect, useCallback, useMemo, createContext, useContext, forwardRef, cloneElement } from "react";
6
- import { g as $de32f1b87079253c$export$d2f961adcb0afbe, j as $07b14b47974efb58$export$9b9a0cd73afb7ca4, k as $f1ab8c75478c6f73$export$3351871ee4b288b8, l as $e0b6e0b68ec7f50f$export$872b660ac5a1ff98 } from "../../Dialog-BN5EE7UH.js";
7
- import { a as $514c0188e459b4c0$export$9afb8bc826b033ea } from "../../Text-BVIXT8qq.js";
8
- import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-EDDcM64A.js";
9
- import { a as $9daab02d461809db$export$683480f191c0e3ea, $ as $fc909762b330b746$export$61c6a8c84e605fb6 } from "../../tooltip-eKaARDoV.js";
10
- import { $ as $6179b936705e76d3$export$ae780daf29e6d456, a as $507fabe10e71c6fb$export$b9b3dfddab17db27, c as $a1ea59d68270f0dd$export$f8168d8dd8fd66e6, t as $507fabe10e71c6fb$export$98e20ec92f614cfe, e as $458b0a5536c1a7cf$export$40bfa8c7b0832715 } from "../../focusSafely-CgFLw4FA.js";
11
- import { $ as $168583247155ddda$export$dc9c12ed27dd1b49 } from "../../useMenuTrigger-4fwEmto8.js";
12
- import { b as $ea8dcbcb9ea1b556$export$9a302a45f65d0572, $ as $f6c31cce2adf654f$export$45712eceda6fad21, a as $ea8dcbcb9ea1b556$export$7e924b3091a3bd18 } from "../../usePress-D8nPoIQm.js";
13
- import { a as $46d819fcbaf35654$export$8f71654801c2f7cd } from "../../useFocusable-ByyKSVQv.js";
14
- import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-Cs-ZD1nu.js";
15
- import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-BMOTWmOx.js";
16
- import { $ as $9bf71ea28793e738$export$20e40289641fbbb6 } from "../../FocusScope-CtCX0OGo.js";
2
+ import { $ as $72a5793c14baf454$export$8b251419efc915eb, a as $431f98aba6844401$export$1ff3c3f08ae963c0 } from "../../Separator-DUhFmbD-.js";
3
+ import { $ as $7135fc7d473fd974$export$6e2c8f0811a474ce } from "../../SelectionManager-D-89MUJW.js";
4
+ import { a as $3674c52c6b3c5bce$export$27d2ad3c5815583e, b as $3674c52c6b3c5bce$export$d9b273488cd8ce6f, c as $3674c52c6b3c5bce$export$2ce376c2cc3355c8, d as $3674c52c6b3c5bce$export$ecabc99eeffab7ca } from "../../Dialog-BlYTPzgB.js";
17
5
  import { icons } from "../../icons/icons.js";
18
6
  import { Button } from "../button/button.js";
19
7
  import { Popover } from "../popover/popover.js";
20
8
  import { c as clsx } from "../../lite-DVmmD_-j.js";
21
- import { _ as __ } from "../../default-i18n-DRnM8y4w.js";
22
- const $d5336fe17ce95402$export$6f49b4016bfc8d56 = /* @__PURE__ */ new WeakMap();
23
- function $d5336fe17ce95402$export$38eaa17faae8f579(props, state, ref) {
24
- let { shouldFocusWrap = true, onKeyDown, onKeyUp, ...otherProps } = props;
25
- if (!props["aria-label"] && !props["aria-labelledby"]) console.warn("An aria-label or aria-labelledby prop is required for accessibility.");
26
- let domProps = $65484d02dcb7eb3e$export$457c3d6518dd4c6f(props, {
27
- labelable: true
28
- });
29
- let { listProps } = $982254629710d113$export$b95089534ab7c1fd({
30
- ...otherProps,
31
- ref,
32
- selectionManager: state.selectionManager,
33
- collection: state.collection,
34
- disabledKeys: state.disabledKeys,
35
- shouldFocusWrap,
36
- linkBehavior: "override"
37
- });
38
- $d5336fe17ce95402$export$6f49b4016bfc8d56.set(state, {
39
- onClose: props.onClose,
40
- onAction: props.onAction
41
- });
42
- return {
43
- menuProps: $3ef42575df84b30b$export$9d1611c77c2fe928(domProps, {
44
- onKeyDown,
45
- onKeyUp
46
- }, {
47
- role: "menu",
48
- ...listProps,
49
- onKeyDown: (e) => {
50
- if (e.key !== "Escape") listProps.onKeyDown(e);
51
- }
52
- })
53
- };
54
- }
55
- function $a2e5df62f93c7633$export$9d32628fc2aea7da(props, state, ref) {
56
- let { id, key, closeOnSelect, isVirtualized, "aria-haspopup": hasPopup, onPressStart: pressStartProp, onPressUp: pressUpProp, onPress, onPressChange, onPressEnd, onHoverStart: hoverStartProp, onHoverChange, onHoverEnd, onKeyDown, onKeyUp, onFocus, onFocusChange, onBlur } = props;
57
- let isTrigger = !!hasPopup;
58
- var _props_isDisabled;
59
- let isDisabled = (_props_isDisabled = props.isDisabled) !== null && _props_isDisabled !== void 0 ? _props_isDisabled : state.selectionManager.isDisabled(key);
60
- var _props_isSelected;
61
- let isSelected = (_props_isSelected = props.isSelected) !== null && _props_isSelected !== void 0 ? _props_isSelected : state.selectionManager.isSelected(key);
62
- let data = $d5336fe17ce95402$export$6f49b4016bfc8d56.get(state);
63
- let item = state.collection.getItem(key);
64
- let onClose = props.onClose || data.onClose;
65
- let router = $ea8dcbcb9ea1b556$export$9a302a45f65d0572();
66
- let performAction = (e) => {
67
- var _item_props;
68
- if (isTrigger) return;
69
- if (item === null || item === void 0 ? void 0 : (_item_props = item.props) === null || _item_props === void 0 ? void 0 : _item_props.onAction) item.props.onAction();
70
- else if (props.onAction) props.onAction(key);
71
- if (data.onAction) {
72
- let onAction = data.onAction;
73
- onAction(key);
74
- }
75
- if (e.target instanceof HTMLAnchorElement) router.open(e.target, e, item.props.href, item.props.routerOptions);
76
- };
77
- let role = "menuitem";
78
- if (!isTrigger) {
79
- if (state.selectionManager.selectionMode === "single") role = "menuitemradio";
80
- else if (state.selectionManager.selectionMode === "multiple") role = "menuitemcheckbox";
81
- }
82
- let labelId = $bdb11010cef70236$export$b4cc09c592e8fdb8();
83
- let descriptionId = $bdb11010cef70236$export$b4cc09c592e8fdb8();
84
- let keyboardId = $bdb11010cef70236$export$b4cc09c592e8fdb8();
85
- let ariaProps = {
86
- id,
87
- "aria-disabled": isDisabled || void 0,
88
- role,
89
- "aria-label": props["aria-label"],
90
- "aria-labelledby": labelId,
91
- "aria-describedby": [
92
- descriptionId,
93
- keyboardId
94
- ].filter(Boolean).join(" ") || void 0,
95
- "aria-controls": props["aria-controls"],
96
- "aria-haspopup": hasPopup,
97
- "aria-expanded": props["aria-expanded"]
98
- };
99
- if (state.selectionManager.selectionMode !== "none" && !isTrigger) ariaProps["aria-checked"] = isSelected;
100
- if (isVirtualized) {
101
- ariaProps["aria-posinset"] = item === null || item === void 0 ? void 0 : item.index;
102
- ariaProps["aria-setsize"] = $453cc9f0df89c0a5$export$77d5aafae4e095b2(state.collection);
103
- }
104
- let onPressStart = (e) => {
105
- if (e.pointerType === "keyboard") performAction(e);
106
- pressStartProp === null || pressStartProp === void 0 ? void 0 : pressStartProp(e);
107
- };
108
- let onPressUp = (e) => {
109
- if (e.pointerType !== "keyboard") {
110
- performAction(e);
111
- if (!isTrigger && onClose && (closeOnSelect !== null && closeOnSelect !== void 0 ? closeOnSelect : state.selectionManager.selectionMode !== "multiple" || state.selectionManager.isLink(key))) onClose();
112
- }
113
- pressUpProp === null || pressUpProp === void 0 ? void 0 : pressUpProp(e);
114
- };
115
- let { itemProps, isFocused } = $880e95eb8b93ba9a$export$ecf600387e221c37({
116
- selectionManager: state.selectionManager,
117
- key,
118
- ref,
119
- shouldSelectOnPressUp: true,
120
- allowsDifferentPressOrigin: true,
121
- // Disable all handling of links in useSelectable item
122
- // because we handle it ourselves. The behavior of menus
123
- // is slightly different from other collections because
124
- // actions are performed on key down rather than key up.
125
- linkBehavior: "none"
126
- });
127
- let { pressProps, isPressed } = $f6c31cce2adf654f$export$45712eceda6fad21({
128
- onPressStart,
129
- onPress,
130
- onPressUp,
131
- onPressChange,
132
- onPressEnd,
133
- isDisabled
134
- });
135
- let { hoverProps } = $6179b936705e76d3$export$ae780daf29e6d456({
136
- isDisabled,
137
- onHoverStart(e) {
138
- if (!$507fabe10e71c6fb$export$b9b3dfddab17db27()) {
139
- state.selectionManager.setFocused(true);
140
- state.selectionManager.setFocusedKey(key);
141
- }
142
- hoverStartProp === null || hoverStartProp === void 0 ? void 0 : hoverStartProp(e);
143
- },
144
- onHoverChange,
145
- onHoverEnd
146
- });
147
- let { keyboardProps } = $46d819fcbaf35654$export$8f71654801c2f7cd({
148
- onKeyDown: (e) => {
149
- if (e.repeat) {
150
- e.continuePropagation();
151
- return;
152
- }
153
- switch (e.key) {
154
- case " ":
155
- if (!isDisabled && state.selectionManager.selectionMode === "none" && !isTrigger && closeOnSelect !== false && onClose) onClose();
156
- break;
157
- case "Enter":
158
- if (!isDisabled && closeOnSelect !== false && !isTrigger && onClose) onClose();
159
- break;
160
- default:
161
- if (!isTrigger) e.continuePropagation();
162
- onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(e);
163
- break;
164
- }
165
- },
166
- onKeyUp
167
- });
168
- let { focusProps } = $a1ea59d68270f0dd$export$f8168d8dd8fd66e6({
169
- onBlur,
170
- onFocus,
171
- onFocusChange
172
- });
173
- let domProps = $65484d02dcb7eb3e$export$457c3d6518dd4c6f(item.props);
174
- delete domProps.id;
175
- let linkProps = $ea8dcbcb9ea1b556$export$7e924b3091a3bd18(item.props);
176
- return {
177
- menuItemProps: {
178
- ...ariaProps,
179
- ...$3ef42575df84b30b$export$9d1611c77c2fe928(domProps, linkProps, isTrigger ? {
180
- onFocus: itemProps.onFocus,
181
- "data-key": itemProps["data-key"]
182
- } : itemProps, pressProps, hoverProps, keyboardProps, focusProps),
183
- tabIndex: itemProps.tabIndex != null ? -1 : void 0
184
- },
185
- labelProps: {
186
- id: labelId
187
- },
188
- descriptionProps: {
189
- id: descriptionId
190
- },
191
- keyboardShortcutProps: {
192
- id: keyboardId
193
- },
194
- isFocused,
195
- isSelected,
196
- isPressed,
197
- isDisabled
198
- };
199
- }
200
- function $3e5eb2498db5b506$export$73f7a44322579622(props) {
201
- let { heading, "aria-label": ariaLabel } = props;
202
- let headingId = $bdb11010cef70236$export$f680877a34711e37();
203
- return {
204
- itemProps: {
205
- role: "presentation"
206
- },
207
- headingProps: heading ? {
208
- // Techincally, menus cannot contain headings according to ARIA.
209
- // We hide the heading from assistive technology, using role="presentation",
210
- // and only use it as a label for the nested group.
211
- id: headingId,
212
- role: "presentation"
213
- } : {},
214
- groupProps: {
215
- role: "group",
216
- "aria-label": ariaLabel,
217
- "aria-labelledby": heading ? headingId : void 0
218
- }
219
- };
220
- }
221
- const $d275435c250248f8$var$ALLOWED_INVALID_MOVEMENTS = 2;
222
- const $d275435c250248f8$var$THROTTLE_TIME = 50;
223
- const $d275435c250248f8$var$TIMEOUT_TIME = 1e3;
224
- const $d275435c250248f8$var$ANGLE_PADDING = Math.PI / 12;
225
- function $d275435c250248f8$export$85ec83e04c95f50a(options) {
226
- let { menuRef, submenuRef, isOpen, isDisabled } = options;
227
- let prevPointerPos = useRef(void 0);
228
- let submenuRect = useRef(void 0);
229
- let lastProcessedTime = useRef(0);
230
- let timeout = useRef(void 0);
231
- let autoCloseTimeout = useRef(void 0);
232
- let submenuSide = useRef(void 0);
233
- let movementsTowardsSubmenuCount = useRef(2);
234
- let [preventPointerEvents, setPreventPointerEvents] = useState(false);
235
- let updateSubmenuRect = () => {
236
- if (submenuRef.current) {
237
- submenuRect.current = submenuRef.current.getBoundingClientRect();
238
- submenuSide.current = void 0;
239
- }
240
- };
241
- $9daab02d461809db$export$683480f191c0e3ea({
242
- ref: submenuRef,
243
- onResize: updateSubmenuRect
244
- });
245
- let reset = () => {
246
- setPreventPointerEvents(false);
247
- movementsTowardsSubmenuCount.current = $d275435c250248f8$var$ALLOWED_INVALID_MOVEMENTS;
248
- prevPointerPos.current = void 0;
249
- };
250
- let modality = $507fabe10e71c6fb$export$98e20ec92f614cfe();
251
- useEffect(() => {
252
- if (preventPointerEvents && menuRef.current) menuRef.current.style.pointerEvents = "none";
253
- else menuRef.current.style.pointerEvents = "";
254
- }, [
255
- menuRef,
256
- preventPointerEvents
257
- ]);
258
- useEffect(() => {
259
- let submenu = submenuRef.current;
260
- let menu = menuRef.current;
261
- if (isDisabled || !submenu || !isOpen || modality !== "pointer") {
262
- reset();
263
- return;
264
- }
265
- submenuRect.current = submenu.getBoundingClientRect();
266
- let onPointerMove = (e) => {
267
- if (e.pointerType === "touch" || e.pointerType === "pen") return;
268
- let currentTime = Date.now();
269
- if (currentTime - lastProcessedTime.current < $d275435c250248f8$var$THROTTLE_TIME) return;
270
- clearTimeout(timeout.current);
271
- clearTimeout(autoCloseTimeout.current);
272
- let { clientX: mouseX, clientY: mouseY } = e;
273
- if (!prevPointerPos.current) {
274
- prevPointerPos.current = {
275
- x: mouseX,
276
- y: mouseY
277
- };
278
- return;
279
- }
280
- if (!submenuRect.current) return;
281
- if (!submenuSide.current) submenuSide.current = mouseX > submenuRect.current.right ? "left" : "right";
282
- if (mouseX < menu.getBoundingClientRect().left || mouseX > menu.getBoundingClientRect().right || mouseY < menu.getBoundingClientRect().top || mouseY > menu.getBoundingClientRect().bottom) {
283
- reset();
284
- return;
285
- }
286
- let prevMouseX = prevPointerPos.current.x;
287
- let prevMouseY = prevPointerPos.current.y;
288
- let toSubmenuX = submenuSide.current === "right" ? submenuRect.current.left - prevMouseX : prevMouseX - submenuRect.current.right;
289
- let angleTop = Math.atan2(prevMouseY - submenuRect.current.top, toSubmenuX) + $d275435c250248f8$var$ANGLE_PADDING;
290
- let angleBottom = Math.atan2(prevMouseY - submenuRect.current.bottom, toSubmenuX) - $d275435c250248f8$var$ANGLE_PADDING;
291
- let anglePointer = Math.atan2(prevMouseY - mouseY, submenuSide.current === "left" ? -(mouseX - prevMouseX) : mouseX - prevMouseX);
292
- let isMovingTowardsSubmenu = anglePointer < angleTop && anglePointer > angleBottom;
293
- movementsTowardsSubmenuCount.current = isMovingTowardsSubmenu ? Math.min(movementsTowardsSubmenuCount.current + 1, $d275435c250248f8$var$ALLOWED_INVALID_MOVEMENTS) : Math.max(movementsTowardsSubmenuCount.current - 1, 0);
294
- if (movementsTowardsSubmenuCount.current >= $d275435c250248f8$var$ALLOWED_INVALID_MOVEMENTS) setPreventPointerEvents(true);
295
- else setPreventPointerEvents(false);
296
- lastProcessedTime.current = currentTime;
297
- prevPointerPos.current = {
298
- x: mouseX,
299
- y: mouseY
300
- };
301
- if (isMovingTowardsSubmenu) timeout.current = setTimeout(() => {
302
- reset();
303
- autoCloseTimeout.current = setTimeout(() => {
304
- let target = document.elementFromPoint(mouseX, mouseY);
305
- if (target && menu.contains(target)) target.dispatchEvent(new PointerEvent("pointerover", {
306
- bubbles: true,
307
- cancelable: true
308
- }));
309
- }, 100);
310
- }, $d275435c250248f8$var$TIMEOUT_TIME);
311
- };
312
- window.addEventListener("pointermove", onPointerMove);
313
- return () => {
314
- window.removeEventListener("pointermove", onPointerMove);
315
- clearTimeout(timeout.current);
316
- clearTimeout(autoCloseTimeout.current);
317
- movementsTowardsSubmenuCount.current = $d275435c250248f8$var$ALLOWED_INVALID_MOVEMENTS;
318
- };
319
- }, [
320
- isDisabled,
321
- isOpen,
322
- menuRef,
323
- modality,
324
- setPreventPointerEvents,
325
- submenuRef
326
- ]);
327
- }
328
- function $0065b146e7192841$export$7138b0d059a6e743(props, state, ref) {
329
- let { parentMenuRef, submenuRef, type = "menu", isDisabled, delay = 200 } = props;
330
- let submenuTriggerId = $bdb11010cef70236$export$f680877a34711e37();
331
- let overlayId = $bdb11010cef70236$export$f680877a34711e37();
332
- let { direction } = $18f2051aff69b9bf$export$43bb16f9c6d9e3f7();
333
- let openTimeout = useRef(void 0);
334
- let cancelOpenTimeout = useCallback(() => {
335
- if (openTimeout.current) {
336
- clearTimeout(openTimeout.current);
337
- openTimeout.current = void 0;
338
- }
339
- }, [
340
- openTimeout
341
- ]);
342
- let onSubmenuOpen = $8ae05eaa5c114e9c$export$7f54fc3180508a52((focusStrategy) => {
343
- cancelOpenTimeout();
344
- state.open(focusStrategy);
345
- });
346
- let onSubmenuClose = $8ae05eaa5c114e9c$export$7f54fc3180508a52(() => {
347
- cancelOpenTimeout();
348
- state.close();
349
- });
350
- $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c(() => {
351
- return () => {
352
- cancelOpenTimeout();
353
- };
354
- }, [
355
- cancelOpenTimeout
356
- ]);
357
- let submenuKeyDown = (e) => {
358
- switch (e.key) {
359
- case "ArrowLeft":
360
- if (direction === "ltr" && e.currentTarget.contains(e.target)) {
361
- e.stopPropagation();
362
- onSubmenuClose();
363
- ref.current.focus();
364
- }
365
- break;
366
- case "ArrowRight":
367
- if (direction === "rtl" && e.currentTarget.contains(e.target)) {
368
- e.stopPropagation();
369
- onSubmenuClose();
370
- ref.current.focus();
371
- }
372
- break;
373
- case "Escape":
374
- e.stopPropagation();
375
- state.closeAll();
376
- break;
377
- }
378
- };
379
- let submenuProps = {
380
- id: overlayId,
381
- "aria-labelledby": submenuTriggerId,
382
- submenuLevel: state.submenuLevel,
383
- ...type === "menu" && {
384
- onClose: state.closeAll,
385
- autoFocus: state.focusStrategy,
386
- onKeyDown: submenuKeyDown
387
- }
388
- };
389
- let submenuTriggerKeyDown = (e) => {
390
- switch (e.key) {
391
- case "ArrowRight":
392
- if (!isDisabled) {
393
- if (direction === "ltr") {
394
- if (!state.isOpen) onSubmenuOpen("first");
395
- if (type === "menu" && !!(submenuRef === null || submenuRef === void 0 ? void 0 : submenuRef.current) && document.activeElement === (ref === null || ref === void 0 ? void 0 : ref.current)) submenuRef.current.focus();
396
- } else if (state.isOpen) onSubmenuClose();
397
- else e.continuePropagation();
398
- }
399
- break;
400
- case "ArrowLeft":
401
- if (!isDisabled) {
402
- if (direction === "rtl") {
403
- if (!state.isOpen) onSubmenuOpen("first");
404
- if (type === "menu" && !!(submenuRef === null || submenuRef === void 0 ? void 0 : submenuRef.current) && document.activeElement === (ref === null || ref === void 0 ? void 0 : ref.current)) submenuRef.current.focus();
405
- } else if (state.isOpen) onSubmenuClose();
406
- else e.continuePropagation();
407
- }
408
- break;
409
- case "Escape":
410
- state.closeAll();
411
- break;
412
- default:
413
- e.continuePropagation();
414
- break;
415
- }
416
- };
417
- let onPressStart = (e) => {
418
- if (!isDisabled && (e.pointerType === "virtual" || e.pointerType === "keyboard"))
419
- onSubmenuOpen("first");
420
- };
421
- let onPress = (e) => {
422
- if (!isDisabled && (e.pointerType === "touch" || e.pointerType === "mouse"))
423
- onSubmenuOpen();
424
- };
425
- let onHoverChange = (isHovered) => {
426
- if (!isDisabled) {
427
- if (isHovered && !state.isOpen) {
428
- if (!openTimeout.current) openTimeout.current = setTimeout(() => {
429
- onSubmenuOpen();
430
- }, delay);
431
- } else if (!isHovered) cancelOpenTimeout();
432
- }
433
- };
434
- let onBlur = (e) => {
435
- if (state.isOpen && parentMenuRef.current.contains(e.relatedTarget)) onSubmenuClose();
436
- };
437
- let shouldCloseOnInteractOutside = (target) => {
438
- if (target !== ref.current) return true;
439
- return false;
440
- };
441
- $d275435c250248f8$export$85ec83e04c95f50a({
442
- menuRef: parentMenuRef,
443
- submenuRef,
444
- isOpen: state.isOpen,
445
- isDisabled
446
- });
447
- return {
448
- submenuTriggerProps: {
449
- id: submenuTriggerId,
450
- "aria-controls": state.isOpen ? overlayId : void 0,
451
- "aria-haspopup": !isDisabled ? type : void 0,
452
- "aria-expanded": state.isOpen ? "true" : "false",
453
- onPressStart,
454
- onPress,
455
- onHoverChange,
456
- onKeyDown: submenuTriggerKeyDown,
457
- onBlur,
458
- isOpen: state.isOpen
459
- },
460
- submenuProps,
461
- popoverProps: {
462
- isNonModal: true,
463
- disableFocusManagement: true,
464
- shouldCloseOnInteractOutside
465
- }
466
- };
467
- }
468
- function $a28c903ee9ad8dc5$export$79fefeb1c2091ac3(props) {
469
- let overlayTriggerState = $fc909762b330b746$export$61c6a8c84e605fb6(props);
470
- let [focusStrategy, setFocusStrategy] = useState(null);
471
- let [expandedKeysStack, setExpandedKeysStack] = useState([]);
472
- let closeAll = () => {
473
- setExpandedKeysStack([]);
474
- overlayTriggerState.close();
475
- };
476
- let openSubmenu = (triggerKey, level) => {
477
- setExpandedKeysStack((oldStack) => {
478
- if (level > oldStack.length) return oldStack;
479
- return [
480
- ...oldStack.slice(0, level),
481
- triggerKey
482
- ];
483
- });
484
- };
485
- let closeSubmenu = (triggerKey, level) => {
486
- setExpandedKeysStack((oldStack) => {
487
- let key = oldStack[level];
488
- if (key === triggerKey) return oldStack.slice(0, level);
489
- else return oldStack;
490
- });
491
- };
492
- return {
493
- focusStrategy,
494
- ...overlayTriggerState,
495
- open(focusStrategy2 = null) {
496
- setFocusStrategy(focusStrategy2);
497
- overlayTriggerState.open();
498
- },
499
- toggle(focusStrategy2 = null) {
500
- setFocusStrategy(focusStrategy2);
501
- overlayTriggerState.toggle();
502
- },
503
- close() {
504
- closeAll();
505
- },
506
- expandedKeysStack,
507
- openSubmenu,
508
- closeSubmenu
509
- };
510
- }
511
- function $e5614764aa47eb35$export$cfc51cf86138bf98(props, state) {
512
- let { triggerKey } = props;
513
- let { expandedKeysStack, openSubmenu, closeSubmenu, close: closeAll } = state;
514
- let [submenuLevel] = useState(expandedKeysStack === null || expandedKeysStack === void 0 ? void 0 : expandedKeysStack.length);
515
- let isOpen = useMemo(() => expandedKeysStack[submenuLevel] === triggerKey, [
516
- expandedKeysStack,
517
- triggerKey,
518
- submenuLevel
519
- ]);
520
- let [focusStrategy, setFocusStrategy] = useState(null);
521
- let open = useCallback((focusStrategy2 = null) => {
522
- setFocusStrategy(focusStrategy2);
523
- openSubmenu(triggerKey, submenuLevel);
524
- }, [
525
- openSubmenu,
526
- submenuLevel,
527
- triggerKey
528
- ]);
529
- let close = useCallback(() => {
530
- setFocusStrategy(null);
531
- closeSubmenu(triggerKey, submenuLevel);
532
- }, [
533
- closeSubmenu,
534
- submenuLevel,
535
- triggerKey
536
- ]);
537
- let toggle = useCallback((focusStrategy2 = null) => {
538
- setFocusStrategy(focusStrategy2);
539
- if (isOpen) close();
540
- else open(focusStrategy2);
541
- }, [
542
- close,
543
- open,
544
- isOpen
545
- ]);
546
- return useMemo(() => ({
547
- focusStrategy,
548
- isOpen,
549
- open,
550
- close,
551
- closeAll,
552
- submenuLevel,
553
- // TODO: Placeholders that aren't used but give us parity with OverlayTriggerState so we can use this in Popover. Refactor if we update Popover via
554
- // https://github.com/adobe/react-spectrum/pull/4976#discussion_r1336472863
555
- setOpen: () => {
556
- },
557
- toggle
558
- }), [
559
- isOpen,
560
- open,
561
- close,
562
- closeAll,
563
- focusStrategy,
564
- toggle,
565
- submenuLevel
566
- ]);
567
- }
568
- class $05ca4cd7c4a5a999$export$863faf230ee2118a {
569
- *[Symbol.iterator]() {
570
- yield* this.iterable;
571
- }
572
- get size() {
573
- return this.keyMap.size;
574
- }
575
- getKeys() {
576
- return this.keyMap.keys();
577
- }
578
- getKeyBefore(key) {
579
- let node = this.keyMap.get(key);
580
- return node ? node.prevKey : null;
581
- }
582
- getKeyAfter(key) {
583
- let node = this.keyMap.get(key);
584
- return node ? node.nextKey : null;
585
- }
586
- getFirstKey() {
587
- return this.firstKey;
588
- }
589
- getLastKey() {
590
- return this.lastKey;
591
- }
592
- getItem(key) {
593
- return this.keyMap.get(key);
594
- }
595
- at(idx) {
596
- const keys = [
597
- ...this.getKeys()
598
- ];
599
- return this.getItem(keys[idx]);
600
- }
601
- constructor(nodes, { expandedKeys } = {}) {
602
- this.keyMap = /* @__PURE__ */ new Map();
603
- this.iterable = nodes;
604
- expandedKeys = expandedKeys || /* @__PURE__ */ new Set();
605
- let visit = (node) => {
606
- this.keyMap.set(node.key, node);
607
- if (node.childNodes && (node.type === "section" || expandedKeys.has(node.key))) for (let child of node.childNodes) visit(child);
608
- };
609
- for (let node of nodes) visit(node);
610
- let last;
611
- let index = 0;
612
- for (let [key, node] of this.keyMap) {
613
- if (last) {
614
- last.nextKey = key;
615
- node.prevKey = last.key;
616
- } else {
617
- this.firstKey = key;
618
- node.prevKey = void 0;
619
- }
620
- if (node.type === "item") node.index = index++;
621
- last = node;
622
- last.nextKey = void 0;
623
- }
624
- this.lastKey = last === null || last === void 0 ? void 0 : last.key;
625
- }
626
- }
627
- function $875d6693e12af071$export$728d6ba534403756(props) {
628
- let { onExpandedChange } = props;
629
- let [expandedKeys, setExpandedKeys] = $458b0a5536c1a7cf$export$40bfa8c7b0832715(props.expandedKeys ? new Set(props.expandedKeys) : void 0, props.defaultExpandedKeys ? new Set(props.defaultExpandedKeys) : /* @__PURE__ */ new Set(), onExpandedChange);
630
- let selectionState = $7af3f5b51489e0b5$export$253fe78d46329472(props);
631
- let disabledKeys = useMemo(() => props.disabledKeys ? new Set(props.disabledKeys) : /* @__PURE__ */ new Set(), [
632
- props.disabledKeys
633
- ]);
634
- let tree = $7613b1592d41b092$export$6cd28814d92fa9c9(props, useCallback((nodes) => new $05ca4cd7c4a5a999$export$863faf230ee2118a(nodes, {
635
- expandedKeys
636
- }), [
637
- expandedKeys
638
- ]), null);
639
- useEffect(() => {
640
- if (selectionState.focusedKey != null && !tree.getItem(selectionState.focusedKey)) selectionState.setFocusedKey(null);
641
- }, [
642
- tree,
643
- selectionState.focusedKey
644
- ]);
645
- let onToggle = (key) => {
646
- setExpandedKeys($875d6693e12af071$var$toggleKey(expandedKeys, key));
647
- };
648
- return {
649
- collection: tree,
650
- expandedKeys,
651
- disabledKeys,
652
- toggleKey: onToggle,
653
- setExpandedKeys,
654
- selectionManager: new $d496c0a20b6e58ec$export$6c8a5aaad13c9852(tree, selectionState)
655
- };
656
- }
657
- function $875d6693e12af071$var$toggleKey(set, key) {
658
- let res = new Set(set);
659
- if (res.has(key)) res.delete(key);
660
- else res.add(key);
661
- return res;
662
- }
663
- const $63df2425e2108aa8$export$744d98a3b8a94e1c = /* @__PURE__ */ createContext({});
664
- const $3674c52c6b3c5bce$export$c7e742effb1c51e2 = /* @__PURE__ */ createContext(null);
665
- const $3674c52c6b3c5bce$export$24aad8519b95b41b = /* @__PURE__ */ createContext(null);
666
- const $3674c52c6b3c5bce$export$795aec4671cbae19 = /* @__PURE__ */ createContext(null);
667
- function $3674c52c6b3c5bce$export$27d2ad3c5815583e(props) {
668
- let state = $a28c903ee9ad8dc5$export$79fefeb1c2091ac3(props);
669
- let ref = useRef(null);
670
- let { menuTriggerProps, menuProps } = $168583247155ddda$export$dc9c12ed27dd1b49({
671
- ...props,
672
- type: "menu"
673
- }, state, ref);
674
- let [buttonWidth, setButtonWidth] = useState(null);
675
- let onResize = useCallback(() => {
676
- if (ref.current) setButtonWidth(ref.current.offsetWidth + "px");
677
- }, [
678
- ref
679
- ]);
680
- $9daab02d461809db$export$683480f191c0e3ea({
681
- ref,
682
- onResize
683
- });
684
- let scrollRef = useRef(null);
685
- return /* @__PURE__ */ React__default.createElement($64fa3d84918910a7$export$2881499e37b75b9a, {
686
- values: [
687
- [
688
- $3674c52c6b3c5bce$export$c7e742effb1c51e2,
689
- {
690
- ...menuProps,
691
- ref: scrollRef
692
- }
693
- ],
694
- [
695
- $de32f1b87079253c$export$d2f961adcb0afbe,
696
- state
697
- ],
698
- [
699
- $3674c52c6b3c5bce$export$795aec4671cbae19,
700
- state
701
- ],
702
- [
703
- $07b14b47974efb58$export$9b9a0cd73afb7ca4,
704
- {
705
- trigger: "MenuTrigger",
706
- triggerRef: ref,
707
- scrollRef,
708
- placement: "bottom start",
709
- style: {
710
- "--trigger-width": buttonWidth
711
- }
712
- }
713
- ]
714
- ]
715
- }, /* @__PURE__ */ React__default.createElement($f1ab8c75478c6f73$export$3351871ee4b288b8, {
716
- ...menuTriggerProps,
717
- ref,
718
- isPressed: state.isOpen
719
- }, props.children));
720
- }
721
- const $3674c52c6b3c5bce$var$SubmenuTriggerContext = /* @__PURE__ */ createContext(null);
722
- const $3674c52c6b3c5bce$export$ecabc99eeffab7ca = /* @__PURE__ */ $e1995378a142960e$export$e953bb1cd0f19726("submenutrigger", (props, ref, item) => {
723
- let { CollectionBranch } = useContext($7135fc7d473fd974$export$4feb769f8ddf26c5);
724
- let state = useContext($3674c52c6b3c5bce$export$24aad8519b95b41b);
725
- let rootMenuTriggerState = useContext($3674c52c6b3c5bce$export$795aec4671cbae19);
726
- let submenuTriggerState = $e5614764aa47eb35$export$cfc51cf86138bf98({
727
- triggerKey: item.key
728
- }, rootMenuTriggerState);
729
- let submenuRef = useRef(null);
730
- let itemRef = $df56164dff5785e2$export$4338b53315abf666(ref);
731
- let popoverContext = $64fa3d84918910a7$export$fabf2dc03a41866e($07b14b47974efb58$export$9b9a0cd73afb7ca4);
732
- let { parentMenuRef } = useContext($3674c52c6b3c5bce$var$SubmenuTriggerContext);
733
- let { submenuTriggerProps, submenuProps, popoverProps } = $0065b146e7192841$export$7138b0d059a6e743({
734
- parentMenuRef,
735
- submenuRef,
736
- delay: props.delay
737
- }, submenuTriggerState, itemRef);
738
- return /* @__PURE__ */ React__default.createElement($64fa3d84918910a7$export$2881499e37b75b9a, {
739
- values: [
740
- [
741
- $3674c52c6b3c5bce$var$MenuItemContext,
742
- {
743
- ...submenuTriggerProps,
744
- onAction: void 0,
745
- ref: itemRef
746
- }
747
- ],
748
- [
749
- $3674c52c6b3c5bce$export$c7e742effb1c51e2,
750
- submenuProps
751
- ],
752
- [
753
- $de32f1b87079253c$export$d2f961adcb0afbe,
754
- submenuTriggerState
755
- ],
756
- [
757
- $07b14b47974efb58$export$9b9a0cd73afb7ca4,
758
- {
759
- ref: submenuRef,
760
- trigger: "SubmenuTrigger",
761
- triggerRef: itemRef,
762
- placement: "end top",
763
- UNSTABLE_portalContainer: popoverContext.UNSTABLE_portalContainer || void 0,
764
- ...popoverProps
765
- }
766
- ]
767
- ]
768
- }, /* @__PURE__ */ React__default.createElement(CollectionBranch, {
769
- collection: state.collection,
770
- parent: item
771
- }), props.children[1]);
772
- }, (props) => props.children[0]);
773
- function $3674c52c6b3c5bce$var$Menu(props, ref) {
774
- [props, ref] = $64fa3d84918910a7$export$29f1550f4b0d4415(props, ref, $3674c52c6b3c5bce$export$c7e742effb1c51e2);
775
- return /* @__PURE__ */ React__default.createElement($e1995378a142960e$export$bf788dd355e3a401, {
776
- content: /* @__PURE__ */ React__default.createElement($e1995378a142960e$export$fb8073518f34e6ec, props)
777
- }, (collection) => collection.size > 0 && /* @__PURE__ */ React__default.createElement($3674c52c6b3c5bce$var$MenuInner, {
778
- props,
779
- collection,
780
- menuRef: ref
781
- }));
782
- }
783
- function $3674c52c6b3c5bce$var$MenuInner({ props, collection, menuRef: ref }) {
784
- let state = $875d6693e12af071$export$728d6ba534403756({
785
- ...props,
786
- collection,
787
- children: void 0
788
- });
789
- let [popoverContainer, setPopoverContainer] = useState(null);
790
- let { isVirtualized, CollectionRoot } = useContext($7135fc7d473fd974$export$4feb769f8ddf26c5);
791
- let { menuProps } = $d5336fe17ce95402$export$38eaa17faae8f579({
792
- ...props,
793
- isVirtualized
794
- }, state, ref);
795
- let rootMenuTriggerState = useContext($3674c52c6b3c5bce$export$795aec4671cbae19);
796
- let popoverContext = useContext($07b14b47974efb58$export$9b9a0cd73afb7ca4);
797
- let isSubmenu = (popoverContext === null || popoverContext === void 0 ? void 0 : popoverContext.trigger) === "SubmenuTrigger";
798
- $e0b6e0b68ec7f50f$export$872b660ac5a1ff98({
799
- ref,
800
- onInteractOutside: (e) => {
801
- if (rootMenuTriggerState && !(popoverContainer === null || popoverContainer === void 0 ? void 0 : popoverContainer.contains(e.target))) rootMenuTriggerState.close();
802
- },
803
- isDisabled: isSubmenu || (rootMenuTriggerState === null || rootMenuTriggerState === void 0 ? void 0 : rootMenuTriggerState.expandedKeysStack.length) === 0
804
- });
805
- let prevPopoverContainer = useRef(null);
806
- let [leftOffset, setLeftOffset] = useState({
807
- left: 0
808
- });
809
- useEffect(() => {
810
- if (popoverContainer && prevPopoverContainer.current !== popoverContainer && leftOffset.left === 0) {
811
- prevPopoverContainer.current = popoverContainer;
812
- let { left } = popoverContainer.getBoundingClientRect();
813
- setLeftOffset({
814
- left: -1 * left
815
- });
816
- }
817
- }, [
818
- leftOffset,
819
- popoverContainer
820
- ]);
821
- let renderProps = $64fa3d84918910a7$export$4d86445c2cf5e3({
822
- defaultClassName: "react-aria-Menu",
823
- className: props.className,
824
- style: props.style,
825
- values: {}
826
- });
827
- return /* @__PURE__ */ React__default.createElement($9bf71ea28793e738$export$20e40289641fbbb6, null, /* @__PURE__ */ React__default.createElement("div", {
828
- ...$65484d02dcb7eb3e$export$457c3d6518dd4c6f(props),
829
- ...menuProps,
830
- ...renderProps,
831
- ref,
832
- slot: props.slot || void 0,
833
- onScroll: props.onScroll
834
- }, /* @__PURE__ */ React__default.createElement($64fa3d84918910a7$export$2881499e37b75b9a, {
835
- values: [
836
- [
837
- $3674c52c6b3c5bce$export$24aad8519b95b41b,
838
- state
839
- ],
840
- [
841
- $431f98aba6844401$export$6615d83f6de245ce,
842
- {
843
- elementType: "div"
844
- }
845
- ],
846
- [
847
- $07b14b47974efb58$export$9b9a0cd73afb7ca4,
848
- {
849
- UNSTABLE_portalContainer: popoverContainer || void 0
850
- }
851
- ],
852
- [
853
- $7135fc7d473fd974$export$d40e14dec8b060a8,
854
- {
855
- render: $3674c52c6b3c5bce$var$MenuSection
856
- }
857
- ],
858
- [
859
- $3674c52c6b3c5bce$var$SubmenuTriggerContext,
860
- {
861
- parentMenuRef: ref
862
- }
863
- ],
864
- [
865
- $3674c52c6b3c5bce$var$MenuItemContext,
866
- null
867
- ]
868
- ]
869
- }, /* @__PURE__ */ React__default.createElement(CollectionRoot, {
870
- collection,
871
- persistedKeys: $7135fc7d473fd974$export$90e00781bc59d8f9(state.selectionManager.focusedKey),
872
- scrollRef: ref
873
- }))), /* @__PURE__ */ React__default.createElement("div", {
874
- ref: setPopoverContainer,
875
- style: {
876
- width: "100vw",
877
- position: "absolute",
878
- top: 0,
879
- ...leftOffset
880
- }
881
- }));
882
- }
883
- const $3674c52c6b3c5bce$export$d9b273488cd8ce6f = /* @__PURE__ */ forwardRef($3674c52c6b3c5bce$var$Menu);
884
- function $3674c52c6b3c5bce$var$MenuSection(props, ref, section) {
885
- var _section_props, _section_props1;
886
- let state = useContext($3674c52c6b3c5bce$export$24aad8519b95b41b);
887
- let { CollectionBranch } = useContext($7135fc7d473fd974$export$4feb769f8ddf26c5);
888
- let [headingRef, heading] = $64fa3d84918910a7$export$9d4c57ee4c6ffdd8();
889
- var _section_props_arialabel;
890
- let { headingProps, groupProps } = $3e5eb2498db5b506$export$73f7a44322579622({
891
- heading,
892
- "aria-label": (_section_props_arialabel = section.props["aria-label"]) !== null && _section_props_arialabel !== void 0 ? _section_props_arialabel : void 0
893
- });
894
- let renderProps = $64fa3d84918910a7$export$4d86445c2cf5e3({
895
- defaultClassName: "react-aria-Section",
896
- className: (_section_props = section.props) === null || _section_props === void 0 ? void 0 : _section_props.className,
897
- style: (_section_props1 = section.props) === null || _section_props1 === void 0 ? void 0 : _section_props1.style,
898
- values: {}
899
- });
900
- return /* @__PURE__ */ React__default.createElement("section", {
901
- ...$65484d02dcb7eb3e$export$457c3d6518dd4c6f(props),
902
- ...groupProps,
903
- ...renderProps,
904
- ref
905
- }, /* @__PURE__ */ React__default.createElement($72a5793c14baf454$export$e0e4026c12a8bdbb.Provider, {
906
- value: {
907
- ...headingProps,
908
- ref: headingRef
909
- }
910
- }, /* @__PURE__ */ React__default.createElement(CollectionBranch, {
911
- collection: state.collection,
912
- parent: section
913
- })));
914
- }
915
- const $3674c52c6b3c5bce$var$MenuItemContext = /* @__PURE__ */ createContext(null);
916
- const $3674c52c6b3c5bce$export$2ce376c2cc3355c8 = /* @__PURE__ */ $e1995378a142960e$export$18af5c7a9e9b3664("item", function MenuItem(props, forwardedRef, item) {
917
- var _useSlottedContext;
918
- [props, forwardedRef] = $64fa3d84918910a7$export$29f1550f4b0d4415(props, forwardedRef, $3674c52c6b3c5bce$var$MenuItemContext);
919
- let id = (_useSlottedContext = $64fa3d84918910a7$export$fabf2dc03a41866e($3674c52c6b3c5bce$var$MenuItemContext)) === null || _useSlottedContext === void 0 ? void 0 : _useSlottedContext.id;
920
- let state = useContext($3674c52c6b3c5bce$export$24aad8519b95b41b);
921
- let ref = $df56164dff5785e2$export$4338b53315abf666(forwardedRef);
922
- let { menuItemProps, labelProps, descriptionProps, keyboardShortcutProps, ...states } = $a2e5df62f93c7633$export$9d32628fc2aea7da({
923
- ...props,
924
- id,
925
- key: item.key
926
- }, state, ref);
927
- let { isFocusVisible, focusProps } = $f7dceffc5ad7768b$export$4e328f61c538687f();
928
- let { hoverProps, isHovered } = $6179b936705e76d3$export$ae780daf29e6d456({
929
- isDisabled: states.isDisabled
930
- });
931
- let renderProps = $64fa3d84918910a7$export$4d86445c2cf5e3({
932
- ...props,
933
- id: void 0,
934
- children: item.rendered,
935
- defaultClassName: "react-aria-MenuItem",
936
- values: {
937
- ...states,
938
- isHovered,
939
- isFocusVisible,
940
- selectionMode: state.selectionManager.selectionMode,
941
- selectionBehavior: state.selectionManager.selectionBehavior,
942
- hasSubmenu: !!props["aria-haspopup"],
943
- isOpen: props["aria-expanded"] === "true"
944
- }
945
- });
946
- let ElementType = props.href ? "a" : "div";
947
- return /* @__PURE__ */ React__default.createElement(ElementType, {
948
- ...$3ef42575df84b30b$export$9d1611c77c2fe928(menuItemProps, focusProps, hoverProps),
949
- ...renderProps,
950
- ref,
951
- "data-disabled": states.isDisabled || void 0,
952
- "data-hovered": isHovered || void 0,
953
- "data-focused": states.isFocused || void 0,
954
- "data-focus-visible": isFocusVisible || void 0,
955
- "data-pressed": states.isPressed || void 0,
956
- "data-selected": states.isSelected || void 0,
957
- "data-selection-mode": state.selectionManager.selectionMode === "none" ? void 0 : state.selectionManager.selectionMode,
958
- "data-has-submenu": !!props["aria-haspopup"] || void 0,
959
- "data-open": props["aria-expanded"] === "true" || void 0
960
- }, /* @__PURE__ */ React__default.createElement($64fa3d84918910a7$export$2881499e37b75b9a, {
961
- values: [
962
- [
963
- $514c0188e459b4c0$export$9afb8bc826b033ea,
964
- {
965
- slots: {
966
- label: labelProps,
967
- description: descriptionProps
968
- }
969
- }
970
- ],
971
- [
972
- $63df2425e2108aa8$export$744d98a3b8a94e1c,
973
- keyboardShortcutProps
974
- ]
975
- ]
976
- }, renderProps.children));
977
- });
9
+ import { cloneElement } from "react";
10
+ import { _ as __ } from "../../default-i18n-CM1-Xvzf.js";
978
11
  /**
979
12
  * A simple menu component.
980
13
  *
@@ -1163,7 +196,7 @@ const MenuSeparator = () => {
1163
196
  *
1164
197
  * @preserve
1165
198
  */
1166
- const MenuItem2 = (props) => {
199
+ const MenuItem = (props) => {
1167
200
  const {
1168
201
  icon,
1169
202
  children,
@@ -1246,7 +279,7 @@ const SubMenuItem = (props) => {
1246
279
  SubMenuItem.displayName = "SubMenuItem";
1247
280
  export {
1248
281
  Menu,
1249
- MenuItem2 as MenuItem,
282
+ MenuItem,
1250
283
  MenuSection,
1251
284
  MenuSeparator,
1252
285
  SubMenuItem