@apparently/formular/dist/index.d.ts

Form library for SolidJS

import { Accessor } from "solid-js";
export declare type FieldValidator = (value: any, values: any) => Promise<string | void>;
declare type FormElement = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
interface NamePathPart {
    value: string | number;
    arrayIndex: boolean;
}
declare type Field = {
    path: NamePathPart[];
    ref?: FormElement;
    value: any;
    touched: boolean;
    errors: string[];
    validators: FieldValidator[];
};
declare type Data = {
    [key: string]: Field;
};
export interface FormControl {
    data: Data;
    addField: (name: string, validators: FieldValidator[], defaultValue: any, element?: FormElement) => void;
    removeField: (name: string) => void;
    touch: (name: string) => void;
    isFieldDirty: (name: string) => boolean;
    setField: (name: string, value: any, updateElementValue?: boolean) => void;
    addError: (name: string, error: string, focus?: boolean) => void;
    setFieldRef: (name: string, ref: FormElement) => void;
    validate: (name: string) => void;
    focus: (name: string) => void;
    clearErrors: (name: string) => void;
}
export declare function required(message: string): (value: any) => Promise<string | undefined>;
export declare function FinalValue<T>(data: T): () => T;
export declare function createArrayController<T>(name: string, control: FormControl, validators?: FieldValidator[]): {
    errors: Accessor<string[]>;
    invalid: Accessor<boolean>;
    items: Accessor<T[]>;
    add: (item: T) => void;
    update: (index: number, newItem: T) => void;
    set: (items: T[]) => void;
    remove: (index: number) => void;
    swap: (a: number, b: number) => void;
};
export declare function createController<T = any>(name: string, control: FormControl, validators?: FieldValidator[], defaultValue?: any): {
    value: Accessor<T>;
    ref: (el: FormElement) => void;
    touched: Accessor<boolean>;
    dirty: Accessor<boolean>;
    errors: Accessor<string[]>;
    change: (newValue: T, validateOnChange?: boolean, updateRefValue?: boolean) => void;
    onFocus: () => void;
    onBlur: () => void;
    focus: () => void;
    invalid: Accessor<boolean>;
    trigger: () => void;
    addError: (error: string, focus?: boolean) => void;
    clearErrors: () => void;
};
export declare function createForm<T extends {
    [name: string]: any;
}>(): {
    reset: () => void;
    handleSubmit: (callback: (data: T) => void) => (event: SubmitEvent) => Promise<void>;
    control: FormControl;
    focus: (name: string) => void;
    field: (name: string, validators?: FieldValidator[]) => {
        onInput: (e: any) => void;
        onFocus: (e: any) => void;
        onBlur: (e: any) => void;
        name: string;
        ref: (element: FormElement) => void;
    };
    addError: (name: string, error: string, focus?: boolean) => void;
    setValues: (values: Partial<T>) => void;
    setInitialValues: (values: Partial<T>) => void;
    setField: (name: string, value: any, updateElementValue?: boolean) => void;
    trigger: (name?: string | string[], focusOnError?: boolean) => Promise<boolean>;
    clearErrors: (name?: string | string[]) => void;
    values: Accessor<any>;
    isValid: Accessor<boolean>;
    isDirty: Accessor<boolean>;
    touched: Accessor<any>;
    dirty: Accessor<{
        [name: string]: boolean;
    }>;
    errors: Accessor<any>;
};
export {};