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

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