diff --git a/.eslintrc.js b/.eslintrc.js
index 1458546..a1923e0 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -18,6 +18,7 @@ module.exports = {
         'react/default-props-match-prop-types': 'off',
         'jest/no-deprecated-functions': 'off',
         'no-console': 'off',
+        noUselessIndex: false,
       },
     },
   ],
diff --git a/package.json b/package.json
index 059cbf3..fe2a439 100644
--- a/package.json
+++ b/package.json
@@ -66,6 +66,8 @@
     "eslint": "8.36.0",
     "eslint-plugin-jest": "27.2.1",
     "eslint-plugin-storybook": "0.6.12",
+    "figma-js": "1.16.0",
+    "figma-transformer": "2.1.0",
     "lint-staged": "13.2.0",
     "prettier": "2.8.4",
     "react": "18.2.0",
diff --git a/src/exports/CRUD.tsx b/src/exports/CRUD.tsx
new file mode 100644
index 0000000..b6f5192
--- /dev/null
+++ b/src/exports/CRUD.tsx
@@ -0,0 +1,162 @@
+import { lazy } from 'react';
+
+export const Edit = lazy(async () => {
+  const m = await import('./../icons/Edit');
+  return { default: m.Edit };
+});
+export const Cog = lazy(async () => {
+  const m = await import('./../icons/Cog');
+  return { default: m.Cog };
+});
+export const Nut = lazy(async () => {
+  const m = await import('./../icons/Nut');
+  return { default: m.Nut };
+});
+export const Wrench = lazy(async () => {
+  const m = await import('./../icons/Wrench');
+  return { default: m.Wrench };
+});
+export const Ellipsis = lazy(async () => {
+  const m = await import('./../icons/Ellipsis');
+  return { default: m.Ellipsis };
+});
+export const Wand = lazy(async () => {
+  const m = await import('./../icons/Wand');
+  return { default: m.Wand };
+});
+export const Check = lazy(async () => {
+  const m = await import('./../icons/Check');
+  return { default: m.Check };
+});
+export const Form = lazy(async () => {
+  const m = await import('./../icons/Form');
+  return { default: m.Form };
+});
+export const Batchdeny = lazy(async () => {
+  const m = await import('./../icons/Batchdeny');
+  return { default: m.Batchdeny };
+});
+export const Batchaccept = lazy(async () => {
+  const m = await import('./../icons/Batchaccept');
+  return { default: m.Batchaccept };
+});
+export const Controls = lazy(async () => {
+  const m = await import('./../icons/Controls');
+  return { default: m.Controls };
+});
+export const Plus = lazy(async () => {
+  const m = await import('./../icons/Plus');
+  return { default: m.Plus };
+});
+export const CloseAlt = lazy(async () => {
+  const m = await import('./../icons/CloseAlt');
+  return { default: m.CloseAlt };
+});
+export const Cross = lazy(async () => {
+  const m = await import('./../icons/Cross');
+  return { default: m.Cross };
+});
+export const Trash = lazy(async () => {
+  const m = await import('./../icons/Trash');
+  return { default: m.Trash };
+});
+export const Pinalt = lazy(async () => {
+  const m = await import('./../icons/Pinalt');
+  return { default: m.Pinalt };
+});
+export const Unpin = lazy(async () => {
+  const m = await import('./../icons/Unpin');
+  return { default: m.Unpin };
+});
+export const Add = lazy(async () => {
+  const m = await import('./../icons/Add');
+  return { default: m.Add };
+});
+export const Subtract = lazy(async () => {
+  const m = await import('./../icons/Subtract');
+  return { default: m.Subtract };
+});
+export const Close = lazy(async () => {
+  const m = await import('./../icons/Close');
+  return { default: m.Close };
+});
+export const Delete = lazy(async () => {
+  const m = await import('./../icons/Delete');
+  return { default: m.Delete };
+});
+export const Passed = lazy(async () => {
+  const m = await import('./../icons/Passed');
+  return { default: m.Passed };
+});
+export const Changed = lazy(async () => {
+  const m = await import('./../icons/Changed');
+  return { default: m.Changed };
+});
+export const Failed = lazy(async () => {
+  const m = await import('./../icons/Failed');
+  return { default: m.Failed };
+});
+export const Clear = lazy(async () => {
+  const m = await import('./../icons/Clear');
+  return { default: m.Clear };
+});
+export const Comment = lazy(async () => {
+  const m = await import('./../icons/Comment');
+  return { default: m.Comment };
+});
+export const Commentadd = lazy(async () => {
+  const m = await import('./../icons/Commentadd');
+  return { default: m.Commentadd };
+});
+export const Requestchange = lazy(async () => {
+  const m = await import('./../icons/Requestchange');
+  return { default: m.Requestchange };
+});
+export const Comments = lazy(async () => {
+  const m = await import('./../icons/Comments');
+  return { default: m.Comments };
+});
+export const Chat = lazy(async () => {
+  const m = await import('./../icons/Chat');
+  return { default: m.Chat };
+});
+export const Lock = lazy(async () => {
+  const m = await import('./../icons/Lock');
+  return { default: m.Lock };
+});
+export const Unlock = lazy(async () => {
+  const m = await import('./../icons/Unlock');
+  return { default: m.Unlock };
+});
+export const Key = lazy(async () => {
+  const m = await import('./../icons/Key');
+  return { default: m.Key };
+});
+export const Outbox = lazy(async () => {
+  const m = await import('./../icons/Outbox');
+  return { default: m.Outbox };
+});
+export const Credit = lazy(async () => {
+  const m = await import('./../icons/Credit');
+  return { default: m.Credit };
+});
+export const Button = lazy(async () => {
+  const m = await import('./../icons/Button');
+  return { default: m.Button };
+});
+export const Type = lazy(async () => {
+  const m = await import('./../icons/Type');
+  return { default: m.Type };
+});
+export const Pointerdefault = lazy(async () => {
+  const m = await import('./../icons/Pointerdefault');
+  return { default: m.Pointerdefault };
+});
+export const Pointerhand = lazy(async () => {
+  const m = await import('./../icons/Pointerhand');
+  return { default: m.Pointerhand };
+});
+export const Command = lazy(async () => {
+  const m = await import('./../icons/Command');
+  return { default: m.Command };
+});
diff --git a/src/exports/Communicate.tsx b/src/exports/Communicate.tsx
new file mode 100644
index 0000000..04dfa1d
--- /dev/null
+++ b/src/exports/Communicate.tsx
@@ -0,0 +1,138 @@
+import { lazy } from 'react';
+
+export const Info = lazy(async () => {
+  const m = await import('./../icons/Info');
+  return { default: m.Info };
+});
+export const Question = lazy(async () => {
+  const m = await import('./../icons/Question');
+  return { default: m.Question };
+});
+export const Support = lazy(async () => {
+  const m = await import('./../icons/Support');
+  return { default: m.Support };
+});
+export const Alert = lazy(async () => {
+  const m = await import('./../icons/Alert');
+  return { default: m.Alert };
+});
+export const Alertalt = lazy(async () => {
+  const m = await import('./../icons/Alertalt');
+  return { default: m.Alertalt };
+});
+export const Email = lazy(async () => {
+  const m = await import('./../icons/Email');
+  return { default: m.Email };
+});
+export const Phone = lazy(async () => {
+  const m = await import('./../icons/Phone');
+  return { default: m.Phone };
+});
+export const Link = lazy(async () => {
+  const m = await import('./../icons/Link');
+  return { default: m.Link };
+});
+export const Linkbroken = lazy(async () => {
+  const m = await import('./../icons/Linkbroken');
+  return { default: m.Linkbroken };
+});
+export const Bell = lazy(async () => {
+  const m = await import('./../icons/Bell');
+  return { default: m.Bell };
+});
+export const Rss = lazy(async () => {
+  const m = await import('./../icons/Rss');
+  return { default: m.Rss };
+});
+export const Sharealt = lazy(async () => {
+  const m = await import('./../icons/Sharealt');
+  return { default: m.Sharealt };
+});
+export const Share = lazy(async () => {
+  const m = await import('./../icons/Share');
+  return { default: m.Share };
+});
+export const Jumpto = lazy(async () => {
+  const m = await import('./../icons/Jumpto');
+  return { default: m.Jumpto };
+});
+export const Circlehollow = lazy(async () => {
+  const m = await import('./../icons/Circlehollow');
+  return { default: m.Circlehollow };
+});
+export const Circle = lazy(async () => {
+  const m = await import('./../icons/Circle');
+  return { default: m.Circle };
+});
+export const Bookmarkhollow = lazy(async () => {
+  const m = await import('./../icons/Bookmarkhollow');
+  return { default: m.Bookmarkhollow };
+});
+export const Bookmark = lazy(async () => {
+  const m = await import('./../icons/Bookmark');
+  return { default: m.Bookmark };
+});
+export const Diamond = lazy(async () => {
+  const m = await import('./../icons/Diamond');
+  return { default: m.Diamond };
+});
+export const Hearthollow = lazy(async () => {
+  const m = await import('./../icons/Hearthollow');
+  return { default: m.Hearthollow };
+});
+export const Heart = lazy(async () => {
+  const m = await import('./../icons/Heart');
+  return { default: m.Heart };
+});
+export const Starhollow = lazy(async () => {
+  const m = await import('./../icons/Starhollow');
+  return { default: m.Starhollow };
+});
+export const Star = lazy(async () => {
+  const m = await import('./../icons/Star');
+  return { default: m.Star };
+});
+export const Certificate = lazy(async () => {
+  const m = await import('./../icons/Certificate');
+  return { default: m.Certificate };
+});
+export const Verified = lazy(async () => {
+  const m = await import('./../icons/Verified');
+  return { default: m.Verified };
+});
+export const Thumbsup = lazy(async () => {
+  const m = await import('./../icons/Thumbsup');
+  return { default: m.Thumbsup };
+});
+export const Shield = lazy(async () => {
+  const m = await import('./../icons/Shield');
+  return { default: m.Shield };
+});
+export const Basket = lazy(async () => {
+  const m = await import('./../icons/Basket');
+  return { default: m.Basket };
+});
+export const Beaker = lazy(async () => {
+  const m = await import('./../icons/Beaker');
+  return { default: m.Beaker };
+});
+export const Hourglass = lazy(async () => {
+  const m = await import('./../icons/Hourglass');
+  return { default: m.Hourglass };
+});
+export const Flag = lazy(async () => {
+  const m = await import('./../icons/Flag');
+  return { default: m.Flag };
+});
+export const Cloudhollow = lazy(async () => {
+  const m = await import('./../icons/Cloudhollow');
+  return { default: m.Cloudhollow };
+});
+export const Cloud = lazy(async () => {
+  const m = await import('./../icons/Cloud');
+  return { default: m.Cloud };
+});
+export const Sticker = lazy(async () => {
+  const m = await import('./../icons/Sticker');
+  return { default: m.Sticker };
+});
diff --git a/src/exports/Devices.tsx b/src/exports/Devices.tsx
new file mode 100644
index 0000000..43a4ab0
--- /dev/null
+++ b/src/exports/Devices.tsx
@@ -0,0 +1,66 @@
+import { lazy } from 'react';
+
+export const Browser = lazy(async () => {
+  const m = await import('./../icons/Browser');
+  return { default: m.Browser };
+});
+export const Tablet = lazy(async () => {
+  const m = await import('./../icons/Tablet');
+  return { default: m.Tablet };
+});
+export const Mobile = lazy(async () => {
+  const m = await import('./../icons/Mobile');
+  return { default: m.Mobile };
+});
+export const Watch = lazy(async () => {
+  const m = await import('./../icons/Watch');
+  return { default: m.Watch };
+});
+export const Sidebar = lazy(async () => {
+  const m = await import('./../icons/Sidebar');
+  return { default: m.Sidebar };
+});
+export const SidebarAlt = lazy(async () => {
+  const m = await import('./../icons/SidebarAlt');
+  return { default: m.SidebarAlt };
+});
+export const Sidebaralttoggle = lazy(async () => {
+  const m = await import('./../icons/Sidebaralttoggle');
+  return { default: m.Sidebaralttoggle };
+});
+export const Sidebartoggle = lazy(async () => {
+  const m = await import('./../icons/Sidebartoggle');
+  return { default: m.Sidebartoggle };
+});
+export const Bottombar = lazy(async () => {
+  const m = await import('./../icons/Bottombar');
+  return { default: m.Bottombar };
+});
+export const Bottombartoggle = lazy(async () => {
+  const m = await import('./../icons/Bottombartoggle');
+  return { default: m.Bottombartoggle };
+});
+export const Cpu = lazy(async () => {
+  const m = await import('./../icons/Cpu');
+  return { default: m.Cpu };
+});
+export const Database = lazy(async () => {
+  const m = await import('./../icons/Database');
+  return { default: m.Database };
+});
+export const Memory = lazy(async () => {
+  const m = await import('./../icons/Memory');
+  return { default: m.Memory };
+});
+export const Structure = lazy(async () => {
+  const m = await import('./../icons/Structure');
+  return { default: m.Structure };
+});
+export const Box = lazy(async () => {
+  const m = await import('./../icons/Box');
+  return { default: m.Box };
+});
+export const Power = lazy(async () => {
+  const m = await import('./../icons/Power');
+  return { default: m.Power };
+});
diff --git a/src/exports/Documents.tsx b/src/exports/Documents.tsx
new file mode 100644
index 0000000..bb4f5d9
--- /dev/null
+++ b/src/exports/Documents.tsx
@@ -0,0 +1,58 @@
+import { lazy } from 'react';
+
+export const Book = lazy(async () => {
+  const m = await import('./../icons/Book');
+  return { default: m.Book };
+});
+export const Document = lazy(async () => {
+  const m = await import('./../icons/Document');
+  return { default: m.Document };
+});
+export const Copy = lazy(async () => {
+  const m = await import('./../icons/Copy');
+  return { default: m.Copy };
+});
+export const Category = lazy(async () => {
+  const m = await import('./../icons/Category');
+  return { default: m.Category };
+});
+export const Folder = lazy(async () => {
+  const m = await import('./../icons/Folder');
+  return { default: m.Folder };
+});
+export const Print = lazy(async () => {
+  const m = await import('./../icons/Print');
+  return { default: m.Print };
+});
+export const Graphline = lazy(async () => {
+  const m = await import('./../icons/Graphline');
+  return { default: m.Graphline };
+});
+export const Calendar = lazy(async () => {
+  const m = await import('./../icons/Calendar');
+  return { default: m.Calendar };
+});
+export const Graphbar = lazy(async () => {
+  const m = await import('./../icons/Graphbar');
+  return { default: m.Graphbar };
+});
+export const Menu = lazy(async () => {
+  const m = await import('./../icons/Menu');
+  return { default: m.Menu };
+});
+export const Menureverse = lazy(async () => {
+  const m = await import('./../icons/Menureverse');
+  return { default: m.Menureverse };
+});
+export const Filter = lazy(async () => {
+  const m = await import('./../icons/Filter');
+  return { default: m.Filter };
+});
+export const Docchart = lazy(async () => {
+  const m = await import('./../icons/Docchart');
+  return { default: m.Docchart };
+});
+export const Doclist = lazy(async () => {
+  const m = await import('./../icons/Doclist');
+  return { default: m.Doclist };
+});
diff --git a/src/exports/Editing.tsx b/src/exports/Editing.tsx
new file mode 100644
index 0000000..fc56ef7
--- /dev/null
+++ b/src/exports/Editing.tsx
@@ -0,0 +1,34 @@
+import { lazy } from 'react';
+
+export const Markup = lazy(async () => {
+  const m = await import('./../icons/Markup');
+  return { default: m.Markup };
+});
+export const Bold = lazy(async () => {
+  const m = await import('./../icons/Bold');
+  return { default: m.Bold };
+});
+export const Italic = lazy(async () => {
+  const m = await import('./../icons/Italic');
+  return { default: m.Italic };
+});
+export const Paperclip = lazy(async () => {
+  const m = await import('./../icons/Paperclip');
+  return { default: m.Paperclip };
+});
+export const Listordered = lazy(async () => {
+  const m = await import('./../icons/Listordered');
+  return { default: m.Listordered };
+});
+export const Listunordered = lazy(async () => {
+  const m = await import('./../icons/Listunordered');
+  return { default: m.Listunordered };
+});
+export const Paragraph = lazy(async () => {
+  const m = await import('./../icons/Paragraph');
+  return { default: m.Paragraph };
+});
+export const Markdown = lazy(async () => {
+  const m = await import('./../icons/Markdown');
+  return { default: m.Markdown };
+});
diff --git a/src/exports/Git.tsx b/src/exports/Git.tsx
new file mode 100644
index 0000000..2056d2f
--- /dev/null
+++ b/src/exports/Git.tsx
@@ -0,0 +1,22 @@
+import { lazy } from 'react';
+
+export const Repo = lazy(async () => {
+  const m = await import('./../icons/Repo');
+  return { default: m.Repo };
+});
+export const Commit = lazy(async () => {
+  const m = await import('./../icons/Commit');
+  return { default: m.Commit };
+});
+export const Branch = lazy(async () => {
+  const m = await import('./../icons/Branch');
+  return { default: m.Branch };
+});
+export const Pullrequest = lazy(async () => {
+  const m = await import('./../icons/Pullrequest');
+  return { default: m.Pullrequest };
+});
+export const Merge = lazy(async () => {
+  const m = await import('./../icons/Merge');
+  return { default: m.Merge };
+});
diff --git a/src/exports/Images.tsx b/src/exports/Images.tsx
new file mode 100644
index 0000000..473ee50
--- /dev/null
+++ b/src/exports/Images.tsx
@@ -0,0 +1,138 @@
+import { lazy } from 'react';
+
+export const Photo = lazy(async () => {
+  const m = await import('./../icons/Photo');
+  return { default: m.Photo };
+});
+export const Component = lazy(async () => {
+  const m = await import('./../icons/Component');
+  return { default: m.Component };
+});
+export const Grid = lazy(async () => {
+  const m = await import('./../icons/Grid');
+  return { default: m.Grid };
+});
+export const Outline = lazy(async () => {
+  const m = await import('./../icons/Outline');
+  return { default: m.Outline };
+});
+export const PhotoDrag = lazy(async () => {
+  const m = await import('./../icons/PhotoDrag');
+  return { default: m.PhotoDrag };
+});
+export const Gridalt = lazy(async () => {
+  const m = await import('./../icons/Gridalt');
+  return { default: m.Gridalt };
+});
+export const Search = lazy(async () => {
+  const m = await import('./../icons/Search');
+  return { default: m.Search };
+});
+export const Zoom = lazy(async () => {
+  const m = await import('./../icons/Zoom');
+  return { default: m.Zoom };
+});
+export const Zoomout = lazy(async () => {
+  const m = await import('./../icons/Zoomout');
+  return { default: m.Zoomout };
+});
+export const Zoomreset = lazy(async () => {
+  const m = await import('./../icons/Zoomreset');
+  return { default: m.Zoomreset };
+});
+export const Eye = lazy(async () => {
+  const m = await import('./../icons/Eye');
+  return { default: m.Eye };
+});
+export const Eyeclose = lazy(async () => {
+  const m = await import('./../icons/Eyeclose');
+  return { default: m.Eyeclose };
+});
+export const Lightning = lazy(async () => {
+  const m = await import('./../icons/Lightning');
+  return { default: m.Lightning };
+});
+export const Lightningoff = lazy(async () => {
+  const m = await import('./../icons/Lightningoff');
+  return { default: m.Lightningoff };
+});
+export const Contrast = lazy(async () => {
+  const m = await import('./../icons/Contrast');
+  return { default: m.Contrast };
+});
+export const Switchalt = lazy(async () => {
+  const m = await import('./../icons/Switchalt');
+  return { default: m.Switchalt };
+});
+export const Mirror = lazy(async () => {
+  const m = await import('./../icons/Mirror');
+  return { default: m.Mirror };
+});
+export const Grow = lazy(async () => {
+  const m = await import('./../icons/Grow');
+  return { default: m.Grow };
+});
+export const Paintbrush = lazy(async () => {
+  const m = await import('./../icons/Paintbrush');
+  return { default: m.Paintbrush };
+});
+export const Ruler = lazy(async () => {
+  const m = await import('./../icons/Ruler');
+  return { default: m.Ruler };
+});
+export const Stop = lazy(async () => {
+  const m = await import('./../icons/Stop');
+  return { default: m.Stop };
+});
+export const Camera = lazy(async () => {
+  const m = await import('./../icons/Camera');
+  return { default: m.Camera };
+});
+export const Video = lazy(async () => {
+  const m = await import('./../icons/Video');
+  return { default: m.Video };
+});
+export const Speaker = lazy(async () => {
+  const m = await import('./../icons/Speaker');
+  return { default: m.Speaker };
+});
+export const Play = lazy(async () => {
+  const m = await import('./../icons/Play');
+  return { default: m.Play };
+});
+export const Playback = lazy(async () => {
+  const m = await import('./../icons/Playback');
+  return { default: m.Playback };
+});
+export const Playnext = lazy(async () => {
+  const m = await import('./../icons/Playnext');
+  return { default: m.Playnext };
+});
+export const Rewind = lazy(async () => {
+  const m = await import('./../icons/Rewind');
+  return { default: m.Rewind };
+});
+export const Fastforward = lazy(async () => {
+  const m = await import('./../icons/Fastforward');
+  return { default: m.Fastforward };
+});
+export const Stopalt = lazy(async () => {
+  const m = await import('./../icons/Stopalt');
+  return { default: m.Stopalt };
+});
+export const Sidebyside = lazy(async () => {
+  const m = await import('./../icons/Sidebyside');
+  return { default: m.Sidebyside };
+});
+export const Stacked = lazy(async () => {
+  const m = await import('./../icons/Stacked');
+  return { default: m.Stacked };
+});
+export const Sun = lazy(async () => {
+  const m = await import('./../icons/Sun');
+  return { default: m.Sun };
+});
+export const Moon = lazy(async () => {
+  const m = await import('./../icons/Moon');
+  return { default: m.Moon };
+});
diff --git a/src/exports/Logos.tsx b/src/exports/Logos.tsx
new file mode 100644
index 0000000..617bf43
--- /dev/null
+++ b/src/exports/Logos.tsx
@@ -0,0 +1,78 @@
+import { lazy } from 'react';
+
+export const Storybook = lazy(async () => {
+  const m = await import('./../icons/Storybook');
+  return { default: m.Storybook };
+});
+export const Azuredevops = lazy(async () => {
+  const m = await import('./../icons/Azuredevops');
+  return { default: m.Azuredevops };
+});
+export const Bitbucket = lazy(async () => {
+  const m = await import('./../icons/Bitbucket');
+  return { default: m.Bitbucket };
+});
+export const Chromatic = lazy(async () => {
+  const m = await import('./../icons/Chromatic');
+  return { default: m.Chromatic };
+});
+export const ComponentDriven = lazy(async () => {
+  const m = await import('./../icons/ComponentDriven');
+  return { default: m.ComponentDriven };
+});
+export const Discord = lazy(async () => {
+  const m = await import('./../icons/Discord');
+  return { default: m.Discord };
+});
+export const Facebook = lazy(async () => {
+  const m = await import('./../icons/Facebook');
+  return { default: m.Facebook };
+});
+export const Figma = lazy(async () => {
+  const m = await import('./../icons/Figma');
+  return { default: m.Figma };
+});
+export const Gdrive = lazy(async () => {
+  const m = await import('./../icons/Gdrive');
+  return { default: m.Gdrive };
+});
+export const Github = lazy(async () => {
+  const m = await import('./../icons/Github');
+  return { default: m.Github };
+});
+export const Gitlab = lazy(async () => {
+  const m = await import('./../icons/Gitlab');
+  return { default: m.Gitlab };
+});
+export const Google = lazy(async () => {
+  const m = await import('./../icons/Google');
+  return { default: m.Google };
+});
+export const Graphql = lazy(async () => {
+  const m = await import('./../icons/Graphql');
+  return { default: m.Graphql };
+});
+export const Medium = lazy(async () => {
+  const m = await import('./../icons/Medium');
+  return { default: m.Medium };
+});
+export const Redux = lazy(async () => {
+  const m = await import('./../icons/Redux');
+  return { default: m.Redux };
+});
+export const Twitter = lazy(async () => {
+  const m = await import('./../icons/Twitter');
+  return { default: m.Twitter };
+});
+export const Youtube = lazy(async () => {
+  const m = await import('./../icons/Youtube');
+  return { default: m.Youtube };
+});
+export const VSCode = lazy(async () => {
+  const m = await import('./../icons/VSCode');
+  return { default: m.VSCode };
+});
+export const Linkedin = lazy(async () => {
+  const m = await import('./../icons/Linkedin');
+  return { default: m.Linkedin };
+});
diff --git a/src/exports/OS.tsx b/src/exports/OS.tsx
new file mode 100644
index 0000000..2f225fa
--- /dev/null
+++ b/src/exports/OS.tsx
@@ -0,0 +1,22 @@
+import { lazy } from 'react';
+
+export const Apple = lazy(async () => {
+  const m = await import('./../icons/Apple');
+  return { default: m.Apple };
+});
+export const Linux = lazy(async () => {
+  const m = await import('./../icons/Linux');
+  return { default: m.Linux };
+});
+export const Ubuntu = lazy(async () => {
+  const m = await import('./../icons/Ubuntu');
+  return { default: m.Ubuntu };
+});
+export const Windows = lazy(async () => {
+  const m = await import('./../icons/Windows');
+  return { default: m.Windows };
+});
+export const Chrome = lazy(async () => {
+  const m = await import('./../icons/Chrome');
+  return { default: m.Chrome };
+});
diff --git a/src/exports/People.tsx b/src/exports/People.tsx
new file mode 100644
index 0000000..193a671
--- /dev/null
+++ b/src/exports/People.tsx
@@ -0,0 +1,42 @@
+import { lazy } from 'react';
+
+export const User = lazy(async () => {
+  const m = await import('./../icons/User');
+  return { default: m.User };
+});
+export const Useralt = lazy(async () => {
+  const m = await import('./../icons/Useralt');
+  return { default: m.Useralt };
+});
+export const Useradd = lazy(async () => {
+  const m = await import('./../icons/Useradd');
+  return { default: m.Useradd };
+});
+export const Users = lazy(async () => {
+  const m = await import('./../icons/Users');
+  return { default: m.Users };
+});
+export const Profile = lazy(async () => {
+  const m = await import('./../icons/Profile');
+  return { default: m.Profile };
+});
+export const Facehappy = lazy(async () => {
+  const m = await import('./../icons/Facehappy');
+  return { default: m.Facehappy };
+});
+export const Faceneutral = lazy(async () => {
+  const m = await import('./../icons/Faceneutral');
+  return { default: m.Faceneutral };
+});
+export const Facesad = lazy(async () => {
+  const m = await import('./../icons/Facesad');
+  return { default: m.Facesad };
+});
+export const Accessibility = lazy(async () => {
+  const m = await import('./../icons/Accessibility');
+  return { default: m.Accessibility };
+});
+export const AccessibilityAlt = lazy(async () => {
+  const m = await import('./../icons/AccessibilityAlt');
+  return { default: m.AccessibilityAlt };
+});
diff --git a/src/exports/Wayfinding.tsx b/src/exports/Wayfinding.tsx
new file mode 100644
index 0000000..ebfbfa7
--- /dev/null
+++ b/src/exports/Wayfinding.tsx
@@ -0,0 +1,130 @@
+import { lazy } from 'react';
+
+export const Arrowup = lazy(async () => {
+  const m = await import('./../icons/Arrowup');
+  return { default: m.Arrowup };
+});
+export const Arrowdown = lazy(async () => {
+  const m = await import('./../icons/Arrowdown');
+  return { default: m.Arrowdown };
+});
+export const Arrowleft = lazy(async () => {
+  const m = await import('./../icons/Arrowleft');
+  return { default: m.Arrowleft };
+});
+export const Arrowright = lazy(async () => {
+  const m = await import('./../icons/Arrowright');
+  return { default: m.Arrowright };
+});
+export const Arrowupalt = lazy(async () => {
+  const m = await import('./../icons/Arrowupalt');
+  return { default: m.Arrowupalt };
+});
+export const Arrowdownalt = lazy(async () => {
+  const m = await import('./../icons/Arrowdownalt');
+  return { default: m.Arrowdownalt };
+});
+export const Arrowleftalt = lazy(async () => {
+  const m = await import('./../icons/Arrowleftalt');
+  return { default: m.Arrowleftalt };
+});
+export const Arrowrightalt = lazy(async () => {
+  const m = await import('./../icons/Arrowrightalt');
+  return { default: m.Arrowrightalt };
+});
+export const ExpandAlt = lazy(async () => {
+  const m = await import('./../icons/ExpandAlt');
+  return { default: m.ExpandAlt };
+});
+export const Collapse = lazy(async () => {
+  const m = await import('./../icons/Collapse');
+  return { default: m.Collapse };
+});
+export const Expand = lazy(async () => {
+  const m = await import('./../icons/Expand');
+  return { default: m.Expand };
+});
+export const Unfold = lazy(async () => {
+  const m = await import('./../icons/Unfold');
+  return { default: m.Unfold };
+});
+export const Transfer = lazy(async () => {
+  const m = await import('./../icons/Transfer');
+  return { default: m.Transfer };
+});
+export const Redirect = lazy(async () => {
+  const m = await import('./../icons/Redirect');
+  return { default: m.Redirect };
+});
+export const Undo = lazy(async () => {
+  const m = await import('./../icons/Undo');
+  return { default: m.Undo };
+});
+export const Reply = lazy(async () => {
+  const m = await import('./../icons/Reply');
+  return { default: m.Reply };
+});
+export const Sync = lazy(async () => {
+  const m = await import('./../icons/Sync');
+  return { default: m.Sync };
+});
+export const Upload = lazy(async () => {
+  const m = await import('./../icons/Upload');
+  return { default: m.Upload };
+});
+export const Download = lazy(async () => {
+  const m = await import('./../icons/Download');
+  return { default: m.Download };
+});
+export const Back = lazy(async () => {
+  const m = await import('./../icons/Back');
+  return { default: m.Back };
+});
+export const Proceed = lazy(async () => {
+  const m = await import('./../icons/Proceed');
+  return { default: m.Proceed };
+});
+export const Refresh = lazy(async () => {
+  const m = await import('./../icons/Refresh');
+  return { default: m.Refresh };
+});
+export const Globe = lazy(async () => {
+  const m = await import('./../icons/Globe');
+  return { default: m.Globe };
+});
+export const Compass = lazy(async () => {
+  const m = await import('./../icons/Compass');
+  return { default: m.Compass };
+});
+export const Location = lazy(async () => {
+  const m = await import('./../icons/Location');
+  return { default: m.Location };
+});
+export const Pin = lazy(async () => {
+  const m = await import('./../icons/Pin');
+  return { default: m.Pin };
+});
+export const Time = lazy(async () => {
+  const m = await import('./../icons/Time');
+  return { default: m.Time };
+});
+export const Dashboard = lazy(async () => {
+  const m = await import('./../icons/Dashboard');
+  return { default: m.Dashboard };
+});
+export const Timer = lazy(async () => {
+  const m = await import('./../icons/Timer');
+  return { default: m.Timer };
+});
+export const Home = lazy(async () => {
+  const m = await import('./../icons/Home');
+  return { default: m.Home };
+});
+export const Admin = lazy(async () => {
+  const m = await import('./../icons/Admin');
+  return { default: m.Admin };
+});
+export const Direction = lazy(async () => {
+  const m = await import('./../icons/Direction');
+  return { default: m.Direction };
+});
diff --git a/src/generate.ts b/src/generate.ts
index 3269056..c1d8026 100644
--- a/src/generate.ts
+++ b/src/generate.ts
@@ -3,6 +3,10 @@ import fs from 'fs-extra';
 import chalk from 'chalk';
 import dotenv from 'dotenv';
 import figmaApiExporter from 'figma-api-exporter';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import { processFile } from 'figma-transformer';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import * as Figma from 'figma-js';
 import svgrConfig from '../svgr.config';
 import { createIndex, downloadSVGsData, story, toPascalCase } from './utils';
 
