diff --git a/eslint.config.mjs b/eslint.config.mjs
index 46a4208721..a2fac97a39 100644
--- a/eslint.config.mjs
+++ b/eslint.config.mjs
@@ -25,6 +25,7 @@ export default defineConfig([
     'semcore/icon/**/*.mjs',
     'semcore/icon/**/*.js',
     'semcore/icon/**/*.d.ts',
+    'figma/*.figma.jsx',
   ]),
   { files: ['**/*.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'], plugins: { js }, extends: ['js/recommended'] },
   pluginReact.configs.flat.recommended,
diff --git a/figma-custom.config.json b/figma-custom.config.json
new file mode 100644
index 0000000000..413a9acc4c
--- /dev/null
+++ b/figma-custom.config.json
@@ -0,0 +1,12 @@
+{
+  "codeConnect": {
+    "include": ["figma/*.figma.template.js"],
+    "exclude": ["Example.figma.template.js"],
+    "label": "React",
+    "parser": "custom",
+    "parserCommand": "pnpm tsm figma/utils/parser.ts",
+    "paths": {
+      "@semcore/ui/*": ["semcore/*/src"]
+    }
+  }
+}
\ No newline at end of file
diff --git a/figma.config.json b/figma.config.json
new file mode 100644
index 0000000000..2d864dfa67
--- /dev/null
+++ b/figma.config.json
@@ -0,0 +1,10 @@
+{
+  "codeConnect": {
+    "include": ["figma/*.figma.jsx"],
+    "label": "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/Accordion.figma.jsx b/figma/Accordion.figma.jsx
new file mode 100644
index 0000000000..26fa7e7393
--- /dev/null
+++ b/figma/Accordion.figma.jsx
@@ -0,0 +1,68 @@
+import figma from 'figma-api';
+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=wmeCZaspBw4PtpTZ-11', {
+    props: {
+        use: figma.enum('use', {
+            'primary': 'primary',
+            'secondary': 'secondary',
+        }),
+
+    },
+    example: () => (
+        <Accordion.Item.Toggle>
+            <Accordion.Item.ToggleButton>
+              <Accordion.Item.Chevron mr={2} />
+              /* Add text ${index + 1} */
+            </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=wmeCZaspBw4PtpTZ-11', {
+    
+    example: () => (
+        <Accordion.Item.Collapse>
+            <Box p='/* Set paddings */'>{/* Add text ${index + 1} */}</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=wmeCZaspBw4PtpTZ-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=wmeCZaspBw4PtpTZ-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>
+    )
+});
\ No newline at end of file
diff --git a/figma/Badge.figma.jsx b/figma/Badge.figma.jsx
new file mode 100644
index 0000000000..43037f66b3
--- /dev/null
+++ b/figma/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/BaseTrigger.figma.jsx b/figma/BaseTrigger.figma.jsx
new file mode 100644
index 0000000000..3b163a6256
--- /dev/null
+++ b/figma/BaseTrigger.figma.jsx
@@ -0,0 +1,123 @@
+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.boolean('loading'),
+    },
+    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.boolean('loading'),
+    },
+    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.boolean('loading'),
+      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/Breadcrumbs.figma.jsx b/figma/Breadcrumbs.figma.jsx
new file mode 100644
index 0000000000..09557abc6a
--- /dev/null
+++ b/figma/Breadcrumbs.figma.jsx
@@ -0,0 +1,50 @@
+import figma from '@figma/code-connect/react';
+import Breadcrumbs from '@semcore/ui/breadcrumbs';
+
+figma.connect(
+  Breadcrumbs,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11878-115146&t=Q0bSsRErIQ7IEZAU-11',
+  {
+    variant: { 'folder': 'true' },
+    props: {
+      homeLink: figma.nestedProps('Home link', {
+        label: figma.textContent('↳ text'),
+      }),
+      folderLink: figma.nestedProps('Folder link', {
+        label: figma.textContent('↳ text'),
+      }),
+      productLink: figma.nestedProps('Product link', {
+        label: figma.textContent('↳ text'),
+      }),
+    },
+    example: ({ homeLink, folderLink, productLink }) => (
+      <Breadcrumbs>
+        <Breadcrumbs.Item href='#'>{homeLink.label}</Breadcrumbs.Item>
+        <Breadcrumbs.Item href='#'>{folderLink.label}</Breadcrumbs.Item>
+        <Breadcrumbs.Item href='#' active>{productLink.label}</Breadcrumbs.Item>
+      </Breadcrumbs>
+    ),
+  },
+);
+
+figma.connect(
+  Breadcrumbs,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=11878-115146&t=Q0bSsRErIQ7IEZAU-11',
+  {
+    variant: { 'folder': 'false' },
+    props: {
+      homeLink: figma.nestedProps('Home link', {
+        label: figma.textContent('↳ text'),
+      }),
+      productLink: figma.nestedProps('Product link', {
+        label: figma.textContent('↳ text'),
+      }),
+    },
+    example: ({ homeLink, productLink }) => (
+      <Breadcrumbs>
+        <Breadcrumbs.Item href='#'>{homeLink.label}</Breadcrumbs.Item>
+        <Breadcrumbs.Item href='#' active>{productLink.label}</Breadcrumbs.Item>
+      </Breadcrumbs>
+    ),
+  },
+);
\ No newline at end of file
diff --git a/figma/BulkTextarea.figma.jsx b/figma/BulkTextarea.figma.jsx
new file mode 100644
index 0000000000..b4d9303909
--- /dev/null
+++ b/figma/BulkTextarea.figma.jsx
@@ -0,0 +1,48 @@
+import figma from '@figma/code-connect/react';
+import BulkTextarea from '@semcore/ui/bulk-textarea';
+import { Text } from '@semcore/ui/typography';
+import { Flex } from '@semcore/ui/base-components';
+
+// 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>,
+  },
+);
\ No newline at end of file
diff --git a/figma/Button.figma.jsx b/figma/Button.figma.jsx
new file mode 100644
index 0000000000..905f5f9055
--- /dev/null
+++ b/figma/Button.figma.jsx
@@ -0,0 +1,134 @@
+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.boolean('loading'),
+      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.boolean('loading'),
+    disabled: figma.enum('state', {
+      disabled: true,
+    }),
+    title: figma.textContent('↳ title'),
+  },
+  example: (props) => (
+    <Button {...props} addonLeft={/* icon name */} />
+  ),
+});
\ No newline at end of file
diff --git a/figma/ButtonLink.figma.jsx b/figma/ButtonLink.figma.jsx
new file mode 100644
index 0000000000..5bea9e2eab
--- /dev/null
+++ b/figma/ButtonLink.figma.jsx
@@ -0,0 +1,77 @@
+import figma from '@figma/code-connect';
+import { ButtonLink } from '@semcore/ui/button';
+
+figma.connect(
+  ButtonLink,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=45638-2735&t=fvHZdzdrBaexbYww-11',
+  {
+    variant: { 'icon only': 'false' },
+    props: {
+      label: figma.textContent('↳ text'),
+      use: figma.enum('use', {
+        primary: 'primary',
+        secondary: 'secondary',
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      active: figma.enum('state', {
+        active: true,
+      }),
+      addonLeft: figma.boolean('← addon', {
+        true: figma.children('← - - addon properties'),
+        false: undefined,
+      }),
+      addonRight: figma.boolean('addon →', {
+        true: figma.children('addon properties - - →'),
+        false: undefined,
+      }),
+    },
+    example: ({ use, addonLeft, addonRight, active, disabled, label }) => (
+      <ButtonLink
+        size='/* fontSize */'
+        use={use}
+        color='/* color-token */'
+        addonLeft={addonLeft}
+        addonRight={addonRight}
+        active={active}
+        disabled={disabled}
+      >
+        {label}
+      </ButtonLink>
+    ),
+  },
+);
+
+figma.connect(
+  ButtonLink,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=45638-2735&t=fvHZdzdrBaexbYww-11',
+  {
+    variant: { 'icon only': 'true' },
+    props: {
+      use: figma.enum('use', {
+        primary: 'primary',
+        secondary: 'secondary',
+      }),
+      disabled: figma.enum('state', {
+        disabled: true,
+      }),
+      active: figma.enum('state', {
+        active: true,
+      }),
+      addonLeft: figma.children('*'),
+      title: figma.textContent('↳ title'),
+    },
+    example: ({ use, addonLeft, active, disabled, title }) => (
+      <ButtonLink
+        size='/* fontSize */'
+        use={use}
+        color='/* color-token */'
+        addonLeft={addonLeft}
+        active={active}
+        disabled={disabled}
+        aria-label={title}
+      />
+    ),
+  },
+);
diff --git a/figma/Card.figma.template.js b/figma/Card.figma.template.js
new file mode 100644
index 0000000000..35d1a547b1
--- /dev/null
+++ b/figma/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/CardHeader.figma.template.js b/figma/CardHeader.figma.template.js
new file mode 100644
index 0000000000..7d2c9eb9a9
--- /dev/null
+++ b/figma/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/CardSplit.figma.template.js b/figma/CardSplit.figma.template.js
new file mode 100644
index 0000000000..ed2e4b44fd
--- /dev/null
+++ b/figma/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/CardTable.figma.template.js b/figma/CardTable.figma.template.js
new file mode 100644
index 0000000000..10ed3d8fdd
--- /dev/null
+++ b/figma/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/Carousel.figma.jsx b/figma/Carousel.figma.jsx
new file mode 100644
index 0000000000..5e69832463
--- /dev/null
+++ b/figma/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=10259-107911&t=onQIkzskH4lPCKHQ-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=10259-107911&t=onQIkzskH4lPCKHQ-11',
+    {
+      variant: { 'screen width': '≤480px' },
+      props: {
+        zoom: figma.boolean('zoom'),
+      },
+  
+      example: () => (
+          <Carousel>
+          <Carousel.Container>
+
+          {/* Add items here */}
+        </Carousel.Container>
+        <Flex direction='row'>
+          <Carousel.Prev  />
+          <Carousel.Next />
+        </Flex>
+        </Carousel>
+      ),
+    },
+  );
\ No newline at end of file
diff --git a/figma/Checkbox.figma.jsx b/figma/Checkbox.figma.jsx
new file mode 100644
index 0000000000..f4d70bed0b
--- /dev/null
+++ b/figma/Checkbox.figma.jsx
@@ -0,0 +1,65 @@
+import figma from '@figma/code-connect';
+import Checkbox from '@semcore/ui/checkbox';
+import { Flex } from '@semcore/ui/base-components';
+
+figma.connect(
+  Checkbox,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=10063-46204&t=uvqbUJPa7hkmPVOa-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}
+      />
+    ),
+  },
+);
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=19530-124198&t=uvqbUJPa7hkmPVOa-11',
+  {
+    props: {
+      size: figma.enum('size', {
+        L: 'l',
+        M: 'm',
+      }),
+    },
+    example: ({ size }) => (
+      <Flex>
+        <Checkbox mb={3} size={size} label={/* Add your label */} />
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/CheckboxList.figma.jsx b/figma/CheckboxList.figma.jsx
new file mode 100644
index 0000000000..489f3b45bc
--- /dev/null
+++ b/figma/CheckboxList.figma.jsx
@@ -0,0 +1,21 @@
+import figma from '@figma/code-connect';
+import Checkbox from '@semcore/ui/checkbox';
+import { Flex } from '@semcore/ui/base-components';
+
+figma.connect(
+  Flex,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=19530-124198&t=uvqbUJPa7hkmPVOa-11',
+  {
+    props: {
+      size: figma.enum('size', {
+        L: 'l',
+        M: 'm',
+      }),
+    },
+    example: ({ size }) => (
+      <Flex direction='column' gap={3}>
+        <Checkbox size={size} />
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/ColorPicker.Popper.figma.template.js b/figma/ColorPicker.Popper.figma.template.js
new file mode 100644
index 0000000000..f6d3638829
--- /dev/null
+++ b/figma/ColorPicker.Popper.figma.template.js
@@ -0,0 +1,24 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=21801-151060
+// import ColorPicker, { PaletteManager } from '@semcore/ui/color-picker';
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const displayLabel = instance.findLayers((child) => child.getBoolean('text color')).length
+  ? 'displayLabel'
+  : undefined;
+
+const popperCode = instance.getBoolean('custom colors', {
+  true: `<ColorPicker.Popper>
+  <ColorPicker.Colors />
+  <PaletteManager />
+</ColorPicker.Popper>`,
+  false: '<ColorPicker.Popper />',
+});
+
+export default {
+  example: figma.tsx`<ColorPicker ${displayLabel}>
+  <ColorPicker.Trigger />
+  ${popperCode}
+</ColorPicker>`,
+  id: 'ColorPicker.Popper',
+};
diff --git a/figma/ColorPicker.Trigger.figma.template.js b/figma/ColorPicker.Trigger.figma.template.js
new file mode 100644
index 0000000000..9962b3d75a
--- /dev/null
+++ b/figma/ColorPicker.Trigger.figma.template.js
@@ -0,0 +1,13 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=55817-4777
+// import ColorPicker from '@semcore/ui/color-picker';
+const figma = require('figma');
+
+export default {
+  example: figma.tsx`<ColorPicker>
+  <ColorPicker.Trigger />
+  <ColorPicker.Popper>
+  {/* ColorPicker.Popper content */}
+  </ColorPicker.Popper>
+</ColorPicker>`,
+  id: 'ColorPicker.Trigger',
+};
diff --git a/figma/Counter.figma.jsx b/figma/Counter.figma.jsx
new file mode 100644
index 0000000000..2cfb47a7a5
--- /dev/null
+++ b/figma/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/DescriptionTooltip.jsx b/figma/DescriptionTooltip.jsx
new file mode 100644
index 0000000000..44a482e8e8
--- /dev/null
+++ b/figma/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/Divider.figma.jsx b/figma/Divider.figma.jsx
new file mode 100644
index 0000000000..d045075a9b
--- /dev/null
+++ b/figma/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/DnD.figma.jsx b/figma/DnD.figma.jsx
new file mode 100644
index 0000000000..71e8a83705
--- /dev/null
+++ b/figma/DnD.figma.jsx
@@ -0,0 +1,45 @@
+import figma from '@figma/code-connect';
+import DnD from '@semcore/ui/drag-and-drop';
+import { Flex } from '@semcore/ui/base-components';
+import { Text } from '@semcore/ui/typography';
+import { MathPlusL } from '@semcore/ui/icon';
+
+figma.connect(
+    DnD,
+    'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10355-198972&t=ZzJR7SMXKxVeObuH-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>
+    ),
+});
\ No newline at end of file
diff --git a/figma/Dot.figma.jsx b/figma/Dot.figma.jsx
new file mode 100644
index 0000000000..22f2ac9833
--- /dev/null
+++ b/figma/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/FeedbackForm.figma.jsx b/figma/FeedbackForm.figma.jsx
new file mode 100644
index 0000000000..5f72952f16
--- /dev/null
+++ b/figma/FeedbackForm.figma.jsx
@@ -0,0 +1,83 @@
+import figma from '@figma/code-connect';
+import FeedbackForm from '@semcore/ui/feedback-form';
+
+// 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=10267-96106&t=wmeCZaspBw4PtpTZ-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 }: any) => (
+                <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 }: any) => (
+                <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>
+    ),
+},
+);
\ No newline at end of file
diff --git a/figma/FeedbackRating.figma.jsx b/figma/FeedbackRating.figma.jsx
new file mode 100644
index 0000000000..5d31684f58
--- /dev/null
+++ b/figma/FeedbackRating.figma.jsx
@@ -0,0 +1,90 @@
+import figma from '@figma/code-connect';
+import { FeedbackRating } from '@semcore/ui/feedback-form';
+
+// 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=55646-2220&t=VH03GkxOOasazgnM-11', {
+//     example: () => (
+//         <SliderRating.Star />
+//     )
+// });
+
+// figma.connect(
+//     SliderRating,
+//     'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=42668-2138&t=wmeCZaspBw4PtpTZ-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=42668-2138&t=wmeCZaspBw4PtpTZ-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=55796-3861&t=wmeCZaspBw4PtpTZ-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=55796-3861&t=wmeCZaspBw4PtpTZ-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>
+                </>
+            }
+        />
+    )
+});
\ No newline at end of file
diff --git a/figma/FilterTrigger.figma.jsx b/figma/FilterTrigger.figma.jsx
new file mode 100644
index 0000000000..ba91f9df78
--- /dev/null
+++ b/figma/FilterTrigger.figma.jsx
@@ -0,0 +1,186 @@
+import figma from '@figma/code-connect';
+import { FilterTrigger } from '@semcore/ui/base-trigger';
+import Select from '@semcore/ui/select';
+import Dropdown from '@semcore/ui/dropdown';
+
+// 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>
+        ),
+    },
+);
\ No newline at end of file
diff --git a/figma/Flags.figma.jsx b/figma/Flags.figma.jsx
new file mode 100644
index 0000000000..52ef2215c0
--- /dev/null
+++ b/figma/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=10034-250009&t=NrTxRQcw036G61Oc-11',
+  {
+    example: (props) => <Flags iso2={/* value */} />,
+  },
+);
diff --git a/figma/FullscreenModal.figma.jsx b/figma/FullscreenModal.figma.jsx
new file mode 100644
index 0000000000..d88f60614c
--- /dev/null
+++ b/figma/FullscreenModal.figma.jsx
@@ -0,0 +1,66 @@
+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>,
+    },
+  );
\ No newline at end of file
diff --git a/figma/Hint.jsx b/figma/Hint.jsx
new file mode 100644
index 0000000000..642160c5c7
--- /dev/null
+++ b/figma/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/Icon.figma.jsx b/figma/Icon.figma.jsx
new file mode 100644
index 0000000000..84c1a6a3da
--- /dev/null
+++ b/figma/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/InlineInput.figma.jsx b/figma/InlineInput.figma.jsx
new file mode 100644
index 0000000000..7c1b754fa4
--- /dev/null
+++ b/figma/InlineInput.figma.jsx
@@ -0,0 +1,39 @@
+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.boolean('loading'),
+      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>
+    ),
+  },
+);
\ No newline at end of file
diff --git a/figma/Input.figma.jsx b/figma/Input.figma.jsx
new file mode 100644
index 0000000000..7f62c72c63
--- /dev/null
+++ b/figma/Input.figma.jsx
@@ -0,0 +1,155 @@
+import figma from '@figma/code-connect/react';
+import { Flex } from '@semcore/ui/base-components';
+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/InputNumber.figma.jsx b/figma/InputNumber.figma.jsx
new file mode 100644
index 0000000000..aecabe36fe
--- /dev/null
+++ b/figma/InputNumber.figma.jsx
@@ -0,0 +1,109 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+import InputNumber from '@semcore/ui/input-number';
+
+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 for props */}
+        </InputNumber>
+        <InputNumber neighborLocation='left'>
+          {/* select individual inputs for 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&t=Fgs2Jv2CPgCOdctF-11',
+//   {
+//     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>
+//     ),
+//   },
+// );
diff --git a/figma/InputPhone.figma.jsx b/figma/InputPhone.figma.jsx
new file mode 100644
index 0000000000..432a444dde
--- /dev/null
+++ b/figma/InputPhone.figma.jsx
@@ -0,0 +1,135 @@
+import figma from '@figma/code-connect/react';
+import { ButtonLink } from '@semcore/ui/button';
+import Flag, { iso2Name } from '@semcore/ui/flags';
+import { Box } from '@semcore/ui/base-components';
+import Input from '@semcore/ui/input';
+
+// 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['US']} */} />
+        </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>
+    ),
+  },
+);
diff --git a/figma/InputTags.figma.jsx b/figma/InputTags.figma.jsx
new file mode 100644
index 0000000000..92770a586a
--- /dev/null
+++ b/figma/InputTags.figma.jsx
@@ -0,0 +1,36 @@
+import figma from '@figma/code-connect';
+import InputTags from '@semcore/ui/input-tags';
+
+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>,
+  },
+);
\ No newline at end of file
diff --git a/figma/Link.figma.jsx b/figma/Link.figma.jsx
new file mode 100644
index 0000000000..764b6a63aa
--- /dev/null
+++ b/figma/Link.figma.jsx
@@ -0,0 +1,38 @@
+import figma from '@figma/code-connect';
+import Link from '@semcore/ui/link';
+
+figma.connect(
+  Link,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring--%E2%9D%96-Core-Components?node-id=10142-178857&t=CE9QdkPSfZjp1bN9-11',
+  {
+    props: {
+      label: figma.textContent('↳ text'),
+      active: figma.enum('state', {
+        active: 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,
+      }),
+    },
+    example: ({ addonLeft, addonRight, active, disabled, label }) => (
+      <Link
+        size={/* fontSize */}
+        href='/* Set URL */'
+        active={active}
+        disabled={disabled}
+        addonLeft={addonLeft}
+        addonRight={addonRight}
+      >
+        {label}
+      </Link>
+    ),
+  },
+);
diff --git a/figma/List.figma.jsx b/figma/List.figma.jsx
new file mode 100644
index 0000000000..ceea980afd
--- /dev/null
+++ b/figma/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('↳ text'),
+    },
+    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/Modal.figma.jsx b/figma/Modal.figma.jsx
new file mode 100644
index 0000000000..659ecedbae
--- /dev/null
+++ b/figma/Modal.figma.jsx
@@ -0,0 +1,17 @@
+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>,
+  },
+);
\ No newline at end of file
diff --git a/figma/ModalContent.figma.jsx b/figma/ModalContent.figma.jsx
new file mode 100644
index 0000000000..b3247f71a4
--- /dev/null
+++ b/figma/ModalContent.figma.jsx
@@ -0,0 +1,97 @@
+import figma from '@figma/code-connect/react';
+import { Flex } from '@semcore/ui/base-components';
+import { Text } from '@semcore/ui/typography';
+import MailSent from '@semcore/ui/illustration/MailSent'
+
+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 direction='row' 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>,
+  },
+);
\ No newline at end of file
diff --git a/figma/Notice.figma.jsx b/figma/Notice.figma.jsx
new file mode 100644
index 0000000000..585d795fa5
--- /dev/null
+++ b/figma/Notice.figma.jsx
@@ -0,0 +1,96 @@
+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>,
+    },
+  );
\ No newline at end of file
diff --git a/figma/NoticeBubble.figma.jsx b/figma/NoticeBubble.figma.jsx
new file mode 100644
index 0000000000..c4683bb44f
--- /dev/null
+++ b/figma/NoticeBubble.figma.jsx
@@ -0,0 +1,11 @@
+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 */} />
+  }
+);
\ No newline at end of file
diff --git a/figma/NoticeGlobal.figma.jsx b/figma/NoticeGlobal.figma.jsx
new file mode 100644
index 0000000000..b21ddeda16
--- /dev/null
+++ b/figma/NoticeGlobal.figma.jsx
@@ -0,0 +1,27 @@
+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>,
+  }
+);
\ No newline at end of file
diff --git a/figma/NoticeSmart.figma.jsx b/figma/NoticeSmart.figma.jsx
new file mode 100644
index 0000000000..cc8224eaad
--- /dev/null
+++ b/figma/NoticeSmart.figma.jsx
@@ -0,0 +1,26 @@
+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>,
+  }
+);
\ No newline at end of file
diff --git a/figma/Pagination.figma.jsx b/figma/Pagination.figma.jsx
new file mode 100644
index 0000000000..20f5667508
--- /dev/null
+++ b/figma/Pagination.figma.jsx
@@ -0,0 +1,50 @@
+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/Pills.figma.jsx b/figma/Pills.figma.jsx
new file mode 100644
index 0000000000..1efda5c388
--- /dev/null
+++ b/figma/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}>{/* list of pills */}</Pills>,
+  },
+);
diff --git a/figma/ProductHead.Info.Item.figma.template.js b/figma/ProductHead.Info.Item.figma.template.js
new file mode 100644
index 0000000000..34e15d5a79
--- /dev/null
+++ b/figma/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/ProductHead.figma.template.js b/figma/ProductHead.figma.template.js
new file mode 100644
index 0000000000..58018b468c
--- /dev/null
+++ b/figma/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/ProgressBar.figma.jsx b/figma/ProgressBar.figma.jsx
new file mode 100644
index 0000000000..66061700fb
--- /dev/null
+++ b/figma/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/Radio.figma.jsx b/figma/Radio.figma.jsx
new file mode 100644
index 0000000000..7f312b1565
--- /dev/null
+++ b/figma/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/RadioGroup.figma.jsx b/figma/RadioGroup.figma.jsx
new file mode 100644
index 0000000000..0cad0d3e4c
--- /dev/null
+++ b/figma/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/ScrollArea.figma.template.js b/figma/ScrollArea.figma.template.js
new file mode 100644
index 0000000000..cde1ead4bf
--- /dev/null
+++ b/figma/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/Select.Option.Checkbox.figma.jsx b/figma/Select.Option.Checkbox.figma.jsx
new file mode 100644
index 0000000000..e8c54486e9
--- /dev/null
+++ b/figma/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/Select.Option.Country.figma.jsx b/figma/Select.Option.Country.figma.jsx
new file mode 100644
index 0000000000..6dd78664e5
--- /dev/null
+++ b/figma/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/Select.Option.Group.figma.jsx b/figma/Select.Option.Group.figma.jsx
new file mode 100644
index 0000000000..e6467ace21
--- /dev/null
+++ b/figma/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&t=TXEgCxM6iJO0FYiJ-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 }) => (
+      <Select.Group size={size} title={title} subTitle={subTitle}>
+        {/* options */}
+      </Select.Group>
+    ),
+  },
+);
diff --git a/figma/Select.Option.Message.figma.jsx b/figma/Select.Option.Message.figma.jsx
new file mode 100644
index 0000000000..3588459f69
--- /dev/null
+++ b/figma/Select.Option.Message.figma.jsx
@@ -0,0 +1,143 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+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/Select.Option.figma.jsx b/figma/Select.Option.figma.jsx
new file mode 100644
index 0000000000..5b1180dcce
--- /dev/null
+++ b/figma/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/Select.figma.jsx b/figma/Select.figma.jsx
new file mode 100644
index 0000000000..0fe29322bf
--- /dev/null
+++ b/figma/Select.figma.jsx
@@ -0,0 +1,208 @@
+import figma from '@figma/code-connect';
+import Select from '@semcore/ui/select';
+import { Flex } from '@semcore/ui/base-components';
+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&t=UlTa6oEFj0Vk1UAt-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.boolean('loading'),
+    },
+    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&t=UlTa6oEFj0Vk1UAt-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.boolean('loading'),
+    },
+    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&t=UlTa6oEFj0Vk1UAt-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.boolean('loading'),
+      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 direction='row' 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 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>
+    ),
+  },
+);
\ No newline at end of file
diff --git a/figma/SelectList.figma.jsx b/figma/SelectList.figma.jsx
new file mode 100644
index 0000000000..21d6a20152
--- /dev/null
+++ b/figma/SelectList.figma.jsx
@@ -0,0 +1,135 @@
+import figma from '@figma/code-connect';
+import Select from '@semcore/ui/select';
+
+// Default Select List
+
+figma.connect(
+  Select.Menu,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47952-16111&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    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('Item/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&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { 'search input': 'false' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      notice: figma.boolean('notice ↓', {
+        true: figma.children('Item/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-16880&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      notice: figma.boolean('notice ↓', {
+        true: figma.children('Item/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=47966-8771&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    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('Item/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 as any).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/SelectMenu.figma.jsx b/figma/SelectMenu.figma.jsx
new file mode 100644
index 0000000000..c73e7f54ce
--- /dev/null
+++ b/figma/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&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { 'search input': 'false' },
+    props: {
+      size: figma.enum('size', {
+        M: 'm',
+        L: 'l',
+      }),
+      notice: figma.boolean('notice ↓', {
+        true: figma.children('Item/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/SidePanel.figma.jsx b/figma/SidePanel.figma.jsx
new file mode 100644
index 0000000000..a71ccc6164
--- /dev/null
+++ b/figma/SidePanel.figma.jsx
@@ -0,0 +1,44 @@
+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>,
+  },
+);
\ No newline at end of file
diff --git a/figma/Skeleton.figma.jsx b/figma/Skeleton.figma.jsx
new file mode 100644
index 0000000000..71c257aa92
--- /dev/null
+++ b/figma/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/SkeletonBone.figma.jsx b/figma/SkeletonBone.figma.jsx
new file mode 100644
index 0000000000..59681a763b
--- /dev/null
+++ b/figma/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/SkeletonShape.figma.jsx b/figma/SkeletonShape.figma.jsx
new file mode 100644
index 0000000000..82f206209c
--- /dev/null
+++ b/figma/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/SkeletonText.figma.jsx b/figma/SkeletonText.figma.jsx
new file mode 100644
index 0000000000..d21ef5e703
--- /dev/null
+++ b/figma/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/Slider.figma.jsx b/figma/Slider.figma.jsx
new file mode 100644
index 0000000000..372f472696
--- /dev/null
+++ b/figma/Slider.figma.jsx
@@ -0,0 +1,53 @@
+import figma from '@figma/code-connect/react';
+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 direction='row' gap={4}>
+      <Slider
+        disabled={disabled}
+      >
+        <Slider.Bar />
+        <Slider.Knob />
+      </Slider>
+      {input}
+  </Flex>,
+  }
+);
\ No newline at end of file
diff --git a/figma/Spin.figma.jsx b/figma/Spin.figma.jsx
new file mode 100644
index 0000000000..8821dda39c
--- /dev/null
+++ b/figma/Spin.figma.jsx
@@ -0,0 +1,84 @@
+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 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',
+      }),
+    },
+    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',
+      }),
+      text: figma.textContent('↳ text'),
+    },
+    example: ({ size, theme, text }) => (
+      <Flex alignItems='center' direction='row' gap={/* margin depends on text and spin size */}>
+        <Spin size={size} theme={theme}>{text}</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',
+      }),
+      text: figma.textContent('↳ text'),
+    },
+    example: ({ size, theme, text }) => (
+      <Flex alignItems='center' direction='column' gap={/* margin depends on text and spin size */}>
+        <Spin size={size} theme={theme}>{text}</Spin>
+        <Text size={/* fontSize */} color='text-secondary'>{text}</Text>
+      </Flex>
+    ),
+  },
+);
diff --git a/figma/SpinContainer.figma.jsx b/figma/SpinContainer.figma.jsx
new file mode 100644
index 0000000000..1db9955607
--- /dev/null
+++ b/figma/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'></SpinContainer>,
+  },
+);
diff --git a/figma/Switch.figma.jsx b/figma/Switch.figma.jsx
new file mode 100644
index 0000000000..eb97d4cf55
--- /dev/null
+++ b/figma/Switch.figma.jsx
@@ -0,0 +1,67 @@
+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/TabLine.figma.jsx b/figma/TabLine.figma.jsx
new file mode 100644
index 0000000000..3038fcdeb0
--- /dev/null
+++ b/figma/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>
+      ),
+    },
+  );
\ No newline at end of file
diff --git a/figma/TabPanel.figma.jsx b/figma/TabPanel.figma.jsx
new file mode 100644
index 0000000000..ff1e4636d5
--- /dev/null
+++ b/figma/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 }) => (
+        <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(
+    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>
+      ),
+    },
+  );
\ No newline at end of file
diff --git a/figma/Tag.figma.jsx b/figma/Tag.figma.jsx
new file mode 100644
index 0000000000..39eb4f16bf
--- /dev/null
+++ b/figma/Tag.figma.jsx
@@ -0,0 +1,73 @@
+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',
+        'red-500': 'red-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/TagAdditional.jsx b/figma/TagAdditional.jsx
new file mode 100644
index 0000000000..5085818b7f
--- /dev/null
+++ b/figma/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/TagContainer.figma.jsx b/figma/TagContainer.figma.jsx
new file mode 100644
index 0000000000..1b222abc12
--- /dev/null
+++ b/figma/TagContainer.figma.jsx
@@ -0,0 +1,70 @@
+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',
+        'red-500': 'red-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/Textarea.figma.jsx b/figma/Textarea.figma.jsx
new file mode 100644
index 0000000000..a325712307
--- /dev/null
+++ b/figma/Textarea.figma.jsx
@@ -0,0 +1,90 @@
+import figma from '@figma/code-connect';
+import Textarea from '@semcore/ui/textarea';
+import { Flex } from '@semcore/ui/base-components';
+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 direction='row' 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 direction='row' 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>
+      ),
+    },
+  );
\ No newline at end of file
diff --git a/figma/TimePicker.figma.template.js b/figma/TimePicker.figma.template.js
new file mode 100644
index 0000000000..7c433a60bf
--- /dev/null
+++ b/figma/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/Tooltip.figma.jsx b/figma/Tooltip.figma.jsx
new file mode 100644
index 0000000000..6f36a8ef03
--- /dev/null
+++ b/figma/Tooltip.figma.jsx
@@ -0,0 +1,42 @@
+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={addonTag}
+        {...addonProps}
+      />
+    ),
+  },
+);
diff --git a/figma/WidgetEmpty.figma.jsx b/figma/WidgetEmpty.figma.jsx
new file mode 100644
index 0000000000..962b78606c
--- /dev/null
+++ b/figma/WidgetEmpty.figma.jsx
@@ -0,0 +1,79 @@
+import figma from '@figma/code-connect';
+import WidgetEmpty, { NoData, Error, getIconPath } from '@semcore/ui/widget-empty';
+import { Box } from '@semcore/ui/base-components';
+
+// Mappings for Illustration component?
+
+figma.connect(
+    NoData,
+    'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10324-191512&t=axa0bYLOe9rBO9ps-11', {
+    variant: { 'case': 'No data' },
+
+    example: () => (
+        <NoData />
+    ),
+},
+);
+
+figma.connect(
+    Error,
+    'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=10324-191512&t=axa0bYLOe9rBO9ps-11', {
+    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=10324-191512&t=axa0bYLOe9rBO9ps-11', {
+    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=10324-191512&t=axa0bYLOe9rBO9ps-11', {
+    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>
+    ),
+},
+);
\ No newline at end of file
diff --git a/figma/current-libraries/Errors.figma.jsx b/figma/current-libraries/Errors.figma.jsx
new file mode 100644
index 0000000000..4dd23a1336
--- /dev/null
+++ b/figma/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/date-picker/DatePicker.Popper.figma.template.js b/figma/date-picker/DatePicker.Popper.figma.template.js
new file mode 100644
index 0000000000..b58dde3df9
--- /dev/null
+++ b/figma/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/date-picker/DatePicker.Trigger.figma.template.js b/figma/date-picker/DatePicker.Trigger.figma.template.js
new file mode 100644
index 0000000000..25bdb4e942
--- /dev/null
+++ b/figma/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/date-picker/DateRangeComparator.Popper.figma.template.js b/figma/date-picker/DateRangeComparator.Popper.figma.template.js
new file mode 100644
index 0000000000..50d8f3fa64
--- /dev/null
+++ b/figma/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/date-picker/DateRangeComparator.Trigger.figma.template.js b/figma/date-picker/DateRangeComparator.Trigger.figma.template.js
new file mode 100644
index 0000000000..0639cd00fc
--- /dev/null
+++ b/figma/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/date-picker/DateRangePicker.Popper.figma.template.js b/figma/date-picker/DateRangePicker.Popper.figma.template.js
new file mode 100644
index 0000000000..b0f3f44b9f
--- /dev/null
+++ b/figma/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/date-picker/DateRangePicker.Trigger.figma.template.js b/figma/date-picker/DateRangePicker.Trigger.figma.template.js
new file mode 100644
index 0000000000..b742c1133e
--- /dev/null
+++ b/figma/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/date-picker/InputTrigger.figma.template.js b/figma/date-picker/InputTrigger.figma.template.js
new file mode 100644
index 0000000000..425e7d83d5
--- /dev/null
+++ b/figma/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/date-picker/MonthPicker.Popper.figma.template.js b/figma/date-picker/MonthPicker.Popper.figma.template.js
new file mode 100644
index 0000000000..13ce467074
--- /dev/null
+++ b/figma/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/date-picker/MonthPicker.Trigger.figma.template.js b/figma/date-picker/MonthPicker.Trigger.figma.template.js
new file mode 100644
index 0000000000..7873d590d2
--- /dev/null
+++ b/figma/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/date-picker/MonthRangePicker.Popper.figma.template.js b/figma/date-picker/MonthRangePicker.Popper.figma.template.js
new file mode 100644
index 0000000000..c914b5ed73
--- /dev/null
+++ b/figma/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/date-picker/MonthRangePicker.Trigger.figma.template.js b/figma/date-picker/MonthRangePicker.Trigger.figma.template.js
new file mode 100644
index 0000000000..0e197e0c71
--- /dev/null
+++ b/figma/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/select/Select.Option.Checkbox.figma.jsx b/figma/select/Select.Option.Checkbox.figma.jsx
new file mode 100644
index 0000000000..e5fd6d8106
--- /dev/null
+++ b/figma/select/Select.Option.Checkbox.figma.jsx
@@ -0,0 +1,54 @@
+import figma from '@figma/code-connect';
+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-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>
+    ),
+  },
+);
+
+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/select/Select.Option.Country.figma.jsx b/figma/select/Select.Option.Country.figma.jsx
new file mode 100644
index 0000000000..6dd78664e5
--- /dev/null
+++ b/figma/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/select/Select.Option.Group.figma.jsx b/figma/select/Select.Option.Group.figma.jsx
new file mode 100644
index 0000000000..53dcaef6f3
--- /dev/null
+++ b/figma/select/Select.Option.Group.figma.jsx
@@ -0,0 +1,23 @@
+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&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    props: {
+      title: figma.textContent('↳ title'),
+      subTitle: figma.boolean('subTitle', {
+        true: figma.textContent('↳ subTitle'),
+        false: undefined,
+      }),
+    },
+    example: ({ title, subTitle }) => (
+      <Select.Group title={title} subTitle={subTitle}>
+        {/* options */}
+      </Select.Group>
+    ),
+  },
+);
diff --git a/figma/select/Select.Option.Message.figma.jsx b/figma/select/Select.Option.Message.figma.jsx
new file mode 100644
index 0000000000..3588459f69
--- /dev/null
+++ b/figma/select/Select.Option.Message.figma.jsx
@@ -0,0 +1,143 @@
+import figma from '@figma/code-connect';
+import { Flex } from '@semcore/ui/base-components';
+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/select/Select.Option.figma.jsx b/figma/select/Select.Option.figma.jsx
new file mode 100644
index 0000000000..9f827c2d52
--- /dev/null
+++ b/figma/select/Select.Option.figma.jsx
@@ -0,0 +1,66 @@
+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/select/Select.figma.jsx b/figma/select/Select.figma.jsx
new file mode 100644
index 0000000000..0fe29322bf
--- /dev/null
+++ b/figma/select/Select.figma.jsx
@@ -0,0 +1,208 @@
+import figma from '@figma/code-connect';
+import Select from '@semcore/ui/select';
+import { Flex } from '@semcore/ui/base-components';
+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&t=UlTa6oEFj0Vk1UAt-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.boolean('loading'),
+    },
+    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&t=UlTa6oEFj0Vk1UAt-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.boolean('loading'),
+    },
+    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&t=UlTa6oEFj0Vk1UAt-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.boolean('loading'),
+      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 direction='row' 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 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>
+    ),
+  },
+);
\ No newline at end of file
diff --git a/figma/select/SelectList.figma.jsx b/figma/select/SelectList.figma.jsx
new file mode 100644
index 0000000000..15dc2dbee6
--- /dev/null
+++ b/figma/select/SelectList.figma.jsx
@@ -0,0 +1,94 @@
+import figma from '@figma/code-connect';
+import Notice from '@semcore/ui/notice';
+import Select from '@semcore/ui/select';
+
+// TODO: When we add mappings for Notice, we can import Notice here, so I left import for Notice.
+
+figma.connect(
+  Select.Menu,
+  'https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=47952-16111&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    props: {
+      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('Item/Notice'),
+        false: undefined,
+      }),
+    },
+
+    example: ({ searchInput, notice }) => (
+      <Select.Popper aria-label='/* 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-16880&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    props: {
+      notice: figma.boolean('notice ↓', {
+        true: figma.children('Item/Notice'),
+        false: undefined,
+      }),
+    },
+
+    example: ({ notice }) => (
+      <Select.Popper aria-label='/* aria-label */'>
+        <Select.InputSearch value={/* value */} onChange={/* onChange */} aria-describedby={/* aria-describedby */} />
+        <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=47966-8771&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    props: {
+      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('Item/Notice'),
+        false: undefined,
+      }),
+    },
+
+    example: ({ searchInput, notice }) => (
+      <Select.Popper aria-label='/* aria-label */'>
+        {searchInput}
+        <Select.Menu hMax={/* value */}>
+          <Select.Option value='%all%'>
+            <Text color='text-link'>
+              {(currentValue as any).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/select/SelectMenu.figma.jsx b/figma/select/SelectMenu.figma.jsx
new file mode 100644
index 0000000000..314f0c3e99
--- /dev/null
+++ b/figma/select/SelectMenu.figma.jsx
@@ -0,0 +1,18 @@
+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&t=TXEgCxM6iJO0FYiJ-11',
+  {
+    variant: { 'search input': 'false', 'notice ↓': 'false' },
+
+    example: () => (
+      <Select.Menu hMax={/* value */}>
+        <Select.Option key={/* value */} value={/* value */}>
+          {/* option */}
+        </Select.Option>
+      </Select.Menu>
+    ),
+  },
+);
diff --git a/figma/utils/Example.figma.template.js b/figma/utils/Example.figma.template.js
new file mode 100644
index 0000000000..a799360b48
--- /dev/null
+++ b/figma/utils/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/utils/icons.ts b/figma/utils/icons.ts
new file mode 100644
index 0000000000..6a1d26c947
--- /dev/null
+++ b/figma/utils/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/utils/parser.ts b/figma/utils/parser.ts
new file mode 100644
index 0000000000..be0e71f719
--- /dev/null
+++ b/figma/utils/parser.ts
@@ -0,0 +1,90 @@
+import fs from 'fs';
+
+import type {
+  ParseResponsePayload, ParserExecutableMessages, SyntaxHighlightLanguage,
+} from './parser.types';
+
+const messages: ParserExecutableMessages = [];
+
+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' as SyntaxHighlightLanguage,
+    label: 'React',
+  };
+};
+
+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/utils/parser.types.ts b/figma/utils/parser.types.ts
new file mode 100644
index 0000000000..b738c42412
--- /dev/null
+++ b/figma/utils/parser.types.ts
@@ -0,0 +1,83 @@
+export type ParseResponsePayload = {
+  // Array of Code Connect docs parsed from the input files
+  docs: {
+    // 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
+    // supported values can be found in the SyntaxHighlightLanguage type below
+    language: SyntaxHighlightLanguage;
+    // Label to be used for the example in the UI
+    label: string;
+  }[];
+  // Any info, warning or error messages generated during parsing.
+  messages: ParserExecutableMessages;
+};
+
+export type ParserExecutableMessages = {
+  // 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;
+  };
+}[];
+
+export type PropMapping = Record<string, string>; // Intrinsic>; ?!
+
+export 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/figma/wizard/Wizard.figma.template.js b/figma/wizard/Wizard.figma.template.js
new file mode 100644
index 0000000000..245df9ec9c
--- /dev/null
+++ b/figma/wizard/Wizard.figma.template.js
@@ -0,0 +1,43 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=21448-126726
+// import Wizard from '@semcore/ui/wizard'
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const sideBar = instance.findConnectedInstance('Wizard.Sidebar').executeTemplate().example;
+
+let content = '{/* step content */}';
+const scrollArea = instance.findConnectedInstance('ScrollArea');
+if (
+  scrollArea.getBoolean('fader ↑') ||
+  scrollArea.getBoolean('fader ↓') ||
+  scrollArea.getBoolean('fader ->') ||
+  scrollArea.getBoolean('<- fader') ||
+  scrollArea.getBoolean('vertical scroll') ||
+  scrollArea.getBoolean('horizontal scroll')
+) {
+  content = `<ScrollArea shadow>${content}</ScrollArea>`;
+}
+
+const footer = instance.findConnectedInstance('Wizard.Footer').executeTemplate().example;
+
+export default {
+  example: figma.tsx`
+<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 */}
+      ${content}
+    </Wizard.Step>
+    <Wizard.Step step={/* number */}>
+      {/* next step content... */}
+    </Wizard.Step>
+    ${footer}
+  </Wizard.Content>
+</Wizard>
+  `,
+  id: 'Wizard',
+};
diff --git a/figma/wizard/WizardFooter.figma.template.js b/figma/wizard/WizardFooter.figma.template.js
new file mode 100644
index 0000000000..4066689f4d
--- /dev/null
+++ b/figma/wizard/WizardFooter.figma.template.js
@@ -0,0 +1,38 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=20987-123519
+// import Wizard from '@semcore/ui/wizard'
+// import {Flex} from '@semcore/ui/base-components'
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const cta = instanceCode(instance, 'CTA');
+const checkbox = instance.getBoolean('checkbox', {
+  true: instanceCode(instance, 'Checkbox'),
+});
+
+let wrapperStart, wrapperEnd;
+if (checkbox) {
+  wrapperStart = '<Flex direction="column" gap={3} alignItems="center">';
+  wrapperEnd = '</Flex>';
+}
+
+let backStepCode, nextStepCode;
+const backStep = instance.findInstance('Wizard.StepBack');
+const nextStep = instance.findInstance('Wizard.StepNext');
+if (backStep.type !== 'ERROR') {
+  backStepCode = `<Wizard.StepBack stepName="${backStep.findText('↳ text').textContent}" />`;
+}
+if (nextStep.type !== 'ERROR') {
+  nextStepCode = `<Wizard.StepBack stepName="${nextStep.findText('↳ text').textContent}" />`;
+}
+
+export default {
+  example: figma.tsx`
+${wrapperStart}
+${checkbox}
+<Flex>
+  ${backStepCode}${cta}${nextStepCode}
+</Flex>
+${wrapperEnd}
+  `,
+  id: 'Wizard.Footer',
+};
diff --git a/figma/wizard/WizardSidebar.figma.template.js b/figma/wizard/WizardSidebar.figma.template.js
new file mode 100644
index 0000000000..67b2219a7e
--- /dev/null
+++ b/figma/wizard/WizardSidebar.figma.template.js
@@ -0,0 +1,21 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=21022-133284
+// import Wizard from '@semcore/ui/wizard'
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const title = instance.findText('title').textContent;
+const titleCode = title ? `title="${title}"` : undefined;
+
+let childrenCode = '';
+instance.findConnectedInstances((_) => true).forEach((child) => {
+  childrenCode = figma.tsx`${childrenCode}${child.executeTemplate().example}`;
+});
+
+export default {
+  example: figma.tsx`
+<Wizard.Sidebar ${titleCode}>
+  ${childrenCode}
+</Wizard.Sidebar>
+  `,
+  id: 'Wizard.Sidebar',
+};
diff --git a/figma/wizard/WizardStepper.figma.template.js b/figma/wizard/WizardStepper.figma.template.js
new file mode 100644
index 0000000000..ed845466ad
--- /dev/null
+++ b/figma/wizard/WizardStepper.figma.template.js
@@ -0,0 +1,25 @@
+// https://www.figma.com/design/RLic9ruqNNm6qgARKFk5Ae/-Refactoring-WIP--%E2%9D%96-Core-Components?node-id=21448-126631
+// import Wizard from '@semcore/ui/wizard'
+const figma = require('figma');
+const instance = figma.selectedInstance;
+
+const completed = instance.getBoolean('completed', { true: 'completed' });
+const number = instance.findText('Wizard.StepNumber').textContent;
+const title = instance.findText('title').textContent;
+const optional = instance.getBoolean('optional', {
+  true: `<Text color='text-secondary-invert' fontWeight={400} mt={1} tag='div'>optional</Text>`,
+});
+
+const content = instance.getBoolean('text label', {
+  true: figma.tsx`${title}${optional}`,
+  false: `{/* this is an adaptive state for small viewports, 
+        refer to the full-width version for the full code */}`,
+});
+
+export default {
+  example: figma.tsx`
+<Wizard.Stepper step={${number}} ${completed}>
+  ${content}
+</Wizard.Stepper>`,
+  id: 'Wizard.Stepper',
+};
diff --git a/package.json b/package.json
index a25f2308d7..9fba491b01 100644
--- a/package.json
+++ b/package.json
@@ -51,8 +51,8 @@
     "@babel/cli": "7.27.2",
     "@babel/core": "7.27.7",
     "@babel/plugin-proposal-class-properties": "7.18.6",
