@conform-to/dom/dist/dom.d.ts

A set of opinionated helpers built on top of the Constraint Validation API

/**
 * Element that user can interact with,
 * includes `<input>`, `<select>` and `<textarea>`.
 */
export type FieldElement = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
/**
 * Form Control element. It can either be a submit button or a submit input.
 */
export type Submitter = HTMLInputElement | HTMLButtonElement;
export declare function dispatchInternalUpdateEvent(form: HTMLFormElement): void;
export declare function isInputElement(element: Element): element is HTMLInputElement;
export declare function isSelectElement(element: Element): element is HTMLSelectElement;
export declare function isTextAreaElement(element: Element): element is HTMLTextAreaElement;
/**
 * A type guard to checks if the element is a submitter element.
 * A submitter element is either an input or button element with type submit.
 */
export declare function isSubmitter(element: HTMLElement): element is HTMLInputElement | HTMLButtonElement;
/**
 * A type guard to check if the provided element is a field element, which
 * is a form control excluding submit, button and reset type.
 */
export declare function isFieldElement(element: unknown): element is FieldElement;
export declare function isGlobalInstance<ClassName extends {
    [K in keyof typeof globalThis]: (typeof globalThis)[K] extends new (...args: any) => any ? K : never;
}[keyof typeof globalThis]>(obj: unknown, className: ClassName): obj is InstanceType<(typeof globalThis)[ClassName]>;
/**
 * Resolves the action from the submit event
 * with respect to the submitter `formaction` attribute.
 */
export declare function getFormAction(event: SubmitEvent): string;
/**
 * Resolves the encoding type from the submit event
 * with respect to the submitter `formenctype` attribute.
 */
export declare function getFormEncType(event: SubmitEvent): 'application/x-www-form-urlencoded' | 'multipart/form-data';
/**
 * Resolves the method from the submit event
 * with respect to the submitter `formmethod` attribute.
 */
export declare function getFormMethod(event: SubmitEvent): 'GET' | 'POST' | 'PUT' | 'PATCH' | 'DELETE';
/**
 * Trigger a form submit event with an optional submitter.
 * If the submitter is not mounted, it will be appended to the form and removed after submission.
 */
export declare function requestSubmit(form: HTMLFormElement | null | undefined, submitter: HTMLElement | null): void;
/**
 * Triggers form submission with an intent value. This is achieved by
 * creating a hidden button element with the intent value and then submitting it with the form.
 */
export declare function requestIntent(formElement: HTMLFormElement, intentName: string, intentValue: string): void;
export declare function createFileList(value: File | File[]): FileList;
type InputCallback = (event: {
    type: 'input' | 'reset' | 'mutation';
    target: HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
}) => void;
type FormCallback = (event: {
    type: 'submit' | 'input' | 'reset' | 'mutation';
    target: HTMLFormElement;
    submitter?: HTMLInputElement | HTMLButtonElement | null;
}) => void;
type InternalUpdateEvent = {
    target: HTMLFormElement;
};
type InternalCallback = (event: InternalUpdateEvent) => void;
export declare function createGlobalFormsObserver(): {
    onFieldUpdate(callback: InputCallback): () => void;
    onFormUpdate(callback: FormCallback): () => void;
    onInternalUpdate(callback: InternalCallback): () => void;
    dispose(): void;
};
export declare function isCheckboxGroup(element: HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement): boolean;
/**
 * Change the value of the given field element.
 * Dispatches both `input` and `change` events only if the value is changed.
 */
export declare function change(element: HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement | HTMLFieldSetElement | Array<HTMLInputElement>, value: unknown, options?: {
    preventDefault?: boolean;
    forceDispatch?: boolean;
}): boolean;
/**
 * Dispatches focus and focusin events on the given element.
 */
export declare function focus(element: Element): void;
/**
 * Dispatches blur and focusout events on the given element.
 */
export declare function blur(element: Element): void;
export declare function normalizeStringValues(value: unknown): string[] | undefined;
export declare function normalizeFileValues(value: unknown): File[] | undefined;
/**
 * Updates the DOM element with the provided value and defaultValue.
 * If the value or defaultValue is undefined, it will keep the current value instead
 */
export declare function updateField(element: HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement, options: {
    value?: unknown;
    defaultValue?: unknown;
}): boolean;
export declare function isDirtyInput(element: HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement): boolean;
export {};
//# sourceMappingURL=dom.d.ts.map