import * as i0 from '@angular/core'; import { AfterContentInit, AfterViewInit, EventEmitter, QueryList } from '@angular/core'; import { EuiAppShellService } from '@eui/core'; import * as i1 from '@eui/components/shared'; import { BaseStatesDirective } from '@eui/components/shared'; /** * A horizontal navigation bar component that displays a collection of selectable items. * Automatically adapts to a dropdown view when the available width is insufficient to display all items inline. * Supports primary and secondary visual variants through the BaseStatesDirective. * Manages the active state of child navbar items and emits selection events. * * @usageNotes * ### Basic Usage * ```html * * * * * * ``` * * ```typescript * onNavItemClick(itemId: string) { * console.log('Selected:', itemId); * } * ``` * * ### Accessibility * - Navbar items are keyboard navigable with Tab key * - Enter and Space keys activate items * - Active item is visually distinguished and announced to screen readers * * ### Notes * - Automatically switches to dropdown when width is constrained * - Only one item can be active at a time * - Supports primary and secondary visual variants */ declare class EuiNavbarComponent implements AfterContentInit, AfterViewInit { get cssClasses(): string; /** * Emitted when a navbar item is selected by user interaction. * Payload contains the id of the selected navbar item. * Triggered by click or keyboard activation (Enter/Space) on any child EuiNavbarItemComponent. */ itemClick: EventEmitter; items: QueryList; baseItemSelected: EuiNavbarItemComponent; isDropdownView: boolean; asService: EuiAppShellService; baseStatesDirective: BaseStatesDirective; private elementRef; ngAfterContentInit(): void; ngAfterViewInit(): void; itemSelected(id: string): void; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; } /** * A selectable navigation item that must be used as a child of EuiNavbarComponent. * Displays a text label and manages its own active state through visual styling. * Supports keyboard navigation with Enter and Space keys. * Automatically communicates selection events to the parent navbar component. * * @usageNotes * ### Basic Usage * ```html * * * * * ``` * * ### Accessibility * - Focusable with `tabindex="0"` * - Activatable with Enter or Space keys * - Active state is visually indicated * * ### Notes * - Must be direct child of `eui-navbar` * - Requires unique `id` for selection tracking * - Label is required for display */ declare class EuiNavbarItemComponent { get cssClasses(): string; tabindex: number; /** * Unique identifier for the navbar item. * Used to track selection state and emitted in the parent navbar's itemClick event. * Required for proper item selection management. */ id: string; /** * Text label displayed for the navbar item. * Rendered directly in the component template. * Required for meaningful user interaction. */ label: string; /** * Determines whether this navbar item is currently selected. * When true, applies the 'eui-navbar-item--active' CSS class for visual distinction. * Defaults to false. Managed by the parent EuiNavbarComponent during selection. */ isActive: boolean; navBarComponentParent: EuiNavbarComponent; constructor(); protected onClick(): void; protected onKeydown(event: KeyboardEvent): void; private _click; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; static ngAcceptInputType_isActive: unknown; } declare const EUI_NAVBAR: readonly [typeof EuiNavbarComponent, typeof EuiNavbarItemComponent]; export { EUI_NAVBAR, EuiNavbarComponent, EuiNavbarItemComponent }; //# sourceMappingURL=eui-components-eui-navbar.d.ts.map