@hv_react/use-form v0.1.1

useForm

React hook to manage and validate forms

Install

npm i @hv_react/use-form

Example

import React, { FunctionComponent } from "react";
import { useForm } from "@hv_react/use-form"

interface Props {}

const validators = {
  name: [
    {
      validateFn: () => true,
      failedValidationMessage: "Invalid name",
    },
  ],
  email: [
    {
      validateFn: isEmail,
      failedValidationMessage: "Invalid email",
    },
  ],
}

export const SomeForm: FunctionComponent<Props> = () => {
  const {values, isValid, changeHandler, dirtyFields, errors} = useForm(
    {
      name: "",
      email: "",
      password: "",
    }, // Initial values
    validators
  )
  return (
    <form>
      <input
        type="text"
        name="name"
        value={values.name}
        onChange={changeHandler}
      />
      {dirtyFields.name && errors.name && (
        <p className="error">{errors.name}</p>
      )}
      
      {/* Other fields */}
    </form>
  );
}