react-hook-form

• fix Validation with schema: formState isValid attribute does not return the correct value https://github.com/bluebill1049/react-hook-form/issues/117

• fix a bug where errors are not cleear after succesfful submit

• improve typescript support

• setValue support validation as thrid argument:
  setValue('name', 'value', true)
• triggerValidation with array of fields should only trigger one re-render when execute (batch update)
• setValue remove api shouldRender

• fix the issue with validation schema with onSubmit mode https://github.com/bluebill1049/react-hook-form/issues/111

• remove forceValidation from 'triggerValidation` to differentiate from validation mode, please refer to formState.

• support triggerValidation with multiple names

• add clearError(name: string) to clear an error which you can do setError(name: string)

• fix type error https://github.com/bluebill1049/react-hook-form/issues/107

• fix type error with https://github.com/bluebill1049/react-hook-form/issues/104

• patch a bug on native validation

• support browser native validation
• add focus to error input option by default submitFocusError
• fix a bug at https://github.com/bluebill1049/react-hook-form/issues/99

nativeValidation Code example:

import React from "react";
import ReactDOM from "react-dom";
import useForm from "./src";

import "./styles.css";

function App() {
  const { register, handleSubmit } = useForm({
    nativeValidation: true
  });
  const onSubmit = async data => {
    alert(JSON.stringify(data));
  };

  return (
    <form onSubmit={e => e.preventDefault()}>
      <label>First name</label>
      <input
        name="firstName"
        ref={register({ required: "Please enter your first name." })}
      />
      <label>Last name</label>
      <input
        name="lastName"
        ref={register({ required: "Please enter your last name." })}
      />
      <input type="submit" onClick={handleSubmit(onSubmit)} />
    </form>
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

This new feature allows your deep nested component to easily invoke hook methods.

• new Component FormContext : set up context
• new Hook useFormContext : getting useForm methods from children
• patch this bug https://github.com/bluebill1049/react-hook-form/issues/92

Code Example below:

import React from "react";
import ReactDOM from "react-dom";
import useForm, { FormContext } from "./src";
import Test from "./Test";

import "./styles.css";

function App() {
  const methods = useForm();
  const { register, handleSubmit } = methods;
  return (
    <FormContext {...methods}>
      <form onSubmit={handleSubmit(data => console.log(data))}>
        <h1>Hello CodeSandbox</h1>
        <input name="test" ref={register({ required: true })} />
        <h2>Start editing to see some magic happen!</h2>
        <Test />
        <button>test</button>
      </form>
    </FormContext>
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);
import * as React from "react";
import useForm, { useFormContext } from "./src";

export default function Test() {
  const { register } = useFormContext();
  return (
    <div>
      <input name="bill" ref={register} />
    </div>
  );
}

• fix a bug with onBlur validation for isValid https://github.com/bluebill1049/react-hook-form/issues/92

• fix a bug on reset https://github.com/bluebill1049/react-hook-form/issues/91

• fix type error for setError, the second argument should be optional

• include isValid in the formState

• fix a bug with setError setError() from submit handler not working #88

• fix a bug: warning when route change for submit https://github.com/bluebill1049/react-hook-form/issues/83

• fix a bug with name check for object shape.