@radix-ui/react-menubar 1.0.5-rc.9 → 1.1.0-rc.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,549 +1,462 @@
1
- var $fIWtd$babelruntimehelpersextends = require("@babel/runtime/helpers/extends");
2
- var $fIWtd$react = require("react");
3
- var $fIWtd$radixuireactcollection = require("@radix-ui/react-collection");
4
- var $fIWtd$radixuireactdirection = require("@radix-ui/react-direction");
5
- var $fIWtd$radixuiprimitive = require("@radix-ui/primitive");
6
- var $fIWtd$radixuireactcomposerefs = require("@radix-ui/react-compose-refs");
7
- var $fIWtd$radixuireactcontext = require("@radix-ui/react-context");
8
- var $fIWtd$radixuireactid = require("@radix-ui/react-id");
9
- var $fIWtd$radixuireactmenu = require("@radix-ui/react-menu");
10
- var $fIWtd$radixuireactrovingfocus = require("@radix-ui/react-roving-focus");
11
- var $fIWtd$radixuireactprimitive = require("@radix-ui/react-primitive");
12
- var $fIWtd$radixuireactusecontrollablestate = require("@radix-ui/react-use-controllable-state");
1
+ "use strict";
2
+ "use client";
3
+ (() => {
4
+ var __create = Object.create;
5
+ var __defProp = Object.defineProperty;
6
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
7
+ var __getOwnPropNames = Object.getOwnPropertyNames;
8
+ var __getProtoOf = Object.getPrototypeOf;
9
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
10
+ var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
11
+ get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
12
+ }) : x)(function(x) {
13
+ if (typeof require !== "undefined") return require.apply(this, arguments);
14
+ throw Error('Dynamic require of "' + x + '" is not supported');
15
+ });
16
+ var __copyProps = (to, from, except, desc) => {
17
+ if (from && typeof from === "object" || typeof from === "function") {
18
+ for (let key of __getOwnPropNames(from))
19
+ if (!__hasOwnProp.call(to, key) && key !== except)
20
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
21
+ }
22
+ return to;
23
+ };
24
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
25
+ // If the importer is in node compatibility mode or this is not an ESM
26
+ // file that has been converted to a CommonJS file using a Babel-
27
+ // compatible transform (i.e. "__esModule" has not been set), then set
28
+ // "default" to the CommonJS "module.exports" for node compatibility.
29
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
30
+ mod
31
+ ));
13
32
 
