remix-validated-form 4.6.5 → 4.6.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +10 -9
- package/dist/index.cjs.js +1928 -0
- package/dist/index.cjs.js.map +1 -0
- package/dist/index.d.ts +337 -0
- package/dist/{remix-validated-form.es.js → index.esm.js} +573 -877
- package/dist/index.esm.js.map +1 -0
- package/package.json +12 -10
- package/src/ValidatedForm.tsx +17 -5
- package/src/hooks.ts +1 -1
- package/src/server.ts +1 -1
- package/tsup.config.ts +3 -0
- package/dist/remix-validated-form.cjs.js +0 -27
- package/dist/remix-validated-form.cjs.js.map +0 -1
- package/dist/remix-validated-form.es.js.map +0 -1
- package/dist/remix-validated-form.umd.js +0 -27
- package/dist/remix-validated-form.umd.js.map +0 -1
- package/dist/types/ValidatedForm.d.ts +0 -50
- package/dist/types/hooks.d.ts +0 -67
- package/dist/types/index.d.ts +0 -7
- package/dist/types/internal/MultiValueMap.d.ts +0 -11
- package/dist/types/internal/constants.d.ts +0 -3
- package/dist/types/internal/flatten.d.ts +0 -1
- package/dist/types/internal/formContext.d.ts +0 -12
- package/dist/types/internal/getInputProps.d.ts +0 -29
- package/dist/types/internal/hooks.d.ts +0 -35
- package/dist/types/internal/hydratable.d.ts +0 -14
- package/dist/types/internal/logic/getCheckboxChecked.d.ts +0 -1
- package/dist/types/internal/logic/getRadioChecked.d.ts +0 -1
- package/dist/types/internal/logic/requestSubmit.d.ts +0 -5
- package/dist/types/internal/state/arrayUtil.d.ts +0 -12
- package/dist/types/internal/state/controlledFields.d.ts +0 -7
- package/dist/types/internal/state/createFormStore.d.ts +0 -79
- package/dist/types/internal/state/fieldArray.d.ts +0 -28
- package/dist/types/internal/state/storeHooks.d.ts +0 -3
- package/dist/types/internal/state/types.d.ts +0 -1
- package/dist/types/internal/submissionCallbacks.d.ts +0 -1
- package/dist/types/internal/util.d.ts +0 -5
- package/dist/types/server.d.ts +0 -21
- package/dist/types/unreleased/formStateHooks.d.ts +0 -64
- package/dist/types/userFacingFormContext.d.ts +0 -85
- package/dist/types/validation/createValidator.d.ts +0 -7
- package/dist/types/validation/types.d.ts +0 -58
- package/vite.config.ts +0 -7
@@ -1,29 +0,0 @@
|
|
1
|
-
export declare type ValidationBehavior = "onBlur" | "onChange" | "onSubmit";
|
2
|
-
export declare type ValidationBehaviorOptions = {
|
3
|
-
initial: ValidationBehavior;
|
4
|
-
whenTouched: ValidationBehavior;
|
5
|
-
whenSubmitted: ValidationBehavior;
|
6
|
-
};
|
7
|
-
export declare type CreateGetInputPropsOptions = {
|
8
|
-
clearError: () => void;
|
9
|
-
validate: () => void;
|
10
|
-
defaultValue?: any;
|
11
|
-
touched: boolean;
|
12
|
-
setTouched: (touched: boolean) => void;
|
13
|
-
hasBeenSubmitted: boolean;
|
14
|
-
validationBehavior?: Partial<ValidationBehaviorOptions>;
|
15
|
-
name: string;
|
16
|
-
};
|
17
|
-
declare type HandledProps = "name" | "defaultValue" | "defaultChecked";
|
18
|
-
declare type Callbacks = "onChange" | "onBlur";
|
19
|
-
declare type MinimalInputProps = {
|
20
|
-
onChange?: (...args: any[]) => void;
|
21
|
-
onBlur?: (...args: any[]) => void;
|
22
|
-
defaultValue?: any;
|
23
|
-
defaultChecked?: boolean;
|
24
|
-
name?: string;
|
25
|
-
type?: string;
|
26
|
-
};
|
27
|
-
export declare type GetInputProps = <T extends MinimalInputProps>(props?: Omit<T, HandledProps | Callbacks> & Partial<Pick<T, Callbacks>>) => T;
|
28
|
-
export declare const createGetInputProps: ({ clearError, validate, defaultValue, touched, setTouched, hasBeenSubmitted, validationBehavior, name, }: CreateGetInputPropsOptions) => GetInputProps;
|
29
|
-
export {};
|
@@ -1,35 +0,0 @@
|
|
1
|
-
import { FieldErrors, ValidationErrorResponseData } from "..";
|
2
|
-
import { InternalFormContextValue } from "./formContext";
|
3
|
-
import { Hydratable } from "./hydratable";
|
4
|
-
import { InternalFormId } from "./state/types";
|
5
|
-
export declare const useInternalFormContext: (formId?: string | symbol, hookName?: string) => InternalFormContextValue;
|
6
|
-
export declare function useErrorResponseForForm({ fetcher, subaction, formId, }: InternalFormContextValue): ValidationErrorResponseData | null;
|
7
|
-
export declare const useFieldErrorsForForm: (context: InternalFormContextValue) => Hydratable<FieldErrors | undefined>;
|
8
|
-
export declare const useDefaultValuesFromLoader: ({ formId, }: InternalFormContextValue) => any;
|
9
|
-
export declare const useDefaultValuesForForm: (context: InternalFormContextValue) => Hydratable<{
|
10
|
-
[fieldName: string]: any;
|
11
|
-
}>;
|
12
|
-
export declare const useHasActiveFormSubmit: ({ fetcher, }: InternalFormContextValue) => boolean;
|
13
|
-
export declare const useFieldTouched: (field: string, { formId }: InternalFormContextValue) => readonly [boolean, (touched: boolean) => void];
|
14
|
-
export declare const useFieldError: (name: string, context: InternalFormContextValue) => string | undefined;
|
15
|
-
export declare const useClearError: (context: InternalFormContextValue) => (field: string) => void;
|
16
|
-
export declare const useCurrentDefaultValueForField: (formId: InternalFormId, field: string) => any;
|
17
|
-
export declare const useFieldDefaultValue: (name: string, context: InternalFormContextValue) => any;
|
18
|
-
export declare const useInternalIsSubmitting: (formId: InternalFormId) => boolean;
|
19
|
-
export declare const useInternalIsValid: (formId: InternalFormId) => boolean;
|
20
|
-
export declare const useInternalHasBeenSubmitted: (formId: InternalFormId) => boolean;
|
21
|
-
export declare const useValidateField: (formId: InternalFormId) => (fieldName: string) => Promise<string | null>;
|
22
|
-
export declare const useValidate: (formId: InternalFormId) => () => Promise<import("..").ValidationResult<unknown>>;
|
23
|
-
export declare const useRegisterReceiveFocus: (formId: InternalFormId) => (fieldName: string, handler: () => void) => () => void;
|
24
|
-
export declare const useSyncedDefaultValues: (formId: InternalFormId) => {
|
25
|
-
[fieldName: string]: any;
|
26
|
-
};
|
27
|
-
export declare const useSetTouched: ({ formId }: InternalFormContextValue) => (field: string, touched: boolean) => void;
|
28
|
-
export declare const useTouchedFields: (formId: InternalFormId) => import("..").TouchedFields;
|
29
|
-
export declare const useFieldErrors: (formId: InternalFormId) => FieldErrors;
|
30
|
-
export declare const useSetFieldErrors: (formId: InternalFormId) => (errors: FieldErrors) => void;
|
31
|
-
export declare const useResetFormElement: (formId: InternalFormId) => () => void;
|
32
|
-
export declare const useSubmitForm: (formId: InternalFormId) => () => void;
|
33
|
-
export declare const useFormActionProp: (formId: InternalFormId) => string | undefined;
|
34
|
-
export declare const useFormSubactionProp: (formId: InternalFormId) => string | undefined;
|
35
|
-
export declare const useFormValues: (formId: InternalFormId) => () => FormData;
|
@@ -1,14 +0,0 @@
|
|
1
|
-
/**
|
2
|
-
* The purpose of this type is to simplify the logic
|
3
|
-
* around data that needs to come from the server initially,
|
4
|
-
* but from the internal state after hydration.
|
5
|
-
*/
|
6
|
-
export declare type Hydratable<T> = {
|
7
|
-
hydrateTo: (data: T) => T;
|
8
|
-
map: <U>(fn: (data: T) => U) => Hydratable<U>;
|
9
|
-
};
|
10
|
-
export declare const hydratable: {
|
11
|
-
serverData: <T>(data: T) => Hydratable<T>;
|
12
|
-
hydratedData: <T_1>() => Hydratable<T_1>;
|
13
|
-
from: <T_2>(data: T_2, hydrated: boolean) => Hydratable<T_2>;
|
14
|
-
};
|
@@ -1 +0,0 @@
|
|
1
|
-
export declare const getCheckboxChecked: (checkboxValue: string | undefined, newValue: unknown) => boolean | undefined;
|
@@ -1 +0,0 @@
|
|
1
|
-
export declare const getRadioChecked: (radioValue: string | undefined, newValue: unknown) => boolean | undefined;
|
@@ -1,5 +0,0 @@
|
|
1
|
-
/**
|
2
|
-
* Ponyfill of the HTMLFormElement.requestSubmit() method.
|
3
|
-
* Based on polyfill from: https://github.com/javan/form-request-submit-polyfill/blob/main/form-request-submit-polyfill.js
|
4
|
-
*/
|
5
|
-
export declare const requestSubmit: (element: HTMLFormElement, submitter?: HTMLElement) => void;
|
@@ -1,12 +0,0 @@
|
|
1
|
-
export declare const getArray: (values: any, field: string) => unknown[];
|
2
|
-
export declare const swap: (array: unknown[], indexA: number, indexB: number) => void;
|
3
|
-
export declare const move: (array: unknown[], from: number, to: number) => void;
|
4
|
-
export declare const insert: (array: unknown[], index: number, value: unknown) => void;
|
5
|
-
export declare const remove: (array: unknown[], index: number) => void;
|
6
|
-
export declare const replace: (array: unknown[], index: number, value: unknown) => void;
|
7
|
-
/**
|
8
|
-
* The purpose of this helper is to make it easier to update `fieldErrors` and `touchedFields`.
|
9
|
-
* We key those objects by full paths to the fields.
|
10
|
-
* When we're doing array mutations, that makes it difficult to update those objects.
|
11
|
-
*/
|
12
|
-
export declare const mutateAsArray: (field: string, obj: Record<string, any>, mutate: (arr: any[]) => void) => void;
|
@@ -1,7 +0,0 @@
|
|
1
|
-
import { InternalFormContextValue } from "../formContext";
|
2
|
-
import { InternalFormId } from "./types";
|
3
|
-
export declare const useControlledFieldValue: (context: InternalFormContextValue, field: string) => any;
|
4
|
-
export declare const useRegisterControlledField: (context: InternalFormContextValue, field: string) => void;
|
5
|
-
export declare const useControllableValue: (context: InternalFormContextValue, field: string) => readonly [any, (value: unknown) => void];
|
6
|
-
export declare const useUpdateControllableValue: (formId: InternalFormId) => (field: string, value: unknown) => void;
|
7
|
-
export declare const useAwaitValue: (formId: InternalFormId) => (field: string) => Promise<void>;
|
@@ -1,79 +0,0 @@
|
|
1
|
-
import { WritableDraft } from "immer/dist/internal";
|
2
|
-
import { FieldErrors, TouchedFields, ValidationResult, Validator } from "../../validation/types";
|
3
|
-
import { InternalFormId } from "./types";
|
4
|
-
export declare type SyncedFormProps = {
|
5
|
-
formId?: string;
|
6
|
-
action?: string;
|
7
|
-
subaction?: string;
|
8
|
-
defaultValues: {
|
9
|
-
[fieldName: string]: any;
|
10
|
-
};
|
11
|
-
registerReceiveFocus: (fieldName: string, handler: () => void) => () => void;
|
12
|
-
validator: Validator<unknown>;
|
13
|
-
};
|
14
|
-
export declare type FormStoreState = {
|
15
|
-
forms: {
|
16
|
-
[formId: InternalFormId]: FormState;
|
17
|
-
};
|
18
|
-
form: (formId: InternalFormId) => FormState;
|
19
|
-
registerForm: (formId: InternalFormId) => void;
|
20
|
-
cleanupForm: (formId: InternalFormId) => void;
|
21
|
-
};
|
22
|
-
export declare type FormState = {
|
23
|
-
isHydrated: boolean;
|
24
|
-
isSubmitting: boolean;
|
25
|
-
hasBeenSubmitted: boolean;
|
26
|
-
fieldErrors: FieldErrors;
|
27
|
-
touchedFields: TouchedFields;
|
28
|
-
formProps?: SyncedFormProps;
|
29
|
-
formElement: HTMLFormElement | null;
|
30
|
-
currentDefaultValues: Record<string, any>;
|
31
|
-
isValid: () => boolean;
|
32
|
-
startSubmit: () => void;
|
33
|
-
endSubmit: () => void;
|
34
|
-
setTouched: (field: string, touched: boolean) => void;
|
35
|
-
setFieldError: (field: string, error: string) => void;
|
36
|
-
setFieldErrors: (errors: FieldErrors) => void;
|
37
|
-
clearFieldError: (field: string) => void;
|
38
|
-
reset: () => void;
|
39
|
-
syncFormProps: (props: SyncedFormProps) => void;
|
40
|
-
setFormElement: (formElement: HTMLFormElement | null) => void;
|
41
|
-
validateField: (fieldName: string) => Promise<string | null>;
|
42
|
-
validate: () => Promise<ValidationResult<unknown>>;
|
43
|
-
resetFormElement: () => void;
|
44
|
-
submit: () => void;
|
45
|
-
getValues: () => FormData;
|
46
|
-
controlledFields: {
|
47
|
-
values: {
|
48
|
-
[fieldName: string]: any;
|
49
|
-
};
|
50
|
-
refCounts: {
|
51
|
-
[fieldName: string]: number;
|
52
|
-
};
|
53
|
-
valueUpdatePromises: {
|
54
|
-
[fieldName: string]: Promise<void>;
|
55
|
-
};
|
56
|
-
valueUpdateResolvers: {
|
57
|
-
[fieldName: string]: () => void;
|
58
|
-
};
|
59
|
-
register: (fieldName: string) => void;
|
60
|
-
unregister: (fieldName: string) => void;
|
61
|
-
setValue: (fieldName: string, value: unknown) => void;
|
62
|
-
kickoffValueUpdate: (fieldName: string) => void;
|
63
|
-
getValue: (fieldName: string) => unknown;
|
64
|
-
awaitValueUpdate: (fieldName: string) => Promise<void>;
|
65
|
-
array: {
|
66
|
-
push: (fieldName: string, value: unknown) => void;
|
67
|
-
swap: (fieldName: string, indexA: number, indexB: number) => void;
|
68
|
-
move: (fieldName: string, fromIndex: number, toIndex: number) => void;
|
69
|
-
insert: (fieldName: string, index: number, value: unknown) => void;
|
70
|
-
unshift: (fieldName: string, value: unknown) => void;
|
71
|
-
remove: (fieldName: string, index: number) => void;
|
72
|
-
pop: (fieldName: string) => void;
|
73
|
-
replace: (fieldName: string, index: number, value: unknown) => void;
|
74
|
-
};
|
75
|
-
};
|
76
|
-
};
|
77
|
-
export declare const useRootFormStore: import("zustand").UseBoundStore<Omit<import("zustand").StoreApi<FormStoreState>, "setState"> & {
|
78
|
-
setState(nextStateOrUpdater: FormStoreState | Partial<FormStoreState> | ((state: WritableDraft<FormStoreState>) => void), shouldReplace?: boolean | undefined): void;
|
79
|
-
}>;
|
@@ -1,28 +0,0 @@
|
|
1
|
-
import React from "react";
|
2
|
-
export declare type FieldArrayValidationBehavior = "onChange" | "onSubmit";
|
3
|
-
export declare type FieldArrayValidationBehaviorOptions = {
|
4
|
-
initial: FieldArrayValidationBehavior;
|
5
|
-
whenSubmitted: FieldArrayValidationBehavior;
|
6
|
-
};
|
7
|
-
export declare type FieldArrayHelpers<Item = any> = {
|
8
|
-
push: (item: Item) => void;
|
9
|
-
swap: (indexA: number, indexB: number) => void;
|
10
|
-
move: (from: number, to: number) => void;
|
11
|
-
insert: (index: number, value: Item) => void;
|
12
|
-
unshift: (value: Item) => void;
|
13
|
-
remove: (index: number) => void;
|
14
|
-
pop: () => void;
|
15
|
-
replace: (index: number, value: Item) => void;
|
16
|
-
};
|
17
|
-
export declare type UseFieldArrayOptions = {
|
18
|
-
formId?: string;
|
19
|
-
validationBehavior?: Partial<FieldArrayValidationBehaviorOptions>;
|
20
|
-
};
|
21
|
-
export declare function useFieldArray<Item = any>(name: string, { formId, validationBehavior }?: UseFieldArrayOptions): [itemDefaults: Item[], helpers: FieldArrayHelpers<any>, error: string | undefined];
|
22
|
-
export declare type FieldArrayProps = {
|
23
|
-
name: string;
|
24
|
-
children: (itemDefaults: any[], helpers: FieldArrayHelpers, error: string | undefined) => React.ReactNode;
|
25
|
-
formId?: string;
|
26
|
-
validationBehavior?: FieldArrayValidationBehaviorOptions;
|
27
|
-
};
|
28
|
-
export declare const FieldArray: ({ name, children, formId, validationBehavior, }: FieldArrayProps) => JSX.Element;
|
@@ -1 +0,0 @@
|
|
1
|
-
export declare type InternalFormId = string | symbol;
|
@@ -1 +0,0 @@
|
|
1
|
-
export declare function useSubmitComplete(isSubmitting: boolean, callback: () => void): void;
|
@@ -1,5 +0,0 @@
|
|
1
|
-
import type React from "react";
|
2
|
-
export declare const omit: (obj: any, ...keys: string[]) => any;
|
3
|
-
export declare const mergeRefs: <T = any>(refs: (React.MutableRefObject<T> | React.LegacyRef<T> | undefined)[]) => (instance: T | null) => void;
|
4
|
-
export declare const useIsomorphicLayoutEffect: typeof React.useEffect;
|
5
|
-
export declare const useDeepEqualsMemo: <T>(item: T) => T;
|
package/dist/types/server.d.ts
DELETED
@@ -1,21 +0,0 @@
|
|
1
|
-
import { FORM_DEFAULTS_FIELD } from "./internal/constants";
|
2
|
-
import { ValidatorError, ValidationErrorResponseData } from "./validation/types";
|
3
|
-
/**
|
4
|
-
* Takes the errors from a `Validator` and returns a `Response`.
|
5
|
-
* When you return this from your action, `ValidatedForm` on the frontend will automatically
|
6
|
-
* display the errors on the correct fields on the correct form.
|
7
|
-
*
|
8
|
-
* You can also provide a second argument to `validationError`
|
9
|
-
* to specify how to repopulate the form when JS is disabled.
|
10
|
-
*
|
11
|
-
* @example
|
12
|
-
* ```ts
|
13
|
-
* const result = validator.validate(await request.formData());
|
14
|
-
* if (result.error) return validationError(result.error, result.submittedData);
|
15
|
-
* ```
|
16
|
-
*/
|
17
|
-
export declare function validationError(error: ValidatorError, repopulateFields?: unknown, init?: ResponseInit): import("@remix-run/server-runtime").TypedResponse<ValidationErrorResponseData>;
|
18
|
-
export declare type FormDefaults = {
|
19
|
-
[formDefaultsKey: `${typeof FORM_DEFAULTS_FIELD}_${string}`]: any;
|
20
|
-
};
|
21
|
-
export declare const setFormDefaults: <DataType = any>(formId: string, defaultValues: Partial<DataType>) => FormDefaults;
|
@@ -1,64 +0,0 @@
|
|
1
|
-
import { FieldErrors, TouchedFields, ValidationResult } from "../validation/types";
|
2
|
-
export declare type FormState = {
|
3
|
-
fieldErrors: FieldErrors;
|
4
|
-
isSubmitting: boolean;
|
5
|
-
hasBeenSubmitted: boolean;
|
6
|
-
touchedFields: TouchedFields;
|
7
|
-
defaultValues: {
|
8
|
-
[fieldName: string]: any;
|
9
|
-
};
|
10
|
-
action?: string;
|
11
|
-
subaction?: string;
|
12
|
-
isValid: boolean;
|
13
|
-
};
|
14
|
-
/**
|
15
|
-
* Returns information about the form.
|
16
|
-
*
|
17
|
-
* @param formId the id of the form. Only necessary if being used outside a ValidatedForm.
|
18
|
-
*/
|
19
|
-
export declare const useFormState: (formId?: string) => FormState;
|
20
|
-
export declare type FormHelpers = {
|
21
|
-
/**
|
22
|
-
* Clear the error of the specified field.
|
23
|
-
*/
|
24
|
-
clearError: (fieldName: string) => void;
|
25
|
-
/**
|
26
|
-
* Validate the specified field.
|
27
|
-
*/
|
28
|
-
validateField: (fieldName: string) => Promise<string | null>;
|
29
|
-
/**
|
30
|
-
* Change the touched state of the specified field.
|
31
|
-
*/
|
32
|
-
setTouched: (fieldName: string, touched: boolean) => void;
|
33
|
-
/**
|
34
|
-
* Validate the whole form and populate any errors.
|
35
|
-
*/
|
36
|
-
validate: () => Promise<ValidationResult<unknown>>;
|
37
|
-
/**
|
38
|
-
* Clears all errors on the form.
|
39
|
-
*/
|
40
|
-
clearAllErrors: () => void;
|
41
|
-
/**
|
42
|
-
* Resets the form.
|
43
|
-
*
|
44
|
-
* _Note_: The equivalent behavior can be achieved by calling formElement.reset()
|
45
|
-
* or clicking a button element with `type="reset"`.
|
46
|
-
*/
|
47
|
-
reset: () => void;
|
48
|
-
/**
|
49
|
-
* Submits the form, running all validations first.
|
50
|
-
*
|
51
|
-
* _Note_: This is equivalent to clicking a button element with `type="submit"` or calling formElement.submit().
|
52
|
-
*/
|
53
|
-
submit: () => void;
|
54
|
-
/**
|
55
|
-
* Returns the current form values as FormData
|
56
|
-
*/
|
57
|
-
getValues: () => FormData;
|
58
|
-
};
|
59
|
-
/**
|
60
|
-
* Returns helpers that can be used to update the form state.
|
61
|
-
*
|
62
|
-
* @param formId the id of the form. Only necessary if being used outside a ValidatedForm.
|
63
|
-
*/
|
64
|
-
export declare const useFormHelpers: (formId?: string) => FormHelpers;
|
@@ -1,85 +0,0 @@
|
|
1
|
-
import { FieldErrors, TouchedFields, ValidationResult } from "./validation/types";
|
2
|
-
export declare type FormContextValue = {
|
3
|
-
/**
|
4
|
-
* All the errors in all the fields in the form.
|
5
|
-
*/
|
6
|
-
fieldErrors: FieldErrors;
|
7
|
-
/**
|
8
|
-
* Clear the errors of the specified fields.
|
9
|
-
*/
|
10
|
-
clearError: (...names: string[]) => void;
|
11
|
-
/**
|
12
|
-
* Validate the specified field.
|
13
|
-
*/
|
14
|
-
validateField: (fieldName: string) => Promise<string | null>;
|
15
|
-
/**
|
16
|
-
* The `action` prop of the form.
|
17
|
-
*/
|
18
|
-
action?: string;
|
19
|
-
/**
|
20
|
-
* The `subaction` prop of the form.
|
21
|
-
*/
|
22
|
-
subaction?: string;
|
23
|
-
/**
|
24
|
-
* Whether or not the form is submitting.
|
25
|
-
*/
|
26
|
-
isSubmitting: boolean;
|
27
|
-
/**
|
28
|
-
* Whether or not a submission has been attempted.
|
29
|
-
* This is true once the form has been submitted, even if there were validation errors.
|
30
|
-
* Resets to false when the form is reset.
|
31
|
-
*/
|
32
|
-
hasBeenSubmitted: boolean;
|
33
|
-
/**
|
34
|
-
* Whether or not the form is valid.
|
35
|
-
*/
|
36
|
-
isValid: boolean;
|
37
|
-
/**
|
38
|
-
* The default values of the form.
|
39
|
-
*/
|
40
|
-
defaultValues?: {
|
41
|
-
[fieldName: string]: any;
|
42
|
-
};
|
43
|
-
/**
|
44
|
-
* Register a custom focus handler to be used when
|
45
|
-
* the field needs to receive focus due to a validation error.
|
46
|
-
*/
|
47
|
-
registerReceiveFocus: (fieldName: string, handler: () => void) => () => void;
|
48
|
-
/**
|
49
|
-
* Any fields that have been touched by the user.
|
50
|
-
*/
|
51
|
-
touchedFields: TouchedFields;
|
52
|
-
/**
|
53
|
-
* Change the touched state of the specified field.
|
54
|
-
*/
|
55
|
-
setFieldTouched: (fieldName: string, touched: boolean) => void;
|
56
|
-
/**
|
57
|
-
* Validate the whole form and populate any errors.
|
58
|
-
*/
|
59
|
-
validate: () => Promise<ValidationResult<unknown>>;
|
60
|
-
/**
|
61
|
-
* Clears all errors on the form.
|
62
|
-
*/
|
63
|
-
clearAllErrors: () => void;
|
64
|
-
/**
|
65
|
-
* Resets the form.
|
66
|
-
*
|
67
|
-
* _Note_: The equivalent behavior can be achieved by calling formElement.reset()
|
68
|
-
* or clicking a button element with `type="reset"`.
|
69
|
-
*/
|
70
|
-
reset: () => void;
|
71
|
-
/**
|
72
|
-
* Submits the form, running all validations first.
|
73
|
-
*
|
74
|
-
* _Note_: This is equivalent to clicking a button element with `type="submit"` or calling formElement.submit().
|
75
|
-
*/
|
76
|
-
submit: () => void;
|
77
|
-
/**
|
78
|
-
* Returns the current form values as FormData
|
79
|
-
*/
|
80
|
-
getValues: () => FormData;
|
81
|
-
};
|
82
|
-
/**
|
83
|
-
* Provides access to some of the internal state of the form.
|
84
|
-
*/
|
85
|
-
export declare const useFormContext: (formId?: string) => FormContextValue;
|
@@ -1,7 +0,0 @@
|
|
1
|
-
import { CreateValidatorArg, Validator } from "..";
|
2
|
-
/**
|
3
|
-
* Used to create a validator for a form.
|
4
|
-
* It provides built-in handling for unflattening nested objects and
|
5
|
-
* extracting the values from FormData.
|
6
|
-
*/
|
7
|
-
export declare function createValidator<T>(validator: CreateValidatorArg<T>): Validator<T>;
|
@@ -1,58 +0,0 @@
|
|
1
|
-
export declare type FieldErrors = Record<string, string>;
|
2
|
-
export declare type TouchedFields = Record<string, boolean>;
|
3
|
-
export declare type GenericObject = {
|
4
|
-
[key: string]: any;
|
5
|
-
};
|
6
|
-
export declare type ValidatorError = {
|
7
|
-
subaction?: string;
|
8
|
-
formId?: string;
|
9
|
-
fieldErrors: FieldErrors;
|
10
|
-
};
|
11
|
-
export declare type ValidationErrorResponseData = {
|
12
|
-
subaction?: string;
|
13
|
-
formId?: string;
|
14
|
-
fieldErrors: FieldErrors;
|
15
|
-
repopulateFields?: unknown;
|
16
|
-
};
|
17
|
-
export declare type BaseResult = {
|
18
|
-
submittedData: GenericObject;
|
19
|
-
formId?: string;
|
20
|
-
};
|
21
|
-
export declare type ErrorResult = BaseResult & {
|
22
|
-
error: ValidatorError;
|
23
|
-
data: undefined;
|
24
|
-
};
|
25
|
-
export declare type SuccessResult<DataType> = BaseResult & {
|
26
|
-
data: DataType;
|
27
|
-
error: undefined;
|
28
|
-
};
|
29
|
-
/**
|
30
|
-
* The result when validating a form.
|
31
|
-
*/
|
32
|
-
export declare type ValidationResult<DataType> = SuccessResult<DataType> | ErrorResult;
|
33
|
-
/**
|
34
|
-
* The result when validating an individual field in a form.
|
35
|
-
*/
|
36
|
-
export declare type ValidateFieldResult = {
|
37
|
-
error?: string;
|
38
|
-
};
|
39
|
-
/**
|
40
|
-
* A `Validator` can be passed to the `validator` prop of a `ValidatedForm`.
|
41
|
-
*/
|
42
|
-
export declare type Validator<DataType> = {
|
43
|
-
validate: (unvalidatedData: GenericObject) => Promise<ValidationResult<DataType>>;
|
44
|
-
validateField: (unvalidatedData: GenericObject, field: string) => Promise<ValidateFieldResult>;
|
45
|
-
};
|
46
|
-
export declare type Valid<DataType> = {
|
47
|
-
data: DataType;
|
48
|
-
error: undefined;
|
49
|
-
};
|
50
|
-
export declare type Invalid = {
|
51
|
-
error: FieldErrors;
|
52
|
-
data: undefined;
|
53
|
-
};
|
54
|
-
export declare type CreateValidatorArg<DataType> = {
|
55
|
-
validate: (unvalidatedData: GenericObject) => Promise<Valid<DataType> | Invalid>;
|
56
|
-
validateField: (unvalidatedData: GenericObject, field: string) => Promise<ValidateFieldResult>;
|
57
|
-
};
|
58
|
-
export declare type ValidatorData<T extends Validator<any>> = T extends Validator<infer U> ? U : never;
|