vee-validate 4.15.1 → 5.0.0-beta.1

package/README.md

@@ -18,7 +18,7 @@ Painless Vue forms
   <img src="https://img.shields.io/npm/dm/vee-validate.svg?color=05bd6d&label=">
 </a>
 
-<a href="https://vee-validate.logaretm.com/v4/" target="_blank">
+<a href="https://vee-validate.logaretm.com/v5/" target="_blank">
   <img src="https://img.shields.io/badge/-docs%20and%20demos-009f53">
 </a>
 
@@ -69,7 +69,7 @@ The main v4 version supports Vue 3.x only, for previous versions of Vue, check t
 | vue Version | vee-validate version | Documentation Link                                                                       |
 | ----------- | -------------------- | ---------------------------------------------------------------------------------------- |
 | `2.x`       | `2.x` or `3.x`       | [v2](https://vee-validate.logaretm.com/v2) or [v3](https://vee-validate.logaretm.com/v3) |
-| `3.x`       | `4.x`                | [v4](https://vee-validate.logaretm.com/v4)                                               |
+| `3.x`       | `4.x` or `5.x`       | [v4](https://vee-validate.logaretm.com/v4) or [v5](https://vee-validate.logaretm.com/v5) |
 
 ### Usage
 
@@ -117,7 +117,7 @@ const onSubmit = handleSubmit(values => {
 </template>
 ```
 
-You can do so much more than this, for more info [check the composition API documentation](https://vee-validate.logaretm.com/v4/guide/composition-api/getting-started/).
+You can do so much more than this, for more info [check the composition API documentation](https://vee-validate.logaretm.com/v5/guide/composition-api/getting-started/).
 
 #### Declarative Components
 
@@ -150,7 +150,7 @@ function onSubmit(values) {
 </template>
 ```
 
-The `Field` component renders an `input` of type `text` by default but you can [control that](https://vee-validate.logaretm.com/v4/api/field#rendering-fields)
+The `Field` component renders an `input` of type `text` by default but you can [control that](https://vee-validate.logaretm.com/v5/api/field#rendering-fields)
 
 ## 📚 Documentation
 

package/dist/vee-validate.cjs

@@ -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
   */
 'use strict';
@@ -164,11 +164,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';
@@ -348,6 +345,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, '');
@@ -563,6 +581,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) {
@@ -594,9 +637,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;
     }
@@ -769,8 +809,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)) {
@@ -832,58 +872,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,
     };
 }
@@ -939,27 +945,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',
     };
 }
@@ -1004,7 +1016,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) {
@@ -1036,7 +1048,6 @@ function useFieldState(path, init) {
         label: init.label,
         type: init.type,
         validate: init.validate,
-        schema: init.schema,
     });
     const errors = vue.computed(() => state.errors);
     function setState(state) {
@@ -1132,13 +1143,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 = vue.computed(() => { var _a, _b, _c; return (_c = (_b = (_a = vue.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 = vue.reactive({
         touched: false,
         pending: false,
         valid: true,
-        required: isRequired,
         validated: !!vue.unref(errors).length,
         initialValue: vue.computed(() => vue.unref(initialValue)),
         dirty: vue.computed(() => {
@@ -1186,15 +1195,11 @@ function _useField(path, rules, opts) {
             return undefined;
         }
         const rulesValue = vue.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(vue.toValue(rules));
     const { id, value, initialValue, meta, setState, errors, flags } = useFieldState(name, {
         modelValue,
         form,
@@ -1202,7 +1207,6 @@ function _useField(path, rules, opts) {
         label,
         type,
         validate: validator.value ? validate$1 : undefined,
-        schema: isTyped ? rules : undefined,
     });
     const errorMessage = vue.computed(() => errors.value[0]);
     if (syncVModel) {
@@ -1354,12 +1358,8 @@ function _useField(path, rules, opts) {
     // extract cross-field dependencies in a computed prop
     const dependencies = vue.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) => {
@@ -1425,6 +1425,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,
@@ -1436,22 +1437,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(vue.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) {
@@ -1585,9 +1583,9 @@ const FieldImpl = /** #__PURE__ */ vue.defineComponent({
             type: null,
             default: undefined,
         },
-        standalone: {
+        controlled: {
             type: Boolean,
-            default: false,
+            default: true,
         },
         keepValue: {
             type: Boolean,
@@ -1603,7 +1601,7 @@ const FieldImpl = /** #__PURE__ */ vue.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
@@ -1734,10 +1732,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({}, vue.toValue(givenInitial));
-    const schema = vue.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) {
@@ -1872,19 +1866,6 @@ function useForm(opts) {
         if (unsetBatchIndex !== -1) {
             UNSET_BATCH.splice(unsetBatchIndex, 1);
         }
-        const isRequired = vue.computed(() => {
-            var _a, _b, _c, _d;
-            const schemaValue = vue.toValue(schema);
-            if (isTypedSchema(schemaValue)) {
-                return (_b = (_a = schemaValue.describe) === null || _a === void 0 ? void 0 : _a.call(schemaValue, vue.toValue(path)).required) !== null && _b !== void 0 ? _b : false;
-            }
-            // Path own schema
-            const configSchemaValue = vue.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 = vue.reactive({
             id,
@@ -1893,7 +1874,6 @@ function useForm(opts) {
             pending: false,
             valid: true,
             validated: !!((_a = initialErrors[pathValue]) === null || _a === void 0 ? void 0 : _a.length),
-            required: isRequired,
             initialValue,
             errors: vue.shallowRef([]),
             bails: (_b = config === null || config === void 0 ? void 0 : config.bails) !== null && _b !== void 0 ? _b : false,
@@ -2168,9 +2148,6 @@ function useForm(opts) {
         resetForm,
         resetField,
         handleSubmit,
-        useFieldModel,
-        defineInputBinds,
-        defineComponentBinds: defineComponentBinds,
         defineField,
         stageInitialValue,
         unsetInitialValue,
@@ -2306,7 +2283,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;
@@ -2419,8 +2395,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,
@@ -2507,50 +2483,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(vue.toValue(path), value, false);
-            props.value.onInput();
-        }
-        function onChange(e) {
-            const value = normalizeEventValue(e);
-            setFieldValue(vue.toValue(path), value, false);
-            props.value.onChange();
-        }
-        return vue.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(vue.toValue(path));
-        function onUpdateModelValue(value) {
-            model.value = value;
-        }
-        return vue.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: vue.readonly(formValues), handleReset: () => resetForm(), submitForm });
     vue.provide(PublicFormContextKey, ctx);
     return ctx;
@@ -3428,6 +3360,7 @@ exports.PublicFormContextKey = PublicFormContextKey;
 exports.cleanupNonNestedPath = cleanupNonNestedPath;
 exports.configure = configure;
 exports.defineRule = defineRule;
+exports.getConfig = getConfig;
 exports.isNotNestedPath = isNotNestedPath;
 exports.normalizeRules = normalizeRules;
 exports.useField = useField;