Menubar

@/components/kamod-ui/menubar

Installation

Import Menubar, MenubarMenu, MenubarTrigger, MenubarContent, and optional primitives (Group, Shortcut, Sub, CheckboxItem, RadioGroup, …) from `@/components/kamod-ui/menubar`.

pnpm add @kamod-ch/ui

Usage

Each MenubarMenu is a top-level branch. Only one menu panel is open at a time; choosing another trigger switches panels. MenubarItem closes the bar on activate; checkbox and radio items keep it open. Submenus open on hover or click.

import { Menubar } from "@/components/kamod-ui/menubar";
<Menubar />

Demo

Full shadcn-style sample: File / Edit / View / Profiles with submenus, shortcuts, checkboxes, and a static radio group.

Minimal

Minimal pattern with Group and Shortcut.

Checkbox

MenubarCheckboxItem for toggles; optional checked / onCheckedChange for controlled usage.

Radio

MenubarRadioGroup with value and onValueChange for controlled selection.

With icons

Place icons before label text; destructive variant on MenubarItem.

API Reference

Props, slots and variants for this component.

Menubar

Menubar component props and accepted values.

PropTypeDefault
dir (Menubar)"ltr" | "rtl"
value (Menu)stringauto id
inset (Item)booleanfalse
variant (Item)"default" | "destructive""default"
checked (CheckboxItem)boolean
value / onValueChange (RadioGroup)string / fn

Accessibility Notes

Menubar uses role=menubar; triggers expose aria-expanded. Items use menuitem / menuitemcheckbox / menuitemradio. Escape and outside click close the open menu.