import { default as React, ComponentProps } from 'react';
import { RecipeVariantProps } from '../../../styled-system/css';
export declare const breadcrumbsStyle: import('../../../styled-system/types').SlotRecipeRuntimeFn<"link" | "item" | "icon" | "list" | "separator" | "root" | "ellipsis", {
    size: {
        medium: {
            link: {
                textStyle: "sd.system.typography.body.small_compact";
                paddingInline: "sd.system.dimension.spacing.extraSmall";
                paddingBlock: "sd.system.dimension.spacing.twoExtraSmall";
                minHeight: "sd.reference.dimension.scale.10";
                _expanded: {
                    textStyle: "sd.system.typography.body.small_expanded";
                };
            };
            separator: {
                _expanded: {
                    textStyle: "sd.system.typography.body.small_expanded";
                };
            };
            ellipsis: {
                "& button": {
                    paddingInline: "sd.system.dimension.spacing.extraSmall";
                    paddingBlock: "sd.system.dimension.spacing.twoExtraSmall";
                    minHeight: "sd.reference.dimension.scale.10";
                };
            };
            icon: {
                width: "sd.reference.dimension.scale.7";
                height: "sd.reference.dimension.scale.7";
                "& svg": {
                    width: "sd.reference.dimension.scale.7";
                    height: "sd.reference.dimension.scale.7";
                };
            };
        };
        small: {
            link: {
                textStyle: "sd.system.typography.label.medium_compact";
                paddingInline: "sd.system.dimension.spacing.twoExtraSmall";
                paddingBlock: "sd.system.dimension.spacing.twoExtraSmall";
                gap: "sd.system.dimension.spacing.twoExtraSmall";
                minHeight: "sd.reference.dimension.scale.10";
                _expanded: {
                    textStyle: "sd.system.typography.label.medium_expanded";
                };
            };
            separator: {
                _expanded: {
                    textStyle: "sd.system.typography.label.medium_expanded";
                };
            };
            ellipsis: {
                "& button": {
                    paddingInline: "sd.system.dimension.spacing.twoExtraSmall";
                    paddingBlock: "sd.system.dimension.spacing.twoExtraSmall";
                    minHeight: "sd.reference.dimension.scale.10";
                };
            };
            icon: {
                width: "14px";
                height: "14px";
                "& svg": {
                    width: "14px";
                    height: "14px";
                };
            };
        };
    };
}>;
type BreadcrumbsVariantProps = RecipeVariantProps<typeof breadcrumbsStyle>;
export type BreadcrumbsProps = ComponentProps<"nav"> & BreadcrumbsVariantProps & {
    separator?: "chevron" | "slash";
    maxItems?: number;
    itemsBeforeCollapse?: number;
    itemsAfterCollapse?: number;
};
export type BreadcrumbItemProps = ComponentProps<"li"> & {
    href?: string;
    current?: boolean;
    icon?: React.ReactElement;
};
export declare const Breadcrumbs: React.ForwardRefExoticComponent<Omit<BreadcrumbsProps, "ref"> & React.RefAttributes<HTMLElement>>;
export declare const BreadcrumbItem: React.ForwardRefExoticComponent<Omit<BreadcrumbItemProps, "ref"> & React.RefAttributes<HTMLLIElement>>;
export {};