Use named exports.

Author: twisty

examples/playground/src/options.js

@@ -2,16 +2,14 @@
 
 import React from 'react';
 import PropTypes from 'prop-types';
-import FRC from 'formsy-react-components';
-
-const { Checkbox, RadioGroup } = FRC;
+import { Checkbox, RadioGroup, Form } from 'formsy-react-components';
 
 const Options = (props) => {
 
     const { disabledChoice, layoutChoice, validateOnSubmitChoice, validatePristineChoice, onChangeOption } = props;
 
     const optionsForm = (
-        <FRC.Form>
+        <Form>
             <RadioGroup
                 name="layout"
                 type="inline"
@@ -45,7 +43,7 @@ const Options = (props) => {
                 label="disabled"
                 onChange={onChangeOption}
             />
-        </FRC.Form>
+        </Form>
     );
 
     return (

examples/playground/src/playground.js

@@ -2,9 +2,7 @@
 
 import React from 'react';
 import PropTypes from 'prop-types';
-import FRC from 'formsy-react-components';
-
-const { Checkbox, CheckboxGroup, Input, RadioGroup, Row, Select, File, Textarea } = FRC;
+import { Checkbox, CheckboxGroup, Input, RadioGroup, Row, Select, File, Textarea, Form } from 'formsy-react-components';
 
 const Playground = (props) => {
 
@@ -58,7 +56,7 @@ const Playground = (props) => {
     ];
 
     return (
-        <FRC.Form
+        <Form
             onSubmit={submitForm}
             layout={layoutChoice}
             validateOnSubmit={validateOnSubmitChoice}
@@ -293,7 +291,7 @@ const Playground = (props) => {
                     <input className="btn btn-primary" formNoValidate={true} type="submit" defaultValue="Submit" />
                 </Row>
             </fieldset>
-        </FRC.Form>
+        </Form>
     );
 }
 

src/main.js

@@ -1,28 +1,26 @@
-import Checkbox from './components/checkbox';
-import CheckboxGroup from './components/checkbox-group';
+import CheckboxComponent from './components/checkbox';
+import CheckboxGroupComponent from './components/checkbox-group';
+import InputComponent from './components/input';
+import FileComponent from './components/input-file';
+import RadioGroupComponent from './components/radio-group';
+import SelectComponent from './components/select';
+import TextareaComponent from './components/textarea';
 import Icon from './components/icon';
-import Input from './components/input';
-import File from './components/input-file';
 import Form from './form';
-import RadioGroup from './components/radio-group';
 import Row from './components/row';
-import Select from './components/select';
-import Textarea from './components/textarea';
 import OptionsProvider from './hoc/options-provider';
 import FormsyReactComponent from './hoc/component';
 
-const FRC = {
-    Checkbox:           FormsyReactComponent(Checkbox),
-    CheckboxGroup:      FormsyReactComponent(CheckboxGroup),
-    Input:              FormsyReactComponent(Input),
-    File:               FormsyReactComponent(File),
-    RadioGroup:         FormsyReactComponent(RadioGroup),
-    Select:             FormsyReactComponent(Select),
-    Textarea:           FormsyReactComponent(Textarea),
-    Form:               Form,
-    Icon:               Icon,
-    OptionsProvider:    OptionsProvider,
-    Row:                Row
+export const Checkbox = FormsyReactComponent(CheckboxComponent);
+export const CheckboxGroup = FormsyReactComponent(CheckboxGroupComponent);
+export const Input = FormsyReactComponent(InputComponent);
+export const File = FormsyReactComponent(FileComponent);
+export const RadioGroup = FormsyReactComponent(RadioGroupComponent);
+export const Select = FormsyReactComponent(SelectComponent);
+export const Textarea = FormsyReactComponent(TextareaComponent);
+export {
+    Icon,
+    Form,
+    OptionsProvider,
+    Row
 };
-
-export default FRC;