@teaui/core/.dist/components/Breadcrumb.d.ts

A high-level terminal UI library for Node

import type { Viewport } from '../Viewport.js';
import { type Props as ContainerProps, Container } from '../Container.js';
import { Size } from '../geometry.js';
import { type MouseEvent } from '../events/index.js';
import { type Color } from '../Color.js';
import { Style } from '../Style.js';
import { System } from '../System.js';
export interface BreadcrumbItem {
    title: string;
    onPress?: () => void;
}
export interface PaletteEntry {
    fg: Color;
    bg: Color;
    /** Foreground colour used on hover. Falls back to fg. */
    fgHover?: Color;
    /** Background colour used on hover. Falls back to brightenColor(bg). */
    bgHover?: Color;
}
export interface Props extends ContainerProps {
    items: BreadcrumbItem[];
    isActive?: boolean;
    palette?: PaletteEntry[];
}
/**
 * The measured layout of a single breadcrumb segment, computed once per render.
 */
interface SegmentRegion {
    /** Index into the items array */
    index: number;
    /** X offset where the arrow starts (equal to textX for the first item) */
    arrowX: number;
    /** Width of the leading arrow (0 for the first item) */
    arrowWidth: number;
    /** X offset where the padded title text starts */
    textX: number;
    /** Width of the padded title text (including surrounding spaces) */
    textWidth: number;
}
export declare class Breadcrumb extends Container {
    #private;
    constructor(props: Props);
    update(props: Props): void;
    /**
     * Given a Color, return a brighter version suitable for hover highlighting.
     * Maps standard terminal colours → their bright variants.
     */
    static brightenColor(color: Color): Color;
    /**
     * Compute the styles for a breadcrumb segment, accounting for hover state.
     *
     * Returns { segmentStyle, arrowStyle, finalArrowStyle } where arrowStyle is
     * the style for the leading arrow (left separator) and finalArrowStyle is
     * only set for the last item (the trailing arrow).
     *
     * @param colors     - fg/bg for this item
     * @param prevColors - fg/bg for the previous item (null if first)
     * @param nextColors - fg/bg for the next item (null if last — used for trailing arrow)
     * @param isHovered  - whether this item is being hovered
     * @param isFirst    - whether this is the first item
     * @param isLast     - whether this is the last item
     * @param prevHovered - whether the previous item is hovered (affects this item's left arrow)
     */
    static highlightStyles(colors: PaletteEntry, prevColors: PaletteEntry | null, isHovered: boolean, isActive: boolean, isFirst: boolean, isLast: boolean, prevHovered: boolean): {
        segmentStyle: Style;
        arrowStyle: Style | null;
        finalArrowStyle: Style | null;
    };
    /**
     * Resolve the hover foreground for a palette entry.
     * Uses the explicit `fgHover` colour if provided, otherwise falls back to `fg`.
     */
    static hoverFg(entry: PaletteEntry): Color;
    /**
     * Resolve the hover background for a palette entry.
     * Uses the explicit `bgHover` colour if provided, otherwise falls back to
     * `brightenColor(bg)`.
     */
    static hoverBg(entry: PaletteEntry): Color;
    /**
     * Build a clipped title string: truncates to MAX_TITLE_WIDTH and adds "…" if needed.
     */
    static clippedTitle(title: string): string;
    /**
     * Measure the segments for the current items. This builds the SegmentRegion
     * array so that mouse hit-testing works correctly.
     */
    static measureSegments(items: BreadcrumbItem[]): SegmentRegion[];
    naturalSize(_available: Size): Size;
    receiveMouse(event: MouseEvent, system: System): void;
    render(viewport: Viewport): void;
}
export {};