48 lines
1.1 KiB
TypeScript
48 lines
1.1 KiB
TypeScript
import { cx } from "class-variance-authority"
|
|
import NextLink from "next/link"
|
|
import {
|
|
Breadcrumb as BreadcrumbRAC,
|
|
type BreadcrumbProps as BreadcrumbRACProps,
|
|
} from "react-aria-components"
|
|
|
|
import styles from "./breadcrumb.module.css"
|
|
|
|
import { PropsWithChildren } from "react"
|
|
import { MaterialIcon } from "../../Icons/MaterialIcon"
|
|
import { Typography } from "../../Typography"
|
|
|
|
interface BreadcrumbProps extends PropsWithChildren<BreadcrumbRACProps> {
|
|
className?: string
|
|
href?: string
|
|
}
|
|
|
|
export function Breadcrumb({
|
|
className = "",
|
|
href,
|
|
children,
|
|
...props
|
|
}: BreadcrumbProps) {
|
|
return (
|
|
<BreadcrumbRAC className={cx(styles.breadcrumb, className)} {...props}>
|
|
{href ? (
|
|
<>
|
|
<Typography variant="Label/xsRegular">
|
|
<NextLink className={styles.link} href={href}>
|
|
{children}
|
|
</NextLink>
|
|
</Typography>
|
|
<MaterialIcon
|
|
icon="chevron_right"
|
|
size={20}
|
|
aria-hidden="true"
|
|
color="CurrentColor"
|
|
className={styles.icon}
|
|
/>
|
|
</>
|
|
) : (
|
|
children
|
|
)}
|
|
</BreadcrumbRAC>
|
|
)
|
|
}
|