import * as i0 from '@angular/core'; import { OnInit, OnChanges, DoCheck, OnDestroy, SimpleChanges } from '@angular/core'; import { ControlValueAccessor, FormControl } from '@angular/forms'; /** * Interface representing a time value with hours, minutes, and optional seconds. * Used by EuiTimepickerComponent to manage time values. * * @interface EuiTimePicker */ interface EuiTimePicker { /** * Hours value (0-23) */ hours: number; /** * Minutes value (0-59) */ mins: number; /** * Optional seconds value (0-59) */ secs?: number; } /** * @description * A timepicker component that allows the user to select a time. The component * can be used in two modes: one input field or three separate input fields * for hours, minutes, and seconds. The component also supports incremental and * decremental buttons for each input field. * * @usageNotes * ### Basic Usage * ```html * * * * * * * *
* * * ``` * * ```typescript * selectedTime: EuiTimePicker = { hours: 14, minutes: 30, seconds: 0 }; * form = new FormGroup({ * appointmentTime: new FormControl(null) * }); * ``` * * ### Accessibility * - Provide clear labels for time input purpose * - Use aria-label on increment/decrement buttons * - Ensure keyboard navigation works (Tab, Arrow keys) * - Announce time changes to screen readers * * ### Notes * - Time format: { hours: number, minutes: number, seconds?: number } * - Single input mode uses mask for formatted input (HH:MM or HH:MM:SS) * - Separate fields mode provides individual controls with +/- buttons * - Step values control increment/decrement amounts */ declare class EuiTimepickerComponent implements ControlValueAccessor, OnInit, OnChanges, DoCheck, OnDestroy { hours: number; mins: number; secs: number; isDatetimepicker: boolean; oneInputFormControl: FormControl; oneInputHours: string; oneInputMins: string; oneInputSecs: string; hoursUpDisabled: boolean; hoursDownDisabled: boolean; minutesUpDisabled: boolean; minutesDownDisabled: boolean; secondsUpDisabled: boolean; secondsDownDisabled: boolean; e2eAttr: string; /** * The id of the input element when isOneInputField attribute is used. If not provided, a unique id will be generated. * @default 'eui-timepicker-' */ inputId: string; /** * The mask for the input field when isOneInputField attribute is used. * @default 'Hh:m0' */ timeMask: string; /** * The placeholder of the input field when isOneInputField attribute is used. * @default 'Hh:m0' */ placeholder: string; /** * The step used for changing hours. * @default 1 */ stepHours: number; /** * The step used for changing minutes. * @default 1 */ stepMinutes: number; /** * The step used for changing seconds. * @default 1 */ stepSeconds: number; /** * The size of the icon used for changing hours, minutes and seconds. * @default 'l' */ iconSize: string; /** * Sets the readonly attribute of the input field. * @default false */ isreadOnly: boolean; /** * Sets the disabled state. * @default false */ isDisabled: boolean; /** * Attribute that transforms the 3 separate inputs into one input field. * @default false */ isOneInputField: boolean; /** * Option for enabling seconds. * @default false */ hasSeconds: boolean; protected hasAriaRequiredAttribute: boolean; private propagatedValues; private destroy$; private control; constructor(); ngOnInit(): void; ngOnChanges(changes: SimpleChanges): void; ngDoCheck(): void; ngOnDestroy(): void; /** * Increments or decrements hours according to the step param being passed * * @param step The step number that hours will increase or decrease */ changeHours(step: number): void; /** * Increments or decrements minutes according to the step param being passed * * @param step The step number that minutes will increase or decrease */ changeMinutes(step: number): void; /** * Increments or decrements seconds according to the step param being passed * * @param step The step number that seconds will increase or decrease */ changeSeconds(step: number): void; /** * Updates the input field when hours change and adds 24hour validation + propagates the value back to the form * * @param newVal The new value that hours will have */ updateHours(newVal: string): void; /** * Updates the input field when minutes change and adds 60mins validation + propagates the value back to the form * * @param newVal The new value that minutes will have */ updateMinutes(newVal: string): void; /** * Updates the input field when seconds change and adds 60secs validation + propagates the value back to the form * * @param newVal The new value that seconds will have */ updateSeconds(newVal: string): void; /** * Autofills mins and secs with 00s if the user tabs after entering hours and marks the input as touched */ onFocusOut(): void; writeValue(values: EuiTimePicker): void; /** * Disables the hour up incremental when max time range is reached * * @param state The boolean value that enables the feature */ hoursUpDisable(state: boolean): void; /** * Disables the hour down decremental when min time range is reached * * @param state The boolean value that enables the feature */ hoursDownDisable(state: boolean): void; /** * Disables the minutes up incremental when max time range is reached * * @param state The boolean value that enables the feature */ minutesUpDisable(state: boolean): void; /** * Disables the minutes down decremental when min time range is reached * * @param state The boolean value that enables the feature */ minutesDownDisable(state: boolean): void; /** * Disables the seconds up incremental when max time range is reached * * @param state The boolean value that enables the feature */ secondsUpDisable(state: boolean): void; /** * Disables the seconds down decremental when min time range is reached * * @param state The boolean value that enables the feature */ secondsDownDisable(state: boolean): void; registerOnChange(fn: () => void): void; registerOnTouched(fn: () => void): void; setDisabledState(isDisabled: boolean): void; /** * A callback function that is called when the time is changed. It is used to propagate the value back to the form. * @param hours The hours value * @param mins The minutes value * @param secs The seconds value */ private callbackFn; /** * Converts the provided value to an integer. * * @param value The value to convert * @private */ private toInteger; /** * Pads leading zero to the provided number when isOneInputField * * @param value The value to add leading zero to * @private */ private padNumber; private propagateChange; private propagateTouched; /** * Updates the `aria-required` attribute on the input element. * @param control The NgControl instance to check for required validator * @private */ private updateInputAriaRequiredAttribute; static ɵfac: i0.ɵɵFactoryDeclaration; static ɵcmp: i0.ɵɵComponentDeclaration; static ngAcceptInputType_isreadOnly: unknown; static ngAcceptInputType_isDisabled: unknown; static ngAcceptInputType_isOneInputField: unknown; static ngAcceptInputType_hasSeconds: unknown; } /** * Configuration interface for the EUI DateTime Picker component. * Defines the structure and behavior settings for the datetime picker. * * @interface EuiDateTimePickerConfig */ interface EuiDateTimePickerConfig { /** * Initial hours value (0-23) */ hours: number; /** * Initial minutes value (0-59) */ mins: number; /** * Optional initial seconds value (0-59) */ secs?: number; /** * Indicates if the component is used as a datetime picker */ isDatetimepicker: boolean; /** * Controls whether seconds selection is enabled */ hasSeconds: boolean; /** * When true, displays a single input field for time entry instead of separate inputs */ isOneInputField: boolean; /** * Step interval for hours increment/decrement */ stepHours: number; /** * Step interval for minutes increment/decrement */ stepMinutes: number; /** * Step interval for seconds increment/decrement */ stepSeconds: number; /** * Controls whether the timepicker buttons are disabled */ isDisabled?: boolean; /** * Callback function triggered when time value changes * * @param hours - The selected hours value * @param mins - The selected minutes value * @param secs - The selected seconds value (if enabled) */ callbackFn: (hours: number, mins: number, secs?: number) => void; } declare const EUI_TIMEPICKER: readonly [typeof EuiTimepickerComponent]; export { EUI_TIMEPICKER, EuiTimepickerComponent }; export type { EuiDateTimePickerConfig, EuiTimePicker }; //# sourceMappingURL=eui-components-eui-timepicker.d.ts.map