-    "@babel/plugin-proposal-export-default-from": "7.27.1",
     "@babel/plugin-proposal-decorators": "7.28.0",
+    "@babel/plugin-proposal-export-default-from": "7.27.1",
     "@babel/plugin-syntax-import-assertions": "7.27.1",
     "@babel/plugin-transform-modules-commonjs": "7.27.1",
     "@babel/plugin-transform-runtime": "7.27.4",
@@ -62,6 +62,7 @@
     "@babel/runtime": "7.27.6",
     "@crowdin/cli": "3.10.1",
     "@eslint/js": "9.27.0",
+    "@figma/code-connect": "^1.3.7",
     "@guidepup/playwright": "0.13.2",
     "@jridgewell/set-array": "1.1.2",
     "@playwright/test": "1.48.0",
@@ -104,6 +105,7 @@
     "eslint": "9.27.0",
     "eslint-plugin-import": "2.31.0",
     "eslint-plugin-react": "7.37.5",
+    "eslint-plugin-storybook": "9.1.6",
     "execa": "9.6.0",
     "fast-glob": "3.2.11",
     "fast-hash-code": "2.1.0",
@@ -136,8 +138,7 @@
     "vite-plugin-babel": "1.3.2",
     "vitest": "3.0.9",
     "webdriverio": "8.24.3",
