import { rxForm } from 'rx-react-form'
 
interface Props {
    onSubmit: () => void
    onError?: () => void
    name: string
}
 
@rxForm<Props>({
    debounce: 1000,
    fields: {
        name: {
            validation: (value) => {
                if (value.length > 0) {
                    return 'name should be defined'
                }
            },
            value: (props) => {
                return props.name
            }
        },
        email: {}
    }
})
class SimpleForm extends React.Component<Props, any> {
    render() {
        return (
            <form>
                <div>
                    <input name="name" placeholder="enter your name" />
                    { !!this.props.name.error &&
                        <span>{ this.props.name.error }</span>
                    }
                </div>
                <div>
                    <input name="email" placeholder="modify your email" />
                </div>
                <div>
                    <button type="submit">Submit form</button>
                </div>
            </form>
        )
    }
}
 
<SimpleForm name="john snow" onSubmit={...} onError={...} />