vee-validate
Version:
Painless forms for Vue.js
1,367 lines (1,350 loc) • 56.1 kB
TypeScript
import * as vue from 'vue';
import { MaybeRef, Ref, MaybeRefOrGetter, ComputedRef, PropType, VNode, UnwrapRef, InjectionKey } from 'vue';
import { PartialDeep } from 'type-fest';
type BrowserNativeObject = Date | FileList | File;
type Primitive = null | undefined | string | number | boolean | symbol | bigint;
/**
* Checks whether the type is any
* See {@link https://stackoverflow.com/a/49928360/3406963}
* @typeParam T - type which may be any
* ```
* IsAny<any> = true
* IsAny<string> = false
* ```
*/
type IsAny<T> = 0 extends 1 & T ? true : false;
/**
* Checks whether T1 can be exactly (mutually) assigned to T2
* @typeParam T1 - type to check
* @typeParam T2 - type to check against
* ```
* IsEqual<string, string> = true
* IsEqual<'foo', 'foo'> = true
* IsEqual<string, number> = false
* IsEqual<string, number> = false
* IsEqual<string, 'foo'> = false
* IsEqual<'foo', string> = false
* IsEqual<'foo' | 'bar', 'foo'> = boolean // 'foo' is assignable, but 'bar' is not (true | false) -> boolean
* ```
*/
type IsEqual<T1, T2> = T1 extends T2 ? (<G>() => G extends T1 ? 1 : 2) extends <G>() => G extends T2 ? 1 : 2 ? true : false : false;
/**
* Type to query whether an array type T is a tuple type.
* @typeParam T - type which may be an array or tuple
* @example
* ```
* IsTuple<[number]> = true
* IsTuple<number[]> = false
* ```
*/
type IsTuple<T extends ReadonlyArray<any>> = number extends T['length'] ? false : true;
/**
* Type which can be used to index an array or tuple type.
*/
type ArrayKey = number;
/**
* Helper function to break apart T1 and check if any are equal to T2
*
* See {@link IsEqual}
*/
type AnyIsEqual<T1, T2> = T1 extends T2 ? (IsEqual<T1, T2> extends true ? true : never) : never;
/**
* Type which given a tuple type returns its own keys, i.e. only its indices.
* @typeParam T - tuple type
* @example
* ```
* TupleKeys<[number, string]> = '0' | '1'
* ```
*/
type TupleKeys<T extends ReadonlyArray<any>> = Exclude<keyof T, keyof any[]>;
/**
* Helper type to construct tuple key paths and recurse into its elements.
*
* See {@link Path}
*/
type PathInternalTuple<TValue extends ReadonlyArray<any>, TraversedTypes> = {
[Key in TupleKeys<TValue> & string]: `[${Key}]` | `[${Key}]${PathInternal<TValue[Key], TraversedTypes, false>}`;
}[TupleKeys<TValue> & string];
/**
* Helper type to construct array key paths and recurse into its elements.
*
* See {@link Path}
*/
type PathInternalArray<TValue extends ReadonlyArray<any>, TraversedTypes> = `[${ArrayKey}]` | `[${ArrayKey}]${PathInternal<TValue[ArrayKey], TraversedTypes, false>}`;
/**
* Helper type to construct object key paths and recurse into its nested values.
*
* See {@link Path}
*/
type PathInternalObject<TValue, TraversedTypes, First extends boolean> = {
[Key in keyof TValue & string]: First extends true ? `${Key}` | `${Key}${PathInternal<TValue[Key], TraversedTypes, false>}` : `.${Key}` | `.${Key}${PathInternal<TValue[Key], TraversedTypes, false>}`;
}[keyof TValue & string];
/**
* Helper type to construct nested any object key paths.
*
* See {@link Path}
*/
type PathInternalAny = `.${string}` | `[${string}]` | `[${string}].${string}`;
/**
* Helper type for recursively constructing paths through a type.
*
* This obscures internal type params TraversedTypes and First from ed contract.
*
* See {@link Path}
*/
type PathInternal<TValue, TraversedTypes, First extends boolean> = TValue extends Primitive | BrowserNativeObject ? IsAny<TValue> extends true ? PathInternalAny : never : TValue extends ReadonlyArray<any> ? true extends AnyIsEqual<TraversedTypes, TValue> ? never : IsTuple<TValue> extends true ? PathInternalTuple<TValue, TraversedTypes | TValue> : PathInternalArray<TValue, TraversedTypes | TValue> : TValue extends Record<string, any> ? PathInternalObject<TValue, TraversedTypes | TValue, First> : '';
/**
* Helper type for recursively constructing paths through a type.
* This actually constructs the strings and recurses into nested
* object types.
*
* See {@link ArrayPath}
*/
type ArrayPathImpl<K extends string | number, V, TraversedTypes> = V extends Primitive | BrowserNativeObject ? IsAny<V> extends true ? string : never : V extends ReadonlyArray<infer U> ? U extends Primitive | BrowserNativeObject ? IsAny<V> extends true ? string : never : true extends AnyIsEqual<TraversedTypes, V> ? never : `${K}` | `${K}.${ArrayPathInternal<V, TraversedTypes | V>}` : true extends AnyIsEqual<TraversedTypes, V> ? never : `${K}.${ArrayPathInternal<V, TraversedTypes | V>}`;
/**
* Helper type for recursively constructing paths through a type.
* This obscures the internal type param TraversedTypes from ed contract.
*
* See {@link ArrayPath}
*/
type ArrayPathInternal<T, TraversedTypes = T> = T extends ReadonlyArray<infer V> ? IsTuple<T> extends true ? {
[K in TupleKeys<T>]-?: ArrayPathImpl<K & string, T[K], TraversedTypes>;
}[TupleKeys<T>] : ArrayPathImpl<ArrayKey, V, TraversedTypes> : {
[K in keyof T]-?: ArrayPathImpl<K & string, T[K], TraversedTypes>;
}[keyof T];
/**
* Type which eagerly collects all paths through a type which point to an array
* type.
* @typeParam T - type which should be introspected.
* @example
* ```
* Path<{foo: {bar: string[], baz: number[]}}> = 'foo.bar' | 'foo.baz'
* ```
*/
type ArrayPath<T> = T extends any ? ArrayPathInternal<T> : never;
/**
* Type to evaluate the type which the given path points to.
* @typeParam T - deeply nested type which is indexed by the path
* @typeParam P - path into the deeply nested type
* @example
* ```
* PathValue<{foo: {bar: string}}, 'foo.bar'> = string
* PathValue<[number, string], '1'> = string
* ```
*/
type PathValue<T, P extends Path<T> | ArrayPath<T>> = T extends any ? P extends `${infer K}.${infer R}` ? K extends keyof T ? R extends Path<T[K]> ? PathValue<T[K], R> : never : K extends `${ArrayKey}` ? T extends ReadonlyArray<infer V> ? PathValue<V, R & Path<V>> : never : never : P extends keyof T ? T[P] : P extends `${ArrayKey}` ? T extends ReadonlyArray<infer V> ? V : never : never : never;
/**
* Type which eagerly collects all paths through a type
* @typeParam T - type which should be introspected
* @example
* ```
* Path<{foo: {bar: string}}> = 'foo' | 'foo.bar'
* ```
*/
type Path<T> = T extends any ? PathInternal<T, T, true> & string : never;
type GenericObject = Record<string, any>;
type MaybeArray<T> = T | T[];
type MaybePromise<T> = T | Promise<T>;
type FlattenAndSetPathsType<TRecord, TType> = {
[K in Path<TRecord>]: TType;
};
type MapValuesPathsToRefs<TValues extends GenericObject, TPaths extends readonly [...MaybeRef<Path<TValues>>[]]> = {
readonly [K in keyof TPaths]: TPaths[K] extends MaybeRef<infer TKey> ? TKey extends Path<TValues> ? Ref<PathValue<TValues, TKey>> : Ref<unknown> : Ref<unknown>;
};
interface FieldValidationMetaInfo {
field: string;
name: string;
label?: string;
value: unknown;
form: Record<string, unknown>;
rule?: {
name: string;
params?: Record<string, unknown> | unknown[];
};
}
type ValidationRuleFunction<TValue = unknown, TParams = unknown[] | Record<string, unknown>> = (value: TValue, params: TParams, ctx: FieldValidationMetaInfo) => boolean | string | Promise<boolean | string>;
type SimpleValidationRuleFunction<TValue = unknown, TParams = unknown[] | Record<string, unknown>> = (value: TValue, params: TParams) => boolean | string | Promise<boolean | string>;
type ValidationMessageGenerator = (ctx: FieldValidationMetaInfo) => string;
interface ValidationResult<TValue = unknown> {
errors: string[];
valid: boolean;
value?: TValue;
}
type FlattenAndMapPathsValidationResult<TInput extends GenericObject, TOutput extends GenericObject> = {
[K in Path<TInput>]: ValidationResult<TOutput[K]>;
};
interface TypedSchemaError {
path?: string;
errors: string[];
}
interface TypedSchemaPathDescription {
required: boolean;
exists: boolean;
}
interface TypedSchemaContext {
formData: GenericObject;
}
interface TypedSchema<TInput = any, TOutput = TInput> {
__type: 'VVTypedSchema';
parse(values: TInput, context?: TypedSchemaContext): Promise<{
value?: TOutput;
errors: TypedSchemaError[];
}>;
cast?(values: Partial<TInput>): TInput;
describe?(path?: Path<TInput>): Partial<TypedSchemaPathDescription>;
}
type InferOutput<TSchema extends TypedSchema> = TSchema extends TypedSchema<any, infer TOutput> ? TOutput : never;
type InferInput<TSchema extends TypedSchema> = TSchema extends TypedSchema<infer TInput, any> ? TInput : never;
type YupSchema<TValues = any> = {
__isYupSchema__: boolean;
validate(value: any, options: GenericObject): Promise<any>;
};
type Locator = {
__locatorRef: string;
} & ((values: GenericObject) => unknown);
interface FieldMeta<TValue> {
touched: boolean;
dirty: boolean;
valid: boolean;
validated: boolean;
required: boolean;
pending: boolean;
initialValue?: TValue;
}
interface FormMeta<TValues extends GenericObject> {
touched: boolean;
dirty: boolean;
valid: boolean;
pending: boolean;
initialValues?: Partial<TValues>;
}
interface FieldState<TValue = unknown> {
value: TValue;
touched: boolean;
errors: string[];
}
type InputType = 'checkbox' | 'radio' | 'default';
/**
* validated-only: only mutate the previously validated fields
* silent: do not mutate any field
* force: validate all fields and mutate their state
*/
type SchemaValidationMode = 'validated-only' | 'silent' | 'force';
interface ValidationOptions$1 {
mode: SchemaValidationMode;
warn: boolean;
}
type FieldValidator<TOutput> = (opts?: Partial<ValidationOptions$1>) => Promise<ValidationResult<TOutput>>;
interface PathStateConfig<TOutput> {
bails: boolean;
label: MaybeRefOrGetter<string | undefined>;
type: InputType;
validate: FieldValidator<TOutput>;
schema?: MaybeRefOrGetter<TypedSchema | undefined>;
}
interface PathState<TInput = unknown, TOutput = TInput> {
id: number | number[];
path: string;
touched: boolean;
dirty: boolean;
valid: boolean;
required: boolean;
validated: boolean;
pending: boolean;
initialValue: TInput | undefined;
value: TInput | undefined;
errors: string[];
bails: boolean;
label: string | undefined;
type: InputType;
multiple: boolean;
fieldsCount: number;
__flags: {
pendingUnmount: Record<string, boolean>;
pendingReset: boolean;
};
validate?: FieldValidator<TOutput>;
}
interface FieldEntry<TValue = unknown> {
value: TValue;
key: string | number;
isFirst: boolean;
isLast: boolean;
}
interface FieldArrayContext<TValue = unknown> {
fields: Ref<FieldEntry<TValue>[]>;
remove(idx: number): void;
replace(newArray: TValue[]): void;
update(idx: number, value: TValue): void;
push(value: TValue): void;
swap(indexA: number, indexB: number): void;
insert(idx: number, value: TValue): void;
prepend(value: TValue): void;
move(oldIdx: number, newIdx: number): void;
}
interface PrivateFieldArrayContext<TValue = unknown> extends FieldArrayContext<TValue> {
reset(): void;
path: MaybeRefOrGetter<string>;
}
interface PrivateFieldContext<TInput = unknown, TOutput = TInput> {
id: number;
name: MaybeRef<string>;
value: Ref<TInput>;
meta: FieldMeta<TInput>;
errors: Ref<string[]>;
errorMessage: Ref<string | undefined>;
label?: MaybeRefOrGetter<string | undefined>;
type?: string;
bails?: boolean;
keepValueOnUnmount?: MaybeRefOrGetter<boolean | undefined>;
checkedValue?: MaybeRefOrGetter<TInput>;
uncheckedValue?: MaybeRefOrGetter<TInput>;
checked?: Ref<boolean>;
resetField(state?: Partial<FieldState<TInput>>): void;
handleReset(): void;
validate: FieldValidator<TOutput>;
handleChange(e: Event | unknown, shouldValidate?: boolean): void;
handleBlur(e?: Event, shouldValidate?: boolean): void;
setState(state: Partial<FieldState<TInput>>): void;
setTouched(isTouched: boolean): void;
setErrors(message: string | string[]): void;
setValue(value: TInput, shouldValidate?: boolean): void;
}
type FieldContext<TValue = unknown> = Omit<PrivateFieldContext<TValue>, 'id' | 'instances'>;
type GenericValidateFunction<TValue = unknown> = (value: TValue, ctx: FieldValidationMetaInfo) => MaybePromise<boolean | MaybeArray<string>>;
interface FormState<TValues> {
values: PartialDeep<TValues>;
errors: Partial<Record<Path<TValues>, string | undefined>>;
touched: Partial<Record<Path<TValues>, boolean>>;
submitCount: number;
}
type FormErrors<TValues extends GenericObject> = Partial<Record<Path<TValues> | '', string | undefined>>;
type FormErrorBag<TValues extends GenericObject> = Partial<Record<Path<TValues> | '', string[]>>;
interface ResetFormOpts {
force: boolean;
}
interface FormActions<TValues extends GenericObject, TOutput = TValues> {
setFieldValue<T extends Path<TValues>>(field: T, value: PathValue<TValues, T>, shouldValidate?: boolean): void;
setFieldError(field: Path<TValues>, message: string | string[] | undefined): void;
setErrors(fields: Partial<FlattenAndSetPathsType<TValues, string | string[] | undefined>>): void;
setValues(fields: PartialDeep<TValues>, shouldValidate?: boolean): void;
setFieldTouched(field: Path<TValues>, isTouched: boolean): void;
setTouched(fields: Partial<Record<Path<TValues>, boolean>> | boolean): void;
resetForm(state?: Partial<FormState<TValues>>, opts?: Partial<ResetFormOpts>): void;
resetField(field: Path<TValues>, state?: Partial<FieldState>): void;
}
interface FormValidationResult<TInput extends GenericObject, TOutput extends GenericObject = TInput> {
valid: boolean;
results: Partial<FlattenAndMapPathsValidationResult<TInput, TOutput>>;
errors: Partial<Record<Path<TInput>, string>>;
values?: Partial<TOutput>;
source: 'schema' | 'fields' | 'none';
}
interface SubmissionContext<TInput extends GenericObject = GenericObject> extends FormActions<TInput> {
evt?: Event;
controlledValues: Partial<TInput>;
}
type SubmissionHandler<TInput extends GenericObject = GenericObject, TOutput = TInput, TReturn = unknown> = (values: TOutput, ctx: SubmissionContext<TInput>) => TReturn;
interface InvalidSubmissionContext<TInput extends GenericObject = GenericObject, TOutput extends GenericObject = TInput> {
values: TInput;
evt?: Event;
errors: Partial<Record<Path<TInput>, string>>;
results: FormValidationResult<TInput, TOutput>['results'];
}
type InvalidSubmissionHandler<TInput extends GenericObject = GenericObject, TOutput extends GenericObject = TInput> = (ctx: InvalidSubmissionContext<TInput, TOutput>) => void;
type RawFormSchema<TValues> = Record<Path<TValues>, string | GenericValidateFunction | GenericObject>;
type FieldPathLookup<TValues extends GenericObject = GenericObject> = Partial<Record<Path<TValues>, PrivateFieldContext | PrivateFieldContext[]>>;
type HandleSubmitFactory<TValues extends GenericObject, TOutput extends GenericObject = TValues> = <TReturn = unknown>(cb: SubmissionHandler<TValues, TOutput, TReturn>, onSubmitValidationErrorCb?: InvalidSubmissionHandler<TValues, TOutput>) => (e?: Event) => Promise<TReturn | undefined>;
type PublicPathState<TValue = unknown> = Omit<PathState<TValue>, 'bails' | 'label' | 'multiple' | 'fieldsCount' | 'validate' | 'id' | 'type' | '__flags'>;
interface BaseFieldProps {
onBlur: () => void;
onChange: () => void;
onInput: () => void;
}
interface InputBindsConfig<TValue = unknown, TExtraProps extends GenericObject = GenericObject> {
props: (state: PublicPathState<TValue>) => TExtraProps;
validateOnBlur: boolean;
label: MaybeRefOrGetter<string>;
validateOnChange: boolean;
validateOnInput: boolean;
validateOnModelUpdate: boolean;
}
type LazyInputBindsConfig<TValue = unknown, TExtraProps extends GenericObject = GenericObject> = (state: PublicPathState<TValue>) => Partial<{
props: TExtraProps;
validateOnBlur: boolean;
validateOnChange: boolean;
validateOnInput: boolean;
validateOnModelUpdate: boolean;
}>;
interface ComponentBindsConfig<TValue = unknown, TExtraProps extends GenericObject = GenericObject, TModel extends string = 'modelValue'> {
mapProps: (state: PublicPathState<TValue>) => TExtraProps;
validateOnBlur: boolean;
validateOnModelUpdate: boolean;
model: TModel;
}
type LazyComponentBindsConfig<TValue = unknown, TExtraProps extends GenericObject = GenericObject, TModel extends string = 'modelValue'> = (state: PublicPathState<TValue>) => Partial<{
props: TExtraProps;
validateOnBlur: boolean;
validateOnModelUpdate: boolean;
model: TModel;
}>;
interface ComponentModellessBinds {
onBlur: () => void;
}
type ComponentModelBinds<TValue = any, TModel extends string = 'modelValue'> = ComponentModellessBinds & {
[TKey in `onUpdate:${TModel}`]: (value: TValue) => void;
};
type BaseComponentBinds<TValue = any, TModel extends string = 'modelValue'> = ComponentModelBinds<TValue, TModel> & {
[k in TModel]: TValue;
};
interface BaseInputBinds<TValue = unknown> {
value: TValue | undefined;
onBlur: (e: Event) => void;
onChange: (e: Event) => void;
onInput: (e: Event) => void;
}
interface PrivateFormContext<TValues extends GenericObject = GenericObject, TOutput extends GenericObject = TValues> extends FormActions<TValues> {
name: string;
formId: number;
values: TValues;
initialValues: Ref<Partial<TValues>>;
controlledValues: Ref<TValues>;
fieldArrays: PrivateFieldArrayContext[];
submitCount: Ref<number>;
schema?: MaybeRef<RawFormSchema<TValues> | TypedSchema<TValues, TOutput> | YupSchema<TValues> | undefined>;
errorBag: Ref<FormErrorBag<TValues>>;
errors: ComputedRef<FormErrors<TValues>>;
meta: ComputedRef<FormMeta<TValues>>;
isSubmitting: Ref<boolean>;
isValidating: Ref<boolean>;
keepValuesOnUnmount: MaybeRef<boolean>;
validateSchema?: (mode: SchemaValidationMode) => Promise<FormValidationResult<TValues, TOutput>>;
validate(opts?: Partial<ValidationOptions$1>): Promise<FormValidationResult<TValues, TOutput>>;
validateField<TPath extends Path<TValues>>(field: TPath, opts?: Partial<ValidationOptions$1>): Promise<ValidationResult<TOutput[TPath]>>;
stageInitialValue(path: string, value: unknown, updateOriginal?: boolean): void;
unsetInitialValue(path: string): void;
handleSubmit: HandleSubmitFactory<TValues, TOutput> & {
withControlled: HandleSubmitFactory<TValues, TOutput>;
};
setFieldInitialValue(path: string, value: unknown, updateOriginal?: boolean): void;
createPathState<TPath extends Path<TValues>>(path: MaybeRef<TPath>, config?: Partial<PathStateConfig<TOutput[TPath]>>): PathState<PathValue<TValues, TPath>>;
getPathState<TPath extends Path<TValues>>(path: TPath): PathState<PathValue<TValues, TPath>> | undefined;
getAllPathStates(): PathState[];
removePathState<TPath extends Path<TValues>>(path: TPath, id: number): void;
unsetPathValue<TPath extends Path<TValues>>(path: TPath): void;
destroyPath(path: string): void;
isFieldTouched<TPath extends Path<TValues>>(path: TPath): boolean;
isFieldDirty<TPath extends Path<TValues>>(path: TPath): boolean;
isFieldValid<TPath extends Path<TValues>>(path: TPath): boolean;
defineField<TPath extends Path<TValues>, TValue = PathValue<TValues, TPath>, TExtras extends GenericObject = GenericObject>(path: MaybeRefOrGetter<TPath>, config?: Partial<InputBindsConfig<TValue, TExtras>> | LazyInputBindsConfig<TValue, TExtras>): [Ref<TValue>, Ref<BaseFieldProps & TExtras>];
/**
* @deprecated use defineField instead
*/
useFieldModel<TPath extends Path<TValues>>(path: TPath): Ref<PathValue<TValues, TPath>>;
/**
* @deprecated use defineField instead
*/
useFieldModel<TPaths extends readonly [...MaybeRef<Path<TValues>>[]]>(paths: TPaths): MapValuesPathsToRefs<TValues, TPaths>;
/**
* @deprecated use defineField instead
*/
defineComponentBinds<TPath extends Path<TValues>, TValue = PathValue<TValues, TPath>, TModel extends string = 'modelValue', TExtras extends GenericObject = GenericObject>(path: MaybeRefOrGetter<TPath>, config?: Partial<ComponentBindsConfig<TValue, TExtras, TModel>> | LazyComponentBindsConfig<TValue, TExtras, TModel>): Ref<BaseComponentBinds<TValue, TModel> & TExtras>;
/**
* @deprecated use defineField instead
*/
defineInputBinds<TPath extends Path<TValues>, TValue = PathValue<TValues, TPath>, TExtras extends GenericObject = GenericObject>(path: MaybeRefOrGetter<TPath>, config?: Partial<InputBindsConfig<TValue, TExtras>> | LazyInputBindsConfig<TValue, TExtras>): Ref<BaseInputBinds<TValue> & TExtras>;
}
interface FormContext<TValues extends GenericObject = GenericObject, TOutput extends GenericObject = TValues> extends Omit<PrivateFormContext<TValues, TOutput>, 'formId' | 'schema' | 'initialValues' | 'getPathState' | 'getAllPathStates' | 'removePathState' | 'unsetPathValue' | 'validateSchema' | 'stageInitialValue' | 'setFieldInitialValue' | 'unsetInitialValue' | 'fieldArrays' | 'markForUnmount' | 'keepValuesOnUnmount' | 'values'> {
values: TValues;
handleReset: () => void;
submitForm: (e?: unknown) => Promise<void>;
}
interface DevtoolsPluginFieldState {
name: string;
value: any;
initialValue: any;
errors: string[];
meta: FieldMeta<any>;
}
interface DevtoolsPluginFormState {
meta: FormMeta<Record<string, any>>;
errors: FormErrors<Record<string, any>>;
values: Record<string, any>;
isSubmitting: boolean;
isValidating: boolean;
submitCount: number;
}
interface ValidationOptions {
name?: string;
label?: string;
values?: Record<string, unknown>;
bails?: boolean;
}
/**
* Validates a value against the rules.
*/
declare function validate<TInput, TOutput>(value: TInput, rules: string | Record<string, unknown | unknown[]> | GenericValidateFunction<TInput> | GenericValidateFunction<TInput>[] | TypedSchema<TInput, TOutput>, options?: ValidationOptions): Promise<ValidationResult<TOutput>>;
declare function validateObjectSchema<TValues extends GenericObject, TOutput extends GenericObject>(schema: RawFormSchema<TValues>, values: TValues | undefined, opts?: Partial<{
names: Record<string, {
name: string;
label: string;
}>;
bailsMap: Record<string, boolean>;
}>): Promise<FormValidationResult<TValues, TOutput>>;
/**
* Adds a custom validator to the list of validation rules.
*/
declare function defineRule<TValue = unknown, TParams = any[] | Record<string, any>>(id: string, validator: ValidationRuleFunction<TValue, TParams> | SimpleValidationRuleFunction<TValue, TParams>): void;
interface VeeValidateConfig {
bails: boolean;
generateMessage: ValidationMessageGenerator;
validateOnInput: boolean;
validateOnChange: boolean;
validateOnBlur: boolean;
validateOnModelUpdate: boolean;
}
declare const configure: (newConf: Partial<VeeValidateConfig>) => void;
/**
* Checks if the path opted out of nested fields using `[fieldName]` syntax
*/
declare function isNotNestedPath(path: string): boolean;
declare function cleanupNonNestedPath(path: string): string;
/**
* Normalizes the given rules expression.
*/
declare function normalizeRules(rules: undefined | string | Record<string, unknown | unknown[] | Record<string, unknown>>): Record<string, unknown[] | Record<string, unknown>>;
interface FieldOptions<TValue = unknown> {
initialValue?: MaybeRef<TValue>;
validateOnValueUpdate: boolean;
validateOnMount?: boolean;
bails?: boolean;
type?: InputType;
/**
* @deprecated Use `checkedValue` instead.
*/
valueProp?: MaybeRefOrGetter<TValue>;
checkedValue?: MaybeRefOrGetter<TValue>;
uncheckedValue?: MaybeRefOrGetter<TValue>;
label?: MaybeRefOrGetter<string | undefined>;
controlled?: boolean;
/**
* @deprecated Use `controlled` instead, controlled is opposite of standalone.
*/
standalone?: boolean;
keepValueOnUnmount?: MaybeRefOrGetter<boolean | undefined>;
/**
* @deprecated Pass the model prop name to `syncVModel` instead.
*/
modelPropName?: string;
syncVModel?: boolean | string;
form?: FormContext;
}
type RuleExpression<TValue> = string | Record<string, unknown> | GenericValidateFunction<TValue> | GenericValidateFunction<TValue>[] | TypedSchema<TValue> | YupSchema<TValue> | undefined;
/**
* Creates a field composite.
*/
declare function useField<TValue = unknown>(path: MaybeRefOrGetter<string>, rules?: MaybeRef<RuleExpression<TValue>>, opts?: Partial<FieldOptions<TValue>>): FieldContext<TValue>;
interface SharedBindingObject<TValue = any> {
name: string;
onBlur: (e: Event) => void;
onInput: (e: Event | unknown) => void;
onChange: (e: Event | unknown) => void;
'onUpdate:modelValue'?: ((e: TValue) => unknown) | undefined;
}
interface FieldBindingObject<TValue = any> extends SharedBindingObject<TValue> {
value?: TValue;
checked?: boolean;
}
interface ComponentFieldBindingObject<TValue = any> extends SharedBindingObject<TValue> {
modelValue?: TValue;
}
interface FieldSlotProps<TValue = unknown> extends Pick<FieldContext, 'validate' | 'resetField' | 'handleChange' | 'handleReset' | 'handleBlur' | 'setTouched' | 'setErrors' | 'setValue'> {
field: FieldBindingObject<TValue>;
componentField: ComponentFieldBindingObject<TValue>;
value: TValue;
meta: FieldMeta<TValue>;
errors: string[];
errorMessage: string | undefined;
handleInput: FieldContext['handleChange'];
}
declare const Field: {
new (...args: any[]): vue.CreateComponentPublicInstance<Readonly<vue.ExtractPropTypes<{
as: {
type: (ObjectConstructor | StringConstructor)[];
default: any;
};
name: {
type: StringConstructor;
required: true;
};
rules: {
type: PropType<RuleExpression<unknown>>;
default: any;
};
validateOnMount: {
type: BooleanConstructor;
default: boolean;
};
validateOnBlur: {
type: BooleanConstructor;
default: any;
};
validateOnChange: {
type: BooleanConstructor;
default: any;
};
validateOnInput: {
type: BooleanConstructor;
default: any;
};
validateOnModelUpdate: {
type: BooleanConstructor;
default: any;
};
bails: {
type: BooleanConstructor;
default: () => boolean;
};
label: {
type: StringConstructor;
default: any;
};
uncheckedValue: {
type: any;
default: any;
};
modelValue: {
type: any;
default: symbol;
};
modelModifiers: {
type: any;
default: () => {};
};
'onUpdate:modelValue': {
type: PropType<(e: any) => unknown>;
default: any;
};
standalone: {
type: BooleanConstructor;
default: boolean;
};
keepValue: {
type: BooleanConstructor;
default: any;
};
}>>, () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}> | vue.Slot<any> | VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[] | {
default: () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & Readonly<vue.ExtractPropTypes<{
as: {
type: (ObjectConstructor | StringConstructor)[];
default: any;
};
name: {
type: StringConstructor;
required: true;
};
rules: {
type: PropType<RuleExpression<unknown>>;
default: any;
};
validateOnMount: {
type: BooleanConstructor;
default: boolean;
};
validateOnBlur: {
type: BooleanConstructor;
default: any;
};
validateOnChange: {
type: BooleanConstructor;
default: any;
};
validateOnInput: {
type: BooleanConstructor;
default: any;
};
validateOnModelUpdate: {
type: BooleanConstructor;
default: any;
};
bails: {
type: BooleanConstructor;
default: () => boolean;
};
label: {
type: StringConstructor;
default: any;
};
uncheckedValue: {
type: any;
default: any;
};
modelValue: {
type: any;
default: symbol;
};
modelModifiers: {
type: any;
default: () => {};
};
'onUpdate:modelValue': {
type: PropType<(e: any) => unknown>;
default: any;
};
standalone: {
type: BooleanConstructor;
default: boolean;
};
keepValue: {
type: BooleanConstructor;
default: any;
};
}>>, {
label: string;
as: string | Record<string, any>;
bails: boolean;
uncheckedValue: any;
modelValue: any;
validateOnInput: boolean;
validateOnChange: boolean;
validateOnBlur: boolean;
validateOnModelUpdate: boolean;
validateOnMount: boolean;
standalone: boolean;
modelModifiers: any;
rules: RuleExpression<unknown>;
'onUpdate:modelValue': (e: any) => unknown;
keepValue: boolean;
}, true, {}, {}, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, Readonly<vue.ExtractPropTypes<{
as: {
type: (ObjectConstructor | StringConstructor)[];
default: any;
};
name: {
type: StringConstructor;
required: true;
};
rules: {
type: PropType<RuleExpression<unknown>>;
default: any;
};
validateOnMount: {
type: BooleanConstructor;
default: boolean;
};
validateOnBlur: {
type: BooleanConstructor;
default: any;
};
validateOnChange: {
type: BooleanConstructor;
default: any;
};
validateOnInput: {
type: BooleanConstructor;
default: any;
};
validateOnModelUpdate: {
type: BooleanConstructor;
default: any;
};
bails: {
type: BooleanConstructor;
default: () => boolean;
};
label: {
type: StringConstructor;
default: any;
};
uncheckedValue: {
type: any;
default: any;
};
modelValue: {
type: any;
default: symbol;
};
modelModifiers: {
type: any;
default: () => {};
};
'onUpdate:modelValue': {
type: PropType<(e: any) => unknown>;
default: any;
};
standalone: {
type: BooleanConstructor;
default: boolean;
};
keepValue: {
type: BooleanConstructor;
default: any;
};
}>>, () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}> | vue.Slot<any> | VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[] | {
default: () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}, {}, {}, {}, {
label: string;
as: string | Record<string, any>;
bails: boolean;
uncheckedValue: any;
modelValue: any;
validateOnInput: boolean;
validateOnChange: boolean;
validateOnBlur: boolean;
validateOnModelUpdate: boolean;
validateOnMount: boolean;
standalone: boolean;
modelModifiers: any;
rules: RuleExpression<unknown>;
'onUpdate:modelValue': (e: any) => unknown;
keepValue: boolean;
}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & vue.ComponentOptionsBase<Readonly<vue.ExtractPropTypes<{
as: {
type: (ObjectConstructor | StringConstructor)[];
default: any;
};
name: {
type: StringConstructor;
required: true;
};
rules: {
type: PropType<RuleExpression<unknown>>;
default: any;
};
validateOnMount: {
type: BooleanConstructor;
default: boolean;
};
validateOnBlur: {
type: BooleanConstructor;
default: any;
};
validateOnChange: {
type: BooleanConstructor;
default: any;
};
validateOnInput: {
type: BooleanConstructor;
default: any;
};
validateOnModelUpdate: {
type: BooleanConstructor;
default: any;
};
bails: {
type: BooleanConstructor;
default: () => boolean;
};
label: {
type: StringConstructor;
default: any;
};
uncheckedValue: {
type: any;
default: any;
};
modelValue: {
type: any;
default: symbol;
};
modelModifiers: {
type: any;
default: () => {};
};
'onUpdate:modelValue': {
type: PropType<(e: any) => unknown>;
default: any;
};
standalone: {
type: BooleanConstructor;
default: boolean;
};
keepValue: {
type: BooleanConstructor;
default: any;
};
}>>, () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}> | vue.Slot<any> | VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[] | {
default: () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, {
label: string;
as: string | Record<string, any>;
bails: boolean;
uncheckedValue: any;
modelValue: any;
validateOnInput: boolean;
validateOnChange: boolean;
validateOnBlur: boolean;
validateOnModelUpdate: boolean;
validateOnMount: boolean;
standalone: boolean;
modelModifiers: any;
rules: RuleExpression<unknown>;
'onUpdate:modelValue': (e: any) => unknown;
keepValue: boolean;
}, {}, string, {}> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new () => {
value: UnwrapRef<FieldContext['value']>;
meta: UnwrapRef<FieldContext['meta']>;
errors: UnwrapRef<FieldContext['errors']>;
errorMessage: UnwrapRef<FieldContext['errorMessage']>;
setErrors: FieldContext['setErrors'];
setTouched: FieldContext['setTouched'];
reset: FieldContext['resetField'];
validate: FieldContext['validate'];
setValue: FieldContext['setValue'];
handleChange: FieldContext['handleChange'];
$slots: {
default: (arg: FieldSlotProps<any>) => VNode[];
};
});
type FormSlotProps = UnwrapRef<Pick<FormContext, 'meta' | 'errors' | 'errorBag' | 'values' | 'isSubmitting' | 'isValidating' | 'submitCount' | 'validate' | 'validateField' | 'handleReset' | 'setErrors' | 'setFieldError' | 'setFieldValue' | 'setValues' | 'setFieldTouched' | 'setTouched' | 'resetForm' | 'resetField' | 'controlledValues'>> & {
handleSubmit: (evt: Event | SubmissionHandler, onSubmit?: SubmissionHandler) => Promise<unknown>;
submitForm(evt?: Event): void;
getValues<TValues extends GenericObject = GenericObject>(): TValues;
getMeta<TValues extends GenericObject = GenericObject>(): FormMeta<TValues>;
getErrors<TValues extends GenericObject = GenericObject>(): FormErrors<TValues>;
};
declare const Form: {
new (...args: any[]): vue.CreateComponentPublicInstance<Readonly<vue.ExtractPropTypes<{
as: {
type: PropType<string>;
default: string;
};
validationSchema: {
type: ObjectConstructor;
default: any;
};
initialValues: {
type: ObjectConstructor;
default: any;
};
initialErrors: {
type: ObjectConstructor;
default: any;
};
initialTouched: {
type: ObjectConstructor;
default: any;
};
validateOnMount: {
type: BooleanConstructor;
default: boolean;
};
onSubmit: {
type: PropType<SubmissionHandler<GenericObject>>;
default: any;
};
onInvalidSubmit: {
type: PropType<InvalidSubmissionHandler>;
default: any;
};
keepValues: {
type: BooleanConstructor;
default: boolean;
};
name: {
type: StringConstructor;
default: string;
};
}>>, () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}> | vue.Slot<any> | VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[] | {
default: () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & Readonly<vue.ExtractPropTypes<{
as: {
type: PropType<string>;
default: string;
};
validationSchema: {
type: ObjectConstructor;
default: any;
};
initialValues: {
type: ObjectConstructor;
default: any;
};
initialErrors: {
type: ObjectConstructor;
default: any;
};
initialTouched: {
type: ObjectConstructor;
default: any;
};
validateOnMount: {
type: BooleanConstructor;
default: boolean;
};
onSubmit: {
type: PropType<SubmissionHandler<GenericObject>>;
default: any;
};
onInvalidSubmit: {
type: PropType<InvalidSubmissionHandler>;
default: any;
};
keepValues: {
type: BooleanConstructor;
default: boolean;
};
name: {
type: StringConstructor;
default: string;
};
}>>, {
name: string;
onSubmit: SubmissionHandler<GenericObject>;
as: string;
initialValues: Record<string, any>;
validateOnMount: boolean;
validationSchema: Record<string, any>;
initialErrors: Record<string, any>;
initialTouched: Record<string, any>;
onInvalidSubmit: InvalidSubmissionHandler;
keepValues: boolean;
}, true, {}, {}, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, Readonly<vue.ExtractPropTypes<{
as: {
type: PropType<string>;
default: string;
};
validationSchema: {
type: ObjectConstructor;
default: any;
};
initialValues: {
type: ObjectConstructor;
default: any;
};
initialErrors: {
type: ObjectConstructor;
default: any;
};
initialTouched: {
type: ObjectConstructor;
default: any;
};
validateOnMount: {
type: BooleanConstructor;
default: boolean;
};
onSubmit: {
type: PropType<SubmissionHandler<GenericObject>>;
default: any;
};
onInvalidSubmit: {
type: PropType<InvalidSubmissionHandler>;
default: any;
};
keepValues: {
type: BooleanConstructor;
default: boolean;
};
name: {
type: StringConstructor;
default: string;
};
}>>, () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}> | vue.Slot<any> | VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[] | {
default: () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}, {}, {}, {}, {
name: string;
onSubmit: SubmissionHandler<GenericObject>;
as: string;
initialValues: Record<string, any>;
validateOnMount: boolean;
validationSchema: Record<string, any>;
initialErrors: Record<string, any>;
initialTouched: Record<string, any>;
onInvalidSubmit: InvalidSubmissionHandler;
keepValues: boolean;
}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & vue.ComponentOptionsBase<Readonly<vue.ExtractPropTypes<{
as: {
type: PropType<string>;
default: string;
};
validationSchema: {
type: ObjectConstructor;
default: any;
};
initialValues: {
type: ObjectConstructor;
default: any;
};
initialErrors: {
type: ObjectConstructor;
default: any;
};
initialTouched: {
type: ObjectConstructor;
default: any;
};
validateOnMount: {
type: BooleanConstructor;
default: boolean;
};
onSubmit: {
type: PropType<SubmissionHandler<GenericObject>>;
default: any;
};
onInvalidSubmit: {
type: PropType<InvalidSubmissionHandler>;
default: any;
};
keepValues: {
type: BooleanConstructor;
default: boolean;
};
name: {
type: StringConstructor;
default: string;
};
}>>, () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}> | vue.Slot<any> | VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[] | {
default: () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, {
name: string;
onSubmit: SubmissionHandler<GenericObject>;
as: string;
initialValues: Record<string, any>;
validateOnMount: boolean;
validationSchema: Record<string, any>;
initialErrors: Record<string, any>;
initialTouched: Record<string, any>;
onInvalidSubmit: InvalidSubmissionHandler;
keepValues: boolean;
}, {}, string, {}> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new () => {
setFieldError: FormContext['setFieldError'];
setErrors: FormContext['setErrors'];
setFieldValue: FormContext['setFieldValue'];
setValues: FormContext['setValues'];
setFieldTouched: FormContext['setFieldTouched'];
setTouched: FormContext['setTouched'];
resetForm: FormContext['resetForm'];
resetField: FormContext['resetField'];
validate: FormContext['validate'];
validateField: FormContext['validateField'];
getValues: FormSlotProps['getValues'];
getMeta: FormSlotProps['getMeta'];
getErrors: FormSlotProps['getErrors'];
meta: FormSlotProps['meta'];
values: FormSlotProps['values'];
errors: FormSlotProps['errors'];
$slots: {
default: (arg: FormSlotProps) => VNode[];
};
});
declare const FieldArray: {
new (...args: any[]): vue.CreateComponentPublicInstance<Readonly<vue.ExtractPropTypes<{
name: {
type: StringConstructor;
required: true;
};
}>>, () => vue.Slot<any> | VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[] | {
default: () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & Readonly<vue.ExtractPropTypes<{
name: {
type: StringConstructor;
required: true;
};
}>>, {}, true, {}, {}, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, Readonly<vue.ExtractPropTypes<{
name: {
type: StringConstructor;
required: true;
};
}>>, () => vue.Slot<any> | VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[] | {
default: () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}, {}, {}, {}, {}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & vue.ComponentOptionsBase<Readonly<vue.ExtractPropTypes<{
name: {
type: StringConstructor;
required: true;
};
}>>, () => vue.Slot<any> | VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[] | {
default: () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, {}, {}, string, {}> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new () => {
push: FieldArrayContext['push'];
remove: FieldArrayContext['remove'];
swap: FieldArrayContext['swap'];
insert: FieldArrayContext['insert'];
update: FieldArrayContext['update'];
replace: FieldArrayContext['replace'];
prepend: FieldArrayContext['prepend'];
move: FieldArrayContext['move'];
$slots: {
default: (arg: UnwrapRef<FieldArrayContext>) => VNode[];
};
});
interface ErrorMessageSlotProps {
message: string | undefined;
}
declare const ErrorMessage: {
new (...args: any[]): vue.CreateComponentPublicInstance<Readonly<vue.ExtractPropTypes<{
as: {
type: StringConstructor;
default: any;
};
name: {
type: StringConstructor;
required: true;
};
}>>, () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}> | vue.Slot<any> | VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[] | {
default: () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & Readonly<vue.ExtractPropTypes<{
as: {
type: StringConstructor;
default: any;
};
name: {
type: StringConstructor;
required: true;
};
}>>, {
as: string;
}, true, {}, {}, {
P: {};
B: {};
D: {};
C: {};
M: {};
Defaults: {};
}, Readonly<vue.ExtractPropTypes<{
as: {
type: StringConstructor;
default: any;
};
name: {
type: StringConstructor;
required: true;
};
}>>, () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}> | vue.Slot<any> | VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[] | {
default: () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}, {}, {}, {}, {
as: string;
}>;
__isFragment?: never;
__isTeleport?: never;
__isSuspense?: never;
} & vue.ComponentOptionsBase<Readonly<vue.ExtractPropTypes<{
as: {
type: StringConstructor;
default: any;
};
name: {
type: StringConstructor;
required: true;
};
}>>, () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}> | vue.Slot<any> | VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[] | {
default: () => VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}>[];
}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, {
as: string;
}, {}, string, {}> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new () => {
$slots: {
default: (arg: ErrorMessageSlotProps) => VNode[];
};
});
type FormSchema<TValues extends Record<string, unknown>> = FlattenAndSetPathsType<TValues, GenericValidateFunction | string | GenericObject> | undefined;
interface FormOptions<TValues extends GenericObject, TOutput = TValues, TSchema extends TypedSchema<TValues, TOutput> | FormSchema<TValues> = FormSchema<TValues> | TypedSchema<TValues, TOutput>> {
validationSchema?: MaybeRef<TSchema extends TypedSchema ? TypedSchema<TValues, TOutput> : any>;
initialValues?: PartialDeep<TValues> | undefined | null;
initialErrors?: FlattenAndSetPathsType<TValues, string | undefined>;
initialTouched?: FlattenAndSetPathsType<TValues, boolean>;
validateOnMount?: boolean;
keepValuesOnUnmount?: MaybeRef<boolean>;
name?: string;
}
declare function useForm<TValues extends GenericObject = GenericObject, TOutput extends GenericObject = TValues, TSchema extends FormSchema<TValues> | TypedSchema<TValues, TOutput> = FormSchema<TValues> | TypedSchema<TValues, TOutput>>(opts?: FormOptions<TValues, TOutput, TSchema>): FormContext<TValues, TOutput>;
declare f