-    "yaml": "2.8.0",
-    "eslint-plugin-storybook": "9.1.6"
+    "yaml": "2.8.0"
   },
   "lint-staged": {
     "*.{css}": "pnpm lint:css --fix",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 32e4194872..0c34ec7bdc 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -72,6 +72,9 @@ importers:
       '@eslint/js':
         specifier: 9.27.0
         version: 9.27.0
+      '@figma/code-connect':
+        specifier: ^1.3.7
+        version: 1.3.7
       '@guidepup/playwright':
         specifier: 0.13.2
         version: 0.13.2(@guidepup/guidepup@0.24.0)(@playwright/test@1.48.0)
@@ -695,7 +698,7 @@ importers:
         version: 7.27.6
       '@formatjs/intl':
         specifier: 3.0.4
-        version: 3.0.4(typescript@5.8.3)
+        version: 3.0.4(typescript@5.9.3)
       '@phytonmk/nano-css':
         specifier: 5.3.7
         version: 5.3.7(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -2121,10 +2124,10 @@ importers:
         version: 8.4.38
       stylelint:
         specifier: 16.6.1
-        version: 16.6.1(typescript@5.8.3)
+        version: 16.6.1(typescript@5.9.3)
       stylelint-config-standard:
         specifier: 36.0.0
-        version: 36.0.0(stylelint@16.6.1(typescript@5.8.3))
+        version: 36.0.0(stylelint@16.6.1(typescript@5.9.3))
 
   semcore/switch:
     dependencies:
@@ -2637,7 +2640,7 @@ importers:
         version: 1.4.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@storybook/react-vite':
         specifier: 9.1.6
-        version: 9.1.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(rollup@4.52.4)(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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)))(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))
+        version: 9.1.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(rollup@4.52.4)(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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)))(typescript@5.9.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))
       d3-scale:
         specifier: 3.3.0
         version: 3.3.0
