Menubar

A horizontal menu bar with dropdown menus, commonly used for application-level navigation and actions.

#Installation

npx @dinachi/cli@latest add menubar

#Usage

tsx

import { Menubar, MenubarMenu, MenubarTrigger, MenubarPortal, MenubarContent, MenubarItem, MenubarCheckboxItem, MenubarRadioGroup, MenubarRadioItem, MenubarLabel, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubTrigger, MenubarSubContent } from '@/components/ui/menubar'

#Examples

Default Menubar

A complete menubar with File, Edit, and View menus

Menubar with Checkboxes

Menubar with toggleable checkbox items

Menubar with Submenu

Menubar with nested submenus for recent files

#API Reference

Prop	Type	Default	Description
value	string	—	The controlled value of the currently active menu
defaultValue	string	—	The value of the menu to activate by default
onValueChange	(value: string) => void	—	Callback fired when the active menu changes
disabled	boolean	false	When true, prevents the user from interacting with the menubar
dir	'ltr' \| 'rtl'	'ltr'	The reading direction of the menubar