14
- function $parcel$export(e, n, v, s) {
15
- Object.defineProperty(e, n, {get: v, set: s, enumerable: true, configurable: true});
16
- }
17
- function $parcel$interopDefault(a) {
18
- return a && a.__esModule ? a.default : a;
19
- }
20
-
21
- $parcel$export(module.exports, "createMenubarScope", () => $f5560139001bae38$export$7a4049d5555b545c);
22
- $parcel$export(module.exports, "Menubar", () => $f5560139001bae38$export$7d4583da7581e674);
23
- $parcel$export(module.exports, "MenubarMenu", () => $f5560139001bae38$export$c777b394d551050b);
24
- $parcel$export(module.exports, "MenubarTrigger", () => $f5560139001bae38$export$df05cd234081ebd5);
25
- $parcel$export(module.exports, "MenubarPortal", () => $f5560139001bae38$export$a98ed304d621e164);
26
- $parcel$export(module.exports, "MenubarContent", () => $f5560139001bae38$export$f42a00bc8a46c161);
27
- $parcel$export(module.exports, "MenubarGroup", () => $f5560139001bae38$export$7669e79198e0f2eb);
28
- $parcel$export(module.exports, "MenubarLabel", () => $f5560139001bae38$export$39935c5b19a4b4e);
29
- $parcel$export(module.exports, "MenubarItem", () => $f5560139001bae38$export$92f903c8c91c291c);
30
- $parcel$export(module.exports, "MenubarCheckboxItem", () => $f5560139001bae38$export$372384eccd27af53);
31
- $parcel$export(module.exports, "MenubarRadioGroup", () => $f5560139001bae38$export$94dfa2322f330fdb);
32
- $parcel$export(module.exports, "MenubarRadioItem", () => $f5560139001bae38$export$7d2f467b4a7f68d8);
33
- $parcel$export(module.exports, "MenubarItemIndicator", () => $f5560139001bae38$export$63e15a0e2af5a57);
34
- $parcel$export(module.exports, "MenubarSeparator", () => $f5560139001bae38$export$588aef9e7b5183b5);
35
- $parcel$export(module.exports, "MenubarArrow", () => $f5560139001bae38$export$474b9891f5b9e633);
36
- $parcel$export(module.exports, "MenubarSub", () => $f5560139001bae38$export$ed0be551778c493a);
37
- $parcel$export(module.exports, "MenubarSubTrigger", () => $f5560139001bae38$export$1820ea18a1dfed3c);
38
- $parcel$export(module.exports, "MenubarSubContent", () => $f5560139001bae38$export$1b21e255bb3e4f7f);
39
- $parcel$export(module.exports, "Root", () => $f5560139001bae38$export$be92b6f5f03c0fe9);
40
- $parcel$export(module.exports, "Menu", () => $f5560139001bae38$export$d9b273488cd8ce6f);
41
- $parcel$export(module.exports, "Trigger", () => $f5560139001bae38$export$41fb9f06171c75f4);
42
- $parcel$export(module.exports, "Portal", () => $f5560139001bae38$export$602eac185826482c);
43
- $parcel$export(module.exports, "Content", () => $f5560139001bae38$export$7c6e2c02157bb7d2);
44
- $parcel$export(module.exports, "Group", () => $f5560139001bae38$export$eb2fcfdbd7ba97d4);
45
- $parcel$export(module.exports, "Label", () => $f5560139001bae38$export$b04be29aa201d4f5);
46
- $parcel$export(module.exports, "Item", () => $f5560139001bae38$export$6d08773d2e66f8f2);
47
- $parcel$export(module.exports, "CheckboxItem", () => $f5560139001bae38$export$16ce288f89fa631c);
48
- $parcel$export(module.exports, "RadioGroup", () => $f5560139001bae38$export$a98f0dcb43a68a25);
49
- $parcel$export(module.exports, "RadioItem", () => $f5560139001bae38$export$371ab307eab489c0);
50
- $parcel$export(module.exports, "ItemIndicator", () => $f5560139001bae38$export$c3468e2714d175fa);
51
- $parcel$export(module.exports, "Separator", () => $f5560139001bae38$export$1ff3c3f08ae963c0);
52
- $parcel$export(module.exports, "Arrow", () => $f5560139001bae38$export$21b07c8f274aebd5);
53
- $parcel$export(module.exports, "Sub", () => $f5560139001bae38$export$d7a01e11500dfb6f);
54
- $parcel$export(module.exports, "SubTrigger", () => $f5560139001bae38$export$2ea8a7a591ac5eac);
55
- $parcel$export(module.exports, "SubContent", () => $f5560139001bae38$export$6d4de93b380beddf);
56
-
57
-
58
-
59
-
60
-
61
-
62
-
63
-
64
-
65
-
66
-
67
-
68
-
69
-
70
- /* -------------------------------------------------------------------------------------------------
71
- * Menubar
72
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$MENUBAR_NAME = 'Menubar';
73
- const [$f5560139001bae38$var$Collection, $f5560139001bae38$var$useCollection, $f5560139001bae38$var$createCollectionScope] = $fIWtd$radixuireactcollection.createCollection($f5560139001bae38$var$MENUBAR_NAME);
74
- const [$f5560139001bae38$var$createMenubarContext, $f5560139001bae38$export$7a4049d5555b545c] = $fIWtd$radixuireactcontext.createContextScope($f5560139001bae38$var$MENUBAR_NAME, [
75
- $f5560139001bae38$var$createCollectionScope,
76
- $fIWtd$radixuireactrovingfocus.createRovingFocusGroupScope
77
- ]);
78
- const $f5560139001bae38$var$useMenuScope = $fIWtd$radixuireactmenu.createMenuScope();
79
- const $f5560139001bae38$var$useRovingFocusGroupScope = $fIWtd$radixuireactrovingfocus.createRovingFocusGroupScope();
80
- const [$f5560139001bae38$var$MenubarContextProvider, $f5560139001bae38$var$useMenubarContext] = $f5560139001bae38$var$createMenubarContext($f5560139001bae38$var$MENUBAR_NAME);
81
- const $f5560139001bae38$export$7d4583da7581e674 = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
82
- const { __scopeMenubar: __scopeMenubar , value: valueProp , onValueChange: onValueChange , defaultValue: defaultValue , loop: loop = true , dir: dir , ...menubarProps } = props;
83
- const direction = $fIWtd$radixuireactdirection.useDirection(dir);
84
- const rovingFocusGroupScope = $f5560139001bae38$var$useRovingFocusGroupScope(__scopeMenubar);
85
- const [value1 = '', setValue] = $fIWtd$radixuireactusecontrollablestate.useControllableState({
33
+ // packages/react/menubar/src/Menubar.tsx
34
+ var React = __toESM(__require("react"));
35
+ var import_react_collection = __require("@radix-ui/react-collection");
36
+ var import_react_direction = __require("@radix-ui/react-direction");
37
+ var import_primitive = __require("@radix-ui/primitive");
38
+ var import_react_compose_refs = __require("@radix-ui/react-compose-refs");
39
+ var import_react_context = __require("@radix-ui/react-context");
40
+ var import_react_id = __require("@radix-ui/react-id");
41
+ var MenuPrimitive = __toESM(__require("@radix-ui/react-menu"));
42
+ var import_react_menu = __require("@radix-ui/react-menu");
43
+ var RovingFocusGroup = __toESM(__require("@radix-ui/react-roving-focus"));
44
+ var import_react_roving_focus = __require("@radix-ui/react-roving-focus");
45
+ var import_react_primitive = __require("@radix-ui/react-primitive");
46
+ var import_react_use_controllable_state = __require("@radix-ui/react-use-controllable-state");
47
+ var import_jsx_runtime = __require("react/jsx-runtime");
48
+ var MENUBAR_NAME = "Menubar";
49
+ var [Collection, useCollection, createCollectionScope] = (0, import_react_collection.createCollection)(MENUBAR_NAME);
50
+ var [createMenubarContext, createMenubarScope] = (0, import_react_context.createContextScope)(MENUBAR_NAME, [
51
+ createCollectionScope,
52
+ import_react_roving_focus.createRovingFocusGroupScope
53
+ ]);
54
+ var useMenuScope = (0, import_react_menu.createMenuScope)();
55
+ var useRovingFocusGroupScope = (0, import_react_roving_focus.createRovingFocusGroupScope)();
56
+ var [MenubarContextProvider, useMenubarContext] = createMenubarContext(MENUBAR_NAME);
57
+ var Menubar = React.forwardRef(
58
+ (props, forwardedRef) => {
59
+ const {
60
+ __scopeMenubar,
61
+ value: valueProp,
62
+ onValueChange,
63
+ defaultValue,
64
+ loop = true,
65
+ dir,
66
+ ...menubarProps
67
+ } = props;
68
+ const direction = (0, import_react_direction.useDirection)(dir);
69
+ const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeMenubar);
70
+ const [value = "", setValue] = (0, import_react_use_controllable_state.useControllableState)({
86
71
  prop: valueProp,
87
72
  onChange: onValueChange,
88
73
  defaultProp: defaultValue
89
- }); // We need to manage tab stop id manually as `RovingFocusGroup` updates the stop
90
- // based on focus, and in some situations our triggers won't ever be given focus
91
- // (e.g. click to open and then outside to close)
92
- const [currentTabStopId, setCurrentTabStopId] = $fIWtd$react.useState(null);
93
- return /*#__PURE__*/ $fIWtd$react.createElement($f5560139001bae38$var$MenubarContextProvider, {
94
- scope: __scopeMenubar,
95
- value: value1,
96
- onMenuOpen: $fIWtd$react.useCallback((value)=>{
97
- setValue(value);
98
- setCurrentTabStopId(value);
99
- }, [
100
- setValue
101
- ]),
102
- onMenuClose: $fIWtd$react.useCallback(()=>setValue('')
103
- , [
104
- setValue
105
- ]),
106
- onMenuToggle: $fIWtd$react.useCallback((value)=>{
107
- setValue((prevValue)=>Boolean(prevValue) ? '' : value
108
- ); // `openMenuOpen` and `onMenuToggle` are called exclusively so we
109
- // need to update the id in either case.
110
- setCurrentTabStopId(value);
111
- }, [
112
- setValue
113
- ]),
114
- dir: direction,
115
- loop: loop
116
- }, /*#__PURE__*/ $fIWtd$react.createElement($f5560139001bae38$var$Collection.Provider, {
117
- scope: __scopeMenubar
118
- }, /*#__PURE__*/ $fIWtd$react.createElement($f5560139001bae38$var$Collection.Slot, {
119
- scope: __scopeMenubar
120
- }, /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactrovingfocus.Root, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({
121
- asChild: true
122
- }, rovingFocusGroupScope, {
123
- orientation: "horizontal",
124
- loop: loop,
125
- dir: direction,
126
- currentTabStopId: currentTabStopId,
127
- onCurrentTabStopIdChange: setCurrentTabStopId
128
- }), /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactprimitive.Primitive.div, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({
129
- role: "menubar"
130
- }, menubarProps, {
131
- ref: forwardedRef
132
- }))))));
133
- });
134
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$7d4583da7581e674, {
135
- displayName: $f5560139001bae38$var$MENUBAR_NAME
136
- });
137
- /* -------------------------------------------------------------------------------------------------
138
- * MenubarMenu
139
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$MENU_NAME = 'MenubarMenu';
140
- const [$f5560139001bae38$var$MenubarMenuProvider, $f5560139001bae38$var$useMenubarMenuContext] = $f5560139001bae38$var$createMenubarContext($f5560139001bae38$var$MENU_NAME);
141
- const $f5560139001bae38$export$c777b394d551050b = (props)=>{
142
- const { __scopeMenubar: __scopeMenubar , value: valueProp , ...menuProps } = props;
143
- const autoValue = $fIWtd$radixuireactid.useId(); // We need to provide an initial deterministic value as `useId` will return
144
- // empty string on the first render and we don't want to match our internal "closed" value.
145
- const value = valueProp || autoValue || 'LEGACY_REACT_AUTO_VALUE';
146
- const context = $f5560139001bae38$var$useMenubarContext($f5560139001bae38$var$MENU_NAME, __scopeMenubar);
147
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
148
- const triggerRef = $fIWtd$react.useRef(null);
149
- const wasKeyboardTriggerOpenRef = $fIWtd$react.useRef(false);
150
- const open1 = context.value === value;
151
- $fIWtd$react.useEffect(()=>{
152
- if (!open1) wasKeyboardTriggerOpenRef.current = false;
153
- }, [
154
- open1
155
- ]);
156
- return /*#__PURE__*/ $fIWtd$react.createElement($f5560139001bae38$var$MenubarMenuProvider, {
157
- scope: __scopeMenubar,
158
- value: value,
159
- triggerId: $fIWtd$radixuireactid.useId(),
160
- triggerRef: triggerRef,
161
- contentId: $fIWtd$radixuireactid.useId(),
162
- wasKeyboardTriggerOpenRef: wasKeyboardTriggerOpenRef
163
- }, /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.Root, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, {
164
- open: open1,
165
- onOpenChange: (open)=>{
166
- // Menu only calls `onOpenChange` when dismissing so we
167
- // want to close our MenuBar based on the same events.
168
- if (!open) context.onMenuClose();
169
- },
170
- modal: false,
171
- dir: context.dir
172
- }, menuProps)));
173
- };
174
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$c777b394d551050b, {
175
- displayName: $f5560139001bae38$var$MENU_NAME
176
- });
177
- /* -------------------------------------------------------------------------------------------------
178
- * MenubarTrigger
179
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$TRIGGER_NAME = 'MenubarTrigger';
180
- const $f5560139001bae38$export$df05cd234081ebd5 = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
181
- const { __scopeMenubar: __scopeMenubar , disabled: disabled = false , ...triggerProps } = props;
182
- const rovingFocusGroupScope = $f5560139001bae38$var$useRovingFocusGroupScope(__scopeMenubar);
183
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
184
- const context = $f5560139001bae38$var$useMenubarContext($f5560139001bae38$var$TRIGGER_NAME, __scopeMenubar);
185
- const menuContext = $f5560139001bae38$var$useMenubarMenuContext($f5560139001bae38$var$TRIGGER_NAME, __scopeMenubar);
186
- const ref = $fIWtd$react.useRef(null);
187
- const composedRefs = $fIWtd$radixuireactcomposerefs.useComposedRefs(forwardedRef, ref, menuContext.triggerRef);
188
- const [isFocused, setIsFocused] = $fIWtd$react.useState(false);
189
- const open = context.value === menuContext.value;
190
- return /*#__PURE__*/ $fIWtd$react.createElement($f5560139001bae38$var$Collection.ItemSlot, {
191
- scope: __scopeMenubar,
192
- value: menuContext.value,
193
- disabled: disabled
194
- }, /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactrovingfocus.Item, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({
195
- asChild: true
196
- }, rovingFocusGroupScope, {
197
- focusable: !disabled,
198
- tabStopId: menuContext.value
199
- }), /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.Anchor, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({
200
- asChild: true
201
- }, menuScope), /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactprimitive.Primitive.button, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({
202
- type: "button",
203
- role: "menuitem",
204
- id: menuContext.triggerId,
205
- "aria-haspopup": "menu",
206
- "aria-expanded": open,
207
- "aria-controls": open ? menuContext.contentId : undefined,
208
- "data-highlighted": isFocused ? '' : undefined,
209
- "data-state": open ? 'open' : 'closed',
210
- "data-disabled": disabled ? '' : undefined,
211
- disabled: disabled
212
- }, triggerProps, {
213
- ref: composedRefs,
214
- onPointerDown: $fIWtd$radixuiprimitive.composeEventHandlers(props.onPointerDown, (event)=>{
215
- // only call handler if it's the left button (mousedown gets triggered by all mouse buttons)
216
- // but not when the control key is pressed (avoiding MacOS right click)
217
- if (!disabled && event.button === 0 && event.ctrlKey === false) {
218
- context.onMenuOpen(menuContext.value); // prevent trigger focusing when opening
219
- // this allows the content to be given focus without competition
220
- if (!open) event.preventDefault();
74
+ });
75
+ const [currentTabStopId, setCurrentTabStopId] = React.useState(null);
76
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
77
+ MenubarContextProvider,
78
+ {
79
+ scope: __scopeMenubar,
80
+ value,
81
+ onMenuOpen: React.useCallback(
82
+ (value2) => {
83
+ setValue(value2);
84
+ setCurrentTabStopId(value2);
85
+ },
86
+ [setValue]
87
+ ),
88
+ onMenuClose: React.useCallback(() => setValue(""), [setValue]),
89
+ onMenuToggle: React.useCallback(
90
+ (value2) => {
91
+ setValue((prevValue) => Boolean(prevValue) ? "" : value2);
92
+ setCurrentTabStopId(value2);
93
+ },
94
+ [setValue]
95
+ ),
96
+ dir: direction,
97
+ loop,
98
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Provider, { scope: __scopeMenubar, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.Slot, { scope: __scopeMenubar, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
99
+ RovingFocusGroup.Root,
100
+ {
101
+ asChild: true,
102
+ ...rovingFocusGroupScope,
103
+ orientation: "horizontal",
104
+ loop,
105
+ dir: direction,
106
+ currentTabStopId,
107
+ onCurrentTabStopIdChange: setCurrentTabStopId,
108
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_primitive.Primitive.div, { role: "menubar", ...menubarProps, ref: forwardedRef })
221
109
  }
222
- }),
223
- onPointerEnter: $fIWtd$radixuiprimitive.composeEventHandlers(props.onPointerEnter, ()=>{
224
- const menubarOpen = Boolean(context.value);
225
- if (menubarOpen && !open) {
226
- var _ref$current;
227
- context.onMenuOpen(menuContext.value);
228
- (_ref$current = ref.current) === null || _ref$current === void 0 || _ref$current.focus();
229
- }
230
- }),
231
- onKeyDown: $fIWtd$radixuiprimitive.composeEventHandlers(props.onKeyDown, (event)=>{
232
- if (disabled) return;
233
- if ([
234
- 'Enter',
235
- ' '
236
- ].includes(event.key)) context.onMenuToggle(menuContext.value);
237
- if (event.key === 'ArrowDown') context.onMenuOpen(menuContext.value); // prevent keydown from scrolling window / first focused item to execute
238
- // that keydown (inadvertently closing the menu)
239
- if ([
240
- 'Enter',
241
- ' ',
242
- 'ArrowDown'
243
- ].includes(event.key)) {
244
- menuContext.wasKeyboardTriggerOpenRef.current = true;
245
- event.preventDefault();
246
- }
247
- }),
248
- onFocus: $fIWtd$radixuiprimitive.composeEventHandlers(props.onFocus, ()=>setIsFocused(true)
249
- ),
250
- onBlur: $fIWtd$radixuiprimitive.composeEventHandlers(props.onBlur, ()=>setIsFocused(false)
110
+ ) }) })
111
+ }
112
+ );
113
+ }
114
+ );
115
+ Menubar.displayName = MENUBAR_NAME;
116
+ var MENU_NAME = "MenubarMenu";
117
+ var [MenubarMenuProvider, useMenubarMenuContext] = createMenubarContext(MENU_NAME);
118
+ var MenubarMenu = (props) => {
119
+ const { __scopeMenubar, value: valueProp, ...menuProps } = props;
120
+ const autoValue = (0, import_react_id.useId)();
121
+ const value = valueProp || autoValue || "LEGACY_REACT_AUTO_VALUE";
122
+ const context = useMenubarContext(MENU_NAME, __scopeMenubar);
123
+ const menuScope = useMenuScope(__scopeMenubar);
124
+ const triggerRef = React.useRef(null);
125
+ const wasKeyboardTriggerOpenRef = React.useRef(false);
126
+ const open = context.value === value;
127
+ React.useEffect(() => {
128
+ if (!open) wasKeyboardTriggerOpenRef.current = false;
129
+ }, [open]);
130
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
131
+ MenubarMenuProvider,
132
+ {
133
+ scope: __scopeMenubar,
134
+ value,
135
+ triggerId: (0, import_react_id.useId)(),
136
+ triggerRef,
137
+ contentId: (0, import_react_id.useId)(),
138
+ wasKeyboardTriggerOpenRef,
139
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
140
+ MenuPrimitive.Root,
141
+ {
142
+ ...menuScope,
143
+ open,
144
+ onOpenChange: (open2) => {
145
+ if (!open2) context.onMenuClose();
146
+ },
147
+ modal: false,
148
+ dir: context.dir,
149
+ ...menuProps
150
+ }
251
151
  )
252
- })))));
253
- });
254
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$df05cd234081ebd5, {
255
- displayName: $f5560139001bae38$var$TRIGGER_NAME
256
- });
257
- /* -------------------------------------------------------------------------------------------------
258
- * MenubarPortal
259
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$PORTAL_NAME = 'MenubarPortal';
260
- const $f5560139001bae38$export$a98ed304d621e164 = (props)=>{
261
- const { __scopeMenubar: __scopeMenubar , ...portalProps } = props;
262
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
263
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.Portal, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, portalProps));
264
- };
265
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$a98ed304d621e164, {
266
- displayName: $f5560139001bae38$var$PORTAL_NAME
267
- });
268
- /* -------------------------------------------------------------------------------------------------
269
- * MenubarContent
270
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$CONTENT_NAME = 'MenubarContent';
271
- const $f5560139001bae38$export$f42a00bc8a46c161 = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
272
- const { __scopeMenubar: __scopeMenubar , align: align = 'start' , ...contentProps } = props;
273
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
274
- const context = $f5560139001bae38$var$useMenubarContext($f5560139001bae38$var$CONTENT_NAME, __scopeMenubar);
275
- const menuContext = $f5560139001bae38$var$useMenubarMenuContext($f5560139001bae38$var$CONTENT_NAME, __scopeMenubar);
276
- const getItems = $f5560139001bae38$var$useCollection(__scopeMenubar);
277
- const hasInteractedOutsideRef = $fIWtd$react.useRef(false);
278
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.Content, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({
279
- id: menuContext.contentId,
280
- "aria-labelledby": menuContext.triggerId,
281
- "data-radix-menubar-content": ""
282
- }, menuScope, contentProps, {
283
- ref: forwardedRef,
284
- align: align,
285
- onCloseAutoFocus: $fIWtd$radixuiprimitive.composeEventHandlers(props.onCloseAutoFocus, (event)=>{
152
+ }
153
+ );
154
+ };
155
+ MenubarMenu.displayName = MENU_NAME;
156
+ var TRIGGER_NAME = "MenubarTrigger";
157
+ var MenubarTrigger = React.forwardRef(
158
+ (props, forwardedRef) => {
159
+ const { __scopeMenubar, disabled = false, ...triggerProps } = props;
160
+ const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeMenubar);
161
+ const menuScope = useMenuScope(__scopeMenubar);
162
+ const context = useMenubarContext(TRIGGER_NAME, __scopeMenubar);
163
+ const menuContext = useMenubarMenuContext(TRIGGER_NAME, __scopeMenubar);
164
+ const ref = React.useRef(null);
165
+ const composedRefs = (0, import_react_compose_refs.useComposedRefs)(forwardedRef, ref, menuContext.triggerRef);
166
+ const [isFocused, setIsFocused] = React.useState(false);
167
+ const open = context.value === menuContext.value;
168
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Collection.ItemSlot, { scope: __scopeMenubar, value: menuContext.value, disabled, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
169
+ RovingFocusGroup.Item,
170
+ {
171
+ asChild: true,
172
+ ...rovingFocusGroupScope,
173
+ focusable: !disabled,
174
+ tabStopId: menuContext.value,
175
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuPrimitive.Anchor, { asChild: true, ...menuScope, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
176
+ import_react_primitive.Primitive.button,
177
+ {
178
+ type: "button",
179
+ role: "menuitem",
180
+ id: menuContext.triggerId,
181
+ "aria-haspopup": "menu",
182
+ "aria-expanded": open,
183
+ "aria-controls": open ? menuContext.contentId : void 0,
184
+ "data-highlighted": isFocused ? "" : void 0,
185
+ "data-state": open ? "open" : "closed",
186
+ "data-disabled": disabled ? "" : void 0,
187
+ disabled,
188
+ ...triggerProps,
189
+ ref: composedRefs,
190
+ onPointerDown: (0, import_primitive.composeEventHandlers)(props.onPointerDown, (event) => {
191
+ if (!disabled && event.button === 0 && event.ctrlKey === false) {
192
+ context.onMenuOpen(menuContext.value);
193
+ if (!open) event.preventDefault();
194
+ }
195
+ }),
196
+ onPointerEnter: (0, import_primitive.composeEventHandlers)(props.onPointerEnter, () => {
197
+ const menubarOpen = Boolean(context.value);
198
+ if (menubarOpen && !open) {
199
+ context.onMenuOpen(menuContext.value);
200
+ ref.current?.focus();
201
+ }
202
+ }),
203
+ onKeyDown: (0, import_primitive.composeEventHandlers)(props.onKeyDown, (event) => {
204
+ if (disabled) return;
205
+ if (["Enter", " "].includes(event.key)) context.onMenuToggle(menuContext.value);
206
+ if (event.key === "ArrowDown") context.onMenuOpen(menuContext.value);
207
+ if (["Enter", " ", "ArrowDown"].includes(event.key)) {
208
+ menuContext.wasKeyboardTriggerOpenRef.current = true;
209
+ event.preventDefault();
210
+ }
211
+ }),
212
+ onFocus: (0, import_primitive.composeEventHandlers)(props.onFocus, () => setIsFocused(true)),
213
+ onBlur: (0, import_primitive.composeEventHandlers)(props.onBlur, () => setIsFocused(false))
214
+ }
215
+ ) })
216
+ }
217
+ ) });
218
+ }
219
+ );
220
+ MenubarTrigger.displayName = TRIGGER_NAME;
221
+ var PORTAL_NAME = "MenubarPortal";
222
+ var MenubarPortal = (props) => {
223
+ const { __scopeMenubar, ...portalProps } = props;
224
+ const menuScope = useMenuScope(__scopeMenubar);
225
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuPrimitive.Portal, { ...menuScope, ...portalProps });
226
+ };
227
+ MenubarPortal.displayName = PORTAL_NAME;
228
+ var CONTENT_NAME = "MenubarContent";
229
+ var MenubarContent = React.forwardRef(
230
+ (props, forwardedRef) => {
231
+ const { __scopeMenubar, align = "start", ...contentProps } = props;
232
+ const menuScope = useMenuScope(__scopeMenubar);
233
+ const context = useMenubarContext(CONTENT_NAME, __scopeMenubar);
234
+ const menuContext = useMenubarMenuContext(CONTENT_NAME, __scopeMenubar);
235
+ const getItems = useCollection(__scopeMenubar);
236
+ const hasInteractedOutsideRef = React.useRef(false);
237
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
238
+ MenuPrimitive.Content,
239
+ {
240
+ id: menuContext.contentId,
241
+ "aria-labelledby": menuContext.triggerId,
242
+ "data-radix-menubar-content": "",
243
+ ...menuScope,
244
+ ...contentProps,
245
+ ref: forwardedRef,
246
+ align,
247
+ onCloseAutoFocus: (0, import_primitive.composeEventHandlers)(props.onCloseAutoFocus, (event) => {
286
248
  const menubarOpen = Boolean(context.value);
287
249
  if (!menubarOpen && !hasInteractedOutsideRef.current) {
288
- var _menuContext$triggerR;
289
- (_menuContext$triggerR = menuContext.triggerRef.current) === null || _menuContext$triggerR === void 0 || _menuContext$triggerR.focus();
250
+ menuContext.triggerRef.current?.focus();
290
251
  }
291
- hasInteractedOutsideRef.current = false; // Always prevent auto focus because we either focus manually or want user agent focus
252
+ hasInteractedOutsideRef.current = false;
292
253
  event.preventDefault();
293
- }),
294
- onFocusOutside: $fIWtd$radixuiprimitive.composeEventHandlers(props.onFocusOutside, (event)=>{
254
+ }),
255
+ onFocusOutside: (0, import_primitive.composeEventHandlers)(props.onFocusOutside, (event) => {
295
256
  const target = event.target;
296
- const isMenubarTrigger = getItems().some((item)=>{
297
- var _item$ref$current;
298
- return (_item$ref$current = item.ref.current) === null || _item$ref$current === void 0 ? void 0 : _item$ref$current.contains(target);
299
- });
257
+ const isMenubarTrigger = getItems().some((item) => item.ref.current?.contains(target));
300
258
  if (isMenubarTrigger) event.preventDefault();
301
- }),
302
- onInteractOutside: $fIWtd$radixuiprimitive.composeEventHandlers(props.onInteractOutside, ()=>{
259
+ }),
260
+ onInteractOutside: (0, import_primitive.composeEventHandlers)(props.onInteractOutside, () => {
303
261
  hasInteractedOutsideRef.current = true;
304
- }),
305
- onEntryFocus: (event)=>{
262
+ }),
263
+ onEntryFocus: (event) => {
306
264
  if (!menuContext.wasKeyboardTriggerOpenRef.current) event.preventDefault();
307
- },
308
- onKeyDown: $fIWtd$radixuiprimitive.composeEventHandlers(props.onKeyDown, (event)=>{
309
- if ([
310
- 'ArrowRight',
311
- 'ArrowLeft'
312
- ].includes(event.key)) {
265
+ },
266
+ onKeyDown: (0, import_primitive.composeEventHandlers)(
267
+ props.onKeyDown,
268
+ (event) => {
269
+ if (["ArrowRight", "ArrowLeft"].includes(event.key)) {
313
270
  const target = event.target;
314
- const targetIsSubTrigger = target.hasAttribute('data-radix-menubar-subtrigger');
315
- const isKeyDownInsideSubMenu = target.closest('[data-radix-menubar-content]') !== event.currentTarget;
316
- const prevMenuKey = context.dir === 'rtl' ? 'ArrowRight' : 'ArrowLeft';
271
+ const targetIsSubTrigger = target.hasAttribute("data-radix-menubar-subtrigger");
272
+ const isKeyDownInsideSubMenu = target.closest("[data-radix-menubar-content]") !== event.currentTarget;
273
+ const prevMenuKey = context.dir === "rtl" ? "ArrowRight" : "ArrowLeft";
317
274
  const isPrevKey = prevMenuKey === event.key;
318
- const isNextKey = !isPrevKey; // Prevent navigation when we're opening a submenu
319
- if (isNextKey && targetIsSubTrigger) return; // or we're inside a submenu and are moving backwards to close it
275
+ const isNextKey = !isPrevKey;
276
+ if (isNextKey && targetIsSubTrigger) return;
320
277
  if (isKeyDownInsideSubMenu && isPrevKey) return;
321
- const items = getItems().filter((item)=>!item.disabled
322
- );
323
- let candidateValues = items.map((item)=>item.value
324
- );
278
+ const items = getItems().filter((item) => !item.disabled);
279
+ let candidateValues = items.map((item) => item.value);
325
280
  if (isPrevKey) candidateValues.reverse();
326
281
  const currentIndex = candidateValues.indexOf(menuContext.value);
327
- candidateValues = context.loop ? $f5560139001bae38$var$wrapArray(candidateValues, currentIndex + 1) : candidateValues.slice(currentIndex + 1);
282
+ candidateValues = context.loop ? wrapArray(candidateValues, currentIndex + 1) : candidateValues.slice(currentIndex + 1);
328
283
  const [nextValue] = candidateValues;
329
284
  if (nextValue) context.onMenuOpen(nextValue);
330
- }
331
- }, {
332
- checkForDefaultPrevented: false
333
- }),
334
- style: {
285
+ }
286
+ },
287
+ { checkForDefaultPrevented: false }
288
+ ),
289
+ style: {
335
290
  ...props.style,
336
- '--radix-menubar-content-transform-origin': 'var(--radix-popper-transform-origin)',
337
- '--radix-menubar-content-available-width': 'var(--radix-popper-available-width)',
338
- '--radix-menubar-content-available-height': 'var(--radix-popper-available-height)',
339
- '--radix-menubar-trigger-width': 'var(--radix-popper-anchor-width)',
340
- '--radix-menubar-trigger-height': 'var(--radix-popper-anchor-height)'
291
+ // re-namespace exposed content custom properties
292
+ ...{
293
+ "--radix-menubar-content-transform-origin": "var(--radix-popper-transform-origin)",
294
+ "--radix-menubar-content-available-width": "var(--radix-popper-available-width)",
295
+ "--radix-menubar-content-available-height": "var(--radix-popper-available-height)",
296
+ "--radix-menubar-trigger-width": "var(--radix-popper-anchor-width)",
297
+ "--radix-menubar-trigger-height": "var(--radix-popper-anchor-height)"
298
+ }
299
+ }
341
300
  }
342
- }));
343
- });
344
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$f42a00bc8a46c161, {
345
- displayName: $f5560139001bae38$var$CONTENT_NAME
346
- });
347
- /* -------------------------------------------------------------------------------------------------
348
- * MenubarGroup
349
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$GROUP_NAME = 'MenubarGroup';
350
- const $f5560139001bae38$export$7669e79198e0f2eb = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
351
- const { __scopeMenubar: __scopeMenubar , ...groupProps } = props;
352
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
353
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.Group, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, groupProps, {
354
- ref: forwardedRef
355
- }));
356
- });
357
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$7669e79198e0f2eb, {
358
- displayName: $f5560139001bae38$var$GROUP_NAME
359
- });
360
- /* -------------------------------------------------------------------------------------------------
361
- * MenubarLabel
362
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$LABEL_NAME = 'MenubarLabel';
363
- const $f5560139001bae38$export$39935c5b19a4b4e = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
364
- const { __scopeMenubar: __scopeMenubar , ...labelProps } = props;
365
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
366
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.Label, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, labelProps, {
367
- ref: forwardedRef
368
- }));
369
- });
370
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$39935c5b19a4b4e, {
371
- displayName: $f5560139001bae38$var$LABEL_NAME
372
- });
373
- /* -------------------------------------------------------------------------------------------------
374
- * MenubarItem
375
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$ITEM_NAME = 'MenubarItem';
376
- const $f5560139001bae38$export$92f903c8c91c291c = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
377
- const { __scopeMenubar: __scopeMenubar , ...itemProps } = props;
378
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
379
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.Item, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, itemProps, {
380
- ref: forwardedRef
381
- }));
382
- });
383
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$92f903c8c91c291c, {
384
- displayName: $f5560139001bae38$var$ITEM_NAME
385
- });
386
- /* -------------------------------------------------------------------------------------------------
387
- * MenubarCheckboxItem
388
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$CHECKBOX_ITEM_NAME = 'MenubarCheckboxItem';
389
- const $f5560139001bae38$export$372384eccd27af53 = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
390
- const { __scopeMenubar: __scopeMenubar , ...checkboxItemProps } = props;
391
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
392
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.CheckboxItem, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, checkboxItemProps, {
393
- ref: forwardedRef
394
- }));
395
- });
396
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$372384eccd27af53, {
397
- displayName: $f5560139001bae38$var$CHECKBOX_ITEM_NAME
398
- });
399
- /* -------------------------------------------------------------------------------------------------
400
- * MenubarRadioGroup
401
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$RADIO_GROUP_NAME = 'MenubarRadioGroup';
402
- const $f5560139001bae38$export$94dfa2322f330fdb = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
403
- const { __scopeMenubar: __scopeMenubar , ...radioGroupProps } = props;
404
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
405
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.RadioGroup, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, radioGroupProps, {
406
- ref: forwardedRef
407
- }));
408
- });
409
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$94dfa2322f330fdb, {
410
- displayName: $f5560139001bae38$var$RADIO_GROUP_NAME
411
- });
412
- /* -------------------------------------------------------------------------------------------------
413
- * MenubarRadioItem
414
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$RADIO_ITEM_NAME = 'MenubarRadioItem';
415
- const $f5560139001bae38$export$7d2f467b4a7f68d8 = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
416
- const { __scopeMenubar: __scopeMenubar , ...radioItemProps } = props;
417
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
418
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.RadioItem, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, radioItemProps, {
419
- ref: forwardedRef
420
- }));
421
- });
422
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$7d2f467b4a7f68d8, {
423
- displayName: $f5560139001bae38$var$RADIO_ITEM_NAME
424
- });
425
- /* -------------------------------------------------------------------------------------------------
426
- * MenubarItemIndicator
427
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$INDICATOR_NAME = 'MenubarItemIndicator';
428
- const $f5560139001bae38$export$63e15a0e2af5a57 = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
429
- const { __scopeMenubar: __scopeMenubar , ...itemIndicatorProps } = props;
430
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
431
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.ItemIndicator, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, itemIndicatorProps, {
432
- ref: forwardedRef
433
- }));
434
- });
435
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$63e15a0e2af5a57, {
436
- displayName: $f5560139001bae38$var$INDICATOR_NAME
437
- });
438
- /* -------------------------------------------------------------------------------------------------
439
- * MenubarSeparator
440
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$SEPARATOR_NAME = 'MenubarSeparator';
441
- const $f5560139001bae38$export$588aef9e7b5183b5 = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
442
- const { __scopeMenubar: __scopeMenubar , ...separatorProps } = props;
443
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
444
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.Separator, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, separatorProps, {
445
- ref: forwardedRef
446
- }));
447
- });
448
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$588aef9e7b5183b5, {
449
- displayName: $f5560139001bae38$var$SEPARATOR_NAME
450
- });
451
- /* -------------------------------------------------------------------------------------------------
452
- * MenubarArrow
453
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$ARROW_NAME = 'MenubarArrow';
454
- const $f5560139001bae38$export$474b9891f5b9e633 = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
455
- const { __scopeMenubar: __scopeMenubar , ...arrowProps } = props;
456
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
457
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.Arrow, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, arrowProps, {
458
- ref: forwardedRef
459
- }));
460
- });
461
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$474b9891f5b9e633, {
462
- displayName: $f5560139001bae38$var$ARROW_NAME
463
- });
464
- /* -------------------------------------------------------------------------------------------------
465
- * MenubarSub
466
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$SUB_NAME = 'MenubarSub';
467
- const $f5560139001bae38$export$ed0be551778c493a = (props)=>{
468
- const { __scopeMenubar: __scopeMenubar , children: children , open: openProp , onOpenChange: onOpenChange , defaultOpen: defaultOpen } = props;
469
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
470
- const [open = false, setOpen] = $fIWtd$radixuireactusecontrollablestate.useControllableState({
471
- prop: openProp,
472
- defaultProp: defaultOpen,
473
- onChange: onOpenChange
301
+ );
302
+ }
303
+ );
304
+ MenubarContent.displayName = CONTENT_NAME;
305
+ var GROUP_NAME = "MenubarGroup";
306
+ var MenubarGroup = React.forwardRef(
307
+ (props, forwardedRef) => {
308
+ const { __scopeMenubar, ...groupProps } = props;
309
+ const menuScope = useMenuScope(__scopeMenubar);
310
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuPrimitive.Group, { ...menuScope, ...groupProps, ref: forwardedRef });
311
+ }
312
+ );
313
+ MenubarGroup.displayName = GROUP_NAME;
314
+ var LABEL_NAME = "MenubarLabel";
315
+ var MenubarLabel = React.forwardRef(
316
+ (props, forwardedRef) => {
317
+ const { __scopeMenubar, ...labelProps } = props;
318
+ const menuScope = useMenuScope(__scopeMenubar);
319
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuPrimitive.Label, { ...menuScope, ...labelProps, ref: forwardedRef });
320
+ }
321
+ );
322
+ MenubarLabel.displayName = LABEL_NAME;
323
+ var ITEM_NAME = "MenubarItem";
324
+ var MenubarItem = React.forwardRef(
325
+ (props, forwardedRef) => {
326
+ const { __scopeMenubar, ...itemProps } = props;
327
+ const menuScope = useMenuScope(__scopeMenubar);
328
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuPrimitive.Item, { ...menuScope, ...itemProps, ref: forwardedRef });
329
+ }
330
+ );
331
+ MenubarItem.displayName = ITEM_NAME;
332
+ var CHECKBOX_ITEM_NAME = "MenubarCheckboxItem";
333
+ var MenubarCheckboxItem = React.forwardRef(
334
+ (props, forwardedRef) => {
335
+ const { __scopeMenubar, ...checkboxItemProps } = props;
336
+ const menuScope = useMenuScope(__scopeMenubar);
337
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuPrimitive.CheckboxItem, { ...menuScope, ...checkboxItemProps, ref: forwardedRef });
338
+ }
339
+ );
340
+ MenubarCheckboxItem.displayName = CHECKBOX_ITEM_NAME;
341
+ var RADIO_GROUP_NAME = "MenubarRadioGroup";
342
+ var MenubarRadioGroup = React.forwardRef(
343
+ (props, forwardedRef) => {
344
+ const { __scopeMenubar, ...radioGroupProps } = props;
345
+ const menuScope = useMenuScope(__scopeMenubar);
346
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuPrimitive.RadioGroup, { ...menuScope, ...radioGroupProps, ref: forwardedRef });
347
+ }
348
+ );
349
+ MenubarRadioGroup.displayName = RADIO_GROUP_NAME;
350
+ var RADIO_ITEM_NAME = "MenubarRadioItem";
351
+ var MenubarRadioItem = React.forwardRef(
352
+ (props, forwardedRef) => {
353
+ const { __scopeMenubar, ...radioItemProps } = props;
354
+ const menuScope = useMenuScope(__scopeMenubar);
355
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuPrimitive.RadioItem, { ...menuScope, ...radioItemProps, ref: forwardedRef });
356
+ }
357
+ );
358
+ MenubarRadioItem.displayName = RADIO_ITEM_NAME;
359
+ var INDICATOR_NAME = "MenubarItemIndicator";
360
+ var MenubarItemIndicator = React.forwardRef((props, forwardedRef) => {
361
+ const { __scopeMenubar, ...itemIndicatorProps } = props;
362
+ const menuScope = useMenuScope(__scopeMenubar);
363
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuPrimitive.ItemIndicator, { ...menuScope, ...itemIndicatorProps, ref: forwardedRef });
364
+ });
365
+ MenubarItemIndicator.displayName = INDICATOR_NAME;
366
+ var SEPARATOR_NAME = "MenubarSeparator";
367
+ var MenubarSeparator = React.forwardRef(
368
+ (props, forwardedRef) => {
369
+ const { __scopeMenubar, ...separatorProps } = props;
370
+ const menuScope = useMenuScope(__scopeMenubar);
371
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuPrimitive.Separator, { ...menuScope, ...separatorProps, ref: forwardedRef });
372
+ }
373
+ );
374
+ MenubarSeparator.displayName = SEPARATOR_NAME;
375
+ var ARROW_NAME = "MenubarArrow";
376
+ var MenubarArrow = React.forwardRef(
377
+ (props, forwardedRef) => {
378
+ const { __scopeMenubar, ...arrowProps } = props;
379
+ const menuScope = useMenuScope(__scopeMenubar);
380
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuPrimitive.Arrow, { ...menuScope, ...arrowProps, ref: forwardedRef });
381
+ }
382
+ );
383
+ MenubarArrow.displayName = ARROW_NAME;
384
+ var SUB_NAME = "MenubarSub";
385
+ var MenubarSub = (props) => {
386
+ const { __scopeMenubar, children, open: openProp, onOpenChange, defaultOpen } = props;
387
+ const menuScope = useMenuScope(__scopeMenubar);
388
+ const [open = false, setOpen] = (0, import_react_use_controllable_state.useControllableState)({
389
+ prop: openProp,
390
+ defaultProp: defaultOpen,
391
+ onChange: onOpenChange
474
392
  });
475
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.Sub, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, {
476
- open: open,
477
- onOpenChange: setOpen
478
- }), children);
479
- };
480
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$ed0be551778c493a, {
481
- displayName: $f5560139001bae38$var$SUB_NAME
482
- });
483
- /* -------------------------------------------------------------------------------------------------
484
- * MenubarSubTrigger
485
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$SUB_TRIGGER_NAME = 'MenubarSubTrigger';
486
- const $f5560139001bae38$export$1820ea18a1dfed3c = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
487
- const { __scopeMenubar: __scopeMenubar , ...subTriggerProps } = props;
488
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
489
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.SubTrigger, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({
490
- "data-radix-menubar-subtrigger": ""
491
- }, menuScope, subTriggerProps, {
492
- ref: forwardedRef
493
- }));
494
- });
495
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$1820ea18a1dfed3c, {
496
- displayName: $f5560139001bae38$var$SUB_TRIGGER_NAME
497
- });
498
- /* -------------------------------------------------------------------------------------------------
499
- * MenubarSubContent
500
- * -----------------------------------------------------------------------------------------------*/ const $f5560139001bae38$var$SUB_CONTENT_NAME = 'MenubarSubContent';
501
- const $f5560139001bae38$export$1b21e255bb3e4f7f = /*#__PURE__*/ $fIWtd$react.forwardRef((props, forwardedRef)=>{
502
- const { __scopeMenubar: __scopeMenubar , ...subContentProps } = props;
503
- const menuScope = $f5560139001bae38$var$useMenuScope(__scopeMenubar);
504
- return /*#__PURE__*/ $fIWtd$react.createElement($fIWtd$radixuireactmenu.SubContent, ($parcel$interopDefault($fIWtd$babelruntimehelpersextends))({}, menuScope, {
505
- "data-radix-menubar-content": ""
506
- }, subContentProps, {
507
- ref: forwardedRef,
508
- style: {
393
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MenuPrimitive.Sub, { ...menuScope, open, onOpenChange: setOpen, children });
394
+ };
395
+ MenubarSub.displayName = SUB_NAME;
396
+ var SUB_TRIGGER_NAME = "MenubarSubTrigger";
397
+ var MenubarSubTrigger = React.forwardRef(
398
+ (props, forwardedRef) => {
399
+ const { __scopeMenubar, ...subTriggerProps } = props;
400
+ const menuScope = useMenuScope(__scopeMenubar);
401
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
402
+ MenuPrimitive.SubTrigger,
403
+ {
404
+ "data-radix-menubar-subtrigger": "",
405
+ ...menuScope,
406
+ ...subTriggerProps,
407
+ ref: forwardedRef
408
+ }
409
+ );
410
+ }
411
+ );
412
+ MenubarSubTrigger.displayName = SUB_TRIGGER_NAME;
413
+ var SUB_CONTENT_NAME = "MenubarSubContent";
414
+ var MenubarSubContent = React.forwardRef(
415
+ (props, forwardedRef) => {
416
+ const { __scopeMenubar, ...subContentProps } = props;
417
+ const menuScope = useMenuScope(__scopeMenubar);
418
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
419
+ MenuPrimitive.SubContent,
420
+ {
421
+ ...menuScope,
422
+ "data-radix-menubar-content": "",
423
+ ...subContentProps,
424
+ ref: forwardedRef,
425
+ style: {
509
426
  ...props.style,
510
- '--radix-menubar-content-transform-origin': 'var(--radix-popper-transform-origin)',
511
- '--radix-menubar-content-available-width': 'var(--radix-popper-available-width)',
512
- '--radix-menubar-content-available-height': 'var(--radix-popper-available-height)',
513
- '--radix-menubar-trigger-width': 'var(--radix-popper-anchor-width)',
514
- '--radix-menubar-trigger-height': 'var(--radix-popper-anchor-height)'
427
+ // re-namespace exposed content custom properties
428
+ ...{
429
+ "--radix-menubar-content-transform-origin": "var(--radix-popper-transform-origin)",
430
+ "--radix-menubar-content-available-width": "var(--radix-popper-available-width)",
431
+ "--radix-menubar-content-available-height": "var(--radix-popper-available-height)",
432
+ "--radix-menubar-trigger-width": "var(--radix-popper-anchor-width)",
433
+ "--radix-menubar-trigger-height": "var(--radix-popper-anchor-height)"
434
+ }
435
+ }
515
436
  }
516
- }));
517
- });
518
- /*#__PURE__*/ Object.assign($f5560139001bae38$export$1b21e255bb3e4f7f, {
519
- displayName: $f5560139001bae38$var$SUB_CONTENT_NAME
520
- });
521
- /* -----------------------------------------------------------------------------------------------*/ /**
522
- * Wraps an array around itself at a given start index
523
- * Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`
524
- */ function $f5560139001bae38$var$wrapArray(array, startIndex) {
525
- return array.map((_, index)=>array[(startIndex + index) % array.length]
526
- );
527
- }
528
- const $f5560139001bae38$export$be92b6f5f03c0fe9 = $f5560139001bae38$export$7d4583da7581e674;
529
- const $f5560139001bae38$export$d9b273488cd8ce6f = $f5560139001bae38$export$c777b394d551050b;
530
- const $f5560139001bae38$export$41fb9f06171c75f4 = $f5560139001bae38$export$df05cd234081ebd5;
531
- const $f5560139001bae38$export$602eac185826482c = $f5560139001bae38$export$a98ed304d621e164;
532
- const $f5560139001bae38$export$7c6e2c02157bb7d2 = $f5560139001bae38$export$f42a00bc8a46c161;
533
- const $f5560139001bae38$export$eb2fcfdbd7ba97d4 = $f5560139001bae38$export$7669e79198e0f2eb;
534
- const $f5560139001bae38$export$b04be29aa201d4f5 = $f5560139001bae38$export$39935c5b19a4b4e;
535
- const $f5560139001bae38$export$6d08773d2e66f8f2 = $f5560139001bae38$export$92f903c8c91c291c;
536
- const $f5560139001bae38$export$16ce288f89fa631c = $f5560139001bae38$export$372384eccd27af53;
537
- const $f5560139001bae38$export$a98f0dcb43a68a25 = $f5560139001bae38$export$94dfa2322f330fdb;
538
- const $f5560139001bae38$export$371ab307eab489c0 = $f5560139001bae38$export$7d2f467b4a7f68d8;
539
- const $f5560139001bae38$export$c3468e2714d175fa = $f5560139001bae38$export$63e15a0e2af5a57;
540
- const $f5560139001bae38$export$1ff3c3f08ae963c0 = $f5560139001bae38$export$588aef9e7b5183b5;
541
- const $f5560139001bae38$export$21b07c8f274aebd5 = $f5560139001bae38$export$474b9891f5b9e633;
542
- const $f5560139001bae38$export$d7a01e11500dfb6f = $f5560139001bae38$export$ed0be551778c493a;
543
- const $f5560139001bae38$export$2ea8a7a591ac5eac = $f5560139001bae38$export$1820ea18a1dfed3c;
544
- const $f5560139001bae38$export$6d4de93b380beddf = $f5560139001bae38$export$1b21e255bb3e4f7f;
545
-
546
-
547
-
548
-
437
+ );
438
+ }
439
+ );
440
+ MenubarSubContent.displayName = SUB_CONTENT_NAME;
441
+ function wrapArray(array, startIndex) {
442
+ return array.map((_, index) => array[(startIndex + index) % array.length]);
443
+ }
444
+ var Root3 = Menubar;
445
+ var Menu = MenubarMenu;
446
+ var Trigger = MenubarTrigger;
447
+ var Portal2 = MenubarPortal;
448
+ var Content2 = MenubarContent;
449
+ var Group2 = MenubarGroup;
450
+ var Label2 = MenubarLabel;
451
+ var Item3 = MenubarItem;
452
+ var CheckboxItem2 = MenubarCheckboxItem;
453
+ var RadioGroup2 = MenubarRadioGroup;
454
+ var RadioItem2 = MenubarRadioItem;
455
+ var ItemIndicator2 = MenubarItemIndicator;
456
+ var Separator2 = MenubarSeparator;
457
+ var Arrow2 = MenubarArrow;
458
+ var Sub2 = MenubarSub;
459
+ var SubTrigger2 = MenubarSubTrigger;
460
+ var SubContent2 = MenubarSubContent;
461
+ })();
549
462
  //# sourceMappingURL=index.js.map