Menubar

Vinyl styling: Thick border; menus open with a barn-door wipe.

InstallationCopy Anchor Link

npx shadcn@latest add @vinyl/menubar

The @vinyl registry URL in components.json decides whether you get the web or the native version (see installation for web / native).

UsageCopy Anchor Link

<Menubar>
  <MenubarMenu>
    <MenubarTrigger>Deck</MenubarTrigger>
    <MenubarContent>
      <MenubarItem>Play <MenubarShortcut>⌘P</MenubarShortcut></MenubarItem>
    </MenubarContent>
  </MenubarMenu>
</Menubar>

APICopy Anchor Link

Same API as shadcn/ui's Menubar on the web, and React Native Reusables' Menubar on native. Vinyl only changes styling and motion.