react-form

Set of React form components based on react-formsy.

Install

npm install @doctolib/react-form

Usage

Form

Refer to formsy-react.

import {Form} from '@doctolib/react-form';
const Component = () => <Form/>;

HOC

Wrapper used to create custom control compatible with react-form validation. All props, states and methods are accessible via props in the wrapped component.

import {HOC} from '@doctolib/react-form';
const Component = HOC((...props) => <input {...props} />);

Input

Input component.

import {Input} from '@doctolib/react-form';
const Component = () => <Input name="firstname"/>;

Textarea

Textarea component.

import {Textarea} from '@doctolib/react-form';
const Component = () => <Textarea name="comment"/>;

Select

Select component.

import {Select} from '@doctolib/react-form';
const Component = () => <Select options={{value: 'Label'}} name="select"/>;

InputAddon

Addon for input.

import {Input, InputAddon} from '@doctolib/react-form';
const Component = () => (
  <Input
    name="firstname"
    leftAddon={<InputAddon>hey</InputAddon>}
    rightAddon={<InputAddon>you</InputAddon>}
  />
);

RadioGroup

Group of radios.

import {RadioGroup} from '@doctolib/react-form';
const Component = () => (
  <RadioGroup
    name="radio"
    options={{value: 'Label'}}
  />
);

CheckboxGroup

Group of checkboxes.

import {CheckboxGroup} from '@doctolib/react-form';
const Component = () => (
  <CheckboxGroup
    name="checkbox"
    options={{value: 'Label'}}
  />
);

License

MIT