@mirohq/design-system-icons 0.46.0-red-icons.0 → 0.47.0

package/react/chevron-up.tsx

@@ -4,30 +4,38 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconChevronUp: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='round'
         strokeWidth='var(--svg-stroke-width)'
         d='m6 14.5 6-6 6 6'
       />,
-      <path stroke='red' strokeWidth='var(--svg-stroke-width)' d='M12 10' />
+      <path
+        stroke='currentColor'
+        strokeWidth='var(--svg-stroke-width)'
+        d='M12 10'
+      />
     )
+  }
 )
 
 IconChevronUp[iconSymbol] = true

package/react/circle-corners.tsx

@@ -4,31 +4,35 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconCircleCorners: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='round'
         strokeLinejoin='round'
         strokeWidth='var(--svg-stroke-width)'
         d='M3 7v-4h4m10 0h4v4m0 10v4h-4m-10 0h-4v-4'
       />,
-      <circle cx={12} cy={12} r={4} fill='red' />
+      <circle cx={12} cy={12} r={4} fill='currentColor' />
     )
+  }
 )
 
 IconCircleCorners[iconSymbol] = true

package/react/circle-motion-x.tsx

@@ -4,34 +4,38 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconCircleMotionX: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='round'
         strokeWidth='var(--svg-stroke-width)'
         d='M3.5 6h1.5m3 0h7m0 0c-3.3137 0-6 2.6863-6 6s2.6863 6 6 6 6-2.6863 6-6-2.6863-6-6-6Zm-12.5 4h6.5m-6 4h1m3 0h2m-5 4h10.5'
       />,
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeWidth='var(--svg-stroke-width)'
         d='M9 11.9999v.0001'
       />
     )
+  }
 )
 
 IconCircleMotionX[iconSymbol] = true

package/react/circle-notch.tsx

@@ -4,34 +4,38 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconCircleNotch: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='round'
         strokeWidth='var(--svg-stroke-width)'
         d='M12 20c4.4183 0 8-3.5817 8-8s-3.5817-8-8-8-8 3.5817-8 8'
       />,
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeWidth='var(--svg-stroke-width)'
         d='M12 4v.0001'
       />
     )
+  }
 )
 
 IconCircleNotch[iconSymbol] = true

package/react/circle-slash.tsx

@@ -4,30 +4,34 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconCircleSlash: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='round'
         strokeLinejoin='round'
         strokeWidth='var(--svg-stroke-width)'
         d='m4 20 16-16m-5-.4879c-.9383-.3316-1.9481-.5121-3-.5121-4.9706 0-9 4.0294-9 9 0 1.0519.1805 2.0617.5121 3m16.9758-6c.3316.9383.5121 1.9481.5121 3 0 4.9706-4.0294 9-9 9-1.0519 0-2.0617-.1805-3-.5121'
       />
     )
+  }
 )
 
 IconCircleSlash[iconSymbol] = true

package/react/circle.tsx

@@ -4,28 +4,32 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconCircle: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeWidth='var(--svg-stroke-width)'
         d='M21 12c0 4.9706-4.0294 9-9 9s-9-4.0294-9-9 4.0294-9 9-9 9 4.0294 9 9ZM12 3v.0001'
       />
     )
+  }
 )
 
 IconCircle[iconSymbol] = true

package/react/circles-connected.tsx

@@ -4,35 +4,39 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconCirclesConnected: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='square'
         strokeWidth='var(--svg-stroke-width)'
         d='m15 9 2-2m-8 2-2-2m0 10 2-2m-2-10c0 1.1046-.8954 2-2 2s-2-.8954-2-2 .8954-2 2-2 2 .8954 2 2Zm0 14c0 1.1046-.8954 2-2 2s-2-.8954-2-2 .8954-2 2-2 2 .8954 2 2Zm9-7c0 2.2091-1.7909 4-4 4-2.2091 0-4-1.7909-4-4 0-2.2091 1.7909-4 4-4 2.2091 0 4 1.7909 4 4Zm4-6.5c0 .8284-.6716 1.5-1.5 1.5s-1.5-.6716-1.5-1.5.6716-1.5 1.5-1.5 1.5.6716 1.5 1.5Z'
       />,
