Menu
A flexible dropdown Menu.
import {
Menu,
MenuButton,
MenuItem,
MenuSeparator,
useMenuStore,
} from "swash/Menu";
() => {
const menu = useMenuStore();
return (
<>
<MenuButton asChild store={menu}>
<Button scale="sm">Preferences</Button>
</MenuButton>
<Menu store={menu} aria-label="Preferences">
<MenuItem store={menu}>Settings</MenuItem>
<MenuItem store={menu} disabled>
Extensions
</MenuItem>
<MenuSeparator store={menu} />
<MenuItem store={menu}>Keyboard shortcuts</MenuItem>
<MenuItem store={menu}>
<IoAccessibilityOutline /> Accessibility
</MenuItem>
<MenuItem store={menu} variant="success">
God mod
</MenuItem>
<MenuItem store={menu} variant="danger">
Logout
</MenuItem>
</Menu>
</>
);
};