@@ -2649,7 +2652,7 @@ importers:
         version: 7.54.0(patch_hash=5ea80c984744a8ae88b2ac5d6a6b4bd9793291e90ba98f3c1701c4ba9770fd20)(react@18.3.1)
       react-intl:
         specifier: 7.1.11
-        version: 7.1.11(react@18.3.1)(typescript@5.8.3)
+        version: 7.1.11(react@18.3.1)(typescript@5.9.3)
       react-virtualized:
         specifier: 9.22.3
         version: 9.22.3(patch_hash=ef31cf74e1cf375a2149db1277cc4fc7ce97626239b42e55560316e9e660b413)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
@@ -3022,7 +3025,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@24.1.3)(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:
@@ -3037,10 +3040,10 @@ importers:
         version: 4.7.0(vite@5.4.20(@types/node@18.19.129)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0))
       '@vitejs/plugin-vue-jsx':
         specifier: ^3.1.0
-        version: 3.1.0(vite@5.4.20(@types/node@18.19.129)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0))(vue@3.5.22(typescript@5.8.3))
+        version: 3.1.0(vite@5.4.20(@types/node@18.19.129)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0))(vue@3.5.22(typescript@5.9.3))
       '@vueuse/core':
         specifier: ^11.3.0
-        version: 11.3.0(vue@3.5.22(typescript@5.8.3))
+        version: 11.3.0(vue@3.5.22(typescript@5.9.3))
       algoliasearch:
         specifier: 4.8.4
         version: 4.8.4
