@mirohq/design-system-icons 0.59.1 → 0.60.1

package/react/folder.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 IconFolder: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconFolderNew: 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='M3 7h18v13h-18v-13Z'
+      />,
+      <path
+        stroke='currentColor'
+        strokeWidth='var(--svg-stroke-width)'
+        d='M3 10v-4c0-1.1046.8954-2 2-2h6.25l2.75 2.7692'
+      />
+    )
+  }
+)
+
+export const IconFolderOld: 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,15 @@ export const IconFolder: IconComponentType = forwardRef(
   }
 )
 
+export const IconFolder: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconFolderNew {...props} size={size} weight={weight} ref={forwardRef} />
+    ) : (
+      <IconFolderOld {...props} size={size} weight={weight} ref={forwardRef} />
+    )
+  }
+)
+
 IconFolder[iconSymbol] = true

package/react/frame-lines-two.tsx

@@ -5,21 +5,43 @@
 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 IconFrameLinesTwo: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconFrameLinesTwoNew: 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='M2 19h20m-20-14h20m-3 17v-20m-14 20v-20M8 10h8M8 14h8'
+      />
+    )
+  }
+)
+
+export const IconFrameLinesTwoOld: 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 +62,25 @@ export const IconFrameLinesTwo: IconComponentType = forwardRef(
   }
 )
 
+export const IconFrameLinesTwo: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconFrameLinesTwoNew
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    ) : (
+      <IconFrameLinesTwoOld
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    )
+  }
+)
+
 IconFrameLinesTwo[iconSymbol] = true

package/react/frame-play.tsx

@@ -5,21 +5,44 @@
 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 IconFramePlay: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconFramePlayNew: 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='m11 9 4 3v1l-4 2-1-.5v-5l1-.5Z' />,
+      <path
+        stroke='currentColor'
+        strokeLinejoin='bevel'
+        strokeWidth='var(--svg-stroke-width)'
+        d='M2 19h20m-20-14h20m-3 17v-20m-14 20v-20'
+      />
+    )
+  }
+)
+
+export const IconFramePlayOld: 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,
@@ -44,4 +67,25 @@ export const IconFramePlay: IconComponentType = forwardRef(
   }
 )
 
+export const IconFramePlay: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconFramePlayNew
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    ) : (
+      <IconFramePlayOld
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    )
+  }
+)
+
 IconFramePlay[iconSymbol] = true

package/react/frame-plus.tsx

@@ -5,21 +5,43 @@
 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 IconFramePlus: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconFramePlusNew: 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='M2 19h20m-20-14h20m-3 17v-20m-14 20v-20M12 8v8m-4-4h8'
+      />
+    )
+  }
+)
+
+export const IconFramePlusOld: 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 +62,25 @@ export const IconFramePlus: IconComponentType = forwardRef(
   }
 )
 
+export const IconFramePlus: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconFramePlusNew
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    ) : (
+      <IconFramePlusOld
+        {...props}
+        size={size}
+        weight={weight}
+        ref={forwardRef}
+      />
+    )
+  }
+)
+
 IconFramePlus[iconSymbol] = true

package/react/frame.tsx

@@ -5,21 +5,43 @@
 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 IconFrame: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconFrameNew: 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='M2 19h20m-20-14h20m-3 17v-20m-14 20v-20'
+      />
+    )
+  }
+)
+
+export const IconFrameOld: 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 +62,15 @@ export const IconFrame: IconComponentType = forwardRef(
   }
 )
 
+export const IconFrame: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconFrameNew {...props} size={size} weight={weight} ref={forwardRef} />
+    ) : (
+      <IconFrameOld {...props} size={size} weight={weight} ref={forwardRef} />
+    )
+  }
+)
+
 IconFrame[iconSymbol] = true

