@mirohq/design-system-icons 0.59.1 → 0.60.0

package/react/user-eye-open.tsx

@@ -5,21 +5,42 @@
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
 import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
+import { useNewDesignLanguage } from '@mirohq/design-system-experiments'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
-export const IconUserEyeOpen: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconUserEyeOpenNew: IconComponentType = forwardRef(
+  (props, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
+      StyledIcon,
+      {
+        ...props,
+        debug,
+        'aria-hidden': true,
+        viewBox: '0 0 24 24',
+        fill: 'none',
+        ref: forwardRef,
+      },
+      <path
+        fill='currentColor'
+        d='M16.5 7.5c0-2.4853-2.0147-4.5-4.5-4.5s-4.5 2.0147-4.5 4.5 2.0147 4.5 4.5 4.5 4.5-2.0147 4.5-4.5Zm-4.5-2.5c1.3807 0 2.5 1.1193 2.5 2.5s-1.1193 2.5-2.5 2.5-2.5-1.1193-2.5-2.5 1.1193-2.5 2.5-2.5ZM10 13.25c-2.7237.7798-4.7977 3.1767-5.0924 6.1232l-.1527 1.5273 1.99.199.1528-1.5273c.191-1.9102 1.4245-3.4737 3.1023-4.1722v.1-2.25ZM22 17.5l.8466.5322v-1.0644l-.8466.5322Zm-11 0-.8466-.5322v1.0644l.8466-.5322Zm5.5-2.5c1.2918 0 2.435.6901 3.3148 1.4899.4304.3913.7711.7851 1.0036 1.081a7.693 7.693 0 0 1 .2598.3499c.0284.0408.049.0716.0617.0907l.0129.0198a.0559.0559 0 0 1 .0018.0029l-.0002-.0004-.0004-.0007-.0003-.0004c-.0002-.0003-.0003-.0005.8463-.5327s.8465-.5325.8463-.5328l-.0005-.0007-.001-.0016-.0026-.0041-.0078-.0121a5.9348 5.9348 0 0 0-.1146-.1703 9.6003 9.6003 0 0 0-.3288-.4431c-.2831-.3603-.6987-.8415-1.2308-1.3252-1.0452-.9502-2.652-2.0101-4.6602-2.0101v2Zm0 7c2.0082 0 3.615-1.0599 4.6602-2.0101.5321-.4837.9477-.9649 1.2308-1.3252a9.6003 9.6003 0 0 0 .3288-.4431 5.9348 5.9348 0 0 0 .1146-.1703l.0078-.0121.0026-.0041.001-.0016.0005-.0007c.0002-.0003.0003-.0006-.8463-.5328s-.8465-.5324-.8463-.5327l.0003-.0004.0004-.0007.0002-.0004a.0559.0559 0 0 1-.0018.0029l-.0129.0198a4.9974 4.9974 0 0 1-.0617.0907 7.693 7.693 0 0 1-.2598.3499c-.2325.2959-.5732.6897-1.0036 1.081-.8798.7998-2.023 1.4899-3.3148 1.4899v2Zm0-9c-2.0082 0-3.615 1.0599-4.6602 2.0101-.5321.4837-.9477.9649-1.2308 1.3252a9.6003 9.6003 0 0 0-.3288.4431 5.9348 5.9348 0 0 0-.1146.1703l-.0078.0121-.0026.0041-.001.0016-.0005.0007c-.0002.0003-.0003.0006.8463.5328s.8465.5324.8463.5327l-.0003.0004-.0004.0007-.0002.0004a.0559.0559 0 0 1 .0018-.0029l.0129-.0198a4.9974 4.9974 0 0 1 .0617-.0907 7.693 7.693 0 0 1 .2598-.3499c.2325-.2959.5732-.6897 1.0036-1.081.8798-.7998 2.023-1.4899 3.3148-1.4899v-2Zm0 7c-1.2918 0-2.435-.6901-3.3148-1.4899-.4304-.3913-.7711-.7851-1.0036-1.081a7.693 7.693 0 0 1-.2598-.3499 4.9974 4.9974 0 0 1-.0617-.0907l-.0129-.0198a.0559.0559 0 0 1-.0018-.0029l.0002.0004.0004.0007.0003.0004c.0002.0003.0003.0005-.8463.5327s-.8465.5325-.8463.5328l.0005.0007.001.0016.0026.0041.0078.0121a5.9348 5.9348 0 0 0 .1146.1703c.0764.1098.1867.2622.3288.4431.2831.3603.6987.8415 1.2308 1.3252 1.0452.9502 2.652 2.0101 4.6602 2.0101v-2Z'
+      />,
+      <circle cx={16.5} cy={17.5} r={1.5} fill='currentColor' />
+    )
+  }
+)
+
+export const IconUserEyeOpenOld: IconComponentType = forwardRef(
+  (props, forwardRef) => {
     const [debug] = useLocalStorage('DEBUG_ICON', false)
     return createElement(
       StyledIcon,
       {
         ...props,
-        weight,
         debug,
         'aria-hidden': true,
-        size,
         viewBox: '0 0 24 24',
         fill: 'none',
         ref: forwardRef,
@@ -41,4 +62,25 @@ export const IconUserEyeOpen: IconComponentType = forwardRef(
   }
 )
 
+export const IconUserEyeOpen: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconUserEyeOpenNew
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    ) : (
+      <IconUserEyeOpenOld
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    )
+  }
+)
+
 IconUserEyeOpen[iconSymbol] = true

