Warning state for Icon Item (#DS-1842) (#9)

---------

Co-authored-by: Roman Turov <[email protected]>
Co-authored-by: Nikita Guryev <[email protected]>

Author: 3 people

packages/design-tokens/web/components/icon-item.json5

@@ -3,45 +3,53 @@
         light: {
             theme: {
                 color: { value: '{light.foreground.white}' },
-                background: { value: '{light.icon.theme}' },
+                background: { value: '{light.background.theme}' },
             },
             contrast: {
                 color: { value: '{light.foreground.white}' },
-                background: { value: '{light.icon.contrast}' },
+                background: { value: '{light.background.contrast}' },
             },
             'fade-contrast': {
                 color: { value: '{light.foreground.contrast}' },
                 background: { value: '{light.background.contrast-fade}' },
             },
             error: {
                 color: { value: '{light.foreground.white}' },
-                background: { value: '{light.icon.error}' },
+                background: { value: '{light.background.error}' },
+            },
+            warning: {
+                color: { value: '{light.foreground.white}' },
+                background: { value: '{light.background.warning}' },
             },
             success: {
                 color: { value: '{light.foreground.white}' },
-                background: { value: '{light.icon.success}' },
+                background: { value: '{light.background.success}' },
             }
         },
         dark: {
             theme: {
                 color: { value: '{dark.foreground.white}' },
-                background: { value: '{dark.icon.theme}' },
+                background: { value: '{dark.background.theme}' },
             },
             contrast: {
                 color: { value: '{dark.icon.on-contrast}' },
-                background: { value: '{dark.icon.contrast}' },
+                background: { value: '{dark.background.contrast}' },
             },
             'fade-contrast': {
                 color: { value: '{dark.foreground.contrast}' },
                 background: { value: '{dark.background.contrast-fade}' },
             },
             error: {
                 color: { value: '{dark.foreground.white}' },
-                background: { value: '{dark.icon.error}' },
+                background: { value: '{dark.background.error}' },
+            },
+            warning: {
+                color: { value: '{dark.foreground.white}' },
+                background: { value: '{dark.background.warning}' },
             },
             success: {
                 color: { value: '{dark.foreground.white}' },
-                background: { value: '{dark.icon.success}' },
+                background: { value: '{dark.background.success}' },
             }
         },
         size: {