How to use the react-formal.addInputTypes function in react-formal

const Form = require('react-formal')
const { object, string, number, date } = require('yup')

// if we are using a different set of inputs
// we can set some defaults once at the beginning
Form.addInputTypes(require('react-formal-inputs'))

const modelSchema = object({
  name: object({
    first: string().required('please enter a first name'),
    last: string().required('please enter a surname'),
  }),

  dateOfBirth: date().max(new Date(), "You can't be born in the future!"),

  colorId: number()
    .nullable()
    .required('Please select a color'),
})

render(
  <form></form>

import MuiThemeProvider from "material-ui/styles/MuiThemeProvider";
import muiTheme from "../styles/mui-theme";
import theme from "../styles/theme";
import { StyleSheet, css } from "aphrodite";
import injectTapEventPlugin from "react-tap-event-plugin";
import Form from "react-formal";
import GSTextField from "./forms/GSTextField";
import GSDateField from "./forms/GSDateField";
import GSScriptField from "./forms/GSScriptField";
import GSSelectField from "./forms/GSSelectField";
import GSPasswordField from "./forms/GSPasswordField";

// Needed for MaterialUI
injectTapEventPlugin();

Form.addInputTypes({
  string: GSTextField,
  number: GSTextField,
  date: GSDateField,
  email: GSTextField,
  script: GSScriptField,
  select: GSSelectField,
  password: GSPasswordField
});

const styles = StyleSheet.create({
  root: {
    ...theme.text.body,
    height: "100%"
  }
});

import React from 'react';
import { Link, RouteHandler, Navigation, State } from 'react-router';
import Layout from './_layout/base';
import {Grid, Row, Col, Nav}  from 'react-bootstrap';
import { NavItemLink } from 'react-router-bootstrap';
import configureStore from '../store/configure';
import { Provider } from 'react-redux';
import { Map } from 'immutable';
import cx from 'classnames';
import Form from 'react-formal';
import _ from 'lodash';

/*Plugin configure*/

Form.addInputTypes(
  require('react-formal-inputs')
);


import posts from './post/definition';
import events from './event/definition';

const store = configureStore(Map({
  collections: Map({
    posts: Map({}),
    events:Map({}),
    topics: Map({}),
    users: Map({}),
  }),
  resources: Map({
    posts,