package/react/user-filter.tsx

@@ -5,21 +5,47 @@
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
 import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
+import { useNewDesignLanguage } from '@mirohq/design-system-experiments'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
-export const IconUserFilter: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconUserFilterNew: IconComponentType = forwardRef(
+  (props, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
+      StyledIcon,
+      {
+        ...props,
+        debug,
+        'aria-hidden': true,
+        viewBox: '0 0 24 24',
+        fill: 'none',
+        ref: forwardRef,
+      },
+      <path
+        fill='currentColor'
+        d='M16.5 7.5c0-2.4853-2.0147-4.5-4.5-4.5s-4.5 2.0147-4.5 4.5 2.0147 4.5 4.5 4.5 4.5-2.0147 4.5-4.5Zm-4.5-2.5c1.3807 0 2.5 1.1193 2.5 2.5s-1.1193 2.5-2.5 2.5-2.5-1.1193-2.5-2.5 1.1193-2.5 2.5-2.5ZM12 13c-3.636 0-6.7306 2.7552-7.0924 6.3732l-.1527 1.5273 1.99.199.1528-1.5273c.2595-2.5956 2.4938-4.5722 5.1023-4.5722v-2Z'
+      />,
+      <path
+        fill='currentColor'
+        fillRule='evenodd'
+        d='M17.6667 12.9995h-1.3334c0 1.841-1.4924 3.3333-3.3333 3.3333v1.3334c1.8409 0 3.3333 1.4923 3.3333 3.3333h1.3334c0-1.841 1.4924-3.3333 3.3333-3.3333v-1.3334c-1.8409 0-3.3333-1.4923-3.3333-3.3333Z'
+        clipRule='evenodd'
+      />
+    )
+  }
+)
+
+export const IconUserFilterOld: IconComponentType = forwardRef(
+  (props, forwardRef) => {
     const [debug] = useLocalStorage('DEBUG_ICON', false)
     return createElement(
       StyledIcon,
       {
         ...props,
-        weight,
         debug,
         'aria-hidden': true,
-        size,
         viewBox: '0 0 24 24',
         fill: 'none',
         ref: forwardRef,
@@ -39,4 +65,25 @@ export const IconUserFilter: IconComponentType = forwardRef(
   }
 )
 
+export const IconUserFilter: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconUserFilterNew
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    ) : (
+      <IconUserFilterOld
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    )
+  }
+)
+
 IconUserFilter[iconSymbol] = true

