@payfit/unity-components
Version:
39 lines (38 loc) • 1.75 kB
TypeScript
import { LinkComponent } from '@tanstack/react-router';
import { RawBreadcrumbLink } from '../../../../components/breadcrumbs/parts/RawBreadcrumbLink.js';
/**
* A breadcrumb link component that integrates with Tanstack Router for type-safe navigation.
* This component wraps the base RawBreadcrumbLink with Tanstack Router's navigation capabilities.
* @example
* ```tsx
* import { Breadcrumb, BreadcrumbLink, Breadcrumbs } from '@payfit/unity-components/integrations/tanstack-router'
*
* function Navigation() {
* return (
* <Breadcrumbs wrap="nowrap">
* <Breadcrumb>
* <BreadcrumbLink to="/">Home</BreadcrumbLink>
* </Breadcrumb>
* <Breadcrumb>
* <BreadcrumbLink to="/dashboard" search={{ tab: 'overview' }}>
* Dashboard
* </BreadcrumbLink>
* </Breadcrumb>
* </Breadcrumbs>
* )
* }
* ```
* @remarks
* - Supports all Tanstack Router link props (to, search, params, etc.)
* - Maintains breadcrumb-specific styling and truncation behavior
* - Automatically handles long text with tooltips
* - Inherits type safety from Tanstack Router for route definitions
* @see Source code in {@link https://github.com/PayFit/hr-apps/tree/master/libs/shared/unity/components/src/integrations/tanstack-router/components/breadcrumbs GitHub}
* @see Design specs {@link https://www.figma.com/design/poaMyU7abAgL9VRhx4ygyy/Unity-DS-%3E-Components-Library Figma}
* @see Design docs in {@link https://www.payfit.design/ Payfit.design}
* @see Developer docs in {@link https://unity-components.payfit.io/?path=/ unity-components.payfit.io}
*/
declare const BreadcrumbLink: LinkComponent<typeof RawBreadcrumbLink> & {
displayName: string;
};
export { BreadcrumbLink };