Breadcrumbs

Breadcrumbs provide users with a navigational aid to understand their location within a website. They display a hierarchical path, allowing users to easily move to previous pages or levels in their navigation journey.

import * as UI from "@iyk/ui"

export default () => (
  <UI.Breadcrumbs>
    <a href="#/home">Home</a>
    <a href="#/products">Products</a>
    <a href="#/products/1">Product 1</a>
  </UI.Breadcrumbs>
)

import * as Icon from "@iyk/icons"
import * as UI from "@iyk/ui"

export default () => (
  <UI.Breadcrumbs icon={Icon.Home}>
    <a href="#/home">Home</a>
    <a href="#/products">Products</a>
    <a href="#/products/1">Product 1</a>
  </UI.Breadcrumbs>
)

Props

icon

React.FunctionComponent

An optional SVG icon component displayed before the breadcrumb list.