chore: section-bignumbers Center in the storybook

aziontech · Oct 2, 2024 · e23a7d6 · e23a7d6
1 parent 14bd1db
commit e23a7d6
Showing 1 changed file with 50 additions and 33 deletions.
diff --git a/src/stories/templates/sections/section-bignumbers.stories.js b/src/stories/templates/sections/section-bignumbers.stories.js
@@ -13,19 +13,10 @@ export default {
 ${Rules.section.overline}
 ${Rules.section.title}
 ${Rules.section.bigNumbers}
-        `,
-      },
-    },
-  },
-  // argTypes: {
-  //   'justify': {
-  //     control: {
-  //       type: 'select',
-  //     },
-  //     options: ['center', 'start'],
-  //     description: 'Justify content alignment',
-  //   },
-  // }
+        `
+      }
+    }
+  }
 }
 
 const MOCK = {
@@ -58,33 +49,59 @@ const MOCK = {
   }
 }
 
+const MOCK_CENTER = {
+  "title": "Achieve Unmatched Protection with Azion's Bot Management",
+  "overline": "Powerful Metrics Showcasing",
+  "data": {
+    "justify": "center",
+    "items": [
+      {
+        "icon": "pi pi-verified",
+        "title": "4mi",
+        "description": "Number of DDoS threats blocked "
+      },
+      {
+        "icon": "pi pi-shield",
+        "title": "<5s",
+        "description": "Detected threat properties worldwide"
+      },
+      {
+        "icon": "pi pi-code",
+        "title": "7",
+        "description": "Detected threat properties worldwide"
+      },
+      {
+        "icon": "pi pi-stopwatch",
+        "title": "80k+",
+        "description": "Detected threat properties worldwide"
+      }
+    ]
+  }
+}
+
 const template = `
   <Container class="surface-ground">
     <SectionBigNumbers v-bind="args" />
   </Container>
 `
 
-const Template = (args) => ({
-  components: {
-    SectionBigNumbers,
-    Container
-  },
-  setup() {
-    return { args }
-  },
-  template: template
-})
+const config = (args) => {
+  return {
+    components: {
+      SectionBigNumbers,
+      Container
+    },
+    setup() {
+      return { args }
+    },
+    template: template
+  }
+}
 
+const Template = (args) => (config(args))
 export const Default = Template.bind({})
 Default.args = MOCK
 
-Default.parameters = {
-  docs: {
-    description: {
-      story: ''
-    },
-    source: {
-      code: template
-    }
-  }
-};
+const Template2 = (args) => (config(args))
+export const Center = Template2.bind({})
+Center.args = MOCK_CENTER