@@ -10,6 +14,7 @@ const svgr = require('@svgr/core').default;
 
 const ICONS_DIRECTORY_PATH = path.resolve(__dirname, './icons');
 const INDEX_DIRECTORY_PATH = path.resolve(__dirname, './');
+const EXPORTS_DIRECTORY_PATH = path.resolve(__dirname, './exports');
 
 // Load environment variables
 dotenv.config();
@@ -29,16 +34,21 @@ if (
   process.exit(1);
 }
 
-// 2. Fetch icons metadata from Figma
-console.log(chalk.magentaBright('-> Fetching icons metadata'));
-const exporter = figmaApiExporter(FIGMA_API_TOKEN);
+const client = Figma.Client({
+  personalAccessToken: FIGMA_API_TOKEN,
+});
+
+export const getGroups = async (figmaFileId: string) => {
+  try {
+    // 2. Fetch icons metadata from Figma
+    console.log(chalk.magentaBright('-> Fetching icons metadata'));
+    const exporter = figmaApiExporter(FIGMA_API_TOKEN);
+
+    const svgsData = await exporter.getSvgs({
+      fileId: FIGMA_FILE_ID,
+      canvas: FIGMA_CANVAS,
+    });
 
-exporter
-  .getSvgs({
-    fileId: FIGMA_FILE_ID,
-    canvas: FIGMA_CANVAS,
-  })
-  .then(async (svgsData) => {
     // 3. Download SVG files from Figma
     console.log(chalk.blueBright('-> Downloading SVG code'));
     const downloadedSVGsData = await downloadSVGsData(svgsData.svgs);
@@ -52,7 +62,9 @@ exporter
       const storyFileName = `${componentName}.stories.tsx`;
 
       // Converts SVG code into React code using SVGR library
-      const componentCode = svgr.sync(svgCode, svgrConfig, { componentName });
+      const componentCode = svgr.sync(svgCode, svgrConfig, {
+        componentName,
+      });
 
       // 5. Write generated component to file system
       fs.ensureDirSync(ICONS_DIRECTORY_PATH);
@@ -72,7 +84,51 @@ exporter
     console.log(chalk.cyanBright('-> Write generated component'));
     console.log(chalk.yellow('-> Create stories'));
 
-    // 7. Generate index.ts
+    // 7. Get groups from Figma
+    console.log(chalk.magentaBright('-> Fetching groups'));
+    const fileData = await client.file(figmaFileId);
+    const processedFile = processFile(fileData.data, figmaFileId);
+
+    // Get all groups
+    const groups = processedFile.children[0].children.map(
+      (folder: { name: string; shortcuts: { components: any } }) => ({
+        name: folder.name,
+        components: folder.shortcuts?.components,
+      })
+    );
+
+    // Filter out groups without components
+    const filteredGroups = groups.filter(
+      (group: { name: string; components: any }) =>
+        group.components !== undefined
+    );
+
+    // Get groups with component IDs
+    const groupsWithComponents = filteredGroups.map(
+      (group: { name: string; components: any }) => ({
+        name: group.name,
+        components: group.components.map((component: any) => component.id),
+      })
+    );
+
+    // console.log(downloadedSVGsData);
+    // console.log(groupsWithComponents);
+
+    // 8. Generate group files
+    groupsWithComponents.forEach((group: { name: string; components: any }) => {
+      const groupName = toPascalCase(group.name);
+      const data = downloadedSVGsData.filter((svg) => {
+        return group.components.includes(svg.id);
+      });
+      createIndex({
+        componentsDirectoryPath: ICONS_DIRECTORY_PATH,
+        indexDirectoryPath: EXPORTS_DIRECTORY_PATH,
+        data,
+        indexFileName: `${groupName}.tsx`,
+      });
+    });
+
+    // 9. Generate index.ts
     console.log(chalk.yellowBright('-> Generating index file'));
     createIndex({
       componentsDirectoryPath: ICONS_DIRECTORY_PATH,
@@ -82,8 +138,10 @@ exporter
     });
 
     console.log(chalk.greenBright('-> All done! ✅'));
-  })
-  .catch((err: unknown) => {
-    console.error(err);
+  } catch (error) {
+    console.error(error);
     process.exit(1);
-  });
+  }
+};
+
+getGroups(FIGMA_FILE_ID);
diff --git a/src/index.ts b/src/index.ts
index 2f2ea33..d065176 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,45 +1,5 @@
 import { lazy } from 'react';
 
