var Form = rsui.form.Form,
    Button = rsui.form.Button,
    clickHandler = function() {
      component.setState({loading: true});
      setTimeout(function() {
        component.setState({loading: false});
      }, 2000);
    };
var component = <Form>
  <p>
    Form content can be overlaid with a loading indicator by setting the "loading" state to true.
  </p>
  <Button type="button" onClick={clickHandler} label="Click me to load"/>
</Form>

var Form = rsui.form.Form,
    Control = rsui.form.Control;
var component = <Form>
  <p>
    Form controls will wrap any content in a field and label structure.
  </p>
  <Control label="The Label">
    This is the control content.
  </Control>
</Form>

var Form = rsui.form.Form,
    Control = rsui.form.Control;
var component = <Form>
  <p>
    The error rendering can be overridden by overriding the rsui.form.errorRenderer function.
  </p>
  <Control label="The Label" error="The form field is invalid">
    <div>
      This is the control content.
    </div>
  </Control>
</Form>

Forms

Loading Form

Form Control

Error State