@koobiq/components 20.4.2 → 21.0.0

package/types/koobiq-components-navbar.d.ts

@@ -0,0 +1,569 @@
+import * as i0 from '@angular/core';
+import { OnChanges, AfterContentInit, AfterViewInit, OnDestroy, Signal, SimpleChanges, ChangeDetectorRef, AfterContentChecked, ElementRef, DestroyRef, QueryList, InjectionToken, Provider } from '@angular/core';
+import * as i1 from '@koobiq/components/tooltip';
+import { KbqTooltipTrigger } from '@koobiq/components/tooltip';
+import * as i1$1 from '@angular/cdk/a11y';
+import { FocusOrigin, FocusMonitor } from '@angular/cdk/a11y';
+import { KbqButton, KbqButtonCssStyler } from '@koobiq/components/button';
+import * as i2 from '@koobiq/components/core';
+import { IFocusableOption, FocusKeyManager, KbqNavbarLocaleConfiguration, KbqDeepPartial } from '@koobiq/components/core';
+export { KbqNavbarLocaleConfiguration } from '@koobiq/components/core';
+import { KbqFormField } from '@koobiq/components/form-field';
+import * as i3 from '@koobiq/components/icon';
+import { KbqIcon } from '@koobiq/components/icon';
+import { Subject, Observable } from 'rxjs';
+import * as i2$1 from '@angular/cdk/platform';
+
+/** Orientation of the navbar an element belongs to. */
+type KbqNavbarOrientation = 'horizontal' | 'vertical';
+/** @docs-private */
+interface KbqNavbarFocusableItemEvent {
+    item: KbqNavbarFocusableItem;
+}
+declare class KbqNavbarLogo {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarLogo, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqNavbarLogo, "kbq-navbar-logo, [kbq-navbar-logo]", never, {}, {}, never, never, true, never>;
+}
+declare class KbqNavbarBento {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarBento, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqNavbarBento, "kbq-navbar-item[bento], [kbq-navbar-item][bento]", never, {}, {}, never, never, true, never>;
+}
+/** Marks content to be projected after the title of a navbar item. */
+declare class KbqNavbarItemSuffix {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarItemSuffix, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqNavbarItemSuffix, "[kbqNavbarItemSuffix]", never, {}, {}, never, never, true, never>;
+}
+declare class KbqNavbarTitle {
+    /** @docs-private */
+    protected readonly isBrowser: boolean;
+    /** @docs-private */
+    protected readonly nativeElement: HTMLElement;
+    private readonly window;
+    /** Text content of the title element. */
+    get text(): string;
+    /** Whether the text is clipped horizontally (e.g. by `text-overflow: ellipsis`). */
+    get isOverflown(): boolean;
+    /**
+     * Whether the text is clipped vertically (e.g. by `-webkit-line-clamp`).
+     *
+     * Kept separate from `isOverflown` on purpose: wrapped text never exceeds its width, so only this
+     * check catches a clamped title. `isOverflown` is also read by `KbqNavbarItem`, whose titles are
+     * always `nowrap` — folding the two together would let sub-pixel line-height rounding enable
+     * tooltips on every navbar item.
+     */
+    get isClamped(): boolean;
+    /** Outer width of the title: its border box plus horizontal margins. */
+    getOuterElementWidth(): number;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarTitle, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqNavbarTitle, "kbq-navbar-title, [kbq-navbar-title]", never, {}, {}, never, never, true, never>;
+}
+declare class KbqNavbarDivider {
+    private readonly rectangleElement;
+    /**
+     * The separator runs across the navbar, so it is oriented the other way round: a horizontal navbar gets a
+     * vertical rule and vice versa.
+     */
+    protected get ariaOrientation(): 'horizontal' | 'vertical';
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarDivider, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqNavbarDivider, "kbq-navbar-divider", never, {}, {}, never, never, true, never>;
+}
+declare class KbqNavbarFocusableItem implements OnChanges, AfterContentInit, AfterViewInit, OnDestroy, IFocusableOption {
+    private elementRef;
+    private changeDetector;
+    private focusMonitor;
+    private readonly injector;
+    private readonly destroyRef;
+    /** @docs-private */
+    readonly title: Signal<KbqNavbarTitle | undefined>;
+    /** @docs-private */
+    readonly button: Signal<KbqButton | undefined>;
+    /** @docs-private */
+    readonly formField: Signal<KbqFormField | undefined>;
+    /** Interactive element projected into the item, if any. */
+    get nestedElement(): KbqButton | KbqFormField | undefined;
+    /** @docs-private */
+    get tooltip(): KbqTooltipTrigger;
+    private _tooltip;
+    /** @docs-private */
+    readonly onFocus: Subject<KbqNavbarFocusableItemEvent>;
+    /** @docs-private */
+    readonly onBlur: Subject<KbqNavbarFocusableItemEvent>;
+    /** @docs-private */
+    get hasFocus(): boolean;
+    set hasFocus(value: boolean);
+    private readonly hasFocusState;
+    /** Whether the item is disabled. Also `true` for a decorative element, which the key manager skips as well. */
+    get disabled(): boolean;
+    set disabled(value: boolean);
+    private readonly disabledState;
+    /**
+     * Items are never in the tab order themselves: the navbar host owns the single tab stop and moves focus
+     * between items with the arrow keys (roving tabindex).
+     */
+    get tabIndex(): number;
+    /** @docs-private */
+    readonly disabledInput: i0.InputSignalWithTransform<boolean | undefined, string | boolean | null | undefined>;
+    ngOnChanges(changes: SimpleChanges): void;
+    constructor();
+    /** @docs-private */
+    ngAfterViewInit(): void;
+    /** @docs-private */
+    ngAfterContentInit(): void;
+    /** @docs-private */
+    ngOnDestroy(): void;
+    /** @docs-private */
+    setTooltip(value: KbqTooltipTrigger): void;
+    /** @docs-private */
+    onFocusHandler(): void;
+    /** @docs-private */
+    focus(origin?: FocusOrigin): void;
+    /** @docs-private */
+    blur(): void;
+    /** @docs-private */
+    getLabel(): string;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarFocusableItem, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqNavbarFocusableItem, "kbq-navbar-item, [kbq-navbar-item], kbq-navbar-brand, [kbq-navbar-brand], kbq-navbar-toggle", never, { "disabledInput": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, ["title", "button", "formField"], never, true, never>;
+}
+declare class KbqNavbarRectangleElement {
+    /** @docs-private */
+    protected readonly isBrowser: boolean;
+    /** @docs-private */
+    protected readonly nativeElement: HTMLElement;
+    private readonly window;
+    private readonly destroyRef;
+    /** Emits whenever the orientation or the collapsed state of the element changes. @docs-private */
+    readonly state: Subject<void>;
+    private readonly _orientation;
+    /**
+     * Orientation of the navbar this element belongs to. Written by the ambient `KbqNavbar` /
+     * `KbqVerticalNavbar`; the element itself only reads it.
+     */
+    get orientation(): KbqNavbarOrientation;
+    set orientation(value: KbqNavbarOrientation);
+    /** Whether the ambient navbar is horizontal. @docs-private */
+    readonly isHorizontal: Signal<boolean>;
+    /** Whether the ambient navbar is vertical. @docs-private */
+    readonly isVertical: Signal<boolean>;
+    private readonly _collapsed;
+    /** Whether the element is rendered in its collapsed (icon-only) form. @docs-private */
+    get collapsed(): boolean;
+    set collapsed(value: boolean);
+    /** Signal mirror of `collapsed`, for `computed()` consumers. @docs-private */
+    readonly collapsedState: Signal<boolean>;
+    /** @docs-private */
+    readonly button: Signal<KbqButtonCssStyler | undefined>;
+    constructor();
+    /** Outer width of the element: its border box plus horizontal margins. */
+    getOuterElementWidth(): number;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarRectangleElement, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqNavbarRectangleElement, "kbq-navbar-item, [kbq-navbar-item], kbq-navbar-divider, kbq-navbar-brand, [kbq-navbar-brand]", never, {}, {}, ["button"], never, true, never>;
+}
+declare class KbqNavbarItem implements AfterContentInit {
+    /** @docs-private */
+    readonly rectangleElement: KbqNavbarRectangleElement;
+    /** @docs-private */
+    readonly navbarFocusableItem: KbqNavbarFocusableItem;
+    /** @docs-private */
+    readonly tooltip: KbqTooltipTrigger;
+    private readonly nativeElement;
+    private readonly changeDetectorRef;
+    private readonly dropdownTrigger;
+    private readonly bento;
+    private readonly contentObserver;
+    private readonly injector;
+    private readonly destroyRef;
+    private expandedWidth;
+    private collapsedWidth;
+    /** @docs-private */
+    readonly title: Signal<KbqNavbarTitle | undefined>;
+    private readonly icons;
+    /** Icon shown before the title; it stays visible when the item collapses. @docs-private */
+    readonly icon: Signal<KbqIcon | undefined>;
+    /** Text shown in the tooltip of a collapsed item. Defaults to the text of the projected `kbq-navbar-title`. */
+    readonly collapsedText: i0.InputSignal<string>;
+    /** Whether the item may be collapsed when the horizontal navbar runs out of room. */
+    readonly collapsable: i0.InputSignalWithTransform<boolean, unknown>;
+    /**
+     * Explicitly enables or disables the item's tooltip.
+     *
+     * Left unset, the tooltip is enabled exactly when the title cannot be read from the item itself — the item
+     * is collapsed, its title is clipped, or it has no title at all.
+     */
+    readonly tooltipDisabled: i0.InputSignalWithTransform<boolean | undefined, unknown>;
+    private readonly ownCollapsed;
+    /** Collapses the item regardless of what the ambient navbar decided. */
+    set collapsed(value: boolean);
+    /** Whether the item is rendered in its collapsed (icon-only) form. */
+    readonly isCollapsed: Signal<boolean>;
+    /** @docs-private */
+    get croppedText(): string;
+    /** Text used for the tooltip and for the accessible name of a collapsed item. */
+    get titleText(): string | null;
+    /** @docs-private */
+    get hasDropDownTrigger(): boolean;
+    /** @docs-private */
+    protected readonly showVerticalDropDownAngle: Signal<boolean>;
+    /** @docs-private */
+    protected readonly showHorizontalDropDownAngle: Signal<boolean>;
+    /**
+     * Whether the title of a vertical bento item slides in without motion.
+     *
+     * @docs-private
+     */
+    protected readonly animationsDisabled: boolean;
+    /** @docs-private */
+    get hasCroppedText(): boolean;
+    /**
+     * Accessible name of the item. Needed for an icon-only item, which has no visible label of its own; an
+     * item that renders a title is named by it.
+     */
+    readonly ariaLabel: i0.InputSignal<string | null>;
+    /**
+     * A collapsed item shows nothing but its icon, and a tooltip is a transient overlay — never an accessible
+     * name. The name is therefore published on the element itself, unless the consumer named it already.
+     */
+    protected get resolvedAriaLabel(): string | null;
+    /**
+     * Items authored as `<kbq-navbar-item>` are custom elements with no implicit role, so they are announced as
+     * plain content. Anything already actionable — a native element, or a projected button/form field that owns
+     * the interaction — keeps its own semantics.
+     *
+     * No `aria-haspopup` for dropdown-trigger items on purpose: `KbqDropdownTrigger` deliberately omits it
+     * because the panel carries no menu semantics; it does publish `aria-expanded` itself.
+     */
+    protected get role(): string | null;
+    /** Whether Enter/Space has to be turned into a click by hand. */
+    private get needsSyntheticActivation();
+    constructor();
+    /** @docs-private */
+    ngAfterContentInit(): void;
+    /** @docs-private */
+    updateTooltip(): void;
+    /**
+     * Records the outer width of the item in the presentation it is shown in, and measures the other one only while
+     * it is still unknown.
+     *
+     * The other presentation is read by toggling the collapse class around the measurement. Restoring it within
+     * the same task is safe: the browser does not paint mid-task, and the host binding only writes to the DOM when
+     * its value changes. Both rely on the item having no CSS transition. A width seen in the real presentation is
+     * preferred because a collapsed item does not render its dropdown chevron, so toggling it back undercounts.
+     *
+     * @docs-private
+     */
+    measureWidths(): void;
+    /**
+     * Width the item gives back by collapsing: its expanded outer width less its collapsed one, as last recorded by
+     * `measureWidths()`. It covers everything the collapse removes or changes — the title, a suffix, the dropdown
+     * chevron and the padding and margins that differ between the two presentations.
+     *
+     * @docs-private
+     */
+    getCollapsibleWidth(): number;
+    /** @docs-private */
+    protected onKeyDown($event: KeyboardEvent): void;
+    private updateDropdown;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarItem, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqNavbarItem, "kbq-navbar-item, [kbq-navbar-item]", ["kbqNavbarItem"], { "collapsedText": { "alias": "collapsedText"; "required": false; "isSignal": true; }; "collapsable": { "alias": "collapsable"; "required": false; "isSignal": true; }; "tooltipDisabled": { "alias": "kbqTooltipDisabled"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; }, {}, ["title", "icons"], ["[kbq-icon]:not([kbqNavbarItemSuffix])", "kbq-navbar-title, [kbq-navbar-title]", "[kbqNavbarItemSuffix]", "*"], true, [{ directive: typeof i1.KbqTooltipTrigger; inputs: { "kbqTooltip": "tooltipText"; "kbqTooltipClass": "kbqTooltipClass"; "kbqTooltipColor": "kbqTooltipColor"; "kbqTooltipContext": "kbqTooltipContext"; "kbqTooltipOffset": "kbqTooltipOffset"; "kbqTrigger": "kbqTrigger"; "kbqPlacement": "kbqPlacement"; "kbqPlacementPriority": "kbqPlacementPriority"; "kbqEnterDelay": "kbqEnterDelay"; "kbqLeaveDelay": "kbqLeaveDelay"; "kbqVisible": "kbqVisible"; }; outputs: { "kbqVisibleChange": "kbqVisibleChange"; "kbqPlacementChange": "kbqPlacementChange"; }; }]>;
+}
+
+declare class KbqNavbarBrand implements AfterContentInit {
+    /** @docs-private */
+    protected readonly nativeElement: HTMLElement;
+    /** @docs-private */
+    protected readonly changeDetectorRef: ChangeDetectorRef;
+    /** @docs-private */
+    protected readonly rectangleElement: KbqNavbarRectangleElement;
+    /** @docs-private */
+    protected readonly navbarFocusableItem: KbqNavbarFocusableItem;
+    /** @docs-private */
+    readonly tooltip: KbqTooltipTrigger;
+    private readonly isBrowser;
+    private readonly resizeObserver;
+    private readonly contentObserver;
+    private readonly document;
+    private readonly injector;
+    private readonly destroyRef;
+    private readonly renderer;
+    private readonly debounceInterval;
+    /** @docs-private */
+    readonly title: Signal<KbqNavbarTitle | undefined>;
+    /**
+     * Whether the title has been measured as not fitting into a single line, which switches it to the compact
+     * two-line presentation.
+     *
+     * @docs-private
+     */
+    protected readonly longTitleEnabled: i0.WritableSignal<boolean>;
+    /** text that will be displayed in the tooltip. By default, the text is taken from kbq-navbar-title. */
+    readonly collapsedText: i0.InputSignal<string>;
+    /**
+     * Explicitly enables or disables the brand's tooltip.
+     *
+     * Left unset, the tooltip is enabled exactly when the title cannot be read from the brand itself — the
+     * navbar is collapsed, the title is clipped, or there is no title at all.
+     */
+    readonly tooltipDisabled: i0.InputSignalWithTransform<boolean | undefined, unknown>;
+    /** Whether the brand is rendered as a native link. */
+    get isLink(): boolean;
+    /** @docs-private */
+    get croppedText(): string;
+    /** @docs-private */
+    get hasCroppedText(): boolean;
+    /** @docs-private */
+    get titleText(): string | null;
+    /** Whether the brand is rendered in its collapsed (logo-only) form. @docs-private */
+    readonly collapsed: Signal<boolean>;
+    /** Accessible name of the brand. Needed when the brand renders nothing but a logo. */
+    readonly ariaLabel: i0.InputSignal<string | null>;
+    /**
+     * A collapsed brand shows nothing but its logo, and a tooltip is a transient overlay — never an accessible
+     * name. The name is therefore published on the element itself, unless the consumer named it already.
+     */
+    protected get resolvedAriaLabel(): string | null;
+    constructor();
+    /** @docs-private */
+    ngAfterContentInit(): void;
+    private preventDisabledActivation;
+    private updateTooltip;
+    private observeLongTitle;
+    private updateAutoLongTitle;
+    /**
+     * Measures whether the title fits into a single line in the *default* presentation.
+     *
+     * Removing and restoring the class within a single task is safe: the browser does not paint mid-task, and
+     * Angular's host binding only writes to the DOM when its value changes, which it does not here. Both rely
+     * on there being no CSS transition on the title - add one and this starts to flicker.
+     */
+    private measureNeedsLongTitle;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarBrand, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqNavbarBrand, "kbq-navbar-brand, [kbq-navbar-brand]", ["kbqNavbarBrand"], { "collapsedText": { "alias": "collapsedText"; "required": false; "isSignal": true; }; "tooltipDisabled": { "alias": "kbqTooltipDisabled"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; }, {}, ["title"], ["*"], true, [{ directive: typeof i1.KbqTooltipTrigger; inputs: { "kbqTooltip": "tooltipText"; "kbqTooltipClass": "kbqTooltipClass"; "kbqTooltipColor": "kbqTooltipColor"; "kbqTooltipOffset": "kbqTooltipOffset"; "kbqTrigger": "kbqTrigger"; "kbqPlacement": "kbqPlacement"; "kbqEnterDelay": "kbqEnterDelay"; "kbqLeaveDelay": "kbqLeaveDelay"; "kbqVisible": "kbqVisible"; }; outputs: { "kbqVisibleChange": "kbqVisibleChange"; "kbqPlacementChange": "kbqPlacementChange"; }; }]>;
+}
+
+declare class KbqFocusableComponent implements AfterContentChecked, AfterContentInit, AfterViewInit, OnDestroy {
+    /** @docs-private */
+    protected readonly changeDetectorRef: ChangeDetectorRef;
+    /** @docs-private */
+    protected readonly elementRef: ElementRef<HTMLElement>;
+    /** @docs-private */
+    protected readonly focusMonitor: FocusMonitor;
+    /** @docs-private */
+    protected readonly destroyRef: DestroyRef;
+    private readonly focusableItemsQuery;
+    private readonly focusableItemsList;
+    /** @docs-private */
+    get focusableItems(): QueryList<KbqNavbarFocusableItem>;
+    /** @docs-private */
+    keyManager: FocusKeyManager<KbqNavbarFocusableItem>;
+    /**
+     * Tab index of the navbar host. The navbar owns the single tab stop of the whole widget and moves focus
+     * between its items with the arrow keys. A navbar without a focusable item stays out of the tab order.
+     */
+    readonly tabIndex: i0.ModelSignal<number>;
+    /**
+     * Tab index the host renders: {@link tabIndex}, or `-1` while there is no item to hand the focus to. Derived
+     * rather than written to the model, which a consumer may bind.
+     *
+     * @docs-private
+     */
+    protected readonly renderedTabIndex: i0.Signal<number>;
+    /**
+     * Accessible name of the navigation landmark. Set it whenever a page renders more than one navbar, so
+     * assistive technology can tell them apart.
+     */
+    readonly ariaLabel: i0.InputSignal<string | null>;
+    private lastFocusOrigin;
+    private cachedOptionFocusChanges;
+    private cachedOptionBlurChanges;
+    /** Focus events of every focusable item, merged once per change of the item set. @docs-private */
+    get optionFocusChanges(): Observable<KbqNavbarFocusableItemEvent>;
+    /** Blur events of every focusable item, merged once per change of the item set. @docs-private */
+    get optionBlurChanges(): Observable<KbqNavbarFocusableItemEvent>;
+    /** @docs-private */
+    ngAfterContentInit(): void;
+    /** @docs-private */
+    ngAfterContentChecked(): void;
+    /**
+     * Monitored with `checkChildren`, because the navbar is one composite widget: the host owns the tab stop
+     * but hands focus straight to an item, and without it that hand-off reads as the navbar being blurred.
+     *
+     * @docs-private
+     */
+    ngAfterViewInit(): void;
+    /** @docs-private */
+    ngOnDestroy(): void;
+    /** Host element of the navbar. @docs-private */
+    getNativeElement(): HTMLElement;
+    /** @docs-private */
+    focus(): void;
+    /** @docs-private */
+    blur(): void;
+    /** @docs-private */
+    protected resetOptions(): void;
+    /** @docs-private */
+    protected dropSubscriptions(): void;
+    private optionFocusSubscription;
+    private optionBlurSubscription;
+    private listenToOptionsFocus;
+    private isValidIndex;
+    private hasFocusedItem;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqFocusableComponent, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqFocusableComponent, never, never, { "tabIndex": { "alias": "tabIndex"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "aria-label"; "required": false; "isSignal": true; }; }, { "tabIndex": "tabIndexChange"; }, ["focusableItemsQuery"], never, true, never>;
+}
+declare class KbqNavbarContainer {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarContainer, never>;
+    static ɵdir: i0.ɵɵDirectiveDeclaration<KbqNavbarContainer, "kbq-navbar-container", never, {}, {}, never, never, true, never>;
+}
+declare class KbqNavbar extends KbqFocusableComponent implements AfterViewInit, AfterContentInit {
+    private readonly platform;
+    private readonly ngZone;
+    private readonly window;
+    /** @docs-private */
+    readonly rectangleElements: i0.Signal<readonly KbqNavbarRectangleElement[]>;
+    /** @docs-private */
+    readonly navbarItems: i0.Signal<readonly KbqNavbarItem[]>;
+    /** Raw `resize` events of the window, fed from outside the Angular zone. @docs-private */
+    readonly resizeStream: Subject<Event>;
+    private readonly resizeDebounceInterval;
+    private get width();
+    /**
+     * Room the content needs: the outer widths of the containers' children plus the containers' own margins, which
+     * hold the gap between them. The containers' boxes are not measured whole, so a container styled to grow still
+     * reports what it needs rather than what it was given.
+     */
+    private get contentWidth();
+    private get collapsableItems();
+    constructor();
+    /** @docs-private */
+    ngAfterContentInit(): void;
+    /**
+     * Recomputes which collapsable items fit into the current navbar width.
+     *
+     * Every measurement is taken up front, and only then is anything written: collapsing an item invalidates
+     * layout, so a measurement taken afterwards forces a synchronous reflow for each of the remaining items. The
+     * width an item frees by collapsing comes from its own record of both presentations, see
+     * `KbqNavbarItem.measureWidths()`.
+     *
+     * @docs-private
+     */
+    updateExpandedStateForItems: () => void;
+    /** Body of `updateExpandedStateForItems()`. */
+    private fitItems;
+    /** @docs-private */
+    protected onKeyDown(event: KeyboardEvent): void;
+    private eventFromInput;
+    private cursorOnFirstPosition;
+    private cursorOnLastPosition;
+    private collapseItems;
+    private expandItems;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbar, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqNavbar, "kbq-navbar", never, {}, {}, ["rectangleElements", "navbarItems"], ["[kbq-navbar-container], kbq-navbar-container"], true, [{ directive: typeof i2.KbqOverlayLayerExclude; inputs: {}; outputs: {}; }]>;
+}
+
+/** default configuration of navbar */
+/** @docs-private */
+declare const KBQ_NAVBAR_DEFAULT_LOCALE_CONFIGURATION: KbqNavbarLocaleConfiguration;
+/** Injection Token for providing configuration of navbar */
+/** @docs-private */
+declare const KBQ_NAVBAR_LOCALE_CONFIGURATION: InjectionToken<KbqNavbarLocaleConfiguration>;
+/**
+ * Utility provider for `KBQ_NAVBAR_LOCALE_CONFIGURATION`. Only the strings you pass are overridden; the
+ * rest keep following the active locale.
+ */
+declare const kbqNavbarLocaleConfigurationProvider: (configuration: KbqDeepPartial<KbqNavbarLocaleConfiguration>) => Provider;
+/** @deprecated Use {@link KBQ_NAVBAR_DEFAULT_LOCALE_CONFIGURATION}. Will be removed in 22.0.0. */
+declare const KBQ_VERTICAL_NAVBAR_DEFAULT_CONFIGURATION: KbqNavbarLocaleConfiguration;
+/** @deprecated Use {@link KBQ_NAVBAR_LOCALE_CONFIGURATION}. Will be removed in 22.0.0. */
+declare const KBQ_VERTICAL_NAVBAR_CONFIGURATION: InjectionToken<KbqNavbarLocaleConfiguration>;
+declare class KbqVerticalNavbar extends KbqFocusableComponent implements AfterContentInit {
+    /**
+     * Localized strings of the navbar.
+     *
+     * A signal, so that a locale change reaches the `OnPush` descendants that render these strings — a plain
+     * field would leave them showing the previous locale until something else marked them dirty. It also keeps
+     * the value observable from outside: `KbqNavbarToggle` reads it in an `effect` to refresh its tooltip,
+     * which a `markForCheck()` here could never have reached in that separate `OnPush` view.
+     */
+    readonly localeConfiguration: i0.Signal<KbqNavbarLocaleConfiguration>;
+    /** @docs-private */
+    readonly rectangleElements: i0.Signal<readonly KbqNavbarRectangleElement[]>;
+    /** @docs-private */
+    readonly items: i0.Signal<readonly KbqNavbarItem[]>;
+    /** @docs-private */
+    readonly bento: i0.Signal<KbqNavbarBento | undefined>;
+    /** Whether the expanded navbar overlays the page content instead of taking room from it. */
+    readonly openOver: i0.InputSignal<boolean>;
+    /** Whether the navbar is expanded. */
+    readonly expanded: i0.ModelSignal<boolean>;
+    private buttonIconsRefresh?;
+    constructor();
+    /** @docs-private */
+    ngAfterContentInit(): void;
+    /** Expands a collapsed navbar and collapses an expanded one. */
+    toggle(): void;
+    /** @docs-private */
+    protected onKeyDown(event: KeyboardEvent): void;
+    /**
+     * Buttons projected into the items re-pick their icon-only modifier from the rendered width, so the pass
+     * has to wait for the collapsed/expanded classes to reach the DOM. One deferred pass over every item, not
+     * one timer per item.
+     */
+    private refreshButtonIcons;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqVerticalNavbar, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqVerticalNavbar, "kbq-vertical-navbar", ["KbqVerticalNavbar"], { "openOver": { "alias": "openOver"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; }, { "expanded": "expandedChange"; }, ["rectangleElements", "items", "bento"], ["[kbq-navbar-container], kbq-navbar-container", "[kbq-navbar-toggle], kbq-navbar-toggle"], true, [{ directive: typeof i1$1.CdkMonitorFocus; inputs: {}; outputs: {}; }, { directive: typeof i2.KbqLocaleOverridesDirective; inputs: { "kbqLocaleOverrides": "localeOverrides"; }; outputs: {}; }, { directive: typeof i2.KbqOverlayLayerExclude; inputs: {}; outputs: {}; }]>;
+}
+
+/**
+ * Dispatches the global `Ctrl+/` shortcut to exactly one navbar toggle.
+ *
+ * Every toggle used to bind its own window listener and call `toggle()` unconditionally, so a single keypress
+ * collapsed *every* vertical navbar on the page. One shared listener instead picks the toggle whose navbar
+ * currently holds focus, and falls back to the first registered one so the shortcut still works from anywhere.
+ *
+ * @docs-private
+ */
+declare class KbqNavbarToggleRegistry implements OnDestroy {
+    private readonly window;
+    private readonly document;
+    private readonly ngZone;
+    private readonly toggles;
+    /** Starts listening for the shortcut on behalf of the given toggle. */
+    add(toggle: KbqNavbarToggle): void;
+    /** Stops dispatching the shortcut to the given toggle. */
+    remove(toggle: KbqNavbarToggle): void;
+    ngOnDestroy(): void;
+    private handleKeydown;
+    private resolveTarget;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarToggleRegistry, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<KbqNavbarToggleRegistry>;
+}
+declare class KbqNavbarToggle implements OnDestroy {
+    private readonly nativeElement;
+    private readonly registry;
+    private readonly isBrowser;
+    private readonly tooltip;
+    /** @docs-private */
+    protected readonly navbar: KbqVerticalNavbar;
+    /** Accessible name of the toggle; it names the action the toggle performs. @docs-private */
+    protected get label(): string;
+    constructor();
+    /** @docs-private */
+    ngOnDestroy(): void;
+    /** Whether the given element sits inside the navbar this toggle belongs to. @docs-private */
+    contains(element: Element): boolean;
+    /** toggles the state of the navbar */
+    toggle(): void;
+    /** @docs-private */
+    protected keydownHandler($event: KeyboardEvent): void;
+    private updateTooltipContent;
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarToggle, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<KbqNavbarToggle, "kbq-navbar-toggle, [kbq-navbar-toggle]", never, {}, {}, never, ["[kbq-icon]"], true, [{ directive: typeof i1$1.CdkMonitorFocus; inputs: {}; outputs: {}; }, { directive: typeof i1.KbqTooltipTrigger; inputs: {}; outputs: {}; }]>;
+}
+
+declare class KbqNavbarModule {
+    static ɵfac: i0.ɵɵFactoryDeclaration<KbqNavbarModule, never>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<KbqNavbarModule, never, [typeof i1$1.A11yModule, typeof i2$1.PlatformModule, typeof i3.KbqIconModule, typeof i1.KbqToolTipModule, typeof KbqNavbar, typeof KbqNavbarContainer, typeof KbqNavbarTitle, typeof KbqNavbarItem, typeof KbqNavbarBrand, typeof KbqNavbarLogo, typeof KbqNavbarToggle, typeof KbqVerticalNavbar, typeof KbqNavbarDivider, typeof KbqNavbarFocusableItem, typeof KbqNavbarRectangleElement, typeof KbqNavbarBento, typeof KbqNavbarItemSuffix], [typeof KbqNavbar, typeof KbqNavbarContainer, typeof KbqNavbarTitle, typeof KbqNavbarItem, typeof KbqNavbarBrand, typeof KbqNavbarLogo, typeof KbqNavbarToggle, typeof KbqVerticalNavbar, typeof KbqNavbarDivider, typeof KbqNavbarFocusableItem, typeof KbqNavbarRectangleElement, typeof KbqNavbarBento, typeof KbqNavbarItemSuffix]>;
+    static ɵinj: i0.ɵɵInjectorDeclaration<KbqNavbarModule>;
+}
+
+export { KBQ_NAVBAR_DEFAULT_LOCALE_CONFIGURATION, KBQ_NAVBAR_LOCALE_CONFIGURATION, KBQ_VERTICAL_NAVBAR_CONFIGURATION, KBQ_VERTICAL_NAVBAR_DEFAULT_CONFIGURATION, KbqFocusableComponent, KbqNavbar, KbqNavbarBento, KbqNavbarBrand, KbqNavbarContainer, KbqNavbarDivider, KbqNavbarFocusableItem, KbqNavbarItem, KbqNavbarItemSuffix, KbqNavbarLogo, KbqNavbarModule, KbqNavbarRectangleElement, KbqNavbarTitle, KbqNavbarToggle, KbqNavbarToggleRegistry, KbqVerticalNavbar, kbqNavbarLocaleConfigurationProvider };
+export type { KbqNavbarFocusableItemEvent, KbqNavbarOrientation };