import type { Form } from "./form"; import type { FormControlElement } from "./formControlElement"; import type { Validator, ValidationErrors, ErrorMap } from "./validator"; /** A FormControl represents the state of a {@link FormControlElement} like (input, textarea...) */ export declare class FormControl { validators: Validator[]; /** * Returns an object containing possible validation errors * @example * (All validators are throwing an error) * `{ required: true, minLength: 4, maxLength: 20 }` * (Only required is invalid) * `{ required: true }` */ errors: ValidationErrors; /** * Contains a map of values, that will be shown * in place of the original validation error. */ errorMap: ErrorMap; /** * The DOM elements representing this control */ elements: FormControlElement[]; /** Does the FormControl pass all given validators? */ valid: boolean; /** * If the FormControl has been interacted with. * (triggered by blur event) */ _touched: boolean; /** The initial value of the FormControl. Defaults to `""` if not set via `useForm(params)`. */ initial: string; private readonly formRef; private _value; get value(): string; get touched(): boolean; /** * This will only change the internal value of the control, not the one displayed in the actual HTML-Element * * See `change(value: String)` for doing both */ set value(value: string); set touched(value: boolean); constructor(formControl: { value: string; validators: Validator[]; errorMap: ErrorMap; elements: FormControlElement[]; formRef: () => Form; }); /** * Set an error manually. * * The error will be removed after changes to the value or on validate() * * Used for setting an error that would be difficult to implement with a validator. * @example Backend Response returning Login failed * ``` typescript * function submit() { * apiLogin($form.values).then(response => {}) * .catch(error => { * if (error.status === 403) { * $form.password.error({ login: "Password or username is incorrect" }); * } * }) * } * ``` */ error(errors: ValidationErrors): void; /** Change the value and the value of all HTML-Elements associated with this control */ change(value: any): void; /** Validate the FormControl by querying through the given validators. */ validate(): boolean; /** Reset the form control value to its initial value or `{ value }` and untouch it */ reset({ value }?: { value?: string | null; }): void; }