@mirohq/design-system-icons 0.46.0 → 0.47.1-style-dictionary.3

package/react/node-connected-dot.tsx

@@ -4,17 +4,20 @@
  */
 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 IconNodeConnectedDot: 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: 'none',
@@ -29,6 +32,7 @@ export const IconNodeConnectedDot: IconComponentType = forwardRef(
       />,
       <circle cx={19} cy={20} r={3} fill='currentColor' />
     )
+  }
 )
 
 IconNodeConnectedDot[iconSymbol] = true

package/react/node-lines-curved.tsx

@@ -4,17 +4,20 @@
  */
 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 IconNodeLinesCurved: 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: 'none',
@@ -28,6 +31,7 @@ export const IconNodeLinesCurved: IconComponentType = forwardRef(
         d='M4 12h8m0 0h8m-8 0c-2-4-4-7-8-7m8 7c2 4 4 7 8 7m-8-7c-2 4-4 7-8 7m8-7c2-4 4-7 8-7'
       />
     )
+  }
 )
 
 IconNodeLinesCurved[iconSymbol] = true

package/react/node-lines-horizontal.tsx

@@ -4,17 +4,20 @@
  */
 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 IconNodeLinesHorizontal: 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: 'none',
@@ -28,6 +31,7 @@ export const IconNodeLinesHorizontal: IconComponentType = forwardRef(
         d='M4 12.0004h8m8 0h-8m0 0v-4.0004c0-2.9999 2-4 5-4h3m-8 8.0004v3.9997c0 3 2 4 5 4h3'
       />
     )
+  }
 )
 
 IconNodeLinesHorizontal[iconSymbol] = true

package/react/node-lines-vertical.tsx

@@ -4,17 +4,20 @@
  */
 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 IconNodeLinesVertical: 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: 'none',
@@ -28,6 +31,7 @@ export const IconNodeLinesVertical: IconComponentType = forwardRef(
         d='M11.9997 4v8m0 8v-8m0 0h4.0004c2.9998 0 4 2 4 5v3m-8.0004-8h-3.9998c-3 0-4 2-4 5v3'
       />
     )
+  }
 )
 
 IconNodeLinesVertical[iconSymbol] = true

package/react/node-plus.tsx

@@ -4,17 +4,20 @@
  */
 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 IconNodePlus: 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: 'none',
@@ -27,6 +30,7 @@ export const IconNodePlus: IconComponentType = forwardRef(
         d='M12 9v6m-3-3h6m-6-7h6c9 0 9 14 0 14h-6c-9 0-9-14 0-14Z'
       />
     )
+  }
 )
 
 IconNodePlus[iconSymbol] = true

package/react/nodes-connected.tsx

@@ -4,17 +4,20 @@
  */
 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 IconNodesConnected: 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: 'none',
@@ -32,6 +35,7 @@ export const IconNodesConnected: IconComponentType = forwardRef(
         d='M5 4c0 1.1046-.8954 2-2 2s-2-.8954-2-2 .8954-2 2-2 2 .8954 2 2ZM23 4c0 1.1046-.8954 2-2 2s-2-.8954-2-2 .8954-2 2-2 2 .8954 2 2ZM23 20c0 1.1046-.8954 2-2 2s-2-.8954-2-2 .8954-2 2-2 2 .8954 2 2ZM5 20c0 1.1046-.8954 2-2 2s-2-.8954-2-2 .8954-2 2-2 2 .8954 2 2Z'
       />
     )
+  }
 )
 
 IconNodesConnected[iconSymbol] = true

package/react/nodes-connections-three.tsx

@@ -4,17 +4,20 @@
  */
 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 IconNodesConnectionsThree: 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: 'none',
@@ -27,6 +30,7 @@ export const IconNodesConnectionsThree: IconComponentType = forwardRef(
         d='M18.5 4h3m-3 8h3m-3 8h3m-7 0c-5 0-8-2-8-6m8-10c-5 0-8 2-8 6m4.25 2c0-1-.75-2-2.25-2h-4c-3 0-3 4 0 4h4c1.5 0 2.25-1 2.25-2Zm0 0h3.75'
       />
     )
