Accessible menubar component built on Radix UI's `@radix-ui/react-menubar` primitive, styled with Tailwind CSS and integrated with the OpenFrame design system. ## Key Components | Export | Description | |---|---| | `Menubar` | Root container — horizontal bar with border, rounded corners, and background styling | | `MenubarMenu` | Groups a trigger with its associated content (re-export of Radix `Menu`) | | `MenubarTrigger` | Clickable menu label in the bar; highlights on focus and open state | | `MenubarContent` | Dropdown panel rendered via portal with entrance/exit animations | | `MenubarItem` | Standard clickable menu entry; supports `inset` prop for left-padding alignment | | `MenubarCheckboxItem` | Menu item with a `Check` icon indicator for boolean toggles | | `MenubarRadioGroup` | Wrapper for mutually exclusive `MenubarRadioItem` entries | | `MenubarRadioItem` | Menu item with a `Circle` fill indicator for single-selection groups | | `MenubarSubTrigger` | Nested menu trigger with a `ChevronRight` icon; supports `inset` prop | | `MenubarSubContent` | Flyout panel for nested submenus | | `MenubarLabel` | Non-interactive section header; supports `inset` prop | | `MenubarSeparator` | Horizontal divider between menu sections | | `MenubarShortcut` | Right-aligned muted span for displaying keyboard shortcut hints | | `MenubarGroup` / `MenubarPortal` / `MenubarSub` | Radix UI structural primitives re-exported directly | ## Usage Example ```typescript import { Menubar, MenubarContent, MenubarItem, MenubarMenu, MenubarSeparator, MenubarShortcut, MenubarTrigger, MenubarCheckboxItem, MenubarRadioGroup, MenubarRadioItem, MenubarLabel, MenubarSub, MenubarSubTrigger, MenubarSubContent, } from "@/components/ui/menubar" export function AppMenubar() { return ( File New Tab ⌘T New Window ⌘N Share Email Slack View Appearance Show Sidebar Compact Comfortable ) } ``` **Source:** [`https://github.com/flamingo-stack/openframe-oss-lib/blob/main/src/components/ui/menubar.tsx`](https://github.com/flamingo-stack/openframe-oss-lib/blob/main/src/components/ui/menubar.tsx)