Merge pull request #457 from Groww-OSS/develop

Develop to Main [16th July 2024] [Mint Icon Storybook]
Groww-OSS · Jul 16, 2024 · bd8e3b5 · bd8e3b5
2 parents d803aec + 695a249
commit bd8e3b5
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 3 deletions.
diff --git a/packages/icon-store/README.md b/packages/icon-store/README.md
@@ -30,11 +30,13 @@ node scripts/generateMaterialIcons.js
 .
 ├── mi                       // minified material svg's react components
 ├── custom                   // minified custom svg's react components
+├── mint-icons               // minified mint-icons svg's react components
 └── types.d.ts               // exports react component type  
 │ 
 ├── svgs
 │   ├── mi
-│   └── custom
+│   ├── custom
+│   └── mint-icons
 │ 
 ├── scripts
 │   ├── generateMaterialIcons.js  // Script to copy and filter material icons from google's github repo

diff --git a/packages/ui-toolkit/.storybook/main.js b/packages/ui-toolkit/.storybook/main.js
@@ -5,5 +5,8 @@ module.exports = {
   "addons": [
     "@storybook/addon-links",
     "@storybook/addon-essentials"
-  ]
+  ],
+  typescript: {
+    reactDocgen: 'none',
+  }
 }
diff --git a/packages/ui-toolkit/package.json b/packages/ui-toolkit/package.json
@@ -113,7 +113,7 @@
     "typescript": "4.5.5"
   },
   "dependencies": {
-    "@groww-tech/icon-store": "1.4.1",
+    "@groww-tech/icon-store": "1.4.6",
     "@groww-tech/mint-css": "0.1.2",
     "flat-carousel": "0.0.1",
     "lodash.debounce": "^4.0.8",

diff --git a/packages/ui-toolkit/stories/IconStore.stories.tsx b/packages/ui-toolkit/stories/IconStore.stories.tsx
@@ -4,6 +4,7 @@ import React from 'react';
 
 import * as imgIcons from '@groww-tech/icon-store/custom';
 import * as materialIcons from '@groww-tech/icon-store/mi';
+import * as mintIcons from '@groww-tech/icon-store/mint-icons';
 
 import { copyToClipboard } from '../src/utils/helper';
 
@@ -67,3 +68,28 @@ export const AllMaterialIcons = () => {
     </div>
   );
 };
+
+
+export const AllMintIcons = () => {
+  return (
+    <div className="story_icon_all_image_list">
+      {
+        Object.keys(mintIcons).map(icon => {
+          const IconComponent = mintIcons[icon];
+          const importCode = `import { ${icon} } from '@groww-tech/icon-store/mint-icons';`;
+
+          return (
+            (<div
+              key={icon}
+              className="story_icon_all_image_list_item"
+              onClick={() => { copyToClipboard(importCode); }}
+            >
+              <IconComponent size={48}/>
+              <div className='bodyLarge'>{icon}</div>
+            </div>)
+          );
+        })
+      }
+    </div>
+  );
+};