@@ -3163,7 +3166,7 @@ importers:
         version: 1.16.1
       vue:
         specifier: ^3.5.16
-        version: 3.5.22(typescript@5.8.3)
+        version: 3.5.22(typescript@5.9.3)
       whatwg-fetch:
         specifier: 3.6.2
         version: 3.6.2
@@ -3251,7 +3254,7 @@ importers:
         version: 10.1.2
       vitepress:
         specifier: 1.3.1
-        version: 1.3.1(@algolia/client-search@5.39.0)(@types/node@18.19.129)(@types/react@18.2.19)(axios@1.9.0)(fuse.js@6.6.2)(less@3.13.1)(postcss@8.4.33)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.93.2)(search-insights@2.17.3)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0)(typescript@5.8.3)
+        version: 1.3.1(@algolia/client-search@5.39.0)(@types/node@18.19.129)(@types/react@18.2.19)(axios@1.9.0)(fuse.js@6.6.2)(less@3.13.1)(postcss@8.4.33)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.93.2)(search-insights@2.17.3)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0)(typescript@5.9.3)
 
 packages:
 
@@ -3389,6 +3392,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:
@@ -4129,6 +4135,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'}
@@ -4140,6 +4150,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}
@@ -4147,16 +4164,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}
@@ -4737,6 +4771,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.7':
+    resolution: {integrity: sha512-D5WBJKAPeTtnFm8cSQixaBEfYf7vF/h8rOJs2yqx8NanHBDarVKt6CD4/tfmOPnlAaugyLnMR7DQ3IMmBIP2Xw==}
+    engines: {node: '>=18'}
+    hasBin: true
+
   '@formatjs/ecma402-abstract@1.11.7':
     resolution: {integrity: sha512-uNaok4XWMJBtPZk/veTDamFCm5HeWJUk2jwoVfH5/+wenQ60QHjH6T3UQ0GOOCz9jpKmed7vqOri7xSf//Dt7g==}
 
@@ -6162,6 +6205,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==}
 
