Components / Menubar
Menubar
A visually persistent menu common in desktop applications that provides quick access to a consistent set of commands: role="menubar" with roving arrow-key navigation, follow-focus, submenus, and checkbox / radio items. The behaviour comes from the brain; this preview is the real component running in WebAssembly.
Examples
razor
<ZitsMenubar>
<ZitsMenubarMenu Value="file">
<ZitsMenubarTrigger>File</ZitsMenubarTrigger>
<ZitsMenubarContent>
<ZitsMenubarItem>New Tab <ZitsMenubarShortcut>⌘T</ZitsMenubarShortcut></ZitsMenubarItem>
<ZitsMenubarItem Disabled>New Incognito Window</ZitsMenubarItem>
<ZitsMenubarSeparator />
<ZitsMenubarSub>
<ZitsMenubarSubTrigger>Share</ZitsMenubarSubTrigger>
<ZitsMenubarSubContent>
<ZitsMenubarItem>Email link</ZitsMenubarItem>
<ZitsMenubarItem>Messages</ZitsMenubarItem>
</ZitsMenubarSubContent>
</ZitsMenubarSub>
</ZitsMenubarContent>
</ZitsMenubarMenu>
<ZitsMenubarMenu Value="view">
<ZitsMenubarTrigger>View</ZitsMenubarTrigger>
<ZitsMenubarContent>
<ZitsMenubarCheckboxItem @bind-Checked="_fullUrls">Always Show Full URLs</ZitsMenubarCheckboxItem>
<ZitsMenubarSeparator />
<ZitsMenubarRadioGroup @bind-Value="_profile">
<ZitsMenubarRadioItem Value="andy">Andy</ZitsMenubarRadioItem>
<ZitsMenubarRadioItem Value="benoit">Benoit</ZitsMenubarRadioItem>
</ZitsMenubarRadioGroup>
</ZitsMenubarContent>
</ZitsMenubarMenu>
</ZitsMenubar>
@code {
private bool? _fullUrls = true;
private string? _profile = "benoit";
}Installation
Terminal
bash
navius add menubarAPI reference
ZitsMenubar
| Prop | Type | Default |
|---|---|---|
| Value | string? | - |
| DefaultValue | string? | - |
| Orientation | string | "horizontal" |
| Dir | string? | - |
| Loop | bool | false |
ZitsMenubarMenu
| Prop | Type | Default |
|---|---|---|
| Value | string | - |
ZitsMenubarContent
| Prop | Type | Default |
|---|---|---|
| Align | string | "start" |
| AlignOffset | double | -4 |
| SideOffset | double | 8 |
ZitsMenubarItem
| Prop | Type | Default |
|---|---|---|
| Inset | bool | false |
| Disabled | bool | false |
| TextValue | string? | - |
| OnSelect | EventCallback<NaviusSelectEventArgs> | - |
ZitsMenubarCheckboxItem
| Prop | Type | Default |
|---|---|---|
| Checked | bool? | - |
| DefaultChecked | bool? | - |
| Disabled | bool | false |
| OnSelect | EventCallback<NaviusSelectEventArgs> | - |
ZitsMenubarRadioGroup / ZitsMenubarRadioItem
| Prop | Type | Default |
|---|---|---|
| Value | string? | - |
| DefaultValue | string? | - |
| Disabled | bool | false |
ZitsMenubarSub
| Prop | Type | Default |
|---|---|---|
| Open | bool | false |
| DefaultOpen | bool | false |
| Inset (SubTrigger) | bool | false |