Breadcrumb

Install and import

yarn add @welcome-ui/breadcrumb @xstyled/styled-components @xstyled/system react react-dom styled-components
import { Breadcrumb } from '@welcome-ui/breadcrumb'

Example

Separator

You can customize your separator.

Example with React Router

import { Link as RouterLink } from 'react-router-dom'
<Breadcrumb renderChildrenAs={RouterLink}>
<Breadcrumb.Item to="/">Introduction</Breadcrumb.Item>
<Breadcrumb.Item to="/components">Components</Breadcrumb.Item>
<Breadcrumb.Item to='/components/breadcrumb'>Breadcrumb</Breadcrumb.Item>
</Breadcrumb>

Properties

NameType(s)DefaultRequired
children
node
gradientBackground
string

color from theme, add for scroll gradient on mobile

light.900
renderChildrenAs
union
a
separator
node | string
<RightIcon size="sm" />