Confirm stories added description & default value

eea · Jan 14, 2022 · 85cda14 · 85cda14
1 parent cb6f25b
commit 85cda14
Showing 1 changed file with 42 additions and 3 deletions.
diff --git a/src/customizations/components/theme/Confirm/Confirm.stories.js b/src/customizations/components/theme/Confirm/Confirm.stories.js
@@ -4,11 +4,49 @@ import { Button, Confirm } from 'semantic-ui-react';
 export default {
   title: 'Components/Confirm',
   component: Confirm,
+  parameters: {
+    actions: {
+      handles: ['click'],
+    },
+  },
   argTypes: {
     size: {
       control: { type: 'inline-radio' },
       options: ['mini', 'tiny', 'small', 'large'],
+      description:"confirmation modal size",
+      table:{
+        type:{summary:"string"},
+        defaultValue:{summary:'small'}
+      }
+    },
+    confirmHeader:{
+      description:"modal header",
+      table:{
+        type:{summary:'string'},
+        defaultValue:{summary:' \""\ '}
+      }
+    },
+    content:{
+      description:"modal message",
+      table:{
+        type:{summary:'string'},
+        defaultValue:{summary:' \""\ '}
+      }
+    },
+    cancelButton:{
+      description:"cancel button text",
+      table:{
+        type:{summary:'string'},
+        defaultValue:{summary:' \""\ '}
+      }
     },
+    confirmButton:{
+      description:"confirmation button text",
+      table:{
+        type:{summary:'string'},
+        defaultValue:{summary:' \""\ '}
+      }
+    }
   },
 };
 
@@ -30,10 +68,11 @@ function ConfirmContent({
   };
   return (
     <div>
-      <Button primary onClick={openConfirm}>
+      <Button className="eeaPrimaryButton" onClick={openConfirm}>
         Show Confirmation
       </Button>
       <Confirm
+        className="eeaModal"
         open={open}
         header={confirmHeader}
         onCancel={closeConfirm}
@@ -51,9 +90,9 @@ const Template = (args) => <ConfirmContent {...args}></ConfirmContent>;
 
 export const Default = Template.bind({});
 Default.args = {
+  size: 'small',
   confirmHeader: 'This is the confirm header',
+  content: 'Are you sure?',
   cancelButton: 'Cancel',
   confirmButton: 'OK',
-  content: 'Are you sure?',
-  size: 'small',
 };