import { ComponentProps, ReactNode } from 'react';
import { AsChildProp } from '../../utils/misc';
/**
 * Container for Breadcrumbs component.
 *
 * Can be used to construct complete Breadcrums UI.
 * For batteries-included Breadcrumbs component - use {@link Breadcrumbs} instead.
 */
export declare const BreadcrumbsRoot: ({ ...props }: ComponentProps<"nav">) => import("react").JSX.Element;
/**
 * List wrapper for breadcrumb items.
 */
export declare const BreadcrumbList: ({ className, ...props }: ComponentProps<"ol">) => import("react").JSX.Element;
/**
 * Container for any breadcrumb list item: link, page or separator with menu.
 */
export declare const BreadcrumbItem: ({ className, ...props }: ComponentProps<"li">) => import("react").JSX.Element;
type BreadcrumbLinkProps = ComponentProps<"a"> & {
    asChild?: AsChildProp;
};
/**
 * Interactive Breadcrumb link. Used for non-active breadcrumbs.
 */
export declare const BreadcrumbLink: ({ asChild, className, ...props }: BreadcrumbLinkProps) => import("react").JSX.Element;
/**
 * Currently active page.
 */
export declare const BreadcrumbPage: ({ className, ...props }: ComponentProps<"span">) => import("react").JSX.Element;
/**
 * Breadcrumb separator component that visually separates breadcrumb items.
 *
 * @example
 * ```tsx
 * <BreadcrumbSeparator>
 *   <CustomIcon />
 * </BreadcrumbSeparator>
 * ```
 */
export declare const BreadcrumbSeparator: ({ children, className, ...props }: ComponentProps<"li">) => import("react").JSX.Element;
/**
 * Ellipsis component for Breadcrumbs.
 *
 * Used to indicate truncated breadcrumb items when there are too many to display.
 * Often used as a dropdown trigger to reveal hidden breadcrumb items.
 * Includes proper accessibility attributes to ensure it's correctly presented to assistive technologies.
 *
 * @example
 * ```tsx
 * <BreadcrumbItem>
 *   <BreadcrumbEllipsis />
 * </BreadcrumbItem>
 * ```
 */
export declare const BreadcrumbEllipsis: ({ className, ...props }: ComponentProps<"span">) => import("react").JSX.Element;
interface BreadcrumbsProps {
    breadcrumbs: Array<{
        href: string;
        label: ReactNode;
    }>;
    /**
     * Represents the maximum number of breadcrumb elements to display.
     * Any breadcrumbs beyond this number will be hidden behind a dropdown.
     * @range [2, Infinity]
     * @default 3
     */
    maxToDisplay?: number;
}
/**
 * Breadcrumbs component that provides a complete breadcrumbs UI, based on links.
 *
 * It composes smaller atomic breadcrumbs elements, which can be reused to create your own composition of Breadcrumbs.
 *
 * The component automatically handles:
 * - Displaying the first and last breadcrumbs
 * - Truncating middle breadcrumbs into a dropdown when exceeding maxToDisplay
 * - Proper navigation using the configured router
 * - Accessibility attributes
 *
 * @example
 * ```tsx
 * <Breadcrumbs
 *   breadcrumbs={[
 *     { label: "Home", href: "/" },
 *     { label: "Products", href: "/products" },
 *     { label: "Current Page", href: "/products/current" }
 *   ]}
 * />
 * ```
 */
export declare const Breadcrumbs: ({ breadcrumbs, maxToDisplay, }: BreadcrumbsProps) => import("react").JSX.Element;
export {};