-      <circle cx={20} cy={20} r={2} fill='red' />,
+      <circle cx={20} cy={20} r={2} fill='currentColor' />,
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeWidth='var(--svg-stroke-width)'
         d='M12 8v.0001'
       />
     )
+  }
 )
 
 IconCirclesConnected[iconSymbol] = true

package/react/clock-counter-clockwise-simple.tsx

@@ -4,35 +4,39 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconClockCounterClockwiseSimple: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
-      <circle cx={12} cy={12} r={2} fill='red' />,
+      <circle cx={12} cy={12} r={2} fill='currentColor' />,
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='round'
         strokeWidth='var(--svg-stroke-width)'
         d='M4.2579 14.0147c-1.1127-4.276 1.4516-8.6442 5.7274-9.7569 4.2759-1.1126 8.6442 1.4517 9.7569 5.7275 1.1126 4.2759-1.4516 8.6442-5.7275 9.7569a8.0132 8.0132 0 0 1-1.999.2597m-11.0157-8.0019 3 3 3-3'
       />,
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeWidth='var(--svg-stroke-width)'
         d='M12 11.9999v.0001'
       />
     )
+  }
 )
 
 IconClockCounterClockwiseSimple[iconSymbol] = true

package/react/clock-counter-clockwise.tsx

@@ -4,35 +4,39 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconClockCounterClockwise: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
-      <circle cx={12} cy={12} r={2} fill='red' />,
+      <circle cx={12} cy={12} r={2} fill='currentColor' />,
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='round'
         strokeWidth='var(--svg-stroke-width)'
         d='m12 12 3-3m-10.7421 5.0147c-1.1127-4.276 1.4516-8.6442 5.7274-9.7569 4.2759-1.1126 8.6442 1.4517 9.7569 5.7275 1.1126 4.2759-1.4516 8.6442-5.7275 9.7569a8.0132 8.0132 0 0 1-1.999.2597m-11.0157-8.0019 3 3 3-3'
       />,
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeWidth='var(--svg-stroke-width)'
         d='M12 11.9999v.0001'
       />
     )
+  }
 )
 
 IconClockCounterClockwise[iconSymbol] = true

package/react/clock-overtime.tsx

@@ -4,39 +4,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 { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconClockOvertime: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='square'
         strokeMiterlimit={1.414}
         strokeWidth='var(--svg-stroke-width)'
         d='M21 12c0 4.9706-4.0294 9-9 9s-9-4.0294-9-9 4.0294-9 9-9 9 4.0294 9 9Z'
       />,
       <path
-        fill='red'
+        fill='currentColor'
         d='M12 12.0001c.8799.4399 2.9211 1.267 4.1372 1.7999.2493.1093.3617.4012.2288.6387-.8555 1.5283-2.4901 2.5614-4.366 2.5614-2.7614 0-5-2.2386-5-5 0-2.593 1.9737-4.7249 4.5007-4.9754.2748-.0273.4993.2007.4993.4768v4.4986Z'
       />,
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeWidth='var(--svg-stroke-width)'
         d='M10 12v.0001'
       />
     )
+  }
 )
 
 IconClockOvertime[iconSymbol] = true

package/react/clock.tsx

@@ -4,34 +4,38 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconClock: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='round'
         strokeWidth='var(--svg-stroke-width)'
         d='M12 8.4v4.05l2.7 2.25m6.3-2.7c0 4.9706-4.0294 9-9 9s-9-4.0294-9-9 4.0294-9 9-9 9 4.0294 9 9Z'
       />,
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeWidth='var(--svg-stroke-width)'
         d='M12 12v.0001'
       />
     )
+  }
 )
 
 IconClock[iconSymbol] = true

package/react/cloud.tsx

@@ -4,30 +4,34 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconCloud: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='round'
         strokeLinejoin='round'
         strokeWidth='var(--svg-stroke-width)'
         d='M18.5847 16.0847c4.5 0 5-7-.5-7 2.5-4-2.5-6-4-2 .5-5-5-5.5-5-1-3-3.5-5.5 1-3 3-5-2-5.5 5-1 5-3.5 3.5 1 7.5 4 4 1 5 5 3 5 0 1.5 3.5 7 2 4.5-2Z'
       />
     )
+  }
 )
 
 IconCloud[iconSymbol] = true

package/react/cluster.tsx

