Skip to content

breadcrumb.md

Latest commit

 

History

History
46 lines (34 loc) · 1.14 KB

breadcrumb.md

File metadata and controls

46 lines (34 loc) · 1.14 KB
Raw
title Breadcrumb
parent Navigation and overlays
grand_parent Components

Breadcrumb

{: .no_toc }

Where you are, and every level you can go back to.

import { Breadcrumb } from '@textui/widgets';

<Breadcrumb
  items={[
    { id: 'root', label: 'services' },
    { id: 'api', label: 'api' },
  ]}
  onSelect={(id) => console.log(id)}
/>

Props

Prop Type Default
items { id: string; label: string; icon?: string }[] required
onSelect (id: string) => void
separator string
maxItems number Collapse the middle when it does not fit.

Plus everything on BoxProps.

Role: navigation.

maxItems collapses the middle when the trail is longer than the width - first and last survive, since those are the two a reader actually uses.

The last item is where you are and is not selectable. onSelect fires for the others.

See also