fix(plasma-icons): fix IconRoot API

salute-developers · Dec 29, 2023 · f50598f · f50598f
1 parent bd23b00
commit f50598f
Show file tree

Hide file tree

Showing 1,028 changed files with 1,040 additions and 1,033 deletions.
diff --git a/packages/plasma-icons/src/scalable/Icon.tsx b/packages/plasma-icons/src/scalable/Icon.tsx
@@ -1035,7 +1035,7 @@ interface Props {
 }
 
 export const Icon: React.FC<Props> = ({ icon, size, color, className }) => {
-    return <IconRoot className={className} iconName={icon} size={size || 's'} color={color} />;
+    return <IconRoot className={className} icon={icon} size={size || 's'} color={color} />;
 };
 
 export const iconSectionsSet = {

diff --git a/packages/plasma-icons/src/scalable/IconRoot.tsx b/packages/plasma-icons/src/scalable/IconRoot.tsx
@@ -33,7 +33,7 @@ export interface IconProps {
 
 interface IconRootProps extends IconProps {
     size: IconSize;
-    iconName: IconSetUnionSize;
+    icon: React.FC<IconProps> | IconSetUnionSize;
 }
 
 const StyledRoot = styled.div<{ w: string }>`
@@ -70,16 +70,23 @@ const getIconComponent = (iconName: IconSetUnionSize, size: number) => {
     );
 };
 
-export const IconRoot: React.FC<IconRootProps> = ({ iconName, size, color, className }) => {
+export const IconRoot: React.FC<IconRootProps> = ({ icon: Icon, size, color, className }) => {
     const c = color || primary;
 
     const w = `${sizeMap[size].scale}rem`;
 
-    const IconComponent = getIconComponent(iconName, sizeMap[size].size);
+    if (typeof Icon === 'string') {
+        const IconComponent = getIconComponent(Icon, sizeMap[size].size);
+        return (
+            <StyledRoot w={w} className={className}>
+                {IconComponent && <IconComponent color={c} size={size} />}
+            </StyledRoot>
+        );
+    }
 
     return (
-        <StyledRoot w={w} className={className}>
-            {IconComponent && <IconComponent color={c} size={size} />}
+        <StyledRoot aria-hidden w={w} className={className}>
+            <Icon color={c} size={size} />
         </StyledRoot>
     );
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAccessibility.tsx b/packages/plasma-icons/src/scalable/Icons/IconAccessibility.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAccessibility: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="accessibility" />;
+    return <IconRoot className={className} size={size} color={color} icon="accessibility" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAddFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconAddFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAddFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="addFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="addFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAddOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconAddOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAddOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="addOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="addOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAddSmileFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconAddSmileFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAddSmileFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="addSmileFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="addSmileFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAddSmileOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconAddSmileOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAddSmileOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="addSmileOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="addSmileOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAlarmAddFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconAlarmAddFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAlarmAddFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="alarmAddFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="alarmAddFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAlarmAddOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconAlarmAddOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAlarmAddOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="alarmAddOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="alarmAddOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAlarmCircleFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconAlarmCircleFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAlarmCircleFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="alarmCircleFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="alarmCircleFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAlarmCircleOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconAlarmCircleOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAlarmCircleOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="alarmCircleOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="alarmCircleOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAlarmDoneFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconAlarmDoneFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAlarmDoneFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="alarmDoneFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="alarmDoneFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAlarmDoneOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconAlarmDoneOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAlarmDoneOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="alarmDoneOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="alarmDoneOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAnimalFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconAnimalFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAnimalFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="animalFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="animalFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAnimalOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconAnimalOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAnimalOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="animalOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="animalOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAntennaFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconAntennaFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAntennaFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="antennaFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="antennaFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAntennaOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconAntennaOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAntennaOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="antennaOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="antennaOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAppleFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconAppleFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAppleFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="appleFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="appleFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAppleOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconAppleOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAppleOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="appleOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="appleOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAppsFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconAppsFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAppsFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="appsFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="appsFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAppsOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconAppsOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAppsOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="appsOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="appsOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowBarDown.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowBarDown.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowBarDown: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowBarDown" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowBarDown" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowBarUp.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowBarUp.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowBarUp: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowBarUp" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowBarUp" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowDiagLeftDown.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowDiagLeftDown.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowDiagLeftDown: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowDiagLeftDown" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowDiagLeftDown" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowDiagRightUp.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowDiagRightUp.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowDiagRightUp: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowDiagRightUp" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowDiagRightUp" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowDown.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowDown.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowDown: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowDown" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowDown" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowLeft.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowLeft.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowLeft: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowLeft" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowLeft" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowRight.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowRight.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowRight: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowRight" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowRight" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowUp.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowUp.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowUp: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowUp" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowUp" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowWideDownFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowWideDownFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowWideDownFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowWideDownFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowWideDownFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowWideDownOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowWideDownOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowWideDownOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowWideDownOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowWideDownOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowWideForwardBack.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowWideForwardBack.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowWideForwardBack: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowWideForwardBack" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowWideForwardBack" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowWideLeftFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowWideLeftFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowWideLeftFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowWideLeftFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowWideLeftFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowWideLeftOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowWideLeftOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowWideLeftOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowWideLeftOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowWideLeftOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowWideRightFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowWideRightFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowWideRightFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowWideRightFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowWideRightFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowWideRightOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowWideRightOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowWideRightOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowWideRightOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowWideRightOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowWideTraceR.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowWideTraceR.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowWideTraceR: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowWideTraceR" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowWideTraceR" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowWideUpFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowWideUpFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowWideUpFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowWideUpFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowWideUpFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowWideUpOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowWideUpOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowWideUpOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowWideUpOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowWideUpOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowsMove.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowsMove.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowsMove: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowsMove" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowsMove" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowsMoveHoriz.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowsMoveHoriz.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowsMoveHoriz: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowsMoveHoriz" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowsMoveHoriz" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconArrowsMoveVertical.tsx b/packages/plasma-icons/src/scalable/Icons/IconArrowsMoveVertical.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconArrowsMoveVertical: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="arrowsMoveVertical" />;
+    return <IconRoot className={className} size={size} color={color} icon="arrowsMoveVertical" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAttentionCircleFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconAttentionCircleFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAttentionCircleFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="attentionCircleFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="attentionCircleFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAttentionCircleOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconAttentionCircleOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAttentionCircleOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="attentionCircleOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="attentionCircleOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAttentionTriangleFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconAttentionTriangleFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAttentionTriangleFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="attentionTriangleFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="attentionTriangleFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconAttentionTriangleOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconAttentionTriangleOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconAttentionTriangleOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="attentionTriangleOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="attentionTriangleOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconBackspaceFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconBackspaceFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconBackspaceFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="backspaceFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="backspaceFill" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconBackspaceOutline.tsx b/packages/plasma-icons/src/scalable/Icons/IconBackspaceOutline.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconBackspaceOutline: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="backspaceOutline" />;
+    return <IconRoot className={className} size={size} color={color} icon="backspaceOutline" />;
 };
diff --git a/packages/plasma-icons/src/scalable/Icons/IconBackwardFill.tsx b/packages/plasma-icons/src/scalable/Icons/IconBackwardFill.tsx
@@ -3,5 +3,5 @@ import React from 'react';
 import { IconRoot, IconProps } from '../IconRoot';
 
 export const IconBackwardFill: React.FC<IconProps> = ({ size = 's', color, className }) => {
-    return <IconRoot className={className} size={size} color={color} iconName="backwardFill" />;
+    return <IconRoot className={className} size={size} color={color} icon="backwardFill" />;
 };