Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 | 1x 1x 1x 1x 3x 3x 9x 1x | /* eslint-disable no-ternary */
import { Li, Link as StyledLink, Ul } from "./styled"
import { ComponentProps } from "."
import Icon from "components/Icon"
import React from "react"
const ONE = 1
const BreadcrumbsComponent = ({
LinkComponent,
className,
items
}: ComponentProps) => {
const Link = (LinkComponent ?? StyledLink) as React.ComponentType<{
children: React.ReactNode
href?: string
}>
return (
<Ul aria-label="Breadcrumbs" className={className}>
{items.map((item, index) => (
<Li aria-label={item.label} key={item.label}>
{item.href ? (
<Link href={item.href}>{item.label}</Link>
) : (
<span>{item.label}</span>
)}
{index < items.length - ONE ? (
<Icon group="io5" name="IoChevronForward" />
) : null}
</Li>
))}
</Ul>
)
}
export default BreadcrumbsComponent
|