ng-hub-ui-breadcrumbs/types/ng-hub-ui-breadcrumbs.d.ts

A flexible and reusable breadcrumb component for Angular applications that automatically generates breadcrumbs based on routing configuration

import * as i0 from '@angular/core';
import { TemplateRef, InjectionToken, EnvironmentProviders, OnDestroy } from '@angular/core';
import * as rxjs from 'rxjs';

interface BreadcrumbItem {
    label: string;
    url: string;
    data: any;
}

declare class HubBreadcrumbComponent {
    #private;
    readonly itemTemplate: i0.Signal<TemplateRef<any> | undefined>;
    breadcrumbs$: rxjs.Observable<BreadcrumbItem[]>;
    /**
     * Semantic accent for the breadcrumb links: `'primary'` · `'success'` ·
     * `'danger'` · `'warning'` · `'info'`, or any custom string (read as
     * `--hub-sys-color-<variant>`). Re-bases `--hub-breadcrumb-accent`; the
     * current (last) item stays muted. Defaults to the standard link colour.
     */
    readonly variant: i0.InputSignal<string | undefined>;
    /**
     * Opt-in per-item truncation. When `true`, each label is clipped to
     * `--hub-breadcrumb-max-item-width` with an ellipsis and, if it overflows,
     * exposes its full text as a tooltip (native `title`, or the hub-ui tooltip
     * when {@link provideHubBreadcrumbTooltip} is wired). Off by default, so the
     * standard breadcrumb layout is unchanged.
     */
    readonly truncateItems: i0.InputSignal<boolean>;
    /**
     * Inline accent for custom (non-built-in) variants — the built-in five are
     * resolved by the SCSS `@each` loop, so this returns `null` for them.
     */
    protected readonly customAccent: i0.Signal<string | null>;
    static ɵfac: i0.ɵɵFactoryDeclaration<HubBreadcrumbComponent, never>;
    static ɵcmp: i0.ɵɵComponentDeclaration<HubBreadcrumbComponent, "hub-breadcrumb", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "truncateItems": { "alias": "truncateItems"; "required": false; "isSignal": true; }; }, {}, ["itemTemplate"], never, true, never>;
}

declare class HubBreadcrumbItemDirective {
    template: TemplateRef<any>;
    static ɵfac: i0.ɵɵFactoryDeclaration<HubBreadcrumbItemDirective, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<HubBreadcrumbItemDirective, "[hubBreadcrumbItem]", never, {}, {}, never, never, true, never>;
}

declare class HubBreadcrumbsModule {
    static ɵfac: i0.ɵɵFactoryDeclaration<HubBreadcrumbsModule, never>;
    static ɵmod: i0.ɵɵNgModuleDeclaration<HubBreadcrumbsModule, never, [typeof HubBreadcrumbComponent, typeof HubBreadcrumbItemDirective], [typeof HubBreadcrumbComponent, typeof HubBreadcrumbItemDirective]>;
    static ɵinj: i0.ɵɵInjectorDeclaration<HubBreadcrumbsModule>;
}

/**
 * Live handle returned by {@link HubBreadcrumbTooltipAdapter.attach}, used by the
 * breadcrumb label directive to update or tear down its tooltip.
 */
interface HubBreadcrumbTooltipHandle {
    /** Updates the tooltip label. An empty string disables the tooltip. */
    update(text: string): void;
    /** Detaches the tooltip and releases its listeners. */
    destroy(): void;
}
/**
 * Optional, structurally-typed tooltip provider consumed by the breadcrumb label
 * directive.
 *
 * The contract is intentionally tiny and defined here (not imported from another
 * package) so `ng-hub-ui-breadcrumbs` keeps **zero hard dependencies**: when no
 * adapter is provided, truncated labels fall back to the native `title`
 * attribute; when one is provided every truncated label upgrades to the richer
 * tooltip automatically.
 *
 * `ng-hub-ui-utils` ships a ready-made implementation (`hubTooltipAdapter`) that
 * matches this shape.
 */
interface HubBreadcrumbTooltipAdapter {
    /**
     * Attaches a tooltip to `host` with the given initial `text`.
     * @returns A handle to update or destroy the tooltip.
     */
    attach(host: HTMLElement, text: string): HubBreadcrumbTooltipHandle;
}