package/react/user-load.tsx

@@ -5,21 +5,48 @@
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
 import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
+import { useNewDesignLanguage } from '@mirohq/design-system-experiments'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
-export const IconUserLoad: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconUserLoadNew: IconComponentType = forwardRef(
+  (props, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
+      StyledIcon,
+      {
+        ...props,
+        debug,
+        'aria-hidden': true,
+        viewBox: '0 0 24 24',
+        fill: 'none',
+        ref: forwardRef,
+      },
+      <path
+        stroke='currentColor'
+        strokeWidth='var(--svg-stroke-width)'
+        d='M12 11s.4156-.0185.6154-.0539c1.6395-.2909 2.8846-1.723 2.8846-3.4461 0-1.933-1.567-3.5-3.5-3.5s-3.5 1.567-3.5 3.5c0 .3475.0057.6831.1 1'
+      />,
+      <path
+        stroke='currentColor'
+        strokeLinejoin='bevel'
+        strokeWidth='var(--svg-stroke-width)'
+        d='m18.2 21-.1527-1.5273c-.3107-3.1068-2.925-5.4727-6.0473-5.4727-3.1222 0-5.7365 2.3659-6.0472 5.4727l-.1528 1.5273'
+      />
+    )
+  }
+)
+
+export const IconUserLoadOld: IconComponentType = forwardRef(
+  (props, forwardRef) => {
     const [debug] = useLocalStorage('DEBUG_ICON', false)
     return createElement(
       StyledIcon,
       {
         ...props,
-        weight,
         debug,
         'aria-hidden': true,
-        size,
         viewBox: '0 0 24 24',
         fill: 'none',
         ref: forwardRef,
@@ -39,4 +66,25 @@ export const IconUserLoad: IconComponentType = forwardRef(
   }
 )
 
+export const IconUserLoad: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconUserLoadNew
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    ) : (
+      <IconUserLoadOld
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    )
+  }
+)
+
 IconUserLoad[iconSymbol] = true

package/react/user-number-three.tsx

@@ -5,21 +5,48 @@
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
 import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
+import { useNewDesignLanguage } from '@mirohq/design-system-experiments'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
-export const IconUserNumberThree: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconUserNumberThreeNew: IconComponentType = forwardRef(
+  (props, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
+      StyledIcon,
+      {
+        ...props,
+        debug,
+        'aria-hidden': true,
+        viewBox: '0 0 24 24',
+        fill: 'none',
+        ref: forwardRef,
+      },
+      <path
+        stroke='currentColor'
+        strokeLinejoin='bevel'
+        strokeWidth='var(--svg-stroke-width)'
+        d='m18 21-.1081-1.5139c-.2208-3.0912-2.7929-5.4861-5.8919-5.4861-3.099 0-5.671 2.3949-5.8918 5.486l-.1082 1.514'
+      />,
+      <path
+        stroke='currentColor'
+        strokeWidth='var(--svg-stroke-width)'
+        d='M12.0015 7h-1.0015m1.0015 0c1.1046 0 2-.8954 2-2s-.8962-2-2.0007-2c-1.1046 0-2.0008.8954-2.0008 2m2.0015 2c1.1046 0 2 .8954 2 2s-.8962 2-2.0007 2c-1.1046 0-2.0008-.8954-2.0008-2'
+      />
+    )
+  }
+)
+
+export const IconUserNumberThreeOld: IconComponentType = forwardRef(
+  (props, forwardRef) => {
     const [debug] = useLocalStorage('DEBUG_ICON', false)
     return createElement(
       StyledIcon,
       {
         ...props,
-        weight,
         debug,
         'aria-hidden': true,
-        size,
         viewBox: '0 0 24 24',
         fill: 'none',
         ref: forwardRef,
@@ -40,4 +67,25 @@ export const IconUserNumberThree: IconComponentType = forwardRef(
   }
 )
 
+export const IconUserNumberThree: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconUserNumberThreeNew
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    ) : (
+      <IconUserNumberThreeOld
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    )
+  }
+)
+
 IconUserNumberThree[iconSymbol] = true

