Skip to main content

Navigation


Example

<Navigation
size="large"
kind="icon"
destinations={[
{
label: "Item 1",
href: "http://www.example.com",
icon: IconPlaceholder,
},
{
label: "Item 2 (link)",
href: "http://www.example.com",
target: "_blank",
icon: IconPlaceholder,
},
{
label: "Item 3",
href: "http://www.example.com",
disabled: true,
icon: IconPlaceholder,
},
]}
/>

Props

NameTypeDefault ValueRequiredDescription
kind"none" | "icon"Yes
size"large" | "medium"Yes
destinations({ href: string; target?: HTMLAttributeAnchorTarget; label: string; active?: boolean; disabled?: boolean; } & DestinationIconProps<T>)[]Yes

Related components