/**
 * Injection token resolving the optional tooltip adapter used by truncated
 * breadcrumb labels.
 *
 * Inject it with `{ optional: true }`; a `null` value means "use the native
 * `title` fallback". Register it through {@link provideHubBreadcrumbTooltip}.
 */
declare const HUB_BREADCRUMB_TOOLTIP_ADAPTER: InjectionToken<HubBreadcrumbTooltipAdapter>;

/**
 * Registers a tooltip adapter so truncated breadcrumb labels render the rich
 * hub-ui tooltip instead of the native `title` fallback.
 *
 * ```ts
 * import { provideHubBreadcrumbTooltip } from 'ng-hub-ui-breadcrumbs';
 * import { hubTooltipAdapter } from 'ng-hub-ui-utils';
 *
 * providers: [provideHubBreadcrumbTooltip(hubTooltipAdapter)];
 * ```
 *
 * @param adapter Tooltip adapter implementation (e.g. `hubTooltipAdapter` from
 *                `ng-hub-ui-utils`).
 * @returns Environment providers to add to the application config.
 */
declare function provideHubBreadcrumbTooltip(adapter: HubBreadcrumbTooltipAdapter): EnvironmentProviders;

/**
 * Adds an overflow-aware tooltip to a breadcrumb label element.
 *
 * Apply `[hubBreadcrumbLabel]` to the link/text of each breadcrumb item. When the
 * label is truncated (its rendered text is wider than its box — typically because
 * `hub-breadcrumb` truncation is enabled), the directive exposes the full text as
 * a tooltip: the native `title` attribute by default, or the richer hub-ui
 * tooltip when a {@link HUB_BREADCRUMB_TOOLTIP_ADAPTER} is provided. When the
 * label fits, no tooltip is shown.
 */
declare class HubBreadcrumbLabelDirective implements OnDestroy {
    /**
     * Explicit tooltip text. When empty, the host's own text content is used, but
     * only while it is truncated.
     */
    readonly tooltip: i0.InputSignal<string>;
    private readonly host;
    /** Optional hub-ui tooltip adapter; absent means native `title` fallback. */
    private readonly adapter;
    /** Whether the rendered label is wider than its clipping box. */
    private readonly isOverflowing;
    /** Trimmed text content of the label, used as the auto tooltip source. */
    private readonly text;
    /** Becomes true once the browser-only overflow tracking is wired. */
    private readonly ready;
    private resizeObserver;
    private mutationObserver;
    private handle;
    constructor();
    ngOnDestroy(): void;
    /** Wires browser-only observers that keep the truncation state in sync. */
    private initOverflowTracking;
    /** Reads the host's text and truncation state into the signals. */
    private measure;
    /**
     * Applies the effective tooltip text through the hub-ui adapter when present,
     * or the native `title` attribute otherwise. An empty text removes both.
     */
    private applyTooltip;
    static ɵfac: i0.ɵɵFactoryDeclaration<HubBreadcrumbLabelDirective, never>;
    static ɵdir: i0.ɵɵDirectiveDeclaration<HubBreadcrumbLabelDirective, "[hubBreadcrumbLabel]", never, { "tooltip": { "alias": "hubBreadcrumbLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
}

declare class HubBreadcrumbsService {
    #private;
    breadcrumbs$: rxjs.Observable<BreadcrumbItem[]>;
    private createBreadcrumbs;
    private hasOwnBreadcrumbData;
    private getBreadcrumbLabel;
    private getResolvedBreadcrumb;
    static ɵfac: i0.ɵɵFactoryDeclaration<HubBreadcrumbsService, never>;
    static ɵprov: i0.ɵɵInjectableDeclaration<HubBreadcrumbsService>;
}

export { HUB_BREADCRUMB_TOOLTIP_ADAPTER, HubBreadcrumbComponent, HubBreadcrumbItemDirective, HubBreadcrumbLabelDirective, HubBreadcrumbsModule, HubBreadcrumbsService, provideHubBreadcrumbTooltip };
export type { HubBreadcrumbTooltipAdapter, HubBreadcrumbTooltipHandle };