@nuralyui/timepicker/timepicker.component.backup.d.ts

NuralyUI TimePicker - A comprehensive time selection component with clock interface, multiple formats, and validation

/**
 * @license
 * Copyright 2023 Nuraly, Laabidi Aymen
 * SPDX-License-Identifier: MIT
 */
import { LitElement, PropertyValues, TemplateResult } from 'lit';
import { TimeValue, TimeFormat, TimePickerMode, TimePickerSize, TimePickerVariant, TimePickerState, TimePickerPlacement, TimePickerConfig } from './timepicker.types.js';
import { TimePickerHost } from './interfaces/timepicker.interface.js';
declare const NrTimePickerElement_base: (new (...args: any[]) => import("../../shared/dependency-mixin.js").DependencyAware) & (new (...args: any[]) => import("../../shared/theme-mixin.js").ThemeAware) & (new (...args: any[]) => import("../../shared/event-handler-mixin.js").EventHandlerCapable) & typeof LitElement;
/**
 * NuralyUI Time Picker - A comprehensive time selection component
 *
 * @element nr-timepicker
 *
 * @fires nr-time-change - Fired when time is selected
 * @fires nr-clock-open - Fired when clock dropdown is opened
 * @fires nr-clock-close - Fired when clock dropdown is closed
 * @fires nr-focus - Fired when component receives focus
 * @fires nr-blur - Fired when component loses focus
 * @fires nr-validation - Fired when validation state changes
 *
 * @slot label - Label content for the input field
 * @slot helper-text - Helper text content below the input field
 * @slot icon - Icon content for the input field trigger
 *
 * @csspart input - The input field part
 * @csspart dropdown - The clock dropdown container part
 * @csspart clock - The clock face part
 * @csspart clock-hand - The clock hand part
 * @csspart time-input - Individual time input parts (hours, minutes, seconds)
 *
 * @example Basic usage
 * ```html
 * <nr-timepicker
 *   label="Select Time"
 *   @nr-time-change="${this.handleTimeChange}">
 * </nr-timepicker>
 * ```
 *
 * @example 12-hour format with seconds
 * ```html
 * <nr-timepicker
 *   format="12h"
 *   show-seconds
 *   label="Meeting Time">
 * </nr-timepicker>
 * ```
 *
 * @example With time constraints
 * ```html
 * <nr-timepicker
 *   min-time="09:00"
 *   max-time="17:00"
 *   label="Business Hours">
 * </nr-timepicker>
 * ```
 */
export declare class NrTimePickerElement extends NrTimePickerElement_base implements TimePickerHost {
    static styles: import("lit").CSSResult;
    private selectionController;
    private validationController;
    private formattingController;
    private dropdownController;
    name: string;
    value: string;
    defaultValue: string;
    disabled: boolean;
    readonly: boolean;
    required: boolean;
    placeholder: string;
    format: TimeFormat;
    showSeconds: boolean;
    showClock: boolean;
    minuteInterval: number;
    secondInterval: number;
    minTime?: string;
    maxTime?: string;
    disabledTimes?: string[];
    enabledTimes?: string[];
    size: TimePickerSize;
    variant: TimePickerVariant;
    state: TimePickerState;
    placement: TimePickerPlacement;
    label: string;
    helperText: string;
    clockOpen: boolean;
    clockMode: TimePickerMode;
    private inputValue;
    private currentMode;
    private validationMessage;
    private inputElement;
    private clockContainer?;
    protected firstUpdated(): void;
    protected updated(changedProperties: PropertyValues): void;
    /**
     * Initialize time picker with default values and constraints
     */
    private initializeTimePicker;
    /**
     * Handle property changes
     */
    private handlePropertyChanges;
    /**
     * Check if constraint properties changed
     */
    private hasConstraintPropertiesChanged;
    /**
     * Update validation constraints
     */
    private updateConstraints;
    /**
     * Set time from string value
     */
    private setTimeFromValue;
    getCurrentTime(): TimeValue;
    setTime(time: TimeValue): void;
    formatTime(time: TimeValue): string;
    parseTime(timeString: string): TimeValue | null;
    getConfig(): TimePickerConfig;
    validateTime(time: TimeValue): boolean;
    /**
     * Open the clock dropdown
     */
    openClock(): void;
    /**
     * Close the clock dropdown
     */
    closeClock(): void;
    /**
     * Toggle clock dropdown
     */
    toggleClock(): void;
    /**
     * Clear selected time
     */
    clear(): void;
    private handleInputChange;
    private handleInputFocus;
    private handleInputBlur;
    private handleTriggerClick;
    private handleTimeSelection;
    private handleModeChange;
    private handleDigitalTimeChange;
    private handleHourSelect;
    private handleMinuteSelect;
    private handleSecondSelect;
    private handlePeriodToggle;
    private updateInputValue;
    protected render(): TemplateResult;
    private renderLabel;
    private renderInput;
    private renderDropdown;
    private renderColumnPicker;
    private renderHourColumn;
    private renderMinuteColumn;
    private renderSecondColumn;
    private renderClockNumbers;
    private renderClockHand;
    private renderModeButtons;
    private renderDigitalInputs;
    private renderPeriodToggle;
    private renderHelperText;
}
export {};
//# sourceMappingURL=timepicker.component.backup.d.ts.map