package/react/user-pen-dashes-bottom.tsx

@@ -5,21 +5,50 @@
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
 import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
+import { useNewDesignLanguage } from '@mirohq/design-system-experiments'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
-export const IconUserPenDashesBottom: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconUserPenDashesBottomNew: IconComponentType = forwardRef(
+  (props, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
+      StyledIcon,
+      {
+        ...props,
+        debug,
+        'aria-hidden': true,
+        viewBox: '0 0 24 24',
+        fill: 'none',
+        ref: forwardRef,
+      },
+      <path
+        fill='currentColor'
+        d='m10.5 16.5-.7071-.7071-.2357.2357-.0472.33.99.1414Zm-.5 3.5-.99-.1414 1.1314 1.1313-.1414-.9899Zm3.5-.5.1414.9899.33-.0471.2357-.2357-.7071-.7071Zm6.6642-9.8358-.7071.7071.7071-.707Zm-3.5355-.707-6.8358 6.8357 1.4142 1.4142 6.8358-6.8358-1.4142-1.4142Zm-7.1186 7.4014-.5 3.5 1.9798.2828.5-3.5-1.9799-.2828Zm.6313 4.6313 3.5-.5-.2828-1.9798-3.5.5.2828 1.9798Zm4.0657-.7828 6.8358-6.8358-1.4142-1.4142-6.8358 6.8358 1.4142 1.4142Zm6.8358-11.0784-.1716-.1716-1.4142 1.4142.1716.1716 1.4142-1.4142Zm0 4.2426c1.1716-1.1716 1.1716-3.071 0-4.2426l-1.4142 1.4142c.3905.3905.3905 1.0237 0 1.4142l1.4142 1.4142Zm-3-3c.3905-.3905 1.0237-.3905 1.4142 0l1.4142-1.4142c-1.1716-1.1716-3.071-1.1716-4.2426 0l1.4142 1.4142Z'
+      />,
+      <path
+        stroke='currentColor'
+        strokeWidth='var(--svg-stroke-width)'
+        d='m16 11 3 3'
+      />,
+      <path
+        fill='currentColor'
+        d='M13.5 7.5c0-2.4853-2.0147-4.5-4.5-4.5s-4.5 2.0147-4.5 4.5 2.0147 4.5 4.5 4.5 4.5-2.0147 4.5-4.5Zm-4.5-2.5c1.3807 0 2.5 1.1193 2.5 2.5s-1.1193 2.5-2.5 2.5-2.5-1.1193-2.5-2.5 1.1193-2.5 2.5-2.5ZM9 13c-3.636 0-6.7306 2.7552-7.0924 6.3732l-.1527 1.5273 1.99.199.1528-1.5273c.2596-2.5956 2.4938-4.5722 5.1023-4.5722v-2Z'
+      />
+    )
+  }
+)
+
+export const IconUserPenDashesBottomOld: IconComponentType = forwardRef(
+  (props, forwardRef) => {
     const [debug] = useLocalStorage('DEBUG_ICON', false)
     return createElement(
       StyledIcon,
       {
         ...props,
-        weight,
         debug,
         'aria-hidden': true,
-        size,
         viewBox: '0 0 24 24',
         fill: 'none',
         ref: forwardRef,
@@ -46,4 +75,25 @@ export const IconUserPenDashesBottom: IconComponentType = forwardRef(
   }
 )
 
+export const IconUserPenDashesBottom: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconUserPenDashesBottomNew
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    ) : (
+      <IconUserPenDashesBottomOld
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    )
+  }
+)
+
 IconUserPenDashesBottom[iconSymbol] = true

package/react/user-pen-line-bottom.tsx

@@ -5,21 +5,41 @@
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
 import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
