Prettier fixes

src/customizations/components/theme/Form/Radio.stories.js

@@ -166,30 +166,28 @@ function Binary({
         <Message header="Error Message" content={errorMessage} negative />
       ) : null}
       <Form.Field error={invalid}>
-
-          <Radio
-            className="eeaRadio"
-            label="Yes"
-            name="radioGroup"
-            value="yes"
-            checked={active === 'yes'}
-            onChange={handleChange}
-            id="radio-yes"
-          ></Radio>
+        <Radio
+          className="eeaRadio"
+          label="Yes"
+          name="radioGroup"
+          value="yes"
+          checked={active === 'yes'}
+          onChange={handleChange}
+          id="radio-yes"
+        ></Radio>
         <label htmlFor="radio-yes"> </label>
       </Form.Field>
       <Form.Field error={invalid}>
-
-          <Radio
-            className="eeaRadio"
-            label="No"
-            name="radioGroup"
-            value="no"
-            checked={active === 'no'}
-            onChange={handleChange}
-            id="radio-no"
-          ></Radio>
-         <label htmlFor="radio-no"> </label>
+        <Radio
+          className="eeaRadio"
+          label="No"
+          name="radioGroup"
+          value="no"
+          checked={active === 'no'}
+          onChange={handleChange}
+          id="radio-no"
+        ></Radio>
+        <label htmlFor="radio-no"> </label>
       </Form.Field>
     </Form>
   );

src/customizations/components/theme/Header/HeaderComponent.stories.js

@@ -1,52 +1,49 @@
 import React from 'react';
-import { Header, Icon } from 'semantic-ui-react';
+import { Header, Container } from 'semantic-ui-react';
 
 export default {
   title: 'Components/Header',
   component: Header,
-  argTypes: {
-    size: {
-      control: { type: 'inline-radio' },
-      options: ['huge', 'large', 'medium', 'small', 'tiny'],
-    },
-    textAlign: {
-      control: { type: 'inline-radio' },
-      options: ['left', 'center', 'right', 'justified'],
-    },
-    floated: {
-      control: { type: 'inline-radio' },
-      options: [false, 'left', 'right'],
-    },
-  },
 };
 
-function HeaderContent({ content, size, icon, textAlign }) {
-  return (
-    <Header size={size} icon={icon} textAlign={textAlign}>
-      {icon && <Icon name="users" circular />}
-      <Header.Content>{content}</Header.Content>
-    </Header>
-  );
-}
-
-const Template = (args) => <HeaderContent {...args}></HeaderContent>;
+const Template = (args) => (
+  <Container>
+    <h1>Heading 1</h1>
+    <h1>
+      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mattis arcu
+      egestas ultrices mollis.
+    </h1>
+    <hr></hr>
+    <h2>Heading 2</h2>
+    <h2>
+      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mattis arcu
+      egestas ultrices mollis.
+    </h2>
+    <hr></hr>
+    <h3>Heading 3</h3>
+    <h3>
+      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mattis arcu
+      egestas ultrices mollis.
+    </h3>
+    <hr></hr>
+    <h4>Heading 4</h4>
+    <h4>
+      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mattis arcu
+      egestas ultrices mollis.
+    </h4>
+    <hr></hr>
+    <h5>Heading 5</h5>
+    <h5>
+      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mattis arcu
+      egestas ultrices mollis.
+    </h5>
+    <hr></hr>
+    <h6>Heading 6</h6>
+    <h6>
+      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec mattis arcu
+      egestas ultrices mollis.
+    </h6>
+  </Container>
+);
 
 export const Default = Template.bind({});
-Default.args = {
-  children: 'Default Header',
-};
-
-export const Playground = Template.bind({});
-Playground.args = {
-  content: 'Playground Header',
-  subheader: 'Subheader',
-  size: 'medium',
-  textAlign: 'left',
-  dividing: false,
-  color: 'black',
-  floated: 'left',
-  disabled: false,
-  sub: false,
-  block: false,
-  attached: false,
-};

src/customizations/components/theme/Menu/Menu.stories.js

@@ -9,7 +9,19 @@ export default {
       handles: ['click'],
     },
   },
-  argTypes: {},
+  argTypes: {
+    items: {
+      description: 'array of menu tab names',
+      table: {
+        type: {
+          summary: 'object',
+        },
+        defaultValue: {
+          summary: ' "" ',
+        },
+      },
+    },
+  },
 };
 
 function MenuContent({ items, secondary, pointing, tabular, text, vertical }) {
@@ -69,3 +81,62 @@ Playground.args = {
   text: false,
   vertical: false,
 };
+
+Playground.argTypes = {
+  secondary: {
+    description:
+      'a menu can adjust its appearance to de-emphasize its contents',
+    table: {
+      type: {
+        summary: 'boolean',
+      },
+      defaultValue: {
+        summary: false,
+      },
+    },
+  },
+  pointing: {
+    description: 'a menu can point to show its relationship to nearby content',
+    table: {
+      type: {
+        summary: 'boolean',
+      },
+      defaultValue: {
+        summary: false,
+      },
+    },
+  },
+  tabular: {
+    description: 'a menu can be formatted to show tabs of information',
+    table: {
+      type: {
+        summary: 'boolean',
+      },
+      defaultValue: {
+        summary: false,
+      },
+    },
+  },
+  text: {
+    description: 'a menu can be formatted for text content.',
+    table: {
+      type: {
+        summary: 'boolean',
+      },
+      defaultValue: {
+        summary: false,
+      },
+    },
+  },
+  vertical: {
+    description: 'vertical menu displays elements vertically',
+    table: {
+      type: {
+        summary: 'boolean',
+      },
+      defaultValue: {
+        summary: false,
+      },
+    },
+  },
+};