import * as React from 'react';
import { ValuesOf } from '../utils/typeUtils';
import { SIZES, SKINS } from './Breadcrumbs.constants';
export type BreadcrumbsSize = ValuesOf<typeof SIZES>;
export type BreadcrumbsSkin = ValuesOf<typeof SKINS>;
export type BreadcrumbsTheme = BreadcrumbsSkin;
export type BreadcrumbsItem = {
    id: string | number;
    value: React.ReactNode;
    link?: string;
    customElement?: any;
    disabled?: boolean;
    key?: string;
};
export interface BreadcrumbsProps {
    /** Applies a data-hook HTML attribute to be used in the tests. */
    dataHook?: string;
    /** Specifies a CSS class name to be appended to the component's root element.
     * @internal
     */
    className?: string;
    /** Describes each breadcrumbs item:
     * - `id` (required) - gives an item numeric identifier
     * - `value` (required) - sets the item label to be shown on breadcrumbs
     * - `link` - stores a link which user is directed to after clicking on an item
     * - `customElement` - contains and renders a custom component or `<a>` link instead of an item value
     * - `disabled` - disables an item
     */
    items: BreadcrumbsItem[];
    /** Defines a function which is called when a user clicks on an item. */
    onClick?: (item: BreadcrumbsItem, event: React.MouseEvent<HTMLElement>) => any;
    /** Defines which breadcrumbs item is currently active. */
    activeId?: string | number;
    /** Controls the component size.
     * @default 'medium'
     */
    size?: BreadcrumbsSize;
    /** Sets the maximum width of each item value in px. Longer items get truncated with ellipsis.
     * @default '240px'
     */
    itemMaxWidth?: React.CSSProperties['maxWidth'];
    /** Controls the component appearance.
     * @deprecated Use `skin` instead.
     */
    theme?: BreadcrumbsSkin;
    /** Controls the component appearance. */
    skin?: BreadcrumbsSkin;
}
//# sourceMappingURL=Breadcrumbs.types.d.ts.map