package/react/funnel.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 IconFunnel: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconFunnelNew: 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='M4 4v-1h-1v1h1Zm16 0h1v-1h-1v1Zm-11 11h1v-.2868l-.152-.2432-.848.53Zm0 6h-1l1.3162.9487-.3162-.9487Zm6-2 .3162.9487.6838-.9487h-1Zm0-4-.848-.53-.152.2432v.2868h1Zm4.544-7.2704-.848-.53.848.53Zm-15.544-2.7296h16v-2h-16v2Zm5.848 9.47-4.544-7.2704-1.696 1.06 4.544 7.2704 1.696-1.06Zm.152 6.53v-6h-2v6h2Zm4.6838-2.9487-6 2 .6324 1.8974 6-2-.6324-1.8974Zm-.6838-3.0513v4h2v-4h-2Zm4.696-7.8004-4.544 7.2704 1.696 1.06 4.544-7.2704-1.696-1.06Zm.304-3.1996v2.1396h2v-2.1396h-2Zm-14 2.1396v-2.1396h-2v2.1396h2Zm15.392 2.12a4.0003 4.0003 0 0 0 .608-2.12h-2c0 .3749-.1053.7422-.304 1.06l1.696 1.06Zm-15.088-1.06a2 2 0 0 1-.304-1.06h-2a4 4 0 0 0 .608 2.12l1.696-1.06Z'
+      />
+    )
+  }
+)
+
+export const IconFunnelOld: 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 +59,15 @@ export const IconFunnel: IconComponentType = forwardRef(
   }
 )
 
+export const IconFunnel: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconFunnelNew {...props} size={size} weight={weight} ref={forwardRef} />
+    ) : (
+      <IconFunnelOld {...props} size={size} weight={weight} ref={forwardRef} />
+    )
+  }
+)
+
 IconFunnel[iconSymbol] = true

package/react/gauge.tsx

@@ -5,21 +5,57 @@
 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 IconGauge: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconGaugeNew: 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'
+        strokeLinecap='square'
+        strokeWidth='var(--svg-stroke-width)'
+        d='M6 18.7114c-1.8432-1.6481-3.0034-4.0443-3.0034-6.7114 0-4.9706 4.0294-9 9-9 4.9705 0 9 4.0294 9 9 0 2.8273-1.3037 5.35-3.3427 7'
+      />,
+      <path
+        stroke='currentColor'
+        strokeLinejoin='round'
+        strokeMiterlimit={1.414}
+        strokeWidth='var(--svg-stroke-width)'
+        d='m12 12 3.5 3.5'
+      />,
+      <circle
+        cx={12}
+        cy={12}
+        r={2}
+        fill='currentColor'
+        transform='rotate(90 12 12)'
+      />
+    )
+  }
+)
+
+export const IconGaugeOld: 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 +76,15 @@ export const IconGauge: IconComponentType = forwardRef(
   }
 )
 
+export const IconGauge: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconGaugeNew {...props} size={size} weight={weight} ref={forwardRef} />
+    ) : (
+      <IconGaugeOld {...props} size={size} weight={weight} ref={forwardRef} />
+    )
+  }
+)
+
 IconGauge[iconSymbol] = true

package/react/gavel.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 IconGavel: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconGavelNew: 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='m6.4998 15.4999-.6508.7593.967.1894-.3162-.9487Zm-3.5-3-.9864-.1644.3356.9237.6508-.7593Zm.5-3-.7071-.7071a1 1 0 0 0-.2793.5427l.9864.1644Zm6.5-6.5v-1a1 1 0 0 0-.7071.2929l.707.707Zm3 0 .7071-.7071-.7071-.293v1Zm2.4999 2.5h1l-.2928-.707-.7072.707Zm0 3 .7071.7071a.9997.9997 0 0 0 .2929-.707h-1Zm-6 6 .3163.9487a1.0002 1.0002 0 0 0 .3909-.2416l-.7071-.7071Zm-2.3492.2407-3.5-3-1.3015 1.5186 3.5 3 1.3015-1.5186Zm-3.1644-2.0763.5-3-1.9727-.3288-.5 3 1.9728.3288Zm.2208-2.4573 6.5-6.5-1.4142-1.4142-6.5 6.5 1.4142 1.4142Zm5.7929-6.2071h3v-2h-3v2Zm2.2929-.293 2.4999 2.5001 1.4143-1.4142-2.5-2.5-1.4142 1.4142Zm2.207 1.793v3h2v-3h-2Zm.2929 2.293-6 5.9999 1.4143 1.4142 5.9999-6-1.4142-1.4142Zm-5.609 5.7583-3 1 .6324 1.8974 3-1-.6325-1.8974Zm-5.391-4.3442 5.5 5.5 1.4141-1.4142-5.4998-5.5-1.4143 1.4142Zm4.5-4.5 5.4999 5.5001 1.4143-1.4142-5.4999-5.5001-1.4142 1.4142Zm3.2324 7.7323 9.1924 9.1924 1.4142-1.4143-9.1924-9.1923-1.4142 1.4142Z'
+      />
+    )
+  }
+)
+
+export const IconGavelOld: 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,
@@ -34,4 +54,15 @@ export const IconGavel: IconComponentType = forwardRef(
   }
 )
 
