import * as i0 from '@angular/core'; import { OnInit, AfterViewInit, OnDestroy, EventEmitter, QueryList, ElementRef, ChangeDetectorRef } from '@angular/core'; import { ControlValueAccessor } from '@angular/forms'; import * as i1 from '@eui/components/shared'; import { BaseStatesDirective } from '@eui/components/shared'; /** * @description * Interactive star rating component for collecting user feedback and displaying rating values. * Implements ControlValueAccessor for seamless integration with Angular reactive and template-driven forms. * Supports keyboard navigation with arrow keys, Home, and End for accessibility. * Provides customizable number of stars and visual feedback for current rating state. * Commonly used for product reviews, feedback forms, and quality assessments. * * @usageNotes * ### Basic usage * ```html * * ``` * * ### With reactive forms * ```typescript * ratingControl = new FormControl(3); * ``` * ```html * * ``` * * ### Disabled state * ```html * * ``` * * ### Accessibility * - Full keyboard navigation: Arrow keys to change rating, Home/End for first/last * - ARIA radiogroup role with proper labeling * - Each star is focusable and announces its value to screen readers * - Visual focus indicators for keyboard users * * ### Notes * - Click same star again to clear rating (set to 0) * - Only one star is focusable at a time (roving tabindex pattern) * - Emits `ratingChange` event on user interaction */ declare class EuiRatingComponent implements ControlValueAccessor, OnInit, AfterViewInit, OnDestroy { /** CSS classes applied to the host element */ get cssClasses(): string; /** * Unique identifier for the toggle * @default Generated unique ID with 'eui-rating-' prefix */ /** * Whether the toggle is disabled * @default false */ euiDisabled: boolean; /** * Current numbers of stars rating to display * @default 5 */ numberOfStars: number; /** * Current rating number * @default 0 */ rating: number; /** * Event emitted when toggle state changes * @emits boolean - The new toggle state */ ratingChange: EventEmitter; ratingButtons: QueryList; /** * Binds the aria-label attribute to the component. * @default 'eUI Rating' */ ariaLabel: string; /** * Binds the role attribute to the component. * @default 'radiogroup' */ role: string; protected numbers: any[]; protected baseStatesDirective: BaseStatesDirective; protected cd: ChangeDetectorRef; private destroy$; ngOnInit(): void; ngAfterViewInit(): void; ngOnDestroy(): void; /** * Implements ControlValueAccessor * Updates the toggle's checked state */ writeValue(value: number): void; /** * Implements ControlValueAccessor * Updates the rating's disabled state */ setDisabledState(isDisabled: boolean): void; /** * Handles focus out event * Notifies form control of touch event */ onFocusOut(): void; /** * Implements ControlValueAccessor * Registers change handler * @todo Improve type definition or make generic */ registerOnChange(fn: any): void; /** * Implements ControlValueAccessor * Registers touch handler * @todo Improve type definition or make generic */ registerOnTouched(fn: any): void; /** * Actions applied upon a keydown event * * @param event The keyboard event * @param index The index of the current star button */ protected onKeydown(event: KeyboardEvent, index: number): void; /** * Toggles the current state if not disabled * Emits the new state and notifies form control */ protected onUpdate(rating: number): void; /** * Updates the checked state of the star button based on the index * @param index The index of the star button * @returns boolean - true if the index matches the rating, false otherwise */ protected updateCheckedState(index: number): boolean; /** * Returns the tab index value based on the current rating and index * @param index The index of the star button * @returns number - 0 if the star is focusable, -1 otherwise */ protected getTabIndexValue(index: number): number; private initState; private updateState; private updateRating; private onChange; private onTouch; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; static ngAcceptInputType_euiDisabled: unknown; static ngAcceptInputType_numberOfStars: unknown; static ngAcceptInputType_rating: unknown; } declare const EUI_RATING: readonly [typeof EuiRatingComponent]; export { EUI_RATING, EuiRatingComponent }; //# sourceMappingURL=eui-components-eui-rating.d.ts.map