+  }
 )
 
 IconNodesConnectionsThree[iconSymbol] = true

package/react/note-magnifying-glass.tsx

@@ -4,17 +4,20 @@
  */
 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 IconNoteMagnifyingGlass: 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: 'none',
@@ -28,6 +31,7 @@ export const IconNoteMagnifyingGlass: IconComponentType = forwardRef(
         d='M9 20h-6v-18h16v8m-12-3h8m-8 4h5m-5 4h2m10 4.6458a3.9846 3.9846 0 0 0 1-2.6458c0-2.2091-1.7909-4-4-4-2.2091 0-4 1.7909-4 4 0 2.2091 1.7909 4 4 4 1.1947 0 2.2671-.5238 3-1.3542Zm0 0 2 1.8542'
       />
     )
+  }
 )
 
 IconNoteMagnifyingGlass[iconSymbol] = true

package/react/notepad.tsx

@@ -4,17 +4,20 @@
  */
 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 IconNotepad: 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: 'none',
@@ -32,6 +35,7 @@ export const IconNotepad: IconComponentType = forwardRef(
         d='M13 13v.0001'
       />
     )
+  }
 )
 
 IconNotepad[iconSymbol] = true

package/react/octagon.tsx

@@ -4,17 +4,20 @@
  */
 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 IconOctagon: 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: 'none',
@@ -28,6 +31,7 @@ export const IconOctagon: IconComponentType = forwardRef(
         d='M16 3h-8l-5 5v8l5 5h8l5-5v-8l-5-5Z'
       />
     )
+  }
 )
 
 IconOctagon[iconSymbol] = true

package/react/office.tsx

@@ -4,17 +4,20 @@
  */
 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 IconOffice: 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: 'none',
@@ -27,6 +30,7 @@ export const IconOffice: IconComponentType = forwardRef(
         d='M5 21v-17.75a.25.25 0 0 1 .25-.25h13.5a.25.25 0 0 1 .25.25v17.75m-14 0h-2m2 0h5m9 0h-5m5 0h2m-11 0v-5.75a.25.25 0 0 1 .25-.25h3.5a.25.25 0 0 1 .25.25v5.75m-4 0h4m-5-14h1m4 0h1m-6 4h1m4 0h1'
       />
     )
+  }
 )
 
 IconOffice[iconSymbol] = true

package/react/org-chart.tsx

@@ -4,17 +4,20 @@
  */
 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 IconOrgChart: 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: 'none',
@@ -28,6 +31,7 @@ export const IconOrgChart: IconComponentType = forwardRef(
         d='M6 12h12m-9-9h6c.5523 0 1 .4477 1 1v4c0 .5523-.4477 1-1 1h-6c-.5523 0-1-.4477-1-1v-4c0-.5523.4477-1 1-1Zm-6 12h6c.5523 0 1 .4477 1 1v4c0 .5523-.4477 1-1 1h-6c-.5523 0-1-.4477-1-1v-4c0-.5523.4477-1 1-1Zm12 0h6c.5523 0 1 .4477 1 1v4c0 .5523-.4477 1-1 1h-6c-.5523 0-1-.4477-1-1v-4c0-.5523.4477-1 1-1Z'
       />
     )
+  }
 )
 
 IconOrgChart[iconSymbol] = true

package/react/paint-bucket.tsx

@@ -4,17 +4,20 @@
  */
 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 IconPaintBucket: 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: 'none',
@@ -32,6 +35,7 @@ export const IconPaintBucket: IconComponentType = forwardRef(
         d='M22 19c0 .8284-.6716 1.5-1.5 1.5s-1.5-.6716-1.5-1.5.6716-3 1.5-3 1.5 2.1716 1.5 3Z'
       />
     )
