docs: Includes EvaluationForm in Form components

Author: alizeleal

stories/AutoComplete/AutoComplete.mdx

@@ -2,6 +2,8 @@ import { Meta, Canvas, Story, ArgsTable } from '@storybook/addon-docs';
 import { Header } from '../shared';
 import AutoComplete from '../../components/AutoComplete';
 import { Default, Required, Disabled, WithHelperText, WithLabel, WithError, WithSkin } from './AutoComplete.stories.jsx';
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
 
 <Meta title="Forms/AutoComplete" component={AutoComplete}  />
 
@@ -64,3 +66,5 @@ import AutoComplete from '@catho/quantum/AutoComplete';
 <Canvas>
   <Story of={WithSkin}/>
 </Canvas>
+
+<EvaluationForm componentName="AutoComplete" />

stories/Breakpoints/Breakpoints.mdx

@@ -3,6 +3,8 @@ import { Meta } from '@storybook/addon-docs';
 import { Alert } from '../../components';
 import { Header } from '../shared'
 import { StyledDivExample } from './styles'
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
 
 <Meta title="Foundation/Breakpoints" />
 
@@ -61,4 +63,6 @@ const StyledDiv = styled.div`
 
 Test the div in different sizes:
 
-<StyledDivExample>Test me in different sizes =)</StyledDivExample>
+<StyledDivExample>Test me in different sizes =)</StyledDivExample>
+
+<EvaluationForm componentName="Breakpoints" />

stories/Checkbox/Checkbox.mdx

@@ -9,6 +9,8 @@ import {
   Checked,
   Disabled,
 } from './Checkbox.stories.jsx';
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
 
 <Meta title="Forms/Checkbox" component={Checkbox}  />
 
@@ -46,4 +48,6 @@ import Checkbox from '@catho/quantum/Checkbox';
 
 <Canvas>
   <Story of={Disabled} />
-</Canvas>
+</Canvas>
+
+<EvaluationForm componentName="Checkbox" />

stories/Checkbox/CheckboxGroup.mdx

@@ -14,6 +14,9 @@ import {
   ControlledGroup,
 } from './CheckboxGroup.stories.jsx';
 
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
+
 <Meta title="Forms/Checkbox/CheckboxGroup" component={CheckboxGroup}  />
 
 <Header title="Checkbox Group">
@@ -80,4 +83,6 @@ import CheckboxGroup from '@catho/quantum/Checkbox/CheckboxGroup';
 
 <Canvas>
   <Story of={ControlledGroup} />
-</Canvas>
+</Canvas>
+
+<EvaluationForm componentName="CheckboxGroup" />

stories/Dropdown/Dropdown.mdx

@@ -14,6 +14,9 @@ import {
   Controlled
 } from './Dropdown.stories.jsx';
 
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
+
 <Meta title="Forms/Dropdown" component={Dropdown}  />
 
 <Header title="Dropdown">
@@ -99,4 +102,6 @@ import Dropdown from '@catho/quantum/Dropdown';
 
 <Canvas>
   <Story of={Controlled}/>
-</Canvas>
+</Canvas>
+
+<EvaluationForm componentName="Dropdown" />

stories/DropdownLight/DropdownLight.mdx

@@ -18,6 +18,9 @@ import {
   SelectedItemControlled
 } from './DropdownLight.stories.jsx';
 
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
+
 <Meta title="Forms/DropdownLight" component={DropdownLight}  />
 
 <Header title="DropdownLight">
@@ -106,3 +109,4 @@ import DropdownLight from '@catho/quantum/DropdownLight';
   <Story of={SelectedItemControlled}/>
 </Canvas>
 
+<EvaluationForm componentName="DropdownLight" />

stories/Form/Form.mdx

@@ -8,6 +8,9 @@ import {
   WithCustomValidation
 } from './Form.stories.jsx';
 
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
+
 <Meta title="Forms/Form" component={Form}  />
 
 <Header title="Form">
@@ -60,4 +63,6 @@ messages.
 
 <Canvas>
   <Story of={WithCustomValidation}/>
-</Canvas>
+</Canvas>
+
+<EvaluationForm componentName="Form" />

stories/Icon/Icon.mdx

@@ -3,6 +3,8 @@ import { Meta, Story } from '@storybook/addon-docs';
 import Header from '../shared/Header';
 import { ExampleIcons, ExampleIncorrectIcons } from './ExampleIcons';
 import Catalogue from './Catalogue';
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
 
 <Meta title="Foundation/Icons" />
 
@@ -65,4 +67,6 @@ element and no icon will render.
 
 ### Available Icons
 
-<Catalogue/>
+<Catalogue/>
+
+<EvaluationForm componentName="Icons" />

stories/Input/Input.mdx

@@ -22,6 +22,10 @@ import {
   ControlledExample,
 } from './Input.stories.jsx';
 
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
+
+
 <Meta title="Forms/Input" component={Input}  />
 
 <Header title="Input">
@@ -125,3 +129,5 @@ import Input from '@catho/quantum/Input';
 <Canvas>
   <Story of={ControlledExample} />
 </Canvas>
+
+<EvaluationForm componentName="Input" />

stories/RadioGroup/RadioGroup.mdx

@@ -13,6 +13,9 @@ import {
   Button,
 } from './RadioGroup.stories.jsx';
 
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
+
 <Meta title="Forms/RadioGroup" component={RadioGroup}  />
 
 <Header title="Radio group">
@@ -68,3 +71,5 @@ import RadioGroup from '@catho/quantum/RadioGroup';
 <Canvas>
   <Story of={Inline} />
 </Canvas>
+
+<EvaluationForm componentName="RadioGroup" />

stories/RangeSlider/RangeSlider.mdx

@@ -14,6 +14,9 @@ import {
   ControlledExample,
 } from './RangeSlider.stories.jsx';
 
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
+
 <Meta title="Forms/RangeSlider" component={RangeSlider}  />
 
 <Header title="RangeSlider">
@@ -85,4 +88,6 @@ The same is applied when an object is used in value prop.
 
 <Canvas>
   <Story of={ControlledExample} />
-</Canvas>
+</Canvas>
+
+<EvaluationForm componentName="RangeSlider" />

stories/TextArea/TextArea.mdx

@@ -2,6 +2,8 @@ import { Meta, Canvas, Story, ArgsTable } from '@storybook/addon-docs';
 import { Header } from '../shared';
 import TextArea from '../../components/TextArea';
 import { Default, Disabled, Required, WithAutoSize, WithCustomAutoSize, WithHelperText, WithError, WithLabel } from './TextArea.stories.jsx';
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
 
 <Meta title="Forms/TextArea" component={TextArea}  />
 
@@ -70,4 +72,6 @@ import TextArea from '@catho/quantum/TextArea';
 
 <Canvas>
   <Story of={WithError}/>
-</Canvas>
+</Canvas>
+
+<EvaluationForm componentName="TextArea" />

stories/Theme/Theme.mdx

@@ -3,6 +3,8 @@ import { Meta } from '@storybook/addon-docs';
 import { Header } from '../shared'
 
 import { BreakpointsProperties, ColorIntensity, SpacingValues } from './Theme';
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
 
 <Meta title="Foundation/Theme" />
 
@@ -129,4 +131,6 @@ badge: {
     },
   },
 }
-```
+```
+
+<EvaluationForm componentName="Theme" />

stories/Toggle/Toogle.mdx

@@ -3,6 +3,8 @@ import { Meta, Canvas, Story, ArgsTable } from '@storybook/addon-docs';
 import Toggle from '../../components/Toggle';
 import { Default, Checked, WithLeftLabel, WithRightLabel } from './Toggle.stories.jsx';
 import { Header } from '../shared';
+import EvaluationForm from '../../stories/shared/EvaluationForm'
+
 
 <Meta title="Forms/Toggle" component={Toggle}  />
 
@@ -50,3 +52,4 @@ import Toggle from '@catho/quantum/Toggle';
 </Canvas>
 
 
+<EvaluationForm componentName="Toggle" />