@loadsmart/miranda-wc/dist/components/text-field/text-field.d.ts

Miranda Web Components component library

import type { PropertyValues } from 'lit';
import { Component } from '../component';
import type { FormComponentProps } from '../component';
import '../close-button';
export type TextFieldSize = 'small' | 'default' | 'large';
type InputValue = string | readonly string[] | number;
export interface TextFieldProps extends FormComponentProps {
    autocomplete?: HTMLInputElement['autocomplete'];
    clearable?: boolean;
    initialValue?: string;
    inputMode: 'none' | 'text' | 'numeric' | 'tel' | 'url';
    max?: string;
    maxLength?: number;
    min?: string;
    minLength?: number;
    pattern?: string;
    placeholder?: string;
    readOnly?: boolean;
    size?: TextFieldSize;
    step?: string;
    type?: 'text' | 'password' | 'email' | 'number' | 'search' | 'tel' | 'url' | 'time';
    value?: InputValue;
    input: HTMLInputElement | null;
    variant?: 'table';
    onclear?: (event: CustomEvent) => void;
    onchange?: GlobalEventHandlers['onchange'];
    oninput?: GlobalEventHandlers['oninput'];
}
declare const TextField_base: import("../../utils/types").Constructor<import("../component/form-component.mixin").WithFormComponentMixinInterface> & typeof Component;
export declare class TextField extends TextField_base implements TextFieldProps {
    #private;
    static shadowRootOptions: {
        delegatesFocus: boolean;
        mode: ShadowRootMode;
        serializable?: boolean;
        slotAssignment?: SlotAssignmentMode;
    };
    static styles: import("lit").CSSResult[];
    static get properties(): {
        clearable: {
            type: BooleanConstructor;
        };
        initialValue: {
            type: StringConstructor;
            attribute: string;
            reflect: boolean;
        };
        inputMode: {
            type: StringConstructor;
            attribute: string;
        };
        max: {
            type: StringConstructor;
        };
        maxLength: {
            type: NumberConstructor;
            reflect: boolean;
            attribute: string;
        };
        min: {
            type: StringConstructor;
        };
        minLength: {
            type: NumberConstructor;
            reflect: boolean;
            attribute: string;
        };
        pattern: {
            type: StringConstructor;
        };
        placeholder: {
            type: StringConstructor;
        };
        readOnly: {
            type: BooleanConstructor;
            reflect: boolean;
            attribute: string;
        };
        size: {
            type: StringConstructor;
            reflect: boolean;
        };
        status: {
            type: StringConstructor;
            reflect: boolean;
        };
        step: {
            type: StringConstructor;
        };
        type: {
            type: StringConstructor;
        };
        value: {
            type: StringConstructor;
            reflect: boolean;
        };
        variant: {
            type: StringConstructor;
            reflect: boolean;
        };
    };
    /**
     * Lets web developers specify what if any permission the user agent has to provide
     * automated assistance in filling out form field values, as well as guidance to the
     * browser as to the type of information expected in the field.
     *
     * https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete
     */
    autocomplete: TextFieldProps['autocomplete'];
    /**
     * Should the text field be clearable.
     */
    clearable: TextFieldProps['clearable'];
    initialValue: TextFieldProps['initialValue'];
    inputMode: TextFieldProps['inputMode'];
    /**
     * Define the greatest value in the range of permitted values.
     *
     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#max
     */
    max: TextFieldProps['max'];
    /**
     * The maximum number of characters a user can enter into the text field. Set
     * to -1 for none.
     *
     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#maxlength
     */
    maxLength: TextFieldProps['maxLength'];
    /**
     * Define the most negative value in the range of permitted values.
     *
     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#min
     */
    min: TextFieldProps['min'];
    /**
     * The minimum number of characters a user can enter into the text field. Set
     * to -1 for none.
     *
     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#minlength
     */
    minLength: TextFieldProps['minLength'];
    /**
     * A regular expression that the text field's value must match to pass
     * constraint validation.
     *
     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#pattern
     */
    pattern: TextFieldProps['pattern'];
    /**
     * Placeholder text for the input.
     */
    placeholder: TextFieldProps['placeholder'];
    /**
     * Indicate whether or not a user should be able to edit the text field's
     * value.
     *
     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#readonly
     */
    readOnly: TextFieldProps['readOnly'];
    /**
     * Return or set the element's step attribute, which works with min and max
     * to limit the increments at which a numeric or date-time value can be set.
     *
     * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#step
     */
    step: TextFieldProps['step'];
    /**
     * Text field size.
     */
    size: TextFieldProps['size'];
    /**
     * Input type.
     */
    type: TextFieldProps['type'];
    variant: TextFieldProps['variant'];
    /**
     * The <form> element to associate the component with (its form owner). The value of
     * this attribute must be the id of a <form> in the same document. (If this attribute
     * is not set, the component is associated with its ancestor <form> element, if any).
     * This is useful only when the component has a specific behavior related to form submission.
     * @see {@link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#form|MDN docs, input}
     */
    form: TextFieldProps['form'];
    /**
     * We use this private variable to store the pending value
     * when the internal input hasn't been rendered yet.
     */
    private pendingValue;
    static define(): void;
    constructor();
    createRenderRoot(): DocumentFragment | HTMLElement;
    connectedCallback(): Promise<void>;
    disconnectedCallback(): void;
    update(changedProperties: PropertyValues<this>): void;
    updated(changedProperties: PropertyValues<this>): void;
    render(): import("lit-html").TemplateResult<1>;
    get input(): HTMLInputElement | null;
    /**
     * Text field value.
     */
    set value(value: InputValue | undefined);
    get value(): HTMLInputElement['value'];
    get selectionStart(): HTMLInputElement['selectionStart'];
    get selectionEnd(): HTMLInputElement['selectionEnd'];
    get selectionDirection(): HTMLInputElement['selectionDirection'];
    clear(): void;
    focus(): void;
    select(): void;
    setSelectionRange(start: number | null, end: number | null, direction?: 'forward' | 'backward' | 'none'): void;
    setRangeText(replacement: string, start?: number, end?: number, selectionMode?: SelectionMode): void;
    formResetCallback(): void;
    formStateRestoreCallback(state: string): void;
    formDisabledCallback(disabled: boolean): void;
}
declare global {
    interface HTMLElementTagNameMap {
        'm-text-field': TextField;
    }
}
export {};