Menubar

Horizontal menu bar with dropdown menus, similar to desktop application menus. Wraps bits-ui Menubar.

Example

Sub-components

Menubar.Root

Prop	Type	Default	Description
`class`	`string`	—	Additional CSS classes

Menubar.Menu

Prop	Type	Default	Description
No props. Container for a single menu.

Menubar.Trigger

Prop	Type	Default	Description
`class`	`string`	—	Additional CSS classes

Menubar.Content

Prop	Type	Default	Description
`class`	`string`	—	Additional CSS classes

Menubar.Item

Prop	Type	Default	Description
`onSelect`	`() => void`	—	Called when item is selected
`class`	`string`	—	Additional CSS classes

Menubar.Separator

Prop	Type	Default	Description
`class`	`string`	—	Additional CSS classes

Usage

<script>
  import { Menubar } from '@chrissnell/chonky-ui';
</script>

<Menubar.Root>
  <Menubar.Menu>
    <Menubar.Trigger>File</Menubar.Trigger>
    <Menubar.Content>
      <Menubar.Item onSelect={() => console.log('new')}>New</Menubar.Item>
      <Menubar.Item>Open</Menubar.Item>
      <Menubar.Separator />
      <Menubar.Item>Save</Menubar.Item>
    </Menubar.Content>
  </Menubar.Menu>
</Menubar.Root>