import { FocusEventHandler, ChangeEventHandler } from 'react';
import { Dispatcher } from "./store";
declare type InputType = 'text';
/**
 * The supported HTML elements
 */
declare type HTMLElements = HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement;
interface ElementController<T extends HTMLElements> {
    type?: InputType | 'radio' | 'checkbox';
    checked?: boolean;
    id: string;
    name: string;
    value?: string | string[] | number;
    onChange: ChangeEventHandler<T>;
    onBlur: FocusEventHandler<T>;
}
interface RadioButtonOptions {
    value: string;
}
interface CheckboxOptions {
    value?: string;
}
interface TextInputOptions {
    type: 'text';
}
interface SelectOptions {
}
interface TextareaOptions {
}
export interface FormField {
    /**
     * Gets the key that identifies this field
     */
    readonly key: string;
    /**
     * Current value of the field
     */
    readonly value: any;
    /**
     * Specifies whether or not an input for this field has been touched
     */
    readonly touched: boolean;
    /**
     * Changes the value of this field.
     */
    change(value: any): void;
    text(options?: TextInputOptions): ElementController<HTMLInputElement>;
    textarea(options?: TextareaOptions): ElementController<HTMLTextAreaElement>;
    checkbox(options?: CheckboxOptions): ElementController<HTMLInputElement>;
    radio(options?: RadioButtonOptions): ElementController<HTMLInputElement>;
    select(options?: SelectOptions): ElementController<HTMLSelectElement>;
}
export declare function createField(args: {
    field: string;
    state: {
        value: any;
        touched: boolean;
    };
    dispatch: Dispatcher;
}): FormField;
export {};