Formtastisch NPM

formtastisch - solid performant forms for React.

🗜 3kb all, treeshakable, depending on usage will be even less.
🚀 Performance guaranteed, controlled inputs with performance of uncontrolled.
🦾 First class typescript support
✅ Zero dependencies
✅ Works with any ui lib, custom inputs, and literally with anything that can return data.
✅ Can be customized and optimized to death. Edgecase friendly and doesn't stand in your way.
✅ First class support for nested data and dynamic forms.
✅ No mess forms code and nice dev experience

const initialData = { firstName: '', lastName: '' }
const formState = makeFormStateWithModel({
  initialData,
  validations: {
    firstName: (value) => validateIsRequired(value),
    lastName: (value) => validateIsRequired(value)
  }
})

export const MyForm: FC = () => {
  formState.use()
  
  return (
    <div>
      <input {...formState.makeInputProps('firstName')} />
      <input {...formState.makeInputProps('lastName')} />
      <p>{JSON.stringify(formState.getData({includeErros: true}))}</p>
      <button
        onClick={() => {
          console.log(formState.validate())
          console.log(formState.isValid())
        }}
      >
        submit
      </button>
    </div>
  )
}