Menu

Dropdown menu opened via button. Supports typeahead and keyboard navigation.

Note: This component renders content inside of a drawer at small viewports.

Usage

import { Menu } from "@skyltmax/ds9"

Examples

Basic

Default variant opening from a button.

Code

Router Links

Default variant where items are React Router Links instead of a tags.

Code

Placement

Custom menu placement.

Code

Item Descriptions

With description texts under items.

Code

Dividers

Dividers between items.

Code

Disabled Items

Code

Prefix and Suffix

Code

Action Menu

Smaller variant design to fit into a row of buttons.

Code

Context Menu

Simple variant without padding designed to be used as a context menu at the end of a list item or table row.

Code

Custom Button

The toggle button can be fully customized.

Code

Site Menu

Main site menu example.

Code