+export const IconGavel: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconGavelNew {...props} size={size} weight={weight} ref={forwardRef} />
+    ) : (
+      <IconGavelOld {...props} size={size} weight={weight} ref={forwardRef} />
+    )
+  }
+)
+
 IconGavel[iconSymbol] = true

package/react/gift.tsx

@@ -5,21 +5,43 @@
 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 IconGift: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconGiftNew: 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='M5 14h-2v-6h18v6h-2m-14 0v7h14v-7m-14 0h14M6 3l1 5h9.5l1.5-5-4 1-2 3-2-3-4-1ZM12 7v14'
+      />
+    )
+  }
+)
+
+export const IconGiftOld: 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 +61,15 @@ export const IconGift: IconComponentType = forwardRef(
   }
 )
 
+export const IconGift: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconGiftNew {...props} size={size} weight={weight} ref={forwardRef} />
+    ) : (
+      <IconGiftOld {...props} size={size} weight={weight} ref={forwardRef} />
+    )
+  }
+)
+
 IconGift[iconSymbol] = true

package/react/globe.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 IconGlobe: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+export const IconGlobeNew: 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='M20 12c0 4.4183-3.5817 8-8 8v2c5.5228 0 10-4.4772 10-10h-2Zm-8 8c-4.4183 0-8-3.5817-8-8h-2c0 5.5228 4.4771 10 10 10v-2Zm-8-8c0-4.4183 3.5817-8 8-8v-2c-5.5229 0-10 4.4771-10 10h2Zm8-8c4.4183 0 8 3.5817 8 8h2c0-5.5229-4.4772-10-10-10v2Zm-3 8c0-3.682 1.7125-6.7893 3.5987-8.199l-1.1974-1.602c-2.4508 1.8317-4.4013 5.5665-4.4013 9.801h2Zm3.5987 8.199c-1.8862-1.4097-3.5987-4.5171-3.5987-8.199h-2c0 4.2345 1.9505 7.9693 4.4013 9.801l1.1974-1.602Zm-1.1974-16.398c1.8862 1.4097 3.5987 4.517 3.5987 8.199h2c0-4.2345-1.9505-7.9693-4.4013-9.801l-1.1974 1.602Zm3.5987 8.199c0 3.708-1.607 6.8021-3.4749 8.1982l1.1973 1.602c2.4691-1.8454 4.2776-5.5918 4.2776-9.8002h-2Zm-12 1h18v-2h-18v2Z'
+      />
+    )
+  }
+)
+
+export const IconGlobeOld: 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 +59,15 @@ export const IconGlobe: IconComponentType = forwardRef(
   }
 )
 
+export const IconGlobe: IconComponentType = forwardRef(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [v1] = useNewDesignLanguage()
+    return v1 ? (
+      <IconGlobeNew {...props} size={size} weight={weight} ref={forwardRef} />
+    ) : (
+      <IconGlobeOld {...props} size={size} weight={weight} ref={forwardRef} />
+    )
+  }
+)
+
 IconGlobe[iconSymbol] = true