@seegno/react-forms NPM

Seegno React Forms

Manage React form state the easy way and validate with json-schema.

Installation

yarn add @seegno/react-forms

Make sure you have at least version 16.8 of React:

yarn add react@^16.8.0

Usage

import { FormProvider, useField } from '@seegno/react-forms';

function Input({ name }) {
  const { onChange, value } = useField(name);

  return (
    <input
      name={name}
      onChange={event => onChange(event.target.value)}
      value={value}
    />
  );
}

function Form() {
  return (
    <FormProvider
      jsonSchema={{
        properties: {
          foo: { type: 'string' }
        },
        type: 'object'
      }}
      onSubmit={values => console.log('submit', values)}
    >
      {({ submit }) => (
        <form onSubmit={submit}>
          <Input name={'foo'} />

          <button type={'submit'}>
            {'Submit'}
          </button>
        </form>
      )}
    </FormProvider>
  );
}