vee-validate 4.15.1 → 5.0.0-beta.1

package/dist/vee-validate.mjs

@@ -1,6 +1,6 @@
 /**
-  * vee-validate v4.15.1
-  * (c) 2025 Abdelrahman Awad
+  * vee-validate v5.0.0-beta.1
+  * (c) 2026 Abdelrahman Awad
   * @license MIT
   */
 import { getCurrentInstance, inject, warn as warn$1, computed, toValue, ref, watch, nextTick, unref, isRef, reactive, onUnmounted, onMounted, provide, onBeforeUnmount, defineComponent, toRef, resolveDynamicComponent, h, readonly, watchEffect, shallowRef } from 'vue';
@@ -162,11 +162,8 @@ const isClient = typeof window !== 'undefined';
 function isLocator(value) {
     return isCallable(value) && !!value.__locatorRef;
 }
-function isTypedSchema(value) {
-    return !!value && isCallable(value.parse) && value.__type === 'VVTypedSchema';
-}
-function isYupValidator(value) {
-    return !!value && isCallable(value.validate);
+function isStandardSchema(value) {
+    return isObject(value) && '~standard' in value;
 }
 function hasCheckedAttr(type) {
     return type === 'checkbox' || type === 'radio';
@@ -346,6 +343,27 @@ function isFile(a) {
     return a instanceof File;
 }
 
+// src/getDotPath/getDotPath.ts
+function getDotPath(issue) {
+  if (issue.path?.length) {
+    let dotPath = "";
+    for (const item of issue.path) {
+      const key = typeof item === "object" ? item.key : item;
+      if (typeof key === "string" || typeof key === "number") {
+        if (dotPath) {
+          dotPath += `.${key}`;
+        } else {
+          dotPath += key;
+        }
+      } else {
+        return null;
+      }
+    }
+    return dotPath;
+  }
+  return null;
+}
+
 function cleanupNonNestedPath(path) {
     if (isNotNestedPath(path)) {
         return path.replace(/\[|\]/gi, '');
@@ -586,6 +604,31 @@ function debounceNextTick(inner) {
         return new Promise(resolve => resolves.push(resolve));
     };
 }
+function _combineIssueItems(items, getPath) {
+    const issueMap = {};
+    for (const item of items) {
+        const path = getPath(item);
+        if (!issueMap[path]) {
+            issueMap[path] = {
+                path,
+                messages: [],
+            };
+        }
+        if ('messages' in item) {
+            issueMap[path].messages.push(...item.messages);
+        }
+        else {
+            issueMap[path].messages.push(item.message);
+        }
+    }
+    return Object.values(issueMap);
+}
+/**
+ * Aggregates standard schema issues by path.
+ */
+function combineStandardIssues(issues) {
+    return _combineIssueItems(issues, issue => { var _a; return (issue.path ? (_a = getDotPath(issue)) !== null && _a !== void 0 ? _a : '' : ''); });
+}
 
 function normalizeChildren(tag, context, slotProps) {
     if (!context.slots.default) {
@@ -617,9 +660,6 @@ function hasValueBinding(el) {
 }
 
 function parseInputValue(el) {
-    if (el.type === 'number') {
-        return Number.isNaN(el.valueAsNumber) ? el.value : el.valueAsNumber;
-    }
     if (el.type === 'range') {
         return Number.isNaN(el.valueAsNumber) ? el.value : el.valueAsNumber;
     }
@@ -792,8 +832,8 @@ async function validate(value, rules, options = {}) {
  */
 async function _validate(field, value) {
     const rules = field.rules;
-    if (isTypedSchema(rules) || isYupValidator(rules)) {
-        return validateFieldWithTypedSchema(value, Object.assign(Object.assign({}, field), { rules }));
+    if (isStandardSchema(rules)) {
+        return validateFieldWithStandardSchema(value, Object.assign(Object.assign({}, field), { rules }));
     }
     // if a generic function or chain of generic functions
     if (isCallable(rules) || Array.isArray(rules)) {
@@ -855,58 +895,24 @@ async function _validate(field, value) {
         errors,
     };
 }
-function isYupError(err) {
-    return !!err && err.name === 'ValidationError';
-}
-function yupToTypedSchema(yupSchema) {
-    const schema = {
-        __type: 'VVTypedSchema',
-        async parse(values, context) {
-            var _a;
-            try {
-                const output = await yupSchema.validate(values, { abortEarly: false, context: (context === null || context === void 0 ? void 0 : context.formData) || {} });
-                return {
-                    output,
-                    errors: [],
-                };
-            }
-            catch (err) {
-                // Yup errors have a name prop one them.
-                // https://github.com/jquense/yup#validationerrorerrors-string--arraystring-value-any-path-string
-                if (!isYupError(err)) {
-                    throw err;
-                }
-                if (!((_a = err.inner) === null || _a === void 0 ? void 0 : _a.length) && err.errors.length) {
-                    return { errors: [{ path: err.path, errors: err.errors }] };
-                }
-                const errors = err.inner.reduce((acc, curr) => {
-                    const path = curr.path || '';
-                    if (!acc[path]) {
-                        acc[path] = { errors: [], path };
-                    }
-                    acc[path].errors.push(...curr.errors);
-                    return acc;
-                }, {});
-                return { errors: Object.values(errors) };
-            }
-        },
-    };
-    return schema;
-}
 /**
  * Handles yup validation
  */
-async function validateFieldWithTypedSchema(value, context) {
-    const typedSchema = isTypedSchema(context.rules) ? context.rules : yupToTypedSchema(context.rules);
-    const result = await typedSchema.parse(value, { formData: context.formData });
+async function validateFieldWithStandardSchema(value, context) {
+    const result = await context.rules['~standard'].validate(value);
+    if (!result.issues) {
+        return {
+            value: result.value,
+            errors: [],
+        };
+    }
     const messages = [];
-    for (const error of result.errors) {
-        if (error.errors.length) {
-            messages.push(...error.errors);
+    for (const error of result.issues) {
+        if (error.message) {
+            messages.push(error.message);
         }
     }
     return {
-        value: result.value,
         errors: messages,
     };
 }
@@ -962,27 +968,33 @@ function fillTargetValues(params, crossTable) {
         return acc;
     }, {});
 }
-async function validateTypedSchema(schema, values) {
-    const typedSchema = isTypedSchema(schema) ? schema : yupToTypedSchema(schema);
-    const validationResult = await typedSchema.parse(klona(values), { formData: klona(values) });
+async function validateStandardSchema(schema, values) {
+    const validationResult = await schema['~standard'].validate(klona(values));
     const results = {};
     const errors = {};
-    for (const error of validationResult.errors) {
-        const messages = error.errors;
-        // Fixes issue with path mapping with Yup 1.0 including quotes around array indices
-        const path = (error.path || '').replace(/\["(\d+)"\]/g, (_, m) => {
-            return `[${m}]`;
-        });
+    if (!validationResult.issues) {
+        return {
+            valid: true,
+            results: {},
+            errors: {},
+            values: validationResult.value,
+            source: 'schema',
+        };
+    }
+    const combinedIssues = combineStandardIssues(validationResult.issues || []);
+    for (const error of combinedIssues) {
+        const messages = error.messages;
+        const path = error.path;
         results[path] = { valid: !messages.length, errors: messages };
         if (messages.length) {
             errors[path] = messages[0];
         }
     }
     return {
-        valid: !validationResult.errors.length,
+        valid: !combinedIssues.length,
         results,
         errors,
-        values: validationResult.value,
+        values: undefined,
         source: 'schema',
     };
 }
@@ -1027,7 +1039,7 @@ function useFieldState(path, init) {
     if (!init.form) {
         const { errors, setErrors } = createFieldErrors();
         const id = ID_COUNTER >= Number.MAX_SAFE_INTEGER ? 0 : ++ID_COUNTER;
-        const meta = createFieldMeta(value, initialValue, errors, init.schema);
+        const meta = createFieldMeta(value, initialValue, errors);
         function setState(state) {
             var _a;
             if ('value' in state) {
@@ -1059,7 +1071,6 @@ function useFieldState(path, init) {
         label: init.label,
         type: init.type,
         validate: init.validate,
-        schema: init.schema,
     });
     const errors = computed(() => state.errors);
     function setState(state) {
@@ -1155,13 +1166,11 @@ function resolveModelValue(modelValue, form, initialValue, path) {
 /**
  * Creates meta flags state and some associated effects with them
  */
-function createFieldMeta(currentValue, initialValue, errors, schema) {
-    const isRequired = computed(() => { var _a, _b, _c; return (_c = (_b = (_a = toValue(schema)) === null || _a === void 0 ? void 0 : _a.describe) === null || _b === void 0 ? void 0 : _b.call(_a).required) !== null && _c !== void 0 ? _c : false; });
+function createFieldMeta(currentValue, initialValue, errors) {
     const meta = reactive({
         touched: false,
         pending: false,
         valid: true,
-        required: isRequired,
         validated: !!unref(errors).length,
         initialValue: computed(() => unref(initialValue)),
         dirty: computed(() => {
@@ -1220,7 +1229,7 @@ async function installDevtoolsPlugin(app) {
             packageName: 'vee-validate',
             homepage: 'https://vee-validate.logaretm.com/v4',
             app,
-            logo: 'https://vee-validate.logaretm.com/v4/logo.png',
+            logo: 'https://vee-validate.logaretm.com/v5/logo.png',
         }, api => {
             API = api;
             api.addInspector({
@@ -1329,6 +1338,9 @@ const refreshInspector = throttle(() => {
     }, 100);
 }, 100);
 function registerFormWithDevTools(form) {
+    if (!(process.env.NODE_ENV !== 'production') || !isClient) {
+        return;
+    }
     const vm = getCurrentInstance();
     if (!API) {
         const app = vm === null || vm === void 0 ? void 0 : vm.appContext.app;
@@ -1346,6 +1358,9 @@ function registerFormWithDevTools(form) {
     refreshInspector();
 }
 function registerSingleFieldWithDevtools(field) {
+    if (!(process.env.NODE_ENV !== 'production') || !isClient) {
+        return;
+    }
     const vm = getCurrentInstance();
     if (!API) {
         const app = vm === null || vm === void 0 ? void 0 : vm.appContext.app;
@@ -1370,7 +1385,7 @@ function mapFormForDevtoolsInspector(form) {
     });
     function buildFormTree(tree, path = []) {
         const key = [...path].pop();
-        if ('id' in tree) {
+        if ('id' in tree && typeof tree.id === 'string') {
             return Object.assign(Object.assign({}, tree), { label: key || tree.label });
         }
         if (isObject(tree)) {
@@ -1465,7 +1480,8 @@ function getFieldNodeTags(multiple, fieldsCount, type, valid, form) {
 function encodeNodeId(form, stateOrField) {
     const type = stateOrField ? ('path' in stateOrField ? 'pathState' : 'field') : 'form';
     const fieldPath = stateOrField ? ('path' in stateOrField ? stateOrField === null || stateOrField === void 0 ? void 0 : stateOrField.path : toValue(stateOrField === null || stateOrField === void 0 ? void 0 : stateOrField.name)) : '';
-    const idObject = { f: form === null || form === void 0 ? void 0 : form.formId, ff: (stateOrField === null || stateOrField === void 0 ? void 0 : stateOrField.id) || fieldPath, type };
+    const ff = type === 'field' ? stateOrField === null || stateOrField === void 0 ? void 0 : stateOrField.id : fieldPath;
+    const idObject = { f: form === null || form === void 0 ? void 0 : form.formId, ff, type };
     return btoa(encodeURIComponent(JSON.stringify(idObject)));
 }
 function decodeNodeId(nodeId) {
@@ -1604,15 +1620,11 @@ function _useField(path, rules, opts) {
             return undefined;
         }
         const rulesValue = unref(rules);
-        if (isYupValidator(rulesValue) ||
-            isTypedSchema(rulesValue) ||
-            isCallable(rulesValue) ||
-            Array.isArray(rulesValue)) {
+        if (isStandardSchema(rulesValue) || isCallable(rulesValue) || Array.isArray(rulesValue)) {
             return rulesValue;
         }
         return normalizeRules(rulesValue);
     });
-    const isTyped = !isCallable(validator.value) && isTypedSchema(toValue(rules));
     const { id, value, initialValue, meta, setState, errors, flags } = useFieldState(name, {
         modelValue,
         form,
@@ -1620,7 +1632,6 @@ function _useField(path, rules, opts) {
         label,
         type,
         validate: validator.value ? validate$1 : undefined,
-        schema: isTyped ? rules : undefined,
     });
     const errorMessage = computed(() => errors.value[0]);
     if (syncVModel) {
@@ -1781,12 +1792,8 @@ function _useField(path, rules, opts) {
     // extract cross-field dependencies in a computed prop
     const dependencies = computed(() => {
         const rulesVal = validator.value;
-        // is falsy, a function schema or a yup schema
-        if (!rulesVal ||
-            isCallable(rulesVal) ||
-            isYupValidator(rulesVal) ||
-            isTypedSchema(rulesVal) ||
-            Array.isArray(rulesVal)) {
+        // is falsy, a function schema or a standard schema
+        if (!rulesVal || isCallable(rulesVal) || isStandardSchema(rulesVal) || Array.isArray(rulesVal)) {
             return {};
         }
         return Object.keys(rulesVal).reduce((acc, rule) => {
@@ -1852,6 +1859,7 @@ function _useField(path, rules, opts) {
  * Normalizes partial field options to include the full options
  */
 function normalizeOptions(opts) {
+    var _a;
     const defaults = () => ({
         initialValue: undefined,
         validateOnMount: false,
@@ -1863,22 +1871,19 @@ function normalizeOptions(opts) {
         controlled: true,
     });
     const isVModelSynced = !!(opts === null || opts === void 0 ? void 0 : opts.syncVModel);
-    const modelPropName = typeof (opts === null || opts === void 0 ? void 0 : opts.syncVModel) === 'string' ? opts.syncVModel : (opts === null || opts === void 0 ? void 0 : opts.modelPropName) || 'modelValue';
+    const modelPropName = typeof (opts === null || opts === void 0 ? void 0 : opts.syncVModel) === 'string' ? opts.syncVModel : 'modelValue';
     const initialValue = isVModelSynced && !('initialValue' in (opts || {}))
         ? getCurrentModelValue(getCurrentInstance(), modelPropName)
         : opts === null || opts === void 0 ? void 0 : opts.initialValue;
     if (!opts) {
         return Object.assign(Object.assign({}, defaults()), { initialValue });
     }
-    // TODO: Deprecate this in next major release
-    const checkedValue = 'valueProp' in opts ? opts.valueProp : opts.checkedValue;
-    const controlled = 'standalone' in opts ? !opts.standalone : opts.controlled;
-    const syncVModel = (opts === null || opts === void 0 ? void 0 : opts.modelPropName) || (opts === null || opts === void 0 ? void 0 : opts.syncVModel) || false;
-    return Object.assign(Object.assign(Object.assign({}, defaults()), (opts || {})), { initialValue, controlled: controlled !== null && controlled !== void 0 ? controlled : true, checkedValue,
-        syncVModel });
+    const controlled = (_a = opts.controlled) !== null && _a !== void 0 ? _a : true;
+    const syncVModel = (opts === null || opts === void 0 ? void 0 : opts.syncVModel) || false;
+    return Object.assign(Object.assign(Object.assign({}, defaults()), (opts || {})), { initialValue, controlled: controlled !== null && controlled !== void 0 ? controlled : true, checkedValue: opts === null || opts === void 0 ? void 0 : opts.checkedValue, syncVModel });
 }
 function useFieldWithChecked(name, rules, opts) {
-    const form = !(opts === null || opts === void 0 ? void 0 : opts.standalone) ? injectWithSelf(FormContextKey) : undefined;
+    const form = (opts === null || opts === void 0 ? void 0 : opts.controlled) ? injectWithSelf(FormContextKey) : undefined;
     const checkedValue = opts === null || opts === void 0 ? void 0 : opts.checkedValue;
     const uncheckedValue = opts === null || opts === void 0 ? void 0 : opts.uncheckedValue;
     function patchCheckedApi(field) {
@@ -2016,9 +2021,9 @@ const FieldImpl = /** #__PURE__ */ defineComponent({
             type: null,
             default: undefined,
         },
-        standalone: {
+        controlled: {
             type: Boolean,
-            default: false,
+            default: true,
         },
         keepValue: {
             type: Boolean,
@@ -2034,7 +2039,7 @@ const FieldImpl = /** #__PURE__ */ defineComponent({
         const { errors, value, errorMessage, validate: validateField, handleChange, handleBlur, setTouched, resetField, handleReset, meta, checked, setErrors, setValue, } = useField(name, rules, {
             validateOnMount: props.validateOnMount,
             bails: props.bails,
-            standalone: props.standalone,
+            controlled: props.controlled,
             type: ctx.attrs.type,
             initialValue: resolveInitialValue(props, ctx),
             // Only for checkboxes and radio buttons
@@ -2165,10 +2170,6 @@ const PRIVATE_PATH_STATE_KEYS = ['bails', 'fieldsCount', 'id', 'multiple', 'type
 function resolveInitialValues(opts) {
     const givenInitial = (opts === null || opts === void 0 ? void 0 : opts.initialValues) || {};
     const providedValues = Object.assign({}, toValue(givenInitial));
-    const schema = unref(opts === null || opts === void 0 ? void 0 : opts.validationSchema);
-    if (schema && isTypedSchema(schema) && isCallable(schema.cast)) {
-        return klona(schema.cast(providedValues) || {});
-    }
     return klona(providedValues);
 }
 function useForm(opts) {
@@ -2303,19 +2304,6 @@ function useForm(opts) {
         if (unsetBatchIndex !== -1) {
             UNSET_BATCH.splice(unsetBatchIndex, 1);
         }
-        const isRequired = computed(() => {
-            var _a, _b, _c, _d;
-            const schemaValue = toValue(schema);
-            if (isTypedSchema(schemaValue)) {
-                return (_b = (_a = schemaValue.describe) === null || _a === void 0 ? void 0 : _a.call(schemaValue, toValue(path)).required) !== null && _b !== void 0 ? _b : false;
-            }
-            // Path own schema
-            const configSchemaValue = toValue(config === null || config === void 0 ? void 0 : config.schema);
-            if (isTypedSchema(configSchemaValue)) {
-                return (_d = (_c = configSchemaValue.describe) === null || _c === void 0 ? void 0 : _c.call(configSchemaValue).required) !== null && _d !== void 0 ? _d : false;
-            }
-            return false;
-        });
         const id = FIELD_ID_COUNTER++;
         const state = reactive({
             id,
@@ -2324,7 +2312,6 @@ function useForm(opts) {
             pending: false,
             valid: true,
             validated: !!((_a = initialErrors[pathValue]) === null || _a === void 0 ? void 0 : _a.length),
-            required: isRequired,
             initialValue,
             errors: shallowRef([]),
             bails: (_b = config === null || config === void 0 ? void 0 : config.bails) !== null && _b !== void 0 ? _b : false,
@@ -2599,9 +2586,6 @@ function useForm(opts) {
         resetForm,
         resetField,
         handleSubmit,
-        useFieldModel,
-        defineInputBinds,
-        defineComponentBinds: defineComponentBinds,
         defineField,
         stageInitialValue,
         unsetInitialValue,
@@ -2737,7 +2721,6 @@ function useForm(opts) {
     function resetForm(resetState, opts) {
         let newValues = klona((resetState === null || resetState === void 0 ? void 0 : resetState.values) ? resetState.values : originalInitialValues.value);
         newValues = (opts === null || opts === void 0 ? void 0 : opts.force) ? newValues : merge(originalInitialValues.value, newValues);
-        newValues = isTypedSchema(schema) && isCallable(schema.cast) ? schema.cast(newValues) : newValues;
         setInitialValues(newValues, { force: opts === null || opts === void 0 ? void 0 : opts.force });
         mutateAllPathState(state => {
             var _a;
@@ -2855,8 +2838,8 @@ function useForm(opts) {
             return { valid: true, results: {}, errors: {}, source: 'none' };
         }
         isValidating.value = true;
-        const formResult = isYupValidator(schemaValue) || isTypedSchema(schemaValue)
-            ? await validateTypedSchema(schemaValue, formValues)
+        const formResult = isStandardSchema(schemaValue)
+            ? await validateStandardSchema(schemaValue, formValues)
             : await validateObjectSchema(schemaValue, formValues, {
                 names: fieldNames.value,
                 bailsMap: fieldBailsMap.value,
@@ -2949,50 +2932,6 @@ function useForm(opts) {
         const model = createModel(path, () => { var _a, _b, _c; return (_c = (_a = evalConfig().validateOnModelUpdate) !== null && _a !== void 0 ? _a : (_b = getConfig()) === null || _b === void 0 ? void 0 : _b.validateOnModelUpdate) !== null && _c !== void 0 ? _c : true; });
         return [model, props];
     }
-    function useFieldModel(pathOrPaths) {
-        if (!Array.isArray(pathOrPaths)) {
-            return createModel(pathOrPaths);
-        }
-        return pathOrPaths.map(p => createModel(p, true));
-    }
-    /**
-     * @deprecated use defineField instead
-     */
-    function defineInputBinds(path, config) {
-        const [model, props] = defineField(path, config);
-        function onBlur() {
-            props.value.onBlur();
-        }
-        function onInput(e) {
-            const value = normalizeEventValue(e);
-            setFieldValue(toValue(path), value, false);
-            props.value.onInput();
-        }
-        function onChange(e) {
-            const value = normalizeEventValue(e);
-            setFieldValue(toValue(path), value, false);
-            props.value.onChange();
-        }
-        return computed(() => {
-            return Object.assign(Object.assign({}, props.value), { onBlur,
-                onInput,
-                onChange, value: model.value });
-        });
-    }
-    /**
-     * @deprecated use defineField instead
-     */
-    function defineComponentBinds(path, config) {
-        const [model, props] = defineField(path, config);
-        const pathState = findPathState(toValue(path));
-        function onUpdateModelValue(value) {
-            model.value = value;
-        }
-        return computed(() => {
-            const conf = isCallable(config) ? config(omit(pathState, PRIVATE_PATH_STATE_KEYS)) : config || {};
-            return Object.assign({ [conf.model || 'modelValue']: model.value, [`onUpdate:${conf.model || 'modelValue'}`]: onUpdateModelValue }, props.value);
-        });
-    }
     const ctx = Object.assign(Object.assign({}, formCtx), { values: readonly(formValues), handleReset: () => resetForm(), submitForm });
     provide(PublicFormContextKey, ctx);
     return ctx;
@@ -3944,4 +3883,4 @@ function useSetFormValues() {
     return setFormValues;
 }
 
-export { ErrorMessage, Field, FieldArray, FieldContextKey, Form, FormContextKey, IS_ABSENT, PublicFormContextKey, cleanupNonNestedPath, configure, defineRule, isNotNestedPath, normalizeRules, useField, useFieldArray, useFieldError, useFieldValue, useForm, useFormContext, useFormErrors, useFormValues, useIsFieldDirty, useIsFieldTouched, useIsFieldValid, useIsFormDirty, useIsFormTouched, useIsFormValid, useIsSubmitting, useIsValidating, useResetForm, useSetFieldError, useSetFieldTouched, useSetFieldValue, useSetFormErrors, useSetFormTouched, useSetFormValues, useSubmitCount, useSubmitForm, useValidateField, useValidateForm, validate, validateObjectSchema as validateObject };
+export { ErrorMessage, Field, FieldArray, FieldContextKey, Form, FormContextKey, IS_ABSENT, PublicFormContextKey, cleanupNonNestedPath, configure, defineRule, getConfig, isNotNestedPath, normalizeRules, useField, useFieldArray, useFieldError, useFieldValue, useForm, useFormContext, useFormErrors, useFormValues, useIsFieldDirty, useIsFieldTouched, useIsFieldValid, useIsFormDirty, useIsFormTouched, useIsFormValid, useIsSubmitting, useIsValidating, useResetForm, useSetFieldError, useSetFieldTouched, useSetFieldValue, useSetFormErrors, useSetFormTouched, useSetFormValues, useSubmitCount, useSubmitForm, useValidateField, useValidateForm, validate, validateObjectSchema as validateObject };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vee-validate",
-  "version": "4.15.1",
+  "version": "5.0.0-beta.1",
   "description": "Painless forms for Vue.js",
   "author": "Abdelrahman Awad <logaretm1@gmail.com>",
   "license": "MIT",
@@ -42,6 +42,8 @@
     "vue": "^3.4.26"
   },
   "dependencies": {
+    "@standard-schema/spec": "^1.0.0",
+    "@standard-schema/utils": "^0.3.0",
     "@vue/devtools-api": "^7.5.2",
     "type-fest": "^4.8.3"
   }