+import { useNewDesignLanguage } from '@mirohq/design-system-experiments'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
-export const IconUserPenLineBottom: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconUserPenLineBottomNew: IconComponentType = forwardRef(
+  (props, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
+      StyledIcon,
+      {
+        ...props,
+        debug,
+        'aria-hidden': true,
+        viewBox: '0 0 24 24',
+        fill: 'none',
+        ref: forwardRef,
+      },
+      <path
+        fill='currentColor'
+        d='M9 3c-2.2091 0-4 1.7909-4 4 0 2.2091 1.7909 4 4 4 2.2091 0 4-1.7909 4-4 0-2.2091-1.7909-4-4-4ZM9 13v1l-1 1-1.5 6h-3.5l-1-1 .1694-1.7985c.3404-3.5176 3.2966-6.2015 6.8306-6.2015v1ZM17 9.0428c1.0809-1.0808 2.8763-1.0808 3.9571 0 1.0809 1.0809 1.0809 2.8763 0 3.9572l-.7929.75-3.9142-3.9142.75-.793ZM14.8357 11.25l-4.8357 4.75-1 4 1 1 4-1 4.75-4.8358-3.9143-3.9142Z'
+      />
+    )
+  }
+)
+
+export const IconUserPenLineBottomOld: IconComponentType = forwardRef(
+  (props, forwardRef) => {
     const [debug] = useLocalStorage('DEBUG_ICON', false)
     return createElement(
       StyledIcon,
       {
         ...props,
-        weight,
         debug,
         'aria-hidden': true,
-        size,
         viewBox: '0 0 24 24',
         fill: 'none',
         ref: forwardRef,
@@ -46,4 +66,25 @@ export const IconUserPenLineBottom: IconComponentType = forwardRef(
   }
 )
 
+export const IconUserPenLineBottom: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconUserPenLineBottomNew
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    ) : (
+      <IconUserPenLineBottomOld
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    )
+  }
+)
+
 IconUserPenLineBottom[iconSymbol] = true

package/react/user-tick-down.tsx

@@ -5,21 +5,47 @@
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
 import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
+import { useNewDesignLanguage } from '@mirohq/design-system-experiments'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
-export const IconUserTickDown: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconUserTickDownNew: IconComponentType = forwardRef(
+  (props, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
+      StyledIcon,
+      {
+        ...props,
+        debug,
+        'aria-hidden': true,
+        viewBox: '0 0 24 24',
+        fill: 'none',
+        ref: forwardRef,
+      },
+      <path
+        fill='currentColor'
+        d='M16.5 7.5c0-2.4853-2.0147-4.5-4.5-4.5s-4.5 2.0147-4.5 4.5 2.0147 4.5 4.5 4.5 4.5-2.0147 4.5-4.5Zm-4.5-2.5c1.3807 0 2.5 1.1193 2.5 2.5s-1.1193 2.5-2.5 2.5-2.5-1.1193-2.5-2.5 1.1193-2.5 2.5-2.5ZM12 13c-3.636 0-6.7306 2.7552-7.0924 6.3732l-.1527 1.5273 1.99.199.1528-1.5273c.2595-2.5956 2.4938-4.5722 5.1023-4.5722v-2Z'
+      />,
+      <path
+        stroke='currentColor'
+        strokeLinejoin='bevel'
+        strokeWidth='var(--svg-stroke-width)'
+        d='m13 17 3 3.5 5-6.5'
+      />
+    )
+  }
+)
+
+export const IconUserTickDownOld: IconComponentType = forwardRef(
+  (props, forwardRef) => {
     const [debug] = useLocalStorage('DEBUG_ICON', false)
     return createElement(
       StyledIcon,
       {
         ...props,
-        weight,
         debug,
         'aria-hidden': true,
-        size,
         viewBox: '0 0 24 24',
         fill: 'none',
         ref: forwardRef,
@@ -40,4 +66,25 @@ export const IconUserTickDown: IconComponentType = forwardRef(
   }
 )
 
+export const IconUserTickDown: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconUserTickDownNew
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    ) : (
+      <IconUserTickDownOld
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    )
+  }
+)
+
 IconUserTickDown[iconSymbol] = true

