Menu<K extends string = string>

src/components/navigation.tsx

Import

import { Menu } from "@ossrandom/design-system";

Examples

Default

↗ Playground

<Menu items={[
    { key: "edit", label: "Edit" },
    { key: "duplicate", label: "Duplicate" },
    { key: "delete", label: "Delete", danger: true },
  ]} />

API

extends BaseProps

Prop	Type
`items` required	`readonly (MenuItem<K> \| { readonly type: "separator" } \| { readonly type: "label"; readonly label: ReactNode })[]`
`selectedKeys`	`readonly K[]`
`defaultSelectedKeys`	`readonly K[]`
`mode`	`"horizontal" \| "vertical" \| "inline"`
`onSelect`	`(key: K) => void;`

Related types

interface

MenuItem<K extends string = string>

Prop	Type
`key` required	`K`
`label` required	`ReactNode`
`icon`	`ReactNode`
`shortcut`	`string`
`badge`	`ReactNode`
`disabled`	`boolean`
`destructive`	`boolean`
`children`	`readonly MenuItem<K>[]`