Version 7.42.0

📽 feature: validate function to include form values (#9079)

type FormValues = {
  number1: number;
  number2: number;
};

// Making exported validate function isolated for validation
export function validateNumber(_: number, formValues: FormValues) {
  return formValues.number1 + formValues.number2 === 3;
}

export default function App() {
  const { register, handleSubmit } = useForm({
    defaultValues: {
      number1: 0,
      number2: 0
    }
  });

  return (
    <form onSubmit={handleSubmit((data) => console.log(data))}>
      <input
        type="number"
        {...register("number1", {
          validate: validateNumber,
          valueAsNumber: true
        })}
      />
      <input
        type="number"
        {...register("number2", {
          validate: validateNumber,
          valueAsNumber: true
        })}
      />
     <button>submit</button>
    </form>
  );
}

🛤️ keep track of traversed types to avoid self-referencing while constructing paths for a type (#9540)
🏋🏻‍♀️ reduced code with unset by weight reduction of 1% (#9575)
📔 fix warning for setValue test case
🪜 Improve handleSubmit function by removing swallow runtime error
🙆🏻‍♂️ fix: revert fieldState.invalid deprecated (#9760)
🇪🇸 fix Spanish translation (#9737)

thanks to @SimplyLinn & @Mini-ghost @mango906 @amendezm

Version 7.41.5

🐞 fix #9713 regression on validate function with react native (#9714)

thanks @Moshyfawn

Version 7.41.4

🐞 fix #9709 calling setValue breaks future onChange calls from a Controller (#9710)

thanks @Moshyfawn

Version 7.42.0-next.0

📽 feature: validate function to include formValues (#9079)

type FormValues = {
  number1: number;
  number2: number;
};

// Making exported validate function isolated for validation
export function validateNumber(_: number, formValus: FormValues) {
  return formValus.number1 + formValus.number2 === 3;
}

export default function App() {
  const { register, handleSubmit } = useForm({
    defaultValues: {
      number1: 0,
      number2: 0
    }
  });

  return (
    <form onSubmit={handleSubmit((data) => console.log(data))}>
      <input
        type="number"
        {...register("number1", {
          validate: validateNumber,
          valueAsNumber: true
        })}
      />
      <input
        type="number"
        {...register("number2", {
          validate: validateNumber,
          valueAsNumber: true
        })}
      />
     <button>submit</button>
    </form>
  );
}

🛤️ keep track of traversed types to avoid self-referencing while constructing paths for a type (#9540)
🏋🏻‍♀️ reduced code with unset by weight reduce of 1% (#9575)
📔 fix warning for setValue test case
🪜 Improve handleSubmit function

thanks to @SimplyLinn & @Mini-ghost

Version 7.41.3

💁‍♂️ close #9684 revert UnPackAsyncDefaultValues to avoid TS breaking change

Version 7.41.2

🤦🏻‍♂️fix #9661 regression on required valueAsNumber (#9662)

🎅 Version 7.41.1

🐞 fix #9659 NaN prevent validation update (#9660)
🕯️ close #9524 useWatch return undefined value (#9653)
📖 adjust contributing document (#9641)
💆🏻 fix #9621 with the inline default value (#9622)
🩻 docs: update contribution guidelines (#9605)

thanks to @Mini-ghost and @stefanpl

🎄 Version 7.41.0

👉 NEW values props

The following syntax will react to values prop update/changes.

• values will be reactive to update/change and reset accordingly
• provide a reset option to keep dirty/touched values potentially

const values = await fetch('API')

useForm({
  values, // will reset the form when values updates
  // resetOptions: {
  //   keepDirtyValues: true
  // }
})

---

👉 NEW async defaultValues props

The following syntax will support async defaultValues, so we will manage the reset form internally and update formState accordingly.

• promise will only be resolved once during useForm() call
• It's possible to supply resetOptions as well

const { formState: { isLoading } } = useForm({
  defaultValues: fetch('API')
  // resetOptions: {
  //   keepDirtyValues: true
  // }
})

React use API

useForm({
  defaultValues: use(fetch('API'))
  // resetOptions: {
  //   keepDirtyValues: true
  // }
})

Screen.Recording.2022-12-17.at.9.41.51.am.mov

🙋 What's the difference between values and defaultValues

values will react to changes and reflect on the form values, and defaultValues is cached for once and will never re-run the promise or react to defaultValues changes.

⏳ close #9525 add isLoading state for async defaultValues (#9526)
🐞 fix #9581 incorrect type for array of string for message (#9584)
🐞 fix #9571 validation issue with unregister input with valueAsNumber (#9572)
🐞 fix(useWatch): default value for array of inputs (#9555)
📔 fix Controller example using deprecated as prop (#9535)
🐞 fix #9521 isValidting property stuck (#9523)
🔨 feat: Migrate to pnpm (#9516)
🎹 fix #9509 incorrect type for WatchObserver (#9510)
🌳 include flush root render method to createFormControl (#9479)

Huge thanks goes to @nvh95's work on PNPM and also thanks to @bell-steven's contribution

Version 7.40.0

🏃🏻‍♂️ close #9454 set isValid and abort early for the error field (#9457)

• Improved async validation and especially combined with sync ones, which will abort early sync failed first
• IsValid evaluation will abort early if current field validation failed
• apply to both build-in and schema valdiation

Screen.Recording.2022-11-30.at.9.18.20.am.mov

🐞 fix #9473 avoid update isDirty & dirtyFields unless flag is passed down (#9475)

thanks @blingblingredstar for the verify

Version 7.39.7

Revert "🪶 improve useFormContext perf by avoid reference re-create … …with omit (#9407)"