diff --git a/eslint.config.mjs b/eslint.config.mjs
index 46a4208721..b8e141b8b3 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -106,9 +106,15 @@ export default defineConfig([
     },
   },
   {
-    files: ['tools/**/*', 'website/**/*', 'stories/**/*', '.ci/**/*', 'semcore/**/__tests__/**/*'],
+    files: ['tools/**/*', 'website/**/*', 'stories/**/*', 'figma/src/**/*', '.ci/**/*', 'semcore/**/__tests__/**/*'],
     rules: {
       'no-console': 'off',
     },
   },
+  {
+    files: ['figma/mappings/**/Icon.figma.{jsx,tsx}'],
+    rules: {
+      'import/order': 'off',
+    },
+  },
 ]);
diff --git a/figma/figma-custom.config.json b/figma/figma-custom.config.json
new file mode 100644
index 0000000000..141571fdd1
--- /dev/null
+++ b/figma/figma-custom.config.json
@@ -0,0 +1,13 @@
+{
+  "codeConnect": {
+    "include": [
+      "mappings/**/*.figma.ts"
+    ],
+    "label": "React",
+    "parser": "custom",
+    "parserCommand": "pnpm tsm src/parser.ts",
+    "paths": {
+      "@semcore/ui/*": ["semcore/*/src"]
+    }
+  }
+}
\ No newline at end of file
diff --git a/figma/figma.config.json b/figma/figma.config.json
new file mode 100644
index 0000000000..e2d737d4f5
--- /dev/null
+++ b/figma/figma.config.json
@@ -0,0 +1,14 @@
+{
+  "codeConnect": {
+    "include": [
+      "mappings/**/*.figma.{tsx,jsx}"
+    ],
+    "exclude": ["mappings/**/Icon.figma.jsx"],
+    "label": "React",
+    "parser": "react",
+    "paths": {
+      "@semcore/ui/*": ["semcore/*/src"]
+    },
+    "interactiveSetupFigmaFileUrl": "https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components"
+  }
+}
\ No newline at end of file
diff --git a/figma/mappings/Example.figma.template.js b/figma/mappings/Example.figma.template.js
new file mode 100644
index 0000000000..a799360b48
--- /dev/null
+++ b/figma/mappings/Example.figma.template.js
@@ -0,0 +1,48 @@
+// Config lines for the parser:
+// - keep them commented
+// - order doesn't matter, but they should be before the "require" statement
+
+// https://www.figma.com/design/yzZPyF0Rk2TddifXf6kovg/Card?node-id=11793-136767
+// ^ node URL is required
+// import Card from '@semcore/ui/card'
+// import { Flex } from '@semcore/ui/base-components'
+// ^ imports are optional, just put the ones you want to show in Code Connect
+
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+// you can write any JS code here, like loops, if-s, etc:
+const items = [1, 2, 3].map((item) => 'Option' + item).join();
+
+let result = '';
+const two = 2;
+if (two + two === 4) {
+  result = 'true!';
+}
+
+// to parse these files, run with the alternative config file:
+// npx figma connect publish --config figma-custom.config.json
+
+// some API examples:
+const labelText = instance.getString('PropertyName'); // for text properties
+const helperText = instance.findText('LayerName').textContent; // to directly get text layers
+const isDisabled = instance.getBoolean('PropertyName'); // also accepts boolean-like variant properties
+
+// api docs: https://developers.figma.com/docs/code-connect/template-v2-api/
+// and also: https://developers.figma.com/docs/code-connect/custom-parsers/#example-template-implementation
+
+// default findInstance() can be inconvenient (you have to check if the layer
+// is hidden and generate code by adding '.executeTemplate().example'),
+// so here's a much more convenient custom function:
+const someNestedInstanceCode = instanceCode(instance, 'LayerName');
+
+export default {
+  example: figma.tsx`
+<ComponentName>
+  ${items} ${result}
+  ${someNestedInstanceCode}
+</ComponentName>
+  `,
+  id: 'ComponentName',
+};
+// the id property is required, it can be used to find children using findConnectedInstance('component-id') instead of findInstance('layerName') - it helps if layer has been renamed
diff --git a/figma/mappings/Icon.figma.jsx b/figma/mappings/Icon.figma.jsx
new file mode 100644
index 0000000000..84c1a6a3da
--- /dev/null
+++ b/figma/mappings/Icon.figma.jsx
@@ -0,0 +1,5188 @@
+import figma from '@figma/code-connect';
+
+import TimeClockM from '@semcore/ui/icon/TimeClock/m';
+figma.connect(TimeClockM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:797', {
+  variant: { Size: 'M' },
+  example: () => <TimeClockM />,
+});
+
+import TimeClockL from '@semcore/ui/icon/TimeClock/l';
+figma.connect(TimeClockL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:797', {
+  variant: { Size: 'L' },
+  example: () => <TimeClockL />,
+});
+
+import LinkExternalAltM from '@semcore/ui/icon/LinkExternalAlt/m';
+figma.connect(LinkExternalAltM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9403:2', {
+  variant: { Size: 'M' },
+  example: () => <LinkExternalAltM />,
+});
+
+import LinkExternalAltL from '@semcore/ui/icon/LinkExternalAlt/l';
+figma.connect(LinkExternalAltL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9403:2', {
+  variant: { Size: 'L' },
+  example: () => <LinkExternalAltL />,
+});
+
+import LinkExternalM from '@semcore/ui/icon/LinkExternal/m';
+figma.connect(LinkExternalM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:3', {
+  variant: { Size: 'M' },
+  example: () => <LinkExternalM />,
+});
+
+import LinkExternalL from '@semcore/ui/icon/LinkExternal/l';
+figma.connect(LinkExternalL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:3', {
+  variant: { Size: 'L' },
+  example: () => <LinkExternalL />,
+});
+
+import ArrowRightM from '@semcore/ui/icon/ArrowRight/m';
+figma.connect(ArrowRightM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4610', {
+  variant: { Size: 'M' },
+  example: () => <ArrowRightM />,
+});
+
+import ArrowRightL from '@semcore/ui/icon/ArrowRight/l';
+figma.connect(ArrowRightL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4610', {
+  variant: { Size: 'L' },
+  example: () => <ArrowRightL />,
+});
+
+import ArrowDownM from '@semcore/ui/icon/ArrowDown/m';
+figma.connect(ArrowDownM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4597', {
+  variant: { Size: 'M' },
+  example: () => <ArrowDownM />,
+});
+
+import ArrowDownL from '@semcore/ui/icon/ArrowDown/l';
+figma.connect(ArrowDownL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4597', {
+  variant: { Size: 'L' },
+  example: () => <ArrowDownL />,
+});
+
+import ListBulletM from '@semcore/ui/icon/ListBullet/m';
+figma.connect(ListBulletM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:658', {
+  variant: { Size: 'M' },
+  example: () => <ListBulletM />,
+});
+
+import ListBulletL from '@semcore/ui/icon/ListBullet/l';
+figma.connect(ListBulletL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:658', {
+  variant: { Size: 'L' },
+  example: () => <ListBulletL />,
+});
+
+import ArrowLeftM from '@semcore/ui/icon/ArrowLeft/m';
+figma.connect(ArrowLeftM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4605', {
+  variant: { Size: 'M' },
+  example: () => <ArrowLeftM />,
+});
+
+import ArrowLeftL from '@semcore/ui/icon/ArrowLeft/l';
+figma.connect(ArrowLeftL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4605', {
+  variant: { Size: 'L' },
+  example: () => <ArrowLeftL />,
+});
+
+import ArrowUpM from '@semcore/ui/icon/ArrowUp/m';
+figma.connect(ArrowUpM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4566', {
+  variant: { Size: 'M' },
+  example: () => <ArrowUpM />,
+});
+
+import ArrowUpL from '@semcore/ui/icon/ArrowUp/l';
+figma.connect(ArrowUpL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4566', {
+  variant: { Size: 'L' },
+  example: () => <ArrowUpL />,
+});
+
+import ExpandM from '@semcore/ui/icon/Expand/m';
+figma.connect(ExpandM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=436:11', {
+  variant: { Size: 'M' },
+  example: () => <ExpandM />,
+});
+
+import ExpandL from '@semcore/ui/icon/Expand/l';
+figma.connect(ExpandL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=436:11', {
+  variant: { Size: 'L' },
+  example: () => <ExpandL />,
+});
+
+import CloseM from '@semcore/ui/icon/Close/m';
+figma.connect(CloseM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9:432', {
+  variant: { Size: 'M' },
+  example: () => <CloseM />,
+});
+
+import CloseL from '@semcore/ui/icon/Close/l';
+figma.connect(CloseL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9:432', {
+  variant: { Size: 'L' },
+  example: () => <CloseL />,
+});
+
+import ComicsM from '@semcore/ui/icon/Comics/m';
+figma.connect(ComicsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:124', {
+  variant: { Size: 'M' },
+  example: () => <ComicsM />,
+});
+
+import ComicsL from '@semcore/ui/icon/Comics/l';
+figma.connect(ComicsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:124', {
+  variant: { Size: 'L' },
+  example: () => <ComicsL />,
+});
+
+import RetweetM from '@semcore/ui/icon/Retweet/m';
+figma.connect(RetweetM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=938:31284', {
+  variant: { Size: 'M' },
+  example: () => <RetweetM />,
+});
+
+import RetweetL from '@semcore/ui/icon/Retweet/l';
+figma.connect(RetweetL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=938:31284', {
+  variant: { Size: 'L' },
+  example: () => <RetweetL />,
+});
+
+import KebabM from '@semcore/ui/icon/Kebab/m';
+figma.connect(KebabM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1998:4', {
+  variant: { Size: 'M' },
+  example: () => <KebabM />,
+});
+
+import KebabL from '@semcore/ui/icon/Kebab/l';
+figma.connect(KebabL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1998:4', {
+  variant: { Size: 'L' },
+  example: () => <KebabL />,
+});
+
+import TwitterCarouselM from '@semcore/ui/icon/TwitterCarousel/m';
+figma.connect(TwitterCarouselM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:59', {
+  variant: { Size: 'M' },
+  example: () => <TwitterCarouselM />,
+});
+
+import TwitterCarouselL from '@semcore/ui/icon/TwitterCarousel/l';
+figma.connect(TwitterCarouselL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:59', {
+  variant: { Size: 'L' },
+  example: () => <TwitterCarouselL />,
+});
+
+import InstagramM from '@semcore/ui/icon/Instagram/m';
+figma.connect(InstagramM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=138:83', {
+  variant: { Size: 'M' },
+  example: () => <InstagramM />,
+});
+
+import InstagramL from '@semcore/ui/icon/Instagram/l';
+figma.connect(InstagramL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=138:83', {
+  variant: { Size: 'L' },
+  example: () => <InstagramL />,
+});
+
+import GenderFemaleM from '@semcore/ui/icon/GenderFemale/m';
+figma.connect(GenderFemaleM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:528', {
+  variant: { Size: 'M' },
+  example: () => <GenderFemaleM />,
+});
+
+import GenderFemaleL from '@semcore/ui/icon/GenderFemale/l';
+figma.connect(GenderFemaleL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:528', {
+  variant: { Size: 'L' },
+  example: () => <GenderFemaleL />,
+});
+
+import ChatCheckM from '@semcore/ui/icon/ChatCheck/m';
+figma.connect(ChatCheckM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:560', {
+  variant: { Size: 'M' },
+  example: () => <ChatCheckM />,
+});
+
+import ChatCheckL from '@semcore/ui/icon/ChatCheck/l';
+figma.connect(ChatCheckL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:560', {
+  variant: { Size: 'L' },
+  example: () => <ChatCheckL />,
+});
+
+import InfinityM from '@semcore/ui/icon/Infinity/m';
+figma.connect(InfinityM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=211:52', {
+  variant: { Size: 'M' },
+  example: () => <InfinityM />,
+});
+
+import InfinityL from '@semcore/ui/icon/Infinity/l';
+figma.connect(InfinityL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=211:52', {
+  variant: { Size: 'L' },
+  example: () => <InfinityL />,
+});
+
+import FarmM from '@semcore/ui/icon/Farm/m';
+figma.connect(FarmM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:14', {
+  variant: { Size: 'M' },
+  example: () => <FarmM />,
+});
+
+import FarmL from '@semcore/ui/icon/Farm/l';
+figma.connect(FarmL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:14', {
+  variant: { Size: 'L' },
+  example: () => <FarmL />,
+});
+
+import MailFilledM from '@semcore/ui/icon/MailFilled/m';
+figma.connect(MailFilledM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=517:23', {
+  variant: { Size: 'M' },
+  example: () => <MailFilledM />,
+});
+
+import MailFilledL from '@semcore/ui/icon/MailFilled/l';
+figma.connect(MailFilledL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=517:23', {
+  variant: { Size: 'L' },
+  example: () => <MailFilledL />,
+});
+
+import ChartBarStackedColumnM from '@semcore/ui/icon/ChartBarStackedColumn/m';
+figma.connect(ChartBarStackedColumnM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5304:4', {
+  variant: { Size: 'M' },
+  example: () => <ChartBarStackedColumnM />,
+});
+
+import ChartBarStackedColumnL from '@semcore/ui/icon/ChartBarStackedColumn/l';
+figma.connect(ChartBarStackedColumnL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5304:4', {
+  variant: { Size: 'L' },
+  example: () => <ChartBarStackedColumnL />,
+});
+
+import UndoM from '@semcore/ui/icon/Undo/m';
+figma.connect(UndoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=423:223', {
+  variant: { Size: 'M' },
+  example: () => <UndoM />,
+});
+
+import UndoL from '@semcore/ui/icon/Undo/l';
+figma.connect(UndoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=423:223', {
+  variant: { Size: 'L' },
+  example: () => <UndoL />,
+});
+
+import CalendarCheckM from '@semcore/ui/icon/CalendarCheck/m';
+figma.connect(CalendarCheckM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:2134', {
+  variant: { Size: 'M' },
+  example: () => <CalendarCheckM />,
+});
+
+import CalendarCheckL from '@semcore/ui/icon/CalendarCheck/l';
+figma.connect(CalendarCheckL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:2134', {
+  variant: { Size: 'L' },
+  example: () => <CalendarCheckL />,
+});
+
+import CrownM from '@semcore/ui/icon/Crown/m';
+figma.connect(CrownM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:2114', {
+  variant: { Size: 'M' },
+  example: () => <CrownM />,
+});
+
+import CrownL from '@semcore/ui/icon/Crown/l';
+figma.connect(CrownL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:2114', {
+  variant: { Size: 'L' },
+  example: () => <CrownL />,
+});
+
+import PictureM from '@semcore/ui/icon/Picture/m';
+figma.connect(PictureM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1034', {
+  variant: { Size: 'M' },
+  example: () => <PictureM />,
+});
+
+import PictureL from '@semcore/ui/icon/Picture/l';
+figma.connect(PictureL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1034', {
+  variant: { Size: 'L' },
+  example: () => <PictureL />,
+});
+
+import PopupAltM from '@semcore/ui/icon/PopupAlt/m';
+figma.connect(PopupAltM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6899:3', {
+  variant: { Size: 'M' },
+  example: () => <PopupAltM />,
+});
+
+import PopupAltL from '@semcore/ui/icon/PopupAlt/l';
+figma.connect(PopupAltL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6899:3', {
+  variant: { Size: 'L' },
+  example: () => <PopupAltL />,
+});
+
+import ExpandAltM from '@semcore/ui/icon/ExpandAlt/m';
+figma.connect(ExpandAltM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5213:4', {
+  variant: { Size: 'M' },
+  example: () => <ExpandAltM />,
+});
+
+import ExpandAltL from '@semcore/ui/icon/ExpandAlt/l';
+figma.connect(ExpandAltL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5213:4', {
+  variant: { Size: 'L' },
+  example: () => <ExpandAltL />,
+});
+
+import LightningM from '@semcore/ui/icon/Lightning/m';
+figma.connect(LightningM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=184:65', {
+  variant: { Size: 'M' },
+  example: () => <LightningM />,
+});
+
+import LightningL from '@semcore/ui/icon/Lightning/l';
+figma.connect(LightningL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=184:65', {
+  variant: { Size: 'L' },
+  example: () => <LightningL />,
+});
+
+import TableM from '@semcore/ui/icon/Table/m';
+figma.connect(TableM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1979', {
+  variant: { Size: 'M' },
+  example: () => <TableM />,
+});
+
+import TableL from '@semcore/ui/icon/Table/l';
+figma.connect(TableL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1979', {
+  variant: { Size: 'L' },
+  example: () => <TableL />,
+});
+
+import SmokingM from '@semcore/ui/icon/Smoking/m';
+figma.connect(SmokingM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:19', {
+  variant: { Size: 'M' },
+  example: () => <SmokingM />,
+});
+
+import SmokingL from '@semcore/ui/icon/Smoking/l';
+figma.connect(SmokingL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:19', {
+  variant: { Size: 'L' },
+  example: () => <SmokingL />,
+});
+
+import SettingsM from '@semcore/ui/icon/Settings/m';
+figma.connect(SettingsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:255', {
+  variant: { Size: 'M' },
+  example: () => <SettingsM />,
+});
+
+import SettingsL from '@semcore/ui/icon/Settings/l';
+figma.connect(SettingsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:255', {
+  variant: { Size: 'L' },
+  example: () => <SettingsL />,
+});
+
+import ReturnM from '@semcore/ui/icon/Return/m';
+figma.connect(ReturnM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=182:20', {
+  variant: { Size: 'M' },
+  example: () => <ReturnM />,
+});
+
+import ReturnL from '@semcore/ui/icon/Return/l';
+figma.connect(ReturnL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=182:20', {
+  variant: { Size: 'L' },
+  example: () => <ReturnL />,
+});
+
+import ChatQuestionM from '@semcore/ui/icon/ChatQuestion/m';
+figma.connect(ChatQuestionM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=429:421', {
+  variant: { Size: 'M' },
+  example: () => <ChatQuestionM />,
+});
+
+import ChatQuestionL from '@semcore/ui/icon/ChatQuestion/l';
+figma.connect(ChatQuestionL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=429:421', {
+  variant: { Size: 'L' },
+  example: () => <ChatQuestionL />,
+});
+
+import LinkM from '@semcore/ui/icon/Link/m';
+figma.connect(LinkM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=179:4', {
+  variant: { Size: 'M' },
+  example: () => <LinkM />,
+});
+
+import LinkL from '@semcore/ui/icon/Link/l';
+figma.connect(LinkL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=179:4', {
+  variant: { Size: 'L' },
+  example: () => <LinkL />,
+});
+
+import ThumbUpM from '@semcore/ui/icon/ThumbUp/m';
+figma.connect(ThumbUpM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:390', {
+  variant: { Size: 'M' },
+  example: () => <ThumbUpM />,
+});
+
+import ThumbUpL from '@semcore/ui/icon/ThumbUp/l';
+figma.connect(ThumbUpL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:390', {
+  variant: { Size: 'L' },
+  example: () => <ThumbUpL />,
+});
+
+import TimeDayM from '@semcore/ui/icon/TimeDay/m';
+figma.connect(TimeDayM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=498:20', {
+  variant: { Size: 'M' },
+  example: () => <TimeDayM />,
+});
+
+import TimeDayL from '@semcore/ui/icon/TimeDay/l';
+figma.connect(TimeDayL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=498:20', {
+  variant: { Size: 'L' },
+  example: () => <TimeDayL />,
+});
+
+import ExpandTextM from '@semcore/ui/icon/ExpandText/m';
+figma.connect(ExpandTextM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2845:14', {
+  variant: { Size: 'M' },
+  example: () => <ExpandTextM />,
+});
+
+import ExpandTextL from '@semcore/ui/icon/ExpandText/l';
+figma.connect(ExpandTextL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2845:14', {
+  variant: { Size: 'L' },
+  example: () => <ExpandTextL />,
+});
+
+import ToxicM from '@semcore/ui/icon/Toxic/m';
+figma.connect(ToxicM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=560:10', {
+  variant: { Size: 'M' },
+  example: () => <ToxicM />,
+});
+
+import ToxicL from '@semcore/ui/icon/Toxic/l';
+figma.connect(ToxicL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=560:10', {
+  variant: { Size: 'L' },
+  example: () => <ToxicL />,
+});
+
+import ReligionM from '@semcore/ui/icon/Religion/m';
+figma.connect(ReligionM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:94', {
+  variant: { Size: 'M' },
+  example: () => <ReligionM />,
+});
+
+import ReligionL from '@semcore/ui/icon/Religion/l';
+figma.connect(ReligionL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:94', {
+  variant: { Size: 'L' },
+  example: () => <ReligionL />,
+});
+
+import NewsM from '@semcore/ui/icon/News/m';
+figma.connect(NewsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:494', {
+  variant: { Size: 'M' },
+  example: () => <NewsM />,
+});
+
+import NewsL from '@semcore/ui/icon/News/l';
+figma.connect(NewsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:494', {
+  variant: { Size: 'L' },
+  example: () => <NewsL />,
+});
+
+import SecurityM from '@semcore/ui/icon/Security/m';
+figma.connect(SecurityM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:84', {
+  variant: { Size: 'M' },
+  example: () => <SecurityM />,
+});
+
+import SecurityL from '@semcore/ui/icon/Security/l';
+figma.connect(SecurityL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:84', {
+  variant: { Size: 'L' },
+  example: () => <SecurityL />,
+});
+
+import PrintingM from '@semcore/ui/icon/Printing/m';
+figma.connect(PrintingM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:134', {
+  variant: { Size: 'M' },
+  example: () => <PrintingM />,
+});
+
+import PrintingL from '@semcore/ui/icon/Printing/l';
+figma.connect(PrintingL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:134', {
+  variant: { Size: 'L' },
+  example: () => <PrintingL />,
+});
+
+import RecentM from '@semcore/ui/icon/Recent/m';
+figma.connect(RecentM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6696:2', {
+  variant: { Size: 'M' },
+  example: () => <RecentM />,
+});
+
+import RecentL from '@semcore/ui/icon/Recent/l';
+figma.connect(RecentL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6696:2', {
+  variant: { Size: 'L' },
+  example: () => <RecentL />,
+});
+
+import TackM from '@semcore/ui/icon/Tack/m';
+figma.connect(TackM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6757:33', {
+  variant: { Size: 'M' },
+  example: () => <TackM />,
+});
+
+import TackL from '@semcore/ui/icon/Tack/l';
+figma.connect(TackL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6757:33', {
+  variant: { Size: 'L' },
+  example: () => <TackL />,
+});
+
+import TimeNightM from '@semcore/ui/icon/TimeNight/m';
+figma.connect(TimeNightM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:77', {
+  variant: { Size: 'M' },
+  example: () => <TimeNightM />,
+});
+
+import TimeNightL from '@semcore/ui/icon/TimeNight/l';
+figma.connect(TimeNightL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:77', {
+  variant: { Size: 'L' },
+  example: () => <TimeNightL />,
+});
+
+import SemrushRankM from '@semcore/ui/icon/SemrushRank/m';
+figma.connect(SemrushRankM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=45:7', {
+  variant: { Size: 'M' },
+  example: () => <SemrushRankM />,
+});
+
+import SemrushRankL from '@semcore/ui/icon/SemrushRank/l';
+figma.connect(SemrushRankL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=45:7', {
+  variant: { Size: 'L' },
+  example: () => <SemrushRankL />,
+});
+
+import DesktopM from '@semcore/ui/icon/Desktop/m';
+figma.connect(DesktopM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:202', {
+  variant: { Size: 'M' },
+  example: () => <DesktopM />,
+});
+
+import DesktopL from '@semcore/ui/icon/Desktop/l';
+figma.connect(DesktopL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:202', {
+  variant: { Size: 'L' },
+  example: () => <DesktopL />,
+});
+
+import TackNoM from '@semcore/ui/icon/TackNo/m';
+figma.connect(TackNoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6757:38', {
+  variant: { Size: 'M' },
+  example: () => <TackNoM />,
+});
+
+import TackNoL from '@semcore/ui/icon/TackNo/l';
+figma.connect(TackNoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6757:38', {
+  variant: { Size: 'L' },
+  example: () => <TackNoL />,
+});
+
+import GiftM from '@semcore/ui/icon/Gift/m';
+figma.connect(GiftM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9042:2', {
+  variant: { Size: 'M' },
+  example: () => <GiftM />,
+});
+
+import GiftL from '@semcore/ui/icon/Gift/l';
+figma.connect(GiftL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9042:2', {
+  variant: { Size: 'L' },
+  example: () => <GiftL />,
+});
+
+import ClusteredListM from '@semcore/ui/icon/ClusteredList/m';
+figma.connect(ClusteredListM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2338:4', {
+  variant: { Size: 'M' },
+  example: () => <ClusteredListM />,
+});
+
+import ClusteredListL from '@semcore/ui/icon/ClusteredList/l';
+figma.connect(ClusteredListL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2338:4', {
+  variant: { Size: 'L' },
+  example: () => <ClusteredListL />,
+});
+
+import VideoStreamingM from '@semcore/ui/icon/VideoStreaming/m';
+figma.connect(VideoStreamingM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7331:8', {
+  variant: { Size: 'M' },
+  example: () => <VideoStreamingM />,
+});
+
+import VideoStreamingL from '@semcore/ui/icon/VideoStreaming/l';
+figma.connect(VideoStreamingL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7331:8', {
+  variant: { Size: 'L' },
+  example: () => <VideoStreamingL />,
+});
+
+import GamesM from '@semcore/ui/icon/Games/m';
+figma.connect(GamesM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:29', {
+  variant: { Size: 'M' },
+  example: () => <GamesM />,
+});
+
+import GamesL from '@semcore/ui/icon/Games/l';
+figma.connect(GamesL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:29', {
+  variant: { Size: 'L' },
+  example: () => <GamesL />,
+});
+
+import DocumentDropM from '@semcore/ui/icon/DocumentDrop/m';
+figma.connect(DocumentDropM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=436:39', {
+  variant: { Size: 'M' },
+  example: () => <DocumentDropM />,
+});
+
+import DocumentDropL from '@semcore/ui/icon/DocumentDrop/l';
+figma.connect(DocumentDropL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=436:39', {
+  variant: { Size: 'L' },
+  example: () => <DocumentDropL />,
+});
+
+import AttacheCaseM from '@semcore/ui/icon/AttacheCase/m';
+figma.connect(AttacheCaseM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4737:4', {
+  variant: { Size: 'M' },
+  example: () => <AttacheCaseM />,
+});
+
+import AttacheCaseL from '@semcore/ui/icon/AttacheCase/l';
+figma.connect(AttacheCaseL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4737:4', {
+  variant: { Size: 'L' },
+  example: () => <AttacheCaseL />,
+});
+
+import YextM from '@semcore/ui/icon/Yext/m';
+figma.connect(YextM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:320', {
+  variant: { Size: 'M' },
+  example: () => <YextM />,
+});
+
+import YextL from '@semcore/ui/icon/Yext/l';
+figma.connect(YextL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:320', {
+  variant: { Size: 'L' },
+  example: () => <YextL />,
+});
+
+import ChargebackLossM from '@semcore/ui/icon/ChargebackLoss/m';
+figma.connect(ChargebackLossM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2613:14', {
+  variant: { Size: 'M' },
+  example: () => <ChargebackLossM />,
+});
+
+import ChargebackLossL from '@semcore/ui/icon/ChargebackLoss/l';
+figma.connect(ChargebackLossL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2613:14', {
+  variant: { Size: 'L' },
+  example: () => <ChargebackLossL />,
+});
+
+import NotificationM from '@semcore/ui/icon/Notification/m';
+figma.connect(NotificationM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:29', {
+  variant: { Size: 'M' },
+  example: () => <NotificationM />,
+});
+
+import NotificationL from '@semcore/ui/icon/Notification/l';
+figma.connect(NotificationL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:29', {
+  variant: { Size: 'L' },
+  example: () => <NotificationL />,
+});
+
+import ShortVideosM from '@semcore/ui/icon/ShortVideos/m';
+figma.connect(ShortVideosM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:54', {
+  variant: { Size: 'M' },
+  example: () => <ShortVideosM />,
+});
+
+import ShortVideosL from '@semcore/ui/icon/ShortVideos/l';
+figma.connect(ShortVideosL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:54', {
+  variant: { Size: 'L' },
+  example: () => <ShortVideosL />,
+});
+
+import BookM from '@semcore/ui/icon/Book/m';
+figma.connect(BookM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=434:489', {
+  variant: { Size: 'M' },
+  example: () => <BookM />,
+});
+
+import BookL from '@semcore/ui/icon/Book/l';
+figma.connect(BookL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=434:489', {
+  variant: { Size: 'L' },
+  example: () => <BookL />,
+});
+
+import ChatFilledM from '@semcore/ui/icon/ChatFilled/m';
+figma.connect(ChatFilledM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=927:23681', {
+  variant: { Size: 'M' },
+  example: () => <ChatFilledM />,
+});
+
+import ChatFilledL from '@semcore/ui/icon/ChatFilled/l';
+figma.connect(ChatFilledL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=927:23681', {
+  variant: { Size: 'L' },
+  example: () => <ChatFilledL />,
+});
+
+import CarM from '@semcore/ui/icon/Car/m';
+figma.connect(CarM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:34', {
+  variant: { Size: 'M' },
+  example: () => <CarM />,
+});
+
+import CarL from '@semcore/ui/icon/Car/l';
+figma.connect(CarL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:34', {
+  variant: { Size: 'L' },
+  example: () => <CarL />,
+});
+
+import FeaturedVideoM from '@semcore/ui/icon/FeaturedVideo/m';
+figma.connect(FeaturedVideoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=211:62', {
+  variant: { Size: 'M' },
+  example: () => <FeaturedVideoM />,
+});
+
+import FeaturedVideoL from '@semcore/ui/icon/FeaturedVideo/l';
+figma.connect(FeaturedVideoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=211:62', {
+  variant: { Size: 'L' },
+  example: () => <FeaturedVideoL />,
+});
+
+import BulbM from '@semcore/ui/icon/Bulb/m';
+figma.connect(BulbM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:936', {
+  variant: { Size: 'M' },
+  example: () => <BulbM />,
+});
+
+import BulbL from '@semcore/ui/icon/Bulb/l';
+figma.connect(BulbL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:936', {
+  variant: { Size: 'L' },
+  example: () => <BulbL />,
+});
+
+import CardUpdateM from '@semcore/ui/icon/CardUpdate/m';
+figma.connect(CardUpdateM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2617:24', {
+  variant: { Size: 'M' },
+  example: () => <CardUpdateM />,
+});
+
+import CardUpdateL from '@semcore/ui/icon/CardUpdate/l';
+figma.connect(CardUpdateL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2617:24', {
+  variant: { Size: 'L' },
+  example: () => <CardUpdateL />,
+});
+
+import AdMiddleM from '@semcore/ui/icon/AdMiddle/m';
+figma.connect(AdMiddleM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5952:3', {
+  variant: { Size: 'M' },
+  example: () => <AdMiddleM />,
+});
+
+import AdMiddleL from '@semcore/ui/icon/AdMiddle/l';
+figma.connect(AdMiddleL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5952:3', {
+  variant: { Size: 'L' },
+  example: () => <AdMiddleL />,
+});
+
+import PowerM from '@semcore/ui/icon/Power/m';
+figma.connect(PowerM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5830:5', {
+  variant: { Size: 'M' },
+  example: () => <PowerM />,
+});
+
+import PowerL from '@semcore/ui/icon/Power/l';
+figma.connect(PowerL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5830:5', {
+  variant: { Size: 'L' },
+  example: () => <PowerL />,
+});
+
+import PositionMiddleM from '@semcore/ui/icon/PositionMiddle/m';
+figma.connect(PositionMiddleM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5952:8', {
+  variant: { Size: 'M' },
+  example: () => <PositionMiddleM />,
+});
+
+import PositionMiddleL from '@semcore/ui/icon/PositionMiddle/l';
+figma.connect(PositionMiddleL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5952:8', {
+  variant: { Size: 'L' },
+  example: () => <PositionMiddleL />,
+});
+
+import TikTokM from '@semcore/ui/icon/TikTok/m';
+figma.connect(TikTokM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6229:7', {
+  variant: { Size: 'M' },
+  example: () => <TikTokM />,
+});
+
+import TikTokL from '@semcore/ui/icon/TikTok/l';
+figma.connect(TikTokL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6229:7', {
+  variant: { Size: 'L' },
+  example: () => <TikTokL />,
+});
+
+import TrelloM from '@semcore/ui/icon/Trello/m';
+figma.connect(TrelloM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=138:291', {
+  variant: { Size: 'M' },
+  example: () => <TrelloM />,
+});
+
+import TrelloL from '@semcore/ui/icon/Trello/l';
+figma.connect(TrelloL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=138:291', {
+  variant: { Size: 'L' },
+  example: () => <TrelloL />,
+});
+
+import NoteM from '@semcore/ui/icon/Note/m';
+figma.connect(NoteM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9459:37', {
+  variant: { Size: 'M' },
+  example: () => <NoteM />,
+});
+
+import NoteL from '@semcore/ui/icon/Note/l';
+figma.connect(NoteL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9459:37', {
+  variant: { Size: 'L' },
+  example: () => <NoteL />,
+});
+
+import TextUnderlineM from '@semcore/ui/icon/TextUnderline/m';
+figma.connect(TextUnderlineM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9072:12', {
+  variant: { Size: 'M' },
+  example: () => <TextUnderlineM />,
+});
+
+import TextUnderlineL from '@semcore/ui/icon/TextUnderline/l';
+figma.connect(TextUnderlineL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9072:12', {
+  variant: { Size: 'L' },
+  example: () => <TextUnderlineL />,
+});
+
+import TextQuotesM from '@semcore/ui/icon/TextQuotes/m';
+figma.connect(TextQuotesM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9072:18', {
+  variant: { Size: 'M' },
+  example: () => <TextQuotesM />,
+});
+
+import TextQuotesL from '@semcore/ui/icon/TextQuotes/l';
+figma.connect(TextQuotesL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9072:18', {
+  variant: { Size: 'L' },
+  example: () => <TextQuotesL />,
+});
+
+import TextItalicM from '@semcore/ui/icon/TextItalic/m';
+figma.connect(TextItalicM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8974:13', {
+  variant: { Size: 'M' },
+  example: () => <TextItalicM />,
+});
+
+import TextItalicL from '@semcore/ui/icon/TextItalic/l';
+figma.connect(TextItalicL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8974:13', {
+  variant: { Size: 'L' },
+  example: () => <TextItalicL />,
+});
+
+import TextBoldM from '@semcore/ui/icon/TextBold/m';
+figma.connect(TextBoldM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9071:3', {
+  variant: { Size: 'M' },
+  example: () => <TextBoldM />,
+});
+
+import TextBoldL from '@semcore/ui/icon/TextBold/l';
+figma.connect(TextBoldL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9071:3', {
+  variant: { Size: 'L' },
+  example: () => <TextBoldL />,
+});
+
+import MathPlusM from '@semcore/ui/icon/MathPlus/m';
+figma.connect(MathPlusM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9:411', {
+  variant: { Size: 'M' },
+  example: () => <MathPlusM />,
+});
+
+import MathPlusL from '@semcore/ui/icon/MathPlus/l';
+figma.connect(MathPlusL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9:411', {
+  variant: { Size: 'L' },
+  example: () => <MathPlusL />,
+});
+
+import TextM from '@semcore/ui/icon/Text/m';
+figma.connect(TextM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:668', {
+  variant: { Size: 'M' },
+  example: () => <TextM />,
+});
+
+import TextL from '@semcore/ui/icon/Text/l';
+figma.connect(TextL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:668', {
+  variant: { Size: 'L' },
+  example: () => <TextL />,
+});
+
+import UnionPayM from '@semcore/ui/icon/pay/UnionPay/m';
+figma.connect(UnionPayM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:8', {
+  variant: { size: 'm' },
+  example: () => <UnionPayM />,
+});
+
+import UnionPayL from '@semcore/ui/icon/pay/UnionPay/l';
+figma.connect(UnionPayL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:8', {
+  variant: { size: 'l' },
+  example: () => <UnionPayL />,
+});
+
+import AmericanExpressM from '@semcore/ui/icon/pay/AmericanExpress/m';
+figma.connect(AmericanExpressM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:7', {
+  variant: { size: 'm' },
+  example: () => <AmericanExpressM />,
+});
+
+import AmericanExpressL from '@semcore/ui/icon/pay/AmericanExpress/l';
+figma.connect(AmericanExpressL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:7', {
+  variant: { size: 'l' },
+  example: () => <AmericanExpressL />,
+});
+
+import CreditCardM from '@semcore/ui/icon/pay/CreditCard/m';
+figma.connect(CreditCardM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:13', {
+  variant: { size: 'm' },
+  example: () => <CreditCardM />,
+});
+
+import CreditCardL from '@semcore/ui/icon/pay/CreditCard/l';
+figma.connect(CreditCardL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:13', {
+  variant: { size: 'l' },
+  example: () => <CreditCardL />,
+});
+
+import UserDemoM from '@semcore/ui/icon/UserDemo/m';
+figma.connect(UserDemoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=14:71', {
+  variant: { Size: 'M' },
+  example: () => <UserDemoM />,
+});
+
+import UserDemoL from '@semcore/ui/icon/UserDemo/l';
+figma.connect(UserDemoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=14:71', {
+  variant: { Size: 'L' },
+  example: () => <UserDemoL />,
+});
+
+import ChevronDownM from '@semcore/ui/icon/ChevronDown/m';
+figma.connect(ChevronDownM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4645', {
+  variant: { Size: 'M' },
+  example: () => <ChevronDownM />,
+});
+
+import ChevronDownL from '@semcore/ui/icon/ChevronDown/l';
+figma.connect(ChevronDownL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4645', {
+  variant: { Size: 'L' },
+  example: () => <ChevronDownL />,
+});
+
+import RecreationM from '@semcore/ui/icon/Recreation/m';
+figma.connect(RecreationM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:154', {
+  variant: { Size: 'M' },
+  example: () => <RecreationM />,
+});
+
+import RecreationL from '@semcore/ui/icon/Recreation/l';
+figma.connect(RecreationL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:154', {
+  variant: { Size: 'L' },
+  example: () => <RecreationL />,
+});
+
+import ChevronDoubleRightM from '@semcore/ui/icon/ChevronDoubleRight/m';
+figma.connect(ChevronDoubleRightM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=78:143', {
+  variant: { Size: 'M' },
+  example: () => <ChevronDoubleRightM />,
+});
+
+import ChevronDoubleRightL from '@semcore/ui/icon/ChevronDoubleRight/l';
+figma.connect(ChevronDoubleRightL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=78:143', {
+  variant: { Size: 'L' },
+  example: () => <ChevronDoubleRightL />,
+});
+
+import MobileM from '@semcore/ui/icon/Mobile/m';
+figma.connect(MobileM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:126', {
+  variant: { Size: 'M' },
+  example: () => <MobileM />,
+});
+
+import MobileL from '@semcore/ui/icon/Mobile/l';
+figma.connect(MobileL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:126', {
+  variant: { Size: 'L' },
+  example: () => <MobileL />,
+});
+
+import JCBM from '@semcore/ui/icon/pay/JCB/m';
+figma.connect(JCBM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:10', {
+  variant: { size: 'm' },
+  example: () => <JCBM />,
+});
+
+import JCBL from '@semcore/ui/icon/pay/JCB/l';
+figma.connect(JCBL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:10', {
+  variant: { size: 'l' },
+  example: () => <JCBL />,
+});
+
+import SecurityNoM from '@semcore/ui/icon/SecurityNo/m';
+figma.connect(SecurityNoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3980:4', {
+  variant: { Size: 'M' },
+  example: () => <SecurityNoM />,
+});
+
+import SecurityNoL from '@semcore/ui/icon/SecurityNo/l';
+figma.connect(SecurityNoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3980:4', {
+  variant: { Size: 'L' },
+  example: () => <SecurityNoL />,
+});
+
+import ReportM from '@semcore/ui/icon/Report/m';
+figma.connect(ReportM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1201', {
+  variant: { Size: 'M' },
+  example: () => <ReportM />,
+});
+
+import ReportL from '@semcore/ui/icon/Report/l';
+figma.connect(ReportL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1201', {
+  variant: { Size: 'L' },
+  example: () => <ReportL />,
+});
+
+import PositionBottomM from '@semcore/ui/icon/PositionBottom/m';
+figma.connect(PositionBottomM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=388:9', {
+  variant: { Size: 'M' },
+  example: () => <PositionBottomM />,
+});
+
+import PositionBottomL from '@semcore/ui/icon/PositionBottom/l';
+figma.connect(PositionBottomL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=388:9', {
+  variant: { Size: 'L' },
+  example: () => <PositionBottomL />,
+});
+
+import PictureFrameM from '@semcore/ui/icon/PictureFrame/m';
+figma.connect(PictureFrameM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=388:4', {
+  variant: { Size: 'M' },
+  example: () => <PictureFrameM />,
+});
+
+import PictureFrameL from '@semcore/ui/icon/PictureFrame/l';
+figma.connect(PictureFrameL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=388:4', {
+  variant: { Size: 'L' },
+  example: () => <PictureFrameL />,
+});
+
+import WeChatPayM from '@semcore/ui/icon/pay/WeChatPay/m';
+figma.connect(WeChatPayM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:11', {
+  variant: { size: 'm' },
+  example: () => <WeChatPayM />,
+});
+
+import WeChatPayL from '@semcore/ui/icon/pay/WeChatPay/l';
+figma.connect(WeChatPayL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:11', {
+  variant: { size: 'l' },
+  example: () => <WeChatPayL />,
+});
+
+import ExitM from '@semcore/ui/icon/Exit/m';
+figma.connect(ExitM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=436:4', {
+  variant: { Size: 'M' },
+  example: () => <ExitM />,
+});
+
+import ExitL from '@semcore/ui/icon/Exit/l';
+figma.connect(ExitL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=436:4', {
+  variant: { Size: 'L' },
+  example: () => <ExitL />,
+});
+
+import LaptopM from '@semcore/ui/icon/Laptop/m';
+figma.connect(LaptopM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:197', {
+  variant: { Size: 'M' },
+  example: () => <LaptopM />,
+});
+
+import LaptopL from '@semcore/ui/icon/Laptop/l';
+figma.connect(LaptopL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:197', {
+  variant: { Size: 'L' },
+  example: () => <LaptopL />,
+});
+
+import DinersM from '@semcore/ui/icon/pay/Diners/m';
+figma.connect(DinersM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4193:4', {
+  variant: { size: 'm' },
+  example: () => <DinersM />,
+});
+
+import DinersL from '@semcore/ui/icon/pay/Diners/l';
+figma.connect(DinersL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4193:4', {
+  variant: { size: 'l' },
+  example: () => <DinersL />,
+});
+
+import FeaturedImageM from '@semcore/ui/icon/FeaturedImage/m';
+figma.connect(FeaturedImageM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=211:67', {
+  variant: { Size: 'M' },
+  example: () => <FeaturedImageM />,
+});
+
+import FeaturedImageL from '@semcore/ui/icon/FeaturedImage/l';
+figma.connect(FeaturedImageL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=211:67', {
+  variant: { Size: 'L' },
+  example: () => <FeaturedImageL />,
+});
+
+import UnarchiveM from '@semcore/ui/icon/Unarchive/m';
+figma.connect(UnarchiveM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2530:4', {
+  variant: { Size: 'M' },
+  example: () => <UnarchiveM />,
+});
+
+import UnarchiveL from '@semcore/ui/icon/Unarchive/l';
+figma.connect(UnarchiveL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2530:4', {
+  variant: { Size: 'L' },
+  example: () => <UnarchiveL />,
+});
+
+import DiscoverM from '@semcore/ui/icon/pay/Discover/m';
+figma.connect(DiscoverM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:9', {
+  variant: { size: 'm' },
+  example: () => <DiscoverM />,
+});
+
+import DiscoverL from '@semcore/ui/icon/pay/Discover/l';
+figma.connect(DiscoverL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:9', {
+  variant: { size: 'l' },
+  example: () => <DiscoverL />,
+});
+
+import SentM from '@semcore/ui/icon/Sent/m';
+figma.connect(SentM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=508:5', {
+  variant: { Size: 'M' },
+  example: () => <SentM />,
+});
+
+import SentL from '@semcore/ui/icon/Sent/l';
+figma.connect(SentL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=508:5', {
+  variant: { Size: 'L' },
+  example: () => <SentL />,
+});
+
+import VisaM from '@semcore/ui/icon/pay/Visa/m';
+figma.connect(VisaM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:5', {
+  variant: { size: 'm' },
+  example: () => <VisaM />,
+});
+
+import VisaL from '@semcore/ui/icon/pay/Visa/l';
+figma.connect(VisaL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:5', {
+  variant: { size: 'l' },
+  example: () => <VisaL />,
+});
+
+import PulseM from '@semcore/ui/icon/Pulse/m';
+figma.connect(PulseM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=56:4', {
+  variant: { Size: 'M' },
+  example: () => <PulseM />,
+});
+
+import PulseL from '@semcore/ui/icon/Pulse/l';
+figma.connect(PulseL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=56:4', {
+  variant: { Size: 'L' },
+  example: () => <PulseL />,
+});
+
+import TelescopeM from '@semcore/ui/icon/Telescope/m';
+figma.connect(TelescopeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1061', {
+  variant: { Size: 'M' },
+  example: () => <TelescopeM />,
+});
+
+import TelescopeL from '@semcore/ui/icon/Telescope/l';
+figma.connect(TelescopeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1061', {
+  variant: { Size: 'L' },
+  example: () => <TelescopeL />,
+});
+
+import AdM from '@semcore/ui/icon/Ad/m';
+figma.connect(AdM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=426:298', {
+  variant: { Size: 'M' },
+  example: () => <AdM />,
+});
+
+import AdL from '@semcore/ui/icon/Ad/l';
+figma.connect(AdL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=426:298', {
+  variant: { Size: 'L' },
+  example: () => <AdL />,
+});
+
+import WordpressM from '@semcore/ui/icon/Wordpress/m';
+figma.connect(WordpressM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=217:167', {
+  variant: { Size: 'M' },
+  example: () => <WordpressM />,
+});
+
+import WordpressL from '@semcore/ui/icon/Wordpress/l';
+figma.connect(WordpressL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=217:167', {
+  variant: { Size: 'L' },
+  example: () => <WordpressL />,
+});
+
+import RssM from '@semcore/ui/icon/Rss/m';
+figma.connect(RssM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=211:57', {
+  variant: { Size: 'M' },
+  example: () => <RssM />,
+});
+
+import RssL from '@semcore/ui/icon/Rss/l';
+figma.connect(RssL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=211:57', {
+  variant: { Size: 'L' },
+  example: () => <RssL />,
+});
+
+import SkypeM from '@semcore/ui/icon/Skype/m';
+figma.connect(SkypeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=391:44', {
+  variant: { Size: 'M' },
+  example: () => <SkypeM />,
+});
+
+import SkypeL from '@semcore/ui/icon/Skype/l';
+figma.connect(SkypeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=391:44', {
+  variant: { Size: 'L' },
+  example: () => <SkypeL />,
+});
+
+import StopM from '@semcore/ui/icon/Stop/m';
+figma.connect(StopM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=423:289', {
+  variant: { Size: 'M' },
+  example: () => <StopM />,
+});
+
+import StopL from '@semcore/ui/icon/Stop/l';
+figma.connect(StopL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=423:289', {
+  variant: { Size: 'L' },
+  example: () => <StopL />,
+});
+
+import ChargebackWinM from '@semcore/ui/icon/ChargebackWin/m';
+figma.connect(ChargebackWinM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2613:9', {
+  variant: { Size: 'M' },
+  example: () => <ChargebackWinM />,
+});
+
+import ChargebackWinL from '@semcore/ui/icon/ChargebackWin/l';
+figma.connect(ChargebackWinL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2613:9', {
+  variant: { Size: 'L' },
+  example: () => <ChargebackWinL />,
+});
+
+import RobotM from '@semcore/ui/icon/Robot/m';
+figma.connect(RobotM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=184:70', {
+  variant: { Size: 'M' },
+  example: () => <RobotM />,
+});
+
+import RobotL from '@semcore/ui/icon/Robot/l';
+figma.connect(RobotL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=184:70', {
+  variant: { Size: 'L' },
+  example: () => <RobotL />,
+});
+
+import CopyM from '@semcore/ui/icon/Copy/m';
+figma.connect(CopyM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:283', {
+  variant: { Size: 'M' },
+  example: () => <CopyM />,
+});
+
+import CopyL from '@semcore/ui/icon/Copy/l';
+figma.connect(CopyL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:283', {
+  variant: { Size: 'L' },
+  example: () => <CopyL />,
+});
+
+import TileM from '@semcore/ui/icon/Tile/m';
+figma.connect(TileM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1974', {
+  variant: { Size: 'M' },
+  example: () => <TileM />,
+});
+
+import TileL from '@semcore/ui/icon/Tile/l';
+figma.connect(TileL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1974', {
+  variant: { Size: 'L' },
+  example: () => <TileL />,
+});
+
+import StrollerM from '@semcore/ui/icon/Stroller/m';
+figma.connect(StrollerM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2678:4', {
+  variant: { Size: 'M' },
+  example: () => <StrollerM />,
+});
+
+import StrollerL from '@semcore/ui/icon/Stroller/l';
+figma.connect(StrollerL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2678:4', {
+  variant: { Size: 'L' },
+  example: () => <StrollerL />,
+});
+
+import HealthM from '@semcore/ui/icon/Health/m';
+figma.connect(HealthM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=146:4', {
+  variant: { Size: 'M' },
+  example: () => <HealthM />,
+});
+
+import HealthL from '@semcore/ui/icon/Health/l';
+figma.connect(HealthL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=146:4', {
+  variant: { Size: 'L' },
+  example: () => <HealthL />,
+});
+
+import VeterinaryM from '@semcore/ui/icon/Veterinary/m';
+figma.connect(VeterinaryM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:109', {
+  variant: { Size: 'M' },
+  example: () => <VeterinaryM />,
+});
+
+import VeterinaryL from '@semcore/ui/icon/Veterinary/l';
+figma.connect(VeterinaryL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:109', {
+  variant: { Size: 'L' },
+  example: () => <VeterinaryL />,
+});
+
+import TagFilledM from '@semcore/ui/icon/TagFilled/m';
+figma.connect(TagFilledM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=226:382', {
+  variant: { Size: 'M' },
+  example: () => <TagFilledM />,
+});
+
+import TagFilledL from '@semcore/ui/icon/TagFilled/l';
+figma.connect(TagFilledL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=226:382', {
+  variant: { Size: 'L' },
+  example: () => <TagFilledL />,
+});
+
+import SitemapM from '@semcore/ui/icon/Sitemap/m';
+figma.connect(SitemapM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=184:60', {
+  variant: { Size: 'M' },
+  example: () => <SitemapM />,
+});
+
+import SitemapL from '@semcore/ui/icon/Sitemap/l';
+figma.connect(SitemapL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=184:60', {
+  variant: { Size: 'L' },
+  example: () => <SitemapL />,
+});
+
+import ValueM from '@semcore/ui/icon/Value/m';
+figma.connect(ValueM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=546:162', {
+  variant: { Size: 'M' },
+  example: () => <ValueM />,
+});
+
+import ValueL from '@semcore/ui/icon/Value/l';
+figma.connect(ValueL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=546:162', {
+  variant: { Size: 'L' },
+  example: () => <ValueL />,
+});
+
+import BracketsCurlyM from '@semcore/ui/icon/BracketsCurly/m';
+figma.connect(BracketsCurlyM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=56:32', {
+  variant: { Size: 'M' },
+  example: () => <BracketsCurlyM />,
+});
+
+import BracketsCurlyL from '@semcore/ui/icon/BracketsCurly/l';
+figma.connect(BracketsCurlyL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=56:32', {
+  variant: { Size: 'L' },
+  example: () => <BracketsCurlyL />,
+});
+
+import VolumeUpM from '@semcore/ui/icon/VolumeUp/m';
+figma.connect(VolumeUpM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=431:478', {
+  variant: { Size: 'M' },
+  example: () => <VolumeUpM />,
+});
+
+import VolumeUpL from '@semcore/ui/icon/VolumeUp/l';
+figma.connect(VolumeUpL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=431:478', {
+  variant: { Size: 'L' },
+  example: () => <VolumeUpL />,
+});
+
+import DropM from '@semcore/ui/icon/Drop/m';
+figma.connect(DropM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=436:25', {
+  variant: { Size: 'M' },
+  example: () => <DropM />,
+});
+
+import DropL from '@semcore/ui/icon/Drop/l';
+figma.connect(DropL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=436:25', {
+  variant: { Size: 'L' },
+  example: () => <DropL />,
+});
+
+import FolderM from '@semcore/ui/icon/Folder/m';
+figma.connect(FolderM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=136:58', {
+  variant: { Size: 'M' },
+  example: () => <FolderM />,
+});
+
+import FolderL from '@semcore/ui/icon/Folder/l';
+figma.connect(FolderL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=136:58', {
+  variant: { Size: 'L' },
+  example: () => <FolderL />,
+});
+
+import SafariM from '@semcore/ui/icon/Safari/m';
+figma.connect(SafariM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=391:49', {
+  variant: { Size: 'M' },
+  example: () => <SafariM />,
+});
+
+import SafariL from '@semcore/ui/icon/Safari/l';
+figma.connect(SafariL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=391:49', {
+  variant: { Size: 'L' },
+  example: () => <SafariL />,
+});
+
+import QuestionsAnswersM from '@semcore/ui/icon/QuestionsAnswers/m';
+figma.connect(QuestionsAnswersM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5718:14', {
+  variant: { Size: 'M' },
+  example: () => <QuestionsAnswersM />,
+});
+
+import QuestionsAnswersL from '@semcore/ui/icon/QuestionsAnswers/l';
+figma.connect(QuestionsAnswersL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5718:14', {
+  variant: { Size: 'L' },
+  example: () => <QuestionsAnswersL />,
+});
+
+import FileUploadM from '@semcore/ui/icon/FileUpload/m';
+figma.connect(FileUploadM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=244:117', {
+  variant: { Size: 'M' },
+  example: () => <FileUploadM />,
+});
+
+import FileUploadL from '@semcore/ui/icon/FileUpload/l';
+figma.connect(FileUploadL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=244:117', {
+  variant: { Size: 'L' },
+  example: () => <FileUploadL />,
+});
+
+import ScienceM from '@semcore/ui/icon/Science/m';
+figma.connect(ScienceM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:129', {
+  variant: { Size: 'M' },
+  example: () => <ScienceM />,
+});
+
+import ScienceL from '@semcore/ui/icon/Science/l';
+figma.connect(ScienceL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:129', {
+  variant: { Size: 'L' },
+  example: () => <ScienceL />,
+});
+
+import PopularProductsM from '@semcore/ui/icon/PopularProducts/m';
+figma.connect(PopularProductsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:34', {
+  variant: { Size: 'M' },
+  example: () => <PopularProductsM />,
+});
+
+import PopularProductsL from '@semcore/ui/icon/PopularProducts/l';
+figma.connect(PopularProductsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:34', {
+  variant: { Size: 'L' },
+  example: () => <PopularProductsL />,
+});
+
+import MuseumM from '@semcore/ui/icon/Museum/m';
+figma.connect(MuseumM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1206', {
+  variant: { Size: 'M' },
+  example: () => <MuseumM />,
+});
+
+import MuseumL from '@semcore/ui/icon/Museum/l';
+figma.connect(MuseumL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1206', {
+  variant: { Size: 'L' },
+  example: () => <MuseumL />,
+});
+
+import MedkitM from '@semcore/ui/icon/Medkit/m';
+figma.connect(MedkitM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=211:47', {
+  variant: { Size: 'M' },
+  example: () => <MedkitM />,
+});
+
+import MedkitL from '@semcore/ui/icon/Medkit/l';
+figma.connect(MedkitL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=211:47', {
+  variant: { Size: 'L' },
+  example: () => <MedkitL />,
+});
+
+import PopupM from '@semcore/ui/icon/Popup/m';
+figma.connect(PopupM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=526:5', {
+  variant: { Size: 'M' },
+  example: () => <PopupM />,
+});
+
+import PopupL from '@semcore/ui/icon/Popup/l';
+figma.connect(PopupL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=526:5', {
+  variant: { Size: 'L' },
+  example: () => <PopupL />,
+});
+
+import FashionM from '@semcore/ui/icon/Fashion/m';
+figma.connect(FashionM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:139', {
+  variant: { Size: 'M' },
+  example: () => <FashionM />,
+});
+
+import FashionL from '@semcore/ui/icon/Fashion/l';
+figma.connect(FashionL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:139', {
+  variant: { Size: 'L' },
+  example: () => <FashionL />,
+});
+
+import ReloadM from '@semcore/ui/icon/Reload/m';
+figma.connect(ReloadM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=179:10', {
+  variant: { Size: 'M' },
+  example: () => <ReloadM />,
+});
+
+import ReloadL from '@semcore/ui/icon/Reload/l';
+figma.connect(ReloadL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=179:10', {
+  variant: { Size: 'L' },
+  example: () => <ReloadL />,
+});
+
+import FacebookM from '@semcore/ui/icon/Facebook/m';
+figma.connect(FacebookM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:630', {
+  variant: { Size: 'M' },
+  example: () => <FacebookM />,
+});
+
+import FacebookL from '@semcore/ui/icon/Facebook/l';
+figma.connect(FacebookL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:630', {
+  variant: { Size: 'L' },
+  example: () => <FacebookL />,
+});
+
+import CursorMoveM from '@semcore/ui/icon/CursorMove/m';
+figma.connect(CursorMoveM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:972', {
+  variant: { Size: 'M' },
+  example: () => <CursorMoveM />,
+});
+
+import CursorMoveL from '@semcore/ui/icon/CursorMove/l';
+figma.connect(CursorMoveL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:972', {
+  variant: { Size: 'L' },
+  example: () => <CursorMoveL />,
+});
+
+import BookmarkM from '@semcore/ui/icon/Bookmark/m';
+figma.connect(BookmarkM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=245:9', {
+  variant: { Size: 'M' },
+  example: () => <BookmarkM />,
+});
+
+import BookmarkL from '@semcore/ui/icon/Bookmark/l';
+figma.connect(BookmarkL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=245:9', {
+  variant: { Size: 'L' },
+  example: () => <BookmarkL />,
+});
+
+import EditM from '@semcore/ui/icon/Edit/m';
+figma.connect(EditM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:288', {
+  variant: { Size: 'M' },
+  example: () => <EditM />,
+});
+
+import EditL from '@semcore/ui/icon/Edit/l';
+figma.connect(EditL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:288', {
+  variant: { Size: 'L' },
+  example: () => <EditL />,
+});
+
+import CollapseM from '@semcore/ui/icon/Collapse/m';
+figma.connect(CollapseM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=436:16', {
+  variant: { Size: 'M' },
+  example: () => <CollapseM />,
+});
+
+import CollapseL from '@semcore/ui/icon/Collapse/l';
+figma.connect(CollapseL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=436:16', {
+  variant: { Size: 'L' },
+  example: () => <CollapseL />,
+});
+
+import LanguageM from '@semcore/ui/icon/Language/m';
+figma.connect(LanguageM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:24', {
+  variant: { Size: 'M' },
+  example: () => <LanguageM />,
+});
+
+import LanguageL from '@semcore/ui/icon/Language/l';
+figma.connect(LanguageL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:24', {
+  variant: { Size: 'L' },
+  example: () => <LanguageL />,
+});
+
+import ChartPieM from '@semcore/ui/icon/ChartPie/m';
+figma.connect(ChartPieM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=209:19', {
+  variant: { Size: 'M' },
+  example: () => <ChartPieM />,
+});
+
+import ChartPieL from '@semcore/ui/icon/ChartPie/l';
+figma.connect(ChartPieL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=209:19', {
+  variant: { Size: 'L' },
+  example: () => <ChartPieL />,
+});
+
+import HamburgerM from '@semcore/ui/icon/Hamburger/m';
+figma.connect(HamburgerM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:582', {
+  variant: { Size: 'M' },
+  example: () => <HamburgerM />,
+});
+
+import HamburgerL from '@semcore/ui/icon/Hamburger/l';
+figma.connect(HamburgerL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:582', {
+  variant: { Size: 'L' },
+  example: () => <HamburgerL />,
+});
+
+import CraftM from '@semcore/ui/icon/Craft/m';
+figma.connect(CraftM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:44', {
+  variant: { Size: 'M' },
+  example: () => <CraftM />,
+});
+
+import CraftL from '@semcore/ui/icon/Craft/l';
+figma.connect(CraftL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:44', {
+  variant: { Size: 'L' },
+  example: () => <CraftL />,
+});
+
+import EventsM from '@semcore/ui/icon/Events/m';
+figma.connect(EventsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:149', {
+  variant: { Size: 'M' },
+  example: () => <EventsM />,
+});
+
+import EventsL from '@semcore/ui/icon/Events/l';
+figma.connect(EventsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:149', {
+  variant: { Size: 'L' },
+  example: () => <EventsL />,
+});
+
+import FoodM from '@semcore/ui/icon/Food/m';
+figma.connect(FoodM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:9', {
+  variant: { Size: 'M' },
+  example: () => <FoodM />,
+});
+
+import FoodL from '@semcore/ui/icon/Food/l';
+figma.connect(FoodL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:9', {
+  variant: { Size: 'L' },
+  example: () => <FoodL />,
+});
+
+import FishM from '@semcore/ui/icon/Fish/m';
+figma.connect(FishM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:79', {
+  variant: { Size: 'M' },
+  example: () => <FishM />,
+});
+
+import FishL from '@semcore/ui/icon/Fish/l';
+figma.connect(FishL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:79', {
+  variant: { Size: 'L' },
+  example: () => <FishL />,
+});
+
+import HourglassM from '@semcore/ui/icon/Hourglass/m';
+figma.connect(HourglassM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=224:303', {
+  variant: { Size: 'M' },
+  example: () => <HourglassM />,
+});
+
+import HourglassL from '@semcore/ui/icon/Hourglass/l';
+figma.connect(HourglassL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=224:303', {
+  variant: { Size: 'L' },
+  example: () => <HourglassL />,
+});
+
+import EventM from '@semcore/ui/icon/Event/m';
+figma.connect(EventM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:24', {
+  variant: { Size: 'M' },
+  example: () => <EventM />,
+});
+
+import EventL from '@semcore/ui/icon/Event/l';
+figma.connect(EventL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:24', {
+  variant: { Size: 'L' },
+  example: () => <EventL />,
+});
+
+import FireM from '@semcore/ui/icon/Fire/m';
+figma.connect(FireM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=624:424', {
+  variant: { Size: 'M' },
+  example: () => <FireM />,
+});
+
+import FireL from '@semcore/ui/icon/Fire/l';
+figma.connect(FireL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=624:424', {
+  variant: { Size: 'L' },
+  example: () => <FireL />,
+});
+
+import JewelryM from '@semcore/ui/icon/Jewelry/m';
+figma.connect(JewelryM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:179', {
+  variant: { Size: 'M' },
+  example: () => <JewelryM />,
+});
+
+import JewelryL from '@semcore/ui/icon/Jewelry/l';
+figma.connect(JewelryL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:179', {
+  variant: { Size: 'L' },
+  example: () => <JewelryL />,
+});
+
+import MusicM from '@semcore/ui/icon/Music/m';
+figma.connect(MusicM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:159', {
+  variant: { Size: 'M' },
+  example: () => <MusicM />,
+});
+
+import MusicL from '@semcore/ui/icon/Music/l';
+figma.connect(MusicL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:159', {
+  variant: { Size: 'L' },
+  example: () => <MusicL />,
+});
+
+import FormM from '@semcore/ui/icon/Form/m';
+figma.connect(FormM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:913', {
+  variant: { Size: 'M' },
+  example: () => <FormM />,
+});
+
+import FormL from '@semcore/ui/icon/Form/l';
+figma.connect(FormL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:913', {
+  variant: { Size: 'L' },
+  example: () => <FormL />,
+});
+
+import ListNumberM from '@semcore/ui/icon/ListNumber/m';
+figma.connect(ListNumberM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=503:4', {
+  variant: { Size: 'M' },
+  example: () => <ListNumberM />,
+});
+
+import ListNumberL from '@semcore/ui/icon/ListNumber/l';
+figma.connect(ListNumberL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=503:4', {
+  variant: { Size: 'L' },
+  example: () => <ListNumberL />,
+});
+
+import PublicSafetyM from '@semcore/ui/icon/PublicSafety/m';
+figma.connect(PublicSafetyM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:89', {
+  variant: { Size: 'M' },
+  example: () => <PublicSafetyM />,
+});
+
+import PublicSafetyL from '@semcore/ui/icon/PublicSafety/l';
+figma.connect(PublicSafetyL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:89', {
+  variant: { Size: 'L' },
+  example: () => <PublicSafetyL />,
+});
+
+import KeyCmdM from '@semcore/ui/icon/KeyCmd/m';
+figma.connect(KeyCmdM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:545', {
+  variant: { Size: 'M' },
+  example: () => <KeyCmdM />,
+});
+
+import KeyCmdL from '@semcore/ui/icon/KeyCmd/l';
+figma.connect(KeyCmdL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:545', {
+  variant: { Size: 'L' },
+  example: () => <KeyCmdL />,
+});
+
+import VideoM from '@semcore/ui/icon/Video/m';
+figma.connect(VideoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:500', {
+  variant: { Size: 'M' },
+  example: () => <VideoM />,
+});
+
+import VideoL from '@semcore/ui/icon/Video/l';
+figma.connect(VideoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:500', {
+  variant: { Size: 'L' },
+  example: () => <VideoL />,
+});
+
+import ShowNoM from '@semcore/ui/icon/ShowNo/m';
+figma.connect(ShowNoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=648:9', {
+  variant: { Size: 'M' },
+  example: () => <ShowNoM />,
+});
+
+import ShowNoL from '@semcore/ui/icon/ShowNo/l';
+figma.connect(ShowNoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=648:9', {
+  variant: { Size: 'L' },
+  example: () => <ShowNoL />,
+});
+
+import ChartBubbleM from '@semcore/ui/icon/ChartBubble/m';
+figma.connect(ChartBubbleM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=209:30', {
+  variant: { Size: 'M' },
+  example: () => <ChartBubbleM />,
+});
+
+import ChartBubbleL from '@semcore/ui/icon/ChartBubble/l';
+figma.connect(ChartBubbleL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=209:30', {
+  variant: { Size: 'L' },
+  example: () => <ChartBubbleL />,
+});
+
+import ListCheckM from '@semcore/ui/icon/ListCheck/m';
+figma.connect(ListCheckM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:663', {
+  variant: { Size: 'M' },
+  example: () => <ListCheckM />,
+});
+
+import ListCheckL from '@semcore/ui/icon/ListCheck/l';
+figma.connect(ListCheckL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:663', {
+  variant: { Size: 'L' },
+  example: () => <ListCheckL />,
+});
+
+import GlobeM from '@semcore/ui/icon/Globe/m';
+figma.connect(GlobeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=11:890', {
+  variant: { Size: 'M' },
+  example: () => <GlobeM />,
+});
+
+import GlobeL from '@semcore/ui/icon/Globe/l';
+figma.connect(GlobeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=11:890', {
+  variant: { Size: 'L' },
+  example: () => <GlobeL />,
+});
+
+import PinUsdM from '@semcore/ui/icon/PinUsd/m';
+figma.connect(PinUsdM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=519:139', {
+  variant: { Size: 'M' },
+  example: () => <PinUsdM />,
+});
+
+import PinUsdL from '@semcore/ui/icon/PinUsd/l';
+figma.connect(PinUsdL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=519:139', {
+  variant: { Size: 'L' },
+  example: () => <PinUsdL />,
+});
+
+import CutM from '@semcore/ui/icon/Cut/m';
+figma.connect(CutM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=210:18', {
+  variant: { Size: 'M' },
+  example: () => <CutM />,
+});
+
+import CutL from '@semcore/ui/icon/Cut/l';
+figma.connect(CutL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=210:18', {
+  variant: { Size: 'L' },
+  example: () => <CutL />,
+});
+
+import KeyM from '@semcore/ui/icon/Key/m';
+figma.connect(KeyM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=437:46', {
+  variant: { Size: 'M' },
+  example: () => <KeyM />,
+});
+
+import KeyL from '@semcore/ui/icon/Key/l';
+figma.connect(KeyL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=437:46', {
+  variant: { Size: 'L' },
+  example: () => <KeyL />,
+});
+
+import MagicWandM from '@semcore/ui/icon/MagicWand/m';
+figma.connect(MagicWandM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1115', {
+  variant: { Size: 'M' },
+  example: () => <MagicWandM />,
+});
+
+import MagicWandL from '@semcore/ui/icon/MagicWand/l';
+figma.connect(MagicWandL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1115', {
+  variant: { Size: 'L' },
+  example: () => <MagicWandL />,
+});
+
+import MasterCardM from '@semcore/ui/icon/pay/MasterCard/m';
+figma.connect(MasterCardM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:6', {
+  variant: { size: 'm' },
+  example: () => <MasterCardM />,
+});
+
+import MasterCardL from '@semcore/ui/icon/pay/MasterCard/l';
+figma.connect(MasterCardL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:6', {
+  variant: { size: 'l' },
+  example: () => <MasterCardL />,
+});
+
+import MailM from '@semcore/ui/icon/Mail/m';
+figma.connect(MailM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=518:33', {
+  variant: { Size: 'M' },
+  example: () => <MailM />,
+});
+
+import MailL from '@semcore/ui/icon/Mail/l';
+figma.connect(MailL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=518:33', {
+  variant: { Size: 'L' },
+  example: () => <MailL />,
+});
+
+import OrganicM from '@semcore/ui/icon/Organic/m';
+figma.connect(OrganicM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=211:42', {
+  variant: { Size: 'M' },
+  example: () => <OrganicM />,
+});
+
+import OrganicL from '@semcore/ui/icon/Organic/l';
+figma.connect(OrganicL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=211:42', {
+  variant: { Size: 'L' },
+  example: () => <OrganicL />,
+});
+
+import PauseM from '@semcore/ui/icon/Pause/m';
+figma.connect(PauseM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:558', {
+  variant: { Size: 'M' },
+  example: () => <PauseM />,
+});
+
+import PauseL from '@semcore/ui/icon/Pause/l';
+figma.connect(PauseL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:558', {
+  variant: { Size: 'L' },
+  example: () => <PauseL />,
+});
+
+import MarineM from '@semcore/ui/icon/Marine/m';
+figma.connect(MarineM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:54', {
+  variant: { Size: 'M' },
+  example: () => <MarineM />,
+});
+
+import MarineL from '@semcore/ui/icon/Marine/l';
+figma.connect(MarineL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:54', {
+  variant: { Size: 'L' },
+  example: () => <MarineL />,
+});
+
+import SortAscM from '@semcore/ui/icon/SortAsc/m';
+figma.connect(SortAscM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:2025', {
+  variant: { Size: 'M' },
+  example: () => <SortAscM />,
+});
+
+import SortAscL from '@semcore/ui/icon/SortAsc/l';
+figma.connect(SortAscL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:2025', {
+  variant: { Size: 'L' },
+  example: () => <SortAscL />,
+});
+
+import LikeM from '@semcore/ui/icon/Like/m';
+figma.connect(LikeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=147:30', {
+  variant: { Size: 'M' },
+  example: () => <LikeM />,
+});
+
+import LikeL from '@semcore/ui/icon/Like/l';
+figma.connect(LikeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=147:30', {
+  variant: { Size: 'L' },
+  example: () => <LikeL />,
+});
+
+import HashtagM from '@semcore/ui/icon/Hashtag/m';
+figma.connect(HashtagM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5039:19', {
+  variant: { Size: 'M' },
+  example: () => <HashtagM />,
+});
+
+import HashtagL from '@semcore/ui/icon/Hashtag/l';
+figma.connect(HashtagL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5039:19', {
+  variant: { Size: 'L' },
+  example: () => <HashtagL />,
+});
+
+import FolderOpenM from '@semcore/ui/icon/FolderOpen/m';
+figma.connect(FolderOpenM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=136:63', {
+  variant: { Size: 'M' },
+  example: () => <FolderOpenM />,
+});
+
+import FolderOpenL from '@semcore/ui/icon/FolderOpen/l';
+figma.connect(FolderOpenL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=136:63', {
+  variant: { Size: 'L' },
+  example: () => <FolderOpenL />,
+});
+
+import FormalM from '@semcore/ui/icon/Formal/m';
+figma.connect(FormalM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1475:9', {
+  variant: { Size: 'M' },
+  example: () => <FormalM />,
+});
+
+import FormalL from '@semcore/ui/icon/Formal/l';
+figma.connect(FormalL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1475:9', {
+  variant: { Size: 'L' },
+  example: () => <FormalL />,
+});
+
+import PicturesM from '@semcore/ui/icon/Pictures/m';
+figma.connect(PicturesM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=242:28', {
+  variant: { Size: 'M' },
+  example: () => <PicturesM />,
+});
+
+import PicturesL from '@semcore/ui/icon/Pictures/l';
+figma.connect(PicturesL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=242:28', {
+  variant: { Size: 'L' },
+  example: () => <PicturesL />,
+});
+
+import CosmeticsM from '@semcore/ui/icon/Cosmetics/m';
+figma.connect(CosmeticsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:144', {
+  variant: { Size: 'M' },
+  example: () => <CosmeticsM />,
+});
+
+import CosmeticsL from '@semcore/ui/icon/Cosmetics/l';
+figma.connect(CosmeticsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:144', {
+  variant: { Size: 'L' },
+  example: () => <CosmeticsL />,
+});
+
+import WebPagesM from '@semcore/ui/icon/WebPages/m';
+figma.connect(WebPagesM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=551:21', {
+  variant: { Size: 'M' },
+  example: () => <WebPagesM />,
+});
+
+import WebPagesL from '@semcore/ui/icon/WebPages/l';
+figma.connect(WebPagesL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=551:21', {
+  variant: { Size: 'L' },
+  example: () => <WebPagesL />,
+});
+
+import MicrophoneM from '@semcore/ui/icon/Microphone/m';
+figma.connect(MicrophoneM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=507:4', {
+  variant: { Size: 'M' },
+  example: () => <MicrophoneM />,
+});
+
+import MicrophoneL from '@semcore/ui/icon/Microphone/l';
+figma.connect(MicrophoneL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=507:4', {
+  variant: { Size: 'L' },
+  example: () => <MicrophoneL />,
+});
+
+import GenderMaleM from '@semcore/ui/icon/GenderMale/m';
+figma.connect(GenderMaleM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:533', {
+  variant: { Size: 'M' },
+  example: () => <GenderMaleM />,
+});
+
+import GenderMaleL from '@semcore/ui/icon/GenderMale/l';
+figma.connect(GenderMaleL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:533', {
+  variant: { Size: 'L' },
+  example: () => <GenderMaleL />,
+});
+
+import FolderOpenFilledM from '@semcore/ui/icon/FolderOpenFilled/m';
+figma.connect(FolderOpenFilledM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=136:53', {
+  variant: { Size: 'M' },
+  example: () => <FolderOpenFilledM />,
+});
+
+import FolderOpenFilledL from '@semcore/ui/icon/FolderOpenFilled/l';
+figma.connect(FolderOpenFilledL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=136:53', {
+  variant: { Size: 'L' },
+  example: () => <FolderOpenFilledL />,
+});
+
+import FunnelM from '@semcore/ui/icon/Funnel/m';
+figma.connect(FunnelM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=210:4', {
+  variant: { Size: 'M' },
+  example: () => <FunnelM />,
+});
+
+import FunnelL from '@semcore/ui/icon/Funnel/l';
+figma.connect(FunnelL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=210:4', {
+  variant: { Size: 'L' },
+  example: () => <FunnelL />,
+});
+
+import ChartLineM from '@semcore/ui/icon/ChartLine/m';
+figma.connect(ChartLineM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=209:4', {
+  variant: { Size: 'M' },
+  example: () => <ChartLineM />,
+});
+
+import ChartLineL from '@semcore/ui/icon/ChartLine/l';
+figma.connect(ChartLineL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=209:4', {
+  variant: { Size: 'L' },
+  example: () => <ChartLineL />,
+});
+
+import LikeFilledM from '@semcore/ui/icon/LikeFilled/m';
+figma.connect(LikeFilledM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=147:25', {
+  variant: { Size: 'M' },
+  example: () => <LikeFilledM />,
+});
+
+import LikeFilledL from '@semcore/ui/icon/LikeFilled/l';
+figma.connect(LikeFilledL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=147:25', {
+  variant: { Size: 'L' },
+  example: () => <LikeFilledL />,
+});
+
+import CardsM from '@semcore/ui/icon/Cards/m';
+figma.connect(CardsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=334:19', {
+  variant: { Size: 'M' },
+  example: () => <CardsM />,
+});
+
+import CardsL from '@semcore/ui/icon/Cards/l';
+figma.connect(CardsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=334:19', {
+  variant: { Size: 'L' },
+  example: () => <CardsL />,
+});
+
+import PinNoM from '@semcore/ui/icon/PinNo/m';
+figma.connect(PinNoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=70:5', {
+  variant: { Size: 'M' },
+  example: () => <PinNoM />,
+});
+
+import PinNoL from '@semcore/ui/icon/PinNo/l';
+figma.connect(PinNoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=70:5', {
+  variant: { Size: 'L' },
+  example: () => <PinNoL />,
+});
+
+import AddressPackM from '@semcore/ui/icon/AddressPack/m';
+figma.connect(AddressPackM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:44', {
+  variant: { Size: 'M' },
+  example: () => <AddressPackM />,
+});
+
+import AddressPackL from '@semcore/ui/icon/AddressPack/l';
+figma.connect(AddressPackL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:44', {
+  variant: { Size: 'L' },
+  example: () => <AddressPackL />,
+});
+
+import PinM from '@semcore/ui/icon/Pin/m';
+figma.connect(PinM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:780', {
+  variant: { Size: 'M' },
+  example: () => <PinM />,
+});
+
+import PinL from '@semcore/ui/icon/Pin/l';
+figma.connect(PinL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:780', {
+  variant: { Size: 'L' },
+  example: () => <PinL />,
+});
+
+import MailOpenFilledM from '@semcore/ui/icon/MailOpenFilled/m';
+figma.connect(MailOpenFilledM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=518:28', {
+  variant: { Size: 'M' },
+  example: () => <MailOpenFilledM />,
+});
+
+import MailOpenFilledL from '@semcore/ui/icon/MailOpenFilled/l';
+figma.connect(MailOpenFilledL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=518:28', {
+  variant: { Size: 'L' },
+  example: () => <MailOpenFilledL />,
+});
+
+import AndroidM from '@semcore/ui/icon/Android/m';
+figma.connect(AndroidM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=391:39', {
+  variant: { Size: 'M' },
+  example: () => <AndroidM />,
+});
+
+import AndroidL from '@semcore/ui/icon/Android/l';
+figma.connect(AndroidL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=391:39', {
+  variant: { Size: 'L' },
+  example: () => <AndroidL />,
+});
+
+import ArchitectureM from '@semcore/ui/icon/Architecture/m';
+figma.connect(ArchitectureM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:114', {
+  variant: { Size: 'M' },
+  example: () => <ArchitectureM />,
+});
+
+import ArchitectureL from '@semcore/ui/icon/Architecture/l';
+figma.connect(ArchitectureL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:114', {
+  variant: { Size: 'L' },
+  example: () => <ArchitectureL />,
+});
+
+import WebStoriesM from '@semcore/ui/icon/WebStories/m';
+figma.connect(WebStoriesM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:9', {
+  variant: { Size: 'M' },
+  example: () => <WebStoriesM />,
+});
+
+import WebStoriesL from '@semcore/ui/icon/WebStories/l';
+figma.connect(WebStoriesL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:9', {
+  variant: { Size: 'L' },
+  example: () => <WebStoriesL />,
+});
+
+import BracketsAngleM from '@semcore/ui/icon/BracketsAngle/m';
+figma.connect(BracketsAngleM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=37:45', {
+  variant: { Size: 'M' },
+  example: () => <BracketsAngleM />,
+});
+
+import BracketsAngleL from '@semcore/ui/icon/BracketsAngle/l';
+figma.connect(BracketsAngleL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=37:45', {
+  variant: { Size: 'L' },
+  example: () => <BracketsAngleL />,
+});
+
+import InterestingFindsM from '@semcore/ui/icon/InterestingFinds/m';
+figma.connect(InterestingFindsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:19', {
+  variant: { Size: 'M' },
+  example: () => <InterestingFindsM />,
+});
+
+import InterestingFindsL from '@semcore/ui/icon/InterestingFinds/l';
+figma.connect(InterestingFindsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:19', {
+  variant: { Size: 'L' },
+  example: () => <InterestingFindsL />,
+});
+
+import PinsM from '@semcore/ui/icon/Pins/m';
+figma.connect(PinsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=141:4', {
+  variant: { Size: 'M' },
+  example: () => <PinsM />,
+});
+
+import PinsL from '@semcore/ui/icon/Pins/l';
+figma.connect(PinsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=141:4', {
+  variant: { Size: 'L' },
+  example: () => <PinsL />,
+});
+
+import TrashM from '@semcore/ui/icon/Trash/m';
+figma.connect(TrashM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:463', {
+  variant: { Size: 'M' },
+  example: () => <TrashM />,
+});
+
+import TrashL from '@semcore/ui/icon/Trash/l';
+figma.connect(TrashL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:463', {
+  variant: { Size: 'L' },
+  example: () => <TrashL />,
+});
+
+import FirefoxM from '@semcore/ui/icon/Firefox/m';
+figma.connect(FirefoxM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=138:203', {
+  variant: { Size: 'M' },
+  example: () => <FirefoxM />,
+});
+
+import FirefoxL from '@semcore/ui/icon/Firefox/l';
+figma.connect(FirefoxL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=138:203', {
+  variant: { Size: 'L' },
+  example: () => <FirefoxL />,
+});
+
+import TopStoriesM from '@semcore/ui/icon/TopStories/m';
+figma.connect(TopStoriesM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:4', {
+  variant: { Size: 'M' },
+  example: () => <TopStoriesM />,
+});
+
+import TopStoriesL from '@semcore/ui/icon/TopStories/l';
+figma.connect(TopStoriesL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:4', {
+  variant: { Size: 'L' },
+  example: () => <TopStoriesL />,
+});
+
+import PopularStoresM from '@semcore/ui/icon/PopularStores/m';
+figma.connect(PopularStoresM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5718:9', {
+  variant: { Size: 'M' },
+  example: () => <PopularStoresM />,
+});
+
+import PopularStoresL from '@semcore/ui/icon/PopularStores/l';
+figma.connect(PopularStoresL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5718:9', {
+  variant: { Size: 'L' },
+  example: () => <PopularStoresL />,
+});
+
+import ChevronRightM from '@semcore/ui/icon/ChevronRight/m';
+figma.connect(ChevronRightM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4632', {
+  variant: { Size: 'M' },
+  example: () => <ChevronRightM />,
+});
+
+import ChevronRightL from '@semcore/ui/icon/ChevronRight/l';
+figma.connect(ChevronRightL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4632', {
+  variant: { Size: 'L' },
+  example: () => <ChevronRightL />,
+});
+
+import AddCampaignM from '@semcore/ui/icon/AddCampaign/m';
+figma.connect(AddCampaignM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=522:4', {
+  variant: { Size: 'M' },
+  example: () => <AddCampaignM />,
+});
+
+import AddCampaignL from '@semcore/ui/icon/AddCampaign/l';
+figma.connect(AddCampaignL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=522:4', {
+  variant: { Size: 'L' },
+  example: () => <AddCampaignL />,
+});
+
+import SemrushM from '@semcore/ui/icon/Semrush/m';
+figma.connect(SemrushM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=185:87', {
+  variant: { Size: 'M' },
+  example: () => <SemrushM />,
+});
+
+import SemrushL from '@semcore/ui/icon/Semrush/l';
+figma.connect(SemrushL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=185:87', {
+  variant: { Size: 'L' },
+  example: () => <SemrushL />,
+});
+
+import RelatedSearchesM from '@semcore/ui/icon/RelatedSearches/m';
+figma.connect(RelatedSearchesM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:49', {
+  variant: { Size: 'M' },
+  example: () => <RelatedSearchesM />,
+});
+
+import RelatedSearchesL from '@semcore/ui/icon/RelatedSearches/l';
+figma.connect(RelatedSearchesL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:49', {
+  variant: { Size: 'L' },
+  example: () => <RelatedSearchesL />,
+});
+
+import SortDescM from '@semcore/ui/icon/SortDesc/m';
+figma.connect(SortDescM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:2030', {
+  variant: { Size: 'M' },
+  example: () => <SortDescM />,
+});
+
+import SortDescL from '@semcore/ui/icon/SortDesc/l';
+figma.connect(SortDescL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:2030', {
+  variant: { Size: 'L' },
+  example: () => <SortDescL />,
+});
+
+import FormatAlignRightM from '@semcore/ui/icon/FormatAlignRight/m';
+figma.connect(FormatAlignRightM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:434', {
+  variant: { Size: 'M' },
+  example: () => <FormatAlignRightM />,
+});
+
+import FormatAlignRightL from '@semcore/ui/icon/FormatAlignRight/l';
+figma.connect(FormatAlignRightL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:434', {
+  variant: { Size: 'L' },
+  example: () => <FormatAlignRightL />,
+});
+
+import WineM from '@semcore/ui/icon/Wine/m';
+figma.connect(WineM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:4', {
+  variant: { Size: 'M' },
+  example: () => <WineM />,
+});
+
+import WineL from '@semcore/ui/icon/Wine/l';
+figma.connect(WineL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:4', {
+  variant: { Size: 'L' },
+  example: () => <WineL />,
+});
+
+import ArchiveM from '@semcore/ui/icon/Archive/m';
+figma.connect(ArchiveM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1067', {
+  variant: { Size: 'M' },
+  example: () => <ArchiveM />,
+});
+
+import ArchiveL from '@semcore/ui/icon/Archive/l';
+figma.connect(ArchiveL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1067', {
+  variant: { Size: 'L' },
+  example: () => <ArchiveL />,
+});
+
+import VideoAltM from '@semcore/ui/icon/VideoAlt/m';
+figma.connect(VideoAltM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:512', {
+  variant: { Size: 'M' },
+  example: () => <VideoAltM />,
+});
+
+import VideoAltL from '@semcore/ui/icon/VideoAlt/l';
+figma.connect(VideoAltL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:512', {
+  variant: { Size: 'L' },
+  example: () => <VideoAltL />,
+});
+
+import AdobeExperienceCloudM from '@semcore/ui/icon/AdobeExperienceCloud/m';
+figma.connect(AdobeExperienceCloudM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=429:446', {
+  variant: { Size: 'M' },
+  example: () => <AdobeExperienceCloudM />,
+});
+
+import AdobeExperienceCloudL from '@semcore/ui/icon/AdobeExperienceCloud/l';
+figma.connect(AdobeExperienceCloudL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=429:446', {
+  variant: { Size: 'L' },
+  example: () => <AdobeExperienceCloudL />,
+});
+
+import AppsBlockM from '@semcore/ui/icon/AppsBlock/m';
+figma.connect(AppsBlockM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2247:4', {
+  variant: { Size: 'M' },
+  example: () => <AppsBlockM />,
+});
+
+import AppsBlockL from '@semcore/ui/icon/AppsBlock/l';
+figma.connect(AppsBlockL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2247:4', {
+  variant: { Size: 'L' },
+  example: () => <AppsBlockL />,
+});
+
+import RelatedProductsM from '@semcore/ui/icon/RelatedProducts/m';
+figma.connect(RelatedProductsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:39', {
+  variant: { Size: 'M' },
+  example: () => <RelatedProductsM />,
+});
+
+import RelatedProductsL from '@semcore/ui/icon/RelatedProducts/l';
+figma.connect(RelatedProductsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:39', {
+  variant: { Size: 'L' },
+  example: () => <RelatedProductsL />,
+});
+
+import SeeResultsAboutM from '@semcore/ui/icon/SeeResultsAbout/m';
+figma.connect(SeeResultsAboutM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:29', {
+  variant: { Size: 'M' },
+  example: () => <SeeResultsAboutM />,
+});
+
+import SeeResultsAboutL from '@semcore/ui/icon/SeeResultsAbout/l';
+figma.connect(SeeResultsAboutL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:29', {
+  variant: { Size: 'L' },
+  example: () => <SeeResultsAboutL />,
+});
+
+import SportM from '@semcore/ui/icon/Sport/m';
+figma.connect(SportM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:39', {
+  variant: { Size: 'M' },
+  example: () => <SportM />,
+});
+
+import SportL from '@semcore/ui/icon/Sport/l';
+figma.connect(SportL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:39', {
+  variant: { Size: 'L' },
+  example: () => <SportL />,
+});
+
+import PinMapM from '@semcore/ui/icon/PinMap/m';
+figma.connect(PinMapM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=83:164', {
+  variant: { Size: 'M' },
+  example: () => <PinMapM />,
+});
+
+import PinMapL from '@semcore/ui/icon/PinMap/l';
+figma.connect(PinMapL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=83:164', {
+  variant: { Size: 'L' },
+  example: () => <PinMapL />,
+});
+
+import PhotoM from '@semcore/ui/icon/Photo/m';
+figma.connect(PhotoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:174', {
+  variant: { Size: 'M' },
+  example: () => <PhotoM />,
+});
+
+import PhotoL from '@semcore/ui/icon/Photo/l';
+figma.connect(PhotoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:174', {
+  variant: { Size: 'L' },
+  example: () => <PhotoL />,
+});
+
+import MagnetM from '@semcore/ui/icon/Magnet/m';
+figma.connect(MagnetM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=504:6', {
+  variant: { Size: 'M' },
+  example: () => <MagnetM />,
+});
+
+import MagnetL from '@semcore/ui/icon/Magnet/l';
+figma.connect(MagnetL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=504:6', {
+  variant: { Size: 'L' },
+  example: () => <MagnetL />,
+});
+
+import AdTopM from '@semcore/ui/icon/AdTop/m';
+figma.connect(AdTopM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=426:303', {
+  variant: { Size: 'M' },
+  example: () => <AdTopM />,
+});
+
+import AdTopL from '@semcore/ui/icon/AdTop/l';
+figma.connect(AdTopL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=426:303', {
+  variant: { Size: 'L' },
+  example: () => <AdTopL />,
+});
+
+import OperaM from '@semcore/ui/icon/Opera/m';
+figma.connect(OperaM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=138:194', {
+  variant: { Size: 'M' },
+  example: () => <OperaM />,
+});
+
+import OperaL from '@semcore/ui/icon/Opera/l';
+figma.connect(OperaL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=138:194', {
+  variant: { Size: 'L' },
+  example: () => <OperaL />,
+});
+
+import PublicUtilityM from '@semcore/ui/icon/PublicUtility/m';
+figma.connect(PublicUtilityM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:49', {
+  variant: { Size: 'M' },
+  example: () => <PublicUtilityM />,
+});
+
+import PublicUtilityL from '@semcore/ui/icon/PublicUtility/l';
+figma.connect(PublicUtilityL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:49', {
+  variant: { Size: 'L' },
+  example: () => <PublicUtilityL />,
+});
+
+import FileImportM from '@semcore/ui/icon/FileImport/m';
+figma.connect(FileImportM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:329', {
+  variant: { Size: 'M' },
+  example: () => <FileImportM />,
+});
+
+import FileImportL from '@semcore/ui/icon/FileImport/l';
+figma.connect(FileImportL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:329', {
+  variant: { Size: 'L' },
+  example: () => <FileImportL />,
+});
+
+import TabletM from '@semcore/ui/icon/Tablet/m';
+figma.connect(TabletM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=224:377', {
+  variant: { Size: 'M' },
+  example: () => <TabletM />,
+});
+
+import TabletL from '@semcore/ui/icon/Tablet/l';
+figma.connect(TabletL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=224:377', {
+  variant: { Size: 'L' },
+  example: () => <TabletL />,
+});
+
+import DocumentExportM from '@semcore/ui/icon/DocumentExport/m';
+figma.connect(DocumentExportM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=229:47', {
+  variant: { Size: 'M' },
+  example: () => <DocumentExportM />,
+});
+
+import DocumentExportL from '@semcore/ui/icon/DocumentExport/l';
+figma.connect(DocumentExportL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=229:47', {
+  variant: { Size: 'L' },
+  example: () => <DocumentExportL />,
+});
+
+import LightningFilledM from '@semcore/ui/icon/LightningFilled/m';
+figma.connect(LightningFilledM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1142:6071', {
+  variant: { Size: 'M' },
+  example: () => <LightningFilledM />,
+});
+
+import LightningFilledL from '@semcore/ui/icon/LightningFilled/l';
+figma.connect(LightningFilledL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1142:6071', {
+  variant: { Size: 'L' },
+  example: () => <LightningFilledL />,
+});
+
+import MilitaryM from '@semcore/ui/icon/Military/m';
+figma.connect(MilitaryM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:169', {
+  variant: { Size: 'M' },
+  example: () => <MilitaryM />,
+});
+
+import MilitaryL from '@semcore/ui/icon/Military/l';
+figma.connect(MilitaryL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:169', {
+  variant: { Size: 'L' },
+  example: () => <MilitaryL />,
+});
+
+import ReplyM from '@semcore/ui/icon/Reply/m';
+figma.connect(ReplyM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=423:248', {
+  variant: { Size: 'M' },
+  example: () => <ReplyM />,
+});
+
+import ReplyL from '@semcore/ui/icon/Reply/l';
+figma.connect(ReplyL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=423:248', {
+  variant: { Size: 'L' },
+  example: () => <ReplyL />,
+});
+
+import ListAddBottomM from '@semcore/ui/icon/ListAddBottom/m';
+figma.connect(ListAddBottomM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:456', {
+  variant: { Size: 'M' },
+  example: () => <ListAddBottomM />,
+});
+
+import ListAddBottomL from '@semcore/ui/icon/ListAddBottom/l';
+figma.connect(ListAddBottomL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:456', {
+  variant: { Size: 'L' },
+  example: () => <ListAddBottomL />,
+});
+
+import FolderFilledM from '@semcore/ui/icon/FolderFilled/m';
+figma.connect(FolderFilledM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=136:8', {
+  variant: { Size: 'M' },
+  example: () => <FolderFilledM />,
+});
+
+import FolderFilledL from '@semcore/ui/icon/FolderFilled/l';
+figma.connect(FolderFilledL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=136:8', {
+  variant: { Size: 'L' },
+  example: () => <FolderFilledL />,
+});
+
+import OrientationPortraitM from '@semcore/ui/icon/OrientationPortrait/m';
+figma.connect(OrientationPortraitM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=386:100', {
+  variant: { Size: 'M' },
+  example: () => <OrientationPortraitM />,
+});
+
+import OrientationPortraitL from '@semcore/ui/icon/OrientationPortrait/l';
+figma.connect(OrientationPortraitL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=386:100', {
+  variant: { Size: 'L' },
+  example: () => <OrientationPortraitL />,
+});
+
+import DocumentSadM from '@semcore/ui/icon/DocumentSad/m';
+figma.connect(DocumentSadM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=229:62', {
+  variant: { Size: 'M' },
+  example: () => <DocumentSadM />,
+});
+
+import DocumentSadL from '@semcore/ui/icon/DocumentSad/l';
+figma.connect(DocumentSadL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=229:62', {
+  variant: { Size: 'L' },
+  example: () => <DocumentSadL />,
+});
+
+import CheckM from '@semcore/ui/icon/Check/m';
+figma.connect(CheckM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9:427', {
+  variant: { Size: 'M' },
+  example: () => <CheckM />,
+});
+
+import CheckL from '@semcore/ui/icon/Check/l';
+figma.connect(CheckL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9:427', {
+  variant: { Size: 'L' },
+  example: () => <CheckL />,
+});
+
+import AllDevicesM from '@semcore/ui/icon/AllDevices/m';
+figma.connect(AllDevicesM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=386:5', {
+  variant: { Size: 'M' },
+  example: () => <AllDevicesM />,
+});
+
+import AllDevicesL from '@semcore/ui/icon/AllDevices/l';
+figma.connect(AllDevicesL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=386:5', {
+  variant: { Size: 'L' },
+  example: () => <AllDevicesL />,
+});
+
+import UserSharedFirstM from '@semcore/ui/icon/UserSharedFirst/m';
+figma.connect(UserSharedFirstM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1831:4', {
+  variant: { Size: 'M' },
+  example: () => <UserSharedFirstM />,
+});
+
+import UserSharedFirstL from '@semcore/ui/icon/UserSharedFirst/l';
+figma.connect(UserSharedFirstL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1831:4', {
+  variant: { Size: 'L' },
+  example: () => <UserSharedFirstL />,
+});
+
+import ListAddTopM from '@semcore/ui/icon/ListAddTop/m';
+figma.connect(ListAddTopM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:449', {
+  variant: { Size: 'M' },
+  example: () => <ListAddTopM />,
+});
+
+import ListAddTopL from '@semcore/ui/icon/ListAddTop/l';
+figma.connect(ListAddTopL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:449', {
+  variant: { Size: 'L' },
+  example: () => <ListAddTopL />,
+});
+
+import TagM from '@semcore/ui/icon/Tag/m';
+figma.connect(TagM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=226:387', {
+  variant: { Size: 'M' },
+  example: () => <TagM />,
+});
+
+import TagL from '@semcore/ui/icon/Tag/l';
+figma.connect(TagL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=226:387', {
+  variant: { Size: 'L' },
+  example: () => <TagL />,
+});
+
+import MegaphoneM from '@semcore/ui/icon/Megaphone/m';
+figma.connect(MegaphoneM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=54:37', {
+  variant: { Size: 'M' },
+  example: () => <MegaphoneM />,
+});
+
+import MegaphoneL from '@semcore/ui/icon/Megaphone/l';
+figma.connect(MegaphoneL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=54:37', {
+  variant: { Size: 'L' },
+  example: () => <MegaphoneL />,
+});
+
+import PositionRightM from '@semcore/ui/icon/PositionRight/m';
+figma.connect(PositionRightM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=388:19', {
+  variant: { Size: 'M' },
+  example: () => <PositionRightM />,
+});
+
+import PositionRightL from '@semcore/ui/icon/PositionRight/l';
+figma.connect(PositionRightL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=388:19', {
+  variant: { Size: 'L' },
+  example: () => <PositionRightL />,
+});
+
+import VkM from '@semcore/ui/icon/Vk/m';
+figma.connect(VkM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=219:190', {
+  variant: { Size: 'M' },
+  example: () => <VkM />,
+});
+
+import VkL from '@semcore/ui/icon/Vk/l';
+figma.connect(VkL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=219:190', {
+  variant: { Size: 'L' },
+  example: () => <VkL />,
+});
+
+import GoogleM from '@semcore/ui/icon/Google/m';
+figma.connect(GoogleM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=145:5', {
+  variant: { Size: 'M' },
+  example: () => <GoogleM />,
+});
+
+import GoogleL from '@semcore/ui/icon/Google/l';
+figma.connect(GoogleL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=145:5', {
+  variant: { Size: 'L' },
+  example: () => <GoogleL />,
+});
+
+import FormatAlignJustifyM from '@semcore/ui/icon/FormatAlignJustify/m';
+figma.connect(FormatAlignJustifyM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:413', {
+  variant: { Size: 'M' },
+  example: () => <FormatAlignJustifyM />,
+});
+
+import FormatAlignJustifyL from '@semcore/ui/icon/FormatAlignJustify/l';
+figma.connect(FormatAlignJustifyL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:413', {
+  variant: { Size: 'L' },
+  example: () => <FormatAlignJustifyL />,
+});
+
+import CrosshairM from '@semcore/ui/icon/Crosshair/m';
+figma.connect(CrosshairM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=243:47', {
+  variant: { Size: 'M' },
+  example: () => <CrosshairM />,
+});
+
+import CrosshairL from '@semcore/ui/icon/Crosshair/l';
+figma.connect(CrosshairL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=243:47', {
+  variant: { Size: 'L' },
+  example: () => <CrosshairL />,
+});
+
+import PositionLeftM from '@semcore/ui/icon/PositionLeft/m';
+figma.connect(PositionLeftM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=388:24', {
+  variant: { Size: 'M' },
+  example: () => <PositionLeftM />,
+});
+
+import PositionLeftL from '@semcore/ui/icon/PositionLeft/l';
+figma.connect(PositionLeftL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=388:24', {
+  variant: { Size: 'L' },
+  example: () => <PositionLeftL />,
+});
+
+import MoveAltM from '@semcore/ui/icon/MoveAlt/m';
+figma.connect(MoveAltM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=255:39', {
+  variant: { Size: 'M' },
+  example: () => <MoveAltM />,
+});
+
+import MoveAltL from '@semcore/ui/icon/MoveAlt/l';
+figma.connect(MoveAltL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=255:39', {
+  variant: { Size: 'L' },
+  example: () => <MoveAltL />,
+});
+
+import WarningM from '@semcore/ui/icon/Warning/m';
+figma.connect(WarningM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:102', {
+  variant: { Size: 'M' },
+  example: () => <WarningM />,
+});
+
+import WarningL from '@semcore/ui/icon/Warning/l';
+figma.connect(WarningL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:102', {
+  variant: { Size: 'L' },
+  example: () => <WarningL />,
+});
+
+import AmpM from '@semcore/ui/icon/Amp/m';
+figma.connect(AmpM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=330:9', {
+  variant: { Size: 'M' },
+  example: () => <AmpM />,
+});
+
+import AmpL from '@semcore/ui/icon/Amp/l';
+figma.connect(AmpL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=330:9', {
+  variant: { Size: 'L' },
+  example: () => <AmpL />,
+});
+
+import ChatPlusM from '@semcore/ui/icon/ChatPlus/m';
+figma.connect(ChatPlusM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:555', {
+  variant: { Size: 'M' },
+  example: () => <ChatPlusM />,
+});
+
+import ChatPlusL from '@semcore/ui/icon/ChatPlus/l';
+figma.connect(ChatPlusL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:555', {
+  variant: { Size: 'L' },
+  example: () => <ChatPlusL />,
+});
+
+import ChevronDoubleDownM from '@semcore/ui/icon/ChevronDoubleDown/m';
+figma.connect(ChevronDoubleDownM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=78:169', {
+  variant: { Size: 'M' },
+  example: () => <ChevronDoubleDownM />,
+});
+
+import ChevronDoubleDownL from '@semcore/ui/icon/ChevronDoubleDown/l';
+figma.connect(ChevronDoubleDownL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=78:169', {
+  variant: { Size: 'L' },
+  example: () => <ChevronDoubleDownL />,
+});
+
+import ResizeColM from '@semcore/ui/icon/ResizeCol/m';
+figma.connect(ResizeColM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:439', {
+  variant: { Size: 'M' },
+  example: () => <ResizeColM />,
+});
+
+import ResizeColL from '@semcore/ui/icon/ResizeCol/l';
+figma.connect(ResizeColL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:439', {
+  variant: { Size: 'L' },
+  example: () => <ResizeColL />,
+});
+
+import ShareAltM from '@semcore/ui/icon/ShareAlt/m';
+figma.connect(ShareAltM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5260:3', {
+  variant: { Size: 'M' },
+  example: () => <ShareAltM />,
+});
+
+import ShareAltL from '@semcore/ui/icon/ShareAlt/l';
+figma.connect(ShareAltL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5260:3', {
+  variant: { Size: 'L' },
+  example: () => <ShareAltL />,
+});
+
+import AdultM from '@semcore/ui/icon/Adult/m';
+figma.connect(AdultM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:99', {
+  variant: { Size: 'M' },
+  example: () => <AdultM />,
+});
+
+import AdultL from '@semcore/ui/icon/Adult/l';
+figma.connect(AdultL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:99', {
+  variant: { Size: 'L' },
+  example: () => <AdultL />,
+});
+
+import WristwatchM from '@semcore/ui/icon/Wristwatch/m';
+figma.connect(WristwatchM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=224:308', {
+  variant: { Size: 'M' },
+  example: () => <WristwatchM />,
+});
+
+import WristwatchL from '@semcore/ui/icon/Wristwatch/l';
+figma.connect(WristwatchL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=224:308', {
+  variant: { Size: 'L' },
+  example: () => <WristwatchL />,
+});
+
+import DropTextM from '@semcore/ui/icon/DropText/m';
+figma.connect(DropTextM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=436:30', {
+  variant: { Size: 'M' },
+  example: () => <DropTextM />,
+});
+
+import DropTextL from '@semcore/ui/icon/DropText/l';
+figma.connect(DropTextL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=436:30', {
+  variant: { Size: 'L' },
+  example: () => <DropTextL />,
+});
+
+import UserGroupM from '@semcore/ui/icon/UserGroup/m';
+figma.connect(UserGroupM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=14:66', {
+  variant: { Size: 'M' },
+  example: () => <UserGroupM />,
+});
+
+import UserGroupL from '@semcore/ui/icon/UserGroup/l';
+figma.connect(UserGroupL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=14:66', {
+  variant: { Size: 'L' },
+  example: () => <UserGroupL />,
+});
+
+import ResizeRowM from '@semcore/ui/icon/ResizeRow/m';
+figma.connect(ResizeRowM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:444', {
+  variant: { Size: 'M' },
+  example: () => <ResizeRowM />,
+});
+
+import ResizeRowL from '@semcore/ui/icon/ResizeRow/l';
+figma.connect(ResizeRowL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:444', {
+  variant: { Size: 'L' },
+  example: () => <ResizeRowL />,
+});
+
+import OilM from '@semcore/ui/icon/Oil/m';
+figma.connect(OilM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:69', {
+  variant: { Size: 'M' },
+  example: () => <OilM />,
+});
+
+import OilL from '@semcore/ui/icon/Oil/l';
+figma.connect(OilL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:69', {
+  variant: { Size: 'L' },
+  example: () => <OilL />,
+});
+
+import CasualM from '@semcore/ui/icon/Casual/m';
+figma.connect(CasualM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1475:4', {
+  variant: { Size: 'M' },
+  example: () => <CasualM />,
+});
+
+import CasualL from '@semcore/ui/icon/Casual/l';
+figma.connect(CasualL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1475:4', {
+  variant: { Size: 'L' },
+  example: () => <CasualL />,
+});
+
+import OrganicCarouselM from '@semcore/ui/icon/OrganicCarousel/m';
+figma.connect(OrganicCarouselM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5718:4', {
+  variant: { Size: 'M' },
+  example: () => <OrganicCarouselM />,
+});
+
+import OrganicCarouselL from '@semcore/ui/icon/OrganicCarousel/l';
+figma.connect(OrganicCarouselL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5718:4', {
+  variant: { Size: 'L' },
+  example: () => <OrganicCarouselL />,
+});
+
+import MoneyCoinsM from '@semcore/ui/icon/MoneyCoins/m';
+figma.connect(MoneyCoinsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:954', {
+  variant: { Size: 'M' },
+  example: () => <MoneyCoinsM />,
+});
+
+import MoneyCoinsL from '@semcore/ui/icon/MoneyCoins/l';
+figma.connect(MoneyCoinsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:954', {
+  variant: { Size: 'L' },
+  example: () => <MoneyCoinsL />,
+});
+
+import UserSharedM from '@semcore/ui/icon/UserShared/m';
+figma.connect(UserSharedM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1949:4', {
+  variant: { Size: 'M' },
+  example: () => <UserSharedM />,
+});
+
+import UserSharedL from '@semcore/ui/icon/UserShared/l';
+figma.connect(UserSharedL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1949:4', {
+  variant: { Size: 'L' },
+  example: () => <UserSharedL />,
+});
+
+import CollapseAltM from '@semcore/ui/icon/CollapseAlt/m';
+figma.connect(CollapseAltM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5213:14', {
+  variant: { Size: 'M' },
+  example: () => <CollapseAltM />,
+});
+
+import CollapseAltL from '@semcore/ui/icon/CollapseAlt/l';
+figma.connect(CollapseAltL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5213:14', {
+  variant: { Size: 'L' },
+  example: () => <CollapseAltL />,
+});
+
+import ColumnTwoM from '@semcore/ui/icon/ColumnTwo/m';
+figma.connect(ColumnTwoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=385:230', {
+  variant: { Size: 'M' },
+  example: () => <ColumnTwoM />,
+});
+
+import ColumnTwoL from '@semcore/ui/icon/ColumnTwo/l';
+figma.connect(ColumnTwoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=385:230', {
+  variant: { Size: 'L' },
+  example: () => <ColumnTwoL />,
+});
+
+import PinListM from '@semcore/ui/icon/PinList/m';
+figma.connect(PinListM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=70:61', {
+  variant: { Size: 'M' },
+  example: () => <PinListM />,
+});
+
+import PinListL from '@semcore/ui/icon/PinList/l';
+figma.connect(PinListL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=70:61', {
+  variant: { Size: 'L' },
+  example: () => <PinListL />,
+});
+
+import AirplaneM from '@semcore/ui/icon/Airplane/m';
+figma.connect(AirplaneM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:967', {
+  variant: { Size: 'M' },
+  example: () => <AirplaneM />,
+});
+
+import AirplaneL from '@semcore/ui/icon/Airplane/l';
+figma.connect(AirplaneL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:967', {
+  variant: { Size: 'L' },
+  example: () => <AirplaneL />,
+});
+
+import FileDownloadM from '@semcore/ui/icon/FileDownload/m';
+figma.connect(FileDownloadM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=244:112', {
+  variant: { Size: 'M' },
+  example: () => <FileDownloadM />,
+});
+
+import FileDownloadL from '@semcore/ui/icon/FileDownload/l';
+figma.connect(FileDownloadL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=244:112', {
+  variant: { Size: 'L' },
+  example: () => <FileDownloadL />,
+});
+
+import PinterestM from '@semcore/ui/icon/Pinterest/m';
+figma.connect(PinterestM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=139:18', {
+  variant: { Size: 'M' },
+  example: () => <PinterestM />,
+});
+
+import PinterestL from '@semcore/ui/icon/Pinterest/l';
+figma.connect(PinterestL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=139:18', {
+  variant: { Size: 'L' },
+  example: () => <PinterestL />,
+});
+
+import UserM from '@semcore/ui/icon/User/m';
+figma.connect(UserM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=14:61', {
+  variant: { Size: 'M' },
+  example: () => <UserM />,
+});
+
+import UserL from '@semcore/ui/icon/User/l';
+figma.connect(UserL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=14:61', {
+  variant: { Size: 'L' },
+  example: () => <UserL />,
+});
+
+import LinkedInM from '@semcore/ui/icon/LinkedIn/m';
+figma.connect(LinkedInM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:635', {
+  variant: { Size: 'M' },
+  example: () => <LinkedInM />,
+});
+
+import LinkedInL from '@semcore/ui/icon/LinkedIn/l';
+figma.connect(LinkedInL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:635', {
+  variant: { Size: 'L' },
+  example: () => <LinkedInL />,
+});
+
+import GobletM from '@semcore/ui/icon/Goblet/m';
+figma.connect(GobletM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1016', {
+  variant: { Size: 'M' },
+  example: () => <GobletM />,
+});
+
+import GobletL from '@semcore/ui/icon/Goblet/l';
+figma.connect(GobletL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1016', {
+  variant: { Size: 'L' },
+  example: () => <GobletL />,
+});
+
+import LockNoM from '@semcore/ui/icon/LockNo/m';
+figma.connect(LockNoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=182:45', {
+  variant: { Size: 'M' },
+  example: () => <LockNoM />,
+});
+
+import LockNoL from '@semcore/ui/icon/LockNo/l';
+figma.connect(LockNoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=182:45', {
+  variant: { Size: 'L' },
+  example: () => <LockNoL />,
+});
+
+import NotificationNoM from '@semcore/ui/icon/NotificationNo/m';
+figma.connect(NotificationNoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3141:4', {
+  variant: { Size: 'M' },
+  example: () => <NotificationNoM />,
+});
+
+import NotificationNoL from '@semcore/ui/icon/NotificationNo/l';
+figma.connect(NotificationNoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3141:4', {
+  variant: { Size: 'L' },
+  example: () => <NotificationNoL />,
+});
+
+import SlackM from '@semcore/ui/icon/Slack/m';
+figma.connect(SlackM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=138:252', {
+  variant: { Size: 'M' },
+  example: () => <SlackM />,
+});
+
+import SlackL from '@semcore/ui/icon/Slack/l';
+figma.connect(SlackL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=138:252', {
+  variant: { Size: 'L' },
+  example: () => <SlackL />,
+});
+
+import ListAddCheckM from '@semcore/ui/icon/ListAddCheck/m';
+figma.connect(ListAddCheckM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:469', {
+  variant: { Size: 'M' },
+  example: () => <ListAddCheckM />,
+});
+
+import ListAddCheckL from '@semcore/ui/icon/ListAddCheck/l';
+figma.connect(ListAddCheckL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:469', {
+  variant: { Size: 'L' },
+  example: () => <ListAddCheckL />,
+});
+
+import SeoQuakeM from '@semcore/ui/icon/SeoQuake/m';
+figma.connect(SeoQuakeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=47:3', {
+  variant: { Size: 'M' },
+  example: () => <SeoQuakeM />,
+});
+
+import SeoQuakeL from '@semcore/ui/icon/SeoQuake/l';
+figma.connect(SeoQuakeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=47:3', {
+  variant: { Size: 'L' },
+  example: () => <SeoQuakeL />,
+});
+
+import ChartBarStackedM from '@semcore/ui/icon/ChartBarStacked/m';
+figma.connect(ChartBarStackedM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=209:14', {
+  variant: { Size: 'M' },
+  example: () => <ChartBarStackedM />,
+});
+
+import ChartBarStackedL from '@semcore/ui/icon/ChartBarStacked/l';
+figma.connect(ChartBarStackedL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=209:14', {
+  variant: { Size: 'L' },
+  example: () => <ChartBarStackedL />,
+});
+
+import PayPalM from '@semcore/ui/icon/pay/PayPal/m';
+figma.connect(PayPalM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:12', {
+  variant: { size: 'm' },
+  example: () => <PayPalM />,
+});
+
+import PayPalL from '@semcore/ui/icon/pay/PayPal/l';
+figma.connect(PayPalL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3940:12', {
+  variant: { size: 'l' },
+  example: () => <PayPalL />,
+});
+
+import ChevronUpM from '@semcore/ui/icon/ChevronUp/m';
+figma.connect(ChevronUpM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4640', {
+  variant: { Size: 'M' },
+  example: () => <ChevronUpM />,
+});
+
+import ChevronUpL from '@semcore/ui/icon/ChevronUp/l';
+figma.connect(ChevronUpL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4640', {
+  variant: { Size: 'L' },
+  example: () => <ChevronUpL />,
+});
+
+import VideoStopM from '@semcore/ui/icon/VideoStop/m';
+figma.connect(VideoStopM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:506', {
+  variant: { Size: 'M' },
+  example: () => <VideoStopM />,
+});
+
+import VideoStopL from '@semcore/ui/icon/VideoStop/l';
+figma.connect(VideoStopL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:506', {
+  variant: { Size: 'L' },
+  example: () => <VideoStopL />,
+});
+
+import VacationM from '@semcore/ui/icon/Vacation/m';
+figma.connect(VacationM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=570:4', {
+  variant: { Size: 'M' },
+  example: () => <VacationM />,
+});
+
+import VacationL from '@semcore/ui/icon/Vacation/l';
+figma.connect(VacationL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=570:4', {
+  variant: { Size: 'L' },
+  example: () => <VacationL />,
+});
+
+import LinkAltHalfM from '@semcore/ui/icon/LinkAltHalf/m';
+figma.connect(LinkAltHalfM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=565:79', {
+  variant: { Size: 'M' },
+  example: () => <LinkAltHalfM />,
+});
+
+import LinkAltHalfL from '@semcore/ui/icon/LinkAltHalf/l';
+figma.connect(LinkAltHalfL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=565:79', {
+  variant: { Size: 'L' },
+  example: () => <LinkAltHalfL />,
+});
+
+import CheckDoubleM from '@semcore/ui/icon/CheckDouble/m';
+figma.connect(CheckDoubleM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5219:40', {
+  variant: { Size: 'M' },
+  example: () => <CheckDoubleM />,
+});
+
+import CheckDoubleL from '@semcore/ui/icon/CheckDouble/l';
+figma.connect(CheckDoubleL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=5219:40', {
+  variant: { Size: 'L' },
+  example: () => <CheckDoubleL />,
+});
+
+import QuestionM from '@semcore/ui/icon/Question/m';
+figma.connect(QuestionM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:87', {
+  variant: { Size: 'M' },
+  example: () => <QuestionM />,
+});
+
+import QuestionL from '@semcore/ui/icon/Question/l';
+figma.connect(QuestionL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:87', {
+  variant: { Size: 'L' },
+  example: () => <QuestionL />,
+});
+
+import RestaurantM from '@semcore/ui/icon/Restaurant/m';
+figma.connect(RestaurantM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:164', {
+  variant: { Size: 'M' },
+  example: () => <RestaurantM />,
+});
+
+import RestaurantL from '@semcore/ui/icon/Restaurant/l';
+figma.connect(RestaurantL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:164', {
+  variant: { Size: 'L' },
+  example: () => <RestaurantL />,
+});
+
+import VideoCarouselM from '@semcore/ui/icon/VideoCarousel/m';
+figma.connect(VideoCarouselM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1002:10', {
+  variant: { Size: 'M' },
+  example: () => <VideoCarouselM />,
+});
+
+import VideoCarouselL from '@semcore/ui/icon/VideoCarousel/l';
+figma.connect(VideoCarouselL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1002:10', {
+  variant: { Size: 'L' },
+  example: () => <VideoCarouselL />,
+});
+
+import MathMinusM from '@semcore/ui/icon/MathMinus/m';
+figma.connect(MathMinusM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9:416', {
+  variant: { Size: 'M' },
+  example: () => <MathMinusM />,
+});
+
+import MathMinusL from '@semcore/ui/icon/MathMinus/l';
+figma.connect(MathMinusL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9:416', {
+  variant: { Size: 'L' },
+  example: () => <MathMinusL />,
+});
+
+import AdBottomM from '@semcore/ui/icon/AdBottom/m';
+figma.connect(AdBottomM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=426:308', {
+  variant: { Size: 'M' },
+  example: () => <AdBottomM />,
+});
+
+import AdBottomL from '@semcore/ui/icon/AdBottom/l';
+figma.connect(AdBottomL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=426:308', {
+  variant: { Size: 'L' },
+  example: () => <AdBottomL />,
+});
+
+import RedirectM from '@semcore/ui/icon/Redirect/m';
+figma.connect(RedirectM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=423:243', {
+  variant: { Size: 'M' },
+  example: () => <RedirectM />,
+});
+
+import RedirectL from '@semcore/ui/icon/Redirect/l';
+figma.connect(RedirectL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=423:243', {
+  variant: { Size: 'L' },
+  example: () => <RedirectL />,
+});
+
+import SmileSimpleM from '@semcore/ui/icon/SmileSimple/m';
+figma.connect(SmileSimpleM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4:112', {
+  variant: { Size: 'M' },
+  example: () => <SmileSimpleM />,
+});
+
+import SmileSimpleL from '@semcore/ui/icon/SmileSimple/l';
+figma.connect(SmileSimpleL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4:112', {
+  variant: { Size: 'L' },
+  example: () => <SmileSimpleL />,
+});
+
+import FileExportM from '@semcore/ui/icon/FileExport/m';
+figma.connect(FileExportM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:324', {
+  variant: { Size: 'M' },
+  example: () => <FileExportM />,
+});
+
+import FileExportL from '@semcore/ui/icon/FileExport/l';
+figma.connect(FileExportL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:324', {
+  variant: { Size: 'L' },
+  example: () => <FileExportL />,
+});
+
+import CursorDefaultM from '@semcore/ui/icon/CursorDefault/m';
+figma.connect(CursorDefaultM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:977', {
+  variant: { Size: 'M' },
+  example: () => <CursorDefaultM />,
+});
+
+import CursorDefaultL from '@semcore/ui/icon/CursorDefault/l';
+figma.connect(CursorDefaultL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:977', {
+  variant: { Size: 'L' },
+  example: () => <CursorDefaultL />,
+});
+
+import ChartBarM from '@semcore/ui/icon/ChartBar/m';
+figma.connect(ChartBarM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=209:9', {
+  variant: { Size: 'M' },
+  example: () => <ChartBarM />,
+});
+
+import ChartBarL from '@semcore/ui/icon/ChartBar/l';
+figma.connect(ChartBarL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=209:9', {
+  variant: { Size: 'L' },
+  example: () => <ChartBarL />,
+});
+
+import DocumentPdfM from '@semcore/ui/icon/DocumentPdf/m';
+figma.connect(DocumentPdfM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=229:57', {
+  variant: { Size: 'M' },
+  example: () => <DocumentPdfM />,
+});
+
+import DocumentPdfL from '@semcore/ui/icon/DocumentPdf/l';
+figma.connect(DocumentPdfL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=229:57', {
+  variant: { Size: 'L' },
+  example: () => <DocumentPdfL />,
+});
+
+import SmileSadM from '@semcore/ui/icon/SmileSad/m';
+figma.connect(SmileSadM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4:6', {
+  variant: { Size: 'M' },
+  example: () => <SmileSadM />,
+});
+
+import SmileSadL from '@semcore/ui/icon/SmileSad/l';
+figma.connect(SmileSadL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4:6', {
+  variant: { Size: 'L' },
+  example: () => <SmileSadL />,
+});
+
+import PictureAddM from '@semcore/ui/icon/PictureAdd/m';
+figma.connect(PictureAddM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=241:22', {
+  variant: { Size: 'M' },
+  example: () => <PictureAddM />,
+});
+
+import PictureAddL from '@semcore/ui/icon/PictureAdd/l';
+figma.connect(PictureAddL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=241:22', {
+  variant: { Size: 'L' },
+  example: () => <PictureAddL />,
+});
+
+import SideMenuRightM from '@semcore/ui/icon/SideMenuRight/m';
+figma.connect(SideMenuRightM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=544:35', {
+  variant: { Size: 'M' },
+  example: () => <SideMenuRightM />,
+});
+
+import SideMenuRightL from '@semcore/ui/icon/SideMenuRight/l';
+figma.connect(SideMenuRightL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=544:35', {
+  variant: { Size: 'L' },
+  example: () => <SideMenuRightL />,
+});
+
+import GamblingM from '@semcore/ui/icon/Gambling/m';
+figma.connect(GamblingM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:119', {
+  variant: { Size: 'M' },
+  example: () => <GamblingM />,
+});
+
+import GamblingL from '@semcore/ui/icon/Gambling/l';
+figma.connect(GamblingL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:119', {
+  variant: { Size: 'L' },
+  example: () => <GamblingL />,
+});
+
+import MailOpenM from '@semcore/ui/icon/MailOpen/m';
+figma.connect(MailOpenM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=518:38', {
+  variant: { Size: 'M' },
+  example: () => <MailOpenM />,
+});
+
+import MailOpenL from '@semcore/ui/icon/MailOpen/l';
+figma.connect(MailOpenL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=518:38', {
+  variant: { Size: 'L' },
+  example: () => <MailOpenL />,
+});
+
+import ColumnThreeM from '@semcore/ui/icon/ColumnThree/m';
+figma.connect(ColumnThreeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=385:235', {
+  variant: { Size: 'M' },
+  example: () => <ColumnThreeM />,
+});
+
+import ColumnThreeL from '@semcore/ui/icon/ColumnThree/l';
+figma.connect(ColumnThreeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=385:235', {
+  variant: { Size: 'L' },
+  example: () => <ColumnThreeL />,
+});
+
+import SmileHappyM from '@semcore/ui/icon/SmileHappy/m';
+figma.connect(SmileHappyM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4:117', {
+  variant: { Size: 'M' },
+  example: () => <SmileHappyM />,
+});
+
+import SmileHappyL from '@semcore/ui/icon/SmileHappy/l';
+figma.connect(SmileHappyL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4:117', {
+  variant: { Size: 'L' },
+  example: () => <SmileHappyL />,
+});
+
+import CheckAltM from '@semcore/ui/icon/CheckAlt/m';
+figma.connect(CheckAltM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=428:376', {
+  variant: { Size: 'M' },
+  example: () => <CheckAltM />,
+});
+
+import CheckAltL from '@semcore/ui/icon/CheckAlt/l';
+figma.connect(CheckAltL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=428:376', {
+  variant: { Size: 'L' },
+  example: () => <CheckAltL />,
+});
+
+import FormatAlignLeftM from '@semcore/ui/icon/FormatAlignLeft/m';
+figma.connect(FormatAlignLeftM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:429', {
+  variant: { Size: 'M' },
+  example: () => <FormatAlignLeftM />,
+});
+
+import FormatAlignLeftL from '@semcore/ui/icon/FormatAlignLeft/l';
+figma.connect(FormatAlignLeftL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:429', {
+  variant: { Size: 'L' },
+  example: () => <FormatAlignLeftL />,
+});
+
+import EducationM from '@semcore/ui/icon/Education/m';
+figma.connect(EducationM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:22', {
+  variant: { Size: 'M' },
+  example: () => <EducationM />,
+});
+
+import EducationL from '@semcore/ui/icon/Education/l';
+figma.connect(EducationL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:22', {
+  variant: { Size: 'L' },
+  example: () => <EducationL />,
+});
+
+import ThumbDownM from '@semcore/ui/icon/ThumbDown/m';
+figma.connect(ThumbDownM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:385', {
+  variant: { Size: 'M' },
+  example: () => <ThumbDownM />,
+});
+
+import ThumbDownL from '@semcore/ui/icon/ThumbDown/l';
+figma.connect(ThumbDownL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:385', {
+  variant: { Size: 'L' },
+  example: () => <ThumbDownL />,
+});
+
+import QuestionSerpM from '@semcore/ui/icon/QuestionSerp/m';
+figma.connect(QuestionSerpM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1543:4', {
+  variant: { Size: 'M' },
+  example: () => <QuestionSerpM />,
+});
+
+import QuestionSerpL from '@semcore/ui/icon/QuestionSerp/l';
+figma.connect(QuestionSerpL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1543:4', {
+  variant: { Size: 'L' },
+  example: () => <QuestionSerpL />,
+});
+
+import RedoM from '@semcore/ui/icon/Redo/m';
+figma.connect(RedoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=423:228', {
+  variant: { Size: 'M' },
+  example: () => <RedoM />,
+});
+
+import RedoL from '@semcore/ui/icon/Redo/l';
+figma.connect(RedoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=423:228', {
+  variant: { Size: 'L' },
+  example: () => <RedoL />,
+});
+
+import FormatAlignCenterM from '@semcore/ui/icon/FormatAlignCenter/m';
+figma.connect(FormatAlignCenterM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:424', {
+  variant: { Size: 'M' },
+  example: () => <FormatAlignCenterM />,
+});
+
+import FormatAlignCenterL from '@semcore/ui/icon/FormatAlignCenter/l';
+figma.connect(FormatAlignCenterL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:424', {
+  variant: { Size: 'L' },
+  example: () => <FormatAlignCenterL />,
+});
+
+import InfoM from '@semcore/ui/icon/Info/m';
+figma.connect(InfoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:2045', {
+  variant: { Size: 'M' },
+  example: () => <InfoM />,
+});
+
+import InfoL from '@semcore/ui/icon/Info/l';
+figma.connect(InfoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:2045', {
+  variant: { Size: 'L' },
+  example: () => <InfoL />,
+});
+
+import PackagingM from '@semcore/ui/icon/Packaging/m';
+figma.connect(PackagingM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:64', {
+  variant: { Size: 'M' },
+  example: () => <PackagingM />,
+});
+
+import PackagingL from '@semcore/ui/icon/Packaging/l';
+figma.connect(PackagingL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:64', {
+  variant: { Size: 'L' },
+  example: () => <PackagingL />,
+});
+
+import PositionTopM from '@semcore/ui/icon/PositionTop/m';
+figma.connect(PositionTopM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=388:14', {
+  variant: { Size: 'M' },
+  example: () => <PositionTopM />,
+});
+
+import PositionTopL from '@semcore/ui/icon/PositionTop/l';
+figma.connect(PositionTopL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=388:14', {
+  variant: { Size: 'L' },
+  example: () => <PositionTopL />,
+});
+
+import LawM from '@semcore/ui/icon/Law/m';
+figma.connect(LawM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:74', {
+  variant: { Size: 'M' },
+  example: () => <LawM />,
+});
+
+import LawL from '@semcore/ui/icon/Law/l';
+figma.connect(LawL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:74', {
+  variant: { Size: 'L' },
+  example: () => <LawL />,
+});
+
+import YoutubePlaceholderM from '@semcore/ui/icon/YoutubePlaceholder/m';
+figma.connect(YoutubePlaceholderM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:645', {
+  variant: { Size: 'M' },
+  example: () => <YoutubePlaceholderM />,
+});
+
+import YoutubePlaceholderL from '@semcore/ui/icon/YoutubePlaceholder/l';
+figma.connect(YoutubePlaceholderL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:645', {
+  variant: { Size: 'L' },
+  example: () => <YoutubePlaceholderL />,
+});
+
+import UnsplashM from '@semcore/ui/icon/Unsplash/m';
+figma.connect(UnsplashM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4783:5', {
+  variant: { Size: 'M' },
+  example: () => <UnsplashM />,
+});
+
+import UnsplashL from '@semcore/ui/icon/Unsplash/l';
+figma.connect(UnsplashL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4783:5', {
+  variant: { Size: 'L' },
+  example: () => <UnsplashL />,
+});
+
+import LockYesM from '@semcore/ui/icon/LockYes/m';
+figma.connect(LockYesM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=182:40', {
+  variant: { Size: 'M' },
+  example: () => <LockYesM />,
+});
+
+import LockYesL from '@semcore/ui/icon/LockYes/l';
+figma.connect(LockYesL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=182:40', {
+  variant: { Size: 'L' },
+  example: () => <LockYesL />,
+});
+
+import DocumentCheckM from '@semcore/ui/icon/DocumentCheck/m';
+figma.connect(DocumentCheckM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=229:52', {
+  variant: { Size: 'M' },
+  example: () => <DocumentCheckM />,
+});
+
+import DocumentCheckL from '@semcore/ui/icon/DocumentCheck/l';
+figma.connect(DocumentCheckL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=229:52', {
+  variant: { Size: 'L' },
+  example: () => <DocumentCheckL />,
+});
+
+import CartM from '@semcore/ui/icon/Cart/m';
+figma.connect(CartM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:309', {
+  variant: { Size: 'M' },
+  example: () => <CartM />,
+});
+
+import CartL from '@semcore/ui/icon/Cart/l';
+figma.connect(CartL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8:309', {
+  variant: { Size: 'L' },
+  example: () => <CartL />,
+});
+
+import LinkInternalM from '@semcore/ui/icon/LinkInternal/m';
+figma.connect(LinkInternalM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=498:25', {
+  variant: { Size: 'M' },
+  example: () => <LinkInternalM />,
+});
+
+import LinkInternalL from '@semcore/ui/icon/LinkInternal/l';
+figma.connect(LinkInternalL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=498:25', {
+  variant: { Size: 'L' },
+  example: () => <LinkInternalL />,
+});
+
+import ArrowsM from '@semcore/ui/icon/Arrows/m';
+figma.connect(ArrowsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=313:4', {
+  variant: { Size: 'M' },
+  example: () => <ArrowsM />,
+});
+
+import ArrowsL from '@semcore/ui/icon/Arrows/l';
+figma.connect(ArrowsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=313:4', {
+  variant: { Size: 'L' },
+  example: () => <ArrowsL />,
+});
+
+import CalendarM from '@semcore/ui/icon/Calendar/m';
+figma.connect(CalendarM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4:169', {
+  variant: { Size: 'M' },
+  example: () => <CalendarM />,
+});
+
+import CalendarL from '@semcore/ui/icon/Calendar/l';
+figma.connect(CalendarL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4:169', {
+  variant: { Size: 'L' },
+  example: () => <CalendarL />,
+});
+
+import YoutubeM from '@semcore/ui/icon/Youtube/m';
+figma.connect(YoutubeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:640', {
+  variant: { Size: 'M' },
+  example: () => <YoutubeM />,
+});
+
+import YoutubeL from '@semcore/ui/icon/Youtube/l';
+figma.connect(YoutubeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:640', {
+  variant: { Size: 'L' },
+  example: () => <YoutubeL />,
+});
+
+import LinkAltBrokenM from '@semcore/ui/icon/LinkAltBroken/m';
+figma.connect(LinkAltBrokenM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=565:74', {
+  variant: { Size: 'M' },
+  example: () => <LinkAltBrokenM />,
+});
+
+import LinkAltBrokenL from '@semcore/ui/icon/LinkAltBroken/l';
+figma.connect(LinkAltBrokenL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=565:74', {
+  variant: { Size: 'L' },
+  example: () => <LinkAltBrokenL />,
+});
+
+import FurnitureM from '@semcore/ui/icon/Furniture/m';
+figma.connect(FurnitureM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:104', {
+  variant: { Size: 'M' },
+  example: () => <FurnitureM />,
+});
+
+import FurnitureL from '@semcore/ui/icon/Furniture/l';
+figma.connect(FurnitureL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:104', {
+  variant: { Size: 'L' },
+  example: () => <FurnitureL />,
+});
+
+import DocumentHappyM from '@semcore/ui/icon/DocumentHappy/m';
+figma.connect(DocumentHappyM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=229:67', {
+  variant: { Size: 'M' },
+  example: () => <DocumentHappyM />,
+});
+
+import DocumentHappyL from '@semcore/ui/icon/DocumentHappy/l';
+figma.connect(DocumentHappyL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=229:67', {
+  variant: { Size: 'L' },
+  example: () => <DocumentHappyL />,
+});
+
+import IndentedResultM from '@semcore/ui/icon/IndentedResult/m';
+figma.connect(IndentedResultM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1788:4', {
+  variant: { Size: 'M' },
+  example: () => <IndentedResultM />,
+});
+
+import IndentedResultL from '@semcore/ui/icon/IndentedResult/l';
+figma.connect(IndentedResultL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1788:4', {
+  variant: { Size: 'L' },
+  example: () => <IndentedResultL />,
+});
+
+import SmileNeutralM from '@semcore/ui/icon/SmileNeutral/m';
+figma.connect(SmileNeutralM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4:107', {
+  variant: { Size: 'M' },
+  example: () => <SmileNeutralM />,
+});
+
+import SmileNeutralL from '@semcore/ui/icon/SmileNeutral/l';
+figma.connect(SmileNeutralL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4:107', {
+  variant: { Size: 'L' },
+  example: () => <SmileNeutralL />,
+});
+
+import BriefcaseM from '@semcore/ui/icon/Briefcase/m';
+figma.connect(BriefcaseM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:897', {
+  variant: { Size: 'M' },
+  example: () => <BriefcaseM />,
+});
+
+import BriefcaseL from '@semcore/ui/icon/Briefcase/l';
+figma.connect(BriefcaseL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:897', {
+  variant: { Size: 'L' },
+  example: () => <BriefcaseL />,
+});
+
+import CurrencyUsdM from '@semcore/ui/icon/CurrencyUsd/m';
+figma.connect(CurrencyUsdM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=430:456', {
+  variant: { Size: 'M' },
+  example: () => <CurrencyUsdM />,
+});
+
+import CurrencyUsdL from '@semcore/ui/icon/CurrencyUsd/l';
+figma.connect(CurrencyUsdL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=430:456', {
+  variant: { Size: 'L' },
+  example: () => <CurrencyUsdL />,
+});
+
+import ChromeM from '@semcore/ui/icon/Chrome/m';
+figma.connect(ChromeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=138:156', {
+  variant: { Size: 'M' },
+  example: () => <ChromeM />,
+});
+
+import ChromeL from '@semcore/ui/icon/Chrome/l';
+figma.connect(ChromeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=138:156', {
+  variant: { Size: 'L' },
+  example: () => <ChromeL />,
+});
+
+import LogisticM from '@semcore/ui/icon/Logistic/m';
+figma.connect(LogisticM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:59', {
+  variant: { Size: 'M' },
+  example: () => <LogisticM />,
+});
+
+import LogisticL from '@semcore/ui/icon/Logistic/l';
+figma.connect(LogisticL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2949:59', {
+  variant: { Size: 'L' },
+  example: () => <LogisticL />,
+});
+
+import OrientationLandscapeM from '@semcore/ui/icon/OrientationLandscape/m';
+figma.connect(OrientationLandscapeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=386:105', {
+  variant: { Size: 'M' },
+  example: () => <OrientationLandscapeM />,
+});
+
+import OrientationLandscapeL from '@semcore/ui/icon/OrientationLandscape/l';
+figma.connect(OrientationLandscapeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=386:105', {
+  variant: { Size: 'L' },
+  example: () => <OrientationLandscapeL />,
+});
+
+import MathPlusAltM from '@semcore/ui/icon/MathPlusAlt/m';
+figma.connect(MathPlusAltM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=553:34', {
+  variant: { Size: 'M' },
+  example: () => <MathPlusAltM />,
+});
+
+import MathPlusAltL from '@semcore/ui/icon/MathPlusAlt/l';
+figma.connect(MathPlusAltL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=553:34', {
+  variant: { Size: 'L' },
+  example: () => <MathPlusAltL />,
+});
+
+import ProwlyM from '@semcore/ui/icon/Prowly/m';
+figma.connect(ProwlyM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=42:66', {
+  variant: { Size: 'M' },
+  example: () => <ProwlyM />,
+});
+
+import ProwlyL from '@semcore/ui/icon/Prowly/l';
+figma.connect(ProwlyL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=42:66', {
+  variant: { Size: 'L' },
+  example: () => <ProwlyL />,
+});
+
+import HotelM from '@semcore/ui/icon/Hotel/m';
+figma.connect(HotelM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=851:9', {
+  variant: { Size: 'M' },
+  example: () => <HotelM />,
+});
+
+import HotelL from '@semcore/ui/icon/Hotel/l';
+figma.connect(HotelL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=851:9', {
+  variant: { Size: 'L' },
+  example: () => <HotelL />,
+});
+
+import FacebookMessengerM from '@semcore/ui/icon/FacebookMessenger/m';
+figma.connect(FacebookMessengerM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=139:38', {
+  variant: { Size: 'M' },
+  example: () => <FacebookMessengerM />,
+});
+
+import FacebookMessengerL from '@semcore/ui/icon/FacebookMessenger/l';
+figma.connect(FacebookMessengerL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=139:38', {
+  variant: { Size: 'L' },
+  example: () => <FacebookMessengerL />,
+});
+
+import TwitterM from '@semcore/ui/icon/Twitter/m';
+figma.connect(TwitterM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=83:217', {
+  variant: { Size: 'M' },
+  example: () => <TwitterM />,
+});
+
+import TwitterL from '@semcore/ui/icon/Twitter/l';
+figma.connect(TwitterL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=83:217', {
+  variant: { Size: 'L' },
+  example: () => <TwitterL />,
+});
+
+import ChevronDoubleLeftM from '@semcore/ui/icon/ChevronDoubleLeft/m';
+figma.connect(ChevronDoubleLeftM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=78:82', {
+  variant: { Size: 'M' },
+  example: () => <ChevronDoubleLeftM />,
+});
+
+import ChevronDoubleLeftL from '@semcore/ui/icon/ChevronDoubleLeft/l';
+figma.connect(ChevronDoubleLeftL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=78:82', {
+  variant: { Size: 'L' },
+  example: () => <ChevronDoubleLeftL />,
+});
+
+import FoursquareM from '@semcore/ui/icon/Foursquare/m';
+figma.connect(FoursquareM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=226:452', {
+  variant: { Size: 'M' },
+  example: () => <FoursquareM />,
+});
+
+import FoursquareL from '@semcore/ui/icon/Foursquare/l';
+figma.connect(FoursquareL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=226:452', {
+  variant: { Size: 'L' },
+  example: () => <FoursquareL />,
+});
+
+import ChevronDoubleUpM from '@semcore/ui/icon/ChevronDoubleUp/m';
+figma.connect(ChevronDoubleUpM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=78:156', {
+  variant: { Size: 'M' },
+  example: () => <ChevronDoubleUpM />,
+});
+
+import ChevronDoubleUpL from '@semcore/ui/icon/ChevronDoubleUp/l';
+figma.connect(ChevronDoubleUpL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=78:156', {
+  variant: { Size: 'L' },
+  example: () => <ChevronDoubleUpL />,
+});
+
+import DocumentM from '@semcore/ui/icon/Document/m';
+figma.connect(DocumentM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=229:42', {
+  variant: { Size: 'M' },
+  example: () => <DocumentM />,
+});
+
+import DocumentL from '@semcore/ui/icon/Document/l';
+figma.connect(DocumentL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=229:42', {
+  variant: { Size: 'L' },
+  example: () => <DocumentL />,
+});
+
+import MathMinusAltM from '@semcore/ui/icon/MathMinusAlt/m';
+figma.connect(MathMinusAltM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1376:7663', {
+  variant: { Size: 'M' },
+  example: () => <MathMinusAltM />,
+});
+
+import MathMinusAltL from '@semcore/ui/icon/MathMinusAlt/l';
+figma.connect(MathMinusAltL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1376:7663', {
+  variant: { Size: 'L' },
+  example: () => <MathMinusAltL />,
+});
+
+import AttachM from '@semcore/ui/icon/Attach/m';
+figma.connect(AttachM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=328:4', {
+  variant: { Size: 'M' },
+  example: () => <AttachM />,
+});
+
+import AttachL from '@semcore/ui/icon/Attach/l';
+figma.connect(AttachL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=328:4', {
+  variant: { Size: 'L' },
+  example: () => <AttachL />,
+});
+
+import ChatM from '@semcore/ui/icon/Chat/m';
+figma.connect(ChatM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:550', {
+  variant: { Size: 'M' },
+  example: () => <ChatM />,
+});
+
+import ChatL from '@semcore/ui/icon/Chat/l';
+figma.connect(ChatL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:550', {
+  variant: { Size: 'L' },
+  example: () => <ChatL />,
+});
+
+import HomeM from '@semcore/ui/icon/Home/m';
+figma.connect(HomeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=519:113', {
+  variant: { Size: 'M' },
+  example: () => <HomeM />,
+});
+
+import HomeL from '@semcore/ui/icon/Home/l';
+figma.connect(HomeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=519:113', {
+  variant: { Size: 'L' },
+  example: () => <HomeL />,
+});
+
+import ChevronLeftM from '@semcore/ui/icon/ChevronLeft/m';
+figma.connect(ChevronLeftM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4625', {
+  variant: { Size: 'M' },
+  example: () => <ChevronLeftM />,
+});
+
+import ChevronLeftL from '@semcore/ui/icon/ChevronLeft/l';
+figma.connect(ChevronLeftL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3:4625', {
+  variant: { Size: 'L' },
+  example: () => <ChevronLeftL />,
+});
+
+import FavoriteM from '@semcore/ui/icon/Favorite/m';
+figma.connect(FavoriteM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:485', {
+  variant: { Size: 'M' },
+  example: () => <FavoriteM />,
+});
+
+import FavoriteL from '@semcore/ui/icon/Favorite/l';
+figma.connect(FavoriteL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:485', {
+  variant: { Size: 'L' },
+  example: () => <FavoriteL />,
+});
+
+import FilterM from '@semcore/ui/icon/Filter/m';
+figma.connect(FilterM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=210:9', {
+  variant: { Size: 'M' },
+  example: () => <FilterM />,
+});
+
+import FilterL from '@semcore/ui/icon/Filter/l';
+figma.connect(FilterL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=210:9', {
+  variant: { Size: 'L' },
+  example: () => <FilterL />,
+});
+
+import DesktopChartM from '@semcore/ui/icon/DesktopChart/m';
+figma.connect(DesktopChartM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:236', {
+  variant: { Size: 'M' },
+  example: () => <DesktopChartM />,
+});
+
+import DesktopChartL from '@semcore/ui/icon/DesktopChart/l';
+figma.connect(DesktopChartL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6:236', {
+  variant: { Size: 'L' },
+  example: () => <DesktopChartL />,
+});
+
+import ShowYesM from '@semcore/ui/icon/ShowYes/m';
+figma.connect(ShowYesM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=648:4', {
+  variant: { Size: 'M' },
+  example: () => <ShowYesM />,
+});
+
+import ShowYesL from '@semcore/ui/icon/ShowYes/l';
+figma.connect(ShowYesL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=648:4', {
+  variant: { Size: 'L' },
+  example: () => <ShowYesL />,
+});
+
+import KeyHotkeyM from '@semcore/ui/icon/KeyHotkey/m';
+figma.connect(KeyHotkeyM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=464:11', {
+  variant: { Size: 'M' },
+  example: () => <KeyHotkeyM />,
+});
+
+import KeyHotkeyL from '@semcore/ui/icon/KeyHotkey/l';
+figma.connect(KeyHotkeyL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=464:11', {
+  variant: { Size: 'L' },
+  example: () => <KeyHotkeyL />,
+});
+
+import EllipsisM from '@semcore/ui/icon/Ellipsis/m';
+figma.connect(EllipsisM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=42:3', {
+  variant: { Size: 'M' },
+  example: () => <EllipsisM />,
+});
+
+import EllipsisL from '@semcore/ui/icon/Ellipsis/l';
+figma.connect(EllipsisL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=42:3', {
+  variant: { Size: 'L' },
+  example: () => <EllipsisL />,
+});
+
+import RephraseM from '@semcore/ui/icon/Rephrase/m';
+figma.connect(RephraseM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2845:4', {
+  variant: { Size: 'M' },
+  example: () => <RephraseM />,
+});
+
+import RephraseL from '@semcore/ui/icon/Rephrase/l';
+figma.connect(RephraseL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2845:4', {
+  variant: { Size: 'L' },
+  example: () => <RephraseL />,
+});
+
+import AppleM from '@semcore/ui/icon/Apple/m';
+figma.connect(AppleM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:750', {
+  variant: { Size: 'M' },
+  example: () => <AppleM />,
+});
+
+import AppleL from '@semcore/ui/icon/Apple/l';
+figma.connect(AppleL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:750', {
+  variant: { Size: 'L' },
+  example: () => <AppleL />,
+});
+
+import BlockM from '@semcore/ui/icon/Block/m';
+figma.connect(BlockM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:490', {
+  variant: { Size: 'M' },
+  example: () => <BlockM />,
+});
+
+import BlockL from '@semcore/ui/icon/Block/l';
+figma.connect(BlockL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=10:490', {
+  variant: { Size: 'L' },
+  example: () => <BlockL />,
+});
+
+import BookmarkFilledM from '@semcore/ui/icon/BookmarkFilled/m';
+figma.connect(BookmarkFilledM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=245:4', {
+  variant: { Size: 'M' },
+  example: () => <BookmarkFilledM />,
+});
+
+import BookmarkFilledL from '@semcore/ui/icon/BookmarkFilled/l';
+figma.connect(BookmarkFilledL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=245:4', {
+  variant: { Size: 'L' },
+  example: () => <BookmarkFilledL />,
+});
+
+import ShareM from '@semcore/ui/icon/Share/m';
+figma.connect(ShareM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=423:253', {
+  variant: { Size: 'M' },
+  example: () => <ShareM />,
+});
+
+import ShareL from '@semcore/ui/icon/Share/l';
+figma.connect(ShareL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=423:253', {
+  variant: { Size: 'L' },
+  example: () => <ShareL />,
+});
+
+import ChargeM from '@semcore/ui/icon/Charge/m';
+figma.connect(ChargeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2613:4', {
+  variant: { Size: 'M' },
+  example: () => <ChargeM />,
+});
+
+import ChargeL from '@semcore/ui/icon/Charge/l';
+figma.connect(ChargeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2613:4', {
+  variant: { Size: 'L' },
+  example: () => <ChargeL />,
+});
+
+import SideMenuLeftM from '@semcore/ui/icon/SideMenuLeft/m';
+figma.connect(SideMenuLeftM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=544:30', {
+  variant: { Size: 'M' },
+  example: () => <SideMenuLeftM />,
+});
+
+import SideMenuLeftL from '@semcore/ui/icon/SideMenuLeft/l';
+figma.connect(SideMenuLeftL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=544:30', {
+  variant: { Size: 'L' },
+  example: () => <SideMenuLeftL />,
+});
+
+import FavoriteFilledM from '@semcore/ui/icon/FavoriteFilled/m';
+figma.connect(FavoriteFilledM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:480', {
+  variant: { Size: 'M' },
+  example: () => <FavoriteFilledM />,
+});
+
+import FavoriteFilledL from '@semcore/ui/icon/FavoriteFilled/l';
+figma.connect(FavoriteFilledL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=80:480', {
+  variant: { Size: 'L' },
+  example: () => <FavoriteFilledL />,
+});
+
+import CheckboxM from '@semcore/ui/icon/Checkbox/m';
+figma.connect(CheckboxM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=427:365', {
+  variant: { Size: 'M' },
+  example: () => <CheckboxM />,
+});
+
+import CheckboxL from '@semcore/ui/icon/Checkbox/l';
+figma.connect(CheckboxL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=427:365', {
+  variant: { Size: 'L' },
+  example: () => <CheckboxL />,
+});
+
+import LookerStudioM from '@semcore/ui/icon/color/LookerStudio/m';
+figma.connect(LookerStudioM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2836:5', {
+  variant: { Size: 'M' },
+  example: () => <LookerStudioM />,
+});
+
+import LookerStudioL from '@semcore/ui/icon/color/LookerStudio/l';
+figma.connect(LookerStudioL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2836:5', {
+  variant: { Size: 'L' },
+  example: () => <LookerStudioL />,
+});
+
+import VideoListM from '@semcore/ui/icon/VideoList/m';
+figma.connect(VideoListM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7331:3', {
+  variant: { Size: 'M' },
+  example: () => <VideoListM />,
+});
+
+import VideoListL from '@semcore/ui/icon/VideoList/l';
+figma.connect(VideoListL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7331:3', {
+  variant: { Size: 'L' },
+  example: () => <VideoListL />,
+});
+
+import CollapseListM from '@semcore/ui/icon/CollapseList/m';
+figma.connect(CollapseListM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9166:7', {
+  variant: { Size: 'M' },
+  example: () => <CollapseListM />,
+});
+
+import CollapseListL from '@semcore/ui/icon/CollapseList/l';
+figma.connect(CollapseListL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9166:7', {
+  variant: { Size: 'L' },
+  example: () => <CollapseListL />,
+});
+
+import AskAIM from '@semcore/ui/icon/AskAI/m';
+figma.connect(AskAIM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4777:14015', {
+  variant: { Size: 'M' },
+  example: () => <AskAIM />,
+});
+
+import AskAIL from '@semcore/ui/icon/AskAI/l';
+figma.connect(AskAIL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4777:14015', {
+  variant: { Size: 'L' },
+  example: () => <AskAIL />,
+});
+
+import MonitoringM from '@semcore/ui/icon/Monitoring/m';
+figma.connect(MonitoringM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9534:60', {
+  variant: { Size: 'M' },
+  example: () => <MonitoringM />,
+});
+
+import MonitoringL from '@semcore/ui/icon/Monitoring/l';
+figma.connect(MonitoringL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9534:60', {
+  variant: { Size: 'L' },
+  example: () => <MonitoringL />,
+});
+
+import ZoomMinusM from '@semcore/ui/icon/ZoomMinus/m';
+figma.connect(ZoomMinusM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=217:137', {
+  variant: { Size: 'M' },
+  example: () => <ZoomMinusM />,
+});
+
+import ZoomMinusL from '@semcore/ui/icon/ZoomMinus/l';
+figma.connect(ZoomMinusL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=217:137', {
+  variant: { Size: 'L' },
+  example: () => <ZoomMinusL />,
+});
+
+import ZoomPlusM from '@semcore/ui/icon/ZoomPlus/m';
+figma.connect(ZoomPlusM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=217:142', {
+  variant: { Size: 'M' },
+  example: () => <ZoomPlusM />,
+});
+
+import ZoomPlusL from '@semcore/ui/icon/ZoomPlus/l';
+figma.connect(ZoomPlusL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=217:142', {
+  variant: { Size: 'L' },
+  example: () => <ZoomPlusL />,
+});
+
+import SearchM from '@semcore/ui/icon/Search/m';
+figma.connect(SearchM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=182:30', {
+  variant: { Size: 'M' },
+  example: () => <SearchM />,
+});
+
+import SearchL from '@semcore/ui/icon/Search/l';
+figma.connect(SearchL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=182:30', {
+  variant: { Size: 'L' },
+  example: () => <SearchL />,
+});
+
+import FindResultsOnM from '@semcore/ui/icon/FindResultsOn/m';
+figma.connect(FindResultsOnM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:14', {
+  variant: { Size: 'M' },
+  example: () => <FindResultsOnM />,
+});
+
+import FindResultsOnL from '@semcore/ui/icon/FindResultsOn/l';
+figma.connect(FindResultsOnL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3190:14', {
+  variant: { Size: 'L' },
+  example: () => <FindResultsOnL />,
+});
+
+import SerpM from '@semcore/ui/icon/Serp/m';
+figma.connect(SerpM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1196', {
+  variant: { Size: 'M' },
+  example: () => <SerpM />,
+});
+
+import SerpL from '@semcore/ui/icon/Serp/l';
+figma.connect(SerpL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=12:1196', {
+  variant: { Size: 'L' },
+  example: () => <SerpL />,
+});
+
+import ChatGPTM from '@semcore/ui/icon/ChatGPT/m';
+figma.connect(ChatGPTM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7364:3', {
+  variant: { Size: 'M' },
+  example: () => <ChatGPTM />,
+});
+
+import ChatGPTL from '@semcore/ui/icon/ChatGPT/l';
+figma.connect(ChatGPTL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7364:3', {
+  variant: { Size: 'L' },
+  example: () => <ChatGPTL />,
+});
+
+import BracketsCodeM from '@semcore/ui/icon/BracketsCode/m';
+figma.connect(BracketsCodeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=37:38', {
+  variant: { Size: 'M' },
+  example: () => <BracketsCodeM />,
+});
+
+import BracketsCodeL from '@semcore/ui/icon/BracketsCode/l';
+figma.connect(BracketsCodeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=37:38', {
+  variant: { Size: 'L' },
+  example: () => <BracketsCodeL />,
+});
+
+import ClaudeM from '@semcore/ui/icon/Claude/m';
+figma.connect(ClaudeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9256:2', {
+  variant: { Size: 'M' },
+  example: () => <ClaudeM />,
+});
+
+import ClaudeL from '@semcore/ui/icon/Claude/l';
+figma.connect(ClaudeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9256:2', {
+  variant: { Size: 'L' },
+  example: () => <ClaudeL />,
+});
+
+import PerplexityM from '@semcore/ui/icon/Perplexity/m';
+figma.connect(PerplexityM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9244:8', {
+  variant: { Size: 'M' },
+  example: () => <PerplexityM />,
+});
+
+import PerplexityL from '@semcore/ui/icon/Perplexity/l';
+figma.connect(PerplexityL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9244:8', {
+  variant: { Size: 'L' },
+  example: () => <PerplexityL />,
+});
+
+import CanvaM from '@semcore/ui/icon/Canva/m';
+figma.connect(CanvaM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9241:2', {
+  variant: { Size: 'M' },
+  example: () => <CanvaM />,
+});
+
+import CanvaL from '@semcore/ui/icon/Canva/l';
+figma.connect(CanvaL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9241:2', {
+  variant: { Size: 'L' },
+  example: () => <CanvaL />,
+});
+
+import GoogleGenerativeAIM from '@semcore/ui/icon/GoogleGenerativeAI/m';
+figma.connect(GoogleGenerativeAIM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4262:74', {
+  variant: { Size: 'M' },
+  example: () => <GoogleGenerativeAIM />,
+});
+
+import GoogleGenerativeAIL from '@semcore/ui/icon/GoogleGenerativeAI/l';
+figma.connect(GoogleGenerativeAIL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4262:74', {
+  variant: { Size: 'L' },
+  example: () => <GoogleGenerativeAIL />,
+});
+
+import SellzoneM from '@semcore/ui/icon/Sellzone/m';
+figma.connect(SellzoneM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=42:61', {
+  variant: { Size: 'M' },
+  example: () => <SellzoneM />,
+});
+
+import SellzoneL from '@semcore/ui/icon/Sellzone/l';
+figma.connect(SellzoneL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=42:61', {
+  variant: { Size: 'L' },
+  example: () => <SellzoneL />,
+});
+
+import ChartVennM from '@semcore/ui/icon/ChartVenn/m';
+figma.connect(ChartVennM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8503:2', {
+  variant: { Size: 'M' },
+  example: () => <ChartVennM />,
+});
+
+import ChartVennL from '@semcore/ui/icon/ChartVenn/l';
+figma.connect(ChartVennL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8503:2', {
+  variant: { Size: 'L' },
+  example: () => <ChartVennL />,
+});
+
+import MetaColoredM from '@semcore/ui/icon/color/MetaColored/m';
+figma.connect(MetaColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6783:113', {
+  variant: { Size: 'M' },
+  example: () => <MetaColoredM />,
+});
+
+import MetaColoredL from '@semcore/ui/icon/color/MetaColored/l';
+figma.connect(MetaColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6783:113', {
+  variant: { Size: 'L' },
+  example: () => <MetaColoredL />,
+});
+
+import GoogleAnalyticsM from '@semcore/ui/icon/color/GoogleAnalytics/m';
+figma.connect(GoogleAnalyticsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:11', {
+  variant: { Size: 'M' },
+  example: () => <GoogleAnalyticsM />,
+});
+
+import GoogleAnalyticsL from '@semcore/ui/icon/color/GoogleAnalytics/l';
+figma.connect(GoogleAnalyticsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:11', {
+  variant: { Size: 'L' },
+  example: () => <GoogleAnalyticsL />,
+});
+
+import MicrosoftM from '@semcore/ui/icon/color/Microsoft/m';
+figma.connect(MicrosoftM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:78', {
+  variant: { Size: 'M' },
+  example: () => <MicrosoftM />,
+});
+
+import MicrosoftL from '@semcore/ui/icon/color/Microsoft/l';
+figma.connect(MicrosoftL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:78', {
+  variant: { Size: 'L' },
+  example: () => <MicrosoftL />,
+});
+
+import GitLabM from '@semcore/ui/icon/color/GitLab/m';
+figma.connect(GitLabM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:8', {
+  variant: { Size: 'M' },
+  example: () => <GitLabM />,
+});
+
+import GitLabL from '@semcore/ui/icon/color/GitLab/l';
+figma.connect(GitLabL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:8', {
+  variant: { Size: 'L' },
+  example: () => <GitLabL />,
+});
+
+import GoogleSearchConsoleM from '@semcore/ui/icon/color/GoogleSearchConsole/m';
+figma.connect(GoogleSearchConsoleM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:26', {
+  variant: { Size: 'M' },
+  example: () => <GoogleSearchConsoleM />,
+});
+
+import GoogleSearchConsoleL from '@semcore/ui/icon/color/GoogleSearchConsole/l';
+figma.connect(GoogleSearchConsoleL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:26', {
+  variant: { Size: 'L' },
+  example: () => <GoogleSearchConsoleL />,
+});
+
+import BirdeyeColoredM from '@semcore/ui/icon/color/BirdeyeColored/m';
+figma.connect(BirdeyeColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:340', {
+  variant: { Size: 'M' },
+  example: () => <BirdeyeColoredM />,
+});
+
+import BirdeyeColoredL from '@semcore/ui/icon/color/BirdeyeColored/l';
+figma.connect(BirdeyeColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:340', {
+  variant: { Size: 'L' },
+  example: () => <BirdeyeColoredL />,
+});
+
+import GoogleCloudM from '@semcore/ui/icon/color/GoogleCloud/m';
+figma.connect(GoogleCloudM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1968:4', {
+  variant: { Size: 'M' },
+  example: () => <GoogleCloudM />,
+});
+
+import GoogleCloudL from '@semcore/ui/icon/color/GoogleCloud/l';
+figma.connect(GoogleCloudL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1968:4', {
+  variant: { Size: 'L' },
+  example: () => <GoogleCloudL />,
+});
+
+import GoogleSlidesM from '@semcore/ui/icon/color/GoogleSlides/m';
+figma.connect(GoogleSlidesM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4058:15', {
+  variant: { Size: 'M' },
+  example: () => <GoogleSlidesM />,
+});
+
+import GoogleSlidesL from '@semcore/ui/icon/color/GoogleSlides/l';
+figma.connect(GoogleSlidesL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4058:15', {
+  variant: { Size: 'L' },
+  example: () => <GoogleSlidesL />,
+});
+
+import GoogleDisplayVideoAdsM from '@semcore/ui/icon/color/GoogleDisplayVideoAds/m';
+figma.connect(GoogleDisplayVideoAdsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:218', {
+  variant: { Size: 'M' },
+  example: () => <GoogleDisplayVideoAdsM />,
+});
+
+import GoogleDisplayVideoAdsL from '@semcore/ui/icon/color/GoogleDisplayVideoAds/l';
+figma.connect(GoogleDisplayVideoAdsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:218', {
+  variant: { Size: 'L' },
+  example: () => <GoogleDisplayVideoAdsL />,
+});
+
+import GoogleMailM from '@semcore/ui/icon/color/GoogleMail/m';
+figma.connect(GoogleMailM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:29', {
+  variant: { Size: 'M' },
+  example: () => <GoogleMailM />,
+});
+
+import GoogleMailL from '@semcore/ui/icon/color/GoogleMail/l';
+figma.connect(GoogleMailL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:29', {
+  variant: { Size: 'L' },
+  example: () => <GoogleMailL />,
+});
+
+import MicrosoftOfficeM from '@semcore/ui/icon/color/MicrosoftOffice/m';
+figma.connect(MicrosoftOfficeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:38', {
+  variant: { Size: 'M' },
+  example: () => <MicrosoftOfficeM />,
+});
+
+import MicrosoftOfficeL from '@semcore/ui/icon/color/MicrosoftOffice/l';
+figma.connect(MicrosoftOfficeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:38', {
+  variant: { Size: 'L' },
+  example: () => <MicrosoftOfficeL />,
+});
+
+import GitHubM from '@semcore/ui/icon/color/GitHub/m';
+figma.connect(GitHubM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=144:4', {
+  variant: { Size: 'M' },
+  example: () => <GitHubM />,
+});
+
+import GitHubL from '@semcore/ui/icon/color/GitHub/l';
+figma.connect(GitHubL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=144:4', {
+  variant: { Size: 'L' },
+  example: () => <GitHubL />,
+});
+
+import CopilotM from '@semcore/ui/icon/color/Copilot/m';
+figma.connect(CopilotM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7522:2', {
+  variant: { Size: 'M' },
+  example: () => <CopilotM />,
+});
+
+import CopilotL from '@semcore/ui/icon/color/Copilot/l';
+figma.connect(CopilotL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7522:2', {
+  variant: { Size: 'L' },
+  example: () => <CopilotL />,
+});
+
+import ShopifyColoredM from '@semcore/ui/icon/color/ShopifyColored/m';
+figma.connect(ShopifyColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6783:58', {
+  variant: { Size: 'M' },
+  example: () => <ShopifyColoredM />,
+});
+
+import ShopifyColoredL from '@semcore/ui/icon/color/ShopifyColored/l';
+figma.connect(ShopifyColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6783:58', {
+  variant: { Size: 'L' },
+  example: () => <ShopifyColoredL />,
+});
+
+import TikTokColoredM from '@semcore/ui/icon/color/TikTokColored/m';
+figma.connect(TikTokColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6489:187', {
+  variant: { Size: 'M' },
+  example: () => <TikTokColoredM />,
+});
+
+import TikTokColoredL from '@semcore/ui/icon/color/TikTokColored/l';
+figma.connect(TikTokColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6489:187', {
+  variant: { Size: 'L' },
+  example: () => <TikTokColoredL />,
+});
+
+import ConstantContactColoredM from '@semcore/ui/icon/color/ConstantContactColored/m';
+figma.connect(ConstantContactColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:289', {
+  variant: { Size: 'M' },
+  example: () => <ConstantContactColoredM />,
+});
+
+import ConstantContactColoredL from '@semcore/ui/icon/color/ConstantContactColored/l';
+figma.connect(ConstantContactColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:289', {
+  variant: { Size: 'L' },
+  example: () => <ConstantContactColoredL />,
+});
+
+import YoutubeInvertM from '@semcore/ui/icon/color/YoutubeInvert/m';
+figma.connect(YoutubeInvertM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:272', {
+  variant: { Size: 'M' },
+  example: () => <YoutubeInvertM />,
+});
+
+import YoutubeInvertL from '@semcore/ui/icon/color/YoutubeInvert/l';
+figma.connect(YoutubeInvertL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:272', {
+  variant: { Size: 'L' },
+  example: () => <YoutubeInvertL />,
+});
+
+import CallTrackingMetricsColoredM from '@semcore/ui/icon/color/CallTrackingMetricsColored/m';
+figma.connect(CallTrackingMetricsColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:175', {
+  variant: { Size: 'M' },
+  example: () => <CallTrackingMetricsColoredM />,
+});
+
+import CallTrackingMetricsColoredL from '@semcore/ui/icon/color/CallTrackingMetricsColored/l';
+figma.connect(CallTrackingMetricsColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:175', {
+  variant: { Size: 'L' },
+  example: () => <CallTrackingMetricsColoredL />,
+});
+
+import SalesforceM from '@semcore/ui/icon/color/Salesforce/m';
+figma.connect(SalesforceM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:98', {
+  variant: { Size: 'M' },
+  example: () => <SalesforceM />,
+});
+
+import SalesforceL from '@semcore/ui/icon/color/Salesforce/l';
+figma.connect(SalesforceL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:98', {
+  variant: { Size: 'L' },
+  example: () => <SalesforceL />,
+});
+
+import TikTokColoredInvertM from '@semcore/ui/icon/color/TikTokColoredInvert/m';
+figma.connect(TikTokColoredInvertM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6489:202', {
+  variant: { Size: 'M' },
+  example: () => <TikTokColoredInvertM />,
+});
+
+import TikTokColoredInvertL from '@semcore/ui/icon/color/TikTokColoredInvert/l';
+figma.connect(TikTokColoredInvertL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6489:202', {
+  variant: { Size: 'L' },
+  example: () => <TikTokColoredInvertL />,
+});
+
+import GoogleMyBusinessM from '@semcore/ui/icon/color/GoogleMyBusiness/m';
+figma.connect(GoogleMyBusinessM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:32', {
+  variant: { Size: 'M' },
+  example: () => <GoogleMyBusinessM />,
+});
+
+import GoogleMyBusinessL from '@semcore/ui/icon/color/GoogleMyBusiness/l';
+figma.connect(GoogleMyBusinessL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:32', {
+  variant: { Size: 'L' },
+  example: () => <GoogleMyBusinessL />,
+});
+
+import GoogleDocsM from '@semcore/ui/icon/color/GoogleDocs/m';
+figma.connect(GoogleDocsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:23', {
+  variant: { Size: 'M' },
+  example: () => <GoogleDocsM />,
+});
+
+import GoogleDocsL from '@semcore/ui/icon/color/GoogleDocs/l';
+figma.connect(GoogleDocsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:23', {
+  variant: { Size: 'L' },
+  example: () => <GoogleDocsL />,
+});
+
+import MailchimpM from '@semcore/ui/icon/color/Mailchimp/m';
+figma.connect(MailchimpM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:48', {
+  variant: { Size: 'M' },
+  example: () => <MailchimpM />,
+});
+
+import MailchimpL from '@semcore/ui/icon/color/Mailchimp/l';
+figma.connect(MailchimpL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:48', {
+  variant: { Size: 'L' },
+  example: () => <MailchimpL />,
+});
+
+import ClaudeColoredM from '@semcore/ui/icon/color/ClaudeColored/m';
+figma.connect(ClaudeColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9256:23', {
+  variant: { Size: 'M' },
+  example: () => <ClaudeColoredM />,
+});
+
+import ClaudeColoredL from '@semcore/ui/icon/color/ClaudeColored/l';
+figma.connect(ClaudeColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9256:23', {
+  variant: { Size: 'L' },
+  example: () => <ClaudeColoredL />,
+});
+
+import CampaignMonitorColoredM from '@semcore/ui/icon/color/CampaignMonitorColored/m';
+figma.connect(CampaignMonitorColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:271', {
+  variant: { Size: 'M' },
+  example: () => <CampaignMonitorColoredM />,
+});
+
+import CampaignMonitorColoredL from '@semcore/ui/icon/color/CampaignMonitorColored/l';
+figma.connect(CampaignMonitorColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:271', {
+  variant: { Size: 'L' },
+  example: () => <CampaignMonitorColoredL />,
+});
+
+import GoogleAdsM from '@semcore/ui/icon/color/GoogleAds/m';
+figma.connect(GoogleAdsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2731:4', {
+  variant: { Size: 'M' },
+  example: () => <GoogleAdsM />,
+});
+
+import GoogleAdsL from '@semcore/ui/icon/color/GoogleAds/l';
+figma.connect(GoogleAdsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2731:4', {
+  variant: { Size: 'L' },
+  example: () => <GoogleAdsL />,
+});
+
+import MozM from '@semcore/ui/icon/color/Moz/m';
+figma.connect(MozM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:91', {
+  variant: { Size: 'M' },
+  example: () => <MozM />,
+});
+
+import MozL from '@semcore/ui/icon/color/Moz/l';
+figma.connect(MozL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:91', {
+  variant: { Size: 'L' },
+  example: () => <MozL />,
+});
+
+import AhrefsM from '@semcore/ui/icon/color/Ahrefs/m';
+figma.connect(AhrefsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:27', {
+  variant: { Size: 'M' },
+  example: () => <AhrefsM />,
+});
+
+import AhrefsL from '@semcore/ui/icon/color/Ahrefs/l';
+figma.connect(AhrefsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:27', {
+  variant: { Size: 'L' },
+  example: () => <AhrefsL />,
+});
+
+import FigmaM from '@semcore/ui/icon/color/Figma/m';
+figma.connect(FigmaM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=520:1447', {
+  variant: { Size: 'M' },
+  example: () => <FigmaM />,
+});
+
+import FigmaL from '@semcore/ui/icon/color/Figma/l';
+figma.connect(FigmaL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=520:1447', {
+  variant: { Size: 'L' },
+  example: () => <FigmaL />,
+});
+
+import WhatConvertsColoredM from '@semcore/ui/icon/color/WhatConvertsColored/m';
+figma.connect(WhatConvertsColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:200', {
+  variant: { Size: 'M' },
+  example: () => <WhatConvertsColoredM />,
+});
+
+import WhatConvertsColoredL from '@semcore/ui/icon/color/WhatConvertsColored/l';
+figma.connect(WhatConvertsColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:200', {
+  variant: { Size: 'L' },
+  example: () => <WhatConvertsColoredL />,
+});
+
+import GoogleDataStudioM from '@semcore/ui/icon/color/GoogleDataStudio/m';
+figma.connect(GoogleDataStudioM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:20', {
+  variant: { Size: 'M' },
+  example: () => <GoogleDataStudioM />,
+});
+
+import GoogleDataStudioL from '@semcore/ui/icon/color/GoogleDataStudio/l';
+figma.connect(GoogleDataStudioL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:20', {
+  variant: { Size: 'L' },
+  example: () => <GoogleDataStudioL />,
+});
+
+import HubspotM from '@semcore/ui/icon/color/Hubspot/m';
+figma.connect(HubspotM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1342:7663', {
+  variant: { Size: 'M' },
+  example: () => <HubspotM />,
+});
+
+import HubspotL from '@semcore/ui/icon/color/Hubspot/l';
+figma.connect(HubspotL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=1342:7663', {
+  variant: { Size: 'L' },
+  example: () => <HubspotL />,
+});
+
+import MatomoM from '@semcore/ui/icon/color/Matomo/m';
+figma.connect(MatomoM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:55', {
+  variant: { Size: 'M' },
+  example: () => <MatomoM />,
+});
+
+import MatomoL from '@semcore/ui/icon/color/Matomo/l';
+figma.connect(MatomoL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:55', {
+  variant: { Size: 'L' },
+  example: () => <MatomoL />,
+});
+
+import PerplexityColoredM from '@semcore/ui/icon/color/PerplexityColored/m';
+figma.connect(PerplexityColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9256:28', {
+  variant: { Size: 'M' },
+  example: () => <PerplexityColoredM />,
+});
+
+import PerplexityColoredL from '@semcore/ui/icon/color/PerplexityColored/l';
+figma.connect(PerplexityColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9256:28', {
+  variant: { Size: 'L' },
+  example: () => <PerplexityColoredL />,
+});
+
+import MicrosoftOutlookM from '@semcore/ui/icon/color/MicrosoftOutlook/m';
+figma.connect(MicrosoftOutlookM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:41', {
+  variant: { Size: 'M' },
+  example: () => <MicrosoftOutlookM />,
+});
+
+import MicrosoftOutlookL from '@semcore/ui/icon/color/MicrosoftOutlook/l';
+figma.connect(MicrosoftOutlookL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:41', {
+  variant: { Size: 'L' },
+  example: () => <MicrosoftOutlookL />,
+});
+
+import ConfluenceM from '@semcore/ui/icon/color/Confluence/m';
+figma.connect(ConfluenceM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3420:4', {
+  variant: { Size: 'M' },
+  example: () => <ConfluenceM />,
+});
+
+import ConfluenceL from '@semcore/ui/icon/color/Confluence/l';
+figma.connect(ConfluenceL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3420:4', {
+  variant: { Size: 'L' },
+  example: () => <ConfluenceL />,
+});
+
+import GitHubInvertM from '@semcore/ui/icon/color/GitHubInvert/m';
+figma.connect(GitHubInvertM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3613:64', {
+  variant: { Size: 'M' },
+  example: () => <GitHubInvertM />,
+});
+
+import GitHubInvertL from '@semcore/ui/icon/color/GitHubInvert/l';
+figma.connect(GitHubInvertL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3613:64', {
+  variant: { Size: 'L' },
+  example: () => <GitHubInvertL />,
+});
+
+import SnapchatM from '@semcore/ui/icon/color/Snapchat/m';
+figma.connect(SnapchatM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6546:2', {
+  variant: { Size: 'M' },
+  example: () => <SnapchatM />,
+});
+
+import SnapchatL from '@semcore/ui/icon/color/Snapchat/l';
+figma.connect(SnapchatL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6546:2', {
+  variant: { Size: 'L' },
+  example: () => <SnapchatL />,
+});
+
+import GoogleSheetsM from '@semcore/ui/icon/color/GoogleSheets/m';
+figma.connect(GoogleSheetsM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4058:26', {
+  variant: { Size: 'M' },
+  example: () => <GoogleSheetsM />,
+});
+
+import GoogleSheetsL from '@semcore/ui/icon/color/GoogleSheets/l';
+figma.connect(GoogleSheetsL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4058:26', {
+  variant: { Size: 'L' },
+  example: () => <GoogleSheetsL />,
+});
+
+import WooCommerceColoredM from '@semcore/ui/icon/color/WooCommerceColored/m';
+figma.connect(WooCommerceColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6783:87', {
+  variant: { Size: 'M' },
+  example: () => <WooCommerceColoredM />,
+});
+
+import WooCommerceColoredL from '@semcore/ui/icon/color/WooCommerceColored/l';
+figma.connect(WooCommerceColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6783:87', {
+  variant: { Size: 'L' },
+  example: () => <WooCommerceColoredL />,
+});
+
+import MicrosoftExchangeM from '@semcore/ui/icon/color/MicrosoftExchange/m';
+figma.connect(MicrosoftExchangeM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:35', {
+  variant: { Size: 'M' },
+  example: () => <MicrosoftExchangeM />,
+});
+
+import MicrosoftExchangeL from '@semcore/ui/icon/color/MicrosoftExchange/l';
+figma.connect(MicrosoftExchangeL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:35', {
+  variant: { Size: 'L' },
+  example: () => <MicrosoftExchangeL />,
+});
+
+import YoutubeColoredM from '@semcore/ui/icon/color/YoutubeColored/m';
+figma.connect(YoutubeColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:269', {
+  variant: { Size: 'M' },
+  example: () => <YoutubeColoredM />,
+});
+
+import YoutubeColoredL from '@semcore/ui/icon/color/YoutubeColored/l';
+figma.connect(YoutubeColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:269', {
+  variant: { Size: 'L' },
+  example: () => <YoutubeColoredL />,
+});
+
+import SimplifyTextM from '@semcore/ui/icon/SimplifyText/m';
+figma.connect(SimplifyTextM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2845:9', {
+  variant: { Size: 'M' },
+  example: () => <SimplifyTextM />,
+});
+
+import SimplifyTextL from '@semcore/ui/icon/SimplifyText/l';
+figma.connect(SimplifyTextL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=2845:9', {
+  variant: { Size: 'L' },
+  example: () => <SimplifyTextL />,
+});
+
+import GoogleGenerativeAIColoredM from '@semcore/ui/icon/color/GoogleGenerativeAIColored/m';
+figma.connect(GoogleGenerativeAIColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9256:14', {
+  variant: { Size: 'M' },
+  example: () => <GoogleGenerativeAIColoredM />,
+});
+
+import GoogleGenerativeAIColoredL from '@semcore/ui/icon/color/GoogleGenerativeAIColored/l';
+figma.connect(GoogleGenerativeAIColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9256:14', {
+  variant: { Size: 'L' },
+  example: () => <GoogleGenerativeAIColoredL />,
+});
+
+import GoogleColorM from '@semcore/ui/icon/color/GoogleColor/m';
+figma.connect(GoogleColorM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:17', {
+  variant: { Size: 'M' },
+  example: () => <GoogleColorM />,
+});
+
+import GoogleColorL from '@semcore/ui/icon/color/GoogleColor/l';
+figma.connect(GoogleColorL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:17', {
+  variant: { Size: 'L' },
+  example: () => <GoogleColorL />,
+});
+
+import LinkedInColoredM from '@semcore/ui/icon/color/LinkedInColored/m';
+figma.connect(LinkedInColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:68', {
+  variant: { Size: 'M' },
+  example: () => <LinkedInColoredM />,
+});
+
+import LinkedInColoredL from '@semcore/ui/icon/color/LinkedInColored/l';
+figma.connect(LinkedInColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:68', {
+  variant: { Size: 'L' },
+  example: () => <LinkedInColoredL />,
+});
+
+import JavaScriptM from '@semcore/ui/icon/color/JavaScript/m';
+figma.connect(JavaScriptM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3365:4', {
+  variant: { Size: 'M' },
+  example: () => <JavaScriptM />,
+});
+
+import JavaScriptL from '@semcore/ui/icon/color/JavaScript/l';
+figma.connect(JavaScriptL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=3365:4', {
+  variant: { Size: 'L' },
+  example: () => <JavaScriptL />,
+});
+
+import WhatsAppM from '@semcore/ui/icon/color/WhatsApp/m';
+figma.connect(WhatsAppM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:45', {
+  variant: { Size: 'M' },
+  example: () => <WhatsAppM />,
+});
+
+import WhatsAppL from '@semcore/ui/icon/color/WhatsApp/l';
+figma.connect(WhatsAppL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:45', {
+  variant: { Size: 'L' },
+  example: () => <WhatsAppL />,
+});
+
+import CallRailColoredM from '@semcore/ui/icon/color/CallRailColored/m';
+figma.connect(CallRailColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6489:179', {
+  variant: { Size: 'M' },
+  example: () => <CallRailColoredM />,
+});
+
+import CallRailColoredL from '@semcore/ui/icon/color/CallRailColored/l';
+figma.connect(CallRailColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6489:179', {
+  variant: { Size: 'L' },
+  example: () => <CallRailColoredL />,
+});
+
+import YahooM from '@semcore/ui/icon/color/Yahoo/m';
+figma.connect(YahooM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:266', {
+  variant: { Size: 'M' },
+  example: () => <YahooM />,
+});
+
+import YahooL from '@semcore/ui/icon/color/Yahoo/l';
+figma.connect(YahooL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:266', {
+  variant: { Size: 'L' },
+  example: () => <YahooL />,
+});
+
+import InstagramColoredM from '@semcore/ui/icon/color/InstagramColored/m';
+figma.connect(InstagramColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6783:18', {
+  variant: { Size: 'M' },
+  example: () => <InstagramColoredM />,
+});
+
+import InstagramColoredL from '@semcore/ui/icon/color/InstagramColored/l';
+figma.connect(InstagramColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6783:18', {
+  variant: { Size: 'L' },
+  example: () => <InstagramColoredL />,
+});
+
+import AmazonM from '@semcore/ui/icon/color/Amazon/m';
+figma.connect(AmazonM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:32', {
+  variant: { Size: 'M' },
+  example: () => <AmazonM />,
+});
+
+import AmazonL from '@semcore/ui/icon/color/Amazon/l';
+figma.connect(AmazonL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6485:32', {
+  variant: { Size: 'L' },
+  example: () => <AmazonL />,
+});
+
+import GoogleAnalytics4M from '@semcore/ui/icon/color/GoogleAnalytics4/m';
+figma.connect(GoogleAnalytics4M, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:14', {
+  variant: { Size: 'M' },
+  example: () => <GoogleAnalytics4M />,
+});
+
+import GoogleAnalytics4L from '@semcore/ui/icon/color/GoogleAnalytics4/l';
+figma.connect(GoogleAnalytics4L, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=622:14', {
+  variant: { Size: 'L' },
+  example: () => <GoogleAnalytics4L />,
+});
+
+import PipedriveColoredM from '@semcore/ui/icon/color/PipedriveColored/m';
+figma.connect(PipedriveColoredM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:245', {
+  variant: { Size: 'M' },
+  example: () => <PipedriveColoredM />,
+});
+
+import PipedriveColoredL from '@semcore/ui/icon/color/PipedriveColored/l';
+figma.connect(PipedriveColoredL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=6785:245', {
+  variant: { Size: 'L' },
+  example: () => <PipedriveColoredL />,
+});
+
+import GoogleBusinessProfileM from '@semcore/ui/icon/GoogleBusinessProfile/m';
+figma.connect(GoogleBusinessProfileM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=832:27', {
+  variant: { Size: 'M' },
+  example: () => <GoogleBusinessProfileM />,
+});
+
+import GoogleBusinessProfileL from '@semcore/ui/icon/GoogleBusinessProfile/l';
+figma.connect(GoogleBusinessProfileL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=832:27', {
+  variant: { Size: 'L' },
+  example: () => <GoogleBusinessProfileL />,
+});
+
+import SummaryAIM from '@semcore/ui/icon/SummaryAI/m';
+figma.connect(SummaryAIM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4777:14017', {
+  variant: { Size: 'M' },
+  example: () => <SummaryAIM />,
+});
+
+import SummaryAIL from '@semcore/ui/icon/SummaryAI/l';
+figma.connect(SummaryAIL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4777:14017', {
+  variant: { Size: 'L' },
+  example: () => <SummaryAIL />,
+});
+
+import ChatAIM from '@semcore/ui/icon/ChatAI/m';
+figma.connect(ChatAIM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4777:14016', {
+  variant: { Size: 'M' },
+  example: () => <ChatAIM />,
+});
+
+import ChatAIL from '@semcore/ui/icon/ChatAI/l';
+figma.connect(ChatAIL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4777:14016', {
+  variant: { Size: 'L' },
+  example: () => <ChatAIL />,
+});
+
+import PlugM from '@semcore/ui/icon/Plug/m';
+figma.connect(PlugM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4525:3', {
+  variant: { Size: 'M' },
+  example: () => <PlugM />,
+});
+
+import PlugL from '@semcore/ui/icon/Plug/l';
+figma.connect(PlugL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4525:3', {
+  variant: { Size: 'L' },
+  example: () => <PlugL />,
+});
+
+import PhoneM from '@semcore/ui/icon/Phone/m';
+figma.connect(PhoneM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4449:17', {
+  variant: { Size: 'M' },
+  example: () => <PhoneM />,
+});
+
+import PhoneL from '@semcore/ui/icon/Phone/l';
+figma.connect(PhoneL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4449:17', {
+  variant: { Size: 'L' },
+  example: () => <PhoneL />,
+});
+
+import ChatAltM from '@semcore/ui/icon/ChatAlt/m';
+figma.connect(ChatAltM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7871:5', {
+  variant: { Size: 'M' },
+  example: () => <ChatAltM />,
+});
+
+import ChatAltL from '@semcore/ui/icon/ChatAlt/l';
+figma.connect(ChatAltL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7871:5', {
+  variant: { Size: 'L' },
+  example: () => <ChatAltL />,
+});
+
+import StoriesAIM from '@semcore/ui/icon/StoriesAI/m';
+figma.connect(StoriesAIM, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4777:14018', {
+  variant: { Size: 'M' },
+  example: () => <StoriesAIM />,
+});
+
+import StoriesAIL from '@semcore/ui/icon/StoriesAI/l';
+figma.connect(StoriesAIL, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=4777:14018', {
+  variant: { Size: 'L' },
+  example: () => <StoriesAIL />,
+});
+
+import AISEOToolkit from '@semcore/ui/icon/platform/AISEOToolkit';
+figma.connect(AISEOToolkit, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=9122:13');
+
+import ContentToolkit from '@semcore/ui/icon/platform/ContentToolkit';
+figma.connect(ContentToolkit, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7779:174');
+
+import HomePlatform from '@semcore/ui/icon/platform/HomePlatform';
+figma.connect(HomePlatform, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7779:157');
+
+import LocalToolkit from '@semcore/ui/icon/platform/LocalToolkit';
+figma.connect(LocalToolkit, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7779:164');
+
+import PRToolkit from '@semcore/ui/icon/platform/PRToolkit';
+figma.connect(PRToolkit, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8465:7');
+
+import SocialToolkit from '@semcore/ui/icon/platform/SocialToolkit';
+figma.connect(SocialToolkit, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7779:166');
+
+import TrafficMarketToolkit from '@semcore/ui/icon/platform/TrafficMarketToolkit';
+figma.connect(TrafficMarketToolkit, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7779:162');
+
+import AppCenter from '@semcore/ui/icon/platform/AppCenter';
+figma.connect(AppCenter, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7779:172');
+
+import EnterpriseSolutions from '@semcore/ui/icon/platform/EnterpriseSolutions';
+figma.connect(EnterpriseSolutions, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8277:8');
+
+import AdsToolkit from '@semcore/ui/icon/platform/AdsToolkit';
+figma.connect(AdsToolkit, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7779:168');
+
+import SEOToolkit from '@semcore/ui/icon/platform/SEOToolkit';
+figma.connect(SEOToolkit, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7779:159');
+
+import AIToolkit from '@semcore/ui/icon/platform/AIToolkit';
+figma.connect(AIToolkit, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=8151:15');
+
+import ReportsToolkit from '@semcore/ui/icon/platform/ReportsToolkit';
+figma.connect(ReportsToolkit, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=7779:170');
diff --git a/figma/mappings/core-components/Accordion.figma.jsx b/figma/mappings/core-components/Accordion.figma.jsx
new file mode 100644
index 0000000000..f4ca0ce98a
--- /dev/null
+++ b/figma/mappings/core-components/Accordion.figma.jsx
@@ -0,0 +1,68 @@
+import figma from '@figma/code-connect';
+import Accordion from '@semcore/ui/accordion';
+import { Box } from '@semcore/ui/base-components';
+
+figma.connect(
+  Accordion.Item.Toggle,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10085-55594&t=7CEXrbu9XEfMUFlr-11', {
+    props: {
+      use: figma.enum('use', {
+        primary: 'primary',
+        secondary: 'secondary',
+      }),
+
+    },
+    example: () => (
+      <Accordion.Item.Toggle>
+        <Accordion.Item.ToggleButton>
+          <Accordion.Item.Chevron mr={2} />
+          {/* Add text */}
+        </Accordion.Item.ToggleButton>
+      </Accordion.Item.Toggle>
+    ),
+  });
+
+figma.connect(
+  Accordion.Item.Collapse,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=13079-111795&t=7CEXrbu9XEfMUFlr-11', {
+
+    example: () => (
+      <Accordion.Item.Collapse>
+        <Box p='/* Set paddings */'>{/* Add text */}</Box>
+      </Accordion.Item.Collapse>
+    ),
+  });
+
+figma.connect(
+  Accordion.Item,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=13079-111805&t=7CEXrbu9XEfMUFlr-11', {
+    props: {
+      toggle: figma.children('Accordion.Item.Toggle'),
+      collapse: figma.children('Accordion.Item.Collapse'),
+    },
+    example: ({ toggle, collapse }) => (
+      <Accordion.Item>
+        {collapse}
+        {toggle}
+      </Accordion.Item>
+    ),
+  });
+
+figma.connect(
+  Accordion,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=13079-111971&t=7CEXrbu9XEfMUFlr-11', {
+    props: {
+      children: figma.children('Accordion.Item'),
+      use: figma.nestedProps('Accordion.Item.Toggle', {
+        use: figma.enum('use', {
+          primary: 'primary',
+          secondary: 'secondary',
+        }),
+      }),
+    },
+    example: ({ children, use }) => (
+      <Accordion use={use.use}>
+        {children}
+      </Accordion>
+    ),
+  });
diff --git a/figma/mappings/core-components/Addon.figma.ts b/figma/mappings/core-components/Addon.figma.ts
new file mode 100644
index 0000000000..60eddebe22
--- /dev/null
+++ b/figma/mappings/core-components/Addon.figma.ts
@@ -0,0 +1,8 @@
+import { connect } from '../../src/connect';
+import type { ConnectSettings } from '../../src/connect';
+
+export const settings: ConnectSettings = {
+  example: connect.childrenCode(),
+  id: 'Addon',
+  url: 'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=52416-8095',
+};
diff --git a/figma/mappings/core-components/Badge.figma.jsx b/figma/mappings/core-components/Badge.figma.jsx
new file mode 100644
index 0000000000..43037f66b3
--- /dev/null
+++ b/figma/mappings/core-components/Badge.figma.jsx
@@ -0,0 +1,24 @@
+import figma from '@figma/code-connect/react';
+import Badge from '@semcore/ui/badge';
+
+figma.connect(
+  Badge,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/%E2%9D%96-Core-Components-(Refactoring)?node-id=10059-44175&t=hkjybGSILqRb6bQU-4',
+  {
+    props: {
+      label: figma.textContent('↳ text'),
+      bg: figma.enum('type', {
+        '🔵 admin': figma.boolean('invert', { false: 'blue-400', true: 'white' }),
+        '🔴 alpha': figma.boolean('invert', { false: 'red-400', true: 'white' }),
+        '🟠 beta': figma.boolean('invert', { false: 'orange-400', true: 'white' }),
+        '🟢 new': figma.boolean('invert', { false: 'green-400', true: 'white' }),
+        '🟣 for you': figma.boolean('invert', { false: 'violet-400', true: 'white' }),
+        '⚫️ soon': figma.boolean('invert', { false: 'gray-400', true: 'white' }),
+      }),
+      color: figma.boolean('invert', {
+        true: 'text-primary',
+      }),
+    },
+    example: (props) => <Badge {...props}>{props.label}</Badge>,
+  },
+);
diff --git a/figma/mappings/core-components/BaseTrigger.figma.jsx b/figma/mappings/core-components/BaseTrigger.figma.jsx
new file mode 100644
index 0000000000..ba492d6236
--- /dev/null
+++ b/figma/mappings/core-components/BaseTrigger.figma.jsx
@@ -0,0 +1,129 @@
+import figma from '@figma/code-connect';
+import { LinkTrigger } from '@semcore/ui/base-trigger';
+import Select from '@semcore/ui/select';
+
+figma.connect(
+  LinkTrigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10733-114376&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { '← addon': 'false', 'addon →': 'false', 'icon only': 'false' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      placeholder: figma.textContent('↳ text'),
+      state: figma.enum('state', {
+        active: 'active',
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      loading: figma.enum('state', {
+        loading: true,
+      }),
+    },
+    example: (props) => <Select tag={LinkTrigger} options={/* options */} {...props} />,
+  },
+);
+
+figma.connect(
+  LinkTrigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10733-114376&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { 'icon only': 'false' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      addonLeft: figma.enum('icon only', {
+        false: figma.boolean('← addon', {
+          true: <Select.Trigger.Addon>{/* addon */}</Select.Trigger.Addon>,
+        }),
+      }),
+      addonRight: figma.enum('icon only', {
+        false: figma.boolean('addon →', {
+          true: <Select.Trigger.Addon>{/* addon */}</Select.Trigger.Addon>,
+        }),
+      }),
+
+      content: figma.enum('icon only', {
+        false: figma.boolean('← addon', {
+          true: <Select.Trigger.Text>{/* text */}</Select.Trigger.Text>,
+          false: figma.boolean('addon →', {
+            true: <Select.Trigger.Text>{/* text */}</Select.Trigger.Text>,
+            false: '{/* text */}',
+          }),
+        }),
+      }),
+      text: figma.textContent('↳ text'),
+      state: figma.enum('state', {
+        active: 'active',
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      loading: figma.enum('state', {
+        loading: true,
+      }),
+    },
+    example: ({ size, addonLeft, addonRight, content, state, loading, disabled }) => {
+      <Select tag={LinkTrigger} options={/* options */} size={size} state={state} loading={loading} disabled={disabled}>
+        <Select.Trigger>
+          {addonLeft}
+          {content}
+          {addonRight}
+        </Select.Trigger>
+        <Select.Menu hMax={/* value */}>
+          <Select.Option key={/* value */} value={/* value */}>
+            {/* option */}
+          </Select.Option>
+        </Select.Menu>
+      </Select>;
+    },
+  },
+);
+
+figma.connect(
+  LinkTrigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10733-114376&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { 'icon only': 'true' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      addonLeft: figma.children('← - - addon properties'),
+      state: figma.enum('state', {
+        active: 'active',
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      loading: figma.enum('state', {
+        loading: true,
+      }),
+      title: figma.textContent('↳ title'),
+    },
+    example: ({ size, addonLeft, state, loading, disabled, title }) => (
+      <Select tag={LinkTrigger} options={/* options */} size={size} state={state} loading={loading} disabled={disabled} aria-label={title}>
+        <Select.Trigger>
+          <Select.Trigger.Addon>{addonLeft}</Select.Trigger.Addon>
+        </Select.Trigger>
+        <Select.Menu hMax={/* value */}>
+          <Select.Option key={/* value */} value={/* value */}>
+            {/* option */}
+          </Select.Option>
+        </Select.Menu>
+      </Select>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Breadcrumbs.figma.ts b/figma/mappings/core-components/Breadcrumbs.figma.ts
new file mode 100644
index 0000000000..3e46c4c158
--- /dev/null
+++ b/figma/mappings/core-components/Breadcrumbs.figma.ts
@@ -0,0 +1,27 @@
+import { connect } from '../../src/connect';
+import type { ConnectSettings } from '../../src/connect';
+
+const first = connect.childCode('Home link', {
+  wrapper: 'Breadcrumbs.Item href="/"',
+});
+
+const second = connect.childCode('Toolkit link', {
+  wrapper: 'Breadcrumbs.Item href={/* url */}',
+});
+
+const third = connect.childCode('Product link', {
+  wrapper: 'Breadcrumbs.Item active',
+});
+
+const example = `
+<Breadcrumbs>
+  ${first}${second}${third}
+</Breadcrumbs>
+`;
+
+export const settings: ConnectSettings = {
+  example,
+  id: 'Breadcrumbs',
+  url: 'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11878-115146',
+  imports: ['import Breadcrumbs from "@semcore/ui/breadcrumbs"'],
+};
diff --git a/figma/mappings/core-components/BulkTextarea.figma.jsx b/figma/mappings/core-components/BulkTextarea.figma.jsx
new file mode 100644
index 0000000000..58dc88d123
--- /dev/null
+++ b/figma/mappings/core-components/BulkTextarea.figma.jsx
@@ -0,0 +1,50 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+import BulkTextarea from '@semcore/ui/bulk-textarea';
+import { Text } from '@semcore/ui/typography';
+
+// add placeholder somehow, for now Figma Code Connect doesn't see placeholder
+
+figma.connect(
+  BulkTextarea,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=48599-7546&t=tjfdRa8KRbX0lwpz-11',
+  {
+    props: {
+      // placeholder: figma.textContent('↳ text'),
+      label: figma.textContent('↳ label'),
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      state: figma.enum('state', {
+        normal: 'normal',
+        invalid: 'invalid',
+      }),
+      readonly: figma.enum('state', {
+        'read-only': true,
+      }),
+    },
+
+    example: ({ size, readonly, label }) => (
+      <BulkTextarea
+        size={size}
+        readonly={readonly}
+        placeholder='/* Add your placeholder */'
+      >
+        <Flex alignItems='center' justifyContent='flex-start' mb={2} gap={1}>
+          <Text tag='label' size={/* font size */}>
+            {label}
+          </Text>
+          <BulkTextarea.Counter />
+        </Flex>
+        <BulkTextarea.InputField
+          commonErrorMessage={/* Add error message */}
+        />
+        <Flex alignItems='center' justifyContent='space-between' mt={2}>
+          <BulkTextarea.ErrorsNavigation />
+          <BulkTextarea.ClearAll />
+        </Flex>
+      </BulkTextarea>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Button.figma.jsx b/figma/mappings/core-components/Button.figma.jsx
new file mode 100644
index 0000000000..4ffb86e679
--- /dev/null
+++ b/figma/mappings/core-components/Button.figma.jsx
@@ -0,0 +1,138 @@
+import figma from '@figma/code-connect/react';
+import Button from '@semcore/ui/button';
+import { Text } from '@semcore/ui/typography';
+
+// Need to add a variant for cases when dot is enabled
+
+figma.connect(
+  Button,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10043-43724&t=nVbIFrY5EvgteOqk-11',
+  {
+    variant: { 'icon only': 'false' },
+    props: {
+      size: figma.enum('size', {
+        L: 'l',
+        M: 'm',
+      }),
+      use: figma.enum('use', {
+        primary: 'primary',
+        secondary: 'secondary',
+        tertiary: 'tertiary',
+      }),
+      theme: figma.enum('theme', {
+        '🔵 info': 'info',
+        '🟢 success': 'success',
+        '🔴 danger': 'danger',
+        '⚫️ muted': 'muted',
+        '⚪️ invert': 'invert',
+      }),
+      active: figma.enum('state', {
+        active: true,
+      }),
+      loading: figma.enum('state', {
+        loading: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+
+      // Cannot be used with the current structure.
+      // These mappings show instances and text content, but they are not working with conditional rendering for now. So I'm leaving them for possible future updates from Code Connect.
+      // label: figma.textContent('↳ text'),
+      // labelAddon: figma.textContent('↳ textAddon'),
+
+      // addonLeft: figma.boolean('← addon', {
+      //   true: figma.instance('← - - - addon'),
+      //   false: undefined,
+      // }),
+
+      // addonRight: figma.boolean('addon →', {
+      //   true: figma.instance('addon properties - - →'),
+      //   false: undefined,
+      // }),
+
+      // addonLeft: figma.boolean('← addon', {
+      //   true: <Button.Addon>{/* addon */}</Button.Addon>,
+      // }),
+
+      // addonRight: figma.boolean('addon →', {
+      //   true: <Button.Addon>{/* addon */}</Button.Addon>,
+      // }),
+
+      addonLeft: figma.enum('icon only', {
+        false: figma.boolean('← addon', {
+          true: <Button.Addon>{/* addon */}</Button.Addon>,
+        }),
+      }),
+      addonRight: figma.enum('icon only', {
+        false: figma.boolean('addon →', {
+          true: <Button.Addon>{/* addon */}</Button.Addon>,
+        }),
+      }),
+
+      content: figma.enum('icon only', {
+        false: figma.boolean('← addon', {
+          true: <Button.Text>{/* button label */}</Button.Text>,
+          false: figma.boolean('addon →', {
+            true: <Button.Text>{/* button label */}</Button.Text>,
+            false: '{/* button label */}',
+          }),
+        }),
+      }),
+
+      // For now, textAddon shows placeholder. Need to figure out how to show value from labelAddon here, and how to expand the component.
+      textAddon: figma.boolean('textAddon →', {
+        true: <Button.Addon><Text color='/* text-color-token */'>{/* text addon */}</Text></Button.Addon>,
+      }),
+    },
+
+    example: ({ size, use, theme, disabled, active, loading, addonLeft, content, textAddon, addonRight }) => (
+      <Button
+        size={size}
+        use={use}
+        theme={theme}
+        disabled={disabled}
+        active={active}
+        loading={loading}
+      >
+        {addonLeft}
+        {content}
+        {textAddon}
+        {addonRight}
+      </Button>
+    ),
+  },
+);
+
+figma.connect(Button, 'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10043-43724&t=nVbIFrY5EvgteOqk-11', {
+  variant: { 'icon only': 'true' },
+  props: {
+    size: figma.enum('size', {
+      L: 'l',
+    }),
+    use: figma.enum('use', {
+      primary: 'primary',
+      tertiary: 'tertiary',
+    }),
+    theme: figma.enum('theme', {
+      '🔵 info': 'info',
+      '�� success': 'success',
+      '🔴 danger': 'danger',
+      '⚫️ muted': 'muted',
+      '⚪️ invert': 'invert',
+    }),
+    active: figma.enum('state', {
+      active: true,
+    }),
+    loading: figma.enum('state', {
+      loading: true,
+    }),
+    disabled: figma.enum('state', {
+      disabled: true,
+    }),
+    title: figma.textContent('↳ title'),
+  },
+  example: (props) => (
+    <Button {...props} addonLeft={/* icon name */} />
+  ),
+});
diff --git a/figma/mappings/core-components/ButtonLink.figma.ts b/figma/mappings/core-components/ButtonLink.figma.ts
new file mode 100644
index 0000000000..1de3fc781b
--- /dev/null
+++ b/figma/mappings/core-components/ButtonLink.figma.ts
@@ -0,0 +1,39 @@
+import { connect } from '../../src/connect';
+import type { ConnectSettings } from '../../src/connect';
+
+const addonLeft = connect.childCode('← - - addon properties', { wrapper: 'ButtonLink.Addon' });
+const addonRight = connect.childCode('addon properties - - →', { wrapper: 'ButtonLink.Addon' });
+
+const wrapper = addonLeft || addonRight
+  ? 'ButtonLink.Text'
+  : undefined;
+const text = connect.childCode('↳ text', { wrapper });
+
+const ariaLabel = text
+  ? undefined
+  : connect.formatProp('aria-label', connect.childCode('↳ title') ?? '/* short description */');
+
+const active = connect.getProp('state', 'active');
+const disabled = connect.getProp('state', 'disabled');
+const use = connect.getProp('use');
+
+const example = `
+<ButtonLink
+  ${ariaLabel}
+  ${use}
+  size={/* fontSize */}
+  color={/* color-token */}
+  ${active}
+  ${disabled}
+>
+${addonLeft}
+${text}
+${addonRight}
+</ButtonLink>
+`;
+export const settings: ConnectSettings = {
+  example,
+  id: 'ButtonLink',
+  url: 'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=45638-2735',
+  imports: ['import { ButtonLink } from "@semcore/ui/button"'],
+};
diff --git a/figma/mappings/core-components/Card.figma.template.js b/figma/mappings/core-components/Card.figma.template.js
new file mode 100644
index 0000000000..35d1a547b1
--- /dev/null
+++ b/figma/mappings/core-components/Card.figma.template.js
@@ -0,0 +1,26 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10257-114780
+// import Card from '@semcore/ui/card'
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const header = instance.findConnectedInstance('Card.Header');
+const headerCode = header.type === 'INSTANCE' ? header.executeTemplate().example : undefined;
+
+const layout = instance.getPropertyValue('layout');
+
+let content = '{/* content */}';
+if (layout === 'two sections') {
+  content = `<Flex gap={5}>${content}</Flex>`;
+}
+
+export default {
+  example: figma.tsx`
+<Card>
+  ${headerCode}
+  <Card.Body tag={Flex} gap={5} direction='column'>
+    ${content}
+  </Card.Body>
+</Card>
+  `,
+  id: 'Card',
+};
diff --git a/figma/mappings/core-components/CardHeader.figma.template.js b/figma/mappings/core-components/CardHeader.figma.template.js
new file mode 100644
index 0000000000..7d2c9eb9a9
--- /dev/null
+++ b/figma/mappings/core-components/CardHeader.figma.template.js
@@ -0,0 +1,57 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11793-136767
+// import Card from '@semcore/ui/card'
+// import { Flex } from '@semcore/ui/base-components'
+// import { Text } from '@semcore/ui/typography'
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+let titleCode;
+
+if (instance.getBoolean('title: text')) {
+  const titleText = instance.findText('title').textContent;
+  const titleText2 = instance.findText('title second line').textContent;
+  const hint = instance.getBoolean('title: informer', { true: 'hintAfter={/* tooltip text */}' });
+  const hintAria = instance.getBoolean('title: informer', { true: `hintAfterAriaLabel='About ${titleText}'` });
+  const num = instance.getBoolean('title: number', {
+    true: `<Text size={300} fontWeight={400} use='secondary' ml={1}>${instance.findText('num').textContent}</Text>`,
+  });
+
+  titleCode = figma.tsx`<Card.Title tag='h3' ${hint} ${hintAria}>
+  ${titleText} ${titleText2}
+  ${num}
+  </Card.Title>`;
+}
+
+const pillsCode = instance.getBoolean('title: pills', {
+  true: instance.findInstance('TitleControl').executeTemplate().example,
+});
+
+const rightControlsCode = instance.getBoolean('controls ->', {
+  true: '<Card.Description ml="auto">{/* right controls */}</Card.Description>',
+});
+
+const bottomControlsCode = instance.getBoolean('description ↓', {
+  true: '<Card.Description>{/* bottom controls */}</Card.Description>',
+});
+
+const needsFlex = !!titleCode + !!pillsCode + !!rightControlsCode > 1;
+
+const headerCode = bottomControlsCode
+  ? figma.tsx`<Card.Header tag={Flex} direction="column">
+  ${needsFlex ? '<Flex gap={2}>' : undefined}
+  ${titleCode}
+  ${pillsCode}
+  ${rightControlsCode}
+  ${needsFlex ? '</Flex>' : undefined}
+  ${bottomControlsCode}
+  </Card.Header>`
+  : figma.tsx`<Card.Header${needsFlex ? ' tag={Flex} gap={2}' : undefined}>
+  ${titleCode}
+  ${pillsCode}
+  ${rightControlsCode}
+</Card.Header>`;
+
+export default {
+  example: headerCode,
+  id: 'Card.Header',
+};
diff --git a/figma/mappings/core-components/CardSplit.figma.template.js b/figma/mappings/core-components/CardSplit.figma.template.js
new file mode 100644
index 0000000000..ed2e4b44fd
--- /dev/null
+++ b/figma/mappings/core-components/CardSplit.figma.template.js
@@ -0,0 +1,16 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=13578-112637
+const figma = require('figma');
+const children = figma.selectedInstance.findLayers(() => true);
+
+let code;
+
+children.forEach((child) => code = figma.tsx`${code}${child.executeTemplate().example}`);
+
+export default {
+  example: figma.tsx`
+<Flex>
+  ${code}
+</Flex>
+  `,
+  id: 'Card (split)',
+};
diff --git a/figma/mappings/core-components/CardTable.figma.template.js b/figma/mappings/core-components/CardTable.figma.template.js
new file mode 100644
index 0000000000..10ed3d8fdd
--- /dev/null
+++ b/figma/mappings/core-components/CardTable.figma.template.js
@@ -0,0 +1,30 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=55480-2824
+// import Card from '@semcore/ui/card'
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const header = instance.findConnectedInstance('Card.Header');
+const headerCode = header.type === 'INSTANCE' ? header.executeTemplate().example : undefined;
+
+const topControls = instance.getBoolean('top controls');
+const bottomControls = instance.getBoolean('bottom controls');
+
+let paddings = '';
+
+if (!topControls)
+  paddings += ' pt={0}';
+
+if (!bottomControls)
+  paddings += ' pb={1}';
+
+export default {
+  example: figma.tsx`
+<Card>
+  ${headerCode}
+  <Card.Body tag={Flex} gap={5} direction='column' px={0} ${paddings}>
+    {/* content */}
+  </Card.Body>
+</Card>
+  `,
+  id: 'Card',
+};
diff --git a/figma/mappings/core-components/Carousel.figma.jsx b/figma/mappings/core-components/Carousel.figma.jsx
new file mode 100644
index 0000000000..2dad79f639
--- /dev/null
+++ b/figma/mappings/core-components/Carousel.figma.jsx
@@ -0,0 +1,56 @@
+import figma from '@figma/code-connect/react';
+import Carousel from '@semcore/ui/carousel';
+import { Flex } from '@semcore/ui/flex-box';
+
+figma.connect(
+  Carousel,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-292306&t=7CEXrbu9XEfMUFlr-11',
+  {
+    variant: { 'screen width': '>480px' },
+    props: {
+      zoom: figma.boolean('zoom'),
+      indicators: figma.enum('indicators', {
+        default: 'default',
+        hide: 'hide',
+        preview: 'preview',
+      }),
+    },
+
+    example: ({ zoom, indicators }) => (
+      <Carousel
+        w={/* Set width */}
+        aria-roledescription='carousel'
+        aria-label={/* Set aria-label for the Carousel */}
+        zoom={zoom}
+        zoomWidth={/* Set zoom width */}
+        indicators={indicators}
+      >
+        {/* Add items here */}
+      </Carousel>
+    ),
+  },
+);
+
+figma.connect(
+  Carousel,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-292306&t=7CEXrbu9XEfMUFlr-11',
+  {
+    variant: { 'screen width': '≤480px' },
+    props: {
+      zoom: figma.boolean('zoom'),
+    },
+
+    example: () => (
+      <Carousel>
+        <Carousel.Container>
+
+          {/* Add items here */}
+        </Carousel.Container>
+        <Flex gap={2}>
+          <Carousel.Prev />
+          <Carousel.Next />
+        </Flex>
+      </Carousel>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Checkbox.figma.jsx b/figma/mappings/core-components/Checkbox.figma.jsx
new file mode 100644
index 0000000000..8542f59d37
--- /dev/null
+++ b/figma/mappings/core-components/Checkbox.figma.jsx
@@ -0,0 +1,69 @@
+import figma from '@figma/code-connect';
+import Checkbox from '@semcore/ui/checkbox';
+
+// ??? Throws error: "Code Connect UI mapping already exists for this node" ???
+
+// figma.connect(
+//   Checkbox.Value,
+//   'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10063-46164&t=B1622uxt4mPTLZzH-11',
+//   {
+//     props: {
+//       size: figma.enum('size', {
+//         L: 'l',
+//         M: 'm',
+//       }),
+//       checked: figma.boolean('checked'),
+//       indeterminate: figma.boolean('indeterminate'),
+//       invalid: figma.enum('state', {
+//         invalid: true,
+//       }),
+//     },
+//     example: ({ size, checked, indeterminate, invalid }) => (
+//       <Checkbox.Value size={size} checked={checked} indeterminate={indeterminate} invalid={invalid} />
+//     ),
+//   },
+// );
+
+figma.connect(
+  Checkbox,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10063-46204&t=B1622uxt4mPTLZzH-11',
+  {
+    props: {
+      label: figma.textContent('↳ text'),
+      size: figma.enum('size', {
+        L: 'l',
+        M: 'm',
+      }),
+      checked: figma.boolean('checked'),
+      indeterminate: figma.boolean('indeterminate'),
+      invalid: figma.enum('state', {
+        invalid: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      addonLeft: figma.boolean('← addon', {
+        true: figma.children('← - - addon properties'),
+        false: undefined,
+      }),
+      addonRight: figma.boolean('addon →', {
+        true: figma.children('addon properties - - →'),
+        false: undefined,
+      }),
+      textAddon: figma.boolean('textAddon →'),
+    },
+    example: ({ label, size, checked, indeterminate, invalid, disabled, addonLeft, addonRight, textAddon }) => (
+      <Checkbox
+        label={label}
+        size={size}
+        checked={checked}
+        indeterminate={indeterminate}
+        invalid={invalid}
+        disabled={disabled}
+      // addonLeft={addonLeft}
+      // addonRight={addonRight}
+      // textAddon={textAddon}
+      />
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/CheckboxList.figma.jsx b/figma/mappings/core-components/CheckboxList.figma.jsx
new file mode 100644
index 0000000000..c7a8c999cf
--- /dev/null
+++ b/figma/mappings/core-components/CheckboxList.figma.jsx
@@ -0,0 +1,45 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+import Checkbox from '@semcore/ui/checkbox';
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=19530-124198&',
+  {
+    props: {
+      size: figma.enum('size', {
+        L: 'l',
+        M: 'm',
+      }),
+    },
+    example: ({ size }) => (
+      <Flex direction='column' gap={3}>
+        <Checkbox size={size} />
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10142-174621&',
+  {
+    props: {
+      size: figma.enum('size', {
+        L: 'l',
+        M: 'm',
+      }),
+      label: figma.nestedProps('Checkbox', {
+        label: figma.textContent('↳ text'),
+      }),
+    },
+    example: ({ size, label }) => (
+      <Flex direction='column' gap={3}>
+        <Checkbox size={size} label={label.label} />
+        <Flex direction='column' gap={3} ml={6}>
+          <Checkbox size={size} label={label.label} />
+        </Flex>
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/ColorPicker.Popper.figma.ts b/figma/mappings/core-components/ColorPicker.Popper.figma.ts
new file mode 100644
index 0000000000..20531ddd73
--- /dev/null
+++ b/figma/mappings/core-components/ColorPicker.Popper.figma.ts
@@ -0,0 +1,27 @@
+import { connect } from '../../src/connect';
+import type { ConnectSettings } from '../../src/connect';
+
+const displayLabel = connect.children({ prop: 'text color', value: true }).length
+  ? 'displayLabel'
+  : undefined;
+
+const popperCode = connect.getBoolean('custom colors', {
+  true: `<ColorPicker.Popper>
+  <ColorPicker.Colors />
+  <PaletteManager />
+</ColorPicker.Popper>`,
+  false: '<ColorPicker.Popper />',
+});
+
+const example = `
+<ColorPicker ${displayLabel}>
+  <ColorPicker.Trigger />
+  ${popperCode}
+</ColorPicker>`;
+
+export const settings: ConnectSettings = {
+  example,
+  id: 'ColorPicker.Popper',
+  url: 'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-296347',
+  imports: ['import ColorPicker, { PaletteManager } from "@semcore/ui/color-picker"'],
+};
diff --git a/figma/mappings/core-components/ColorPicker.Trigger.figma.ts b/figma/mappings/core-components/ColorPicker.Trigger.figma.ts
new file mode 100644
index 0000000000..da08baed04
--- /dev/null
+++ b/figma/mappings/core-components/ColorPicker.Trigger.figma.ts
@@ -0,0 +1,15 @@
+import type { ConnectSettings } from '../../src/connect';
+
+const example = `<ColorPicker>
+  <ColorPicker.Trigger />
+  <ColorPicker.Popper>
+  {/* ColorPicker.Popper content */}
+  </ColorPicker.Popper>
+</ColorPicker>`;
+
+export const settings: ConnectSettings = {
+  example,
+  id: 'ColorPicker.Trigger',
+  url: 'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-294977',
+  imports: ['import ColorPicker from "@semcore/ui/color-picker"'],
+};
diff --git a/figma/mappings/core-components/Counter.figma.jsx b/figma/mappings/core-components/Counter.figma.jsx
new file mode 100644
index 0000000000..2cfb47a7a5
--- /dev/null
+++ b/figma/mappings/core-components/Counter.figma.jsx
@@ -0,0 +1,42 @@
+import figma from '@figma/code-connect';
+import Counter from '@semcore/ui/counter';
+
+figma.connect(
+  Counter,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10121-56141&t=Fgs2Jv2CPgCOdctF-11',
+  {
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+        XL: 'xl',
+      }),
+      theme: figma.enum('theme', {
+        default: 'default',
+        info: 'info',
+        warning: 'warning',
+        danger: 'danger',
+        white: 'white',
+      }),
+      value: figma.textContent('↳ value'),
+    },
+    example: ({ size, theme, value }) => <Counter size={size} theme={theme}>{value}</Counter>,
+  },
+);
+
+// figma.connect(
+//   Counter,
+//   'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10121-56141&t=Fgs2Jv2CPgCOdctF-11',
+//   {
+//     variant: { theme: 'custom' },
+//     props: {
+//       size: figma.enum('size', {
+//         M: 'm',
+//         L: 'l',
+//         XL: 'xl',
+//       }),
+//       value: figma.textContent('↳ value'),
+//     },
+//     example: ({ size, value }) => <Counter size={size} theme='bg-primary-neutral'>{value}</Counter>,
+//   },
+// );
diff --git a/figma/mappings/core-components/DescriptionTooltip.jsx b/figma/mappings/core-components/DescriptionTooltip.jsx
new file mode 100644
index 0000000000..44a482e8e8
--- /dev/null
+++ b/figma/mappings/core-components/DescriptionTooltip.jsx
@@ -0,0 +1,39 @@
+import figma from '@figma/code-connect';
+import { DescriptionTooltip } from '@semcore/ui/tooltip';
+
+figma.connect(
+  DescriptionTooltip,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=51966-59511&t=0hjqYEp7RXqjnbR7-11',
+  {
+    props: {
+      nested: figma.nestedProps('Tooltip', {
+        theme: figma.enum('theme', {
+          '⚪️ default': 'default',
+          '⚫️ invert': 'invert',
+          '🔴 warning': 'warning',
+        }),
+        content: figma.instance('content'),
+      }),
+      ariaLabel: figma.textContent('aria-label prop'),
+      placement: figma.enum('placement', {
+        top: 'top',
+        bottom: 'bottom',
+        left: 'left',
+        right: 'right',
+      }),
+    },
+    example: ({ nested, placement, ariaLabel }) => (
+      <DescriptionTooltip theme={nested.theme} placement={placement}>
+        <DescriptionTooltip.Trigger
+          addonLeft={InfoM}
+          aria-label={ariaLabel}
+          tag={ButtonLink}
+          {...addonProps}
+        />
+        <DescriptionTooltip.Popper>
+          {nested.content}
+        </DescriptionTooltip.Popper>
+      </DescriptionTooltip>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Divider.figma.jsx b/figma/mappings/core-components/Divider.figma.jsx
new file mode 100644
index 0000000000..d045075a9b
--- /dev/null
+++ b/figma/mappings/core-components/Divider.figma.jsx
@@ -0,0 +1,21 @@
+import figma from '@figma/code-connect/react';
+import Divider from '@semcore/ui/divider';
+
+figma.connect(
+  Divider,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=11947-115134',
+  {
+    props: {
+      use: figma.enum('use', {
+        secondary: 'secondary',
+      }),
+      theme: figma.enum('theme', {
+        invert: 'invert',
+      }),
+      orientation: figma.enum('orientation', {
+        vertical: 'vertical',
+      }),
+    },
+    example: (props) => <Divider {...props} />,
+  },
+);
diff --git a/figma/mappings/core-components/DnD.figma.jsx b/figma/mappings/core-components/DnD.figma.jsx
new file mode 100644
index 0000000000..a2964a4b45
--- /dev/null
+++ b/figma/mappings/core-components/DnD.figma.jsx
@@ -0,0 +1,43 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+import DnD from '@semcore/ui/drag-and-drop';
+import { MathPlusL } from '@semcore/ui/icon';
+import { Text } from '@semcore/ui/typography';
+
+figma.connect(
+  DnD,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-292261&t=7CEXrbu9XEfMUFlr-11',
+  {
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+    },
+    example: ({ title, text }) => (
+      <DnD aria-label={/* Add aria-label */}>
+        <DnD.DropZone
+          aria-label={/* Add aria-label */}
+          style={{
+            border: '1px dashed var(--intergalactic-border-primary',
+            borderRadius: 'var(--intergalactic-surface-rounded)',
+          }}
+        >
+          <Flex
+            alignItems='center'
+            gap={1}
+            justifyContent='center'
+          >
+            <Text color='text-secondary'>
+              <MathPlusL />
+            </Text>
+            <Text color='text-secondary' bold size={200}>
+              {title}
+            </Text>
+            <Text color='text-secondary' textAlign='center' size={200}>
+              {text}
+            </Text>
+          </Flex>
+        </DnD.DropZone>
+        {/* Add DnD.Draggable here */}
+      </DnD>
+    ),
+  });
diff --git a/figma/mappings/core-components/Dot.figma.jsx b/figma/mappings/core-components/Dot.figma.jsx
new file mode 100644
index 0000000000..22f2ac9833
--- /dev/null
+++ b/figma/mappings/core-components/Dot.figma.jsx
@@ -0,0 +1,20 @@
+import figma from '@figma/code-connect/react';
+import Dot from '@semcore/ui/dot';
+
+figma.connect(
+  Dot,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10129-56238&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      value: figma.boolean('value', {
+        true: figma.textContent('↳ value'),
+        false: undefined,
+      }),
+    },
+    example: ({ size, value }) => <Dot up aria-label='/* Add aria-label */' id='/* Add id for a control that should be described by the Dot*/' size={size} value={value} />,
+  },
+);
diff --git a/figma/mappings/core-components/Dropdown.figma.jsx b/figma/mappings/core-components/Dropdown.figma.jsx
new file mode 100644
index 0000000000..e20b913699
--- /dev/null
+++ b/figma/mappings/core-components/Dropdown.figma.jsx
@@ -0,0 +1,32 @@
+import figma from '@figma/code-connect';
+import Dropdown from '@semcore/ui/dropdown';
+import { Flex } from '@semcore/ui/flex-box';
+import { Text } from '@semcore/ui/typography';
+
+figma.connect(
+  Dropdown,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=55431-11754&t=7CEXrbu9XEfMUFlr-11',
+  {
+    props: {
+      actions: figma.children('Button'),
+      children: figma.children('*'),
+      title: figma.textContent('↳ title'),
+      content: figma.textContent('↳ text'),
+    },
+    example: ({ title, content, children, actions }) => (
+      <Dropdown>
+        <Dropdown.Trigger id='/* id */' tag={Button}>
+          {/* Trigger label */}
+        </Dropdown.Trigger>
+        <Dropdown.Popper p={4} wMax={260} aria-labelledby='/* id */'>
+          <Text size={300} bold mb={1}>{title}</Text>
+          <Text size={200}>{content}</Text>
+          <Flex gap={2} mt={4}>
+            {actions}
+          </Flex>
+          {children}
+        </Dropdown.Popper>
+      </Dropdown>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/DropdownMenu.Group.figma.jsx b/figma/mappings/core-components/DropdownMenu.Group.figma.jsx
new file mode 100644
index 0000000000..3a10e13126
--- /dev/null
+++ b/figma/mappings/core-components/DropdownMenu.Group.figma.jsx
@@ -0,0 +1,25 @@
+import figma from '@figma/code-connect';
+import DropdownMenu from '@semcore/ui/dropdown-menu';
+
+figma.connect(
+  DropdownMenu.Group,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47909-9527&t=7CEXrbu9XEfMUFlr-11',
+  {
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      title: figma.textContent('↳ title'),
+      subTitle: figma.boolean('subTitle', {
+        true: figma.textContent('↳ subTitle'),
+        false: undefined,
+      }),
+    },
+    example: ({ size, title, subTitle }) => (
+      <DropdownMenu.Group size={size} title={title} subTitle={subTitle}>
+        {/* items */}
+      </DropdownMenu.Group>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/DropdownMenu.Item.figma.jsx b/figma/mappings/core-components/DropdownMenu.Item.figma.jsx
new file mode 100644
index 0000000000..064bd2ffd4
--- /dev/null
+++ b/figma/mappings/core-components/DropdownMenu.Item.figma.jsx
@@ -0,0 +1,107 @@
+import figma from '@figma/code-connect';
+import DropdownMenu from '@semcore/ui/dropdown-menu';
+
+// TODO: Add addons
+// DropdownMenu.Item/Default without hint
+
+figma.connect(
+  DropdownMenu.Item,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47952-14382&t=7CEXrbu9XEfMUFlr-11',
+  {
+    variant: { hint: 'false' },
+    props: {
+      content: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+    },
+    example: ({ content, selected, disabled }) => (
+      <DropdownMenu.Item value={/* value */} selected={selected} disabled={disabled}>
+        {content}
+      </DropdownMenu.Item>
+    ),
+  },
+);
+
+// DropdownMenu.Item with hint
+
+figma.connect(
+  DropdownMenu.Item,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47952-14382&t=7CEXrbu9XEfMUFlr-11',
+  {
+    variant: { hint: 'true' },
+    props: {
+      content: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      hint: figma.textContent('↳ hint'),
+    },
+    example: ({ content, selected, disabled, hint }) => (
+      <DropdownMenu.Item value={/* value */} selected={selected} disabled={disabled}>
+        <DropdownMenu.Item.Content>
+          <DropdownMenu.Item.Text>{content}</DropdownMenu.Item.Text>
+        </DropdownMenu.Item.Content>
+        <DropdownMenu.Item.Hint>{hint}</DropdownMenu.Item.Hint>
+      </DropdownMenu.Item>
+    ),
+  },
+);
+
+// DropdownMenu.Item with checkbox without hint
+
+figma.connect(
+  DropdownMenu.Item,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47952-14045&t=7CEXrbu9XEfMUFlr-11',
+  {
+    variant: { hint: 'false' },
+    props: {
+      content: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+    },
+    example: ({ content, selected, disabled }) => (
+      <DropdownMenu.Item key={/* key */} selected={selected} disabled={disabled} role='menuitemradio'>
+        {content}
+      </DropdownMenu.Item>
+    ),
+  },
+);
+
+// DropdownMenu.Item with checkbox with hint
+
+figma.connect(
+  DropdownMenu.Item,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47952-14045&t=7CEXrbu9XEfMUFlr-11',
+  {
+    variant: { hint: 'true' },
+    props: {
+      content: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      hint: figma.textContent('↳ hint'),
+    },
+    example: ({ content, selected, disabled, hint }) => (
+      <DropdownMenu.Item key={/* key */} selected={selected} disabled={disabled}>
+        <DropdownMenu.Item.Content>
+          <DropdownMenu.Item.Text>{content}</DropdownMenu.Item.Text>
+        </DropdownMenu.Item.Content>
+        <DropdownMenu.Item.Hint>{hint}</DropdownMenu.Item.Hint>
+      </DropdownMenu.Item>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/DropdownMenu.figma.jsx b/figma/mappings/core-components/DropdownMenu.figma.jsx
new file mode 100644
index 0000000000..a81fd60bfa
--- /dev/null
+++ b/figma/mappings/core-components/DropdownMenu.figma.jsx
@@ -0,0 +1,23 @@
+import figma from '@figma/code-connect';
+import DropdownMenu from '@semcore/ui/dropdown-menu';
+
+figma.connect(
+  DropdownMenu.Menu,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47952-16111&t=7CEXrbu9XEfMUFlr-11',
+  {
+    variant: { 'type': 'menu', 'search input': 'false' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      children: figma.children('*'),
+    },
+
+    example: ({ size, children }) => (
+      <DropdownMenu size={size}>
+        {children}
+      </DropdownMenu>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/FeaturePopover.figma.tsx b/figma/mappings/core-components/FeaturePopover.figma.tsx
new file mode 100644
index 0000000000..8932705092
--- /dev/null
+++ b/figma/mappings/core-components/FeaturePopover.figma.tsx
@@ -0,0 +1,56 @@
+import figma from '@figma/code-connect/react';
+import FeaturePopover from '@semcore/ui/feature-popover';
+import { Text } from '@semcore/ui/typography';
+
+figma.connect(
+  FeaturePopover,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=52334-2678&t=B1622uxt4mPTLZzH-11',
+
+  {
+    props: {
+      theme: figma.enum('theme', {
+        accent: 'accent',
+        neutral: 'neutral',
+      }),
+      text: figma.textContent('↳ text'),
+      title: figma.textContent('↳ title'),
+      actions: figma.children('Button'),
+      placement: figma.nestedProps('placement', {
+        placement: figma.enum('placement', {
+          'top-start': 'top-start',
+          'top': 'top',
+          'top-end': 'top-end',
+          'right-start': 'right-start',
+          'right': 'right',
+          'right-end': 'right-end',
+          'bottom-start': 'bottom-start',
+          'bottom': 'bottom',
+          'bottom-end': 'bottom-end',
+          'left-start': 'left-start',
+          'left': 'left',
+          'left-end': 'left-end',
+        }),
+      }),
+    },
+    example: ({ theme, placement, text, title, actions }) => (
+      <FeaturePopover theme={theme} placement={placement.placement}>
+        <FeaturePopover.Trigger>
+          {/* Add trigger */}
+        </FeaturePopover.Trigger>
+        <FeaturePopover.Popper
+          aria-label='/* Add aria-label */'
+          closeIcon
+          wMax={250}
+        >
+          <Text size={300} bold tag='h3' mb={1} mt={0}>
+            {title}
+          </Text>
+          <Text mb={4} size={200} tag='p'>
+            {text}
+          </Text>
+          {actions}
+        </FeaturePopover.Popper>
+      </FeaturePopover>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/FeedbackForm.figma.jsx b/figma/mappings/core-components/FeedbackForm.figma.jsx
new file mode 100644
index 0000000000..286c16d79b
--- /dev/null
+++ b/figma/mappings/core-components/FeedbackForm.figma.jsx
@@ -0,0 +1,88 @@
+import figma from '@figma/code-connect';
+import { Flex, Box } from '@semcore/ui/base-components';
+import FeedbackForm from '@semcore/ui/feedback-form';
+import Input from '@semcore/ui/input';
+import Link from '@semcore/ui/link';
+import Textarea from '@semcore/ui/textarea';
+import { Text } from '@semcore/ui/typography';
+
+// Not a flexible mapping, but I don't think teams need to customize it much
+
+figma.connect(
+  FeedbackForm,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-298563&t=7CEXrbu9XEfMUFlr-11', {
+
+    example: () => (
+      <FeedbackForm loading={loading}>
+        <Box p={4}>
+          <Flex direction='column'>
+            <Text mb={2} size={200} tag='label' htmlFor='description'>
+              {/* Add label for textarea */}
+            </Text>
+            <FeedbackForm.Item
+              name='description'
+              validate={validate.description}
+              initialValue=''
+              placement='left-start'
+              flip={{
+                fallbackPlacements: ['right-start', 'bottom'],
+              }}
+              validateOnBlur={value.description === '' ? false : true}
+            >
+              {({ input }) => (
+                <Textarea
+                  {...input}
+                  autoFocus
+                  h={80}
+                  onChange={this.handleChange(input.onChange)}
+                  id='description'
+                />
+              )}
+            </FeedbackForm.Item>
+          </Flex>
+          <Flex mt={4} direction='column'>
+            <Text mb={2} size={200} tag='label' htmlFor='email'>
+              Reply-to email
+            </Text>
+            <FeedbackForm.Item
+              name='email'
+              validate={validate.email}
+              initialValue=''
+              validateOnBlur={value.email === '' ? false : true}
+            >
+              {({ input }) => (
+                <Input state={input.state}>
+                  <Input.Value
+                    {...input}
+                    onChange={this.handleChange(input.onChange)}
+                    id='email'
+                    type='email'
+                    autoComplete='email'
+                    aria-describedby='email-description'
+                  />
+                </Input>
+              )}
+            </FeedbackForm.Item>
+          </Flex>
+          <Box mt={2}>
+            <Text size={200} color='text-secondary' id='email-description'>
+              {/* Add hint for input */}
+            </Text>
+          </Box>
+          <Flex mt={4}>
+            <FeedbackForm.Submit>Send feedback</FeedbackForm.Submit>
+            <FeedbackForm.Cancel onClick={onCancel}>Cancel</FeedbackForm.Cancel>
+          </Flex>
+        </Box>
+        <FeedbackForm.Notice hidden={status === 'failed'}>
+          You can also send us an email to
+          {' '}
+          <Link>backlink.audit@semrush.com</Link>
+        </FeedbackForm.Notice>
+        <FeedbackForm.Notice hidden={status !== 'failed'} theme='danger'>
+          Your message has not been sent.
+        </FeedbackForm.Notice>
+      </FeedbackForm>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/FeedbackRating.figma.jsx b/figma/mappings/core-components/FeedbackRating.figma.jsx
new file mode 100644
index 0000000000..c599de22b0
--- /dev/null
+++ b/figma/mappings/core-components/FeedbackRating.figma.jsx
@@ -0,0 +1,98 @@
+import figma from '@figma/code-connect';
+import { FeedbackRating } from '@semcore/ui/feedback-form';
+import Link from '@semcore/ui/link';
+
+// The base components are commented out because currently we are not rendering them separately from the FeedbackRating component
+
+// figma.connect(
+//     SliderRating.Star,
+//     'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-298578&t=7CEXrbu9XEfMUFlr-11', {
+//     example: () => (
+//         <SliderRating.Star />
+//     )
+// });
+
+// figma.connect(
+//     SliderRating,
+//     'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-298578&t=7CEXrbu9XEfMUFlr-11', {
+//     variant: { 'value': '1,2,3,4,5' },
+//     props: {
+//         value: figma.number('value'),
+//     },
+//     example: ({ value }) => (
+//         <SliderRating value={value} />
+//     )
+// });
+
+// figma.connect(
+//     FeedbackRatingForm.Checkbox,
+//     'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-298578&t=7CEXrbu9XEfMUFlr-11', {
+//     props: {
+//         label: figma.textContent('↳ text'),
+//     },
+//     example: ({ label }) => (
+//         <FeedbackRatingForm.Checkbox label={label} />
+//     )
+// });
+
+figma.connect(
+  FeedbackRating,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-298638&t=7CEXrbu9XEfMUFlr-11', {
+    variant: { state: 'Notice' },
+    props: {
+      // notificationTitle: figma.boolean('notification title', {
+      //     true: figma.textContent('↳ title'),
+      //     false: undefined,
+      // }),
+      // notificationText: figma.textContent('↳ text'),
+      learnMoreLink: figma.boolean('Learn more link', {
+        true: figma.children('Link'),
+        false: undefined,
+      }),
+    },
+    example: ({ notificationTitle, notificationText, learnMoreLink }) => (
+      <FeedbackRating
+        notificationTitle={/* notificationTitle */}
+        notificationText={/* notificationText */}
+        learnMoreLink={/* Set URL */}
+        header={/* Add Modal title */}
+        submitText={/* Add Modal submit button text */}
+        formConfig={/* Add form config */}
+        description={(
+          <>
+            We will only use this email to respond to you on your feedback.
+            {' '}
+            {learnMoreLink}
+          </>
+        )}
+      />
+    ),
+  });
+
+figma.connect(
+  FeedbackRating,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-298638&t=7CEXrbu9XEfMUFlr-11', {
+    variant: { state: 'Form' },
+    props: {
+      header: figma.textContent('↳ title'),
+    },
+    example: ({ header }) => (
+      <FeedbackRating
+        notificationTitle={/* notificationTitle */}
+        notificationText={/* notificationText */}
+        learnMoreLink={/* Set URL */}
+        header={header}
+        submitText={/* Add Modal submit button text */}
+        formConfig={/* Add form config */}
+        description={(
+          <>
+            We will only use this email to respond to you on your feedback.
+            {' '}
+            <Link href='https://www.semrush.com/company/legal/privacy-policy/'>
+              Privacy Policy
+            </Link>
+          </>
+        )}
+      />
+    ),
+  });
diff --git a/figma/mappings/core-components/FilterTrigger.figma.jsx b/figma/mappings/core-components/FilterTrigger.figma.jsx
new file mode 100644
index 0000000000..5deb5abc10
--- /dev/null
+++ b/figma/mappings/core-components/FilterTrigger.figma.jsx
@@ -0,0 +1,187 @@
+import figma from '@figma/code-connect';
+import { ScreenReaderOnly } from '@semcore/ui/base-components';
+import { FilterTrigger } from '@semcore/ui/base-trigger';
+import Dropdown from '@semcore/ui/dropdown';
+import Select from '@semcore/ui/select';
+
+// Normal variants
+
+figma.connect(
+  FilterTrigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10191-98848&t=5rMgxkZbFCPoIXFH-11',
+  {
+    variant: { state: 'normal', Counter: 'false', Dot: 'false' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      placeholder: figma.textContent('↳ text'),
+    },
+    example: ({ size, placeholder }) => (
+      <Select.Trigger tag={FilterTrigger} size={size} placeholder={placeholder} />
+    ),
+  },
+);
+
+figma.connect(
+  FilterTrigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10191-98848&t=5rMgxkZbFCPoIXFH-11',
+  {
+    variant: { state: 'normal', Counter: 'false', Dot: 'true' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      placeholder: figma.textContent('↳ text'),
+      dot: figma.boolean('Dot', {
+        true: figma.children('Dot'),
+        false: undefined,
+      }),
+    },
+    example: ({ size, placeholder, dot }) => (
+      <Select.Trigger tag={FilterTrigger} size={size} placeholder={placeholder}>
+        {dot}
+      </Select.Trigger>
+    ),
+  },
+);
+
+// Variants without addons
+
+figma.connect(
+  FilterTrigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10191-98848&t=5rMgxkZbFCPoIXFH-11',
+  {
+    variant: { 'Counter': 'false', '← addon': 'false' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      active: figma.enum('state', {
+        active: true,
+      }),
+      placeholder: figma.textContent('↳ text'),
+      dot: figma.boolean('Dot', {
+        true: figma.children('Dot'),
+        false: undefined,
+      }),
+    },
+    example: ({ size, placeholder, active, dot }) => (
+      <Select.Trigger tag={FilterTrigger} size={size} state={active} placeholder={placeholder}>
+        <span aria-hidden>{placeholder}</span>
+        {dot}
+      </Select.Trigger>
+    ),
+  },
+);
+
+figma.connect(
+  FilterTrigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10191-98848&t=5rMgxkZbFCPoIXFH-11',
+  {
+    variant: { 'Counter': 'true', '← addon': 'false' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      active: figma.enum('state', {
+        active: true,
+      }),
+      placeholder: figma.textContent('↳ text'),
+      dot: figma.boolean('Dot', {
+        true: figma.children('Dot'),
+        false: undefined,
+      }),
+    },
+    example: ({ size, placeholder, active, dot }) => (
+      <Dropdown.Trigger placeholder={placeholder} tag={FilterTrigger}>
+        <FilterTrigger.TriggerButton size={size} state={active}>
+          <FilterTrigger.Text aria-hidden>{placeholder}</FilterTrigger.Text>
+          <FilterTrigger.Counter>
+            <ScreenReaderOnly>applied</ScreenReaderOnly>
+          </FilterTrigger.Counter>
+          {dot}
+        </FilterTrigger.TriggerButton>
+        <FilterTrigger.ClearButton title='Clear advanced filters' />
+      </Dropdown.Trigger>
+    ),
+  },
+);
+
+// Variants with addons
+
+figma.connect(
+  FilterTrigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10191-98848&t=5rMgxkZbFCPoIXFH-11',
+  {
+    variant: { 'Counter': 'false', '← addon': 'true' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      addonLeft: figma.boolean('← addon', {
+        true: figma.children('← - - addon properties'),
+        false: undefined,
+      }),
+      active: figma.enum('state', {
+        active: true,
+      }),
+      placeholder: figma.textContent('↳ text'),
+      dot: figma.boolean('Dot', {
+        true: figma.children('Dot'),
+        false: undefined,
+      }),
+    },
+    example: ({ size, placeholder, active, dot, addonLeft }) => (
+      <Select.Trigger tag={FilterTrigger} size={size} state={active} placeholder={placeholder}>
+        <Select.Trigger.Addon>{addonLeft}</Select.Trigger.Addon>
+        <span aria-hidden>{placeholder}</span>
+        {dot}
+      </Select.Trigger>
+    ),
+  },
+);
+
+figma.connect(
+  FilterTrigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10191-98848&t=5rMgxkZbFCPoIXFH-11',
+  {
+    variant: { 'Counter': 'true', '← addon': 'true' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      active: figma.enum('state', {
+        active: true,
+      }),
+      addonLeft: figma.boolean('← addon', {
+        true: figma.children('← - - addon properties'),
+        false: undefined,
+      }),
+      placeholder: figma.textContent('↳ text'),
+      dot: figma.boolean('Dot', {
+        true: figma.children('Dot'),
+        false: undefined,
+      }),
+    },
+    example: ({ size, placeholder, active, dot, addonLeft }) => (
+      <Dropdown.Trigger placeholder={placeholder} tag={FilterTrigger}>
+        <FilterTrigger.TriggerButton size={size} state={active}>
+          <FilterTrigger.Addon>{addonLeft}</FilterTrigger.Addon>
+          <FilterTrigger.Text aria-hidden>{placeholder}</FilterTrigger.Text>
+          <FilterTrigger.Counter>
+            <ScreenReaderOnly>applied</ScreenReaderOnly>
+          </FilterTrigger.Counter>
+          {dot}
+        </FilterTrigger.TriggerButton>
+        <FilterTrigger.ClearButton title='Clear advanced filters' />
+      </Dropdown.Trigger>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Flags.figma.jsx b/figma/mappings/core-components/Flags.figma.jsx
new file mode 100644
index 0000000000..11b4bff08a
--- /dev/null
+++ b/figma/mappings/core-components/Flags.figma.jsx
@@ -0,0 +1,10 @@
+import figma from '@figma/code-connect';
+import Flags from '@semcore/ui/flags';
+
+figma.connect(
+  Flags,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=32767-192692',
+  {
+    example: () => <Flags iso2={/* value */} />,
+  },
+);
diff --git a/figma/mappings/core-components/FullscreenModal.figma.jsx b/figma/mappings/core-components/FullscreenModal.figma.jsx
new file mode 100644
index 0000000000..150dbb6b04
--- /dev/null
+++ b/figma/mappings/core-components/FullscreenModal.figma.jsx
@@ -0,0 +1,72 @@
+import figma from '@figma/code-connect/react';
+import FullscreenModal from '@semcore/ui/fullscreen-modal';
+
+figma.connect(
+  FullscreenModal.Header,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10976-128065&t=8tFmR59x5n76jWX8-11',
+  {
+    props: {
+      title: figma.textContent('↳ title'),
+      description: figma.textContent('↳ description'),
+    },
+    example: ({ title, description }) => (
+      <FullscreenModal.Header title={title} description={description} />
+    ),
+  },
+);
+
+figma.connect(
+  FullscreenModal.Footer,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10269-107418&t=8tFmR59x5n76jWX8-11',
+  {
+    props: {
+      children: figma.children('Button'),
+    },
+    example: ({ children }) => <FullscreenModal.Footer justifyContent='center' alignItems='center' gap={3}>{children}</FullscreenModal.Footer>,
+  },
+);
+
+figma.connect(
+  FullscreenModal,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11498-135869&t=8tFmR59x5n76jWX8-11',
+  {
+    variant: { 'dual-zone': 'false' },
+    props: {
+      childrenHeader: figma.children('FullscreenModal.Header'),
+      childrenFooter: figma.children('FullscreenModal.Footer'),
+    },
+    example: ({ childrenHeader, childrenFooter }) => (
+      <FullscreenModal>
+        <FullscreenModal.Close />
+        <FullscreenModal.Back>{/* Add button label */}</FullscreenModal.Back>
+        {childrenHeader}
+        <FullscreenModal.Body>{/* content */}</FullscreenModal.Body>
+        {childrenFooter}
+      </FullscreenModal>
+    ),
+  },
+);
+
+figma.connect(
+  FullscreenModal,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11498-135869&t=8tFmR59x5n76jWX8-11',
+  {
+    variant: { 'dual-zone': 'true' },
+    props: {
+      childrenHeader: figma.children('FullscreenModal.Header'),
+      childrenFooter: figma.children('FullscreenModal.Footer'),
+    },
+    example: ({ childrenHeader, childrenFooter }) => (
+      <FullscreenModal>
+        <FullscreenModal.Close />
+        <FullscreenModal.Back>{/* Add button label */}</FullscreenModal.Back>
+        {childrenHeader}
+        <FullscreenModal.Body>
+          <FullscreenModal.Section>{/* content */}</FullscreenModal.Section>
+          <FullscreenModal.Section>{/* content */}</FullscreenModal.Section>
+        </FullscreenModal.Body>
+        {childrenFooter}
+      </FullscreenModal>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Hint.jsx b/figma/mappings/core-components/Hint.jsx
new file mode 100644
index 0000000000..642160c5c7
--- /dev/null
+++ b/figma/mappings/core-components/Hint.jsx
@@ -0,0 +1,42 @@
+import figma from '@figma/code-connect';
+import { Hint } from '@semcore/ui/tooltip';
+
+figma.connect(
+  Hint,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=45323-1421&t=0hjqYEp7RXqjnbR7-11',
+  {
+    props: {
+      title: figma.textContent('↳ text'),
+      theme: figma.enum('theme', {
+        '⚪️ default': 'default',
+        '⚫️ invert': 'invert',
+        '🔴 warning': 'warning',
+      }),
+      placement: figma.nestedProps('placement', {
+        placement: figma.enum('placement', {
+          'top-start': 'top-start',
+          'top-end': 'top-end',
+          'top': 'top',
+          'bottom-start': 'bottom-start',
+          'bottom-end': 'bottom-end',
+          'bottom': 'bottom',
+          'left': 'left',
+          'left-start': 'left-start',
+          'left-end': 'left-end',
+          'right': 'right',
+          'right-start': 'right-start',
+          'right-end': 'right-end',
+        }),
+      }),
+    },
+    example: ({ title, theme, placement }) => (
+      <Hint
+        title={title}
+        theme={theme}
+        placement={placement.placement}
+        tag={addonTag}
+        {...addonProps}
+      />
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/InlineInput.figma.jsx b/figma/mappings/core-components/InlineInput.figma.jsx
new file mode 100644
index 0000000000..0b30bc78fa
--- /dev/null
+++ b/figma/mappings/core-components/InlineInput.figma.jsx
@@ -0,0 +1,41 @@
+import figma from '@figma/code-connect/react';
+import InlineInput from '@semcore/ui/inline-input';
+
+figma.connect(
+  InlineInput.Value,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=53372-292643&t=I48qqNRyVr8Tdi87-11',
+  {
+    props: {
+      value: figma.textContent('↳ text'),
+    },
+    example: ({ value }) => <InlineInput.Value autoFocus placeholder={value} id='/* id */' />,
+  },
+);
+
+figma.connect(
+  InlineInput,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=17000-123421&t=I48qqNRyVr8Tdi87-11',
+  {
+    props: {
+      state: figma.enum('state', {
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      loading: figma.enum('state', {
+        loading: true,
+      }),
+      addonLeft: figma.boolean('← addon', {
+        true: <InlineInput.Addon>{/* addon */}</InlineInput.Addon>,
+      }),
+      value: figma.children('InlineInput.Value'),
+    },
+    example: ({ state, addonLeft, value, loading }) => (
+      <InlineInput state={state} loading={loading}>
+        {addonLeft}
+        {value}
+        <InlineInput.ConfirmControl />
+        <InlineInput.CancelControl />
+      </InlineInput>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Input.figma.jsx b/figma/mappings/core-components/Input.figma.jsx
new file mode 100644
index 0000000000..f434790d3c
--- /dev/null
+++ b/figma/mappings/core-components/Input.figma.jsx
@@ -0,0 +1,157 @@
+import figma from '@figma/code-connect/react';
+import { Flex } from '@semcore/ui/base-components';
+import { ButtonLink } from '@semcore/ui/button';
+import CloseM from '@semcore/ui/icon/Close/m';
+import Input from '@semcore/ui/input';
+import { Text } from '@semcore/ui/typography';
+
+// Need somehow to get the readOnly and disabled props from the Input component
+// and pass it to the Input.Value component
+
+figma.connect(
+  Input.Value,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=52263-2252&t=Q0bSsRErIQ7IEZAU-11',
+  {
+    props: {
+      value: figma.textContent('↳ text'),
+    },
+    example: ({ value }) => <Input.Value placeholder={value} id='/* id */' />,
+  },
+);
+
+figma.connect(
+  Input,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=10043-48576&t=nJSzcLnvK6HvK1l7-11',
+  {
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      state: figma.enum('state', {
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      // disabled: figma.enum('state', {
+      //   disabled: true,
+      // }),
+      // readOnly: figma.boolean('read-only'),
+      addonLeft: figma.boolean('← addon', {
+        true: <Input.Addon>{/* addon */}</Input.Addon>,
+      }),
+      addonRight: figma.boolean('addon →', {
+        true: <Input.Addon>{/* addon */}</Input.Addon>,
+      }),
+      textAddon: figma.boolean('↳ textAddon', {
+        true: <Input.Addon>{/* text addon */}</Input.Addon>,
+      }),
+      value: figma.children('Input.Value'),
+      clearButton: figma.boolean('clear button', {
+        true: (
+          <Input.Addon>
+            <ButtonLink
+              use='secondary'
+              addonLeft={CloseM}
+              title='Clear'
+            />
+          </Input.Addon>
+        ),
+        false: undefined,
+      }),
+    },
+    example: ({ size, state, addonLeft, addonRight, textAddon, value, clearButton, disabled, readOnly }) => (
+      <Input size={size} state={state}>
+        {addonLeft}
+        {value}
+        {textAddon}
+        {addonRight}
+        {clearButton}
+      </Input>
+    ),
+  },
+);
+
+// Input with label
+// TODO: Move these complex examples to the separate file for mappings of all the inputs?
+
+figma.connect(
+  Input,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11613-139678&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { 'label position': 'top' },
+    props: {
+      label: figma.textContent('↳ label'),
+      input: figma.children('Input'),
+      optional: figma.boolean('optional', {
+        true: (
+          <Text size='/* fontSize */' color='text-secondary'>
+            (optional)
+          </Text>
+        ),
+        false: undefined,
+      }),
+      counter: figma.boolean('counter', {
+        true: figma.children('Counter'),
+        false: undefined,
+      }),
+      infoIcon: figma.boolean('informer', {
+        true: figma.children('Info icon with tooltip (Informer)'),
+        false: undefined,
+      }),
+    },
+    example: ({ label, input, optional, counter, infoIcon }) => (
+      <Flex direction='column' gap={2}>
+        <Flex direction='row' justifyContent='space-between'>
+          <Text tag='label' htmlFor='/* input id */' size='/* fontSize */'>
+            {label}
+          </Text>
+          {counter}
+          {infoIcon}
+          {optional}
+        </Flex>
+        {input}
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  Input,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11613-139678&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { 'label position': 'left' },
+    props: {
+      label: figma.textContent('↳ label'),
+      input: figma.children('Input'),
+      optional: figma.boolean('optional', {
+        true: (
+          <Text size='/* fontSize */' color='text-secondary'>
+            (optional)
+          </Text>
+        ),
+        false: undefined,
+      }),
+      counter: figma.boolean('counter', {
+        true: figma.children('Counter'),
+        false: undefined,
+      }),
+      infoIcon: figma.boolean('informer', {
+        true: figma.children('Info icon with tooltip (Informer)'),
+        false: undefined,
+      }),
+    },
+    example: ({ label, input, optional, counter, infoIcon }) => (
+      <Flex direction='row' gap={6}>
+        <Flex direction='column' mt={/* value */}>
+          <Text tag='label' htmlFor='/* input id */' size='/* fontSize */'>
+            {label}
+          </Text>
+          {counter}
+          {infoIcon}
+          {optional}
+        </Flex>
+        {input}
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/InputNumber.figma.jsx b/figma/mappings/core-components/InputNumber.figma.jsx
new file mode 100644
index 0000000000..4207d7bd1f
--- /dev/null
+++ b/figma/mappings/core-components/InputNumber.figma.jsx
@@ -0,0 +1,194 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+import InputNumber from '@semcore/ui/input-number';
+import { Text } from '@semcore/ui/typography';
+
+figma.connect(
+  InputNumber,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10162-90608',
+  {
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      state: figma.enum('state', {
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      readOnly: figma.boolean('read-only'),
+      addonLeft: figma.boolean('← addon', {
+        true: <InputNumber.Addon>{/* addon */}</InputNumber.Addon>,
+      }),
+      showControls: figma.boolean('show controls'),
+    },
+    example: ({ size, state, addonLeft, readOnly, showControls, disabled }) => (
+      <InputNumber size={size} state={state} disabled={disabled}>
+        {addonLeft}
+        <InputNumber.Value readOnly={readOnly} />
+        <InputNumber.Controls showControls={showControls} />
+      </InputNumber>
+    ),
+  },
+);
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10162-90618&',
+  {
+    example: () => (
+      <Flex>
+        <InputNumber neighborLocation='right'>
+          {/* Select individual inputs to inspect their props */}
+        </InputNumber>
+        <InputNumber neighborLocation='left'>
+          {/* Select individual inputs to inspect their props */}
+        </InputNumber>
+      </Flex>
+    ),
+  },
+);
+
+// let's discuss if we really need Value props (and parent `w` prop) here (they aren't connected with Figma)
+
+// figma.connect(
+//   InputNumber.Value,
+//   'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=52716-799&',
+//   {
+//     props: {
+//       value: figma.textContent('↳ text'),
+//     },
+//     example: ({ value }) => (
+//       <InputNumber.Value
+//         defaultValue='/* string */'
+//         placeholder={value}
+//         id='/* id */'
+//         max='/* number */'
+//         min='/* number */'
+//         step='/* number */'
+//       />
+//     ),
+//   },
+// );
+
+// TODO: How to add neighborLocation props to the InputNumber components?
+// это можно сделать вот так, но придется повторять все проперти для каждого потомка
+
+// figma.connect(
+//   Flex,
+//   'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10162-90618&',
+//   {
+//     props: {
+//       child1: figma.nestedProps('InputNumber1', {
+//         showControls: figma.boolean('show controls'),
+//         state: figma.enum('state', {
+//           invalid: 'invalid',
+//           valid: 'valid',
+//         }),
+//         disabled: figma.enum('state', {
+//           disabled: true,
+//         }),
+//         readOnly: figma.boolean('read-only'),
+//       }),
+//     },
+//     example: ({ child1 }) => (
+//       <Flex>
+//         <InputNumber neighborLocation='right' disabled={child1.disabled} state={child1.state}>
+//           <InputNumber.Value readOnly={child1.readOnly} />
+//           <InputNumber.Controls showControls={child1.showControls} />
+//         </InputNumber>
+//         <InputNumber neighborLocation='left'>
+//           <InputNumber.Value />
+//           <InputNumber.Controls />
+//         </InputNumber>
+//       </Flex>
+//     ),
+//   },
+// );
+
+// InputNumber with label
+
+figma.connect(
+  InputNumber,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56367-564&',
+  {
+    variant: { 'label position': 'top' },
+    props: {
+      label: figma.textContent('↳ label'),
+      input: figma.children('InputRange'),
+      optional: figma.boolean('optional', {
+        true: (
+          <Text size='/* fontSize */' color='text-secondary'>
+            (optional)
+          </Text>
+        ),
+        false: undefined,
+      }),
+      counter: figma.boolean('counter', {
+        true: figma.children('Counter'),
+        false: undefined,
+      }),
+      infoIcon: figma.boolean('informer', {
+        true: figma.children('Info icon with tooltip (Informer)'),
+        false: undefined,
+      }),
+    },
+    example: ({ label, input, optional, counter, infoIcon }) => (
+      <Flex direction='column' gap={2}>
+        <Flex direction='row' justifyContent='space-between'>
+          <Text tag='label' htmlFor='/* input id */' size='/* fontSize */'>
+            {label}
+          </Text>
+          {counter}
+          {infoIcon}
+          {optional}
+        </Flex>
+        {input}
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  InputNumber,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56367-564&',
+  {
+    variant: { 'label position': 'left' },
+    props: {
+      label: figma.textContent('↳ label'),
+      input: figma.children('InputRange'),
+      optional: figma.boolean('optional', {
+        true: (
+          <Text size='/* fontSize */' color='text-secondary'>
+            (optional)
+          </Text>
+        ),
+        false: undefined,
+      }),
+      counter: figma.boolean('counter', {
+        true: figma.children('Counter'),
+        false: undefined,
+      }),
+      infoIcon: figma.boolean('informer', {
+        true: figma.children('Info icon with tooltip (Informer)'),
+        false: undefined,
+      }),
+    },
+    example: ({ label, input, optional, counter, infoIcon }) => (
+      <Flex direction='row' gap={6}>
+        <Flex direction='column' mt={/* value */}>
+          <Text tag='label' htmlFor='/* input id */' size='/* fontSize */'>
+            {label}
+          </Text>
+          {counter}
+          {infoIcon}
+          {optional}
+        </Flex>
+        {input}
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/InputPhone.figma.jsx b/figma/mappings/core-components/InputPhone.figma.jsx
new file mode 100644
index 0000000000..cb0824e04d
--- /dev/null
+++ b/figma/mappings/core-components/InputPhone.figma.jsx
@@ -0,0 +1,220 @@
+import figma from '@figma/code-connect/react';
+import { Box, Flex } from '@semcore/ui/base-components';
+import { ButtonLink } from '@semcore/ui/button';
+import Flag, { iso2Name } from '@semcore/ui/flags';
+import Input from '@semcore/ui/input';
+import { Text } from '@semcore/ui/typography';
+
+// Need somehow to get the readOnly and disabled props from the Input component
+// and pass it to the Input.Value component
+
+figma.connect(
+  Input.Value,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=52263-2252&t=HtVigJYDbVC6HcLX-11',
+  {
+    props: {
+      value: figma.textContent('↳ text'),
+    },
+    example: ({ value }) => <Input.Value placeholder={value} id='/* id */' />,
+  },
+);
+
+// Unknown country and number format
+
+figma.connect(
+  Input,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10264-98074&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: {
+      type: 'default',
+    },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      state: figma.enum('state', {
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      value: figma.children('Input.Value'),
+      clearButton: figma.boolean('clear button', {
+        true: (
+          <Input.Addon>
+            <ButtonLink
+              use='secondary'
+              addonLeft={/* CloseM */}
+              title='Clear'
+            />
+          </Input.Addon>
+        ),
+        false: undefined,
+      }),
+    },
+    example: ({ size, state, value, clearButton }) => (
+      <Input w='/* width */' size={size} state={state}>
+        {value}
+        {clearButton}
+      </Input>
+    ),
+  },
+);
+
+// Known country and unknown number format
+
+figma.connect(
+  Input,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10264-98074&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: {
+      type: 'country code',
+    },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      state: figma.enum('state', {
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      inputValue: figma.children('Input.Value'),
+      clearButton: figma.boolean('clear button', {
+        true: (
+          <Input.Addon>
+            <ButtonLink
+              use='secondary'
+              addonLeft={/* CloseM */}
+              title='Clear'
+            />
+          </Input.Addon>
+        ),
+        false: undefined,
+      }),
+    },
+    example: ({ size, state, inputValue, clearButton }) => (
+      <Input w='/* width */' size={size} state={state}>
+        <Input.Addon>
+          <Flag iso2={/* value */} role='img' aria-label={iso2Name(/* value */)} />
+        </Input.Addon>
+        {inputValue}
+        {clearButton}
+      </Input>
+    ),
+  },
+);
+
+// Known country and number format
+// TODO: How to add neighborLocation props to the InputPhone components?
+
+figma.connect(
+  Box,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10264-98074&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: {
+      type: 'country code and format',
+    },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      state: figma.enum('state', {
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      select: figma.children('Select.Trigger'),
+      inputValue: figma.children('Input.Value'),
+    },
+    example: ({ size, state, select, inputValue }) => (
+      <Box>
+        {select}
+        <Input w='/* width */' size={size} state={state}>{inputValue}</Input>
+      </Box>
+    ),
+  },
+);
+
+// InputPhone with label
+
+figma.connect(
+  Input,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56367-1634&',
+  {
+    variant: { 'label position': 'top' },
+    props: {
+      label: figma.textContent('↳ label'),
+      input: figma.children('InputPhone'),
+      optional: figma.boolean('optional', {
+        true: (
+          <Text size='/* fontSize */' color='text-secondary'>
+            (optional)
+          </Text>
+        ),
+        false: undefined,
+      }),
+      counter: figma.boolean('counter', {
+        true: figma.children('Counter'),
+        false: undefined,
+      }),
+      infoIcon: figma.boolean('informer', {
+        true: figma.children('Info icon with tooltip (Informer)'),
+        false: undefined,
+      }),
+    },
+    example: ({ label, input, optional, counter, infoIcon }) => (
+      <Flex direction='column' gap={2}>
+        <Flex direction='row' justifyContent='space-between'>
+          <Text tag='label' htmlFor='/* input id */' size='/* fontSize */'>
+            {label}
+          </Text>
+          {counter}
+          {infoIcon}
+          {optional}
+        </Flex>
+        {input}
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  Input,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56367-1634&',
+  {
+    variant: { 'label position': 'left' },
+    props: {
+      label: figma.textContent('↳ label'),
+      input: figma.children('InputPhone'),
+      optional: figma.boolean('optional', {
+        true: (
+          <Text size='/* fontSize */' color='text-secondary'>
+            (optional)
+          </Text>
+        ),
+        false: undefined,
+      }),
+      counter: figma.boolean('counter', {
+        true: figma.children('Counter'),
+        false: undefined,
+      }),
+      infoIcon: figma.boolean('informer', {
+        true: figma.children('Info icon with tooltip (Informer)'),
+        false: undefined,
+      }),
+    },
+    example: ({ label, input, optional, counter, infoIcon }) => (
+      <Flex direction='row' gap={6}>
+        <Flex direction='column' mt={/* value */}>
+          <Text tag='label' htmlFor='/* input id */' size='/* fontSize */'>
+            {label}
+          </Text>
+          {counter}
+          {infoIcon}
+          {optional}
+        </Flex>
+        {input}
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/InputTags.figma.jsx b/figma/mappings/core-components/InputTags.figma.jsx
new file mode 100644
index 0000000000..bf3b196b5c
--- /dev/null
+++ b/figma/mappings/core-components/InputTags.figma.jsx
@@ -0,0 +1,122 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+import InputTags from '@semcore/ui/input-tags';
+import { Text } from '@semcore/ui/typography';
+
+figma.connect(
+  InputTags.Value,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=53341-290243&t=I48qqNRyVr8Tdi87-11',
+  {
+    props: {
+      value: figma.textContent('↳ text'),
+    },
+    example: ({ value }) => <InputTags.Value placeholder={value} id='/* id */' />,
+  });
+
+figma.connect(
+  InputTags,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10367-194491&t=I48qqNRyVr8Tdi87-11',
+  {
+    props: {
+      placeholder: figma.nestedProps('InputTags.Value', {
+        value: figma.textContent('↳ text'),
+      }),
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      state: figma.enum('state', {
+        normal: 'normal',
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      readOnly: figma.boolean('read-only'),
+      // tags: figma.children('Tag'),
+    },
+    example: ({ placeholder, size, state, readOnly }) => <InputTags size={size} state={state}>{/* tag */}<InputTags.Value placeholder={placeholder.value} id='/* id */' readOnly={readOnly} /></InputTags>,
+  },
+);
+
+// InputTags with label
+
+figma.connect(
+  InputTags,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56367-4062&',
+  {
+    variant: { 'label position': 'top' },
+    props: {
+      label: figma.textContent('↳ label'),
+      input: figma.children('InputTags'),
+      optional: figma.boolean('optional', {
+        true: (
+          <Text size='/* fontSize */' color='text-secondary'>
+            (optional)
+          </Text>
+        ),
+        false: undefined,
+      }),
+      counter: figma.boolean('counter', {
+        true: figma.children('Counter'),
+        false: undefined,
+      }),
+      infoIcon: figma.boolean('informer', {
+        true: figma.children('Info icon with tooltip (Informer)'),
+        false: undefined,
+      }),
+    },
+    example: ({ label, input, optional, counter, infoIcon }) => (
+      <Flex direction='column' gap={2}>
+        <Flex direction='row' justifyContent='space-between'>
+          <Text tag='label' htmlFor='/* input id */' size='/* fontSize */'>
+            {label}
+          </Text>
+          {counter}
+          {infoIcon}
+          {optional}
+        </Flex>
+        {input}
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  InputTags,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56367-4062&',
+  {
+    variant: { 'label position': 'left' },
+    props: {
+      label: figma.textContent('↳ label'),
+      input: figma.children('InputTags'),
+      optional: figma.boolean('optional', {
+        true: (
+          <Text size='/* fontSize */' color='text-secondary'>
+            (optional)
+          </Text>
+        ),
+        false: undefined,
+      }),
+      counter: figma.boolean('counter', {
+        true: figma.children('Counter'),
+        false: undefined,
+      }),
+      infoIcon: figma.boolean('informer', {
+        true: figma.children('Info icon with tooltip (Informer)'),
+        false: undefined,
+      }),
+    },
+    example: ({ label, input, optional, counter, infoIcon }) => (
+      <Flex direction='row' gap={6}>
+        <Flex direction='column' mt={/* value */}>
+          <Text tag='label' htmlFor='/* input id */' size='/* fontSize */'>
+            {label}
+          </Text>
+          {counter}
+          {infoIcon}
+          {optional}
+        </Flex>
+        {input}
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Link.figma.ts b/figma/mappings/core-components/Link.figma.ts
new file mode 100644
index 0000000000..f8ff5f70b0
--- /dev/null
+++ b/figma/mappings/core-components/Link.figma.ts
@@ -0,0 +1,34 @@
+import { connect } from '../../src/connect';
+import type { ConnectSettings } from '../../src/connect';
+
+const addonLeft = connect.childCode('← - - addon properties', { wrapper: 'Link.Addon' });
+const addonRight = connect.childCode('addon properties - - →', { wrapper: 'Link.Addon' });
+
+const wrapper = addonLeft || addonRight ? 'Link.Text' : undefined;
+const text = connect.childCode('↳ text', { wrapper });
+
+const ariaLabel = text ? undefined : 'aria-label = {/* short description */}';
+
+const active = connect.getProp('state', 'active');
+const disabled = connect.getProp('state', 'disabled');
+
+const example = `
+<Link
+  ${ariaLabel}
+  size={/* fontSize */}
+  href={/* URL */}
+  ${active}
+  ${disabled}
+>
+${addonLeft}
+${text}
+${addonRight}
+</Link>
+`;
+
+export const settings: ConnectSettings = {
+  example,
+  id: 'Link',
+  url: 'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10142-178857',
+  imports: ['import Link from "@semcore/ui/link"'],
+};
diff --git a/figma/mappings/core-components/List.figma.jsx b/figma/mappings/core-components/List.figma.jsx
new file mode 100644
index 0000000000..843f978ee7
--- /dev/null
+++ b/figma/mappings/core-components/List.figma.jsx
@@ -0,0 +1,46 @@
+import figma from '@figma/code-connect';
+import { List } from '@semcore/ui/typography';
+
+figma.connect(
+  List.Item,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11735-134804',
+  {
+    props: {
+      // size: figma.enum('font size', {
+      //   '300 (16px)': 300,
+      //   '200 (14px)': 200,
+      //   '100 (12px)': 100,
+      // }),
+      marker: figma.enum('list type', {
+        'numbers (ol)': figma.textContent('number'),
+        'custom marker (ul)': figma.instance('marker'),
+      }),
+      text: figma.textContent('↳ item'),
+    },
+    example: ({ marker, text }) => (
+      <List.Item marker={marker}>
+        {text}
+      </List.Item>
+    ),
+  },
+);
+
+figma.connect(
+  List,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11735-135520',
+  {
+    props: {
+      children: figma.children('*'),
+      size: figma.enum('font size', {
+        '300 (16px)': 300,
+        '200 (14px)': 200,
+        '100 (12px)': 100,
+      }),
+    },
+    example: ({ children, size }) => (
+      <List size={size}>
+        {children}
+      </List>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Modal.figma.jsx b/figma/mappings/core-components/Modal.figma.jsx
new file mode 100644
index 0000000000..d3ebae6419
--- /dev/null
+++ b/figma/mappings/core-components/Modal.figma.jsx
@@ -0,0 +1,19 @@
+import figma from '@figma/code-connect/react';
+import Modal from '@semcore/ui/modal';
+
+figma.connect(
+  Modal,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10142-188594&t=tjfdRa8KRbX0lwpz-11',
+  {
+    props: {
+      title: figma.textContent('↳ title'),
+      // children: figma.children('*'),
+    },
+    example: ({ title }) => (
+      <Modal>
+        <Modal.Title mb={4}>{title}</Modal.Title>
+        {/* Place content here */}
+      </Modal>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/ModalContent.figma.jsx b/figma/mappings/core-components/ModalContent.figma.jsx
new file mode 100644
index 0000000000..62622a01e4
--- /dev/null
+++ b/figma/mappings/core-components/ModalContent.figma.jsx
@@ -0,0 +1,103 @@
+import figma from '@figma/code-connect/react';
+import { Flex } from '@semcore/ui/base-components';
+import MailSent from '@semcore/ui/illustration/MailSent';
+import { Text } from '@semcore/ui/typography';
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=55508-4841&t=tjfdRa8KRbX0lwpz-11',
+  {
+    props: {
+      text: figma.textContent('↳ text'),
+      children: figma.children('*'),
+    },
+    example: ({ text, children }) => (
+      <Flex direction='column' gap={4}>
+        <Text size={/* font size */} tag='p'>
+          {text}
+        </Text>
+        {children}
+      </Flex>
+    ) },
+);
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=55508-4850&t=tjfdRa8KRbX0lwpz-11',
+  {
+    props: {
+      text: figma.textContent('↳ text'),
+      childrenForm: figma.children('*'),
+      childrenActions: figma.children('Button'),
+    },
+    example: ({ text, childrenForm, childrenActions }) => (
+      <Flex direction='column' gap={4}>
+        <Text size={/* font size */} tag='p'>
+          {text}
+        </Text>
+        <Flex direction='column' gap={6}>
+          {childrenForm}
+        </Flex>
+        <Flex gap={3}>{childrenActions}</Flex>
+      </Flex>
+    ) },
+);
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=55508-4891&t=tjfdRa8KRbX0lwpz-11',
+  {
+    props: {
+      text: figma.textContent('↳ text'),
+      children: figma.children('*'),
+    },
+    example: ({ text, children }) => (
+      <Flex direction='column' gap={4}>
+        <Text size={/* font size */} tag='p'>
+          {text}
+        </Text>
+        {children}
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=55508-4940&t=tjfdRa8KRbX0lwpz-11',
+  {
+    props: {
+      text: figma.textContent('↳ text'),
+      childrenActions: figma.children('Button'),
+    },
+    example: ({ text, childrenActions }) => (
+      <Flex direction='column' alignItems='center' gap={4}>
+        <MailSent />
+        <Text size={/* font size */} tag='p'>
+          {text}
+        </Text>
+        {childrenActions}
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=55508-4949&t=tjfdRa8KRbX0lwpz-11',
+  {
+    props: {
+      text: figma.textContent('↳ text'),
+      children: figma.children('*'),
+    },
+    example: ({ text, children }) => (
+      <Flex direction='column' gap={4}>
+        <Text size={/* font size */} tag='p'>
+          {text}
+        </Text>
+        {/* illustration */}
+        {children}
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Notice.figma.jsx b/figma/mappings/core-components/Notice.figma.jsx
new file mode 100644
index 0000000000..877b1c723f
--- /dev/null
+++ b/figma/mappings/core-components/Notice.figma.jsx
@@ -0,0 +1,100 @@
+import figma from '@figma/code-connect/react';
+import Notice from '@semcore/ui/notice';
+
+figma.connect(
+  Notice.Label,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=53691-291060&t=wyKe5rNq2KHENfRl-11',
+  {
+    variant: { type: 'icon' },
+    props: {
+      icon: figma.instance('↳ icon'),
+    },
+    example: ({ icon }) => <Notice.Label>{icon}</Notice.Label>,
+  },
+);
+
+figma.connect(
+  Notice.Label,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=53691-291060&t=wyKe5rNq2KHENfRl-11',
+  {
+    variant: { type: 'illustration' },
+    example: () => <Notice.Label>{/* svg or illustration from the library */}</Notice.Label>,
+  },
+);
+
+figma.connect(
+  Notice,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=13327-111793&t=wyKe5rNq2KHENfRl-11',
+  {
+    props: {
+      theme: figma.enum('theme', {
+        '🟢 limit': 'success',
+        '🔴 danger': 'danger',
+        '🟠 warning': 'warning',
+        '⚪️ muted': 'muted',
+      }),
+      actions: figma.boolean('actions', {
+        true: figma.children('Button'),
+        false: undefined,
+      }),
+      // closable: figma.boolean('closable'), // commented because don't want to show this prop by default
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+    },
+    example: ({ theme, title, actions, text }) => (
+      <Notice aria-label={/* Add aria-label */} theme={theme}>
+        <Notice.Label>{/* svg or illustration from the library */}</Notice.Label>
+        <Notice.Content>
+          <Notice.Title>
+            {title}
+          </Notice.Title>
+          <Notice.Text>
+            {text}
+          </Notice.Text>
+          <Notice.Actions>
+            {actions}
+          </Notice.Actions>
+        </Notice.Content>
+        <Notice.Close />
+      </Notice>
+    ),
+  },
+);
+
+// Notice with custom layout: buttons on the right
+
+figma.connect(
+  Notice,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=20870-123861&t=wyKe5rNq2KHENfRl-11',
+  {
+    props: {
+      theme: figma.enum('theme', {
+        '🟢 limit': 'success',
+        '🔴 danger': 'danger',
+        '🟠 warning': 'warning',
+        '⚪️ muted': 'muted',
+      }),
+      actions: figma.boolean('actions', {
+        true: figma.children('Button'),
+        false: undefined,
+      }),
+      // closable: figma.boolean('closeIcon'), // commented because don't want to show this prop by default
+      text: figma.textContent('↳ text'),
+      icon: figma.children('Notice.Label'),
+    },
+    example: ({ theme, actions, text, icon }) => (
+      <Notice aria-label={/* Add aria-label */} theme={theme}>
+        <Notice.Label>{icon}</Notice.Label>
+        <Notice.Content>
+          <Notice.Text>
+            {text}
+          </Notice.Text>
+          <Notice.Actions>
+            {actions}
+          </Notice.Actions>
+        </Notice.Content>
+        <Notice.Close />
+      </Notice>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/NoticeBubble.figma.jsx b/figma/mappings/core-components/NoticeBubble.figma.jsx
new file mode 100644
index 0000000000..1f318934a8
--- /dev/null
+++ b/figma/mappings/core-components/NoticeBubble.figma.jsx
@@ -0,0 +1,10 @@
+import figma from '@figma/code-connect/react';
+import { NoticeBubbleContainer } from '@semcore/ui/notice-bubble';
+
+figma.connect(
+  NoticeBubbleContainer,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10142-195417&t=wyKe5rNq2KHENfRl-11',
+  {
+    example: () => <NoticeBubbleContainer manager={/* add NoticeBubbleManager, check examples in documentation */} />,
+  },
+);
diff --git a/figma/mappings/core-components/NoticeGlobal.figma.jsx b/figma/mappings/core-components/NoticeGlobal.figma.jsx
new file mode 100644
index 0000000000..74c30bb7ec
--- /dev/null
+++ b/figma/mappings/core-components/NoticeGlobal.figma.jsx
@@ -0,0 +1,29 @@
+import figma from '@figma/code-connect/react';
+import NoticeGlobal from '@semcore/ui/notice-global';
+
+figma.connect(
+  NoticeGlobal,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10270-107436&t=wyKe5rNq2KHENfRl-11',
+  {
+    props: {
+      theme: figma.enum('theme', {
+        '🌚 neutral': 'neutral',
+        '🔵 info': 'info',
+        '🟢 success': 'success',
+        '🟠 warning': 'warning',
+        '🔴 danger': 'danger',
+      }),
+      //   closable: figma.boolean('closable'), // commented because don't want to show this prop by default
+      content: figma.textContent('↳ text'),
+      actions: figma.children('Button'),
+    },
+    example: ({ theme, content, actions }) => (
+      <NoticeGlobal theme={theme}>
+        <NoticeGlobal.Content gap={2} alignItems='center'>
+          {content}
+          {actions}
+        </NoticeGlobal.Content>
+      </NoticeGlobal>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/NoticeSmart.figma.jsx b/figma/mappings/core-components/NoticeSmart.figma.jsx
new file mode 100644
index 0000000000..037fcf11ff
--- /dev/null
+++ b/figma/mappings/core-components/NoticeSmart.figma.jsx
@@ -0,0 +1,36 @@
+import figma from '@figma/code-connect/react';
+import { NoticeSmart } from '@semcore/ui/notice';
+
+figma.connect(
+  NoticeSmart,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10097-57985&t=wyKe5rNq2KHENfRl-11',
+  {
+    props: {
+      theme: figma.enum('theme', {
+        '🟢 limit': 'success',
+        '🔴 danger': 'danger',
+        '🟠 warning': 'warning',
+        '⚪️ muted': 'muted',
+      }),
+      // actions: figma.boolean('actions', {
+      //   true: figma.children('*'),
+      //   false: undefined,
+      // }),
+      // closable: figma.boolean('closable'), // commented because don't want to show this prop by default
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      // icon: figma.children('Notice.Label'),
+    },
+    example: ({ theme, title, text }) => (
+      <NoticeSmart
+        aria-label={/* Add aria-label */}
+        theme={theme}
+        label={/* icon or illustration from the library */}
+        title={title}
+        actions={/* add Buttons here */}
+      >
+        {text}
+      </NoticeSmart>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Pagination.figma.jsx b/figma/mappings/core-components/Pagination.figma.jsx
new file mode 100644
index 0000000000..94e3c4f138
--- /dev/null
+++ b/figma/mappings/core-components/Pagination.figma.jsx
@@ -0,0 +1,49 @@
+import figma from '@figma/code-connect';
+import Pagination from '@semcore/ui/pagination';
+import Select from '@semcore/ui/select';
+
+figma.connect(
+  Pagination,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10270-109137',
+  {
+    variant: { 'select (# of rows)': false },
+    props: {
+      size: figma.enum('size', { L: 'l' }),
+    },
+    example: (p) => (
+      <Pagination
+        size={p.size}
+        currentPage={/* number */}
+        totalPages={/* number */}
+      />
+    ),
+  });
+
+figma.connect(
+  Pagination,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10270-109137',
+  {
+    variant: { 'select (# of rows)': true },
+    props: {
+      size: figma.enum('size', { L: 'l' }),
+      ml: figma.enum('size', { M: 4, L: 5 }),
+    },
+    example: (p) => (
+      <Pagination
+        size={p.size}
+        currentPage={/* number */}
+        totalPages={/* number */}
+      >
+        <Pagination.FirstPage />
+        <Pagination.PrevPage />
+        <Pagination.NextPage />
+        <Pagination.PageInput />
+        <Pagination.TotalPages />
+        <Select
+          {...p}
+          options={/* options */}
+          value={/* current value */}
+        />
+      </Pagination>
+    ),
+  });
diff --git a/figma/mappings/core-components/Pills.figma.jsx b/figma/mappings/core-components/Pills.figma.jsx
new file mode 100644
index 0000000000..ce3b956f32
--- /dev/null
+++ b/figma/mappings/core-components/Pills.figma.jsx
@@ -0,0 +1,73 @@
+import figma from '@figma/code-connect/react';
+import Pills from '@semcore/ui/pills';
+
+figma.connect(
+  Pills.Item,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/%E2%9D%96-Core-Components-(Refactoring)?node-id=10174-91951&t=hkjybGSILqRb6bQU-4',
+  {
+    props: {
+      disabled: figma.enum('state', { disabled: true }),
+      selected: figma.boolean('selected'),
+      addonLeft: figma.enum('pill type', {
+        default: figma.boolean('← addon', {
+          true: <Pills.Item.Addon tag={addonTag} {...addonProps} />,
+        }),
+      }),
+      addonRight: figma.enum('pill type', {
+        default: figma.boolean('addon →', {
+          true: <Pills.Item.Addon tag={addonTag} {...addonProps}>{/* addon text */}</Pills.Item.Addon>,
+        }),
+      }),
+      content: figma.enum('pill type', {
+        'default': figma.boolean('← addon', {
+          true: <Pills.Item.Text>{/* pill text */}</Pills.Item.Text>,
+          false: figma.boolean('addon →', {
+            true: <Pills.Item.Text>{/* pill text */}</Pills.Item.Text>,
+            false: '{/* pill text */}',
+          }),
+        }),
+        'icon only': <Pills.Item.Addon tag={iconName} {...iconProps} />,
+        'king': (
+          <Pills.Item.Text
+            style={{
+              display: 'flex',
+              flexDirection: 'column',
+              gap: 'var(--intergalactic-spacing-1x)',
+              margin: 'var(--intergalactic-spacing-3x) var(--intergalactic-spacing-5x)',
+            }}
+          >
+            {/* first line */}
+            {/* second line */}
+          </Pills.Item.Text>
+        ),
+      }),
+      style: figma.enum('pill type', {
+        king: {
+          height: 'inherit',
+          alignItems: 'stretch',
+          textAlign: 'inherit',
+          whiteSpace: 'normal',
+        },
+      }),
+    },
+    example: ({ disabled, selected, content, addonLeft, addonRight, style }) => (
+      <Pills.Item disabled={disabled} selected={selected} style={style}>
+        {addonLeft}
+        {content}
+        {addonRight}
+      </Pills.Item>
+    ),
+  },
+);
+
+figma.connect(
+  Pills,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/%E2%9D%96-Core-Components-(Refactoring)?node-id=10174-91970&t=hkjybGSILqRb6bQU-4',
+  {
+    props: {
+      size: figma.enum('size', { L: 'l' }),
+      style: figma.enum('type', { king: { alignItems: 'stretch' } }),
+    },
+    example: (props) => <Pills {...props}>{/* Select individual Pills.Items to inspect their props */}</Pills>,
+  },
+);
diff --git a/figma/mappings/core-components/ProductHead.Info.Item.figma.template.js b/figma/mappings/core-components/ProductHead.Info.Item.figma.template.js
new file mode 100644
index 0000000000..34e15d5a79
--- /dev/null
+++ b/figma/mappings/core-components/ProductHead.Info.Item.figma.template.js
@@ -0,0 +1,28 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=14188-117046
+// import { Info } from '@semcore/ui/product-head'
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const textOnly = instance.getBoolean('text only');
+const label = instance.getBoolean('label', {
+  true: textOnly
+    ? ` label="${instance.findText('Info.Item.Label')?.textContent}"`
+    : `<Info.Item.Label>${instance.findText('Info.Item.Label')?.textContent}</Info.Item.Label>`,
+});
+
+let children = instance.findLayers(() => true);
+if (label) children = children.slice(1);
+const infoItem = layerArrayCode(children);
+
+let labelWarning;
+if (!textOnly && label) labelWarning = '{/* make sure to connect the label with the control appropriately */}';
+if (!textOnly && !label) labelWarning = '{/* make sure to label the control appropriately */}';
+
+export default {
+  example: figma.tsx`
+<Info.Item${textOnly ? label : ''}>
+  ${labelWarning}${!textOnly ? label : ''}${infoItem}
+</Info.Item>
+  `,
+  id: 'Info.Item',
+};
diff --git a/figma/mappings/core-components/ProductHead.figma.template.js b/figma/mappings/core-components/ProductHead.figma.template.js
new file mode 100644
index 0000000000..58018b468c
--- /dev/null
+++ b/figma/mappings/core-components/ProductHead.figma.template.js
@@ -0,0 +1,45 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=55882-8656
+// import ProductHead from '@semcore/ui/product-head'
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const mobileFeedback = instance.getBoolean('mobile', {
+  true: instanceCode(instance, 'Send feedback'),
+});
+
+const breadcrumbs = instanceCode(instance, 'Breadcrumbs');
+
+const links = instance.findConnectedInstances(() => true, { path: ['ProductHead.Row', 'ProductHead.Links'] });
+const linksCode = layerArrayCode(links, 'ProductHead.Links');
+
+const buttons = instance.findConnectedInstances(() => true, { path: ['ProductHead.Row', 'ProductHead.Buttons'] });
+const buttonsCode = layerArrayCode(buttons, 'ProductHead.Buttons');
+
+const info = instance.findConnectedInstances(() => true, { path: ['ProductHead.Row', 'Info'] });
+const infoCode = layerArrayCode(info, 'Info');
+
+const toolName = instance.findText('tool name')?.textContent?.replace(/.*/, 'toolName="$&"');
+
+export default {
+  example: figma.tsx`
+<ProductHead>
+  ${breadcrumbs || linksCode || mobileFeedback ? '<ProductHead.Row>' : undefined}
+    ${breadcrumbs}
+    ${linksCode}
+    ${mobileFeedback}
+  ${breadcrumbs || linksCode || mobileFeedback ? '</ProductHead.Row>' : undefined}
+
+  <ProductHead.Row>
+    <Title ${toolName}>
+      {/* title content */}
+    </Title>
+    ${buttonsCode}
+  </ProductHead.Row>
+
+  ${infoCode ? '<ProductHead.Row>' : undefined}
+  ${infoCode}
+  ${infoCode ? '</ProductHead.Row>' : undefined}
+</ProductHead>
+  `,
+  id: 'ProductHead',
+};
diff --git a/figma/mappings/core-components/ProgressBar.figma.jsx b/figma/mappings/core-components/ProgressBar.figma.jsx
new file mode 100644
index 0000000000..66061700fb
--- /dev/null
+++ b/figma/mappings/core-components/ProgressBar.figma.jsx
@@ -0,0 +1,30 @@
+import figma from '@figma/code-connect';
+import ProgressBar from '@semcore/ui/progress-bar';
+
+figma.connect(
+  ProgressBar,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10142-113186&m=dev',
+  {
+    props: {
+      size: figma.enum('size', {
+        S: 's',
+        M: 'm',
+        L: 'l',
+      }),
+      theme: figma.enum('theme', {
+        invert: 'invert',
+        dark: 'dark',
+      }),
+    },
+
+    example: ({ size, theme }) => (
+      <ProgressBar
+        value={/* number */}
+        size={size}
+        theme={theme}
+        aria-valuetext={/* aria-valuetext */}
+        aria-label={/* Add your aria-label */}
+      />
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Radio.figma.jsx b/figma/mappings/core-components/Radio.figma.jsx
new file mode 100644
index 0000000000..7f312b1565
--- /dev/null
+++ b/figma/mappings/core-components/Radio.figma.jsx
@@ -0,0 +1,44 @@
+import figma from '@figma/code-connect';
+import Radio from '@semcore/ui/radio';
+
+figma.connect(
+  Radio,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=11941-108998&t=uvqbUJPa7hkmPVOa-11',
+  {
+    props: {
+      label: figma.textContent('↳ text'),
+      size: figma.enum('size', {
+        L: 'l',
+        M: 'm',
+      }),
+      checked: figma.boolean('checked'),
+      invalid: figma.enum('state', {
+        invalid: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      addonLeft: figma.boolean('← addon', {
+        true: figma.children('← - - addon properties'),
+        false: undefined,
+      }),
+      addonRight: figma.boolean('addon →', {
+        true: figma.children('addon properties - - →'),
+        false: undefined,
+      }),
+      textAddon: figma.boolean('textAddon →'),
+    },
+    example: ({ label, size, checked, indeterminate, invalid, disabled, addonLeft, addonRight, textAddon }) => (
+      <Radio
+        label={label}
+        size={size}
+        checked={checked}
+        invalid={invalid}
+        disabled={disabled}
+      // addonLeft={addonLeft}
+      // addonRight={addonRight}
+      // textAddon={textAddon}
+      />
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/RadioGroup.figma.jsx b/figma/mappings/core-components/RadioGroup.figma.jsx
new file mode 100644
index 0000000000..0cad0d3e4c
--- /dev/null
+++ b/figma/mappings/core-components/RadioGroup.figma.jsx
@@ -0,0 +1,23 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+import Radio, { RadioGroup } from '@semcore/ui/radio';
+
+figma.connect(
+  RadioGroup,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=19530-124643&t=uvqbUJPa7hkmPVOa-11',
+  {
+    props: {
+      size: figma.enum('size', {
+        L: 'l',
+        M: 'm',
+      }),
+    },
+    example: ({ size }) => (
+      <RadioGroup name='radio' aria-labelledby={/* Add label's id */}>
+        <Flex direction='column' gap={3}>
+          <Radio size={size} label={/* Add your label */} />
+        </Flex>
+      </RadioGroup>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/ScrollArea.figma.template.js b/figma/mappings/core-components/ScrollArea.figma.template.js
new file mode 100644
index 0000000000..cde1ead4bf
--- /dev/null
+++ b/figma/mappings/core-components/ScrollArea.figma.template.js
@@ -0,0 +1,22 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=55695-2026
+// import {ScrollArea} from '@semcore/ui/base-components'
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+let shadow;
+if (
+  instance.getBoolean('fader ↑') ||
+  instance.getBoolean('fader ↓') ||
+  instance.getBoolean('fader ->') ||
+  instance.getBoolean('<- fader')
+) {
+  shadow = 'shadow';
+};
+
+export default {
+  example: figma.tsx`<ScrollArea ${shadow}>
+  {/* content */}
+</ScrollArea>
+  `,
+  id: 'ScrollArea',
+};
diff --git a/figma/mappings/core-components/SidePanel.figma.jsx b/figma/mappings/core-components/SidePanel.figma.jsx
new file mode 100644
index 0000000000..5ed881a703
--- /dev/null
+++ b/figma/mappings/core-components/SidePanel.figma.jsx
@@ -0,0 +1,49 @@
+import figma from '@figma/code-connect/react';
+import SidePanel from '@semcore/ui/side-panel';
+
+figma.connect(
+  SidePanel.Header,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10270-117923&t=8tFmR59x5n76jWX8-11',
+  {
+    props: {
+      title: figma.textContent('↳ title'),
+    },
+    example: ({ title }) => (
+      <SidePanel.Header>
+        <SidePanel.Back>{/* Add button label */}</SidePanel.Back>
+        <SidePanel.Title>{title}</SidePanel.Title>
+      </SidePanel.Header>
+    ),
+  },
+);
+
+figma.connect(
+  SidePanel.Footer,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10270-117989&t=8tFmR59x5n76jWX8-11',
+  {
+    props: {
+      children: figma.children('Button'),
+    },
+    example: ({ children }) => <SidePanel.Footer justifyContent='center' pt={2}>{children}</SidePanel.Footer>,
+  },
+);
+
+figma.connect(
+  SidePanel,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11578-136509&t=8tFmR59x5n76jWX8-11',
+  {
+    props: {
+      childrenHeader: figma.children('SidePanel.Header'),
+      childrenFooter: figma.children('SidePanel.Footer'),
+    },
+    example: ({ childrenHeader, childrenFooter }) => (
+      <SidePanel aria-label='{/* Add your aria-label */}'>
+        <SidePanel.Close />
+        <SidePanel.Back>{/* Add button label */}</SidePanel.Back>
+        {childrenHeader}
+        <SidePanel.Body>{/* content */}</SidePanel.Body>
+        {childrenFooter}
+      </SidePanel>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Skeleton.figma.jsx b/figma/mappings/core-components/Skeleton.figma.jsx
new file mode 100644
index 0000000000..71c257aa92
--- /dev/null
+++ b/figma/mappings/core-components/Skeleton.figma.jsx
@@ -0,0 +1,214 @@
+import figma from '@figma/code-connect';
+import Skeleton, { LineChartSkeleton,
+  AreaChartSkeleton,
+  BarChartSkeleton,
+  VennChartSkeleton,
+  ScatterPlotChartSkeleton,
+  BubbleChartSkeleton,
+  RadialTreeChartSkeleton,
+  HistogramChartSkeleton,
+  DonutChartSkeleton,
+} from '@semcore/ui/skeleton';
+
+// Different skeleton shapes which are not components in the code
+
+figma.connect(
+  Skeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: 'quadrant chart' },
+
+    example: () => <Skeleton>{/* svg path */}</Skeleton>,
+  },
+);
+
+figma.connect(
+  Skeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: 'chord chart' },
+    example: () => <Skeleton>{/* svg path */}</Skeleton>,
+  },
+);
+
+figma.connect(
+  Skeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: 'polar radar chart' },
+
+    example: () => <Skeleton>{/* svg path */}</Skeleton>,
+  },
+);
+
+figma.connect(
+  Skeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: 'radar chart' },
+
+    example: () => <Skeleton>{/* svg path */}</Skeleton>,
+  },
+);
+
+figma.connect(
+  Skeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: 'sankey chart' },
+
+    example: () => <Skeleton>{/* svg path */}</Skeleton>,
+  },
+);
+
+figma.connect(
+  Skeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: 'tag cloud' },
+
+    example: () => <Skeleton>{/* svg path */}</Skeleton>,
+  },
+);
+
+// Chart skeletons
+
+figma.connect(
+  LineChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/branch/XJYTlbnEuQzYxXGo3m1RYu/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=atOv2tCpAVZguKAs-11',
+  {
+    variant: { chart: '📈 line chart' },
+
+    example: () => <LineChartSkeleton />,
+  },
+);
+
+figma.connect(
+  LineChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/branch/XJYTlbnEuQzYxXGo3m1RYu/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=atOv2tCpAVZguKAs-11',
+  {
+    variant: { chart: '📈 line chart (monotone)' },
+
+    example: () => <LineChartSkeleton type='monotone' />,
+  },
+);
+
+figma.connect(
+  AreaChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/branch/XJYTlbnEuQzYxXGo3m1RYu/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=atOv2tCpAVZguKAs-11',
+  {
+    variant: { chart: 'area chart' },
+
+    example: () => <LineChartSkeleton />,
+  },
+);
+
+figma.connect(
+  AreaChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/branch/XJYTlbnEuQzYxXGo3m1RYu/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=atOv2tCpAVZguKAs-11',
+  {
+    variant: { chart: 'area chart (monotone)' },
+
+    example: () => <AreaChartSkeleton type='monotone' />,
+  },
+);
+
+figma.connect(
+  BarChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: '📊 bar chart' },
+
+    example: () => <BarChartSkeleton />,
+  },
+);
+
+figma.connect(
+  BarChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: '📊 bar chart (vertical)' },
+
+    example: () => <BarChartSkeleton layout='vertical' />,
+  },
+);
+
+figma.connect(
+  HistogramChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: '📊 histogram' },
+
+    example: () => <HistogramChartSkeleton />,
+  },
+);
+
+figma.connect(
+  HistogramChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: '📊 histogram (vertical)' },
+
+    example: () => <HistogramChartSkeleton layout='vertical' />,
+  },
+);
+
+figma.connect(
+  DonutChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: '🍩 donut chart' },
+
+    example: () => <DonutChartSkeleton />,
+  },
+);
+
+figma.connect(
+  DonutChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: '🍩 donut chart (halfsize)' },
+
+    example: () => <DonutChartSkeleton halfsize />,
+  },
+);
+
+figma.connect(
+  ScatterPlotChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: '🛁 scatter plot chart' },
+
+    example: () => <ScatterPlotChartSkeleton />,
+  },
+);
+
+figma.connect(
+  BubbleChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: '🛁 bubble chart' },
+
+    example: () => <BubbleChartSkeleton />,
+  },
+);
+
+figma.connect(
+  VennChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: 'venn chart' },
+
+    example: () => <VennChartSkeleton />,
+  },
+);
+
+figma.connect(
+  RadialTreeChartSkeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147008&t=MuIvHlIpGrVpSu9j-11',
+  {
+    variant: { chart: 'radial tree chart' },
+
+    example: () => <RadialTreeChartSkeleton />,
+  },
+);
diff --git a/figma/mappings/core-components/SkeletonBone.figma.jsx b/figma/mappings/core-components/SkeletonBone.figma.jsx
new file mode 100644
index 0000000000..59681a763b
--- /dev/null
+++ b/figma/mappings/core-components/SkeletonBone.figma.jsx
@@ -0,0 +1,18 @@
+import figma from '@figma/code-connect';
+import Skeleton from '@semcore/ui/skeleton';
+
+// Skeleton bone
+
+figma.connect(
+  Skeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-147009&t=Fgs2Jv2CPgCOdctF-11',
+  {
+    props: {
+      theme: figma.enum('theme', {
+        dark: 'dark',
+        invert: 'invert',
+      }),
+    },
+    example: ({ theme }) => <Skeleton theme={theme} />,
+  },
+);
diff --git a/figma/mappings/core-components/SkeletonShape.figma.jsx b/figma/mappings/core-components/SkeletonShape.figma.jsx
new file mode 100644
index 0000000000..82f206209c
--- /dev/null
+++ b/figma/mappings/core-components/SkeletonShape.figma.jsx
@@ -0,0 +1,10 @@
+import figma from '@figma/code-connect';
+import Skeleton from '@semcore/ui/skeleton';
+
+figma.connect(
+  Skeleton,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=52851-1247&t=KO1tOJU4Y49Pygq3-11',
+  {
+    example: () => <Skeleton>{/* svg path */}</Skeleton>,
+  },
+);
diff --git a/figma/mappings/core-components/SkeletonText.figma.jsx b/figma/mappings/core-components/SkeletonText.figma.jsx
new file mode 100644
index 0000000000..d21ef5e703
--- /dev/null
+++ b/figma/mappings/core-components/SkeletonText.figma.jsx
@@ -0,0 +1,20 @@
+import figma from '@figma/code-connect';
+import Skeleton from '@semcore/ui/skeleton';
+
+// Skeleton for hiding text
+
+figma.connect(
+  Skeleton.Text,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10328-146975&t=Fgs2Jv2CPgCOdctF-11',
+  {
+    props: {
+      theme: figma.nestedProps('Skeleton', {
+        theme: figma.enum('theme', {
+          dark: 'dark',
+          invert: 'invert',
+        }),
+      }),
+    },
+    example: ({ theme }) => <Skeleton theme={theme.theme}><Skeleton.Text amount={3} /></Skeleton>,
+  },
+);
diff --git a/figma/mappings/core-components/Slider.figma.jsx b/figma/mappings/core-components/Slider.figma.jsx
new file mode 100644
index 0000000000..6f5d10ace5
--- /dev/null
+++ b/figma/mappings/core-components/Slider.figma.jsx
@@ -0,0 +1,56 @@
+import figma from '@figma/code-connect/react';
+import { Flex } from '@semcore/ui/base-components';
+import Slider from '@semcore/ui/slider';
+
+figma.connect(
+  Slider.Knob,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10272-140147&t=57sa2Koua22LmcsR-11',
+  {
+    example: () => <Slider.Knob />,
+  },
+);
+
+figma.connect(
+  Slider.Bar,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11441-126125&t=57sa2Koua22LmcsR-11',
+  {
+    example: () => <Slider.Bar />,
+  },
+);
+
+figma.connect(
+  Slider,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10272-140102&t=57sa2Koua22LmcsR-11',
+  {
+    props: {
+      disabled: figma.boolean('disabled'),
+      options: figma.boolean('options', {
+        true: '[{ /* values */ }]',
+        false: undefined,
+      }),
+    },
+    example: ({ disabled, options }) => <Slider disabled={disabled} options={options} />,
+  },
+);
+
+figma.connect(
+  Slider,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=42066-2468&t=57sa2Koua22LmcsR-11',
+  {
+    props: {
+      disabled: figma.boolean('disabled'),
+      input: figma.children('InputNumber'),
+    },
+    example: ({ disabled, input }) => (
+      <Flex gap={4}>
+        <Slider
+          disabled={disabled}
+        >
+          <Slider.Bar />
+          <Slider.Knob />
+        </Slider>
+        {input}
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Spin.figma.jsx b/figma/mappings/core-components/Spin.figma.jsx
new file mode 100644
index 0000000000..b9b40f0627
--- /dev/null
+++ b/figma/mappings/core-components/Spin.figma.jsx
@@ -0,0 +1,86 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+import Spin from '@semcore/ui/spin';
+import { Text } from '@semcore/ui/typography';
+
+figma.connect(
+  Spin,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10041-43274&t=zWV92Vho57lBOgpd-11',
+  {
+    props: {
+      size: figma.enum('size', {
+        'XS (16 х 16)': 'xs',
+        'S (20 х 20)': 's',
+        'M (24 х 24)': 'm',
+        'L (32 х 32)': 'l',
+        'XL (48 х 48)': 'xl',
+        'XXL (72 х 72)': 'xxl',
+      }),
+      theme: figma.enum('theme', {
+        dark: 'dark',
+        invert: 'invert',
+      }),
+    },
+    example: ({ size, theme }) => <Spin size={size} theme={theme} />,
+  },
+);
+
+figma.connect(
+  Spin,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=52845-162&t=zWV92Vho57lBOgpd-11',
+  {
+    variant: { 'text placement': 'right' },
+    props: {
+      size: figma.enum('size', {
+        'XS (16 x 16)': 'xs',
+        'S (20 x 20)': 's',
+        'M (24 x 24)': 'm',
+        'L (32 x 32)': 'l',
+        'XL (40 x 40)': 'xl',
+        'XXL (72 x 72)': 'xxl',
+      }),
+      theme: figma.enum('theme', {
+        dark: 'dark',
+        invert: 'invert',
+      }),
+      spin: figma.children('Spin'),
+      text: figma.textContent('↳ text'),
+    },
+    example: ({ spin, text }) => (
+      <Flex alignItems='center' gap={/* margin depends on text and spin size */}>
+        {spin}
+        <Text size={/* fontSize */} color='text-secondary'>{text}</Text>
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  Spin,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=52845-162&t=zWV92Vho57lBOgpd-11',
+  {
+    variant: { 'text placement': 'bottom' },
+    props: {
+      size: figma.enum('size', {
+        'XS (16 x 16)': 'xs',
+        'S (20 x 20)': 's',
+        'M (24 x 24)': 'm',
+        'L (32 x 32)': 'l',
+        'XL (40 x 40)': 'xl',
+        'XXL (72 x 72)': 'xxl',
+      }),
+      theme: figma.enum('theme', {
+        dark: 'dark',
+        invert: 'invert',
+      }),
+      spin: figma.children('Spin'),
+      text: figma.textContent('↳ text'),
+    },
+    example: ({ spin, text }) => (
+      <Flex alignItems='center' direction='column' gap={/* margin depends on text and spin size */}>
+        {spin}
+        <Text size={/* fontSize */} color='text-secondary'>{text}</Text>
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/SpinContainer.figma.jsx b/figma/mappings/core-components/SpinContainer.figma.jsx
new file mode 100644
index 0000000000..82c8e446f9
--- /dev/null
+++ b/figma/mappings/core-components/SpinContainer.figma.jsx
@@ -0,0 +1,26 @@
+import figma from '@figma/code-connect';
+import SpinContainer from '@semcore/ui/spin-container';
+
+figma.connect(
+  SpinContainer,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10966-127734&t=Fgs2Jv2CPgCOdctF-11',
+  {
+    props: {
+      theme: figma.enum('theme', {
+        dark: 'dark',
+        invert: 'invert',
+      }),
+      size: figma.nestedProps('Spin', {
+        size: figma.enum('size', {
+          'XS (16 x 16)': 'xs',
+          'S (20 x 20)': 's',
+          'M (24 x 24)': 'm',
+          'L (32 x 32)': 'l',
+          'XL (40 x 40)': 'xl',
+          'XXL (72 x 72)': 'xxl',
+        }),
+      }),
+    },
+    example: ({ size, theme }) => <SpinContainer loading size={size.size} theme={theme} aria-live='polite' role='status'>{/* Place content here */}</SpinContainer>,
+  },
+);
diff --git a/figma/mappings/core-components/Switch.figma.jsx b/figma/mappings/core-components/Switch.figma.jsx
new file mode 100644
index 0000000000..9c0a15697c
--- /dev/null
+++ b/figma/mappings/core-components/Switch.figma.jsx
@@ -0,0 +1,69 @@
+import figma from '@figma/code-connect';
+import Switch from '@semcore/ui/switch';
+
+figma.connect(
+  Switch,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10133-80383&t=Q0bSsRErIQ7IEZAU-11',
+  {
+    variant: { icon: 'false' },
+    props: {
+      label: figma.textContent('↳ text'),
+      size: figma.enum('size', {
+        XL: 'xl',
+        L: 'l',
+        M: 'm',
+      }),
+      checked: figma.boolean('checked'),
+      theme: figma.enum('theme', {
+        info: 'info',
+        success: 'success',
+      }),
+    },
+    example: ({ label, size, checked, theme }) => (
+      <Switch
+        size={size}
+        theme={theme}
+      >
+        <Switch.Value checked={checked} />
+        <Switch.Addon>
+          {label}
+        </Switch.Addon>
+      </Switch>
+    ),
+  },
+);
+
+figma.connect(
+  Switch,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10133-80383&t=Q0bSsRErIQ7IEZAU-11',
+  {
+    variant: { icon: 'true' },
+    props: {
+      label: figma.textContent('↳ text'),
+      size: figma.enum('size', {
+        XL: 'xl',
+        L: 'l',
+        M: 'm',
+      }),
+      checked: figma.boolean('checked'),
+      theme: figma.enum('theme', {
+        info: 'info',
+        success: 'success',
+      }),
+      icon: figma.boolean('icon', {
+        true: figma.instance('↳ icon'),
+        false: undefined,
+      }),
+    },
+    example: ({ label, size, checked, icon }) => (
+      <Switch
+        size={size}
+      >
+        <Switch.Value theme={theme} checked={checked}>{icon}</Switch.Value>
+        <Switch.Addon>
+          {label}
+        </Switch.Addon>
+      </Switch>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/TabLine.figma.jsx b/figma/mappings/core-components/TabLine.figma.jsx
new file mode 100644
index 0000000000..7037035651
--- /dev/null
+++ b/figma/mappings/core-components/TabLine.figma.jsx
@@ -0,0 +1,94 @@
+import figma from '@figma/code-connect/react';
+import TabLine from '@semcore/ui/tab-line';
+
+figma.connect(
+  TabLine.Item,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10212-118088&t=I48qqNRyVr8Tdi87-11',
+  {
+    variant: { 'textAddon →': 'false' },
+    props: {
+      label: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      addonLeft: figma.boolean('← addon', {
+        true: figma.children('← - - addon properties'),
+        false: undefined,
+      }),
+      addonRight: figma.boolean('addon →', {
+        true: figma.children('addon properties - - →'),
+        false: undefined,
+      }),
+      dot: figma.children('Dot'),
+    },
+    example: ({ selected, disabled, addonLeft, addonRight, label, dot }) => (
+      <TabLine.Item value={/* value */} selected={selected} disabled={disabled} addonLeft={addonLeft} addonRight={addonRight}>
+        <TabLine.Item.Text>{label}</TabLine.Item.Text>
+        {dot}
+      </TabLine.Item>
+    ),
+  },
+);
+
+figma.connect(
+  TabLine.Item,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10212-118088&t=I48qqNRyVr8Tdi87-11',
+  {
+    variant: { 'textAddon →': 'true' },
+    props: {
+      label: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      addonLeft: figma.boolean('← addon', {
+        true: figma.children('← - - addon properties'),
+        false: undefined,
+      }),
+      addonRight: figma.boolean('addon →', {
+        true: figma.children('addon properties - - →'),
+        false: undefined,
+      }),
+      textAddon: figma.boolean('textAddon →', {
+        true: figma.textContent('↳ textAddon'),
+        false: undefined,
+      }),
+      dot: figma.children('Dot'),
+    },
+    example: ({ selected, disabled, addonLeft, addonRight, label, textAddon, dot }) => (
+      <TabLine.Item value={/* value */} selected={selected} disabled={disabled} addonLeft={addonLeft} addonRight={addonRight}>
+        <TabLine.Item.Text>{label}</TabLine.Item.Text>
+        <TabLine.Item.Addon>{textAddon}</TabLine.Item.Addon>
+        {dot}
+      </TabLine.Item>
+    ),
+  },
+);
+
+figma.connect(
+  TabLine,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10212-95422&t=I48qqNRyVr8Tdi87-11',
+  {
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      underlined: figma.boolean('underlined', {
+        true: true,
+        false: false,
+      }),
+      children: figma.children('TabLine.Item'),
+    },
+    example: ({ size, underlined, children }) => (
+      <TabLine size={size} underlined={underlined}>
+        {children}
+      </TabLine>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/TabPanel.figma.jsx b/figma/mappings/core-components/TabPanel.figma.jsx
new file mode 100644
index 0000000000..164dd6902d
--- /dev/null
+++ b/figma/mappings/core-components/TabPanel.figma.jsx
@@ -0,0 +1,86 @@
+import figma from '@figma/code-connect/react';
+import TabPanel from '@semcore/ui/tab-panel';
+
+figma.connect(
+  TabPanel.Item,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10261-95182&t=I48qqNRyVr8Tdi87-11',
+  {
+    variant: { 'textAddon →': 'false' },
+    props: {
+      label: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      addonLeft: figma.boolean('← addon', {
+        true: figma.children('← - - addon properties'),
+        false: undefined,
+      }),
+      addonRight: figma.boolean('addon →', {
+        true: figma.children('addon properties - - →'),
+        false: undefined,
+      }),
+      dot: figma.children('Dot'),
+    },
+    example: ({ selected, disabled, addonLeft, addonRight, label, dot }) => (
+      <TabPanel.Item value={/* value */} selected={selected} disabled={disabled} addonLeft={addonLeft} addonRight={addonRight}>
+        <TabPanel.Item.Text>{label}</TabPanel.Item.Text>
+        {dot}
+      </TabPanel.Item>
+    ),
+  },
+);
+
+figma.connect(
+  TabPanel.Item,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10261-95182&t=I48qqNRyVr8Tdi87-11',
+  {
+    variant: { 'textAddon →': 'true' },
+    props: {
+      label: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      addonLeft: figma.boolean('← addon', {
+        true: figma.children('← - - addon properties'),
+        false: undefined,
+      }),
+      addonRight: figma.boolean('addon →', {
+        true: figma.children('addon properties - - →'),
+        false: undefined,
+      }),
+      textAddon: figma.boolean('textAddon →', {
+        true: figma.textContent('↳ textAddon'),
+        false: undefined,
+      }),
+      dot: figma.children('Dot'),
+    },
+    example: ({ selected, disabled, addonLeft, addonRight, label, textAddon, dot }) => (
+      <TabPanel.Item value={/* value */} selected={selected} disabled={disabled} addonLeft={addonLeft} addonRight={addonRight}>
+        <TabPanel.Item.Text>{label}</TabPanel.Item.Text>
+        <TabPanel.Item.Addon>{textAddon}</TabPanel.Item.Addon>
+        {dot}
+      </TabPanel.Item>
+    ),
+  },
+);
+
+figma.connect(
+  TabPanel,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=53542-883&t=I48qqNRyVr8Tdi87-11',
+  {
+    props: {
+      children: figma.children('TabPanel.Item'),
+    },
+    example: ({ children }) => (
+      <TabPanel aria-label='/* Add aria-label */'>
+        {children}
+      </TabPanel>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Tag.figma.jsx b/figma/mappings/core-components/Tag.figma.jsx
new file mode 100644
index 0000000000..2e978078c0
--- /dev/null
+++ b/figma/mappings/core-components/Tag.figma.jsx
@@ -0,0 +1,75 @@
+import figma from '@figma/code-connect';
+import Tag from '@semcore/ui/tag';
+
+figma.connect(
+  Tag,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=44497-213147&t=0hjqYEp7RXqjnbR7-11',
+  {
+    variant: { 'close button': 'false' },
+    props: {
+      label: figma.textContent('↳ text'),
+      size: figma.enum('size', {
+        XL: 'xl',
+        L: 'l',
+        M: 'm',
+      }),
+      theme: figma.enum('theme', {
+        primary: 'primary',
+        secondary: 'secondary',
+      }),
+      color: figma.enum('color', {
+        'gray-500': 'gray-500',
+        'blue-500': 'blue-500',
+        'green-500': 'green-500',
+        'orange-500': 'orange-500',
+        'yellow-500': 'yellow-500',
+        'red-500': 'red-500',
+        'violet-500': 'violet-500',
+        'invert': 'invert',
+      }),
+      active: figma.enum('state', {
+        active: true,
+      }),
+      disabled: figma.enum('state', { disabled: true }),
+
+      // These mappings show instances, but they are not working with conditional rendering for now. So I'm leaving them for possible future updates from Code Connect.
+      // addonLeft: figma.boolean('← addon', {
+      //   true: figma.instance('← - - addon properties'),
+      //   false: undefined,
+      // }),
+      // circle: figma.boolean('← circle addon', {
+      //   true: figma.instance('{ TagCircle }'),
+      //   false: undefined,
+      // }),
+      // textAddon: figma.boolean('↳ textAddon', {
+      //   true: figma.textContent('{ ↳ textAddon }'),
+      //   false: undefined,
+      // }),
+
+      addonLeft: figma.boolean('← addon', {
+        true: <Tag.Addon>{/* addon */}</Tag.Addon>,
+      }),
+      circle: figma.boolean('← circle addon', {
+        true: <Tag.Circle><img src='https://...' /></Tag.Circle>,
+      }),
+      textAddon: figma.boolean('↳ textAddon', {
+        true: <Tag.Addon>{/* text addon */}</Tag.Addon>,
+      }),
+    },
+
+    example: ({ label, size, theme, color, active, disabled, addonLeft, textAddon, circle }) => (
+      <Tag
+        size={size}
+        theme={theme}
+        color={color}
+        active={active}
+        disabled={disabled}
+      >
+        {circle}
+        {addonLeft}
+        <Tag.Text>{label}</Tag.Text>
+        {textAddon}
+      </Tag>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/TagAdditional.jsx b/figma/mappings/core-components/TagAdditional.jsx
new file mode 100644
index 0000000000..5085818b7f
--- /dev/null
+++ b/figma/mappings/core-components/TagAdditional.jsx
@@ -0,0 +1,31 @@
+import figma from '@figma/code-connect';
+import MathPlusM from '@semcore/ui/icon/Math/m';
+import Tag from '@semcore/ui/tag';
+
+figma.connect(
+  Tag,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=12026-120376&t=TbZAkRDwOBuye4Je-11',
+  {
+    props: {
+      label: figma.textContent('↳ text'),
+      size: figma.enum('size', {
+        XL: 'xl',
+        L: 'l',
+        M: 'm',
+      }),
+      active: figma.enum('state', {
+        active: true,
+      }),
+    },
+    example: ({ label, size, active }) => (
+      <Tag
+        size={size}
+        theme='additional'
+        active={active}
+        addonLeft={MathPlusM}
+      >
+        {label}
+      </Tag>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/TagContainer.figma.jsx b/figma/mappings/core-components/TagContainer.figma.jsx
new file mode 100644
index 0000000000..1c16cc14fa
--- /dev/null
+++ b/figma/mappings/core-components/TagContainer.figma.jsx
@@ -0,0 +1,72 @@
+import figma from '@figma/code-connect';
+import Tag, { TagContainer } from '@semcore/ui/tag';
+
+figma.connect(
+  TagContainer,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=44497-213147&t=0hjqYEp7RXqjnbR7-11',
+  {
+    variant: { 'close button': 'true' },
+    props: {
+      label: figma.textContent('↳ text'),
+      size: figma.enum('size', {
+        XL: 'xl',
+        L: 'l',
+        M: 'm',
+      }),
+      theme: figma.enum('theme', {
+        primary: 'primary',
+        secondary: 'secondary',
+      }),
+      color: figma.enum('color', {
+        'gray-500': 'gray-500',
+        'blue-500': 'blue-500',
+        'green-500': 'green-500',
+        'orange-500': 'orange-500',
+        'yellow-500': 'yellow-500',
+        'red-500': 'red-500',
+        'violet-500': 'violet-500',
+        'invert': 'invert',
+      }),
+      active: figma.enum('state', {
+        active: true,
+      }),
+      disabled: figma.enum('state', { disabled: true }),
+
+      // These mappings show instances, but they are not working with conditional rendering for now. So I'm leaving them for possible future updates from Code Connect.
+      // addonLeft: figma.boolean('← addon', {
+      //   true: figma.instance('← - - addon properties'),
+      //   false: undefined,
+      // }),
+      // circle: figma.boolean('← circle addon', {
+      //   true: figma.instance('{ TagCircle }'),
+      //   false: undefined,
+      // }),
+      // textAddon: figma.boolean('↳ textAddon', {
+      //   true: figma.textContent('{ ↳ textAddon }'),
+      //   false: undefined,
+      // }),
+
+      addonLeft: figma.boolean('← addon', {
+        true: <TagContainer.Tag.Addon>{/* addon */}</TagContainer.Tag.Addon>,
+      }),
+      circle: figma.boolean('← circle addon', {
+        true: <TagContainer.Tag.Circle><img src='#' /></TagContainer.Tag.Circle>,
+      }),
+      textAddon: figma.boolean('↳ textAddon', {
+        true: <TagContainer.Tag.Addon>{/* text addon */}</TagContainer.Tag.Addon>,
+      }),
+    },
+
+    example: ({ label, theme, color, size, addonLeft, textAddon, circle, active, disabled }) => (
+      <TagContainer theme={theme} color={color} size={size} active={active} disabled={disabled}>
+        <TagContainer.Tag>
+          {circle}
+          {addonLeft}
+          <TagContainer.Tag.Text>{label}</TagContainer.Tag.Text>
+          {textAddon}
+        </TagContainer.Tag>
+        <TagContainer.Close />
+      </TagContainer>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/Textarea.figma.jsx b/figma/mappings/core-components/Textarea.figma.jsx
new file mode 100644
index 0000000000..cda500f2f5
--- /dev/null
+++ b/figma/mappings/core-components/Textarea.figma.jsx
@@ -0,0 +1,89 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+import Textarea from '@semcore/ui/textarea';
+import { Text } from '@semcore/ui/typography';
+
+figma.connect(
+  Textarea.Value,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=53577-8724&t=I48qqNRyVr8Tdi87-11',
+  {
+    props: {
+      value: figma.textContent('↳ text'),
+    },
+  },
+);
+
+figma.connect(
+  Textarea,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10217-100589&t=Q0bSsRErIQ7IEZAU-11',
+  {
+    props: {
+      placeholder: figma.nestedProps('Textarea.Value', {
+        value: figma.textContent('↳ text'),
+      }),
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      state: figma.enum('state', {
+        normal: 'normal',
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      disabled: figma.enum('state', { disabled: true }),
+      readOnly: figma.boolean('read-only'),
+      resize: figma.boolean('resize'),
+    },
+    example: ({ placeholder, size, state, disabled, readOnly, resize }) => <Textarea placeholder={placeholder.value} size={size} state={state} disabled={disabled} readOnly={readOnly} resize={resize} />,
+  },
+);
+
+figma.connect(
+  Textarea,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11614-143876&t=Q0bSsRErIQ7IEZAU-11',
+  {
+    variant: { 'label position': 'top' },
+    props: {
+      label: figma.textContent('↳ label'),
+      textarea: figma.children('Textarea'),
+    },
+    example: ({ label, textarea }) => (
+      <Flex direction='column' gap={2}>
+        <Flex justifyContent='space-between'>
+          <Text tag='label' htmlFor='/* input id */' size='/* fontSize */'>
+            {label}
+          </Text>
+          <Text size='/* fontSize */' color='text-secondary'>
+            (optional)
+          </Text>
+        </Flex>
+        {textarea}
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  Textarea,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11614-143876&t=Q0bSsRErIQ7IEZAU-11',
+  {
+    variant: { 'label position': 'left' },
+    props: {
+      label: figma.textContent('↳ label'),
+      textarea: figma.children('Textarea'),
+    },
+    example: ({ label, textarea }) => (
+      <Flex gap={6}>
+        <Flex direction='column' mt={/* value */}>
+          <Text tag='label' htmlFor='/* input id */' size='/* fontSize */'>
+            {label}
+          </Text>
+          <Text size='/* fontSize */' color='text-secondary'>
+            (optional)
+          </Text>
+        </Flex>
+        {textarea}
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/TimePicker.figma.template.js b/figma/mappings/core-components/TimePicker.figma.template.js
new file mode 100644
index 0000000000..7c433a60bf
--- /dev/null
+++ b/figma/mappings/core-components/TimePicker.figma.template.js
@@ -0,0 +1,23 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10301-133764
+// import TimePicker from '@semcore/ui/time-picker'
+
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const is12Hour = instance.getBoolean('12 hours', { true: 'is12Hour' });
+const disabled = instance.getEnum('state', { disabled: 'disabled' });
+const state = instance.getEnum('state', { invalid: 'state="invalid"' });
+const size = instance.getEnum('size', { L: 'size="l"' });
+
+export default {
+  example: figma.tsx`
+<TimePicker
+  aria-label={/* if there's no visible label */}
+  ${is12Hour}
+  ${size}
+  ${disabled}
+  ${state}
+/>
+  `,
+  id: 'TimePicker',
+};
diff --git a/figma/mappings/core-components/Tooltip.figma.jsx b/figma/mappings/core-components/Tooltip.figma.jsx
new file mode 100644
index 0000000000..5a4bdac595
--- /dev/null
+++ b/figma/mappings/core-components/Tooltip.figma.jsx
@@ -0,0 +1,44 @@
+import figma from '@figma/code-connect';
+import Tooltip from '@semcore/ui/tooltip';
+
+figma.connect(
+  Tooltip,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=10355-260578&t=TbZAkRDwOBuye4Je-11',
+  {
+    props: {
+      title: figma.instance('content'),
+      theme: figma.enum('theme', {
+        '⚪️ default': 'default',
+        '⚫️ invert': 'invert',
+        '🔴 warning': 'warning',
+      }),
+      placement: figma.nestedProps('placement', {
+        placement: figma.enum('placement', {
+          'top-start': 'top-start',
+          'top-end': 'top-end',
+          'top': 'top',
+          'bottom-start': 'bottom-start',
+          'bottom-end': 'bottom-end',
+          'bottom': 'bottom',
+          'left': 'left',
+          'left-start': 'left-start',
+          'left-end': 'left-end',
+          'right': 'right',
+          'right-start': 'right-start',
+          'right-end': 'right-end',
+        }),
+      }),
+    },
+    example: ({ title, theme, placement }) => (
+      <Tooltip
+        title={title}
+        theme={theme}
+        placement={placement.placement}
+        tag={/* Optionally define addon tag */}
+        {...addonProps}
+      >
+        {/* Place tooltip's trigger here */}
+      </Tooltip>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/WidgetEmpty.figma.jsx b/figma/mappings/core-components/WidgetEmpty.figma.jsx
new file mode 100644
index 0000000000..00c13a8664
--- /dev/null
+++ b/figma/mappings/core-components/WidgetEmpty.figma.jsx
@@ -0,0 +1,81 @@
+import figma from '@figma/code-connect';
+import { Box } from '@semcore/ui/base-components';
+import Link from '@semcore/ui/link';
+import WidgetEmpty, { NoData, Error, getIconPath } from '@semcore/ui/widget-empty';
+
+// Mappings for Illustration component?
+
+figma.connect(
+  NoData,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-302929', {
+    variant: { case: 'No data' },
+
+    example: () => (
+      <NoData />
+    ),
+  },
+);
+
+figma.connect(
+  Error,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-302929', {
+    variant: { case: 'Error (we know about)' },
+    props: {
+      actions: figma.children('Button'),
+    },
+
+    example: ({ actions }) => (
+      <Error>
+        <Box mt={4}>
+          {actions}
+        </Box>
+      </Error>
+    ),
+  },
+);
+
+figma.connect(
+  Error,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-302929', {
+    variant: { case: 'Error (we do not know about)' },
+    props: {
+      actions: figma.children('Button'),
+    },
+
+    example: ({ actions }) => (
+      <Error description={(
+        <>
+          Try again later. If the problem persists,
+          {' '}
+          <Link href='https://www.semrush.com/company/contacts/'>contact our support</Link>
+        </>
+      )}
+      >
+        <Box mt={4}>
+          {actions}
+        </Box>
+      </Error>
+    ),
+  },
+);
+
+figma.connect(
+  WidgetEmpty,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56115-302929', {
+    variant: { case: 'Custom' },
+    props: {
+      title: figma.textContent('↳ title'),
+      description: figma.textContent('↳ description'),
+      actions: figma.children('Button'),
+    },
+    example: ({ title, description, actions }) => (
+      <WidgetEmpty icon={getIconPath(/* Specify illustration type, for example, 'nothing-found' */)}>
+        <WidgetEmpty.Title>{title}</WidgetEmpty.Title>
+        <WidgetEmpty.Description>{description}</WidgetEmpty.Description>
+        <Box mt={4}>
+          {actions}
+        </Box>
+      </WidgetEmpty>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/date-picker/DatePicker.Popper.figma.template.js b/figma/mappings/core-components/date-picker/DatePicker.Popper.figma.template.js
new file mode 100644
index 0000000000..b58dde3df9
--- /dev/null
+++ b/figma/mappings/core-components/date-picker/DatePicker.Popper.figma.template.js
@@ -0,0 +1,44 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=53984-3477
+// import { DatePicker } from '@semcore/ui/date-picker'
+// import Divider from '@semcore/ui/divider'
+
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const variant = instance.getPropertyValue('variant');
+const notice = instance.getBoolean('notice ↓');
+let popperCode;
+
+if (variant === 'default' && !notice) {
+  popperCode = '<DatePicker.Popper />';
+} else {
+  popperCode = '<DatePicker.Popper w="min-content"><DatePicker.Header /><DatePicker.Calendar />';
+
+  if (variant === 'default') {
+    popperCode += '<DatePicker.Today />';
+  } else {
+    const footer = instance.findConnectedInstances((child) => true, { path: ['Flex [bottom controls]'] });
+    let footerCode;
+    for (const child of footer) {
+      footerCode = figma.tsx`${footerCode}${child.executeTemplate().example}`;
+    }
+    if (footer.length) footerCode = figma.tsx`<Divider /><Flex justifyContent='space-between'>${footerCode}</Flex>`;
+    popperCode = figma.tsx`${popperCode}${footerCode}`;
+  }
+  if (notice) {
+    const children = instance.findConnectedInstances((child) => true);
+    const noticeCode = children[children.length - 1].executeTemplate().example;
+    popperCode = figma.tsx`${popperCode}${noticeCode}`;
+  }
+  popperCode = figma.tsx`${popperCode}</DatePicker.Popper>`;
+}
+
+export default {
+  example: figma.tsx`
+<DatePicker>
+  <DatePicker.Trigger />
+  ${popperCode}
+</DatePicker>
+  `,
+  id: 'DatePicker.Popper',
+};
diff --git a/figma/mappings/core-components/date-picker/DatePicker.Trigger.figma.template.js b/figma/mappings/core-components/date-picker/DatePicker.Trigger.figma.template.js
new file mode 100644
index 0000000000..25bdb4e942
--- /dev/null
+++ b/figma/mappings/core-components/date-picker/DatePicker.Trigger.figma.template.js
@@ -0,0 +1,24 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=54076-2819
+// import { DatePicker } from '@semcore/ui/date-picker'
+
+const figma = require('figma');
+const instance = figma.selectedInstance.findConnectedInstance('DatePicker.InputTrigger');
+
+const disabled = instance.getEnum('state', { disabled: 'disabled' });
+const state = instance.getEnum('state', { invalid: 'state="invalid"' });
+const size = instance.getEnum('size', { L: 'size="l"' });
+
+export default {
+  example: figma.tsx`
+<DatePicker>
+  <DatePicker.Trigger
+    aria-label={/* set if there's no visible label */}
+    ${size}
+    ${state}
+    ${disabled}
+  />
+  <DatePicker.Popper />
+</DatePicker>
+  `,
+  id: 'DatePicker.Trigger',
+};
diff --git a/figma/mappings/core-components/date-picker/DateRangeComparator.Popper.figma.template.js b/figma/mappings/core-components/date-picker/DateRangeComparator.Popper.figma.template.js
new file mode 100644
index 0000000000..50d8f3fa64
--- /dev/null
+++ b/figma/mappings/core-components/date-picker/DateRangeComparator.Popper.figma.template.js
@@ -0,0 +1,42 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=54082-61809
+// import { DateRangeComparator } from '@semcore/ui/date-picker'
+
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const notice = instance.getBoolean('notice ↓');
+let popperCode;
+
+if (notice) {
+  const children = instance.findConnectedInstances((child) => true);
+  const noticeCode = children[children.length - 1].executeTemplate().example;
+  popperCode = figma.tsx`<DateRangeComparator.Popper>
+  <DateRangeComparator.Header />
+  <DateRangeComparator.Body>
+    <DateRangeComparator.RangeCalendar />
+    <DateRangeComparator.Periods>
+      <DateRangeComparator.Periods.Divider />
+      <DateRangeComparator.Periods.Column>
+        <DateRangeComparator.Periods.Options />
+        <DateRangeComparator.Periods.Controls>
+          <DateRangeComparator.Apply />
+          <DateRangeComparator.Reset />
+        </DateRangeComparator.Periods.Controls>
+      </DateRangeComparator.Periods.Column>
+    </DateRangeComparator.Periods>
+  </DateRangeComparator.Body>
+  ${noticeCode}
+</DateRangeComparator.Popper>`;
+} else {
+  popperCode = '<DateRangeComparator.Popper />';
+}
+
+export default {
+  example: figma.tsx`
+<DateRangeComparator>
+  <DateRangeComparator.Trigger />
+  ${popperCode}
+</DateRangeComparator>
+  `,
+  id: 'DateRangeComparator.Popper',
+};
diff --git a/figma/mappings/core-components/date-picker/DateRangeComparator.Trigger.figma.template.js b/figma/mappings/core-components/date-picker/DateRangeComparator.Trigger.figma.template.js
new file mode 100644
index 0000000000..0639cd00fc
--- /dev/null
+++ b/figma/mappings/core-components/date-picker/DateRangeComparator.Trigger.figma.template.js
@@ -0,0 +1,16 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=54087-63090
+// import { DateRangeComparator } from '@semcore/ui/date-picker'
+
+const figma = require('figma');
+
+export default {
+  example: figma.tsx`
+<DateRangeComparator>
+  <DateRangeComparator.Trigger
+    aria-label={/* set if there's no visible label */}
+  />
+  <DateRangeComparator.Popper />
+</DateRangeComparator>
+  `,
+  id: 'DateRangeComparator.Trigger',
+};
diff --git a/figma/mappings/core-components/date-picker/DateRangePicker.Popper.figma.template.js b/figma/mappings/core-components/date-picker/DateRangePicker.Popper.figma.template.js
new file mode 100644
index 0000000000..b0f3f44b9f
--- /dev/null
+++ b/figma/mappings/core-components/date-picker/DateRangePicker.Popper.figma.template.js
@@ -0,0 +1,54 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10322-131390
+// import { DateRangePicker } from '@semcore/ui/date-picker'
+
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const notice = instance.getBoolean('notice ↓');
+let popperCode;
+
+if (notice) {
+  const children = instance.findConnectedInstances((child) => true);
+  const noticeCode = children[children.length - 1].executeTemplate().example;
+  popperCode = figma.tsx`<DateRangePicker.Popper w='min-content'>
+  <Flex>
+    <Flex gap={4}>
+      <Box>
+        <DateRangePicker.Header>
+          <DateRangePicker.Prev />
+          <DateRangePicker.Title />
+        </DateRangePicker.Header>
+        <DateRangePicker.Calendar />
+      </Box>
+      <Box>
+        <DateRangePicker.Header>
+          <DateRangePicker.Title />
+          <DateRangePicker.Next />
+        </DateRangePicker.Header>
+        <DateRangePicker.Calendar />
+      </Box>
+    </Flex>
+    <Divider m="-16px 16px" orientation="vertical" />
+    <Flex direction="column" justifyContent="space-between">
+      <DateRangePicker.Period />
+      <Flex mt={2} gap={2}>
+        <DateRangePicker.Apply />
+        <DateRangePicker.Reset />
+      </Flex>
+    </Flex>
+  </Flex>
+  ${noticeCode}
+</DateRangePicker.Popper>`;
+} else {
+  popperCode = '<DateRangePicker.Popper />';
+}
+
+export default {
+  example: figma.tsx`
+<DateRangePicker>
+  <DateRangePicker.Trigger />
+  ${popperCode}
+</DateRangePicker>
+  `,
+  id: 'DateRangePicker.Popper',
+};
diff --git a/figma/mappings/core-components/date-picker/DateRangePicker.Trigger.figma.template.js b/figma/mappings/core-components/date-picker/DateRangePicker.Trigger.figma.template.js
new file mode 100644
index 0000000000..b742c1133e
--- /dev/null
+++ b/figma/mappings/core-components/date-picker/DateRangePicker.Trigger.figma.template.js
@@ -0,0 +1,24 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=54076-2980
+// import { DateRangePicker } from '@semcore/ui/date-picker'
+
+const figma = require('figma');
+const instance = figma.selectedInstance.findConnectedInstance('DatePicker.InputTrigger');
+
+const disabled = instance.getEnum('state', { disabled: 'disabled' });
+const state = instance.getEnum('state', { invalid: 'state="invalid"' });
+const size = instance.getEnum('size', { L: 'size="l"' });
+
+export default {
+  example: figma.tsx`
+<DateRangePicker>
+  <DateRangePicker.Trigger
+    aria-label={/* set if there's no visible label */}
+    ${size}
+    ${state}
+    ${disabled}
+  />
+  <DateRangePicker.Popper />
+</DateRangePicker>
+  `,
+  id: 'DateRangePicker.Trigger',
+};
diff --git a/figma/mappings/core-components/date-picker/InputTrigger.figma.template.js b/figma/mappings/core-components/date-picker/InputTrigger.figma.template.js
new file mode 100644
index 0000000000..425e7d83d5
--- /dev/null
+++ b/figma/mappings/core-components/date-picker/InputTrigger.figma.template.js
@@ -0,0 +1,10 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=54062-2648
+
+const figma = require('figma');
+
+export default {
+  example: figma.tsx`
+{/* this is an internal design component, inspect the parent */}
+  `,
+  id: 'DatePicker.InputTrigger',
+};
diff --git a/figma/mappings/core-components/date-picker/MonthPicker.Popper.figma.template.js b/figma/mappings/core-components/date-picker/MonthPicker.Popper.figma.template.js
new file mode 100644
index 0000000000..13ce467074
--- /dev/null
+++ b/figma/mappings/core-components/date-picker/MonthPicker.Popper.figma.template.js
@@ -0,0 +1,14 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10322-258100
+// import { MonthPicker } from '@semcore/ui/date-picker'
+
+const figma = require('figma');
+
+export default {
+  example: figma.tsx`
+<MonthPicker>
+  <MonthPicker.Trigger />
+  <MonthPicker.Popper />
+</MonthPicker>
+  `,
+  id: 'MonthPicker.Popper',
+};
diff --git a/figma/mappings/core-components/date-picker/MonthPicker.Trigger.figma.template.js b/figma/mappings/core-components/date-picker/MonthPicker.Trigger.figma.template.js
new file mode 100644
index 0000000000..7873d590d2
--- /dev/null
+++ b/figma/mappings/core-components/date-picker/MonthPicker.Trigger.figma.template.js
@@ -0,0 +1,24 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=54076-2807
+// import { MonthPicker } from '@semcore/ui/date-picker'
+
+const figma = require('figma');
+const instance = figma.selectedInstance.findConnectedInstance('DatePicker.InputTrigger');
+
+const disabled = instance.getEnum('state', { disabled: 'disabled' });
+const state = instance.getEnum('state', { invalid: 'state="invalid"' });
+const size = instance.getEnum('size', { L: 'size="l"' });
+
+export default {
+  example: figma.tsx`
+<MonthPicker>
+  <MonthPicker.Trigger
+    aria-label={/* set if there's no visible label */}
+    ${size}
+    ${state}
+    ${disabled}
+  />
+  <MonthPicker.Popper />
+</MonthPicker>
+  `,
+  id: 'MonthPicker.Trigger',
+};
diff --git a/figma/mappings/core-components/date-picker/MonthRangePicker.Popper.figma.template.js b/figma/mappings/core-components/date-picker/MonthRangePicker.Popper.figma.template.js
new file mode 100644
index 0000000000..c914b5ed73
--- /dev/null
+++ b/figma/mappings/core-components/date-picker/MonthRangePicker.Popper.figma.template.js
@@ -0,0 +1,56 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10322-258136
+// import { MonthRangePicker } from '@semcore/ui/date-picker'
+// import Divider from '@semcore/ui/divider'
+// import { Flex, Box } from '@semcore/ui/base-components'
+
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const notice = instance.getBoolean('notice ↓');
+let popperCode;
+
+if (notice) {
+  const children = instance.findConnectedInstances((child) => true);
+  const noticeCode = children[children.length - 1].executeTemplate().example;
+  popperCode = figma.tsx`<MonthRangePicker.Popper w='min-content'>
+  <Flex>
+    <Flex gap={4}>
+      <Box>
+        <MonthRangePicker.Header>
+          <MonthRangePicker.Prev />
+          <MonthRangePicker.Title />
+        </MonthRangePicker.Header>
+        <MonthRangePicker.Calendar />
+      </Box>
+      <Box>
+        <MonthRangePicker.Header>
+          <MonthRangePicker.Title />
+          <MonthRangePicker.Next />
+        </MonthRangePicker.Header>
+        <MonthRangePicker.Calendar />
+      </Box>
+    </Flex>
+    <Divider m="-16px 16px" orientation="vertical" />
+    <Flex direction="column" justifyContent="space-between">
+      <MonthRangePicker.Period />
+      <Flex mt={2} gap={2}>
+        <MonthRangePicker.Apply />
+        <MonthRangePicker.Reset />
+      </Flex>
+    </Flex>
+  </Flex>
+  ${noticeCode}
+</MonthRangePicker.Popper>`;
+} else {
+  popperCode = '<MonthRangePicker.Popper />';
+}
+
+export default {
+  example: figma.tsx`
+<MonthRangePicker>
+  <MonthRangePicker.Trigger />
+  ${popperCode}
+</MonthRangePicker>
+  `,
+  id: 'MonthRangePicker.Popper',
+};
diff --git a/figma/mappings/core-components/date-picker/MonthRangePicker.Trigger.figma.template.js b/figma/mappings/core-components/date-picker/MonthRangePicker.Trigger.figma.template.js
new file mode 100644
index 0000000000..0e197e0c71
--- /dev/null
+++ b/figma/mappings/core-components/date-picker/MonthRangePicker.Trigger.figma.template.js
@@ -0,0 +1,24 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=54076-2981
+// import { MonthRangePicker } from '@semcore/ui/date-picker'
+
+const figma = require('figma');
+const instance = figma.selectedInstance.findConnectedInstance('DatePicker.InputTrigger');
+
+const disabled = instance.getEnum('state', { disabled: 'disabled' });
+const state = instance.getEnum('state', { invalid: 'state="invalid"' });
+const size = instance.getEnum('size', { L: 'size="l"' });
+
+export default {
+  example: figma.tsx`
+<MonthRangePicker>
+  <MonthRangePicker.Trigger
+    aria-label={/* set if there's no visible label */}
+    ${size}
+    ${state}
+    ${disabled}
+  />
+  <MonthRangePicker.Popper />
+</MonthRangePicker>
+  `,
+  id: 'MonthRangePicker.Trigger',
+};
diff --git a/figma/mappings/core-components/select/Select.Option.Checkbox.figma.jsx b/figma/mappings/core-components/select/Select.Option.Checkbox.figma.jsx
new file mode 100644
index 0000000000..e8c54486e9
--- /dev/null
+++ b/figma/mappings/core-components/select/Select.Option.Checkbox.figma.jsx
@@ -0,0 +1,57 @@
+import figma from '@figma/code-connect';
+import Select from '@semcore/ui/select';
+
+// TODO: Add addons
+// Select.Option.Checkbox without hint
+
+figma.connect(
+  Select.Option,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11805-136032&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { hint: 'false' },
+    props: {
+      content: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+    },
+    example: ({ content, selected, disabled }) => (
+      <Select.Option value={/* value */} selected={selected} disabled={disabled}>
+        <Select.Option.Checkbox />
+        {content}
+      </Select.Option>
+    ),
+  },
+);
+
+// Select.Option.Checkbox with hint
+
+figma.connect(
+  Select.Option,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11805-136032&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { hint: 'true' },
+    props: {
+      content: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      hint: figma.textContent('↳ hint'),
+    },
+    example: ({ content, selected, disabled, hint }) => (
+      <Select.Option value={/* value */} selected={selected} disabled={disabled}>
+        <Select.Option.Content>
+          <Select.Option.Checkbox />
+          {content}
+        </Select.Option.Content>
+        <Select.Option.Hint>{hint}</Select.Option.Hint>
+      </Select.Option>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/select/Select.Option.Country.figma.jsx b/figma/mappings/core-components/select/Select.Option.Country.figma.jsx
new file mode 100644
index 0000000000..6dd78664e5
--- /dev/null
+++ b/figma/mappings/core-components/select/Select.Option.Country.figma.jsx
@@ -0,0 +1,58 @@
+import figma from '@figma/code-connect';
+import type { iso2Name } from '@semcore/ui/flags';
+import Flags from '@semcore/ui/flags';
+import Select from '@semcore/ui/select';
+
+// TODO: Add addons
+
+figma.connect(
+  Select.Option,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11805-136094&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { hint: 'false' },
+    props: {
+      content: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+    },
+    example: ({ content, selected, disabled }) => (
+      <Select.Option value={/* value */} selected={selected} disabled={disabled}>
+        <Flags iso2={/* value as keyof typeof iso2Name */} mr={2} />
+        {/* {formatName(iso2Name[value])} */}
+        {content}
+      </Select.Option>
+    ),
+  },
+);
+
+figma.connect(
+  Select.Option,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11805-136094&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { hint: 'true' },
+    props: {
+      content: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      hint: figma.textContent('↳ hint'),
+    },
+    example: ({ content, selected, disabled, hint }) => (
+      <Select.Option value={/* value */} selected={selected} disabled={disabled}>
+        <Select.Option.Content>
+          <Flags iso2={/* value as keyof typeof iso2Name */} mr={2} />
+          {/* {formatName(iso2Name[value])} */}
+          {content}
+        </Select.Option.Content>
+        <Select.Option.Hint>{hint}</Select.Option.Hint>
+      </Select.Option>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/select/Select.Option.Group.figma.jsx b/figma/mappings/core-components/select/Select.Option.Group.figma.jsx
new file mode 100644
index 0000000000..c48f00d489
--- /dev/null
+++ b/figma/mappings/core-components/select/Select.Option.Group.figma.jsx
@@ -0,0 +1,27 @@
+import figma from '@figma/code-connect';
+import Select from '@semcore/ui/select';
+
+// TODO: Add addons
+
+figma.connect(
+  Select.Group,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11950-115223',
+  {
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      title: figma.textContent('↳ title'),
+      subTitle: figma.boolean('subTitle', {
+        true: figma.textContent('↳ subTitle'),
+        false: undefined,
+      }),
+    },
+    example: ({ size, title, subTitle }) => (
+      <Select.Group size={size} title={title} subTitle={subTitle}>
+        {/* options */}
+      </Select.Group>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/select/Select.Option.Message.figma.jsx b/figma/mappings/core-components/select/Select.Option.Message.figma.jsx
new file mode 100644
index 0000000000..7a23302528
--- /dev/null
+++ b/figma/mappings/core-components/select/Select.Option.Message.figma.jsx
@@ -0,0 +1,144 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+import Button, { ButtonLink } from '@semcore/ui/button';
+import Notice from '@semcore/ui/notice';
+import { Text } from '@semcore/ui/typography';
+
+// "Loading" message
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=12179-115948&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    props: {
+      text: figma.textContent('↳ text'),
+    },
+    example: ({ text }) => (
+      <Flex direction='column' alignItems='start' gap={1} p={2}>
+        <Text size={/* fontSize */} use='secondary' aria-live='polite' role='status'>
+          {text}
+        </Text>
+      </Flex>
+    ),
+  },
+);
+
+// "Nothing found" message
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=12179-116073&m=dev',
+  {
+    props: {
+      text: figma.textContent('↳ text'),
+    },
+    example: ({ text }) => (
+      <Flex direction='column' alignItems='start' gap={1} p={2}>
+        <Text size={/* fontSize */} use='secondary' aria-live='polite' role='status'>
+          {text}
+        </Text>
+      </Flex>
+    ),
+  },
+);
+
+// "Error" message
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=12179-116078&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    props: {
+      text: figma.textContent('↳ text'),
+      button: figma.boolean('button', {
+        true: <ButtonLink addonLeft={/* ReloadIcon */} onClick={/* handleReloadClick */}>Reload</ButtonLink>,
+        false: undefined,
+      }),
+    },
+    example: ({ text, button }) => (
+      <Flex direction='column' alignItems='start' gap={1} p={2}>
+        <Text size={/* fontSize */} use='secondary' aria-live='polite' role='status'>
+          {text}
+        </Text>
+        {button}
+      </Flex>
+    ),
+  },
+);
+
+// Neutral message
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11448-133731&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      controls: figma.boolean('controls', {
+        true: <Button />,
+        false: undefined,
+      }),
+    },
+    example: ({ title, text, controls }) => (
+      <Flex direction='column' alignItems='start'>
+        <Text size={/* fontSize */} bold mb={2}>
+          {title}
+        </Text>
+        <Text size={/* fontSize */} mb={1}>
+          {text}
+        </Text>
+        {controls}
+      </Flex>
+    ),
+  },
+);
+
+// Notice with styles for menus
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11448-133730&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      theme: figma.enum('theme', {
+        '🟢 limit': 'success',
+        '🔴 danger': 'danger',
+        '🟠 warning': 'warning',
+        '⚪️ muted': 'muted',
+      }),
+      // label: figma.children('iconContainer'),
+      controls: figma.boolean('controls', {
+        true: <Button />,
+        false: undefined,
+      }),
+    },
+    example: ({ title, text, theme, controls }) => (
+      <Notice
+        theme={theme}
+        style={{
+          border: 'none',
+          borderRadius: '0 0 6px 6px',
+          padding: '12px 8px',
+        }}
+      >
+        <Notice.Content>
+          <Notice.Label>
+            {/* icon */}
+          </Notice.Label>
+          <Notice.Title>
+            {title}
+          </Notice.Title>
+          <Notice.Text>
+            {text}
+          </Notice.Text>
+          <Notice.Actions>
+            {controls}
+          </Notice.Actions>
+        </Notice.Content>
+      </Notice>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/select/Select.Option.figma.jsx b/figma/mappings/core-components/select/Select.Option.figma.jsx
new file mode 100644
index 0000000000..5b1180dcce
--- /dev/null
+++ b/figma/mappings/core-components/select/Select.Option.figma.jsx
@@ -0,0 +1,65 @@
+import figma from '@figma/code-connect';
+import Select from '@semcore/ui/select';
+
+// TODO: Add addons
+// Select.Option/Default without hint
+
+figma.connect(
+  Select.Option,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=14116-116067&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { hint: 'false' },
+    props: {
+      content: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+    },
+    example: ({ content, selected, disabled }) => (
+      <Select.Option value={/* value */} selected={selected} disabled={disabled}>
+        {content}
+      </Select.Option>
+    ),
+  },
+);
+
+// Select.Option/Default with hint
+
+figma.connect(
+  Select.Option,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=14116-116067&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { hint: 'true' },
+    props: {
+      content: figma.textContent('↳ text'),
+      selected: figma.enum('state', {
+        selected: true,
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      hint: figma.textContent('↳ hint'),
+    },
+    example: ({ content, selected, disabled, hint }) => (
+      <Select.Option value={/* value */} selected={selected} disabled={disabled}>
+        <Select.Option.Content>
+          {content}
+        </Select.Option.Content>
+        <Select.Option.Hint>{hint}</Select.Option.Hint>
+      </Select.Option>
+    ),
+  },
+);
+
+// Select.Divider
+
+figma.connect(
+  Select.Divider,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10129-57027&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    example: () => <Select.Divider key='divider' />,
+  },
+);
diff --git a/figma/mappings/core-components/select/Select.figma.jsx b/figma/mappings/core-components/select/Select.figma.jsx
new file mode 100644
index 0000000000..0c9be8eb3d
--- /dev/null
+++ b/figma/mappings/core-components/select/Select.figma.jsx
@@ -0,0 +1,214 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+import Select from '@semcore/ui/select';
+import { Text } from '@semcore/ui/typography';
+
+figma.connect(
+  Select.Trigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10171-91601&',
+  {
+    variant: { '← addon': 'false', 'addon →': 'false', 'icon only': 'false' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      placeholder: figma.textContent('↳ text'),
+      state: figma.enum('state', {
+        active: 'active',
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      loading: figma.enum('state', {
+        loading: true,
+      }),
+    },
+    example: (props) => <Select options={/* options */} {...props} />,
+  },
+);
+
+figma.connect(
+  Select.Trigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10171-91601&',
+  {
+    variant: { 'icon only': 'false' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      addonLeft: figma.enum('icon only', {
+        false: figma.boolean('← addon', {
+          true: <Select.Trigger.Addon>{/* addon */}</Select.Trigger.Addon>,
+        }),
+      }),
+      addonRight: figma.enum('icon only', {
+        false: figma.boolean('addon →', {
+          true: <Select.Trigger.Addon>{/* addon */}</Select.Trigger.Addon>,
+        }),
+      }),
+
+      content: figma.enum('icon only', {
+        false: figma.boolean('← addon', {
+          true: <Select.Trigger.Text>{/* text */}</Select.Trigger.Text>,
+          false: figma.boolean('addon →', {
+            true: <Select.Trigger.Text>{/* text */}</Select.Trigger.Text>,
+            false: '{/* text */}',
+          }),
+        }),
+      }),
+      text: figma.textContent('↳ text'),
+      state: figma.enum('state', {
+        active: 'active',
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      loading: figma.enum('state', {
+        loading: true,
+      }),
+    },
+    example: ({ size, addonLeft, addonRight, content, state, loading, disabled }) => {
+      <Select options={/* options */} size={size} state={state} loading={loading} disabled={disabled} placeholder={/* placeholder */}>
+        <Select.Trigger>
+          {addonLeft}
+          {content}
+          {addonRight}
+        </Select.Trigger>
+        <Select.Menu hMax={/* value */}>
+          <Select.Option key={/* value */} value={/* value */}>
+            {/* option */}
+          </Select.Option>
+        </Select.Menu>
+      </Select>;
+    },
+  },
+);
+
+figma.connect(
+  Select.Trigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10171-91601&',
+  {
+    variant: { 'icon only': 'true' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      addonLeft: figma.children('← - - addon properties'),
+      state: figma.enum('state', {
+        active: 'active',
+        invalid: 'invalid',
+        valid: 'valid',
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      loading: figma.enum('state', {
+        loading: true,
+      }),
+      title: figma.textContent('↳ title'),
+    },
+    example: ({ size, addonLeft, state, loading, disabled, title }) => (
+      <Select options={/* options */} size={size} state={state} loading={loading} disabled={disabled} aria-label={title}>
+        <Select.Trigger>
+          <Select.Trigger.Addon>{addonLeft}</Select.Trigger.Addon>
+        </Select.Trigger>
+        <Select.Menu hMax={/* value */}>
+          <Select.Option key={/* value */} value={/* value */}>
+            {/* option */}
+          </Select.Option>
+        </Select.Menu>
+      </Select>
+    ),
+  },
+);
+
+// Select.Trigger with label
+
+figma.connect(
+  Select.Trigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=13071-112318&t=5rMgxkZbFCPoIXFH-11',
+  {
+    variant: { 'label position': 'top' },
+    props: {
+      label: figma.textContent('↳ label'),
+      input: figma.children('Select.Trigger'),
+      optional: figma.boolean('optional', {
+        true: (
+          <Text size='/* fontSize */' color='text-secondary'>
+            (optional)
+          </Text>
+        ),
+        false: undefined,
+      }),
+      counter: figma.boolean('counter', {
+        true: figma.children('Counter'),
+        false: undefined,
+      }),
+      infoIcon: figma.boolean('informer', {
+        true: figma.children('Info icon with tooltip (Informer)'),
+        false: undefined,
+      }),
+    },
+    example: ({ label, input, optional, counter, infoIcon }) => (
+      <Flex direction='column' gap={2}>
+        <Flex justifyContent='space-between'>
+          <Text tag='label' htmlFor='/* input id */' size='/* fontSize */'>
+            {label}
+          </Text>
+          {counter}
+          {infoIcon}
+          {optional}
+        </Flex>
+        {input}
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  Select.Trigger,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=13071-112318&t=5rMgxkZbFCPoIXFH-11',
+  {
+    variant: { 'label position': 'left' },
+    props: {
+      label: figma.textContent('↳ label'),
+      input: figma.children('Select.Trigger'),
+      optional: figma.boolean('optional', {
+        true: (
+          <Text size='/* fontSize */' color='text-secondary'>
+            (optional)
+          </Text>
+        ),
+        false: undefined,
+      }),
+      counter: figma.boolean('counter', {
+        true: figma.children('Counter'),
+        false: undefined,
+      }),
+      infoIcon: figma.boolean('informer', {
+        true: figma.children('Info icon with tooltip (Informer)'),
+        false: undefined,
+      }),
+    },
+    example: ({ label, input, optional, counter, infoIcon }) => (
+      <Flex gap={6}>
+        <Flex direction='column' mt={/* value */}>
+          <Text tag='label' htmlFor='/* input id */' size='/* fontSize */'>
+            {label}
+          </Text>
+          {counter}
+          {infoIcon}
+          {optional}
+        </Flex>
+        {input}
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/select/SelectList.figma.jsx b/figma/mappings/core-components/select/SelectList.figma.jsx
new file mode 100644
index 0000000000..4c669f04c8
--- /dev/null
+++ b/figma/mappings/core-components/select/SelectList.figma.jsx
@@ -0,0 +1,139 @@
+import figma from '@figma/code-connect';
+import Select from '@semcore/ui/select';
+import { Text } from '@semcore/ui/typography';
+
+// Default Select List
+
+figma.connect(
+  Select.Menu,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47952-16111',
+  {
+    variant: { 'type': 'select list', 'search input': 'true' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      searchInput: figma.boolean('search input', {
+        true: <Select.InputSearch value={/* value */} onChange={/* onChange */} aria-describedby={/* aria-describedby */} />,
+        false: undefined,
+      }),
+      notice: figma.boolean('notice ↓', {
+        true: figma.children('Notice'),
+        false: undefined,
+      }),
+    },
+
+    example: ({ searchInput, notice, size }) => (
+      <Select.Popper size={size} aria-label='/* Add your aria-label */'>
+        {searchInput}
+        <Select.List hMax={/* value */}>
+          <Select.Option key={/* value */} value={/* value */}>
+            {/* option */}
+          </Select.Option>
+        </Select.List>
+        {notice}
+      </Select.Popper>
+    ),
+  },
+);
+
+// figma.connect(
+//   Select.Menu,
+//   'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47952-16111',
+//   {
+//     variant: { 'search input': 'false' },
+//     props: {
+//       size: figma.enum('size', {
+//         M: 'm',
+//         L: 'l',
+//       }),
+//       notice: figma.boolean('notice ↓', {
+//         true: figma.children('Notice'),
+//         false: undefined,
+//       }),
+//     },
+
+//     example: ({ notice, size }) => (
+//       <Select.Menu size={size} hMax={/* value */}>
+//         <Select.Option key={/* value */} value={/* value */}>
+//           {/* option */}
+//         </Select.Option>
+//         {notice}
+//       </Select.Menu>
+//     ),
+//   },
+// );
+
+// Country Select List
+
+figma.connect(
+  Select.Menu,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47952-16111',
+  {
+    variant: { 'type': 'select list (country)', 'search input': 'true' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      notice: figma.boolean('notice ↓', {
+        true: figma.children('Notice'),
+        false: undefined,
+      }),
+    },
+
+    example: ({ notice, size }) => (
+      <Select.Popper size={size} aria-label='/* Add your aria-label */'>
+        <Select.InputSearch value={/* value */} onChange={/* onChange */} aria-describedby={/* aria-describedby */} />
+        <Select.List hMax={/* value */}>
+          {/* Options map */}
+          {/* Options length + ScreenReaderOnly */}
+        </Select.List>
+        {notice}
+      </Select.Popper>
+    ),
+  },
+);
+
+// Multiselect
+
+figma.connect(
+  Select.Menu,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47952-16111',
+  {
+    variant: { type: 'multiselect' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      searchInput: figma.boolean('search input', {
+        true: <Select.InputSearch value={/* value */} onChange={/* onChange */} aria-describedby={/* aria-describedby */} />,
+        false: undefined,
+      }),
+      notice: figma.boolean('notice ↓', {
+        true: figma.children('Notice'),
+        false: undefined,
+      }),
+    },
+
+    example: ({ searchInput, notice, size }) => (
+      <Select.Popper size={size} aria-label='/* Add your aria-label */'>
+        {searchInput}
+        <Select.Menu hMax={/* value */}>
+          <Select.Option value='%all%'>
+            <Text color='text-link'>
+              {currentValue.length ? 'Deselect all' : 'Select all'}
+            </Text>
+          </Select.Option>
+          <Select.Option value={/* value */} key={/* value */}>
+            <Select.Option.Checkbox />
+            {/* option */}
+          </Select.Option>
+        </Select.Menu>
+        {notice}
+      </Select.Popper>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/select/SelectMenu.figma.jsx b/figma/mappings/core-components/select/SelectMenu.figma.jsx
new file mode 100644
index 0000000000..3c661c1c09
--- /dev/null
+++ b/figma/mappings/core-components/select/SelectMenu.figma.jsx
@@ -0,0 +1,29 @@
+import figma from '@figma/code-connect';
+import Select from '@semcore/ui/select';
+
+figma.connect(
+  Select.Menu,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47952-16111',
+  {
+    variant: { 'type': 'select list', 'search input': 'false' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      notice: figma.boolean('notice ↓', {
+        true: figma.children('Notice'),
+        false: undefined,
+      }),
+    },
+
+    example: ({ notice, size }) => (
+      <Select.Menu size={size} hMax={/* value */}>
+        <Select.Option key={/* value */} value={/* value */}>
+          {/* option */}
+        </Select.Option>
+        {notice}
+      </Select.Menu>
+    ),
+  },
+);
diff --git a/figma/mappings/core-components/wizard/Wizard.figma.ts b/figma/mappings/core-components/wizard/Wizard.figma.ts
new file mode 100644
index 0000000000..a12b5c0717
--- /dev/null
+++ b/figma/mappings/core-components/wizard/Wizard.figma.ts
@@ -0,0 +1,44 @@
+import { connect } from '../../../src/connect';
+import type { ConnectSettings } from '../../../src/connect';
+
+const sideBar = connect.childCode('Wizard.Sidebar');
+
+let content = '{/* step content */}';
+if (
+  connect.getProp('fader ↑', true, 'ScrollArea') ||
+  connect.getProp('fader ↓', true, 'ScrollArea') ||
+  connect.getProp('fader ->', true, 'ScrollArea') ||
+  connect.getProp('<- fader', true, 'ScrollArea') ||
+  connect.getProp('vertical scroll', true, 'ScrollArea') ||
+  connect.getProp('horizontal scroll', true, 'ScrollArea')
+) {
+  content = `<ScrollArea shadow>${content}</ScrollArea>`;
+}
+
+const footer = connect.childCode('Wizard.Footer');
+
+const example = `
+<Wizard step={/* current step */}>
+  ${sideBar}
+  <Wizard.Content>
+    <Wizard.Step step={/* number */}>
+      {/* previous step content... */}
+    </Wizard.Step>
+    <Wizard.Step step={/* number */}>
+      {/* this is the current step */}
+      ${content}
+    </Wizard.Step>
+    <Wizard.Step step={/* number */}>
+      {/* next step content... */}
+    </Wizard.Step>
+    ${footer}
+  </Wizard.Content>
+</Wizard>
+  `;
+
+export const settings: ConnectSettings = {
+  example,
+  id: 'Wizard',
+  url: 'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56368-720',
+  imports: ['import Wizard from "@semcore/ui/wizard"'],
+};
diff --git a/figma/mappings/core-components/wizard/WizardFooter.figma.ts b/figma/mappings/core-components/wizard/WizardFooter.figma.ts
new file mode 100644
index 0000000000..1a7b10bf2c
--- /dev/null
+++ b/figma/mappings/core-components/wizard/WizardFooter.figma.ts
@@ -0,0 +1,37 @@
+import { connect } from '../../../src/connect';
+import type { ConnectSettings } from '../../../src/connect';
+
+const checkbox = connect.childCode('Checkbox');
+
+let wrapperStart, wrapperEnd;
+if (checkbox) {
+  wrapperStart = '<Flex direction="column" gap={3} alignItems="center">';
+  wrapperEnd = '</Flex>';
+}
+
+const stepBackText = connect.childCode('↳ text', { path: ['Wizard.StepBack'] });
+const stepBack = stepBackText ? `<Wizard.StepBack stepName="${stepBackText}" />` : undefined;
+
+const stepNextText = connect.childCode('↳ text', { path: ['Wizard.StepNext'] });
+const stepNext = stepNextText ? `<Wizard.StepNext stepName="${stepNextText}" />` : undefined;
+
+const cta = connect.childCode('CTA');
+
+const example = `
+${wrapperStart}
+${checkbox}
+<Flex>
+  ${stepBack}${cta}${stepNext}
+</Flex>
+${wrapperEnd}
+  `;
+
+export const settings: ConnectSettings = {
+  example,
+  id: 'Wizard.Footer',
+  url: 'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56368-557',
+  imports: [
+    'import Wizard from "@semcore/ui/wizard"',
+    'import { Flex } from "@semcore/ui/base-components"',
+  ],
+};
diff --git a/figma/mappings/core-components/wizard/WizardSidebar.figma.ts b/figma/mappings/core-components/wizard/WizardSidebar.figma.ts
new file mode 100644
index 0000000000..452e5569d6
--- /dev/null
+++ b/figma/mappings/core-components/wizard/WizardSidebar.figma.ts
@@ -0,0 +1,16 @@
+import { connect } from '../../../src/connect';
+import type { ConnectSettings } from '../../../src/connect';
+
+const title = connect.formatProp('title', connect.childCode('title'));
+
+const example = `
+<Wizard.Sidebar ${title}>
+  ${connect.childrenCode({ filter: (child) => child.type === 'INSTANCE' })}
+</Wizard.Sidebar>`;
+
+export const settings: ConnectSettings = {
+  example,
+  id: 'Wizard',
+  url: 'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56133-3353',
+  imports: ['import Wizard from "@semcore/ui/wizard"'],
+};
diff --git a/figma/mappings/core-components/wizard/WizardStepper.figma.ts b/figma/mappings/core-components/wizard/WizardStepper.figma.ts
new file mode 100644
index 0000000000..0d06524fb1
--- /dev/null
+++ b/figma/mappings/core-components/wizard/WizardStepper.figma.ts
@@ -0,0 +1,22 @@
+import { connect } from '../../../src/connect';
+import type { ConnectSettings } from '../../../src/connect';
+
+const completed = connect.getProp('completed');
+const number = connect.childCode('Wizard.StepNumber');
+const title = connect.childCode('title');
+const optional = connect.childCode('optional', {
+  wrapper: 'Text color="text-secondary-invert" fontWeight={400} mt={1} tag="div"',
+});
+
+const example = title || optional
+  ? `<Wizard.Stepper step={${number}} ${completed}>${title}${optional}</Wizard.Stepper>`
+  : `{/* this is an adaptive state for small viewports, 
+    refer to the full-width version for the full code */}
+  <Wizard.Stepper step={${number}} ${completed} />`;
+
+export const settings: ConnectSettings = {
+  example,
+  id: 'Wizard.Stepper',
+  url: 'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=56133-3311',
+  imports: ['import Wizard from "@semcore/ui/wizard"'],
+};
diff --git a/figma/mappings/data-table/DataTablePrimary.figma.jsx b/figma/mappings/data-table/DataTablePrimary.figma.jsx
new file mode 100644
index 0000000000..d15540dbce
--- /dev/null
+++ b/figma/mappings/data-table/DataTablePrimary.figma.jsx
@@ -0,0 +1,88 @@
+import figma from '@figma/code-connect/react';
+import { Box } from '@semcore/ui/base-components';
+import DataTable from '@semcore/ui/data-table';
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactoring-WIP---%E2%9C%A8-Table-components?node-id=3089-153990&',
+  {
+    variant: { 'action bar': 'false' },
+    example: () => (
+      <DataTable
+        data={/* Add your data here */}
+        aria-label='/* Add your aria-label here */'
+        defaultGridTemplateColumnWidth='auto'
+        wMax='/* Add your wMax here */'
+        headerProps={/* Add your headerProps here */}
+        columns={/* Add your columns here */}
+      />
+    ) },
+);
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactoring-WIP---%E2%9C%A8-Table-components?node-id=3089-153990&',
+  {
+    variant: { 'action bar': 'true' },
+
+    example: () => (
+      <>
+        <Box
+          // need this for FF
+          tabIndex={-1}
+          wMax={800}
+          h={250}
+          style={{ overflow: 'auto', scrollPaddingTop: selectedRows.length ? '44px' : undefined }}
+        >
+          {/* Add  ScreenReaderOnly component for the action bar here, refer to the Checkboxes and action bar example in the documentation */}
+          {/* Add Collapse component for the action bar here, refer to the Checkboxes and action bar example in the documentation */}
+          <DataTable
+            data={/* Add your data here */}
+            aria-label='/* Add your aria-label here */'
+            defaultGridTemplateColumnWidth='auto'
+            selectedRows={/* Add your selectedRows here */}
+            onSelectedRowsChange={/* Add your onSelectedRowsChange here */}
+            ref={/* Add your ref here */}
+            sideIndents={/* Add your sideIndents here */}
+            loading={/* Add your loading here */}
+            compact={/* Add your compact here */}
+            headerProps={/* Add your headerProps here */}
+            columns={/* Add your columns here */}
+            uniqueRowKey={/* Add your uniqueRowKey here */}
+          />
+        </Box>
+      </>
+    ) },
+);
+
+// DataTable for Cards
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactoring-WIP---%E2%9C%A8-Table-components?node-id=3089-153990&',
+  {
+    variant: { variant: 'card (grid)' },
+    example: () => (
+      <DataTable
+        data={/* Add your data here */}
+        aria-label='/* Add your aria-label here */'
+        variant='card'
+        columns={/* Add your columns here */}
+      />
+    ) },
+);
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactoring-WIP---%E2%9C%A8-Table-components?node-id=3089-153990&',
+  {
+    variant: { variant: 'card (autolayout)' },
+    example: () => (
+      <DataTable
+        data={/* Add your data here */}
+        aria-label='/* Add your aria-label here */'
+        variant='card'
+        columns={/* Add your columns here */}
+      />
+    ) },
+);
diff --git a/figma/mappings/data-table/DataTablePrimaryExamples.figma.jsx b/figma/mappings/data-table/DataTablePrimaryExamples.figma.jsx
new file mode 100644
index 0000000000..32bc388b14
--- /dev/null
+++ b/figma/mappings/data-table/DataTablePrimaryExamples.figma.jsx
@@ -0,0 +1,68 @@
+import figma from '@figma/code-connect/react';
+import DataTable from '@semcore/ui/data-table';
+
+// DataTable example with Multi-level header
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactoring-WIP---%E2%9C%A8-Table-components?node-id=110-46948',
+  {
+    example: () => (
+      // Refer to the DataTable example with Multi-level header in the documentation
+      <DataTable />
+    ) },
+);
+
+// DataTable example with Accordion
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactoring-WIP---%E2%9C%A8-Table-components?node-id=110-46492',
+  {
+    example: () => (
+      // Refer to the DataTable example with Accordion in table in the documentation
+      <DataTable />
+    ) },
+);
+
+// DataTable example with horizontal scroll
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactoring-WIP---%E2%9C%A8-Table-components?node-id=110-46562',
+  {
+    example: () => (
+      // Refer to the DataTable example for Header in the documentation
+      <DataTable />
+    ) },
+);
+
+// Simple DataTable example with several lines of text
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactoring-WIP---%E2%9C%A8-Table-components?node-id=110-46567',
+  {
+    example: () => (
+      <DataTable
+        data={/* Add your data here */}
+        aria-label='/* Add your aria-label here */'
+        defaultGridTemplateColumnWidth='auto'
+        wMax='/* Add your wMax here */'
+        headerProps={/* Add your headerProps here */}
+        columns={/* Add your columns here */}
+      />
+    ) },
+);
+
+// DataTable example with fixed column
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7139-16321',
+  {
+    example: () => (
+      // Refer to the DataTable example for Fixed column in the documentation
+      <DataTable />
+    ) },
+);
diff --git a/figma/mappings/data-table/DataTablePrimaryStates.figma.jsx b/figma/mappings/data-table/DataTablePrimaryStates.figma.jsx
new file mode 100644
index 0000000000..673feb70bf
--- /dev/null
+++ b/figma/mappings/data-table/DataTablePrimaryStates.figma.jsx
@@ -0,0 +1,112 @@
+import figma from '@figma/code-connect/react';
+import DataTable from '@semcore/ui/data-table';
+
+// DataTable example with initial loading state
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7005-14998',
+  {
+    example: () => (
+      // Refer to the DataTable example with Initial loading in the documentation
+      <DataTable />
+    ) },
+);
+
+// DataTable example with ProgressBar
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7005-15646',
+  {
+    example: () => (
+      <DataTable />
+    ) },
+);
+
+// DataTable example with loading state
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7005-16065',
+  {
+    example: () => (
+      // Refer to the DataTable example with Updating table in the documentation
+      <DataTable />
+    ) },
+);
+
+// DataTable example with limited data
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7005-18452',
+  {
+    example: () => (
+      // Refer to the DataTable example with Limited data in the documentation
+      <DataTable
+        limit={/* Add your limit block here */}
+      />
+    ) },
+);
+
+// Limit overlay
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=2898-3040&',
+  {
+    example: () => (
+      // Refer to the DataTable example with Limited data in the documentation
+      <DataTable
+        limit={/* Add your limit block here */}
+      />
+    ) },
+);
+
+// DataTable example with No data state
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7139-9539',
+  {
+    example: () => (
+      // Refer to the DataTable example with Empty state in the documentation
+      <DataTable />
+    ) },
+);
+
+// DataTable example with Nothing found state
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7139-9792',
+  {
+    example: () => (
+      // Refer to the DataTable example with Empty state in the documentation
+      <DataTable />
+    ) },
+);
+
+// DataTable example with Error state
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7139-10035',
+  {
+    example: () => (
+      // Refer to the DataTable example with Empty state in the documentation
+      <DataTable />
+    ) },
+);
+
+// DataTable example with Empty message
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7139-14219',
+  {
+    example: () => (
+      <DataTable />
+    ) },
+);
diff --git a/figma/mappings/data-table/DataTableSecondary.figma.jsx b/figma/mappings/data-table/DataTableSecondary.figma.jsx
new file mode 100644
index 0000000000..6dfa70b8f4
--- /dev/null
+++ b/figma/mappings/data-table/DataTableSecondary.figma.jsx
@@ -0,0 +1,17 @@
+import figma from '@figma/code-connect/react';
+import DataTable from '@semcore/ui/data-table';
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7144-8914&',
+  {
+    example: () => (
+      <DataTable
+        data={/* Add your data here */}
+        use='secondary'
+        sort={/* Add your sort settings here */}
+        aria-label='/* Add your aria-label here */'
+        columns={/* Add your columns here */}
+      />
+    ) },
+);
diff --git a/figma/mappings/data-table/DataTableSecondaryStates.figma.jsx b/figma/mappings/data-table/DataTableSecondaryStates.figma.jsx
new file mode 100644
index 0000000000..c599c4ec5e
--- /dev/null
+++ b/figma/mappings/data-table/DataTableSecondaryStates.figma.jsx
@@ -0,0 +1,70 @@
+import figma from '@figma/code-connect/react';
+import DataTable from '@semcore/ui/data-table';
+
+// DataTable example with initial loading state
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactoring-WIP---%E2%9C%A8-Table-components?node-id=7070-10401&',
+  {
+    example: () => (
+      // Refer to the DataTable example with Initial loading in the documentation
+      <DataTable
+        use='secondary'
+        sort={/* Add your sort settings here */}
+        aria-label='/* Add your aria-label here */'
+        columns={/* Add your columns here */}
+      />
+    ) },
+);
+
+// DataTable example with No data state
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7144-11604',
+  {
+    example: () => (
+      // Refer to the DataTable example with Empty state in the documentation
+      <DataTable
+        use='secondary'
+        sort={/* Add your sort settings here */}
+        aria-label='/* Add your aria-label here */'
+        columns={/* Add your columns here */}
+      />
+    ) },
+);
+
+// DataTable example with Nothing found state
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7144-11786',
+  {
+    example: () => (
+      // Refer to the DataTable example with Empty state in the documentation
+      <DataTable
+        use='secondary'
+        sort={/* Add your sort settings here */}
+        aria-label='/* Add your aria-label here */'
+        columns={/* Add your columns here */}
+      />
+    ) },
+);
+
+// DataTable example with Error state
+
+figma.connect(
+  DataTable,
+  'https://www.figma.com/design/hwYZpLVEg6TU1AFwpBvYXA/-Refactored---%E2%9C%A8-Table-components?node-id=7144-11889',
+  {
+    example: () => (
+      // Refer to the DataTable example with Empty state in the documentation
+      <DataTable
+        use='secondary'
+        sort={/* Add your sort settings here */}
+        aria-label='/* Add your aria-label here */'
+        columns={/* Add your columns here */}
+      />
+    ) },
+);
diff --git a/figma/mappings/ux-patterns/AutoSuggest.figma.jsx b/figma/mappings/ux-patterns/AutoSuggest.figma.jsx
new file mode 100644
index 0000000000..d7310d3d2a
--- /dev/null
+++ b/figma/mappings/ux-patterns/AutoSuggest.figma.jsx
@@ -0,0 +1,30 @@
+import figma from '@figma/code-connect/react';
+import { Box } from '@semcore/ui/base-components';
+import Input from '@semcore/ui/input';
+import Select from '@semcore/ui/select';
+
+figma.connect(
+  Box,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=15049-258574&',
+  {
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+    },
+    example: ({ size }) => (
+      <>
+        <Box>
+          <Select size={size}>
+            <Select.Trigger>
+              <Input.Value role='combobox' />
+            </Select.Trigger>
+            <Select.Menu>
+              {/* Suggestions map here */}
+            </Select.Menu>
+          </Select>
+        </Box>
+      </>
+    ) },
+);
diff --git a/figma/mappings/ux-patterns/ConfirmDialog.figma.jsx b/figma/mappings/ux-patterns/ConfirmDialog.figma.jsx
new file mode 100644
index 0000000000..759b24fd65
--- /dev/null
+++ b/figma/mappings/ux-patterns/ConfirmDialog.figma.jsx
@@ -0,0 +1,50 @@
+import figma from '@figma/code-connect/react';
+import { Flex } from '@semcore/ui/base-components';
+import Modal from '@semcore/ui/modal';
+import { Text } from '@semcore/ui/typography';
+
+figma.connect(
+  Modal,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=5771-181110&',
+  {
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      actions: figma.children('Button'),
+    },
+    example: ({ title, text, actions }) => (
+      <Modal>
+        <Modal.Title mb={2}>{title}</Modal.Title>
+        <Text size={200} tag='p'>
+          {text}
+        </Text>
+        <Flex gap={2} mt={4}>{actions}</Flex>
+      </Modal>
+    ),
+  },
+);
+
+figma.connect(
+  Modal,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=5771-181110&',
+  {
+    variant: { case: 'Delete project' },
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      list: figma.children('List'),
+      actions: figma.children('Button'),
+    },
+    example: ({ title, text, list, actions }) => (
+      <Modal>
+        <Modal.Title mb={2}>{title}</Modal.Title>
+        <Text size={200} tag='p'>
+          {text}
+        </Text>
+        {list}
+        {/* Add input for confirmation, refer to the documentation for Confirmation modal dialog */}
+        <Flex gap={2} mt={4}>{actions}</Flex>
+      </Modal>
+    ),
+  },
+);
diff --git a/figma/mappings/ux-patterns/EmptyPage.figma.jsx b/figma/mappings/ux-patterns/EmptyPage.figma.jsx
new file mode 100644
index 0000000000..640d379bfd
--- /dev/null
+++ b/figma/mappings/ux-patterns/EmptyPage.figma.jsx
@@ -0,0 +1,167 @@
+import figma from '@figma/code-connect/react';
+import { Flex } from '@semcore/ui/base-components';
+import { Text } from '@semcore/ui/typography';
+
+// Message with text content
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=143-196596&',
+  {
+    variant: { platform: 'desktop', content: 'text' },
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      actions: figma.children('Button'),
+    },
+    example: ({ title, text, actions }) => (
+      <Flex gap={10}>
+        <img src='/* Place your illustration here */' />
+        <Flex direction='column'>
+          <Text mb={3} size={300} bold>{title}</Text>
+          <Text size={200}>{text}</Text>
+          <Flex mt={5} gap={2}>
+            {actions}
+          </Flex>
+        </Flex>
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=143-196596&',
+  {
+    variant: { platform: 'mobile', content: 'text' },
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      actions: figma.children('Button'),
+    },
+    example: ({ title, text, actions }) => (
+      <Flex direction='column' gap={10}>
+        <img src='/* Place your illustration here */' />
+        <Flex direction='column'>
+          <Text mb={3} size={300} bold>{title}</Text>
+          <Text size={200}>{text}</Text>
+          <Flex mt={5} gap={2} direction='column'>
+            {actions}
+          </Flex>
+        </Flex>
+      </Flex>
+    ),
+  },
+);
+
+// Message with a form
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=143-196596&',
+  {
+    variant: { platform: 'desktop', content: 'form' },
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      input: figma.children('Input'),
+      actions: figma.children('Button'),
+    },
+    example: ({ title, text, input, actions }) => (
+      <Flex gap={10}>
+        <img src='/* Place your illustration here */' />
+        <Flex direction='column'>
+          <Text mb={3} size={300} bold>{title}</Text>
+          <Text size={200}>{text}</Text>
+          <Flex mt={5} gap={2}>
+            {input}
+            {actions}
+          </Flex>
+        </Flex>
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=143-196596&',
+  {
+    variant: { platform: 'mobile', content: 'form' },
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      actions: figma.children('Button'),
+      input: figma.children('Input'),
+    },
+    example: ({ title, text, input, actions }) => (
+      <Flex direction='column' gap={10}>
+        <img src='/* Place your illustration here */' />
+        <Flex direction='column'>
+          <Text mb={3} size={300} bold>{title}</Text>
+          <Text size={200}>{text}</Text>
+          <Flex mt={5} gap={2} direction='column'>
+            {input}
+            {actions}
+          </Flex>
+        </Flex>
+      </Flex>
+    ),
+  },
+);
+
+// Message with a list
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=143-196596&',
+  {
+    variant: { platform: 'desktop', content: 'list' },
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      list: figma.children('List'),
+      actions: figma.children('Button'),
+    },
+    example: ({ title, text, list, actions }) => (
+      <Flex gap={10}>
+        <img src='/* Place your illustration here */' />
+        <Flex direction='column'>
+          <Text mb={3} size={300} bold>{title}</Text>
+          <Text size={200}>{text}</Text>
+          {list}
+          <Flex mt={5} gap={2}>
+            {actions}
+          </Flex>
+        </Flex>
+      </Flex>
+    ),
+  },
+);
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=143-196596&',
+  {
+    variant: { platform: 'mobile', content: 'list' },
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      actions: figma.children('Button'),
+      list: figma.children('List'),
+    },
+    example: ({ title, text, list, actions }) => (
+      <Flex direction='column' gap={10}>
+        <img src='/* Place your illustration here */' />
+        <Flex direction='column'>
+          <Text mb={3} size={300} bold>{title}</Text>
+          <Text size={200}>{text}</Text>
+          {list}
+          <Flex mt={5} gap={2} direction='column'>
+            {actions}
+          </Flex>
+        </Flex>
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/mappings/ux-patterns/ExportDropdown.figma.jsx b/figma/mappings/ux-patterns/ExportDropdown.figma.jsx
new file mode 100644
index 0000000000..fca2e17f6e
--- /dev/null
+++ b/figma/mappings/ux-patterns/ExportDropdown.figma.jsx
@@ -0,0 +1,75 @@
+import figma from '@figma/code-connect/react';
+import { Flex } from '@semcore/ui/base-components';
+import DropdownMenu from '@semcore/ui/dropdown-menu';
+import { Text } from '@semcore/ui/typography';
+
+figma.connect(
+  DropdownMenu,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=17013-6655&',
+  {
+    variant: { case: 'default small' },
+    props: {
+      items: figma.children('DropdownMenu.Item/Default'),
+      message: figma.boolean('neutral message ↓', {
+        true: figma.children('Message'),
+        false: undefined,
+      }),
+      notice: figma.boolean('notice ↓', {
+        true: figma.children('Notice'),
+        false: undefined,
+      }),
+    },
+    example: ({ items, message, notice }) => (
+      <DropdownMenu>
+        <DropdownMenu.Trigger tag={Button}>
+          {/* Set trigger here */}
+        </DropdownMenu.Trigger>
+        <DropdownMenu.Popper wMax='/* Set width here */' aria-label='/* Set aria-label here */'>
+          <DropdownMenu.List>
+            {items}
+          </DropdownMenu.List>
+          {message}
+          {notice}
+        </DropdownMenu.Popper>
+      </DropdownMenu>
+    ),
+  },
+);
+
+figma.connect(
+  DropdownMenu,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=17013-6655&',
+  {
+    variant: { case: 'default form' },
+    props: {
+      title: figma.textContent('↳ title'),
+      actions: figma.children('Button'),
+      message: figma.boolean('neutral message ↓', {
+        true: figma.children('Message'),
+        false: undefined,
+      }),
+      notice: figma.boolean('notice ↓', {
+        true: figma.children('Notice'),
+        false: undefined,
+      }),
+    },
+    example: ({ title, actions, message, notice }) => (
+      <DropdownMenu>
+        <DropdownMenu.Trigger tag={Button}>
+          {/* Set trigger here */}
+        </DropdownMenu.Trigger>
+        <DropdownMenu.Popper wMax='/* Set width here */' aria-label='/* Set aria-label here */'>
+          <Flex direction='column' gap={4} alignItems='start' p={4}>
+            <Text size={300} bold>{title}</Text>
+            <Flex direction='column' gap={2}>
+              {/* Your form here */}
+            </Flex>
+            <Flex gap={2}>{actions}</Flex>
+          </Flex>
+          {message}
+          {notice}
+        </DropdownMenu.Popper>
+      </DropdownMenu>
+    ),
+  },
+);
diff --git a/figma/mappings/ux-patterns/SuccessMessage.figma.jsx b/figma/mappings/ux-patterns/SuccessMessage.figma.jsx
new file mode 100644
index 0000000000..aa8700210c
--- /dev/null
+++ b/figma/mappings/ux-patterns/SuccessMessage.figma.jsx
@@ -0,0 +1,51 @@
+import figma from '@figma/code-connect/react';
+import { Flex } from '@semcore/ui/base-components';
+import MailSent from '@semcore/ui/illustration/MailSent';
+import Modal from '@semcore/ui/modal';
+import { Text } from '@semcore/ui/typography';
+
+figma.connect(
+  Modal,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=17095-22543&',
+  {
+    variant: { type: 'modal window' },
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      actions: figma.children('Button'),
+    },
+    example: ({ title, text, actions }) => (
+      <Modal>
+        <MailSent />
+        <Modal.Title mt={6}>{title}</Modal.Title>
+        <Text size={200} tag='p'>
+          {text}
+        </Text>
+        <Flex gap={2} mt={6}>{actions}</Flex>
+      </Modal>
+    ),
+  },
+);
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/t7T1SLzIkERV1IrsjsKugE/-Refactoring-WIP--%F0%9F%92%A0-UX-Patterns?node-id=17095-22543&',
+  {
+    variant: { type: 'message' },
+    props: {
+      title: figma.textContent('↳ title'),
+      text: figma.textContent('↳ text'),
+      actions: figma.children('Button'),
+    },
+    example: ({ title, text, actions }) => (
+      <Flex direction='column'>
+        <MailSent />
+        <Text mb={2} mt={6} size={400} bold>{title}</Text>
+        <Text size={200} tag='p'>
+          {text}
+        </Text>
+        <Flex gap={2} mt={6}>{actions}</Flex>
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/mappings/ux-patterns/current-libraries/Errors.figma.jsx b/figma/mappings/ux-patterns/current-libraries/Errors.figma.jsx
new file mode 100644
index 0000000000..4dd23a1336
--- /dev/null
+++ b/figma/mappings/ux-patterns/current-libraries/Errors.figma.jsx
@@ -0,0 +1,57 @@
+import figma from '@figma/code-connect/react';
+import Error, { AccessDenied, Maintenance, PageError, PageNotFound, ProjectNotFound, getIconPath } from '@semcore/ui/errors';
+
+figma.connect(
+  PageNotFound,
+  'https://www.figma.com/design/EWdX1ly5KsoNu8sywYJdKk/%F0%9F%92%A0-UX-Patterns?node-id=12537-41788',
+  {
+    variant: { type: '404: We got lost' },
+  },
+);
+
+figma.connect(
+  AccessDenied,
+  'https://www.figma.com/design/EWdX1ly5KsoNu8sywYJdKk/%F0%9F%92%A0-UX-Patterns?node-id=12537-41788',
+  {
+    variant: { type: 'AccessDenied (Secret page)' },
+  },
+);
+
+figma.connect(
+  ProjectNotFound,
+  'https://www.figma.com/design/EWdX1ly5KsoNu8sywYJdKk/%F0%9F%92%A0-UX-Patterns?node-id=12537-41788',
+  {
+    variant: { type: '404: Project not found' },
+  },
+);
+
+figma.connect(
+  Maintenance,
+  'https://www.figma.com/design/EWdX1ly5KsoNu8sywYJdKk/%F0%9F%92%A0-UX-Patterns?node-id=12537-41788',
+  {
+    variant: { type: 'Under maintenance' },
+    example: () => <Maintenance toolName={toolname} />,
+  },
+);
+
+figma.connect(
+  PageError,
+  'https://www.figma.com/design/EWdX1ly5KsoNu8sywYJdKk/%F0%9F%92%A0-UX-Patterns?node-id=12537-41788',
+  {
+    variant: { type: '500: Smth wrong - Try again' },
+  },
+);
+
+figma.connect(
+  Error,
+  'https://www.figma.com/design/EWdX1ly5KsoNu8sywYJdKk/%F0%9F%92%A0-UX-Patterns?node-id=12537-41788',
+  {
+    example: () => (
+      <Error icon={getIconPath({ illustrationName })}>
+        <Error.Title>{errorTitle}</Error.Title>
+        <Error.Description>{errorDescription}</Error.Description>
+        <Error.Controls>{errorControls}</Error.Controls>
+      </Error>
+    ),
+  },
+);
diff --git a/figma/package.json b/figma/package.json
new file mode 100644
index 0000000000..dee9580ff8
--- /dev/null
+++ b/figma/package.json
@@ -0,0 +1,12 @@
+{
+  "name": "figma",
+  "version": "1.0.0",
+  "description": "",
+  "scripts": {
+    "figma-publish": "npx figma connect publish",
+    "figma-publish-custom": "npx figma connect publish --config figma-custom.config.json"
+  },
+  "dependencies": {
+    "@figma/code-connect": "^1.3.12"
+  }
+}
diff --git a/figma/src/connect.ts b/figma/src/connect.ts
new file mode 100644
index 0000000000..3b0fa5b8cf
--- /dev/null
+++ b/figma/src/connect.ts
@@ -0,0 +1,148 @@
+import { figma } from './figma';
+import type { LayerHandle, ErrorHandle } from './figma';
+const rootinstance = figma.selectedInstance;
+
+interface ChildCodeParameters {
+  wrapper?: string;
+  path?: string[];
+}
+
+interface ChildrenCodeParameters {
+  layerName?: string;
+  wrapper?: string;
+  filter: (value: LayerHandle, index: number, array: LayerHandle[]) => boolean;
+}
+
+interface Result {
+  node: LayerHandle;
+  path: string[];
+}
+
+const traverse = (
+  node: LayerHandle,
+  layerName: string,
+  results: Result[],
+  path: string[] = [],
+) => {
+  if (node.name === layerName) {
+    results.push({ node, path: path.slice(1) });
+    return;
+  }
+
+  if (node.type === 'INSTANCE' && node.children) {
+    node.children.forEach((child) => {
+      traverse(child, layerName, results, [...path, node.name]);
+    });
+  }
+};
+
+const layerCode = (layer: LayerHandle | ErrorHandle | undefined) => {
+  switch (layer?.type) {
+    case 'INSTANCE': return figma.tsx`${layer.executeTemplate().example}`;
+    case 'TEXT': return figma.tsx`${layer.textContent}`;
+    default: return;
+  }
+};
+
+export const connect = {
+  /** Returns a pretty representation of a prop/value pair. */
+  formatProp: (propName: string, propValue: string | boolean | undefined) => {
+    if (propValue) {
+      if (!['true', 'false'].includes(propValue.toString().toLowerCase()) && !propValue.toString().startsWith('/*')) {
+        return figma.tsx`${propName} = "${propValue}"`;
+      }
+      return figma.tsx`${propName} = {${propValue}}`;
+    }
+  },
+  /**
+   * Gets a property value and returns a pretty representation of it and its value.
+   * @expectedPropValue check if the prop value matches the expected value and return that value
+   * @layerName get the prop from the child instance with this name, instead of the root instance
+   * @returns A string like `prop = {value}` or `prop = "value"`. With `expectedPropValue` returns only `value`
+   * */
+  getProp: (propName: string, expectedPropValue?: string | boolean, layerName?: string) => {
+    if (figma.selectedInstance) {
+      const instance = layerName ? figma.selectedInstance.findInstance(layerName) : figma.selectedInstance;
+      if (instance.type === 'INSTANCE') {
+        const propValue = instance.getPropertyValue(propName).toString().toLowerCase();
+        if (expectedPropValue !== undefined) {
+          if (propValue == expectedPropValue.toString().toLowerCase()) {
+            return propValue;
+          }
+        } else {
+          if (!['true', 'false'].includes(propValue)) {
+            return figma.tsx`${propName} = "${propValue}"`;
+          } else if (propValue === 'true') {
+            return propName;
+          }
+        }
+      }
+    }
+    return;
+  },
+  /**
+   * @returns array of children
+   * @param prop return only children that have `prop=value`
+   */
+  children: ({ prop, value }: { prop?: string; value?: string | boolean } = {}) => {
+    if (rootinstance) {
+      if (prop !== undefined && value !== undefined) {
+        return rootinstance.findLayers((child) => child.type === 'INSTANCE' && child.getPropertyValue(prop) === value);
+      }
+      return rootinstance.findLayers((child) => child.type === 'INSTANCE');
+    }
+    return [];
+  },
+  /** Finds a child instance or text by the layer name and returns its code. */
+  childCode: (layerName: string, params?: ChildCodeParameters) => {
+    if (rootinstance) {
+      const { path, wrapper } = params ?? {};
+      const inst = rootinstance.findInstance(layerName, { path });
+      const text = rootinstance.findText(layerName, { traverseInstances: !!path });
+      let result: string | string[] | undefined;
+      if (text.type === 'TEXT' && path) {
+        const results: Result[] = [];
+        traverse(rootinstance, layerName, results);
+        result = layerCode(results.filter((node) => node.path.join('#SEP;') === path?.join('#SEP;'))[0]?.node);
+      } else {
+        result = layerCode(inst) ?? layerCode(text);
+      }
+      if (result)
+        return wrapper
+          ? figma.tsx`<${wrapper}>${result}</${wrapper.split(' ')[0]}>`
+          : result;
+    }
+  },
+  /**
+   * @layerName only returns children of the specified nested layer
+   * @wrapper wraps the code in `<{wrapper}>` tags
+   * @returns the code for all children
+   * */
+  childrenCode: (params?: ChildrenCodeParameters) => {
+    const { layerName, wrapper, filter } = params ?? { filter: () => true };
+    if (figma.selectedInstance) {
+      const instance = layerName ? figma.selectedInstance.findInstance(layerName) : figma.selectedInstance;
+      if (instance.type === 'INSTANCE') {
+        let code: string | undefined;
+        instance.children.filter(filter).forEach((child) => {
+          code = figma.tsx`${code}${child.type === 'INSTANCE' ? child.executeTemplate().example : child.textContent}`;
+        });
+        if (wrapper && code) code = figma.tsx`<${wrapper}>${code}</${wrapper}>`;
+        return code;
+      }
+    }
+  },
+  getBoolean: (propName: string, options?: Record<string, any>) => rootinstance?.getBoolean(propName, options),
+  printAll: () => JSON.stringify(rootinstance),
+};
+
+export interface ConnectSettings {
+  /** Code snippet that will display in Figma. */
+  example: string | undefined;
+  /** Component ID. Can be used to reference component in other examples. */
+  id: string;
+  /** Figma node URL. */
+  url: string;
+  /** List of imports for the component. */
+  imports?: string[];
+};
diff --git a/figma/src/figma.ts b/figma/src/figma.ts
new file mode 100644
index 0000000000..3ad7646ad8
--- /dev/null
+++ b/figma/src/figma.ts
@@ -0,0 +1,87 @@
+interface InstanceHandle {
+  name: string;
+  /**
+   * Gets a boolean property value.
+   * Optional mapping object can transform the boolean value to any other type.
+   * */
+  getBoolean(propName: string, options?: Record<string, any>): boolean | any;
+  /** Gets a raw property value. */
+  getPropertyValue(propName: string): string | boolean;
+  /**
+   * Finds an child instance layer by name.
+   * Optional selector options for path matching and traversal behavior.
+   * */
+  findInstance(layerName: string, opts?: SelectorOptions): InstanceHandle | ErrorHandle;
+  /**
+   * Finds a text layer by name.
+   * Optional selector options for path matching and traversal behavior.
+   * */
+  findText(layerName: string, opts?: SelectorOptions): TextHandle | ErrorHandle;
+  /**
+   * Finds all layers (instances or text) that match the selector function.
+   * Optional selector options for path matching and traversal behavior.
+   * */
+  findLayers(selectorFn: (node: LayerHandle) => boolean, opts?: SelectorOptions): LayerHandle[];
+  type: 'INSTANCE';
+  /**
+   * Renders the instance and returns both the rendered sections and metadata.
+   * */
+  executeTemplate: () => { example: ResultSection[]; metadata: Metadata };
+  children: LayerHandle[];
+};
+
+interface TextHandle {
+  name: string;
+  type: 'TEXT';
+  textContent: string;
+};
+
+export interface ErrorHandle {
+  type: 'ERROR';
+};
+
+export type LayerHandle = InstanceHandle | TextHandle;
+
+/** Options for finding layers */
+interface SelectorOptions {
+  /** List of parent layer names that matches the layer hierarchy */
+  path?: string[];
+  /** Whether to search through nested instances */
+  traverseInstances?: boolean;
+}
+
+/** Metadata that can be included in template exports */
+interface Metadata {
+  /**
+   * Controls how nested instances are rendered in the Code Connect panel:
+   * - true: The instance's code will be rendered inline within its parent
+   * - false: The instance will be shown as a clickable pill that expands when clicked
+   *
+   * For example:
+   * - Set to true for small components like icons that make sense inline
+   * - Set to false for complex components that should be viewed separately
+   */
+  nestable?: boolean;
+
+  /** Props which can be consumed in a parent instance */
+  props?: Record<string, any>;
+}
+
+/**
+ * Dummy type. See full info on
+ * [Code Sections (Template V2 API)](https://developers.figma.com/docs/code-connect/template-v2-api/#code-sections)
+ * */
+type ResultSection = string;
+
+interface Figma {
+  tsx: (...str: (any)[]) => string;
+  selectedInstance?: InstanceHandle;
+};
+
+/**
+ * Dummy figma object. See full info on
+ * [Template V2 API](https://developers.figma.com/docs/code-connect/template-v2-api/)
+ */
+export const figma: Figma = {
+  tsx: () => '',
+};
diff --git a/figma/src/icons.ts b/figma/src/icons.ts
new file mode 100644
index 0000000000..6a1d26c947
--- /dev/null
+++ b/figma/src/icons.ts
@@ -0,0 +1,53 @@
+import fs from 'fs/promises';
+
+import dotenv from 'dotenv';
+import * as Figma from 'figma-js';
+
+// create .env file in the root of the project and put this line there:
+// FIGMA_ACCESS_TOKEN=yourFigmaToken
+dotenv.config({ path: './.env' });
+
+const accessToken = process.env.FIGMA_ACCESS_TOKEN;
+
+const figma = Figma.Client({ personalAccessToken: accessToken });
+// const axiosOptions = { headers: { "X-FIGMA-TOKEN": accessToken } };
+
+const fileid = 'lVX2dKnVFtcSTQV7eSS5j1';
+
+const sets = await figma.fileComponentSets(fileid);
+const components = await figma.fileComponents(fileid);
+
+let str = `import figma from '@figma/code-connect';
+`;
+
+for (const set of sets.data.meta.component_sets) {
+  let folder = '';
+  switch (set.containing_frame.nodeId) {
+    case '4738:24': folder = 'icon/color';
+      break;
+    case '3940:14': folder = 'icon/pay';
+      break;
+    default: folder = 'icon';
+  }
+  const sizes = ['M', 'L'];
+
+  for (const size of sizes) {
+    str += `
+import ${set.name}${size} from '@semcore/ui/${folder}/${set.name}/${size.toLowerCase()}';
+figma.connect(${set.name}${size}, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=${set.node_id}', {
+  variant: { ${folder === 'icon/pay' ? 'size' : 'Size'}: '${folder === 'icon/pay' ? size.toLowerCase() : size}' },
+  example: () => <${set.name}${size} />,
+});
+`;
+  }
+}
+
+for (const component of components.data.meta.components) {
+  if (component.containing_frame.nodeId !== '7776:24') continue;
+  str += `
+import ${component.name} from '@semcore/ui/icon/platform/${component.name}';
+figma.connect(${component.name}, 'https://www.figma.com/design/lVX2dKnVFtcSTQV7eSS5j1/%F0%9F%94%8D-Icons?node-id=${component.node_id}');
+`;
+}
+
+await fs.writeFile(`../Icon.figma.jsx`, str);
diff --git a/figma/src/parser-old.ts b/figma/src/parser-old.ts
new file mode 100644
index 0000000000..607efc6e8a
--- /dev/null
+++ b/figma/src/parser-old.ts
@@ -0,0 +1,90 @@
+import fs from 'fs';
+
+import type {
+  ParseResponsePayload, ParserExecutableMessage, CodeConnectDoc,
+} from './parser.types';
+
+const messages: ParserExecutableMessage[] = [];
+
+const readFile = (filePath: string) => {
+  messages.push({ level: 'INFO', message: `\n-> Parsing ${filePath}` });
+
+  let template = fs.readFileSync(filePath, 'utf-8');
+  const templateStrings = template.split('\n');
+
+  let figmaNode = '';
+  let component = '';
+  const imports: string[] = [];
+  let i = 0;
+
+  // parsing metadata
+  while (!templateStrings[i].includes('require(\'figma\')')) {
+    let line = templateStrings[i];
+
+    if (line.startsWith('//')) {
+      line = line.substring(2).trim();
+
+      const url = line.match(/https:\/\/.+/);
+      if (url)
+        figmaNode = url[0];
+
+      const componentMatch = line.match(/^component:*\s*(.+)/);
+      if (componentMatch)
+        component = componentMatch[1];
+
+      if (line.startsWith('import'))
+        imports.push(line);
+    }
+    i++;
+  }
+
+  if (figmaNode === '') {
+    messages.push({
+      level: 'WARN',
+      message: 'Didn\'t find the node URL, skipping file.',
+    });
+    return;
+  }
+
+  // custom functions
+  const injectable = `
+  const layerArrayCode = (array, wrapper) => {
+    let code;
+    array.forEach((child) => code = figma.tsx\`\${code}\${child.type === 'INSTANCE' ? child.executeTemplate().example : child.textContent}\`);
+    if (wrapper && code) code = figma.tsx\`<\${wrapper}>\${code}</\${wrapper}>\`;
+    return code;
+  };
+  const instanceCode = (instance, layerName) => {
+    if (instance.findInstance(layerName).type === 'INSTANCE')
+      return instance.findInstance(layerName).executeTemplate().example;
+    return undefined;
+  }
+  `;
+  template = [templateStrings[i], injectable, ...templateStrings.slice(i + 1)].join('\n');
+
+  return {
+    figmaNode,
+    component,
+    source: 'string',
+    template,
+    templateData: {
+      nestable: true,
+      props: {},
+      imports,
+    },
+    language: 'typescript',
+    label: 'React',
+  } as CodeConnectDoc;
+};
+
+const stdin = JSON.parse(fs.readFileSync(0, 'utf-8')) as { paths: string[] };
+if (!stdin.paths.length) messages.push({ level: 'ERROR', message: 'No files found.' });
+
+const docs = stdin.paths.map((path) => readFile(path)).filter((item) => item !== undefined);
+
+const payload: ParseResponsePayload = {
+  docs,
+  messages,
+};
+
+process.stdout.write(JSON.stringify(payload));
diff --git a/figma/src/parser.ts b/figma/src/parser.ts
new file mode 100644
index 0000000000..bcc2a86146
--- /dev/null
+++ b/figma/src/parser.ts
@@ -0,0 +1,59 @@
+import fs from 'fs';
+
+import * as esbuild from 'esbuild';
+
+import type { ConnectSettings } from './connect';
+import type {
+  ParseResponsePayload, ParserExecutableMessage, CodeConnectDoc,
+} from './parser.types';
+
+const messages: ParserExecutableMessage[] = [];
+
+const prepare = (content: string) => {
+  return `var figma = require("figma");
+  ${content
+    .replace(/import.*figma.*/, '')
+    .replace('var settings =', 'export default')
+    .replace(/\s*export\s*{.*};?/s, '')
+    .replaceAll(' `', ' figma.tsx`')}`;
+};
+
+const stdin = JSON.parse(fs.readFileSync(0, 'utf-8')) as { paths: string[] };
+if (!stdin.paths.length) messages.push({ level: 'ERROR', message: 'No files found.' });
+
+const docs: CodeConnectDoc[] = [];
+
+for (const path of stdin.paths) {
+  messages.push({ level: 'INFO', message: `\n-> Parsing ${path}` });
+  const { settings }: { settings: ConnectSettings } = await import(path);
+
+  const out = await esbuild.build({
+    entryPoints: [path],
+    outdir: './mappings',
+    bundle: true,
+    platform: 'neutral',
+    write: false,
+    external: ['./figma'],
+  });
+
+  docs.push({
+    template: prepare(out.outputFiles[0].text),
+    figmaNode: settings.url,
+    component: '',
+    source: 'string',
+    language: 'typescript',
+    label: 'React',
+    templateData: {
+      nestable: true,
+      props: {},
+      imports: settings.imports ?? [],
+    },
+  });
+}
+
+const payload: ParseResponsePayload = {
+  docs,
+  messages,
+};
+
+process.stdout.write(JSON.stringify(payload));
diff --git a/figma/src/parser.types.ts b/figma/src/parser.types.ts
new file mode 100644
index 0000000000..d6b449a9e8
--- /dev/null
+++ b/figma/src/parser.types.ts
@@ -0,0 +1,92 @@
+export interface CodeConnectDoc {
+  /** The Figma node URL the doc links to e.g. https://www.figma.com/design/123/MyFile?node-id=1-1 */
+  figmaNode: string;
+  /**
+   * Optional component name. This is only used for display purposes
+   * so can be omitted if it's not relevant to the language/framework
+   * */
+  component?: string;
+  /** Variant restrictions keyed by Figma property name e.g. `{ 'With icon': true }` */
+  variant?: Record<string, string>;
+  /** Source path - a relative path to the file containing the component definition */
+  source: string;
+  /** Optional source location containing line number information. */
+  sourceLocation?: {
+    /**
+     * Optional line number to link to.
+     * This is only used if type === 'PATH', to generate a link to the correct line.
+     * */
+    line: number;
+  };
+  /** The JS template function to use for this doc */
+  template: string;
+  templateData: {
+    /**
+     * Map of information describing the props used by the template.
+     * This is used by the CLI to validate props before publishing.
+     * */
+    props: PropMapping;
+
+    /**
+     * Optional array of imports for this component.
+     * These are prepended to the example code.
+     */
+    imports?: string[];
+
+    /** Whether the example should be rendered inline if it's a nested instance */
+    nestable?: boolean;
+  };
+  /** The language to use for syntax highlighting */
+  language: SyntaxHighlightLanguage;
+  /** Label to be used for the example in the UI */
+  label: string;
+}
+
+export interface ParseResponsePayload {
+  /** Array of Code Connect docs parsed from the input files */
+  docs: CodeConnectDoc[];
+  /** Any info, warning or error messages generated during parsing. */
+  messages: ParserExecutableMessage[];
+};
+
+export interface ParserExecutableMessage {
+  /**
+   * DEBUG and INFO messages should be output to console by the CLI for the user to read,
+   * according to the current log level setting.
+   * If any WARNING or ERROR messages are returned, the CLI can determine whether it should proceed with publishing
+   * or not based on configuration and the return code should be zero or non-zero as appropriate.
+   * */
+  level: 'DEBUG' | 'INFO' | 'WARN' | 'ERROR';
+  /** Optional type of message which can be displayed highlighted in the output */
+  type?: string;
+  message: string;
+  /** Optional source location which can be displayed in a standardised form */
+  sourceLocation?: {
+    file: string;
+    line?: number;
+  };
+};
+
+type PropMapping = Record<string, string>; // Intrinsic>; ?!
+
+type SyntaxHighlightLanguage =
+  | 'typescript'
+  | 'cpp'
+  | 'ruby'
+  | 'css'
+  | 'javascript'
+  | 'html'
+  | 'json'
+  | 'graphql'
+  | 'python'
+  | 'go'
+  | 'sql'
+  | 'swift'
+  | 'kotlin'
+  | 'rust'
+  | 'bash'
+  | 'xml'
+  | 'plaintext'
+  | 'jsx'
+  | 'tsx'
+  | 'dart';
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 19b44086c4..e4c4e50766 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -295,6 +295,12 @@ importers:
         specifier: 2.8.0
         version: 2.8.0
 
+  figma:
+    dependencies:
+      '@figma/code-connect':
+        specifier: ^1.3.12
+        version: 1.3.12
+
   playground:
     dependencies:
       d3-shape:
@@ -2965,7 +2971,7 @@ importers:
         version: 0.14.29
       vitest-axe:
         specifier: 0.1.0
-        version: 0.1.0(vitest@3.0.9(@types/debug@4.1.12)(@types/node@22.18.8)(@vitest/browser@3.0.6)(@vitest/ui@3.0.6)(happy-dom@9.20.3)(jsdom@22.1.0)(less@3.13.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(sass@1.93.2)(sugarss@5.0.1(postcss@8.5.6))(terser@5.44.0)(yaml@2.8.0))
+        version: 0.1.0(vitest@3.0.9(@types/debug@4.1.12)(@types/node@22.18.8)(@vitest/browser@3.0.6(@types/node@18.16.15)(playwright@1.48.0)(typescript@5.8.3)(vite@6.3.5(@types/node@18.16.15)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.38))(terser@5.44.0)(yaml@2.8.0))(vitest@3.0.9)(webdriverio@8.24.3(typescript@5.8.3)))(@vitest/ui@3.0.6(vitest@3.0.9))(happy-dom@9.20.3)(jsdom@22.1.0)(less@3.13.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(sass@1.93.2)(sugarss@5.0.1(postcss@8.5.6))(terser@5.44.0)(yaml@2.8.0))
 
   website:
     dependencies:
@@ -3332,6 +3338,9 @@ packages:
     resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==}
     engines: {node: '>=6.0.0'}
 
+  '@asamuzakjp/css-color@3.2.0':
+    resolution: {integrity: sha512-K1A6z8tS3XsmCMM86xoWdn7Fkdn9m6RSVtocUrJYIwZnFVkng/PvkEoWtOWmP+Scc6saYWHWZYbndEEXxl24jw==}
+
   '@axe-core/playwright@4.9.1':
     resolution: {integrity: sha512-8m4WZbZq7/aq7ZY5IG8GqV+ZdvtGn/iJdom+wBg+iv/3BAOBIfNQtIu697a41438DzEEyptXWmC3Xl5Kx/o9/g==}
     peerDependencies:
@@ -3493,7 +3502,6 @@ packages:
   '@babel/plugin-proposal-class-properties@7.18.6':
     resolution: {integrity: sha512-cumfXOF0+nzZrrN8Rf0t7M+tF6sZc7vhQwYQck9q1/5w2OExlD+b4v4RpMJFaV1Z7WcDRgO6FqvxqxGlwo+RHQ==}
     engines: {node: '>=6.9.0'}
-    deprecated: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-class-properties instead.
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
@@ -3518,7 +3526,6 @@ packages:
   '@babel/plugin-proposal-optional-chaining@7.18.9':
     resolution: {integrity: sha512-v5nwt4IqBXihxGsW2QmCWMDS3B3bzGIk/EQVZz2ei7f3NJl8NzAJVvUmpDW5q1CRNY+Beb/k58UAH1Km1N411w==}
     engines: {node: '>=6.9.0'}
-    deprecated: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-optional-chaining instead.
     peerDependencies:
       '@babel/core': ^7.0.0-0
 
@@ -4072,6 +4079,10 @@ packages:
     resolution: {integrity: sha512-CEypeeykO9AN7JWkr1OEOQb0HRzZlPWGwV0Ya6DuVgFdDi6g3ma/cPZ5ZPZM4AWQikDpq/0llnGGlIL+j8afzw==}
     engines: {node: ^14 || ^16 || >=18}
 
+  '@csstools/color-helpers@5.1.0':
+    resolution: {integrity: sha512-S11EXWJyy0Mz5SYvRmY8nJYTFFd1LCNV+7cXyAgQtOOuzb4EsgfqDufL+9esx72/eLhsRdGZwaldu/h+E4t4BA==}
+    engines: {node: '>=18'}
+
   '@csstools/convert-colors@1.4.0':
     resolution: {integrity: sha512-5a6wqoJV/xEdbRNKVo6I4hO3VjyDq//8q2f9I6PBAvMesJHFauXDorcNCsr9RzvsZnaWi5NYCcfyqP1QeFHFbw==}
     engines: {node: '>=4.0.0'}
@@ -4083,6 +4094,13 @@ packages:
       '@csstools/css-parser-algorithms': ^2.7.1
       '@csstools/css-tokenizer': ^2.4.1
 
+  '@csstools/css-calc@2.1.4':
+    resolution: {integrity: sha512-3N8oaj+0juUw/1H3YwmDDJXCgTB1gKU6Hc/bB502u9zR0q2vd786XJH9QfrKIEgFlZmhZiq6epXl4rHqhzsIgQ==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      '@csstools/css-parser-algorithms': ^3.0.5
+      '@csstools/css-tokenizer': ^3.0.4
+
   '@csstools/css-color-parser@2.0.5':
     resolution: {integrity: sha512-lRZSmtl+DSjok3u9hTWpmkxFZnz7stkbZxzKc08aDUsdrWwhSgWo8yq9rq9DaFUtbAyAq2xnH92fj01S+pwIww==}
     engines: {node: ^14 || ^16 || >=18}
@@ -4090,16 +4108,33 @@ packages:
       '@csstools/css-parser-algorithms': ^2.7.1
       '@csstools/css-tokenizer': ^2.4.1
 
+  '@csstools/css-color-parser@3.1.0':
+    resolution: {integrity: sha512-nbtKwh3a6xNVIp/VRuXV64yTKnb1IjTAEEh3irzS+HkKjAOYLTGNb9pmVNntZ8iVBHcWDA2Dof0QtPgFI1BaTA==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      '@csstools/css-parser-algorithms': ^3.0.5
+      '@csstools/css-tokenizer': ^3.0.4
+
   '@csstools/css-parser-algorithms@2.7.1':
     resolution: {integrity: sha512-2SJS42gxmACHgikc1WGesXLIT8d/q2l0UFM7TaEeIzdFCE/FPMtTiizcPGGJtlPo2xuQzY09OhrLTzRxqJqwGw==}
     engines: {node: ^14 || ^16 || >=18}
     peerDependencies:
       '@csstools/css-tokenizer': ^2.4.1
 
+  '@csstools/css-parser-algorithms@3.0.5':
+    resolution: {integrity: sha512-DaDeUkXZKjdGhgYaHNJTV9pV7Y9B3b644jCLs9Upc3VeNGg6LWARAT6O+Q+/COo+2gg/bM5rhpMAtf70WqfBdQ==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      '@csstools/css-tokenizer': ^3.0.4
+
   '@csstools/css-tokenizer@2.4.1':
     resolution: {integrity: sha512-eQ9DIktFJBhGjioABJRtUucoWR2mwllurfnM8LuNGAqX3ViZXaUchqk+1s7jjtkFiT9ySdACsFEA3etErkALUg==}
     engines: {node: ^14 || ^16 || >=18}
 
+  '@csstools/css-tokenizer@3.0.4':
+    resolution: {integrity: sha512-Vd/9EVDiu6PPJt9yAh6roZP6El1xHrdvIVGjyBsHR0RYwNHgL7FJPyIIW4fANJNG6FtyZfvlRPpFI4ZM/lubvw==}
+    engines: {node: '>=18'}
+
   '@csstools/media-query-list-parser@2.1.13':
     resolution: {integrity: sha512-XaHr+16KRU9Gf8XLi3q8kDlI18d5vzKSKCY510Vrtc9iNR0NJzbY9hhTmwhzYZj/ZwGL4VmB3TA9hJW0Um2qFA==}
     engines: {node: ^14 || ^16 || >=18}
@@ -4680,6 +4715,15 @@ packages:
     resolution: {integrity: sha512-OEl393iCOoo/z8bMezRlJu+GlRGlsKbUAN7jKB6LhnKoqKve5DXRpalbItIIcwnCjs1k/FOPjFzcA6Qn+H+YbA==}
     engines: {node: '>=18.0.0', npm: '>=9.0.0'}
 
+  '@fastify/busboy@2.1.1':
+    resolution: {integrity: sha512-vBZP4NlzfOlerQTnba4aqZoMhE/a9HY7HRqoOPaETQcSQuWEIyZMHGfVu6w9wGtGK5fED5qRs2DteVCjOH60sA==}
+    engines: {node: '>=14'}
+
+  '@figma/code-connect@1.3.12':
+    resolution: {integrity: sha512-hQtBHRRCRxGLzlssT+7OwK63p+S+IWsq3tqlwtoYNwA2dp7UyppFA6YR/UTAxZFGrEvPO0Kyc8x/lldI6lvuJw==}
+    engines: {node: '>=18'}
+    hasBin: true
+
   '@formatjs/ecma402-abstract@1.11.7':
     resolution: {integrity: sha512-uNaok4XWMJBtPZk/veTDamFCm5HeWJUk2jwoVfH5/+wenQ60QHjH6T3UQ0GOOCz9jpKmed7vqOri7xSf//Dt7g==}
 
@@ -5732,6 +5776,9 @@ packages:
   '@tootallnate/quickjs-emscripten@0.23.0':
     resolution: {integrity: sha512-C5Mc6rdnsaJDjO3UpGW/CQTHtCKaYlScZTly4JIu97Jxo/odCiH0ITnDXSJPTOrEKk/ycSZ0AOgTmkDtkOsvIA==}
 
+  '@ts-morph/common@0.28.1':
+    resolution: {integrity: sha512-W74iWf7ILp1ZKNYXY5qbddNaml7e9Sedv5lvU1V8lftlitkc9Pq1A+jlH23ltDgWYeZFFEqGCD1Ies9hqu3O+g==}
+
   '@tsconfig/node10@1.0.11':
     resolution: {integrity: sha512-DcRjDCujK/kCk/cUe8Xz8ZSpm8mS3mNNpta+jGCA6USEDfktlNvm1+IuZ9eTcDbNk41BHwpHHeW+N1lKCz4zOw==}
 
@@ -5818,7 +5865,6 @@ packages:
 
   '@types/dompurify@3.2.0':
     resolution: {integrity: sha512-Fgg31wv9QbLDA0SpTOXO3MaxySc4DKGLi8sna4/Utjo4r3ZRPdCt4UQee8BWr+Q5z21yifghREPJGYaEOEIACg==}
-    deprecated: This is a stub types definition. dompurify provides its own type definitions, so you do not need this installed.
 
   '@types/eslint-scope@3.7.7':
     resolution: {integrity: sha512-MzMFlSLBqNF2gcHWO0G1vP/YQyfvrxZ0bF+u7mzUdZ1/xK4A4sru+nraZz5i3iEIk1l1uyicaDVTB4QbbEkAYg==}
@@ -5938,7 +5984,6 @@ packages:
 
   '@types/minimatch@6.0.0':
     resolution: {integrity: sha512-zmPitbQ8+6zNutpwgcQuLcsEpn/Cj54Kbn7L5pX0Os5kdWplB7xPgEh/g+SWOB/qmows2gpuCaPyduq8ZZRnxA==}
-    deprecated: This is a stub types definition. minimatch provides its own type definitions, so you do not need this installed.
 
   '@types/minimist@1.2.5':
     resolution: {integrity: sha512-hov8bUuiLiyFPGyFPE1lwWhmzYbirOXQNNo40+y3zow8aFVTeyn3VWL0VFFfdNddA8S4Vf0Tc062rzyNr7Paag==}
@@ -6010,7 +6055,6 @@ packages:
 
   '@types/rollup@0.54.0':
     resolution: {integrity: sha512-oeYztLHhQ98jnr+u2cs1c3tHOGtpzrm9DJlIdEjznwoXWidUbrI+X6ib7zCkPIbB7eJ7VbbKNQ5n/bPnSg6Naw==}
-    deprecated: This is a stub types definition for rollup (https://github.com/rollup/rollup). rollup provides its own type definitions, so you don't need @types/rollup installed!
 
   '@types/sax@1.2.7':
     resolution: {integrity: sha512-rO73L89PJxeYM3s3pPPjiPgVVcymqU490g0YO5n5By0k2Erzj6tay/4lr1CHAAU4JyOWd1rpQ8bCf6cZfHU96A==}
@@ -6071,7 +6115,6 @@ packages:
 
   '@types/webpack-dev-server@4.7.2':
     resolution: {integrity: sha512-Y3p0Fmfvp0MHBDoCzo+xFJaWTw0/z37mWIo6P15j+OtmUDLvznJWdZNeD7Q004R+MpQlys12oXbXsrXRmxwg4Q==}
-    deprecated: This is a stub types definition. webpack-dev-server provides its own type definitions, so you do not need this installed.
 
   '@types/webpack-sources@3.2.3':
     resolution: {integrity: sha512-4nZOdMwSPHZ4pTEZzSp0AsTM4K7Qmu40UKW4tJDiOVs20UzYF9l+qUe4s0ftfN0pin06n+5cWWDJXH+sbhAiDw==}
@@ -6513,7 +6556,6 @@ packages:
 
   abab@2.0.6:
     resolution: {integrity: sha512-j2afSsaIENvHZN2B8GOpF566vZ5WVk5opAiMTvWgaQT8DkbOqsTfvNAvHoRGU2zzP8cPoqys+xHTRDWW8L+/BA==}
-    deprecated: Use your platform's native atob() and btoa() methods instead
 
   abort-controller@3.0.0:
     resolution: {integrity: sha512-h8lQ8tacZYnR3vNQTgibj+tODHI5/+l06Au2Pcriv/Gmet0eaj4TwWH41sO9wnHDiQsEj19q0drzdWdeAHtweg==}
@@ -6620,6 +6662,9 @@ packages:
   anser@1.4.10:
     resolution: {integrity: sha512-hCv9AqTQ8ycjpSd3upOJd7vFwW1JaoYQ7tpham03GJ1ca8/65rqn0RpaWpItOAd6ylW9wAw6luXYPJIyPFVOww==}
 
+  ansi-align@3.0.1:
+    resolution: {integrity: sha512-IOfwwBF5iczOjp/WeY4YxyjqAFMQoZufdQWDd19SEExbVLNXqvpzSJ/M7Za4/sCPmQ0+GRquoA7bGcINcxew6w==}
+
   ansi-colors@4.1.3:
     resolution: {integrity: sha512-/6w/C21Pm1A7aZitlI5Ni/2J6FFQN8i1Cvz3kHABAAbw93v/NlvKdVOqz7CCWz/3iv/JplRSEEZ83XION15ovw==}
     engines: {node: '>=6'}
@@ -7047,6 +7092,10 @@ packages:
   bowser@2.12.1:
     resolution: {integrity: sha512-z4rE2Gxh7tvshQ4hluIT7XcFrgLIQaw9X3A+kTTRdovCz5PMukm/0QC/BKSYPj3omF5Qfypn9O/c5kgpmvYUCw==}
 
+  boxen@5.1.1:
+    resolution: {integrity: sha512-JtIQYts08AFAYGF4eSh3pUt3NQkYV/e75pRtQmAVTLNWR/1L7Bsswxlgzgk8nmLEM+gFszsIlA9BgD3XnSqp3g==}
+    engines: {node: '>=10'}
+
   brace-expansion@1.1.12:
     resolution: {integrity: sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==}
 
@@ -7286,6 +7335,10 @@ packages:
     resolution: {integrity: sha512-4diC9HaTE+KRAMWhDhrGOECgWZxoevMc5TlkObMqNSsVU62PYzXZ/SMTjzyGAFF1YusgxGcSWTEXBhp0CPwQ1A==}
     engines: {node: '>=6'}
 
+  cli-boxes@2.2.1:
+    resolution: {integrity: sha512-y4coMcylgSCdVinjiDBuR8PCC2bLjyGTwEmPb9NHR/QaNU6EUOXcTY/s6VjGMD6ENSEaeQYHCY0GNGS5jfMwPw==}
+    engines: {node: '>=6'}
+
   cli-cursor@2.1.0:
     resolution: {integrity: sha512-8lgKz8LmCRYZZQDpRyT2m5rKJ08TnU4tR9FFFW2rxpxR1FzWi4PQ/NfyODchAatHaUgnSPVcx/R5w6NuTBzFiw==}
     engines: {node: '>=4'}
@@ -7294,6 +7347,10 @@ packages:
     resolution: {integrity: sha512-I/zHAwsKf9FqGoXM4WWRACob9+SNukZTd94DWF57E4toouRulbCxcUh6RKUEOQlYTHJnzkPMySvPNaaSLNfLZw==}
     engines: {node: '>=8'}
 
+  cli-spinners@2.9.2:
+    resolution: {integrity: sha512-ywqV+5MmyL4E7ybXgKys4DugZbX0FC6LnwrhjuykIjnK9k8OQacQ7axGKnjDXWNhns0xot3bZI5h55H8yo9cJg==}
+    engines: {node: '>=6'}
+
   cli-truncate@2.1.0:
     resolution: {integrity: sha512-n8fOixwDD6b/ObinzTrp1ZKFzbgvKZvuz/TvejnLn1aQfC6r52XEx85FmuC+3HI+JM7coBRXUvNqEU2PHVrHpg==}
     engines: {node: '>=8'}
@@ -7321,6 +7378,10 @@ packages:
   clone-response@1.0.2:
     resolution: {integrity: sha512-yjLXh88P599UOyPTFX0POsd7WxnbsVsGohcwzHOLspIhhpalPw1BcqED8NblyZLKcGrL8dTgMlcaZxV2jAD41Q==}
 
+  clone@1.0.4:
+    resolution: {integrity: sha512-JQHZ2QMW6l3aH/j6xCqQThY/9OH4D/9ls34cgkUBiEeocRTU04tHfKPBsUK1PqZCUQM7GiA0IIXJSuXHI64Kbg==}
+    engines: {node: '>=0.8'}
+
   clsx@1.2.1:
     resolution: {integrity: sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==}
     engines: {node: '>=6'}
@@ -7329,6 +7390,9 @@ packages:
     resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==}
     engines: {node: '>=6'}
 
+  code-block-writer@13.0.3:
+    resolution: {integrity: sha512-Oofo0pq3IKnsFtuHqSF7TqBfr71aeyZDVJ0HpmqB7FBM2qEigL0iPONSCZSO9pE9dZTAxANe5XHG9Uy0YMv8cg==}
+
   code-point-at@1.1.0:
     resolution: {integrity: sha512-RpAVKQA5T63xEj6/giIbUEtZwJ4UFIc3ZtvEkiaUERylqe8xb5IvqcgOurZLahv93CLKfxcw5YI+DZcUBRyLXA==}
     engines: {node: '>=0.10.0'}
@@ -7376,6 +7440,10 @@ packages:
     resolution: {integrity: sha512-T6PB6vdFrwnHXg/I0kivM3DqaCGZLjjYSOe0a5WgFKcz1sOnmOeIjnhQPXVXX3QjVbLyTJ85lJkX6lUpukTzaA==}
     engines: {node: '>=6'}
 
+  commander@11.1.0:
+    resolution: {integrity: sha512-yPVavfyCcRhmorC7rWlkHn15b4wDVgVmBA7kV4QVBsF7kv/9TKJAbAXVTxvTnwP8HHKjRCJDClKbciiYS7p0DQ==}
+    engines: {node: '>=16'}
+
   commander@12.1.0:
     resolution: {integrity: sha512-Vw8qHK3bZM9y/P10u3Vib8o/DdkvA2OtPtZvD871QKjy74Wj1WSKFILMPRPSdUSx5RFK1arlJzEtA4PkFgnbuA==}
     engines: {node: '>=18'}
@@ -7402,6 +7470,9 @@ packages:
   commondir@1.0.1:
     resolution: {integrity: sha512-W9pAhw0ja1Edb5GVdIF1mjZw/ASI0AlShXM83UUGe2DVr5TdAPEA1OA8m/g8zWp9x6On7gqufY+FatDbC3MDQg==}
 
+  compare-versions@6.1.1:
+    resolution: {integrity: sha512-4hm4VPpIecmlg59CHXnRDnqGplJFrbLG4aFEl5vl6cK1u76ws3LLvX7ikFnTDl5vo39sjWD6AaDPYodJp/NNHg==}
+
   compress-commons@5.0.3:
     resolution: {integrity: sha512-/UIcLWvwAQyVibgpQDPtfNM3SvqN7G9elAPAV7GM0L53EbNWwWiCsWtK8Fwed/APEbptPHXs5PuW+y8Bq8lFTA==}
     engines: {node: '>= 12.0.0'}
@@ -7649,6 +7720,10 @@ packages:
     resolution: {integrity: sha512-N4u2ABATi3Qplzf0hWbVCdjenim8F3ojEXpBDF5hBpjzW182MjNGLqfmQ0SkSPeQ+V86ZXgeH8aXj6kayd4jgg==}
     engines: {node: '>=14'}
 
+  cssstyle@4.6.0:
+    resolution: {integrity: sha512-2z+rWdzbbSZv6/rhtvzvqeZQHrBaqgogqt85sqFNbabZOuFbCVFb8kPeEtZjiKkbrm395irpNKiYeFeLiQnFPg==}
+    engines: {node: '>=18'}
+
   csstype@3.0.8:
     resolution: {integrity: sha512-jXKhWqXPmlUeoQnF/EhTtTl4C9SnrxSH/jZUih3jmO6lBKr99rP3/+FmrMj4EFpOXzMtXHAZkd3x0E6h6Fgflw==}
 
@@ -7771,6 +7846,10 @@ packages:
     resolution: {integrity: sha512-/mMTei/JXPqvFqQtfyTowxmJVwr2PVAeCcDxyFf6LhoOu/09TX2OX3kb2wzi4DMXcfj4OItwDOnhl5oziPnT6g==}
     engines: {node: '>=14'}
 
+  data-urls@5.0.0:
+    resolution: {integrity: sha512-ZYP5VBHshaDAiVZxjbRVcFJpc+4xGgT0bK3vzy1HLN8jTO975HEbuYzZJcHoQEY5K1a0z8YayJkyVETa08eNTg==}
+    engines: {node: '>=18'}
+
   data-view-buffer@1.0.2:
     resolution: {integrity: sha512-EmKO5V3OLXh1rtK2wgXRansaK1/mtVdTUEiEI0W8RkvgT05kfxaH29PliLnpLP73yYO6142Q72QNa8Wx/A5CqQ==}
     engines: {node: '>= 0.4'}
@@ -7913,6 +7992,9 @@ packages:
     resolution: {integrity: sha512-WY/3TUME0x3KPYdRRxEJJvXRHV4PyPoUsxtZa78lwItwRQRHhd2U9xOscaT/YTf8uCXIAjeJOFBVEh/7FtD8Xg==}
     engines: {node: '>=18'}
 
+  defaults@1.0.4:
+    resolution: {integrity: sha512-eFuaLoy/Rxalv2kr+lqMlUnrDWV+3j4pljOIJgLIhI058IQfWJ7vXhyEIHu+HtC738klGALYxOKDO0bQP3tg8A==}
+
   defer-to-connect@2.0.1:
     resolution: {integrity: sha512-4tvttepXG1VaYGrRibk5EwJd1t4udunSOVMdLSAL6mId1ix438oPwPZMALY41FCijukO1L0twNcGsdzS7dHgDg==}
     engines: {node: '>=10'}
@@ -8037,7 +8119,6 @@ packages:
   domexception@4.0.0:
     resolution: {integrity: sha512-A2is4PLG+eeSfoTMA95/s4pvAoSo2mKtiM5jlHkAVewmiO8ISFTFKZjH7UAM1Atli/OT/7JHOrJRJiMKUZKYBw==}
     engines: {node: '>=12'}
-    deprecated: Use your platform's native DOMException instead
 
   domhandler@2.4.2:
     resolution: {integrity: sha512-JiK04h0Ht5u/80fdLMCEmV4zkNh2BcoMFBmZ/91WtYZ8qVXSKjiw7fXMgFPnHcSZgOo3XdinHvmnDUeMf5R4wA==}
@@ -8765,6 +8846,9 @@ packages:
   fast-fifo@1.3.2:
     resolution: {integrity: sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ==}
 
+  fast-fuzzy@1.12.0:
+    resolution: {integrity: sha512-sXxGgHS+ubYpsdLnvOvJ9w5GYYZrtL9mkosG3nfuD446ahvoWEsSKBP7ieGmWIKVLnaxRDgUJkZMdxRgA2Ni+Q==}
+
   fast-glob@3.2.11:
     resolution: {integrity: sha512-xrO3+1bxSo3ZVHAnqzyuewYT6aMFHRAd4Kcs92MAonjwQZLsK9d0SF1IyQ3k5PoirxTW0Oe/RqFgMQ6TcNE5Ew==}
     engines: {node: '>=8.6.0'}
@@ -8967,7 +9051,6 @@ packages:
 
   flatten@1.0.3:
     resolution: {integrity: sha512-dVsPA/UwQ8+2uoFe5GHtiBMu48dWLTdsuEd7CKGlZlD78r1TTWBvDuFaFGKCo/ZfEr95Uk56vZoX86OsHkUeIg==}
-    deprecated: flatten is deprecated in favor of utility frameworks such as lodash.
 
   flow-enums-runtime@0.0.6:
     resolution: {integrity: sha512-3PYnM29RFXwvAN6Pc/scUfkI7RwhQ/xqyLUyPNlXUp9S40zI8nup9tUSrTLSVnWGBN38FNiGWbwZOB6uR4OGdw==}
@@ -9213,14 +9296,17 @@ packages:
     engines: {node: 20 || >=22}
     hasBin: true
 
+  glob@11.1.0:
+    resolution: {integrity: sha512-vuNwKSaKiqm7g0THUBu2x7ckSs3XJLXE+2ssL7/MfTGPLLcrJQ/4Uq1CjPTtO5cCIiRxqvN6Twy1qOwhL0Xjcw==}
+    engines: {node: 20 || >=22}
+    hasBin: true
+
   glob@7.2.3:
     resolution: {integrity: sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==}
-    deprecated: Glob versions prior to v9 are no longer supported
 
   glob@8.1.0:
     resolution: {integrity: sha512-r8hpEjiQEYlF2QU0df3dS+nxxSIreXQS1qRhMJM0Q5NDdR386C7jb7Hwwod8Fgiuex+k0GFjgft18yvxm5XoCQ==}
     engines: {node: '>=12'}
-    deprecated: Glob versions prior to v9 are no longer supported
 
   global-modules@2.0.0:
     resolution: {integrity: sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==}
@@ -9271,7 +9357,6 @@ packages:
   google-p12-pem@3.1.4:
     resolution: {integrity: sha512-HHuHmkLgwjdmVRngf5+gSmpkyaRI6QmOg77J8tkNBHhNEI62sGHyw4/+UkgyZEI7h84NbWprXDJ+sa3xOYFvTg==}
     engines: {node: '>=10'}
-    deprecated: Package is no longer maintained
     hasBin: true
 
   gopd@1.2.0:
@@ -9303,6 +9388,9 @@ packages:
   graphemer@1.4.0:
     resolution: {integrity: sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==}
 
+  graphemesplit@2.6.0:
+    resolution: {integrity: sha512-rG9w2wAfkpg0DILa1pjnjNfucng3usON360shisqIMUBw/87pojcBSrHmeE4UwryAuBih7g8m1oilf5/u8EWdQ==}
+
   graphql@16.11.0:
     resolution: {integrity: sha512-mS1lbMsxgQj6hge1XZ6p7GPhbrtFwUFYi3wRzXAC/FmYnyXMTvvI3td3rjmQ2u8ewXueaSvRPWaEcgVVOT9Jnw==}
     engines: {node: ^12.22.0 || ^14.16.0 || ^16.0.0 || >=17.0.0}
@@ -9328,7 +9416,6 @@ packages:
   har-validator@5.1.5:
     resolution: {integrity: sha512-nmT2T0lljbxdQZfspsno9hgrG3Uir6Ks5afism62poxqBM6sDnMEuPmzTq8XN0OEwqKLLdh1jQI3qyE66Nzb3w==}
     engines: {node: '>=6'}
-    deprecated: this library is no longer supported
 
   hard-rejection@2.1.0:
     resolution: {integrity: sha512-VIZB+ibDhx7ObhAe7OVtoEbuP4h/MuOTHJ+J8h/eBXotJYl0fBgR72xDFCKgIh22OJZIOVNxBMWuhAr10r8HdA==}
@@ -9446,6 +9533,10 @@ packages:
     resolution: {integrity: sha512-oWv4T4yJ52iKrufjnyZPkrN0CH3QnrUqdB6In1g5Fe1mia8GmF36gnfNySxoZtxD5+NmYw1EElVXiBk93UeskA==}
     engines: {node: '>=12'}
 
+  html-encoding-sniffer@4.0.0:
+    resolution: {integrity: sha512-Y22oTqIU4uuPgEemfz7NDJz6OeKf12Lsu+QC+s3BVpda64lTiMYCyGwg5ki4vFxkMwQdeZDl2adZoqUgdFuTgQ==}
+    engines: {node: '>=18'}
+
   html-escaper@3.0.3:
     resolution: {integrity: sha512-RuMffC89BOWQoY0WKGpIhn5gX3iI54O6nRA0yC124NYVtzjmFWBIiFd8M0x+ZdX0P9R4lADg1mgP8C7PxGOWuQ==}
 
@@ -9665,7 +9756,6 @@ packages:
 
   inflight@1.0.6:
     resolution: {integrity: sha512-k92I/b08q4wvFscXCLvqfsHCrjrF7yiXsQuIVvVE7N82W3+aqpzuUdBbfhWcy/FZR3/4IgflMgKLOsvPDrGCJA==}
-    deprecated: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.
 
   inherits@2.0.3:
     resolution: {integrity: sha512-x00IRNXNy63jwGkJmzPigoySHbaqpNuzKbBOmzK+g2OdZpQ9w+sxCN+VSB3ja7IAge2OP2qpfxTjeNcyjmW1uw==}
@@ -9838,6 +9928,10 @@ packages:
     engines: {node: '>=14.16'}
     hasBin: true
 
+  is-interactive@1.0.0:
+    resolution: {integrity: sha512-2HvIEKRoqS62guEC+qBjpvRubdX910WCMuJTZ+I9yvqKU2/12eSL549HMwtabb4oupdj2sMP50k+XJfB/8JE6w==}
+    engines: {node: '>=8'}
+
   is-map@2.0.3:
     resolution: {integrity: sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==}
     engines: {node: '>= 0.4'}
@@ -10105,6 +10199,9 @@ packages:
   js-base64@2.6.4:
     resolution: {integrity: sha512-pZe//GGmwJndub7ZghVHz7vjb2LgC1m8B07Au3eYqeqv9emhESByMXxaEgkUkEqJe87oBbSniGYoQNIBklc7IQ==}
 
+  js-base64@3.7.8:
+    resolution: {integrity: sha512-hNngCeKxIUQiEUN3GPJOkz4wF/YvdUdbNL9hsBcMQTkKzboD7T/q3OYOuuPZLUE6dBxSGpwhk5mwuDud7JVAow==}
+
   js-levenshtein@1.1.6:
     resolution: {integrity: sha512-X2BB11YZtrRqY4EnQcLX5Rh373zbK4alC1FW7D7MBhL2gtcC17cTnr6DmfHZeS0s2rTHjUTMMHfG7gO8SSdw+g==}
     engines: {node: '>=0.10.0'}
@@ -10135,6 +10232,15 @@ packages:
       canvas:
         optional: true
 
+  jsdom@24.1.3:
+    resolution: {integrity: sha512-MyL55p3Ut3cXbeBEG7Hcv0mVM8pp8PBNWxRqchZnSfAiES1v1mRnMeFfaHWIPULpwsYfvO+ZmMZz5tGCnjzDUQ==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      canvas: ^2.11.2
+    peerDependenciesMeta:
+      canvas:
+        optional: true
+
   jsesc@3.1.0:
     resolution: {integrity: sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==}
     engines: {node: '>=6'}
@@ -10225,6 +10331,10 @@ packages:
     resolution: {integrity: sha512-dcS1ul+9tmeD95T+x28/ehLgd9mENa3LsvDTtzm3vyBEO7RPptvAD+t44WVXaUjTBRcrpFeFlC8WCruUR456hw==}
     engines: {node: '>=0.10.0'}
 
+  kleur@3.0.3:
+    resolution: {integrity: sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w==}
+    engines: {node: '>=6'}
+
   kleur@4.1.5:
     resolution: {integrity: sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ==}
     engines: {node: '>=6'}
@@ -10534,7 +10644,6 @@ packages:
 
   mdast@3.0.0:
     resolution: {integrity: sha512-xySmf8g4fPKMeC07jXGz971EkLbWAJ83s4US2Tj9lEdnZ142UP5grN73H1Xd3HzrdbU5o9GYYP/y8F9ZSwLE9g==}
-    deprecated: '`mdast` was renamed to `remark`'
 
   mdn-data@2.0.14:
     resolution: {integrity: sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==}
@@ -10808,6 +10917,10 @@ packages:
     resolution: {integrity: sha512-IPZ167aShDZZUMdRk66cyQAW3qr0WzbHkPdMYa8bzZhlHhO3jALbKdxcaak7W9FfT2rZNpQuUu4Od7ILEpXSaw==}
     engines: {node: 20 || >=22}
 
+  minimatch@10.1.1:
+    resolution: {integrity: sha512-enIvLvRAFZYXJzkCYG5RKmPfrFArdLv+R+lbQ53BmIMLIry74bjKzX6iHAm8WYamJkhSSEabrWN5D97XnKObjQ==}
+    engines: {node: 20 || >=22}
+
   minimatch@3.1.2:
     resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==}
 
@@ -10949,7 +11062,6 @@ packages:
   node-domexception@1.0.0:
     resolution: {integrity: sha512-/jKZoMpw0F8GRwl4/eLROPA3cfcXtLApP0QzLmUT/HuPCZWyB7IY9ZrMeKw2O/nFIqPQB3PVM9aYm0F312AXDQ==}
     engines: {node: '>=10.5.0'}
-    deprecated: Use your platform's native DOMException instead
 
   node-fetch@2.6.7:
     resolution: {integrity: sha512-ZjMPFEfVx5j+y2yF35Kzx5sF7kDzxuDj6ziH4FFbOp87zKDZNx8yExJIb05OGF4Nlt9IHFIMBkRl41VdvcNdbQ==}
@@ -11152,6 +11264,10 @@ packages:
     resolution: {integrity: sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==}
     engines: {node: '>= 0.8.0'}
 
+  ora@5.4.1:
+    resolution: {integrity: sha512-5b6Y85tPxZZ7QytO+BQzysW31HJku27cRIlkbAXaNx+BdcVi+LlRFmVXzeF6a7JCwJpyw5c4b+YSVImQIrBpuQ==}
+    engines: {node: '>=10'}
+
   os-filter-obj@2.0.0:
     resolution: {integrity: sha512-uksVLsqG3pVdzzPvmAHpBK0wKxYItuzZr7SziusRPoz67tGV8rL1szZ6IdeUrbqLjGDwApBtN29eEE3IqGHOjg==}
     engines: {node: '>=4'}
@@ -11282,6 +11398,9 @@ packages:
   package-json-from-dist@1.0.1:
     resolution: {integrity: sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==}
 
+  pako@0.2.9:
+    resolution: {integrity: sha512-NUcwaKxUxWrZLpDG+z/xZaCgQITkA/Dv4V/T6bw7VON6l1Xz/VnrBqrYjZQ12TamKHzITTfOEIYUj48y2KXImA==}
+
   parent-module@1.0.1:
     resolution: {integrity: sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==}
     engines: {node: '>=6'}
@@ -11314,6 +11433,9 @@ packages:
     resolution: {integrity: sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==}
     engines: {node: '>= 0.8'}
 
+  path-browserify@1.0.1:
+    resolution: {integrity: sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==}
+
   path-exists@4.0.0:
     resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==}
     engines: {node: '>=8'}
@@ -11486,7 +11608,6 @@ packages:
 
   popper-max-size-modifier@0.2.0:
     resolution: {integrity: sha512-UerPt9pZfTFnpSpIBVJrR3ibHMuU1k5K01AyNLfMUWCr4z1MFH+dsayPlAF9ZeYExa02HPiQn5OIMqUSVtJEbg==}
-    deprecated: 'We recommend switching to Floating UI which supports this modifier out of the box: https://floating-ui.com/docs/size'
     peerDependencies:
       '@popperjs/core': ^2.2.0
 
@@ -11690,7 +11811,6 @@ packages:
 
   postcss-inline-comment@3.0.0:
     resolution: {integrity: sha512-37qQyF+ckYYYcE6N0omZR321+hkQ+dPSZFpNgECAeYbK6GYdsudkm48xc/X34RjOp89rlUiMcS/JU+uxa/oE8A==}
-    deprecated: It's deprecated, please use postcss-scss instead.
 
   postcss-js@4.1.0:
     resolution: {integrity: sha512-oIAOTqgIo7q2EOwbhb8UalYePMvYoIeRY2YKntdpFQXNosSu3vLrniGgmH9OKs/qAkfoj5oB3le/7mINW1LCfw==}
@@ -11973,6 +12093,10 @@ packages:
   promise@8.3.0:
     resolution: {integrity: sha512-rZPNPKTOYVNEEKFaq1HqTgOwZD+4/YHS5ukLzQCypkj+OkYx7iv0mA91lJlpPPZ8vMau3IIGj5Qlwrx+8iiSmg==}
 
+  prompts@2.4.2:
+    resolution: {integrity: sha512-NxNv/kLguCA7p3jE8oL2aEBsrJWgAakBpgmgK6lpPWV+WuOmY6r2/zbAVnP+T8bQlA0nzHXSJSJW0Hq7ylaD2Q==}
+    engines: {node: '>= 6'}
+
   prop-types@15.8.1:
     resolution: {integrity: sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==}
 
@@ -12034,10 +12158,6 @@ packages:
   q@1.5.1:
     resolution: {integrity: sha512-kV/CThkXo6xyFEZUugw/+pIOywXcDbFYgSct5cT3gqlbkBE1SJdwy6UQoZvodiWF/ckQLZyDE/Bu1M6gVu5lVw==}
     engines: {node: '>=0.6.0', teleport: '>=0.2.0'}
-    deprecated: |-
-      You or someone you depend on is using Q, the JavaScript Promise library that gave JavaScript developers strong feelings about promises. They can almost certainly migrate to the native JavaScript promise now. Thank you literally everyone for joining me in this bet against the odds. Be excellent to each other.
-
-      (For a CapTP with native promises, see @endo/eventual-send and @endo/captp)
 
   qs@6.10.3:
     resolution: {integrity: sha512-wr7M2E0OFRfIfJZjKGieI8lBKb7fRCH4Fv5KNPEs7gJ8jadvotdsS08PzOKR7opXhZ/Xkjtt3WF9g38drmyRqQ==}
@@ -12158,7 +12278,6 @@ packages:
 
   react-instantsearch-dom@6.40.4:
     resolution: {integrity: sha512-Oy8EKEOg/dfTE8tHc7GZRlzUdbZY4Mxas1x2OtvSNui+YAbIWafIf1g98iOGyVTB2qI5WH91YyUJTLPNfLrs6Q==}
-    deprecated: package has moved to react-instantsearch
     peerDependencies:
       algoliasearch: '>= 3.1 < 5'
       react: '>= 16.3.0 < 19'
@@ -12166,7 +12285,6 @@ packages:
 
   react-instantsearch-native@6.40.4:
     resolution: {integrity: sha512-4hXC7e7x4RGb6DyJrAShFW3ZecT4IjtDVS2jwkmKdrevl74sho22TVtxPfHc6o9lINtvlxTCXDLgQWVsZvjl+w==}
-    deprecated: package has moved to react-instantsearch-core
     peerDependencies:
       algoliasearch: '>= 3.1 < 5'
       react: '>= 16.3.0 < 19'
@@ -12372,7 +12490,6 @@ packages:
   request@2.88.2:
     resolution: {integrity: sha512-MsvtOrfG9ZcrOwAW+Qi+F6HbD0CWXEh9ou77uOb7FM2WPhwT7smM833PzanhJLsgXjN89Ir6V2PczXNnMpwKhw==}
     engines: {node: '>= 6'}
-    deprecated: request has been deprecated, see https://github.com/request/request/issues/3142
 
   require-directory@2.1.1:
     resolution: {integrity: sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==}
@@ -12471,7 +12588,6 @@ packages:
 
   rimraf@3.0.2:
     resolution: {integrity: sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==}
-    deprecated: Rimraf versions prior to v4 are no longer supported
     hasBin: true
 
   roarr@7.21.1:
@@ -12497,6 +12613,12 @@ packages:
   rrweb-cssom@0.6.0:
     resolution: {integrity: sha512-APM0Gt1KoXBz0iIkkdB/kfvGOwC4UuJFeG/c+yV7wSc7q96cG/kJ0HiYCnzivD9SB53cLV1MlHFNfOuPaadYSw==}
 
+  rrweb-cssom@0.7.1:
+    resolution: {integrity: sha512-TrEMa7JGdVm0UThDJSx7ddw5nVm3UJS9o9CCIZ72B1vSyEZoziDqBYP3XIoi/12lKrJR8rE3jeFHMok2F/Mnsg==}
+
+  rrweb-cssom@0.8.0:
+    resolution: {integrity: sha512-guoltQEx+9aMf2gDZ0s62EcV8lsXR+0w8915TC3ITdn2YueuNjdAYh/levpU9nFaoChh9RUS5ZdQMrKfVEN9tw==}
+
   rtl-css-js@1.16.1:
     resolution: {integrity: sha512-lRQgou1mu19e+Ya0LsTvKrVJ5TYUbqCVPAiImX3UfLTenarvPUl1QFdvu5Z3PYmHT9RCcwIfbjRQBntExyj3Zg==}
 
@@ -12749,6 +12871,9 @@ packages:
     resolution: {integrity: sha512-2wcC/oGxHis/BoHkkPwldgiPSYcpZK3JU28WoMVv55yHJgcZ8rlXvuG9iZggz+sU1d4bRgIGASwyWqjxu3FM0g==}
     engines: {node: '>=18'}
 
+  sisteransi@1.0.5:
+    resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==}
+
   sitemap@7.1.2:
     resolution: {integrity: sha512-ARCqzHJ0p4gWt+j7NlU5eDlIO9+Rkr/JhPFZKKQ1l5GCus7rJH4UdrlVAh0xC/gDS/Qir2UMxqYNHtsKr2rpCw==}
     engines: {node: '>=12.0.0', npm: '>=5.6.0'}
@@ -12842,7 +12967,6 @@ packages:
 
   sourcemap-codec@1.4.8:
     resolution: {integrity: sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==}
-    deprecated: Please use @jridgewell/sourcemap-codec instead
 
   space-separated-tokens@2.0.2:
     resolution: {integrity: sha512-PEGlAwrG8yXGXRjW32fGbg66JAlOAwbObuqVoJpv/mRgoWDQfgH1wDPvtzWyUSNAXBGSk8h755YDbbcEy3SH2Q==}
@@ -13302,6 +13426,9 @@ packages:
     resolution: {integrity: sha512-G7r3AhovYtr5YKOWQkta8RKAPb+J9IsO4uVmzjl8AZwfhs8UcUwTiD6gcJYSgOtzyjvQKrKYn41syHbUWMkafA==}
     engines: {node: '>=0.10.0'}
 
+  tiny-inflate@1.0.3:
+    resolution: {integrity: sha512-pkY1fj1cKHb2seWDy0B16HeWyczlJA9/WW3u3c4z/NiWDsO3DOU5D7nhTLE9CF0yXv/QZFY7sEJmj24dK+Rrqw==}
+
   tiny-invariant@1.3.3:
     resolution: {integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==}
 
@@ -13387,6 +13514,10 @@ packages:
     resolution: {integrity: sha512-2lv/66T7e5yNyhAAC4NaKe5nVavzuGJQVVtRYLyQ2OI8tsJ61PMLlelehb0wi2Hx6+hT/OJUWZcw8MjlSRnxvw==}
     engines: {node: '>=14'}
 
+  tr46@5.1.1:
+    resolution: {integrity: sha512-hdF5ZgjTqgAntKkklYw0R03MG2x/bSzTtkxmIRw/sTNV8YXsCJ1tfLAX23lhxhHJlEf3CRCOCGGWw3vI3GaSPw==}
+    engines: {node: '>=18'}
+
   tree-dump@1.1.0:
     resolution: {integrity: sha512-rMuvhU4MCDbcbnleZTFezWsaZXRFemSqAM+7jPnzUl1fo9w3YEKOxAeui0fz3OI4EU4hf23iyA7uQRVko+UaBA==}
     engines: {node: '>=10.0'}
@@ -13417,6 +13548,9 @@ packages:
     resolution: {integrity: sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==}
     engines: {node: '>=6.10'}
 
+  ts-morph@27.0.2:
+    resolution: {integrity: sha512-fhUhgeljcrdZ+9DZND1De1029PrE+cMkIP7ooqkLRTrRLTqcki2AstsyJm0vRNbTbVCNJ0idGlbBrfqc7/nA8w==}
+
   ts-node@10.9.2:
     resolution: {integrity: sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==}
     hasBin: true
@@ -13489,6 +13623,10 @@ packages:
     resolution: {integrity: sha512-OIAYXk8+ISY+qTOwkHtKqzAuxchoMiD9Udx+FSGQDuiRR+PJKJHc2NJAXlbhkGwTt/4/nKZxELY1w3ReWOL8mw==}
     engines: {node: '>=10'}
 
+  type-fest@0.20.2:
+    resolution: {integrity: sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==}
+    engines: {node: '>=10'}
+
   type-fest@0.21.3:
     resolution: {integrity: sha512-t0rzBq87m3fVcduHDUFhKmyyX+9eo6WQjZvf51Ea/M0Q7+T374Jp1aUiyUl0GKxp8M/OETVHSDvmkyPgvX+X2w==}
     engines: {node: '>=10'}
@@ -13571,6 +13709,11 @@ packages:
     engines: {node: '>=14.17'}
     hasBin: true
 
+  typescript@5.9.3:
+    resolution: {integrity: sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==}
+    engines: {node: '>=14.17'}
+    hasBin: true
+
   uc.micro@1.0.6:
     resolution: {integrity: sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA==}
 
@@ -13599,6 +13742,10 @@ packages:
   undici-types@6.21.0:
     resolution: {integrity: sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==}
 
+  undici@5.29.0:
+    resolution: {integrity: sha512-raqeBD6NQK4SkWhQzeYKd1KmIG6dllBOTt55Rmkt4HtI9mwdWtJljnrXjAFUBLTSN67HWrOIZ3EPF4kjUw80Bg==}
+    engines: {node: '>=14.0'}
+
   unicode-canonical-property-names-ecmascript@2.0.1:
     resolution: {integrity: sha512-dA8WbNeb2a6oQzAQ55YlT5vQAWGV9WXOsi3SskE3bcCdM0P4SDd+24zS/OCacdRq5BkdsRj9q3Pg6YyQoxIGqg==}
     engines: {node: '>=4'}
@@ -13615,6 +13762,9 @@ packages:
     resolution: {integrity: sha512-hpbDzxUY9BFwX+UeBnxv3Sh1q7HFxj48DTmXchNgRa46lO8uj3/1iEn3MiNUYTg1g9ctIqXCCERn8gYZhHC5lQ==}
     engines: {node: '>=4'}
 
+  unicode-trie@2.0.0:
+    resolution: {integrity: sha512-x7bc76x0bm4prf1VLg79uhAzKw8DVboClSN5VxJuQ+LKDOVEW9CdH+VY7SP+vX7xCYQqzzgQpFqz15zeLvAtZQ==}
+
   unicorn-magic@0.1.0:
     resolution: {integrity: sha512-lRfVq8fE8gz6QMBuDM6a+LO3IAzTi05H6gCVaUpir2E1Rwpo4ZUog45KpNXKC/Mn3Yb9UDuHumeFTo9iV/D9FQ==}
     engines: {node: '>=18'}
@@ -13752,7 +13902,6 @@ packages:
 
   uuid@3.4.0:
     resolution: {integrity: sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==}
-    deprecated: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
     hasBin: true
 
   uuid@8.3.2:
@@ -13946,6 +14095,10 @@ packages:
     resolution: {integrity: sha512-d+BFHzbiCx6zGfz0HyQ6Rg69w9k19nviJspaj4yNscGjrHu94sVP+aRm75yEbCh+r2/yR+7q6hux9LVtbuTGBw==}
     engines: {node: '>=14'}
 
+  w3c-xmlserializer@5.0.0:
+    resolution: {integrity: sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==}
+    engines: {node: '>=18'}
+
   wait-port@1.1.0:
     resolution: {integrity: sha512-3e04qkoN3LxTMLakdqeWth8nih8usyg+sf1Bgdf9wwUkp05iuK1eSY/QpLvscT/+F/gA89+LpUmmgBtesbqI2Q==}
     engines: {node: '>=10'}
@@ -13961,6 +14114,9 @@ packages:
   wbuf@1.7.3:
     resolution: {integrity: sha512-O84QOnr0icsbFGLS0O3bI5FswxzRr8/gHwWkDlQFskhSPryQXvrTMxjxGP4+iWYoauLoBvfDpkrOauZ+0iZpDA==}
 
+  wcwidth@1.0.1:
+    resolution: {integrity: sha512-XHPEwS0q6TaxcvG85+8EYkbiCux2XtWG2mkc47Ng2A77BQu9+DqIOJldST4HgPkuea7dvKSj5VgX3P1d4rW8Tg==}
+
   web-streams-polyfill@3.3.3:
     resolution: {integrity: sha512-d2JWLCivmZYTSIoge9MsgFCZrt571BikcWGYkjC1khllbTeDlGqZ2D8vD8E/lJa8WGWbb7Plm8/XJYV7IJHZZw==}
     engines: {node: '>= 8'}
@@ -14042,6 +14198,10 @@ packages:
     resolution: {integrity: sha512-p41ogyeMUrw3jWclHWTQg1k05DSVXPLcVxRTYsXUk+ZooOCZLcoYgPZ/HL/D/N+uQPOtcp1me1WhBEaX02mhWg==}
     engines: {node: '>=12'}
 
+  whatwg-encoding@3.1.1:
+    resolution: {integrity: sha512-6qN4hJdMwfYBtE3YBTTHhoeuUrDBPZmbQaxWAqSALV/MeEnR5z1xd8UKud2RAkFoPkmB+hli1TZSnyi84xz1vQ==}
+    engines: {node: '>=18'}
+
   whatwg-fetch@3.6.2:
     resolution: {integrity: sha512-bJlen0FcuU/0EMLrdbJ7zOnW6ITZLrZMIarMUVmdKtsGvZna8vxKYaexICWPfZ8qwf9fzNq+UEIZrnSaApt6RA==}
 
@@ -14049,10 +14209,18 @@ packages:
     resolution: {integrity: sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==}
     engines: {node: '>=12'}
 
+  whatwg-mimetype@4.0.0:
+    resolution: {integrity: sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==}
+    engines: {node: '>=18'}
+
   whatwg-url@12.0.1:
     resolution: {integrity: sha512-Ed/LrqB8EPlGxjS+TrsXcpUond1mhccS3pchLhzSgPCnTimUCKj3IZE75pAs5m6heB2U2TMerKFUXheyHY+VDQ==}
     engines: {node: '>=14'}
 
+  whatwg-url@14.2.0:
+    resolution: {integrity: sha512-De72GdQZzNTUBBChsXueQUnPKDkg/5A5zp7pFDuQAj5UFoENpiACU0wlCvzpAGnTkj++ihpKwKyYewn/XNUbKw==}
+    engines: {node: '>=18'}
+
   whatwg-url@5.0.0:
     resolution: {integrity: sha512-saE57nupxk6v3HY35+jzBwYa0rKSy0XR8JSxZPwgLr7ys0IBzhGviA1/TUGJLmSVqs8pb9AnvICXEuOHLprYTw==}
 
@@ -14097,6 +14265,10 @@ packages:
     engines: {node: '>=8'}
     hasBin: true
 
+  widest-line@3.1.0:
+    resolution: {integrity: sha512-NsmoXalsWVDMGupxZ5R08ka9flZjjiLvHVAWYOKtiKM8ujtZWr9cRffak+uSE48+Ob8ObalXpwyeUiyDD6QFgg==}
+    engines: {node: '>=8'}
+
   window-size@0.1.0:
     resolution: {integrity: sha512-1pTPQDKTdd61ozlKGNCjhNRd+KPmgLSGa3mZTHoOliaGcESD8G1PXhh7c1fgiPjVbNVfgy2Faw4BI8/m0cC8Mg==}
     engines: {node: '>= 0.8.0'}
@@ -14203,6 +14375,10 @@ packages:
     resolution: {integrity: sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==}
     engines: {node: '>=12'}
 
+  xml-name-validator@5.0.0:
+    resolution: {integrity: sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==}
+    engines: {node: '>=18'}
+
   xml2js@0.4.23:
     resolution: {integrity: sha512-ySPiMjM0+pLDftHgXY4By0uswI3SPKLDw/i3UXbnO8M/p28zqexCUoPmQFrYD+/1BzhGJSs2i1ERWKJAtiLrug==}
     engines: {node: '>=4.0.0'}
@@ -14310,6 +14486,15 @@ packages:
     resolution: {integrity: sha512-LfOdrUvPB8ZoXtvOBz6DlNClfvi//b5d56mSWyJi7XbH/HfhOHfUhOqxhT/rUiR7yiktlunqRo+jY6y/cWC/5g==}
     engines: {node: '>= 12.0.0'}
 
+  zod-validation-error@3.5.4:
+    resolution: {integrity: sha512-+hEiRIiPobgyuFlEojnqjJnhFvg4r/i3cqgcm67eehZf/WBaK3g6cD02YU9mtdVxZjv8CzCA9n/Rhrs3yAAvAw==}
+    engines: {node: '>=18.0.0'}
+    peerDependencies:
+      zod: ^3.24.4
+
+  zod@3.25.58:
+    resolution: {integrity: sha512-DVLmMQzSZwNYzQoMaM3MQWnxr2eq+AtM9Hx3w1/Yl0pH8sLTSjN4jGP7w6f7uand6Hw44tsnSu1hz1AOA6qI2Q==}
+
   zod@3.25.76:
     resolution: {integrity: sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==}
 
@@ -14506,6 +14691,14 @@ snapshots:
       '@jridgewell/gen-mapping': 0.3.13
       '@jridgewell/trace-mapping': 0.3.31
 
+  '@asamuzakjp/css-color@3.2.0':
+    dependencies:
+      '@csstools/css-calc': 2.1.4(@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4))(@csstools/css-tokenizer@3.0.4)
+      '@csstools/css-color-parser': 3.1.0(@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4))(@csstools/css-tokenizer@3.0.4)
+      '@csstools/css-parser-algorithms': 3.0.5(@csstools/css-tokenizer@3.0.4)
+      '@csstools/css-tokenizer': 3.0.4
+      lru-cache: 10.4.3
+
   '@axe-core/playwright@4.9.1(playwright-core@1.55.1)':
     dependencies:
       axe-core: 4.9.1
@@ -15576,6 +15769,8 @@ snapshots:
 
   '@csstools/color-helpers@4.2.1': {}
 
+  '@csstools/color-helpers@5.1.0': {}
+
   '@csstools/convert-colors@1.4.0': {}
 
   '@csstools/css-calc@1.2.4(@csstools/css-parser-algorithms@2.7.1(@csstools/css-tokenizer@2.4.1))(@csstools/css-tokenizer@2.4.1)':
@@ -15583,6 +15778,11 @@ snapshots:
       '@csstools/css-parser-algorithms': 2.7.1(@csstools/css-tokenizer@2.4.1)
       '@csstools/css-tokenizer': 2.4.1
 
+  '@csstools/css-calc@2.1.4(@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4))(@csstools/css-tokenizer@3.0.4)':
+    dependencies:
+      '@csstools/css-parser-algorithms': 3.0.5(@csstools/css-tokenizer@3.0.4)
+      '@csstools/css-tokenizer': 3.0.4
+
   '@csstools/css-color-parser@2.0.5(@csstools/css-parser-algorithms@2.7.1(@csstools/css-tokenizer@2.4.1))(@csstools/css-tokenizer@2.4.1)':
     dependencies:
       '@csstools/color-helpers': 4.2.1
@@ -15590,12 +15790,25 @@ snapshots:
       '@csstools/css-parser-algorithms': 2.7.1(@csstools/css-tokenizer@2.4.1)
       '@csstools/css-tokenizer': 2.4.1
 
+  '@csstools/css-color-parser@3.1.0(@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4))(@csstools/css-tokenizer@3.0.4)':
+    dependencies:
+      '@csstools/color-helpers': 5.1.0
+      '@csstools/css-calc': 2.1.4(@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4))(@csstools/css-tokenizer@3.0.4)
+      '@csstools/css-parser-algorithms': 3.0.5(@csstools/css-tokenizer@3.0.4)
+      '@csstools/css-tokenizer': 3.0.4
+
   '@csstools/css-parser-algorithms@2.7.1(@csstools/css-tokenizer@2.4.1)':
     dependencies:
       '@csstools/css-tokenizer': 2.4.1
 
+  '@csstools/css-parser-algorithms@3.0.5(@csstools/css-tokenizer@3.0.4)':
+    dependencies:
+      '@csstools/css-tokenizer': 3.0.4
+
   '@csstools/css-tokenizer@2.4.1': {}
 
+  '@csstools/css-tokenizer@3.0.4': {}
+
   '@csstools/media-query-list-parser@2.1.13(@csstools/css-parser-algorithms@2.7.1(@csstools/css-tokenizer@2.4.1))(@csstools/css-tokenizer@2.4.1)':
     dependencies:
       '@csstools/css-parser-algorithms': 2.7.1(@csstools/css-tokenizer@2.4.1)
@@ -16034,6 +16247,38 @@ snapshots:
 
   '@faker-js/faker@9.9.0': {}
 
+  '@fastify/busboy@2.1.1': {}
+
+  '@figma/code-connect@1.3.12':
+    dependencies:
+      boxen: 5.1.1
+      chalk: 4.1.2
+      commander: 11.1.0
+      compare-versions: 6.1.1
+      cross-spawn: 7.0.6
+      dotenv: 16.5.0
+      fast-fuzzy: 1.12.0
+      find-up: 5.0.0
+      glob: 11.1.0
+      jsdom: 24.1.3
+      lodash: 4.17.21
+      minimatch: 9.0.5
+      ora: 5.4.1
+      parse5: 7.3.0
+      prettier: 2.8.8
+      prompts: 2.4.2
+      strip-ansi: 6.0.1
+      ts-morph: 27.0.2
+      typescript: 5.9.3
+      undici: 5.29.0
+      zod: 3.25.58
+      zod-validation-error: 3.5.4(zod@3.25.58)
+    transitivePeerDependencies:
+      - bufferutil
+      - canvas
+      - supports-color
+      - utf-8-validate
+
   '@formatjs/ecma402-abstract@1.11.7':
     dependencies:
       '@formatjs/intl-localematcher': 0.2.28
@@ -17522,6 +17767,12 @@ snapshots:
 
   '@tootallnate/quickjs-emscripten@0.23.0': {}
 
+  '@ts-morph/common@0.28.1':
+    dependencies:
+      minimatch: 10.1.1
+      path-browserify: 1.0.1
+      tinyglobby: 0.2.15
+
   '@tsconfig/node10@1.0.11': {}
 
   '@tsconfig/node12@1.0.11': {}
@@ -18727,6 +18978,10 @@ snapshots:
 
   anser@1.4.10: {}
 
+  ansi-align@3.0.1:
+    dependencies:
+      string-width: 4.2.3
+
   ansi-colors@4.1.3: {}
 
   ansi-escapes@3.2.0: {}
@@ -19285,6 +19540,17 @@ snapshots:
 
   bowser@2.12.1: {}
 
+  boxen@5.1.1:
+    dependencies:
+      ansi-align: 3.0.1
+      camelcase: 6.3.0
+      chalk: 4.1.2
+      cli-boxes: 2.2.1
+      string-width: 4.2.3
+      type-fest: 0.20.2
+      widest-line: 3.1.0
+      wrap-ansi: 7.0.0
+
   brace-expansion@1.1.12:
     dependencies:
       balanced-match: 1.0.2
@@ -19554,6 +19820,8 @@ snapshots:
 
   clean-stack@2.2.0: {}
 
+  cli-boxes@2.2.1: {}
+
   cli-cursor@2.1.0:
     dependencies:
       restore-cursor: 2.0.0
@@ -19562,6 +19830,8 @@ snapshots:
     dependencies:
       restore-cursor: 3.1.0
 
+  cli-spinners@2.9.2: {}
+
   cli-truncate@2.1.0:
     dependencies:
       slice-ansi: 3.0.0
@@ -19599,10 +19869,14 @@ snapshots:
     dependencies:
       mimic-response: 1.0.1
 
+  clone@1.0.4: {}
+
   clsx@1.2.1: {}
 
   clsx@2.1.1: {}
 
+  code-block-writer@13.0.3: {}
+
   code-point-at@1.1.0: {}
 
   color-convert@1.9.3:
@@ -19643,6 +19917,8 @@ snapshots:
 
   command-exists-promise@2.0.2: {}
 
+  commander@11.1.0: {}
+
   commander@12.1.0: {}
 
   commander@2.20.3: {}
@@ -19657,6 +19933,8 @@ snapshots:
 
   commondir@1.0.1: {}
 
+  compare-versions@6.1.1: {}
+
   compress-commons@5.0.3:
     dependencies:
       crc-32: 1.2.2
@@ -19925,6 +20203,11 @@ snapshots:
     dependencies:
       rrweb-cssom: 0.6.0
 
+  cssstyle@4.6.0:
+    dependencies:
+      '@asamuzakjp/css-color': 3.2.0
+      rrweb-cssom: 0.8.0
+
   csstype@3.0.8: {}
 
   csstype@3.1.3: {}
@@ -20041,6 +20324,11 @@ snapshots:
       whatwg-mimetype: 3.0.0
       whatwg-url: 12.0.1
 
+  data-urls@5.0.0:
+    dependencies:
+      whatwg-mimetype: 4.0.0
+      whatwg-url: 14.2.0
+
   data-view-buffer@1.0.2:
     dependencies:
       call-bound: 1.0.4
@@ -20193,6 +20481,10 @@ snapshots:
       bundle-name: 4.1.0
       default-browser-id: 5.0.0
 
+  defaults@1.0.4:
+    dependencies:
+      clone: 1.0.4
+
   defer-to-connect@2.0.1: {}
 
   define-data-property@1.1.4:
@@ -21232,6 +21524,10 @@ snapshots:
 
   fast-fifo@1.3.2: {}
 
+  fast-fuzzy@1.12.0:
+    dependencies:
+      graphemesplit: 2.6.0
+
   fast-glob@3.2.11:
     dependencies:
       '@nodelib/fs.stat': 2.0.5
@@ -21737,6 +22033,15 @@ snapshots:
       package-json-from-dist: 1.0.1
       path-scurry: 2.0.0
 
+  glob@11.1.0:
+    dependencies:
+      foreground-child: 3.3.1
+      jackspeak: 4.1.1
+      minimatch: 10.1.1
+      minipass: 7.1.2
+      package-json-from-dist: 1.0.1
+      path-scurry: 2.0.0
+
   glob@7.2.3:
     dependencies:
       fs.realpath: 1.0.0
@@ -21913,6 +22218,11 @@ snapshots:
 
   graphemer@1.4.0: {}
 
+  graphemesplit@2.6.0:
+    dependencies:
+      js-base64: 3.7.8
+      unicode-trie: 2.0.0
+
   graphql@16.11.0: {}
 
   gray-matter@4.0.3:
@@ -22079,6 +22389,10 @@ snapshots:
     dependencies:
       whatwg-encoding: 2.0.0
 
+  html-encoding-sniffer@4.0.0:
+    dependencies:
+      whatwg-encoding: 3.1.1
+
   html-escaper@3.0.3: {}
 
   html-tags@3.3.1: {}
@@ -22508,6 +22822,8 @@ snapshots:
     dependencies:
       is-docker: 3.0.0
 
+  is-interactive@1.0.0: {}
+
   is-map@2.0.3: {}
 
   is-natural-number@4.0.1: {}
@@ -22792,6 +23108,8 @@ snapshots:
 
   js-base64@2.6.4: {}
 
+  js-base64@3.7.8: {}
+
   js-levenshtein@1.1.6: {}
 
   js-tokens@4.0.0: {}
@@ -22839,6 +23157,34 @@ snapshots:
       - supports-color
       - utf-8-validate
 
+  jsdom@24.1.3:
+    dependencies:
+      cssstyle: 4.6.0
+      data-urls: 5.0.0
+      decimal.js: 10.6.0
+      form-data: 4.0.4
+      html-encoding-sniffer: 4.0.0
+      http-proxy-agent: 7.0.2
+      https-proxy-agent: 7.0.6
+      is-potential-custom-element-name: 1.0.1
+      nwsapi: 2.2.22
+      parse5: 7.3.0
+      rrweb-cssom: 0.7.1
+      saxes: 6.0.0
+      symbol-tree: 3.2.4
+      tough-cookie: 4.1.4
+      w3c-xmlserializer: 5.0.0
+      webidl-conversions: 7.0.0
+      whatwg-encoding: 3.1.1
+      whatwg-mimetype: 4.0.0
+      whatwg-url: 14.2.0
+      ws: 8.18.3
+      xml-name-validator: 5.0.0
+    transitivePeerDependencies:
+      - bufferutil
+      - supports-color
+      - utf-8-validate
+
   jsesc@3.1.0: {}
 
   json-bigint@1.0.0:
@@ -22926,6 +23272,8 @@ snapshots:
 
   kind-of@6.0.3: {}
 
+  kleur@3.0.3: {}
+
   kleur@4.1.5: {}
 
   known-css-properties@0.27.0: {}
@@ -23792,6 +24140,10 @@ snapshots:
     dependencies:
       '@isaacs/brace-expansion': 5.0.0
 
+  minimatch@10.1.1:
+    dependencies:
+      '@isaacs/brace-expansion': 5.0.0
+
   minimatch@3.1.2:
     dependencies:
       brace-expansion: 1.1.12
@@ -24154,6 +24506,18 @@ snapshots:
       type-check: 0.4.0
       word-wrap: 1.2.5
 
+  ora@5.4.1:
+    dependencies:
+      bl: 4.1.0
+      chalk: 4.1.2
+      cli-cursor: 3.1.0
+      cli-spinners: 2.9.2
+      is-interactive: 1.0.0
+      is-unicode-supported: 0.1.0
+      log-symbols: 4.1.0
+      strip-ansi: 6.0.1
+      wcwidth: 1.0.1
+
   os-filter-obj@2.0.0:
     dependencies:
       arch: 2.2.0
@@ -24283,6 +24647,8 @@ snapshots:
 
   package-json-from-dist@1.0.1: {}
 
+  pako@0.2.9: {}
+
   parent-module@1.0.1:
     dependencies:
       callsites: 3.1.0
@@ -24320,6 +24686,8 @@ snapshots:
 
   parseurl@1.3.3: {}
 
+  path-browserify@1.0.1: {}
+
   path-exists@4.0.0: {}
 
   path-exists@5.0.0: {}
@@ -25093,6 +25461,11 @@ snapshots:
     dependencies:
       asap: 2.0.6
 
+  prompts@2.4.2:
+    dependencies:
+      kleur: 3.0.3
+      sisteransi: 1.0.5
+
   prop-types@15.8.1:
     dependencies:
       loose-envify: 1.4.0
@@ -25810,6 +26183,10 @@ snapshots:
 
   rrweb-cssom@0.6.0: {}
 
+  rrweb-cssom@0.7.1: {}
+
+  rrweb-cssom@0.8.0: {}
+
   rtl-css-js@1.16.1:
     dependencies:
       '@babel/runtime': 7.27.6
@@ -26134,6 +26511,8 @@ snapshots:
       mrmime: 2.0.1
       totalist: 3.0.1
 
+  sisteransi@1.0.5: {}
+
   sitemap@7.1.2:
     dependencies:
       '@types/node': 17.0.45
@@ -26895,6 +27274,8 @@ snapshots:
 
   timed-out@4.0.1: {}
 
+  tiny-inflate@1.0.3: {}
+
   tiny-invariant@1.3.3: {}
 
   tiny-warning@1.0.3: {}
@@ -26970,6 +27351,10 @@ snapshots:
     dependencies:
       punycode: 2.3.1
 
+  tr46@5.1.1:
+    dependencies:
+      punycode: 2.3.1
+
   tree-dump@1.1.0(tslib@2.8.1):
     dependencies:
       tslib: 2.8.1
@@ -26990,6 +27375,11 @@ snapshots:
 
   ts-dedent@2.2.0: {}
 
+  ts-morph@27.0.2:
+    dependencies:
+      '@ts-morph/common': 0.28.1
+      code-block-writer: 13.0.3
+
   ts-node@10.9.2(@types/node@22.18.8)(typescript@5.8.3):
     dependencies:
       '@cspotcode/source-map-support': 0.8.1
@@ -27055,6 +27445,8 @@ snapshots:
 
   type-fest@0.18.1: {}
 
+  type-fest@0.20.2: {}
+
   type-fest@0.21.3: {}
 
   type-fest@0.6.0: {}
@@ -27145,6 +27537,8 @@ snapshots:
 
   typescript@5.8.3: {}
 
+  typescript@5.9.3: {}
+
   uc.micro@1.0.6: {}
 
   uglify-js@2.8.29:
@@ -27175,6 +27569,10 @@ snapshots:
 
   undici-types@6.21.0: {}
 
+  undici@5.29.0:
+    dependencies:
+      '@fastify/busboy': 2.1.1
+
   unicode-canonical-property-names-ecmascript@2.0.1: {}
 
   unicode-match-property-ecmascript@2.0.0:
@@ -27186,6 +27584,11 @@ snapshots:
 
   unicode-property-aliases-ecmascript@2.2.0: {}
 
+  unicode-trie@2.0.0:
+    dependencies:
+      pako: 0.2.9
+      tiny-inflate: 1.0.3
+
   unicorn-magic@0.1.0: {}
 
   unicorn-magic@0.3.0: {}
@@ -27531,7 +27934,7 @@ snapshots:
       - typescript
       - universal-cookie
 
-  vitest-axe@0.1.0(vitest@3.0.9(@types/debug@4.1.12)(@types/node@22.18.8)(@vitest/browser@3.0.6)(@vitest/ui@3.0.6)(happy-dom@9.20.3)(jsdom@22.1.0)(less@3.13.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(sass@1.93.2)(sugarss@5.0.1(postcss@8.5.6))(terser@5.44.0)(yaml@2.8.0)):
+  vitest-axe@0.1.0(vitest@3.0.9(@types/debug@4.1.12)(@types/node@22.18.8)(@vitest/browser@3.0.6(@types/node@18.16.15)(playwright@1.48.0)(typescript@5.8.3)(vite@6.3.5(@types/node@18.16.15)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.38))(terser@5.44.0)(yaml@2.8.0))(vitest@3.0.9)(webdriverio@8.24.3(typescript@5.8.3)))(@vitest/ui@3.0.6(vitest@3.0.9))(happy-dom@9.20.3)(jsdom@22.1.0)(less@3.13.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(sass@1.93.2)(sugarss@5.0.1(postcss@8.5.6))(terser@5.44.0)(yaml@2.8.0)):
     dependencies:
       aria-query: 5.3.2
       axe-core: 4.9.1
@@ -27539,7 +27942,7 @@ snapshots:
       dom-accessibility-api: 0.5.16
       lodash-es: 4.17.21
       redent: 3.0.0
-      vitest: 3.0.9(@types/debug@4.1.12)(@types/node@22.18.8)(@vitest/browser@3.0.6)(@vitest/ui@3.0.6)(happy-dom@9.20.3)(jsdom@22.1.0)(less@3.13.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(sass@1.93.2)(sugarss@5.0.1(postcss@8.5.6))(terser@5.44.0)(yaml@2.8.0)
+      vitest: 3.0.9(@types/debug@4.1.12)(@types/node@22.18.8)(@vitest/browser@3.0.6(@types/node@18.16.15)(playwright@1.48.0)(typescript@5.8.3)(vite@6.3.5(@types/node@18.16.15)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.38))(terser@5.44.0)(yaml@2.8.0))(vitest@3.0.9)(webdriverio@8.24.3(typescript@5.8.3)))(@vitest/ui@3.0.6(vitest@3.0.9))(happy-dom@9.20.3)(jsdom@22.1.0)(less@3.13.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(sass@1.93.2)(sugarss@5.0.1(postcss@8.5.6))(terser@5.44.0)(yaml@2.8.0)
 
   vitest@3.0.9(@types/debug@4.1.12)(@types/node@18.16.15)(@vitest/browser@3.0.6)(@vitest/ui@3.0.6)(happy-dom@9.20.3)(jsdom@22.1.0)(less@3.13.1)(msw@2.11.3(@types/node@18.16.15)(typescript@5.8.3))(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.38))(terser@5.44.0)(yaml@2.8.0):
     dependencies:
@@ -27584,7 +27987,7 @@ snapshots:
       - tsx
       - yaml
 
-  vitest@3.0.9(@types/debug@4.1.12)(@types/node@22.18.8)(@vitest/browser@3.0.6)(@vitest/ui@3.0.6)(happy-dom@9.20.3)(jsdom@22.1.0)(less@3.13.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(sass@1.93.2)(sugarss@5.0.1(postcss@8.5.6))(terser@5.44.0)(yaml@2.8.0):
+  vitest@3.0.9(@types/debug@4.1.12)(@types/node@22.18.8)(@vitest/browser@3.0.6(@types/node@18.16.15)(playwright@1.48.0)(typescript@5.8.3)(vite@6.3.5(@types/node@18.16.15)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.38))(terser@5.44.0)(yaml@2.8.0))(vitest@3.0.9)(webdriverio@8.24.3(typescript@5.8.3)))(@vitest/ui@3.0.6(vitest@3.0.9))(happy-dom@9.20.3)(jsdom@22.1.0)(less@3.13.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(sass@1.93.2)(sugarss@5.0.1(postcss@8.5.6))(terser@5.44.0)(yaml@2.8.0):
     dependencies:
       '@vitest/expect': 3.0.9
       '@vitest/mocker': 3.0.9(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(vite@6.3.5(@types/node@22.18.8)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.5.6))(terser@5.44.0)(yaml@2.8.0))
@@ -27647,6 +28050,10 @@ snapshots:
     dependencies:
       xml-name-validator: 4.0.0
 
+  w3c-xmlserializer@5.0.0:
+    dependencies:
+      xml-name-validator: 5.0.0
+
   wait-port@1.1.0:
     dependencies:
       chalk: 4.1.2
@@ -27668,6 +28075,10 @@ snapshots:
     dependencies:
       minimalistic-assert: 1.0.1
 
+  wcwidth@1.0.1:
+    dependencies:
+      defaults: 1.0.4
+
   web-streams-polyfill@3.3.3: {}
 
   webdriver@8.24.3:
@@ -27834,15 +28245,26 @@ snapshots:
     dependencies:
       iconv-lite: 0.6.3
 
+  whatwg-encoding@3.1.1:
+    dependencies:
+      iconv-lite: 0.6.3
+
   whatwg-fetch@3.6.2: {}
 
   whatwg-mimetype@3.0.0: {}
 
+  whatwg-mimetype@4.0.0: {}
+
   whatwg-url@12.0.1:
     dependencies:
       tr46: 4.1.1
       webidl-conversions: 7.0.0
 
+  whatwg-url@14.2.0:
+    dependencies:
+      tr46: 5.1.1
+      webidl-conversions: 7.0.0
+
   whatwg-url@5.0.0:
     dependencies:
       tr46: 0.0.3
@@ -27910,6 +28332,10 @@ snapshots:
       siginfo: 2.0.0
       stackback: 0.0.2
 
+  widest-line@3.1.0:
+    dependencies:
+      string-width: 4.2.3
+
   window-size@0.1.0: {}
 
   window-size@0.1.4: {}
@@ -27978,6 +28404,8 @@ snapshots:
 
   xml-name-validator@4.0.0: {}
 
+  xml-name-validator@5.0.0: {}
+
   xml2js@0.4.23:
     dependencies:
       sax: 1.4.1
@@ -28092,6 +28520,12 @@ snapshots:
       compress-commons: 5.0.3
       readable-stream: 3.6.2
 
+  zod-validation-error@3.5.4(zod@3.25.58):
+    dependencies:
+      zod: 3.25.58
+
+  zod@3.25.58: {}
+
   zod@3.25.76: {}
 
   zwitch@2.0.4: {}
diff --git a/tools/continuous-delivery/src/utils/allowedScopes.ts b/tools/continuous-delivery/src/utils/allowedScopes.ts
index dba263fc26..7e7c346490 100644
--- a/tools/continuous-delivery/src/utils/allowedScopes.ts
+++ b/tools/continuous-delivery/src/utils/allowedScopes.ts
@@ -9,7 +9,7 @@ export const allowedScopes = async () => {
     !scopeName.startsWith('.') && !scopeName.startsWith('@');
   const semcoreComponents = (await fs.readdir(resolvePath(dirname, '..', '..', '..', '..', 'semcore'))).filter(filterFsEntries);
   const toolsComponents = (await fs.readdir(resolvePath(dirname, '..', '..', '..', '..', 'tools'))).filter(filterFsEntries);
-  const specialScopes = ['global', 'chore', 'ci', 'website', 'docs', 'tests', 'stories'];
+  const specialScopes = ['global', 'chore', 'ci', 'website', 'docs', 'tests', 'stories', 'figma'];
 
   return {
     specialScopes,