#770 stepper rename tokens (#828)

* renames stepper tokens * reasign divider container color * renames stepper combo tokens * renames commbo divider padding tokens * updates stepper css2 * updates number input css & deletes foundation/.../action.css * adds stepperButton backgound and icon color * adds stepper icon size tokens * minor * updates border * fix border token * update css * fix disabled
deven-org · Jan 25, 2024 · 62b0e7b · 62b0e7b
1 parent b96df97
commit 62b0e7b
Show file tree

Hide file tree

Showing 6 changed files with 408 additions and 312 deletions.
diff --git a/packages/figma-design-tokens/input/tokens/$themes.json b/packages/figma-design-tokens/input/tokens/$themes.json
@@ -537,24 +537,24 @@
     "$figmaCollectionId": "VariableCollectionId:5039:8491",
     "$figmaModeId": "5039:0",
     "$figmaVariableReferences": {
-      "Action.StepperButton.SM.Width": "0768fb650bb40bd0731b7b5a02a85b27d4b601a9",
-      "Action.StepperButton.MD.Width": "fe193cb42b71c440788f8797f7f7270dc900517d",
-      "Action.StepperButton.LG.Width": "9b31db935d476a63ac6141ae173a055a4f8217dc",
-      "Action.StepperButton.Container.BorderRadius.SM": "8d6fb9681b5493cb391dbee940bc34d6feaa5051",
-      "Action.StepperButton.Container.BorderRadius.MD": "9c3e1a8db76ee0650aa276d4fefbaaf5888235cf",
-      "Action.StepperButton.Container.BorderRadius.LG": "86a55e3ffd28f0f076ad38b7f34eed9101c6c0b1",
-      "Action.StepperCombo.SM.Vertical.Width": "1eff8a3f8ff985a0f98328fd231ff0bba33582dd",
-      "Action.StepperCombo.SM.Horizontal.Width": "f96fcb329c2b1840f9598868d280b1e504a0885c",
-      "Action.StepperCombo.MD.Vertical.Width": "a25b9460fc82b0501dc3b8b42f036477c5c03f58",
-      "Action.StepperCombo.MD.Horizontal.Width": "8606f84cf303c58d406f7fa46aff0189d455c840",
-      "Action.StepperCombo.LG.Vertical.Width": "b4d63ffae2eb2281e5d37ff54b5a10bd79e56394",
-      "Action.StepperCombo.LG.Horizontal.Width": "52d0c26df0f182e6137819ea16f1f4b700797de3",
-      "Action.Menu.MenuItem.Container.ItemSpacing": "4c15d35abad521d41e908b754dff07ce24c63860",
-      "Action.Menu.MenuItem.ContentStack.ItemSpacing": "333eea56c19cd22631f220ea5c56d59190823be7",
-      "Action.Menu.MenuItem.BorderRadius": "7850e05ef40efcd31fea570969e0286a4d389418",
-      "Action.Menu.SectionStack.ItemSpacing": "8384d5773aa4dcb65f8eddb381ca8d02e7da61fb",
-      "Action.Menu.SectionStack.Padding": "b6531e155c952c1b91cafb545cb54986064154e4",
-      "Action.Menu.BorderRadius": "a1e7e791ee2e93b8e2335c358accd51f3f3d6ae5",
+      "Actions.StepperButton.Container.Width.SM": "0768fb650bb40bd0731b7b5a02a85b27d4b601a9",
+      "Actions.StepperButton.Container.Width.MD": "fe193cb42b71c440788f8797f7f7270dc900517d",
+      "Actions.StepperButton.Container.Width.LG": "9b31db935d476a63ac6141ae173a055a4f8217dc",
+      "Actions.StepperButton.Container.BorderRadius.SM": "8d6fb9681b5493cb391dbee940bc34d6feaa5051",
+      "Actions.StepperButton.Container.BorderRadius.MD": "9c3e1a8db76ee0650aa276d4fefbaaf5888235cf",
+      "Actions.StepperButton.Container.BorderRadius.LG": "86a55e3ffd28f0f076ad38b7f34eed9101c6c0b1",
+      "Actions.StepperCombo.Container.Width.Vertical.SM": "1eff8a3f8ff985a0f98328fd231ff0bba33582dd",
+      "Actions.StepperCombo.Container.Width.Vertical.MD": "a25b9460fc82b0501dc3b8b42f036477c5c03f58",
+      "Actions.StepperCombo.Container.Width.Vertical.LG": "b4d63ffae2eb2281e5d37ff54b5a10bd79e56394",
+      "Actions.StepperCombo.Container.Width.Horizontal.SM": "f96fcb329c2b1840f9598868d280b1e504a0885c",
+      "Actions.StepperCombo.Container.Width.Horizontal.MD": "8606f84cf303c58d406f7fa46aff0189d455c840",
+      "Actions.StepperCombo.Container.Width.Horizontal.LG": "52d0c26df0f182e6137819ea16f1f4b700797de3",
+      "Actions.StepperCombo.DividerWrapper.Padding_V.SM": "1f46a1d8f955d835fa5f80683d0c1706cd47201d",
+      "Actions.StepperCombo.DividerWrapper.Padding_V.MD": "55af1e42e7f9f143bf993733f90b6a3e9ffdf9fd",
+      "Actions.StepperCombo.DividerWrapper.Padding_V.LG": "3837d690f9d2e41e3b4d3d942dff844047c701c8",
+      "Actions.StepperCombo.DividerWrapper.Padding_H.SM": "50ea8cfccbb20b1a8dea6c83394b2d208f7f625f",
+      "Actions.StepperCombo.DividerWrapper.Padding_H.MD": "4a9b14f0b1978078821993fcfbc0e9f7004137de",
+      "Actions.StepperCombo.DividerWrapper.Padding_H.LG": "514da0b26ff23c44f58ac733b14f75244af6e931",
       "Actions.TextButton.Container.PaddingTopBottom.XS": "7b49d86b8b60a319c8297b18be8820f4d272d43d",
       "Actions.TextButton.Container.PaddingTopBottom.SM": "bd581b07ca99f0c83d524e933c1a7c0e21ae0fdd",
       "Actions.TextButton.Container.PaddingTopBottom.MD": "3e5d7399cab81dc62f4c1a3be7c90b8aebae4bbb",
@@ -650,6 +650,12 @@
       "Actions.IconDropdown.Container.BorderRadius.MD": "bf8d742931da6202a7c8fef4e32a5a9b93fff40c",
       "Actions.IconDropdown.Container.BorderRadius.LG": "a23080c8142035e4aa41610013dceff2b787d1dd",
       "Actions.IconDropdown.Container.BorderRadius.XL": "a5aac058109e8e610a5c9c5f6b872ed0e5217286",
+      "Action.Menu.MenuItem.Container.ItemSpacing": "4c15d35abad521d41e908b754dff07ce24c63860",
+      "Action.Menu.MenuItem.ContentStack.ItemSpacing": "333eea56c19cd22631f220ea5c56d59190823be7",
+      "Action.Menu.MenuItem.BorderRadius": "7850e05ef40efcd31fea570969e0286a4d389418",
+      "Action.Menu.SectionStack.ItemSpacing": "8384d5773aa4dcb65f8eddb381ca8d02e7da61fb",
+      "Action.Menu.SectionStack.Padding": "b6531e155c952c1b91cafb545cb54986064154e4",
+      "Action.Menu.BorderRadius": "a1e7e791ee2e93b8e2335c358accd51f3f3d6ae5",
       "Feedback.Loader.Container.Size.SM": "c2b2e482c9243ab3c9390bb5690a7033650ee215",
       "Feedback.Loader.Container.Size.MD": "16ac0162332b87127fb76980315bec8e98a4907c",
       "Feedback.Loader.Container.Size.LG": "41d16e0dedd196093283d8eeaf0a85e4f1ab6cfa",
@@ -1081,6 +1087,9 @@
       "Navigation.TabBar.ButtonWrapper.InnerPadding.SM": "b48c00747c5756df28c3e4e90efae5568e023f5e",
       "Navigation.TabBar.ButtonWrapper.InnerPadding.MD": "2a847be484c780391e72bea86c070dccc30c1926",
       "Navigation.TabBar.ButtonWrapper.InnerPadding.LG": "f8b9aff60ec41648f6e837b71cca0d26f8f8b811",
+      "Actions.StepperButton.Icon.IconSize.SM": "b331f40166d219d7b5477dc340c585b8a25f1ae2",
+      "Actions.StepperButton.Icon.IconSize.MD": "942fe36b2336c31c887cacd14367c0f895e377e0",
+      "Actions.StepperButton.Icon.IconSize.LG": "d30b11ecc42b61b7ea1c5dc62e1a0ad0452ccaad",
       "Action.BorderRadius": "9644fb0b564a7bdd9b72d09b6d1efa4fd593c08b",
       "Forms.InputBorderRadius": "07a575beef9450c94f5d81603c0ba28107f0cf0d",
       "Actions.Container.BorderRadius.XS": "5e36961684d366416c29f0c3ceab97ef34d36700",
@@ -1331,6 +1340,16 @@
       "Navigation.TabBar.Tab.Icon.IconColor.Inactive.Disabled": "2255dfc7d338f82fcc3ecd1331b4c7ebf4f4dba3",
       "Action.Menu.Surface.Color": "915b1ddec5d8b8e8a32bf5afbd9186e16af5ec54",
       "Action.Menu.MenuSection.SectionTitle": "9f8a812cd4e37124e365682d18bd0dd37b5ea311",
+      "Actions.StepperButton.Container.BackgroundColor.Rest": "9bb1d1051e3cbc9ebdc67d0b9360e6f7792e1f57",
+      "Actions.StepperButton.Container.BackgroundColor.Hover": "2bd7bf012512dd075086a92b685487e3b5c979a4",
+      "Actions.StepperButton.Container.BackgroundColor.Pressed": "c780bc99e073523ced9259323cb76fc13be5694a",
+      "Actions.StepperButton.Container.BackgroundColor.Focus": "bc1bfa660e46d6185cdea7463d15ef8460b52821",
+      "Actions.StepperButton.Container.BackgroundColor.Disabled": "c970143a610dede969a5c2030c67860b3ea2359a",
+      "Actions.StepperButton.Icon.IconColor.Rest": "880e6a3bd4c57de9f9adb7b845321c18ba1e4ce2",
+      "Actions.StepperButton.Icon.IconColor.Hover": "f7ded568d3761f6f6211ad671ff96c0e162b1b3c",
+      "Actions.StepperButton.Icon.IconColor.Pressed": "822dc813e1bd298c9198123bcbb5f91cf219c760",
+      "Actions.StepperButton.Icon.IconColor.Focus": "0b6017e8dff35d3b91c7bfd36dc29fe99a10a4e2",
+      "Actions.StepperButton.Icon.IconColor.Disabled": "3099be403a5c426ace1d560feeaaf8934aa3133b",
       "Action.CTA.SurfaceFill.Rest": "e113217d84d5ed192f2c9401e6881a78bd729419",
       "Action.CTA.SurfaceFill.Hover": "558ccf9c09e95bb902075239a9bd050b442c5bad",
       "Action.CTA.SurfaceFill.Pressed": "84fd3776c431823e1eb1fe5ee216df727493dc77",
@@ -2235,24 +2254,24 @@
     "$figmaCollectionId": "VariableCollectionId:5039:8491",
     "$figmaModeId": "5039:1",
     "$figmaVariableReferences": {
-      "Action.StepperButton.SM.Width": "0768fb650bb40bd0731b7b5a02a85b27d4b601a9",
-      "Action.StepperButton.MD.Width": "fe193cb42b71c440788f8797f7f7270dc900517d",
-      "Action.StepperButton.LG.Width": "9b31db935d476a63ac6141ae173a055a4f8217dc",
-      "Action.StepperButton.Container.BorderRadius.SM": "8d6fb9681b5493cb391dbee940bc34d6feaa5051",
-      "Action.StepperButton.Container.BorderRadius.MD": "9c3e1a8db76ee0650aa276d4fefbaaf5888235cf",
-      "Action.StepperButton.Container.BorderRadius.LG": "86a55e3ffd28f0f076ad38b7f34eed9101c6c0b1",
-      "Action.StepperCombo.SM.Vertical.Width": "1eff8a3f8ff985a0f98328fd231ff0bba33582dd",
-      "Action.StepperCombo.SM.Horizontal.Width": "f96fcb329c2b1840f9598868d280b1e504a0885c",
-      "Action.StepperCombo.MD.Vertical.Width": "a25b9460fc82b0501dc3b8b42f036477c5c03f58",
-      "Action.StepperCombo.MD.Horizontal.Width": "8606f84cf303c58d406f7fa46aff0189d455c840",
-      "Action.StepperCombo.LG.Vertical.Width": "b4d63ffae2eb2281e5d37ff54b5a10bd79e56394",
-      "Action.StepperCombo.LG.Horizontal.Width": "52d0c26df0f182e6137819ea16f1f4b700797de3",
-      "Action.Menu.MenuItem.Container.ItemSpacing": "4c15d35abad521d41e908b754dff07ce24c63860",
-      "Action.Menu.MenuItem.ContentStack.ItemSpacing": "333eea56c19cd22631f220ea5c56d59190823be7",
-      "Action.Menu.MenuItem.BorderRadius": "7850e05ef40efcd31fea570969e0286a4d389418",
-      "Action.Menu.SectionStack.ItemSpacing": "8384d5773aa4dcb65f8eddb381ca8d02e7da61fb",
-      "Action.Menu.SectionStack.Padding": "b6531e155c952c1b91cafb545cb54986064154e4",
-      "Action.Menu.BorderRadius": "a1e7e791ee2e93b8e2335c358accd51f3f3d6ae5",
+      "Actions.StepperButton.Container.Width.SM": "0768fb650bb40bd0731b7b5a02a85b27d4b601a9",
+      "Actions.StepperButton.Container.Width.MD": "fe193cb42b71c440788f8797f7f7270dc900517d",
+      "Actions.StepperButton.Container.Width.LG": "9b31db935d476a63ac6141ae173a055a4f8217dc",
+      "Actions.StepperButton.Container.BorderRadius.SM": "8d6fb9681b5493cb391dbee940bc34d6feaa5051",
+      "Actions.StepperButton.Container.BorderRadius.MD": "9c3e1a8db76ee0650aa276d4fefbaaf5888235cf",
+      "Actions.StepperButton.Container.BorderRadius.LG": "86a55e3ffd28f0f076ad38b7f34eed9101c6c0b1",
+      "Actions.StepperCombo.Container.Width.Vertical.SM": "1eff8a3f8ff985a0f98328fd231ff0bba33582dd",
+      "Actions.StepperCombo.Container.Width.Vertical.MD": "a25b9460fc82b0501dc3b8b42f036477c5c03f58",
+      "Actions.StepperCombo.Container.Width.Vertical.LG": "b4d63ffae2eb2281e5d37ff54b5a10bd79e56394",
+      "Actions.StepperCombo.Container.Width.Horizontal.SM": "f96fcb329c2b1840f9598868d280b1e504a0885c",
+      "Actions.StepperCombo.Container.Width.Horizontal.MD": "8606f84cf303c58d406f7fa46aff0189d455c840",
+      "Actions.StepperCombo.Container.Width.Horizontal.LG": "52d0c26df0f182e6137819ea16f1f4b700797de3",
+      "Actions.StepperCombo.DividerWrapper.Padding_V.SM": "1f46a1d8f955d835fa5f80683d0c1706cd47201d",
+      "Actions.StepperCombo.DividerWrapper.Padding_V.MD": "55af1e42e7f9f143bf993733f90b6a3e9ffdf9fd",
+      "Actions.StepperCombo.DividerWrapper.Padding_V.LG": "3837d690f9d2e41e3b4d3d942dff844047c701c8",
+      "Actions.StepperCombo.DividerWrapper.Padding_H.SM": "50ea8cfccbb20b1a8dea6c83394b2d208f7f625f",
+      "Actions.StepperCombo.DividerWrapper.Padding_H.MD": "4a9b14f0b1978078821993fcfbc0e9f7004137de",
+      "Actions.StepperCombo.DividerWrapper.Padding_H.LG": "514da0b26ff23c44f58ac733b14f75244af6e931",
       "Actions.TextButton.Container.PaddingTopBottom.XS": "7b49d86b8b60a319c8297b18be8820f4d272d43d",
       "Actions.TextButton.Container.PaddingTopBottom.SM": "bd581b07ca99f0c83d524e933c1a7c0e21ae0fdd",
       "Actions.TextButton.Container.PaddingTopBottom.MD": "3e5d7399cab81dc62f4c1a3be7c90b8aebae4bbb",
@@ -2348,6 +2367,12 @@
       "Actions.IconDropdown.Container.BorderRadius.MD": "bf8d742931da6202a7c8fef4e32a5a9b93fff40c",
       "Actions.IconDropdown.Container.BorderRadius.LG": "a23080c8142035e4aa41610013dceff2b787d1dd",
       "Actions.IconDropdown.Container.BorderRadius.XL": "a5aac058109e8e610a5c9c5f6b872ed0e5217286",
+      "Action.Menu.MenuItem.Container.ItemSpacing": "4c15d35abad521d41e908b754dff07ce24c63860",
+      "Action.Menu.MenuItem.ContentStack.ItemSpacing": "333eea56c19cd22631f220ea5c56d59190823be7",
+      "Action.Menu.MenuItem.BorderRadius": "7850e05ef40efcd31fea570969e0286a4d389418",
+      "Action.Menu.SectionStack.ItemSpacing": "8384d5773aa4dcb65f8eddb381ca8d02e7da61fb",
+      "Action.Menu.SectionStack.Padding": "b6531e155c952c1b91cafb545cb54986064154e4",
+      "Action.Menu.BorderRadius": "a1e7e791ee2e93b8e2335c358accd51f3f3d6ae5",
       "Feedback.Loader.Container.Size.SM": "c2b2e482c9243ab3c9390bb5690a7033650ee215",
       "Feedback.Loader.Container.Size.MD": "16ac0162332b87127fb76980315bec8e98a4907c",
       "Feedback.Loader.Container.Size.LG": "41d16e0dedd196093283d8eeaf0a85e4f1ab6cfa",
@@ -2367,7 +2392,7 @@
       "Feedback.Counter.Container.PaddingLeftRight.MD": "d7baf44f248a8e792e454cca0eded0b7da6a751d",
       "Feedback.Counter.Container.PaddingLeftRight.LG": "599eb4964b21547696c83da1da0e100ac4a8d18e",
       "Feedback.Counter.Container.BorderRadius.SM": "b92726906c5e430f98a1cad2d3d82dfe0aca0dcc",
-      "Feedback.Counter.Container.BorderRadius.MD": "48e765817d76c8b7edebf4b7358f54917a5c6ed5",
+      "Feedback.Counter.Container.BorderRadius.MD": "a9d2d119686fc566e959b0477eb57faef937f926",
       "Feedback.Counter.Container.BorderRadius.LG": "762a14cf88d137f74c22256eec1c608454c0e883",
       "Feedback.Counter.Container.BorderWidth.SM": "bd162a688380d5634b3f1e1d74e9a2a37ffc656d",
       "Feedback.Counter.Container.BorderWidth.MD": "c536f378d7447a8f1fa6c25706dfeeb055378b00",
@@ -2779,6 +2804,9 @@
       "Navigation.TabBar.ButtonWrapper.InnerPadding.SM": "b48c00747c5756df28c3e4e90efae5568e023f5e",
       "Navigation.TabBar.ButtonWrapper.InnerPadding.MD": "2a847be484c780391e72bea86c070dccc30c1926",
       "Navigation.TabBar.ButtonWrapper.InnerPadding.LG": "f8b9aff60ec41648f6e837b71cca0d26f8f8b811",
+      "Actions.StepperButton.Icon.IconSize.SM": "b331f40166d219d7b5477dc340c585b8a25f1ae2",
+      "Actions.StepperButton.Icon.IconSize.MD": "942fe36b2336c31c887cacd14367c0f895e377e0",
+      "Actions.StepperButton.Icon.IconSize.LG": "d30b11ecc42b61b7ea1c5dc62e1a0ad0452ccaad",
       "Action.BorderRadius": "9644fb0b564a7bdd9b72d09b6d1efa4fd593c08b",
       "Forms.InputBorderRadius": "07a575beef9450c94f5d81603c0ba28107f0cf0d",
       "Actions.Container.BorderRadius.XS": "5e36961684d366416c29f0c3ceab97ef34d36700",
@@ -2998,7 +3026,7 @@
       "Forms.CaptionComponent.Text.TextColor.Error": "8aad8f6ace200ea1d5a5381eb3cbe9d4ae007f31",
       "Forms.CaptionComponent.Icon.IconColor.Hint": "744bc9a56e5ec91960063f0be5bf3bdd33d6d907",
       "Forms.CaptionComponent.Icon.IconColor.Error": "491aab6aebbe70c4bc77d8181f7775a955338dbe",
-      "UI.Divider.Container.BackgroundColor": "39bec8c5a9ba906af5f4c5daf5a348ae3618d4da",
+      "UI.Divider.Container.BackgroundColor": "9562bd237fe0661faef3e3544870a4bf7f4eb7c1",
       "UI.Blanket.Surface": "1758bac1223c81451082018286cba93e78c0cdda",
       "Navigation.TabBar.Tab.HighlightLine.BackgroundColor.Active.Rest": "a9f02fe908bb058bce5087f032dabbee7189ec0b",
       "Navigation.TabBar.Tab.HighlightLine.BackgroundColor.Active.Hover": "66a0d31e617e9857429ae1d3093034423ed68c7d",
@@ -3029,6 +3057,16 @@
       "Navigation.TabBar.Tab.Icon.IconColor.Inactive.Disabled": "2255dfc7d338f82fcc3ecd1331b4c7ebf4f4dba3",
       "Action.Menu.Surface.Color": "915b1ddec5d8b8e8a32bf5afbd9186e16af5ec54",
       "Action.Menu.MenuSection.SectionTitle": "9f8a812cd4e37124e365682d18bd0dd37b5ea311",
+      "Actions.StepperButton.Container.BackgroundColor.Rest": "9bb1d1051e3cbc9ebdc67d0b9360e6f7792e1f57",
+      "Actions.StepperButton.Container.BackgroundColor.Hover": "2bd7bf012512dd075086a92b685487e3b5c979a4",
+      "Actions.StepperButton.Container.BackgroundColor.Pressed": "c780bc99e073523ced9259323cb76fc13be5694a",
+      "Actions.StepperButton.Container.BackgroundColor.Focus": "bc1bfa660e46d6185cdea7463d15ef8460b52821",
+      "Actions.StepperButton.Container.BackgroundColor.Disabled": "c970143a610dede969a5c2030c67860b3ea2359a",
+      "Actions.StepperButton.Icon.IconColor.Rest": "880e6a3bd4c57de9f9adb7b845321c18ba1e4ce2",
+      "Actions.StepperButton.Icon.IconColor.Hover": "f7ded568d3761f6f6211ad671ff96c0e162b1b3c",
+      "Actions.StepperButton.Icon.IconColor.Pressed": "822dc813e1bd298c9198123bcbb5f91cf219c760",
+      "Actions.StepperButton.Icon.IconColor.Focus": "0b6017e8dff35d3b91c7bfd36dc29fe99a10a4e2",
+      "Actions.StepperButton.Icon.IconColor.Disabled": "3099be403a5c426ace1d560feeaaf8934aa3133b",
       "Action.CTA.SurfaceFill.Rest": "e113217d84d5ed192f2c9401e6881a78bd729419",
       "Action.CTA.SurfaceFill.Hover": "558ccf9c09e95bb902075239a9bd050b442c5bad",
       "Action.CTA.SurfaceFill.Pressed": "84fd3776c431823e1eb1fe5ee216df727493dc77",

diff --git a/packages/figma-design-tokens/input/tokens/color/CMP.json b/packages/figma-design-tokens/input/tokens/color/CMP.json
@@ -1187,7 +1187,7 @@
     "Divider": {
       "Container": {
         "BackgroundColor": {
-          "value": "{core.color.coolgray.800.opa30}",
+          "value": "{q.stroke.default}",
           "type": "color",
           "description": "Color of the divider\n>>> UI.Divider.Stroke"
         }
@@ -1416,5 +1416,79 @@
         }
       }
     }
+  },
+  "Actions": {
+    "StepperButton": {
+      "Container": {
+        "BackgroundColor": {
+          "Rest": {
+            "value": "{Action.Silent.SurfaceFill.Rest}",
+            "type": "color"
+          },
+          "Hover": {
+            "value": "{Action.Silent.SurfaceFill.Hover}",
+            "type": "color"
+          },
+          "Pressed": {
+            "value": "{Action.Silent.SurfaceFill.Pressed}",
+            "type": "color"
+          },
+          "Focus": {
+            "value": "{Action.Silent.SurfaceFill.Focus}",
+            "type": "color"
+          },
+          "Disabled": {
+            "value": "{Action.Silent.SurfaceFill.Focus}",
+            "type": "color"
+          }
+        },
+        "BorderColor": {
+          "Rest": {
+            "value": "{Action.Silent.SurfaceStroke.Rest}",
+            "type": "color"
+          },
+          "Hover": {
+            "value": "{Action.Silent.SurfaceStroke.Hover}",
+            "type": "color"
+          },
+          "Pressed": {
+            "value": "{Action.Silent.SurfaceStroke.Pressed}",
+            "type": "color"
+          },
+          "Focus": {
+            "value": "{Action.Silent.SurfaceStroke.Focus}",
+            "type": "color"
+          },
+          "Disabled": {
+            "value": "{Action.Silent.SurfaceStroke.Focus}",
+            "type": "color"
+          }
+        }
+      },
+      "Icon": {
+        "IconColor": {
+          "Rest": {
+            "value": "{Action.Silent.Icon.Rest}",
+            "type": "color"
+          },
+          "Hover": {
+            "value": "{Action.Silent.Icon.Hover}",
+            "type": "color"
+          },
+          "Pressed": {
+            "value": "{Action.Silent.Icon.Pressed}",
+            "type": "color"
+          },
+          "Focus": {
+            "value": "{Action.Silent.Icon.Focus}",
+            "type": "color"
+          },
+          "Disabled": {
+            "value": "{Action.Silent.Icon.Disabled}",
+            "type": "color"
+          }
+        }
+      }
+    }
   }
 }