@@ -7050,6 +7096,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'}
@@ -7477,6 +7526,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==}
 
@@ -7716,6 +7769,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'}
@@ -7724,6 +7781,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'}
@@ -7751,6 +7812,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'}
@@ -7759,6 +7824,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'}
@@ -7806,6 +7874,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'}
@@ -7832,6 +7904,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'}
@@ -8079,6 +8154,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==}
 
@@ -8201,6 +8280,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'}
@@ -8346,6 +8429,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'}
@@ -9202,6 +9288,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'}
@@ -9740,6 +9829,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}
@@ -9883,6 +9975,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==}
 
@@ -10275,6 +10371,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'}
@@ -10542,6 +10642,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'}
@@ -10572,6 +10675,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'}
@@ -10662,6 +10774,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'}
@@ -11589,6 +11705,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'}
@@ -11719,6 +11839,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'}
@@ -11751,6 +11874,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'}
@@ -12410,6 +12536,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==}
 
@@ -12939,6 +13069,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==}
 
@@ -13191,6 +13327,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'}
@@ -13744,6 +13883,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==}
 
@@ -13829,6 +13971,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'}
@@ -13859,6 +14005,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
@@ -13931,6 +14080,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'}
@@ -14013,6 +14166,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==}
 
@@ -14041,6 +14199,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'}
@@ -14057,6 +14219,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'}
@@ -14388,6 +14553,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'}
@@ -14403,6 +14572,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'}
@@ -14484,6 +14656,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==}
 
@@ -14491,10 +14667,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==}
 
@@ -14539,6 +14723,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'}
@@ -14645,6 +14833,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'}
@@ -14752,6 +14944,15 @@ packages:
     resolution: {integrity: sha512-LfOdrUvPB8ZoXtvOBz6DlNClfvi//b5d56mSWyJi7XbH/HfhOHfUhOqxhT/rUiR7yiktlunqRo+jY6y/cWC/5g==}
     engines: {node: '>= 12.0.0'}
 
+  zod-validation-error@3.5.3:
+    resolution: {integrity: sha512-OT5Y8lbUadqVZCsnyFaTQ4/O2mys4tj7PqhdbBCp7McPwvIEKfPtdA6QfPeFQK2/Rz5LgwmAXRJTugBNBi0btw==}
+    engines: {node: '>=18.0.0'}
+    peerDependencies:
+      zod: ^3.25.0 || ^4.0.0
+
+  zod@3.25.58:
+    resolution: {integrity: sha512-DVLmMQzSZwNYzQoMaM3MQWnxr2eq+AtM9Hx3w1/Yl0pH8sLTSjN4jGP7w6f7uand6Hw44tsnSu1hz1AOA6qI2Q==}
+
   zod@3.25.76:
     resolution: {integrity: sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==}
 
@@ -14948,6 +15149,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
@@ -16018,6 +16227,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)':
@@ -16025,6 +16236,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
@@ -16032,12 +16248,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)
@@ -16476,6 +16705,38 @@ snapshots:
 
   '@faker-js/faker@9.9.0': {}
 
+  '@fastify/busboy@2.1.1': {}
+
+  '@figma/code-connect@1.3.7':
+    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: 10.4.5
+      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.3(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
@@ -16598,7 +16859,17 @@ snapshots:
     optionalDependencies:
       typescript: 5.8.3
 
-  '@formatjs/intl@3.1.6(typescript@5.8.3)':
+  '@formatjs/intl@3.0.4(typescript@5.9.3)':
+    dependencies:
+      '@formatjs/ecma402-abstract': 2.3.1
+      '@formatjs/fast-memoize': 2.2.5
+      '@formatjs/icu-messageformat-parser': 2.9.7
+      intl-messageformat: 10.7.10
+      tslib: 2.8.1
+    optionalDependencies:
+      typescript: 5.9.3
+
+  '@formatjs/intl@3.1.6(typescript@5.9.3)':
     dependencies:
       '@formatjs/ecma402-abstract': 2.3.4
       '@formatjs/fast-memoize': 2.2.7
@@ -16606,7 +16877,7 @@ snapshots:
       intl-messageformat: 10.7.16
       tslib: 2.8.1
     optionalDependencies:
-      typescript: 5.8.3
+      typescript: 5.9.3
 
   '@fwouts/vite-tsconfig-paths@4.2.1(typescript@5.8.3)(vite@5.4.20(@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))':
     dependencies:
@@ -16858,14 +17129,14 @@ snapshots:
       '@types/yargs': 17.0.33
       chalk: 4.1.2
 
-  '@joshwooding/vite-plugin-react-docgen-typescript@0.6.1(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))':
+  '@joshwooding/vite-plugin-react-docgen-typescript@0.6.1(typescript@5.9.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))':
     dependencies:
       glob: 10.4.5
       magic-string: 0.30.19
-      react-docgen-typescript: 2.4.0(typescript@5.8.3)
+      react-docgen-typescript: 2.4.0(typescript@5.9.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)
     optionalDependencies:
-      typescript: 5.8.3
+      typescript: 5.9.3
 
   '@jridgewell/gen-mapping@0.3.13':
     dependencies:
@@ -18467,10 +18738,10 @@ snapshots:
       storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@18.16.15)(typescript@5.8.3))(prettier@3.6.2)(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))
       tiny-invariant: 1.3.3
 
-  '@storybook/builder-vite@9.1.6(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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)))(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))':
+  '@storybook/builder-vite@9.1.6(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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)))(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))':
     dependencies:
-      '@storybook/csf-plugin': 9.1.6(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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)))
-      storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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))
+      '@storybook/csf-plugin': 9.1.6(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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)))
+      storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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))
       ts-dedent: 2.2.0
       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)
 
@@ -18479,9 +18750,9 @@ snapshots:
       storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@18.16.15)(typescript@5.8.3))(prettier@3.6.2)(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))
       unplugin: 1.16.1
 
-  '@storybook/csf-plugin@9.1.6(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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)))':
+  '@storybook/csf-plugin@9.1.6(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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)))':
     dependencies:
-      storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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))
+      storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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))
       unplugin: 1.16.1
 
   '@storybook/global@5.0.0': {}
@@ -18497,25 +18768,25 @@ snapshots:
       react-dom: 18.3.1(react@18.3.1)
       storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@18.16.15)(typescript@5.8.3))(prettier@3.6.2)(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))
 
-  '@storybook/react-dom-shim@9.1.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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)))':
+  '@storybook/react-dom-shim@9.1.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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)))':
     dependencies:
       react: 18.3.1
       react-dom: 18.3.1(react@18.3.1)
-      storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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))
+      storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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))
 
-  '@storybook/react-vite@9.1.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(rollup@4.52.4)(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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)))(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))':
+  '@storybook/react-vite@9.1.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(rollup@4.52.4)(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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)))(typescript@5.9.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))':
     dependencies:
-      '@joshwooding/vite-plugin-react-docgen-typescript': 0.6.1(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))
+      '@joshwooding/vite-plugin-react-docgen-typescript': 0.6.1(typescript@5.9.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))
       '@rollup/pluginutils': 5.3.0(rollup@4.52.4)
-      '@storybook/builder-vite': 9.1.6(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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)))(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))
-      '@storybook/react': 9.1.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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)))(typescript@5.8.3)
+      '@storybook/builder-vite': 9.1.6(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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)))(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))
+      '@storybook/react': 9.1.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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)))(typescript@5.9.3)
       find-up: 7.0.0
       magic-string: 0.30.19
       react: 18.3.1
       react-docgen: 8.0.1
       react-dom: 18.3.1(react@18.3.1)
       resolve: 1.22.10
-      storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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))
+      storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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))
       tsconfig-paths: 4.2.0
       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)
     transitivePeerDependencies:
@@ -18523,15 +18794,15 @@ snapshots:
       - supports-color
       - typescript
 
-  '@storybook/react@9.1.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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)))(typescript@5.8.3)':
+  '@storybook/react@9.1.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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)))(typescript@5.9.3)':
     dependencies:
       '@storybook/global': 5.0.0
-      '@storybook/react-dom-shim': 9.1.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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)))
+      '@storybook/react-dom-shim': 9.1.6(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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)))
       react: 18.3.1
       react-dom: 18.3.1(react@18.3.1)
-      storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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))
+      storybook: 9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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))
     optionalDependencies:
-      typescript: 5.8.3
+      typescript: 5.9.3
 
   '@storybook/source-loader@8.6.14(storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@18.16.15)(typescript@5.8.3))(prettier@3.6.2)(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)))':
     dependencies:
@@ -18618,6 +18889,12 @@ snapshots:
 
   '@tootallnate/quickjs-emscripten@0.23.0': {}
 
+  '@ts-morph/common@0.28.1':
+    dependencies:
+      minimatch: 10.0.3
+      path-browserify: 1.0.1
+      tinyglobby: 0.2.15
+
   '@tsconfig/node10@1.0.11': {}
 
   '@tsconfig/node12@1.0.11': {}
@@ -19232,20 +19509,20 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@vitejs/plugin-vue-jsx@3.1.0(vite@5.4.20(@types/node@18.19.129)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0))(vue@3.5.22(typescript@5.8.3))':
+  '@vitejs/plugin-vue-jsx@3.1.0(vite@5.4.20(@types/node@18.19.129)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0))(vue@3.5.22(typescript@5.9.3))':
     dependencies:
       '@babel/core': 7.27.7
       '@babel/plugin-transform-typescript': 7.28.0(@babel/core@7.27.7)
       '@vue/babel-plugin-jsx': 1.5.0(@babel/core@7.27.7)
       vite: 5.4.20(@types/node@18.19.129)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0)
