@payfit/unity-components
Version:
34 lines (33 loc) • 1.41 kB
TypeScript
import { ComponentPropsWithoutRef, ReactElement } from 'react';
import { BreadcrumbProps as AriaBreadcrumbProps } from 'react-aria-components/Breadcrumbs';
import { RawBreadcrumbLinkProps } from './RawBreadcrumbLink.js';
export interface BreadcrumbProps extends Omit<AriaBreadcrumbProps, 'children' | 'className' | 'style'> {
/**
* A single BreadcrumbLink child element
*/
children: ReactElement<ComponentPropsWithoutRef<'a'> & RawBreadcrumbLinkProps>;
}
/**
* A semantic wrapper component for breadcrumb items that displays navigation hierarchy.
* Accepts exactly one BreadcrumbLink as a child to maintain design system consistency.
* @param props - Breadcrumb props including the BreadcrumbLink child
* @example
* ```tsx
* import { Breadcrumb, BreadcrumbLink } from '@payfit/unity-components'
*
* function Example() {
* return (
* <Breadcrumb>
* <BreadcrumbLink href="/dashboard">Dashboard</BreadcrumbLink>
* </Breadcrumb>
* )
* }
* ```
* @remarks
* - Only accepts a single BreadcrumbLink component as a child
* - Automatically handles current page styling (disabled state)
* - Displays caret icons as separators between breadcrumb items
* @see {@link BreadcrumbProps} for all available props
*/
declare const Breadcrumb: import('react').ForwardRefExoticComponent<BreadcrumbProps & import('react').RefAttributes<HTMLLIElement>>;
export { Breadcrumb };