package/react/user.tsx

@@ -5,21 +5,50 @@
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
 import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
+import { useNewDesignLanguage } from '@mirohq/design-system-experiments'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
-export const IconUser: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconUserNew: IconComponentType = forwardRef(
+  (props, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
+      StyledIcon,
+      {
+        ...props,
+        debug,
+        'aria-hidden': true,
+        viewBox: '0 0 24 24',
+        fill: 'none',
+        ref: forwardRef,
+      },
+      <circle
+        cx={12}
+        cy={7.5}
+        r={3.5}
+        stroke='currentColor'
+        strokeWidth='var(--svg-stroke-width)'
+      />,
+      <path
+        stroke='currentColor'
+        strokeLinejoin='bevel'
+        strokeWidth='var(--svg-stroke-width)'
+        d='m18.2 21-.1527-1.5273c-.3107-3.1068-2.925-5.4727-6.0473-5.4727-3.1222 0-5.7365 2.3659-6.0472 5.4727l-.1528 1.5273'
+      />
+    )
+  }
+)
+
+export const IconUserOld: IconComponentType = forwardRef(
+  (props, forwardRef) => {
     const [debug] = useLocalStorage('DEBUG_ICON', false)
     return createElement(
       StyledIcon,
       {
         ...props,
-        weight,
         debug,
         'aria-hidden': true,
-        size,
         viewBox: '0 0 24 24',
         fill: 'none',
         ref: forwardRef,
@@ -39,4 +68,15 @@ export const IconUser: IconComponentType = forwardRef(
   }
 )
 
+export const IconUser: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconUserNew {...props} size={size} weight={weight} ref={forwardRef} />
+    ) : (
+      <IconUserOld {...props} size={size} weight={weight} ref={forwardRef} />
+    )
+  }
+)
+
 IconUser[iconSymbol] = true

package/react/users-three.tsx

@@ -5,21 +5,42 @@
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
 import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
+import { useNewDesignLanguage } from '@mirohq/design-system-experiments'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
-export const IconUsersThree: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconUsersThreeNew: IconComponentType = forwardRef(
+  (props, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
+      StyledIcon,
+      {
+        ...props,
+        debug,
+        'aria-hidden': true,
+        viewBox: '0 0 24 24',
+        fill: 'none',
+        ref: forwardRef,
+      },
+      <path
+        stroke='currentColor'
+        strokeWidth='var(--svg-stroke-width)'
+        d='m16 21-.0535-.474c-.2268-2.0083-1.9255-3.526-3.9465-3.526s-3.7197 1.5177-3.9465 3.526l-.0535.474m6-9c0 1.1046-.8954 2-2 2s-2-.8954-2-2 .8954-2 2-2 2 .8954 2 2ZM3 15l.0535-.474c.2268-2.0083 1.9255-3.526 3.9465-3.526m-2-5c0 1.1046.8954 2 2 2s2-.8954 2-2-.8954-2-2-2-2 .8954-2 2ZM21 15l-.0535-.474c-.2268-2.0083-1.9255-3.526-3.9465-3.526m2-5c0 1.1046-.8954 2-2 2s-2-.8954-2-2 .8954-2 2-2 2 .8954 2 2Z'
+      />
+    )
+  }
+)
+
+export const IconUsersThreeOld: IconComponentType = forwardRef(
+  (props, forwardRef) => {
     const [debug] = useLocalStorage('DEBUG_ICON', false)
     return createElement(
       StyledIcon,
       {
         ...props,
-        weight,
         debug,
         'aria-hidden': true,
-        size,
         viewBox: '0 0 24 24',
         fill: 'none',
         ref: forwardRef,
@@ -40,4 +61,25 @@ export const IconUsersThree: IconComponentType = forwardRef(
   }
 )
 
+export const IconUsersThree: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconUsersThreeNew
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    ) : (
+      <IconUsersThreeOld
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    )
+  }
+)
+
 IconUsersThree[iconSymbol] = true