Menu

import {
  Button,
  Menu,
  MenuTrigger,
  MenuPopup,
  MenuItem,
  MenuGroup,
  MenuGroupLabel,
  MenuCheckboxItem,
  MenuRadioGroup,
  MenuRadioItem,
  MenuSeparator,
  MenuShortcut,
  MenuSub,
  MenuSubTrigger,
  MenuSubPopup,
} from "@patchui/react";
 
// Basic menu
<Menu>
  <MenuTrigger render={<Button />}>Open Menu</MenuTrigger>
  <MenuPopup>
    <MenuItem>Profile</MenuItem>
    <MenuItem>Settings</MenuItem>
    <MenuSeparator />
    <MenuItem variant="destructive">Log out</MenuItem>
  </MenuPopup>
</Menu>
 
// With checkbox items
const [checked, setChecked] = useState(true);
<MenuCheckboxItem checked={checked} onCheckedChange={setChecked}>
  Show Sidebar
</MenuCheckboxItem>
 
// With radio items
const [value, setValue] = useState("system");
<MenuRadioGroup value={value} onValueChange={setValue}>
  <MenuRadioItem value="light">Light</MenuRadioItem>
  <MenuRadioItem value="dark">Dark</MenuRadioItem>
  <MenuRadioItem value="system">System</MenuRadioItem>
</MenuRadioGroup>