-      vue: 3.5.22(typescript@5.8.3)
+      vue: 3.5.22(typescript@5.9.3)
     transitivePeerDependencies:
       - supports-color
 
-  '@vitejs/plugin-vue@5.2.4(vite@5.4.20(@types/node@18.19.129)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0))(vue@3.5.22(typescript@5.8.3))':
+  '@vitejs/plugin-vue@5.2.4(vite@5.4.20(@types/node@18.19.129)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0))(vue@3.5.22(typescript@5.9.3))':
     dependencies:
       vite: 5.4.20(@types/node@18.19.129)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0)
-      vue: 3.5.22(typescript@5.8.3)
+      vue: 3.5.22(typescript@5.9.3)
 
   '@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))':
     dependencies:
@@ -19320,13 +19597,13 @@ snapshots:
       msw: 2.11.3(@types/node@18.16.15)(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/mocker@3.2.4(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))':
+  '@vitest/mocker@3.2.4(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.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))':
     dependencies:
       '@vitest/spy': 3.2.4
       estree-walker: 3.0.3
       magic-string: 0.30.19
     optionalDependencies:
-      msw: 2.11.3(@types/node@22.18.8)(typescript@5.8.3)
+      msw: 2.11.3(@types/node@22.18.8)(typescript@5.9.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)
 
   '@vitest/pretty-format@3.0.6':
@@ -19486,39 +19763,39 @@ snapshots:
       '@vue/shared': 3.5.22
       csstype: 3.1.3
 
-  '@vue/server-renderer@3.5.22(vue@3.5.22(typescript@5.8.3))':
+  '@vue/server-renderer@3.5.22(vue@3.5.22(typescript@5.9.3))':
     dependencies:
       '@vue/compiler-ssr': 3.5.22
       '@vue/shared': 3.5.22
-      vue: 3.5.22(typescript@5.8.3)
+      vue: 3.5.22(typescript@5.9.3)
 
   '@vue/shared@3.5.22': {}
 
-  '@vueuse/core@10.11.1(vue@3.5.22(typescript@5.8.3))':
+  '@vueuse/core@10.11.1(vue@3.5.22(typescript@5.9.3))':
     dependencies:
       '@types/web-bluetooth': 0.0.20
       '@vueuse/metadata': 10.11.1
-      '@vueuse/shared': 10.11.1(vue@3.5.22(typescript@5.8.3))
-      vue-demi: 0.14.10(vue@3.5.22(typescript@5.8.3))
+      '@vueuse/shared': 10.11.1(vue@3.5.22(typescript@5.9.3))
+      vue-demi: 0.14.10(vue@3.5.22(typescript@5.9.3))
     transitivePeerDependencies:
       - '@vue/composition-api'
       - vue
 
-  '@vueuse/core@11.3.0(vue@3.5.22(typescript@5.8.3))':
+  '@vueuse/core@11.3.0(vue@3.5.22(typescript@5.9.3))':
     dependencies:
       '@types/web-bluetooth': 0.0.20
       '@vueuse/metadata': 11.3.0
-      '@vueuse/shared': 11.3.0(vue@3.5.22(typescript@5.8.3))
-      vue-demi: 0.14.10(vue@3.5.22(typescript@5.8.3))
+      '@vueuse/shared': 11.3.0(vue@3.5.22(typescript@5.9.3))
+      vue-demi: 0.14.10(vue@3.5.22(typescript@5.9.3))
     transitivePeerDependencies:
       - '@vue/composition-api'
       - vue
 
-  '@vueuse/integrations@10.11.1(axios@1.9.0)(focus-trap@7.6.5)(fuse.js@6.6.2)(vue@3.5.22(typescript@5.8.3))':
+  '@vueuse/integrations@10.11.1(axios@1.9.0)(focus-trap@7.6.5)(fuse.js@6.6.2)(vue@3.5.22(typescript@5.9.3))':
     dependencies:
-      '@vueuse/core': 10.11.1(vue@3.5.22(typescript@5.8.3))
-      '@vueuse/shared': 10.11.1(vue@3.5.22(typescript@5.8.3))
-      vue-demi: 0.14.10(vue@3.5.22(typescript@5.8.3))
+      '@vueuse/core': 10.11.1(vue@3.5.22(typescript@5.9.3))
+      '@vueuse/shared': 10.11.1(vue@3.5.22(typescript@5.9.3))
+      vue-demi: 0.14.10(vue@3.5.22(typescript@5.9.3))
     optionalDependencies:
       axios: 1.9.0
       focus-trap: 7.6.5
@@ -19531,16 +19808,16 @@ snapshots:
 
   '@vueuse/metadata@11.3.0': {}
 
-  '@vueuse/shared@10.11.1(vue@3.5.22(typescript@5.8.3))':
+  '@vueuse/shared@10.11.1(vue@3.5.22(typescript@5.9.3))':
     dependencies:
-      vue-demi: 0.14.10(vue@3.5.22(typescript@5.8.3))
+      vue-demi: 0.14.10(vue@3.5.22(typescript@5.9.3))
     transitivePeerDependencies:
       - '@vue/composition-api'
       - vue
 
-  '@vueuse/shared@11.3.0(vue@3.5.22(typescript@5.8.3))':
+  '@vueuse/shared@11.3.0(vue@3.5.22(typescript@5.9.3))':
     dependencies:
-      vue-demi: 0.14.10(vue@3.5.22(typescript@5.8.3))
+      vue-demi: 0.14.10(vue@3.5.22(typescript@5.9.3))
     transitivePeerDependencies:
       - '@vue/composition-api'
       - vue
@@ -19825,6 +20102,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: {}
@@ -20383,6 +20664,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
@@ -20652,6 +20944,8 @@ snapshots:
 
   clean-stack@2.2.0: {}
 
+  cli-boxes@2.2.1: {}
+
   cli-cursor@2.1.0:
     dependencies:
       restore-cursor: 2.0.0
@@ -20660,6 +20954,8 @@ snapshots:
     dependencies:
       restore-cursor: 3.1.0
 
+  cli-spinners@2.9.2: {}
+
   cli-truncate@2.1.0:
     dependencies:
       slice-ansi: 3.0.0
@@ -20697,10 +20993,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:
@@ -20741,6 +21041,8 @@ snapshots:
 
   command-exists-promise@2.0.2: {}
 
+  commander@11.1.0: {}
+
   commander@12.1.0: {}
 
   commander@2.20.3: {}
@@ -20755,6 +21057,8 @@ snapshots:
 
   commondir@1.0.1: {}
 
+  compare-versions@6.1.1: {}
+
   compress-commons@5.0.3:
     dependencies:
       crc-32: 1.2.2
@@ -20889,14 +21193,14 @@ snapshots:
     optionalDependencies:
       typescript: 5.8.3
 
-  cosmiconfig@9.0.0(typescript@5.8.3):
+  cosmiconfig@9.0.0(typescript@5.9.3):
     dependencies:
       env-paths: 2.2.1
       import-fresh: 3.3.1
       js-yaml: 4.1.0
       parse-json: 5.2.0
     optionalDependencies:
-      typescript: 5.8.3
+      typescript: 5.9.3
 
   crc-32@1.2.2: {}
 
@@ -21023,6 +21327,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: {}
@@ -21139,6 +21448,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
@@ -21293,6 +21607,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:
@@ -22314,7 +22632,7 @@ snapshots:
 
   extract-zip@2.0.1:
     dependencies:
-      debug: 4.3.4
+      debug: 4.4.3
       get-stream: 5.2.0
       yauzl: 2.10.0
     optionalDependencies:
@@ -22334,6 +22652,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
@@ -22801,7 +23123,7 @@ snapshots:
     dependencies:
       basic-ftp: 5.0.5
       data-uri-to-buffer: 6.0.2
-      debug: 4.3.4
+      debug: 4.4.3
     transitivePeerDependencies:
       - supports-color
 
@@ -23015,6 +23337,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:
@@ -23181,6 +23508,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: {}
@@ -23610,6 +23941,8 @@ snapshots:
     dependencies:
       is-docker: 3.0.0
 
+  is-interactive@1.0.0: {}
+
   is-map@2.0.3: {}
 
   is-natural-number@4.0.1: {}
@@ -23894,6 +24227,8 @@ snapshots:
 
   js-base64@2.6.4: {}
 
+  js-base64@3.7.8: {}
+
   js-levenshtein@1.1.6: {}
 
   js-tokens@4.0.0: {}
@@ -23941,6 +24276,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:
@@ -24028,6 +24391,8 @@ snapshots:
 
   kind-of@6.0.3: {}
 
+  kleur@3.0.3: {}
+
   kleur@4.1.5: {}
 
   known-css-properties@0.27.0: {}
@@ -25011,6 +25376,33 @@ snapshots:
       - '@types/node'
     optional: true
 
+  msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3):
+    dependencies:
+      '@bundled-es-modules/cookie': 2.0.1
+      '@bundled-es-modules/statuses': 1.0.1
+      '@inquirer/confirm': 5.1.18(@types/node@22.18.8)
+      '@mswjs/interceptors': 0.39.7
+      '@open-draft/deferred-promise': 2.2.0
+      '@types/cookie': 0.6.0
+      '@types/statuses': 2.0.6
+      graphql: 16.11.0
+      headers-polyfill: 4.0.3
+      is-node-process: 1.2.0
+      outvariant: 1.4.3
+      path-to-regexp: 6.3.0
+      picocolors: 1.1.1
+      rettime: 0.7.0
+      strict-event-emitter: 0.5.1
+      tough-cookie: 6.0.0
+      type-fest: 4.41.0
+      until-async: 3.0.2
+      yargs: 17.7.2
+    optionalDependencies:
+      typescript: 5.9.3
+    transitivePeerDependencies:
+      - '@types/node'
+    optional: true
+
   multicast-dns@7.2.5:
     dependencies:
       dns-packet: 5.6.1
@@ -25256,6 +25648,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
@@ -25369,7 +25773,7 @@ snapshots:
     dependencies:
       '@tootallnate/quickjs-emscripten': 0.23.0
       agent-base: 7.1.4
-      debug: 4.3.4
+      debug: 4.4.3
       get-uri: 6.0.5
       http-proxy-agent: 7.0.2
       https-proxy-agent: 7.0.6
@@ -25385,6 +25789,8 @@ snapshots:
 
   package-json-from-dist@1.0.1: {}
 
+  pako@0.2.9: {}
+
   parent-module@1.0.1:
     dependencies:
       callsites: 3.1.0
@@ -25422,6 +25828,8 @@ snapshots:
 
   parseurl@1.3.3: {}
 
+  path-browserify@1.0.1: {}
+
   path-exists@4.0.0: {}
 
   path-exists@5.0.0: {}
