Breadcrumb stories description & defaultValue -- clean up code

eea · Jan 14, 2022 · 186ab65 · 186ab65
1 parent 879b640
commit 186ab65
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 15 deletions.
diff --git a/src/customizations/components/theme/Breadcrumbs/Breadcrumb.stories.js b/src/customizations/components/theme/Breadcrumbs/Breadcrumb.stories.js
@@ -2,7 +2,7 @@ import React from 'react';
 import { Breadcrumb } from 'semantic-ui-react';
 
 export default {
-  title: 'Components/Breadcrumb/Breadcrumb 2',
+  title: 'Components/Breadcrumb',
   component: Breadcrumb,
   parameters: {
     actions: {
@@ -13,25 +13,63 @@ export default {
     icon: {
       control: { type: 'select' },
       options: ['right chevron', 'right arrow', 'caret right'],
+      description:"breadcrumb divider icon",
+      table:{
+        type:{
+          summary:"string"
+        },
+        defaultValue: {
+          summary: 'right chevron',
+        },
+      }
     },
     size: {
       control: { type: 'select' },
       options: ['mini', 'tiny', 'small', 'large', 'big', 'huge', 'massive'],
+      description:"breadcrumb size",
+      table:{
+        type:{
+          summary:"string"
+        },
+        defaultValue: {
+          summary: 'small',
+        },
+      }
     },
+    sections:{
+      description:"breadcrumb tabs",
+      table:{
+        type:{
+          summary:"Object"
+        },
+        defaultValue: {
+          summary: ' \""\ '
+        },
+      }
+    }
   },
 };
 
 //const Template = (args) => <Breadcrumb {...args}></Breadcrumb>;
 
-const Template = (args) => 
-      <Breadcrumb size={args.size}>
-          {args.sections.map((section,index) => (
-            <>
-              <Breadcrumb.Section key={section.key} link={section.link} active={index === args.sections.length - 1}>{section.content} </Breadcrumb.Section>
-              {index !== args.sections.length - 1 && <Breadcrumb.Divider icon={`${args.icon}`} />}
-            </>
-          ))}
-      </Breadcrumb>;
+const Template = (args) => (
+  <Breadcrumb size={args.size}>
+    {args.sections.map((section, index) => (
+      <>
+        <Breadcrumb.Section
+          key={section.key}
+          link={section.link}
+          active={index === args.sections.length - 1}
+        >
+          {section.content}{' '}
+        </Breadcrumb.Section>
+        {index !== args.sections.length - 1 && (
+          <Breadcrumb.Divider icon={`${args.icon}`} />
+        )}
+      </>
+    ))}
+  </Breadcrumb>
+);
 
 export const Default = Template.bind({});
 Default.args = {

diff --git a/src/customizations/components/theme/Breadcrumbs/Breadcrumbs.stories.jsx b/src/customizations/components/theme/Breadcrumbs/Breadcrumbs.stories.jsx
@@ -23,8 +23,8 @@ export const Breadcrumb = injectIntl(({ children, ...args }) => {
   );
 });
 
-export default {
-  title: 'Components/Breadcrumb/Breadcrumb 1',
-  component: Breadcrumb,
-  argTypes: {},
-};
+// export default {
+//   title: 'Components/Breadcrumb/Breadcrumb 1',
+//   component: Breadcrumb,
+//   argTypes: {},
+// };