@trimble-oss/moduswebcomponents/types/components/modus-wc-time-input/modus-wc-time-input.d.ts

Modus Web Components is a modern, accessible UI library built with Stencil JS that provides reusable web components following Trimble's Modus design system. This updated version focuses on improved flexibility, enhanced theming options, comprehensive cust

import { EventEmitter } from '../../stencil-public-runtime';
import { IInputFeedbackProp, ModusSize } from '../types';
/**
 * A customizable input component used to create time inputs.
 */
export declare class ModusWcTimeInput {
    private inheritedAttributes;
    /** Reference to the host element */
    el: HTMLElement;
    /** Hint for form autofill feature. */
    autoComplete?: 'on' | 'off';
    /** Indicates that the input should have a border. */
    bordered?: boolean;
    /** Custom CSS class to apply to the input. */
    customClass?: string;
    /** The options to display in the time input dropdown. Options must be in `HH:mm` or `HH:mm:ss` format. */
    datalistOptions: string[];
    /** Whether the form control is disabled. */
    disabled?: boolean;
    /** Feedback to render below the input. */
    feedback?: IInputFeedbackProp;
    /** The ID of the input element. */
    inputId?: string;
    /** Determine the control's relative ordering for sequential focus navigation (typically with the Tab key). */
    inputTabIndex?: number;
    /**
     * ID of a `<datalist>` element that contains pre-defined time options.
     * The value must be the ID of a `<datalist>` element in the same document.
     */
    datalistId?: string;
    /** The text to display within the label. */
    label?: string;
    /** Maximum value. Format: `HH:mm`, `HH:mm:ss`. */
    max?: string;
    /** Minimum value. Format: `HH:mm`, `HH:mm:ss.`*/
    min?: string;
    /** Name of the form control. Submitted with the form as part of a name/value pair. */
    name?: string;
    /** Whether the value is editable. */
    readOnly?: boolean;
    /** A value is required for the form to be submittable. */
    required?: boolean;
    /**
     * Displays the time input format as `HH:mm:ss` if `true`.
     * Internally sets the `step` to 1 second.
     * If a `step` value is provided, it will override this attribute.
     */
    showSeconds?: boolean;
    /** The size of the input. */
    size?: ModusSize;
    /**
     * Specifies the granularity that the `value` must adhere to.
     * Value of step given in seconds. Default value is 60 seconds.
     * Overrides the `seconds` attribute if both are provided.
     */
    step?: number;
    /**
     * The value of the time input.
     * Always in 24-hour format that includes leading zeros:
     * `HH:mm` or `HH:mm:ss`, regardless of input format which is likely
     * to be selected based on user's locale (or by the user agent).
     * If time includes seconds the format is always `HH:mm:ss`.
     */
    value: string;
    /** Event emitted when the input loses focus. */
    inputBlur: EventEmitter<FocusEvent>;
    /** Event emitted when the input value changes. */
    inputChange: EventEmitter<Event>;
    /** Event emitted when the input gains focus. */
    inputFocus: EventEmitter<FocusEvent>;
    componentWillLoad(): void;
    private getClasses;
    private handleBlur;
    private handleFocus;
    private handleInput;
    private readonly internalDatalistId;
    private renderDatalist;
    render(): any;
}