import { LitElement, TemplateResult } from 'lit';
import '../../icons/icon-chevron-right-google.js';
export interface BreadcrumbItem {
    label: string;
    href?: string;
    icon?: () => TemplateResult;
}
export type BreadcrumbClickEvent = CustomEvent<BreadcrumbItem>;
/**
 * `<obc-breadcrumb>` – A horizontal breadcrumb navigation component for displaying the user's current location within a hierarchy.
 *
 * Provides a visual trail of links or steps, helping users understand their position and navigate back to previous levels. Commonly used for multi-level navigation paths in applications or websites.
 *
 * ### Features
 * - **Dynamic Items:** Renders a sequence of breadcrumb items based on the provided `items` array.
 * - **Custom Divider Icon:** Uses a chevron icon (`<obi-chevron-right-google>`) as a separator between breadcrumb items.
 * - **Accessible Markup:** Uses semantic `<nav aria-label="Breadcrumb">` and ordered list for improved accessibility.
 * - **Flexible Labels:** Each breadcrumb displays a text label; supports any number of items.
 *
 * ### Usage Guidelines
 * - Use `obc-breadcrumb` to show users their current location in a multi-level navigation structure and to provide easy access to previous steps or parent pages.
 * - Ideal for scenarios where users may need to backtrack or understand the hierarchy of the current view.
 * - Avoid using breadcrumbs for single-level navigation or when the navigation path is always flat.
 * - **TODO(designer):** Clarify if breadcrumb items should be interactive (links) or always static labels, and if there are recommended maximum numbers of items for optimal usability.
 *
 * ### Example:
 * ```
 * <obc-breadcrumb
 *   .items=${[
 *     {label: 'Home'},
 *     {label: 'Section'},
 *     {label: 'Subsection'}
 *   ]}
 * ></obc-breadcrumb>
 * ```
 * This will render: Home › Section › Subsection
 *
 * @fires breadcrumb-click {BreadcrumbClickEvent} - Fired when a breadcrumb item is clicked.
 * @slot - (none) This component does not use slots; all content is provided via the `items` property.
 */
export declare class ObcBreadcrumb extends LitElement {
    /**
     * The list of breadcrumb items to display, in order from root to current location.
     *
     * Each item should be an object with a `label` property (string). The component renders each label in sequence, separated by a chevron icon.
     *
     * Example: `[ {label: 'Home'}, {label: 'Section'}, {label: 'Page'} ]`
     */
    items: BreadcrumbItem[];
    iconOnly: boolean;
    render(): TemplateResult<1>;
    handleClick(item: BreadcrumbItem): void;
    static styles: import('lit').CSSResult;
}
declare global {
    interface HTMLElementTagNameMap {
        'obc-breadcrumb': ObcBreadcrumb;
    }
}
//# sourceMappingURL=breadcrumb.d.ts.map