-export const User = lazy(async () => {
-  const m = await import('./icons/User');
-  return { default: m.User };
-});
-export const Useralt = lazy(async () => {
-  const m = await import('./icons/Useralt');
-  return { default: m.Useralt };
-});
-export const Useradd = lazy(async () => {
-  const m = await import('./icons/Useradd');
-  return { default: m.Useradd };
-});
-export const Users = lazy(async () => {
-  const m = await import('./icons/Users');
-  return { default: m.Users };
-});
-export const Profile = lazy(async () => {
-  const m = await import('./icons/Profile');
-  return { default: m.Profile };
-});
-export const Facehappy = lazy(async () => {
-  const m = await import('./icons/Facehappy');
-  return { default: m.Facehappy };
-});
-export const Faceneutral = lazy(async () => {
-  const m = await import('./icons/Faceneutral');
-  return { default: m.Faceneutral };
-});
-export const Facesad = lazy(async () => {
-  const m = await import('./icons/Facesad');
-  return { default: m.Facesad };
-});
-export const Accessibility = lazy(async () => {
-  const m = await import('./icons/Accessibility');
-  return { default: m.Accessibility };
-});
-export const AccessibilityAlt = lazy(async () => {
-  const m = await import('./icons/AccessibilityAlt');
-  return { default: m.AccessibilityAlt };
-});
 export const Photo = lazy(async () => {
   const m = await import('./icons/Photo');
   return { default: m.Photo };
@@ -380,149 +340,245 @@ export const Linkedin = lazy(async () => {
   const m = await import('./icons/Linkedin');
   return { default: m.Linkedin };
 });
-export const Arrowup = lazy(async () => {
-  const m = await import('./icons/Arrowup');
-  return { default: m.Arrowup };
+export const Browser = lazy(async () => {
+  const m = await import('./icons/Browser');
+  return { default: m.Browser };
 });
-export const Arrowdown = lazy(async () => {
-  const m = await import('./icons/Arrowdown');
-  return { default: m.Arrowdown };
+export const Tablet = lazy(async () => {
+  const m = await import('./icons/Tablet');
+  return { default: m.Tablet };
 });
-export const Arrowleft = lazy(async () => {
-  const m = await import('./icons/Arrowleft');
-  return { default: m.Arrowleft };
+export const Mobile = lazy(async () => {
+  const m = await import('./icons/Mobile');
+  return { default: m.Mobile };
 });
-export const Arrowright = lazy(async () => {
-  const m = await import('./icons/Arrowright');
-  return { default: m.Arrowright };
+export const Watch = lazy(async () => {
+  const m = await import('./icons/Watch');
+  return { default: m.Watch };
 });
-export const Arrowupalt = lazy(async () => {
-  const m = await import('./icons/Arrowupalt');
-  return { default: m.Arrowupalt };
+export const Sidebar = lazy(async () => {
+  const m = await import('./icons/Sidebar');
+  return { default: m.Sidebar };
 });
-export const Arrowdownalt = lazy(async () => {
-  const m = await import('./icons/Arrowdownalt');
-  return { default: m.Arrowdownalt };
+export const SidebarAlt = lazy(async () => {
+  const m = await import('./icons/SidebarAlt');
+  return { default: m.SidebarAlt };
 });
-export const Arrowleftalt = lazy(async () => {
-  const m = await import('./icons/Arrowleftalt');
-  return { default: m.Arrowleftalt };
+export const Sidebaralttoggle = lazy(async () => {
+  const m = await import('./icons/Sidebaralttoggle');
+  return { default: m.Sidebaralttoggle };
 });
-export const Arrowrightalt = lazy(async () => {
-  const m = await import('./icons/Arrowrightalt');
-  return { default: m.Arrowrightalt };
+export const Sidebartoggle = lazy(async () => {
+  const m = await import('./icons/Sidebartoggle');
+  return { default: m.Sidebartoggle };
 });
-export const ExpandAlt = lazy(async () => {
-  const m = await import('./icons/ExpandAlt');
-  return { default: m.ExpandAlt };
+export const Bottombar = lazy(async () => {
+  const m = await import('./icons/Bottombar');
+  return { default: m.Bottombar };
 });
-export const Collapse = lazy(async () => {
-  const m = await import('./icons/Collapse');
-  return { default: m.Collapse };
+export const Bottombartoggle = lazy(async () => {
+  const m = await import('./icons/Bottombartoggle');
+  return { default: m.Bottombartoggle };
 });
-export const Expand = lazy(async () => {
-  const m = await import('./icons/Expand');
-  return { default: m.Expand };
+export const Cpu = lazy(async () => {
+  const m = await import('./icons/Cpu');
+  return { default: m.Cpu };
 });
-export const Unfold = lazy(async () => {
-  const m = await import('./icons/Unfold');
-  return { default: m.Unfold };
+export const Database = lazy(async () => {
+  const m = await import('./icons/Database');
+  return { default: m.Database };
 });
-export const Transfer = lazy(async () => {
-  const m = await import('./icons/Transfer');
-  return { default: m.Transfer };
+export const Memory = lazy(async () => {
+  const m = await import('./icons/Memory');
+  return { default: m.Memory };
 });
-export const Redirect = lazy(async () => {
-  const m = await import('./icons/Redirect');
-  return { default: m.Redirect };
+export const Structure = lazy(async () => {
+  const m = await import('./icons/Structure');
+  return { default: m.Structure };
 });
-export const Undo = lazy(async () => {
-  const m = await import('./icons/Undo');
-  return { default: m.Undo };
+export const Box = lazy(async () => {
+  const m = await import('./icons/Box');
+  return { default: m.Box };
 });
-export const Reply = lazy(async () => {
-  const m = await import('./icons/Reply');
-  return { default: m.Reply };
+export const Power = lazy(async () => {
+  const m = await import('./icons/Power');
+  return { default: m.Power };
 });
-export const Sync = lazy(async () => {
-  const m = await import('./icons/Sync');
-  return { default: m.Sync };
+export const Edit = lazy(async () => {
+  const m = await import('./icons/Edit');
+  return { default: m.Edit };
 });
-export const Upload = lazy(async () => {
-  const m = await import('./icons/Upload');
-  return { default: m.Upload };
+export const Cog = lazy(async () => {
+  const m = await import('./icons/Cog');
+  return { default: m.Cog };
 });
-export const Download = lazy(async () => {
-  const m = await import('./icons/Download');
-  return { default: m.Download };
+export const Nut = lazy(async () => {
+  const m = await import('./icons/Nut');
+  return { default: m.Nut };
 });
-export const Back = lazy(async () => {
-  const m = await import('./icons/Back');
-  return { default: m.Back };
+export const Wrench = lazy(async () => {
+  const m = await import('./icons/Wrench');
+  return { default: m.Wrench };
 });
-export const Proceed = lazy(async () => {
-  const m = await import('./icons/Proceed');
-  return { default: m.Proceed };
+export const Ellipsis = lazy(async () => {
+  const m = await import('./icons/Ellipsis');
+  return { default: m.Ellipsis };
 });
-export const Refresh = lazy(async () => {
-  const m = await import('./icons/Refresh');
-  return { default: m.Refresh };
+export const Wand = lazy(async () => {
+  const m = await import('./icons/Wand');
+  return { default: m.Wand };
 });
-export const Globe = lazy(async () => {
-  const m = await import('./icons/Globe');
-  return { default: m.Globe };
+export const Check = lazy(async () => {
+  const m = await import('./icons/Check');
+  return { default: m.Check };
 });
-export const Compass = lazy(async () => {
-  const m = await import('./icons/Compass');
-  return { default: m.Compass };
+export const Form = lazy(async () => {
+  const m = await import('./icons/Form');
+  return { default: m.Form };
 });
-export const Location = lazy(async () => {
-  const m = await import('./icons/Location');
-  return { default: m.Location };
+export const Batchdeny = lazy(async () => {
+  const m = await import('./icons/Batchdeny');
+  return { default: m.Batchdeny };
 });
-export const Pin = lazy(async () => {
-  const m = await import('./icons/Pin');
-  return { default: m.Pin };
+export const Batchaccept = lazy(async () => {
+  const m = await import('./icons/Batchaccept');
+  return { default: m.Batchaccept };
 });
-export const Time = lazy(async () => {
-  const m = await import('./icons/Time');
-  return { default: m.Time };
+export const Controls = lazy(async () => {
+  const m = await import('./icons/Controls');
+  return { default: m.Controls };
 });
-export const Dashboard = lazy(async () => {
-  const m = await import('./icons/Dashboard');
-  return { default: m.Dashboard };
+export const Plus = lazy(async () => {
+  const m = await import('./icons/Plus');
+  return { default: m.Plus };
 });
-export const Timer = lazy(async () => {
-  const m = await import('./icons/Timer');
-  return { default: m.Timer };
+export const CloseAlt = lazy(async () => {
+  const m = await import('./icons/CloseAlt');
+  return { default: m.CloseAlt };
 });
-export const Home = lazy(async () => {
-  const m = await import('./icons/Home');
-  return { default: m.Home };
+export const Cross = lazy(async () => {
+  const m = await import('./icons/Cross');
+  return { default: m.Cross };
 });
-export const Admin = lazy(async () => {
-  const m = await import('./icons/Admin');
-  return { default: m.Admin };
+export const Trash = lazy(async () => {
+  const m = await import('./icons/Trash');
+  return { default: m.Trash };
 });
-export const Direction = lazy(async () => {
-  const m = await import('./icons/Direction');
-  return { default: m.Direction };
+export const Pinalt = lazy(async () => {
+  const m = await import('./icons/Pinalt');
+  return { default: m.Pinalt };
 });
-export const Info = lazy(async () => {
-  const m = await import('./icons/Info');
-  return { default: m.Info };
+export const Unpin = lazy(async () => {
+  const m = await import('./icons/Unpin');
+  return { default: m.Unpin };
 });
-export const Question = lazy(async () => {
-  const m = await import('./icons/Question');
-  return { default: m.Question };
+export const Add = lazy(async () => {
+  const m = await import('./icons/Add');
+  return { default: m.Add };
 });
-export const Support = lazy(async () => {
-  const m = await import('./icons/Support');
-  return { default: m.Support };
+export const Subtract = lazy(async () => {
+  const m = await import('./icons/Subtract');
+  return { default: m.Subtract };
 });
-export const Alert = lazy(async () => {
-  const m = await import('./icons/Alert');
-  return { default: m.Alert };
+export const Close = lazy(async () => {
+  const m = await import('./icons/Close');
+  return { default: m.Close };
+});
+export const Delete = lazy(async () => {
+  const m = await import('./icons/Delete');
+  return { default: m.Delete };
+});
+export const Passed = lazy(async () => {
+  const m = await import('./icons/Passed');
+  return { default: m.Passed };
+});
+export const Changed = lazy(async () => {
+  const m = await import('./icons/Changed');
+  return { default: m.Changed };
+});
+export const Failed = lazy(async () => {
+  const m = await import('./icons/Failed');
+  return { default: m.Failed };
+});
+export const Clear = lazy(async () => {
+  const m = await import('./icons/Clear');
+  return { default: m.Clear };
+});
+export const Comment = lazy(async () => {
+  const m = await import('./icons/Comment');
+  return { default: m.Comment };
+});
+export const Commentadd = lazy(async () => {
+  const m = await import('./icons/Commentadd');
+  return { default: m.Commentadd };
+});
+export const Requestchange = lazy(async () => {
+  const m = await import('./icons/Requestchange');
+  return { default: m.Requestchange };
+});
+export const Comments = lazy(async () => {
+  const m = await import('./icons/Comments');
+  return { default: m.Comments };
+});
+export const Chat = lazy(async () => {
+  const m = await import('./icons/Chat');
+  return { default: m.Chat };
+});
+export const Lock = lazy(async () => {
+  const m = await import('./icons/Lock');
+  return { default: m.Lock };
+});
+export const Unlock = lazy(async () => {
+  const m = await import('./icons/Unlock');
+  return { default: m.Unlock };
+});
+export const Key = lazy(async () => {
+  const m = await import('./icons/Key');
+  return { default: m.Key };
+});
+export const Outbox = lazy(async () => {
+  const m = await import('./icons/Outbox');
+  return { default: m.Outbox };
+});
+export const Credit = lazy(async () => {
+  const m = await import('./icons/Credit');
+  return { default: m.Credit };
+});
+export const Button = lazy(async () => {
+  const m = await import('./icons/Button');
+  return { default: m.Button };
+});
+export const Type = lazy(async () => {
+  const m = await import('./icons/Type');
+  return { default: m.Type };
+});
+export const Pointerdefault = lazy(async () => {
+  const m = await import('./icons/Pointerdefault');
+  return { default: m.Pointerdefault };
+});
+export const Pointerhand = lazy(async () => {
+  const m = await import('./icons/Pointerhand');
+  return { default: m.Pointerhand };
+});
+export const Command = lazy(async () => {
+  const m = await import('./icons/Command');
+  return { default: m.Command };
+});
+export const Info = lazy(async () => {
+  const m = await import('./icons/Info');
+  return { default: m.Info };
+});
+export const Question = lazy(async () => {
+  const m = await import('./icons/Question');
+  return { default: m.Question };
+});
+export const Support = lazy(async () => {
+  const m = await import('./icons/Support');
+  return { default: m.Support };
+});
+export const Alert = lazy(async () => {
+  const m = await import('./icons/Alert');
+  return { default: m.Alert };
 });
 export const Alertalt = lazy(async () => {
   const m = await import('./icons/Alertalt');
@@ -644,227 +700,171 @@ export const Sticker = lazy(async () => {
   const m = await import('./icons/Sticker');
   return { default: m.Sticker };
 });
-export const Edit = lazy(async () => {
-  const m = await import('./icons/Edit');
-  return { default: m.Edit };
-});
-export const Cog = lazy(async () => {
-  const m = await import('./icons/Cog');
-  return { default: m.Cog };
-});
-export const Nut = lazy(async () => {
-  const m = await import('./icons/Nut');
-  return { default: m.Nut };
-});
-export const Wrench = lazy(async () => {
-  const m = await import('./icons/Wrench');
-  return { default: m.Wrench };
-});
-export const Ellipsis = lazy(async () => {
-  const m = await import('./icons/Ellipsis');
-  return { default: m.Ellipsis };
-});
-export const Wand = lazy(async () => {
-  const m = await import('./icons/Wand');
-  return { default: m.Wand };
-});
-export const Check = lazy(async () => {
-  const m = await import('./icons/Check');
-  return { default: m.Check };
-});
-export const Form = lazy(async () => {
-  const m = await import('./icons/Form');
-  return { default: m.Form };
-});
-export const Batchdeny = lazy(async () => {
-  const m = await import('./icons/Batchdeny');
-  return { default: m.Batchdeny };
-});
-export const Batchaccept = lazy(async () => {
-  const m = await import('./icons/Batchaccept');
-  return { default: m.Batchaccept };
-});
-export const Controls = lazy(async () => {
-  const m = await import('./icons/Controls');
-  return { default: m.Controls };
-});
-export const Plus = lazy(async () => {
-  const m = await import('./icons/Plus');
-  return { default: m.Plus };
-});
-export const CloseAlt = lazy(async () => {
-  const m = await import('./icons/CloseAlt');
-  return { default: m.CloseAlt };
-});
-export const Cross = lazy(async () => {
-  const m = await import('./icons/Cross');
-  return { default: m.Cross };
-});
-export const Trash = lazy(async () => {
-  const m = await import('./icons/Trash');
-  return { default: m.Trash };
+export const Arrowup = lazy(async () => {
+  const m = await import('./icons/Arrowup');
+  return { default: m.Arrowup };
 });
-export const Pinalt = lazy(async () => {
-  const m = await import('./icons/Pinalt');
-  return { default: m.Pinalt };
+export const Arrowdown = lazy(async () => {
+  const m = await import('./icons/Arrowdown');
+  return { default: m.Arrowdown };
 });
-export const Unpin = lazy(async () => {
-  const m = await import('./icons/Unpin');
-  return { default: m.Unpin };
+export const Arrowleft = lazy(async () => {
+  const m = await import('./icons/Arrowleft');
+  return { default: m.Arrowleft };
 });
-export const Add = lazy(async () => {
-  const m = await import('./icons/Add');
-  return { default: m.Add };
+export const Arrowright = lazy(async () => {
+  const m = await import('./icons/Arrowright');
+  return { default: m.Arrowright };
 });
-export const Subtract = lazy(async () => {
-  const m = await import('./icons/Subtract');
-  return { default: m.Subtract };
+export const Arrowupalt = lazy(async () => {
+  const m = await import('./icons/Arrowupalt');
+  return { default: m.Arrowupalt };
 });
-export const Close = lazy(async () => {
-  const m = await import('./icons/Close');
-  return { default: m.Close };
+export const Arrowdownalt = lazy(async () => {
+  const m = await import('./icons/Arrowdownalt');
+  return { default: m.Arrowdownalt };
 });
-export const Delete = lazy(async () => {
-  const m = await import('./icons/Delete');
-  return { default: m.Delete };
+export const Arrowleftalt = lazy(async () => {
+  const m = await import('./icons/Arrowleftalt');
+  return { default: m.Arrowleftalt };
 });
-export const Passed = lazy(async () => {
-  const m = await import('./icons/Passed');
-  return { default: m.Passed };
+export const Arrowrightalt = lazy(async () => {
+  const m = await import('./icons/Arrowrightalt');
+  return { default: m.Arrowrightalt };
 });
-export const Changed = lazy(async () => {
-  const m = await import('./icons/Changed');
-  return { default: m.Changed };
+export const ExpandAlt = lazy(async () => {
+  const m = await import('./icons/ExpandAlt');
+  return { default: m.ExpandAlt };
 });
-export const Failed = lazy(async () => {
-  const m = await import('./icons/Failed');
-  return { default: m.Failed };
+export const Collapse = lazy(async () => {
+  const m = await import('./icons/Collapse');
+  return { default: m.Collapse };
 });
-export const Clear = lazy(async () => {
-  const m = await import('./icons/Clear');
-  return { default: m.Clear };
+export const Expand = lazy(async () => {
+  const m = await import('./icons/Expand');
+  return { default: m.Expand };
 });
-export const Comment = lazy(async () => {
-  const m = await import('./icons/Comment');
-  return { default: m.Comment };
+export const Unfold = lazy(async () => {
+  const m = await import('./icons/Unfold');
+  return { default: m.Unfold };
 });
-export const Commentadd = lazy(async () => {
-  const m = await import('./icons/Commentadd');
-  return { default: m.Commentadd };
+export const Transfer = lazy(async () => {
+  const m = await import('./icons/Transfer');
+  return { default: m.Transfer };
 });
-export const Requestchange = lazy(async () => {
-  const m = await import('./icons/Requestchange');
-  return { default: m.Requestchange };
+export const Redirect = lazy(async () => {
+  const m = await import('./icons/Redirect');
+  return { default: m.Redirect };
 });
-export const Comments = lazy(async () => {
-  const m = await import('./icons/Comments');
-  return { default: m.Comments };
+export const Undo = lazy(async () => {
+  const m = await import('./icons/Undo');
+  return { default: m.Undo };
 });
-export const Chat = lazy(async () => {
-  const m = await import('./icons/Chat');
-  return { default: m.Chat };
+export const Reply = lazy(async () => {
+  const m = await import('./icons/Reply');
+  return { default: m.Reply };
 });
-export const Lock = lazy(async () => {
-  const m = await import('./icons/Lock');
-  return { default: m.Lock };
+export const Sync = lazy(async () => {
+  const m = await import('./icons/Sync');
+  return { default: m.Sync };
 });
-export const Unlock = lazy(async () => {
-  const m = await import('./icons/Unlock');
-  return { default: m.Unlock };
+export const Upload = lazy(async () => {
+  const m = await import('./icons/Upload');
+  return { default: m.Upload };
 });
-export const Key = lazy(async () => {
-  const m = await import('./icons/Key');
-  return { default: m.Key };
+export const Download = lazy(async () => {
+  const m = await import('./icons/Download');
+  return { default: m.Download };
 });
-export const Outbox = lazy(async () => {
-  const m = await import('./icons/Outbox');
-  return { default: m.Outbox };
+export const Back = lazy(async () => {
+  const m = await import('./icons/Back');
+  return { default: m.Back };
 });
-export const Credit = lazy(async () => {
-  const m = await import('./icons/Credit');
-  return { default: m.Credit };
+export const Proceed = lazy(async () => {
+  const m = await import('./icons/Proceed');
+  return { default: m.Proceed };
 });
-export const Button = lazy(async () => {
-  const m = await import('./icons/Button');
-  return { default: m.Button };
+export const Refresh = lazy(async () => {
+  const m = await import('./icons/Refresh');
+  return { default: m.Refresh };
 });
-export const Type = lazy(async () => {
-  const m = await import('./icons/Type');
-  return { default: m.Type };
+export const Globe = lazy(async () => {
+  const m = await import('./icons/Globe');
+  return { default: m.Globe };
 });
-export const Pointerdefault = lazy(async () => {
-  const m = await import('./icons/Pointerdefault');
-  return { default: m.Pointerdefault };
+export const Compass = lazy(async () => {
+  const m = await import('./icons/Compass');
+  return { default: m.Compass };
 });
-export const Pointerhand = lazy(async () => {
-  const m = await import('./icons/Pointerhand');
-  return { default: m.Pointerhand };
+export const Location = lazy(async () => {
+  const m = await import('./icons/Location');
+  return { default: m.Location };
 });
-export const Command = lazy(async () => {
-  const m = await import('./icons/Command');
-  return { default: m.Command };
+export const Pin = lazy(async () => {
+  const m = await import('./icons/Pin');
+  return { default: m.Pin };
 });
-export const Browser = lazy(async () => {
-  const m = await import('./icons/Browser');
-  return { default: m.Browser };
+export const Time = lazy(async () => {
+  const m = await import('./icons/Time');
+  return { default: m.Time };
 });
-export const Tablet = lazy(async () => {
-  const m = await import('./icons/Tablet');
-  return { default: m.Tablet };
+export const Dashboard = lazy(async () => {
+  const m = await import('./icons/Dashboard');
+  return { default: m.Dashboard };
 });
-export const Mobile = lazy(async () => {
-  const m = await import('./icons/Mobile');
-  return { default: m.Mobile };
+export const Timer = lazy(async () => {
+  const m = await import('./icons/Timer');
+  return { default: m.Timer };
 });
-export const Watch = lazy(async () => {
-  const m = await import('./icons/Watch');
-  return { default: m.Watch };
+export const Home = lazy(async () => {
+  const m = await import('./icons/Home');
+  return { default: m.Home };
 });
-export const Sidebar = lazy(async () => {
-  const m = await import('./icons/Sidebar');
-  return { default: m.Sidebar };
+export const Admin = lazy(async () => {
+  const m = await import('./icons/Admin');
+  return { default: m.Admin };
 });
-export const SidebarAlt = lazy(async () => {
-  const m = await import('./icons/SidebarAlt');
-  return { default: m.SidebarAlt };
+export const Direction = lazy(async () => {
+  const m = await import('./icons/Direction');
+  return { default: m.Direction };
 });
-export const Sidebaralttoggle = lazy(async () => {
-  const m = await import('./icons/Sidebaralttoggle');
-  return { default: m.Sidebaralttoggle };
+export const User = lazy(async () => {
+  const m = await import('./icons/User');
+  return { default: m.User };
 });
-export const Sidebartoggle = lazy(async () => {
-  const m = await import('./icons/Sidebartoggle');
-  return { default: m.Sidebartoggle };
+export const Useralt = lazy(async () => {
+  const m = await import('./icons/Useralt');
+  return { default: m.Useralt };
 });
-export const Bottombar = lazy(async () => {
-  const m = await import('./icons/Bottombar');
-  return { default: m.Bottombar };
+export const Useradd = lazy(async () => {
+  const m = await import('./icons/Useradd');
+  return { default: m.Useradd };
 });
-export const Bottombartoggle = lazy(async () => {
-  const m = await import('./icons/Bottombartoggle');
-  return { default: m.Bottombartoggle };
+export const Users = lazy(async () => {
+  const m = await import('./icons/Users');
+  return { default: m.Users };
 });
-export const Cpu = lazy(async () => {
-  const m = await import('./icons/Cpu');
-  return { default: m.Cpu };
+export const Profile = lazy(async () => {
+  const m = await import('./icons/Profile');
+  return { default: m.Profile };
 });
-export const Database = lazy(async () => {
-  const m = await import('./icons/Database');
-  return { default: m.Database };
+export const Facehappy = lazy(async () => {
+  const m = await import('./icons/Facehappy');
+  return { default: m.Facehappy };
 });
-export const Memory = lazy(async () => {
-  const m = await import('./icons/Memory');
-  return { default: m.Memory };
+export const Faceneutral = lazy(async () => {
+  const m = await import('./icons/Faceneutral');
+  return { default: m.Faceneutral };
 });
-export const Structure = lazy(async () => {
-  const m = await import('./icons/Structure');
-  return { default: m.Structure };
+export const Facesad = lazy(async () => {
+  const m = await import('./icons/Facesad');
+  return { default: m.Facesad };
 });
-export const Box = lazy(async () => {
-  const m = await import('./icons/Box');
-  return { default: m.Box };
+export const Accessibility = lazy(async () => {
+  const m = await import('./icons/Accessibility');
+  return { default: m.Accessibility };
 });
-export const Power = lazy(async () => {
-  const m = await import('./icons/Power');
-  return { default: m.Power };
+export const AccessibilityAlt = lazy(async () => {
+  const m = await import('./icons/AccessibilityAlt');
+  return { default: m.AccessibilityAlt };
 });
diff --git a/yarn.lock b/yarn.lock
index 865c781..12743df 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5800,13 +5800,18 @@ figma-api-exporter@0.0.2:
     ramda "^0.26.1"
     rimraf "^3.0.0"
 
-figma-js@^1.9.0:
+figma-js@1.16.0, figma-js@^1.9.0:
   version "1.16.0"
   resolved "https://registry.npmjs.org/figma-js/-/figma-js-1.16.0.tgz#84bfa6bf8dad25ba106b8b4ffa0d595bd6277e11"
   integrity sha512-cImQT9DAJp1J0xr6FMUAswXKEnjwrDz4QKAgIBpUyydKAgDS/lm862stjweHp99uco5qLoNv+GbwQWBHyDvDQw==
   dependencies:
     axios "^0.21.1"
 
+figma-transformer@2.1.0:
+  version "2.1.0"
+  resolved "https://registry.npmjs.org/figma-transformer/-/figma-transformer-2.1.0.tgz#225f8d008e206677bff3636259f260f8b8e8ec49"
+  integrity sha512-BBFsJ59UMFsLEwZ9gz2lAZ+FzRloAaVWRWlLJJJHT79tqnlv+xun3cW+PA/hCngvdH1NRykHycbk9dIvZFs8pA==
+
 figma-transformer@^1.0.0:
   version "1.0.0"
   resolved "https://registry.npmjs.org/figma-transformer/-/figma-transformer-1.0.0.tgz#66a9b661e62dcb6a0b72b9db477d86589248b141"