@@ -4,35 +4,39 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconCluster: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='round'
         strokeWidth='var(--svg-stroke-width)'
         d='M6 7h6m-6 4.0526h3m7 .8948v-8.4474a.5.5 0 0 0-.5-.5h-12a.5.5 0 0 0-.5.5v11a.5.5 0 0 0 .5.5h9.4m3.1-3.0526v2.5526a.5.5 0 0 1-.5.5h-2.6m3.1-3.0526h4.5a.5.5 0 0 1 .5.5v7.0526a.5.5 0 0 1-.5.5h-7.1a.5.5 0 0 1-.5-.5v-4.5'
       />,
-      <rect width={4} height={4} x={6} y={18} fill='red' rx={1} />,
+      <rect width={4} height={4} x={6} y={18} fill='currentColor' rx={1} />,
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeWidth='var(--svg-stroke-width)'
         d='M8 19.9999v.0001'
       />
     )
+  }
 )
 
 IconCluster[iconSymbol] = true

package/react/clustered.tsx

@@ -4,34 +4,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 { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconClustered: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='square'
         strokeWidth='var(--svg-stroke-width)'
         d='M4 8v11c0 .5523.4477 1 1 1h14c.5523 0 1-.4477 1-1v-14c0-.5523-.4477-1-1-1h-1'
       />,
       <path
-        fill='red'
+        fill='currentColor'
         d='M3 2.5a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 .5.5v2a.5.5 0 0 1-.5.5h-11a.5.5 0 0 1-.5-.5v-2ZM7 8c0-.5523.4477-1 1-1h2c.5523 0 1 .4477 1 1v2c0 .5523-.4477 1-1 1h-2c-.5523 0-1-.4477-1-1v-2ZM13 8c0-.5523.4477-1 1-1h2c.5523 0 1 .4477 1 1v2c0 .5523-.4477 1-1 1h-2c-.5523 0-1-.4477-1-1v-2ZM7 14c0-.5523.4477-1 1-1h2c.5523 0 1 .4477 1 1v2c0 .5523-.4477 1-1 1h-2c-.5523 0-1-.4477-1-1v-2Z'
       />,
-      <path stroke='red' strokeWidth='var(--svg-stroke-width)' d='M9 9v.0001' />
+      <path
+        stroke='currentColor'
+        strokeWidth='var(--svg-stroke-width)'
+        d='M9 9v.0001'
+      />
     )
+  }
 )
 
 IconClustered[iconSymbol] = true

package/react/cog.tsx

@@ -4,36 +4,40 @@
  */
 import React, { forwardRef, createElement } from 'react'
 import { iconSymbol } from '@mirohq/design-system-base-icon'
+import { useLocalStorage } from '@mirohq/design-system-use-local-storage'
 
 import { StyledIcon } from '../src/icon'
 import type { IconComponentType } from '../src/icon'
 
 export const IconCog: IconComponentType = forwardRef(
-  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) =>
-    createElement(
+  ({ size = 'medium', weight = 'normal', ...props }, forwardRef) => {
+    const [debug] = useLocalStorage('DEBUG_ICON', false)
+    return createElement(
       StyledIcon,
       {
         ...props,
         weight,
+        debug,
         size,
         viewBox: '0 0 24 24',
-        fill: 'red',
+        fill: 'none',
         ref: forwardRef,
       },
-      <circle cx={12} cy={12} r={2} fill='red' />,
+      <circle cx={12} cy={12} r={2} fill='currentColor' />,
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeLinecap='round'
         strokeLinejoin='round'
         strokeWidth='var(--svg-stroke-width)'
         d='M13.5442 3h-3l-1 3-1.4461.835-3.0981-.634-1.5 2.598 2.098 2.3661.0001 1.6698-2.098 2.366 1.5 2.5981 3.098-.634 1.4461.835 1 3h3l1-3 1.4462-.8349 3.0981.6339 1.5-2.598-2.0981-2.3661v-1.6699l2.0981-2.366-1.5-2.598-3.0981.634-1.4462-.835-1-3Z'
       />,
       <path
-        stroke='red'
+        stroke='currentColor'
         strokeWidth='var(--svg-stroke-width)'
         d='M12 11.9999v.0001'
       />
     )
+  }
 )
 
 IconCog[iconSymbol] = true