+  }
 )
 
 IconPaintBucket[iconSymbol] = true

package/react/palette.tsx

@@ -4,17 +4,20 @@
  */
 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 IconPalette: 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: 'none',
@@ -30,6 +33,7 @@ export const IconPalette: IconComponentType = forwardRef(
         d='M13 21c3.5 0 8-4.0294 8-9s-4.0294-9-9-9-9 4.0294-9 9c0 1.2414.5 3.5 1 4s1-2.5 3.5-2.5c.2852 0 1 0 1.5.5s.5 1 .5 1c0 1-.4234 1.8873-.5 2.5-.0484.3875-.0484.6125 0 1 .0484.3875.5 2.5 4 2.5Z'
       />
     )
+  }
 )
 
 IconPalette[iconSymbol] = true

package/react/paper-plane-filled-right.tsx

@@ -4,17 +4,20 @@
  */
 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 IconPaperPlaneFilledRight: 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: 'none',
@@ -32,6 +35,7 @@ export const IconPaperPlaneFilledRight: IconComponentType = forwardRef(
         d='m11.9995 12.0003.001-.0003'
       />
     )
+  }
 )
 
 IconPaperPlaneFilledRight[iconSymbol] = true

package/react/paper-plane-tilt.tsx

@@ -4,17 +4,20 @@
  */
 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 IconPaperPlaneTilt: 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: 'none',
@@ -28,6 +31,7 @@ export const IconPaperPlaneTilt: IconComponentType = forwardRef(
         d='m10 14 11-11m-11 11 4 8 7-19m-11 11-8-4 19-7'
       />
     )
+  }
 )
 
 IconPaperPlaneTilt[iconSymbol] = true

package/react/parallelogram.tsx

@@ -4,17 +4,20 @@
  */
 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 IconParallelogram: 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: 'none',
@@ -26,6 +29,7 @@ export const IconParallelogram: IconComponentType = forwardRef(
         d='M21.6798 4h-15.4846a.25.25 0 0 0-.2425.1894l-3.875 15.5a.25.25 0 0 0 .2425.3106h15.4846a.25.25 0 0 0 .2425-.1894l3.875-15.5a.25.25 0 0 0-.2425-.3106ZM12 4v.0001'
       />
     )
+  }
 )
 
 IconParallelogram[iconSymbol] = true

package/react/pause-circle.tsx

@@ -4,17 +4,20 @@
  */
 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 IconPauseCircle: 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: 'none',
@@ -32,6 +35,7 @@ export const IconPauseCircle: IconComponentType = forwardRef(
         d='M12 3v.0001'
       />
     )
+  }
 )
 
 IconPauseCircle[iconSymbol] = true

package/react/pause.tsx

@@ -4,17 +4,20 @@
  */
 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 IconPause: 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: 'none',
@@ -25,6 +28,7 @@ export const IconPause: IconComponentType = forwardRef(
         d='M7 6.0001c0-1.3437 3-1.3438 3 0v11.9999c0 1.3594-3 1.3594-3 0v-11.9999ZM14 6c0-1.3438 3-1.3438 3 0v11.9999c0 1.3594-3 1.3594-3 0v-11.9999Z'
       />
     )
+  }
 )
 
 IconPause[iconSymbol] = true

package/react/pdf.tsx

@@ -4,17 +4,20 @@
  */
 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 IconPdf: 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: 'none',
@@ -33,6 +36,7 @@ export const IconPdf: IconComponentType = forwardRef(
         d='M13 12.9999v.0001'
       />
     )
+  }
 )
 
 IconPdf[iconSymbol] = true

package/react/pen-tip.tsx

@@ -4,17 +4,20 @@
  */
 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 IconPenTip: 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: 'none',
@@ -33,6 +36,7 @@ export const IconPenTip: IconComponentType = forwardRef(
         d='M12 10v.0001'
       />
     )
+  }
 )
 
 IconPenTip[iconSymbol] = true