its-just-ui/dist/components/Breadcrumb/Breadcrumb.d.ts

ITS Just UI - The easiest and best React UI component library. Modern, accessible, and customizable components built with TypeScript and Tailwind CSS. Simple to use, production-ready components for building beautiful user interfaces with ease.

import { default as React } from 'react';

export interface BreadcrumbItem {
    label: string;
    href?: string;
    icon?: React.ReactNode;
    disabled?: boolean;
    [key: string]: unknown;
}
export interface BreadcrumbProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> {
    items?: BreadcrumbItem[];
    value?: number | null;
    onChange?: (index: number, item: BreadcrumbItem) => void;
    onNavigate?: (index: number, item: BreadcrumbItem) => void;
    variant?: 'default' | 'solid' | 'bordered' | 'underline' | 'pills';
    size?: 'sm' | 'md' | 'lg';
    separator?: React.ReactNode | string;
    maxItems?: number;
    itemsBeforeCollapse?: number;
    itemsAfterCollapse?: number;
    renderCollapsed?: (hiddenItems: BreadcrumbItem[]) => React.ReactNode;
    renderItem?: (item: BreadcrumbItem, index: number, isLast: boolean) => React.ReactNode;
    loading?: boolean;
    disabled?: boolean;
    transition?: 'none' | 'fade' | 'slide' | 'scale';
    transitionDuration?: number;
    backgroundColor?: string;
    textColor?: string;
    fontSize?: string;
    fontWeight?: string;
    fontFamily?: string;
    borderWidth?: string;
    borderColor?: string;
    borderStyle?: string;
    borderRadius?: string;
    padding?: string;
    paddingX?: string;
    paddingY?: string;
    gap?: string;
    itemBackgroundColor?: string;
    itemTextColor?: string;
    itemHoverBackgroundColor?: string;
    itemHoverTextColor?: string;
    itemActiveBackgroundColor?: string;
    itemActiveTextColor?: string;
    itemDisabledOpacity?: string;
    itemPadding?: string;
    itemPaddingX?: string;
    itemPaddingY?: string;
    itemBorderRadius?: string;
    separatorColor?: string;
    separatorSize?: string;
    separatorMargin?: string;
    focusRingColor?: string;
    focusRingWidth?: string;
    focusRingOffset?: string;
    focusRingOffsetColor?: string;
    boxShadow?: string;
    itemBoxShadow?: string;
    itemHoverBoxShadow?: string;
    iconSize?: string;
    iconColor?: string;
    iconMargin?: string;
    children?: React.ReactNode;
}
interface BreadcrumbContextValue {
    items: BreadcrumbItem[];
    value: number | null;
    onChange?: (index: number, item: BreadcrumbItem) => void;
    onNavigate?: (index: number, item: BreadcrumbItem) => void;
    variant?: 'default' | 'solid' | 'bordered' | 'underline' | 'pills';
    size?: 'sm' | 'md' | 'lg';
    separator?: React.ReactNode | string;
    disabled?: boolean;
    loading?: boolean;
    transition?: 'none' | 'fade' | 'slide' | 'scale';
    transitionDuration?: number;
    renderItem?: (item: BreadcrumbItem, index: number, isLast: boolean) => React.ReactNode;
    itemBackgroundColor?: string;
    itemTextColor?: string;
    itemHoverBackgroundColor?: string;
    itemHoverTextColor?: string;
    itemActiveBackgroundColor?: string;
    itemActiveTextColor?: string;
    itemDisabledOpacity?: string;
    itemPadding?: string;
    itemPaddingX?: string;
    itemPaddingY?: string;
    itemBorderRadius?: string;
    separatorColor?: string;
    separatorSize?: string;
    separatorMargin?: string;
    focusRingColor?: string;
    focusRingWidth?: string;
    focusRingOffset?: string;
    focusRingOffsetColor?: string;
    itemBoxShadow?: string;
    itemHoverBoxShadow?: string;
    iconSize?: string;
    iconColor?: string;
    iconMargin?: string;
}
export declare const useBreadcrumb: () => BreadcrumbContextValue;
declare const Breadcrumb: React.ForwardRefExoticComponent<BreadcrumbProps & React.RefAttributes<HTMLElement>>;
export interface BreadcrumbItemComponentProps extends React.LiHTMLAttributes<HTMLLIElement> {
    index: number;
    item: BreadcrumbItem & {
        __collapsed?: boolean;
        items?: BreadcrumbItem[];
    };
    isLast: boolean;
    renderCollapsed?: (hiddenItems: BreadcrumbItem[]) => React.ReactNode;
    collapsedOpen?: boolean;
    setCollapsedOpen?: (open: boolean) => void;
}
declare const BreadcrumbItem: React.ForwardRefExoticComponent<BreadcrumbItemComponentProps & React.RefAttributes<HTMLLIElement>>;
export interface BreadcrumbSeparatorProps extends React.HTMLAttributes<HTMLSpanElement> {
    children?: React.ReactNode;
}
declare const BreadcrumbSeparator: React.ForwardRefExoticComponent<BreadcrumbSeparatorProps & React.RefAttributes<HTMLSpanElement>>;
export interface BreadcrumbLinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
    item: BreadcrumbItem;
    index: number;
    isLast?: boolean;
}
declare const BreadcrumbLink: React.ForwardRefExoticComponent<BreadcrumbLinkProps & React.RefAttributes<HTMLAnchorElement>>;
export { Breadcrumb, BreadcrumbItem as BreadcrumbItemComponent, BreadcrumbSeparator, BreadcrumbLink, };