import { Meta, Story, Preview } from '@storybook/addon-docs/blocks';

### Usage

Breadcrumbs show users their current location relative to the information architecture and enable them to quickly move up to a parent level or previous step.

#### When to use

Breadcrumbs are effective in products and experiences that have a large amount of content organized in a hierarchy of more than two levels. They take up little space but still provide context for the user’s place in the navigation hierarchy.

#### When not to use

Breadcrumbs are always treated as secondary and should never entirely replace the primary navigation. They shouldn’t be used for products that have single level navigation because they create unnecessary clutter.

### Formatting

![Image of Breadcrumb Format](https://github.com/wfp/ui/blob/component-updates/src/assets/formatting/Breadcrumb.png?raw=true)

1. **Page link(1):** Directs users to the parent-level page.

2. **Separator(2):** Clearly distinguishes between each page.

### Reference

[Carbon Design System Usage for Breadcrumb](https://next.carbondesignsystem.com/components//breadcrumb)
