import React from 'react';
import { U as UI } from '../../ui-40a4a170.js';
import { _ as _default } from '../../link-1d478bbc.js';
/**
* Represents a route segment in the breadcrumb navigation.
*
* @remarks
* Each route can customize its display name and URL independently from its path.
* This allows for URL aliasing and custom route naming.
*
* @example
* ```tsx
* const route: CustomRoute = {
* path: "prod",
* name: "Products",
* url: "/products"
* };
* ```
*/
type CustomRoute = {
/** The path segment as it appears in the URL */
path?: string;
/** The display name shown to users */
name: string;
/** The URL for navigation (defaults to path if not provided) */
url?: string;
};
/**
* Props for the Breadcrumb component.
*
* @remarks
* The component can operate in two modes:
* 1. Automatic mode: Derives path from `currentRoute` prop
* 2. Controlled mode: Uses provided `routes` array for complete control over route naming
*
* @example
* ```tsx
* // Simple automatic mode
*
*
* // Controlled mode with custom route names
*
* ```
*/
type BreadcrumbProps = {
/** Array of custom route objects for controlled breadcrumb generation */
routes?: CustomRoute[];
/** Starting route node (typically "Home") */
startRoute?: React.ReactNode;
/** Starting route URL (typically "/") */
startRouteUrl?: string;
/** Separator element between breadcrumb items */
spacer?: React.ReactNode;
/** Current route path (required for breadcrumb generation) */
currentRoute?: string;
/** ARIA label for the breadcrumb navigation */
ariaLabel?: string;
/** Maximum character length before truncating breadcrumb text */
truncateLength?: number;
/** Props to spread onto breadcrumb Link components */
linkProps?: Omit, "href" | "children">;
} & Omit, "as" | "aria-label">;
/**
* Custom hook to process breadcrumb segments from a path string.
*
* @param currentRoute - The current route path to process
* @param routes - Optional custom route mappings for customizing segment names and URLs
* @returns Object containing processed breadcrumb segments with metadata and hasSegments flag
*
* @remarks
* This hook encapsulates the business logic for breadcrumb generation:
* - **Path parsing and segmentation** - Splits path into individual segments
* - **Route name resolution** - Maps segments to custom routes or uses segment as-is
* - **URL construction** - Builds navigation URLs for each segment
* - **Performance** - Memoized to prevent unnecessary recalculations on each render
*
* The hook is exported for advanced use cases where you need breadcrumb logic
* without the UI, such as:
* - Custom breadcrumb components
* - Site navigation generation
* - Analytics tracking
* - Dynamic route builders
*
* @example
* ```tsx
* // Basic usage
* function MyCustomNav() {
* const { segments, hasSegments } = useBreadcrumbSegments(
* window.location.pathname
* );
*
* if (!hasSegments) return null;
*
* return (
*
* );
* }
* ```
*
* @example
* ```tsx
* // With custom routes
* function SiteMap() {
* const customRoutes = [
* { path: "products", name: "All Products", url: "/products" },
* { path: "shirts", name: "Shirts & Tops", url: "/products/shirts" }
* ];
*
* const { segments } = useBreadcrumbSegments(
* "/products/shirts/item-123",
* customRoutes
* );
*
* return (
*
* {segments.map(seg => (
* -
* {seg.isLast ? seg.name : {seg.name}}
*
* ))}
*
* );
* }
* ```
*
* @example
* ```tsx
* // For analytics tracking
* function TrackBreadcrumb() {
* const { segments } = useBreadcrumbSegments(location.pathname);
*
* useEffect(() => {
* analytics.track('breadcrumb_view', {
* path: segments.map(s => s.name).join(' > '),
* depth: segments.length
* });
* }, [segments]);
*
* return ;
* }
* ```
*/
declare function useBreadcrumbSegments(currentRoute: string | undefined, routes?: CustomRoute[]): {
segments: {
isLast: boolean;
index: number;
/** The path segment as it appears in the URL */
path?: string | undefined;
/** The display name shown to users */
name: string;
/** The URL for navigation (defaults to path if not provided) */
url?: string | undefined;
}[];
hasSegments: boolean;
};
/**
* Breadcrumb - Navigation component displaying hierarchical page location.
*
* @remarks
* A WCAG 2.1 AA compliant breadcrumb navigation component that helps users
* understand their current location within a site hierarchy and navigate back
* to parent pages.
*
* ## Features
* - Automatic path parsing from `currentRoute` prop
* - Custom route naming via `routes` array
* - Text truncation for long route names
* - Full accessibility support with ARIA attributes
* - Performance optimized with memoization
*
* ## Accessibility
* - Uses semantic `