@@ -26195,6 +26603,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
@@ -26215,7 +26628,7 @@ snapshots:
   proxy-agent@6.3.0:
     dependencies:
       agent-base: 7.1.4
-      debug: 4.3.4
+      debug: 4.4.3
       http-proxy-agent: 7.0.2
       https-proxy-agent: 7.0.6
       lru-cache: 7.18.3
@@ -26228,7 +26641,7 @@ snapshots:
   proxy-agent@6.3.1:
     dependencies:
       agent-base: 7.1.4
-      debug: 4.3.4
+      debug: 4.4.3
       http-proxy-agent: 7.0.2
       https-proxy-agent: 7.0.6
       lru-cache: 7.18.3
@@ -26354,9 +26767,9 @@ snapshots:
       - bufferutil
       - utf-8-validate
 
-  react-docgen-typescript@2.4.0(typescript@5.8.3):
+  react-docgen-typescript@2.4.0(typescript@5.9.3):
     dependencies:
-      typescript: 5.8.3
+      typescript: 5.9.3
 
   react-docgen@8.0.1:
     dependencies:
@@ -26455,11 +26868,11 @@ snapshots:
       - react-dom
       - react-native
 
-  react-intl@7.1.11(react@18.3.1)(typescript@5.8.3):
+  react-intl@7.1.11(react@18.3.1)(typescript@5.9.3):
     dependencies:
       '@formatjs/ecma402-abstract': 2.3.4
       '@formatjs/icu-messageformat-parser': 2.11.2
-      '@formatjs/intl': 3.1.6(typescript@5.8.3)
+      '@formatjs/intl': 3.1.6(typescript@5.9.3)
       '@types/hoist-non-react-statics': 3.3.7(@types/react@18.2.19)
       '@types/react': 18.2.19
       hoist-non-react-statics: 3.3.2
@@ -26467,7 +26880,7 @@ snapshots:
       react: 18.3.1
       tslib: 2.8.1
     optionalDependencies:
-      typescript: 5.8.3
+      typescript: 5.9.3
 
   react-is@16.13.1: {}
 
@@ -26910,6 +27323,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
@@ -27234,6 +27651,8 @@ snapshots:
       mrmime: 2.0.1
       totalist: 3.0.1
 
+  sisteransi@1.0.5: {}
+
   sitemap@7.1.2:
     dependencies:
       '@types/node': 17.0.45
@@ -27274,7 +27693,7 @@ snapshots:
   socks-proxy-agent@8.0.5:
     dependencies:
       agent-base: 7.1.4
-      debug: 4.3.4
+      debug: 4.4.3
       socks: 2.8.7
     transitivePeerDependencies:
       - supports-color
@@ -27446,13 +27865,13 @@ snapshots:
       - utf-8-validate
       - vite
 
-  storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.8.3))(prettier@3.6.2)(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)):
+  storybook@9.1.6(@testing-library/dom@10.4.1)(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.3))(prettier@3.6.2)(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)):
     dependencies:
       '@storybook/global': 5.0.0
       '@testing-library/jest-dom': 6.6.3
       '@testing-library/user-event': 14.6.1(@testing-library/dom@10.4.1)
       '@vitest/expect': 3.2.4
-      '@vitest/mocker': 3.2.4(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))
+      '@vitest/mocker': 3.2.4(msw@2.11.3(@types/node@22.18.8)(typescript@5.9.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))
       '@vitest/spy': 3.2.4
       better-opn: 3.0.2
       esbuild: 0.25.10
@@ -27660,14 +28079,14 @@ snapshots:
     dependencies:
       stylelint: 15.9.0(typescript@5.8.3)
 
-  stylelint-config-recommended@14.0.1(stylelint@16.6.1(typescript@5.8.3)):
+  stylelint-config-recommended@14.0.1(stylelint@16.6.1(typescript@5.9.3)):
     dependencies:
-      stylelint: 16.6.1(typescript@5.8.3)
+      stylelint: 16.6.1(typescript@5.9.3)
 
-  stylelint-config-standard@36.0.0(stylelint@16.6.1(typescript@5.8.3)):
+  stylelint-config-standard@36.0.0(stylelint@16.6.1(typescript@5.9.3)):
     dependencies:
-      stylelint: 16.6.1(typescript@5.8.3)
-      stylelint-config-recommended: 14.0.1(stylelint@16.6.1(typescript@5.8.3))
+      stylelint: 16.6.1(typescript@5.9.3)
+      stylelint-config-recommended: 14.0.1(stylelint@16.6.1(typescript@5.9.3))
 
   stylelint@15.9.0(typescript@5.8.3):
     dependencies:
@@ -27716,7 +28135,7 @@ snapshots:
       - supports-color
       - typescript
 
-  stylelint@16.6.1(typescript@5.8.3):
+  stylelint@16.6.1(typescript@5.9.3):
     dependencies:
       '@csstools/css-parser-algorithms': 2.7.1(@csstools/css-tokenizer@2.4.1)
       '@csstools/css-tokenizer': 2.4.1
@@ -27725,7 +28144,7 @@ snapshots:
       '@dual-bundle/import-meta-resolve': 4.2.1
       balanced-match: 2.0.0
       colord: 2.9.3
-      cosmiconfig: 9.0.0(typescript@5.8.3)
+      cosmiconfig: 9.0.0(typescript@5.9.3)
       css-functions-list: 3.2.3
       css-tree: 2.3.1
       debug: 4.4.3
@@ -27995,6 +28414,8 @@ snapshots:
 
   timed-out@4.0.1: {}
 
+  tiny-inflate@1.0.3: {}
+
   tiny-invariant@1.3.3: {}
 
   tiny-warning@1.0.3: {}
@@ -28070,6 +28491,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
@@ -28090,6 +28515,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
@@ -28155,6 +28585,8 @@ snapshots:
 
   type-fest@0.18.1: {}
 
+  type-fest@0.20.2: {}
+
   type-fest@0.21.3: {}
 
   type-fest@0.6.0: {}
@@ -28245,6 +28677,8 @@ snapshots:
 
   typescript@5.8.3: {}
 
+  typescript@5.9.3: {}
+
   uc.micro@1.0.6: {}
 
   uglify-js@2.8.29:
@@ -28275,6 +28709,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:
@@ -28286,6 +28724,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: {}
@@ -28583,24 +29026,24 @@ snapshots:
       terser: 5.44.0
       yaml: 2.8.0
 
-  vitepress@1.3.1(@algolia/client-search@5.39.0)(@types/node@18.19.129)(@types/react@18.2.19)(axios@1.9.0)(fuse.js@6.6.2)(less@3.13.1)(postcss@8.4.33)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.93.2)(search-insights@2.17.3)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0)(typescript@5.8.3):
+  vitepress@1.3.1(@algolia/client-search@5.39.0)(@types/node@18.19.129)(@types/react@18.2.19)(axios@1.9.0)(fuse.js@6.6.2)(less@3.13.1)(postcss@8.4.33)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.93.2)(search-insights@2.17.3)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0)(typescript@5.9.3):
     dependencies:
       '@docsearch/css': 3.6.3
       '@docsearch/js': 3.6.3(@algolia/client-search@5.39.0)(@types/react@18.2.19)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(search-insights@2.17.3)
       '@shikijs/core': 1.29.2
       '@shikijs/transformers': 1.29.2
       '@types/markdown-it': 14.1.2
-      '@vitejs/plugin-vue': 5.2.4(vite@5.4.20(@types/node@18.19.129)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0))(vue@3.5.22(typescript@5.8.3))
+      '@vitejs/plugin-vue': 5.2.4(vite@5.4.20(@types/node@18.19.129)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0))(vue@3.5.22(typescript@5.9.3))
       '@vue/devtools-api': 7.7.7
       '@vue/shared': 3.5.22
-      '@vueuse/core': 10.11.1(vue@3.5.22(typescript@5.8.3))
-      '@vueuse/integrations': 10.11.1(axios@1.9.0)(focus-trap@7.6.5)(fuse.js@6.6.2)(vue@3.5.22(typescript@5.8.3))
+      '@vueuse/core': 10.11.1(vue@3.5.22(typescript@5.9.3))
+      '@vueuse/integrations': 10.11.1(axios@1.9.0)(focus-trap@7.6.5)(fuse.js@6.6.2)(vue@3.5.22(typescript@5.9.3))
       focus-trap: 7.6.5
       mark.js: 8.11.1
       minisearch: 7.2.0
       shiki: 1.29.2
       vite: 5.4.20(@types/node@18.19.129)(less@3.13.1)(sass@1.93.2)(sugarss@5.0.1(postcss@8.4.33))(terser@5.44.0)
-      vue: 3.5.22(typescript@5.8.3)
+      vue: 3.5.22(typescript@5.9.3)
     optionalDependencies:
       postcss: 8.4.33
     transitivePeerDependencies:
@@ -28631,7 +29074,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@24.1.3)(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
@@ -28639,7 +29082,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@24.1.3)(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:
@@ -28684,7 +29127,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@24.1.3)(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))
@@ -28712,7 +29155,7 @@ snapshots:
       '@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
+      jsdom: 24.1.3
     transitivePeerDependencies:
       - jiti
       - less
@@ -28729,24 +29172,28 @@ snapshots:
 
   vlq@1.0.1: {}
 
-  vue-demi@0.14.10(vue@3.5.22(typescript@5.8.3)):
+  vue-demi@0.14.10(vue@3.5.22(typescript@5.9.3)):
     dependencies:
-      vue: 3.5.22(typescript@5.8.3)
+      vue: 3.5.22(typescript@5.9.3)
 
-  vue@3.5.22(typescript@5.8.3):
+  vue@3.5.22(typescript@5.9.3):
     dependencies:
       '@vue/compiler-dom': 3.5.22
       '@vue/compiler-sfc': 3.5.22
       '@vue/runtime-dom': 3.5.22
-      '@vue/server-renderer': 3.5.22(vue@3.5.22(typescript@5.8.3))
+      '@vue/server-renderer': 3.5.22(vue@3.5.22(typescript@5.9.3))
       '@vue/shared': 3.5.22
     optionalDependencies:
-      typescript: 5.8.3
+      typescript: 5.9.3
 
   w3c-xmlserializer@4.0.0:
     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
@@ -28768,6 +29215,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:
@@ -28934,15 +29385,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
@@ -29010,6 +29472,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: {}
@@ -29078,6 +29544,8 @@ snapshots:
 
   xml-name-validator@4.0.0: {}
 
+  xml-name-validator@5.0.0: {}
+
   xml2js@0.4.23:
     dependencies:
       sax: 1.4.1
@@ -29192,6 +29660,12 @@ snapshots:
       compress-commons: 5.0.3
       readable-stream: 3.6.2
 
+  zod-validation-error@3.5.3(zod@3.25.58):
+    dependencies:
+      zod: 3.25.58
+
+  zod@3.25.58: {}
+
   zod@3.25.76: {}
 
   zwitch@2.0.4: {}