OPEN TECH FOUNDATION

React Form

A simple form state manager for React.

Live Demo | Documentation

Features

• Simple APIs to use

• Supports nested & array fields

• Supports form validation (Works with any schema validation lib)

• Render optimized

• TypeScript support

Installation

npm install @opentf/react-form

yarn add @opentf/react-form

pnpm add @opentf/react-form

bun add @opentf/react-form

Usage

import { Form, Field } from '@opentf/react-form';

export default function App() {
  return (
    <Form
      initialValues={{ field1: '', field2: '' }}
      onSubmit={(values) => {
        console.log(values);
      }}
    >
      <Field name="field1" />
      <Field name="field2" type="number" />
      <button type="submit">Submit</button>
    </Form>
  );
}

Examples

• Basic Form

• Material UI Form

• Chakra UI Form

• Yup Validations

• Zod Validations

License

Copyright (c) Thanga Ganapathy (MIT License).