fix: resetField respects current reactive initial value (#4827)

When useField receives a reactive ref as initialValue, resetField now
reads the current value of that ref instead of the stale value captured
at field creation time. This applies to both standalone useField and
useField within a useForm context.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: logaretm

.changeset/fix-4827-reactive-resetfield.md

@@ -0,0 +1,5 @@
+---
+"vee-validate": patch
+---
+
+Fix resetField to use current reactive initial value instead of stale value (#4827)

packages/vee-validate/src/useFieldState.ts

@@ -126,6 +126,11 @@ export function _useFieldValue<TValue = unknown>(
 
   function resolveInitialValue() {
     if (!form) {
+      // If the original modelValue is a ref, read from it directly to maintain reactivity
+      if (isRef(modelValue)) {
+        return modelValue.value as TValue;
+      }
+
       return unref(modelRef) as TValue;
     }
 
@@ -160,6 +165,15 @@ export function _useFieldValue<TValue = unknown>(
   // #3429
   const currentValue = resolveModelValue(modelValue, form, initialValue, path);
   form.stageInitialValue(unref(path), currentValue, true);
+
+  // If the modelValue is a ref, watch it and update the form's initial value when it changes
+  // This ensures resetField uses the current reactive initial value (#4827)
+  if (isRef(modelValue)) {
+    watch(modelValue, newVal => {
+      form.setFieldInitialValue(unref(path), newVal as any, true);
+    });
+  }
+
   // otherwise use a computed setter that triggers the `setFieldValue`
   const value = computed<TValue>({
     get() {

packages/vee-validate/tests/useField.spec.ts

@@ -1059,4 +1059,69 @@ describe('useField()', () => {
 
     expect(form.values.field).toEqual('test');
   });
+
+  // #4827
+  test('resetField should use current reactive initial value (without form)', async () => {
+    let field!: FieldContext;
+    const initialValue = ref('before change');
+
+    mountWithHoc({
+      setup() {
+        field = useField('field', undefined, { initialValue });
+
+        return {};
+      },
+      template: '<div></div>',
+    });
+
+    await flushPromises();
+    expect(field.value.value).toBe('before change');
+
+    // Change the reactive initial value
+    initialValue.value = 'after change';
+    await flushPromises();
+
+    // Change the field's current value to something else
+    field.value.value = 'some random value';
+    await flushPromises();
+
+    // Reset field should use the new reactive initial value
+    field.resetField();
+    await flushPromises();
+
+    expect(field.value.value).toBe('after change');
+  });
+
+  // #4827
+  test('resetField should use current reactive initial value (with form)', async () => {
+    let field!: FieldContext;
+    const initialValue = ref('before change');
+
+    mountWithHoc({
+      setup() {
+        useForm();
+        field = useField('field', undefined, { initialValue });
+
+        return {};
+      },
+      template: '<div></div>',
+    });
+
+    await flushPromises();
+    expect(field.value.value).toBe('before change');
+
+    // Change the reactive initial value
+    initialValue.value = 'after change';
+    await flushPromises();
+
+    // Change the field's current value to something else
+    field.value.value = 'some random value';
+    await flushPromises();
+
+    // Reset field should use the new reactive initial value
+    field.resetField();
+    await flushPromises();
+
+    expect(field.value.value).toBe('after change');
+  });
 });