@sage/design-tokens 15.1.0 → 15.2.1

package/js/common/product/small/dark/components/popover.js

@@ -256,7 +256,7 @@ module.exports = {
         x: {
           S: {
             $type: "spacing",
-            $value: 4.8,
+            $value: 6,
             $description:
               "Left and right padding token used on small popover container consumed inside number input.",
             filePath: "data/tokens/components/popover.json",
@@ -273,7 +273,7 @@ module.exports = {
           },
           M: {
             $type: "spacing",
-            $value: 6.4,
+            $value: 8,
             $description:
               "Left and right padding token used on medium popover container consumed inside number input.",
             filePath: "data/tokens/components/popover.json",
@@ -290,7 +290,7 @@ module.exports = {
           },
           L: {
             $type: "spacing",
-            $value: 9.6,
+            $value: 12,
             $description:
               "Left and right padding token used on large popover container consumed inside number input.",
             filePath: "data/tokens/components/popover.json",
@@ -309,7 +309,7 @@ module.exports = {
         y: {
           S: {
             $type: "spacing",
-            $value: 4.8,
+            $value: 6,
             $description:
               "Top and bottom padding inside S size popover menu container",
             filePath: "data/tokens/components/popover.json",
@@ -326,7 +326,7 @@ module.exports = {
           },
           M: {
             $type: "spacing",
-            $value: 6.4,
+            $value: 8,
             $description:
               "Top and bottom padding inside M size popover menu container",
             filePath: "data/tokens/components/popover.json",
@@ -343,7 +343,7 @@ module.exports = {
           },
           L: {
             $type: "spacing",
-            $value: 9.6,
+            $value: 12,
             $description:
               "Top and bottom padding inside L size popover menu container",
             filePath: "data/tokens/components/popover.json",
@@ -362,7 +362,7 @@ module.exports = {
         yg: {
           S: {
             $type: "spacing",
-            $value: 4.8,
+            $value: 6,
             $description:
               "Gap spacing token used on small popover container consumed inside number input.",
             filePath: "data/tokens/components/popover.json",
@@ -379,7 +379,7 @@ module.exports = {
           },
           M: {
             $type: "spacing",
-            $value: 6.4,
+            $value: 8,
             $description:
               "Gap spacing token used on medium popover container consumed inside number input.",
             filePath: "data/tokens/components/popover.json",
@@ -396,7 +396,7 @@ module.exports = {
           },
           L: {
             $type: "spacing",
-            $value: 9.6,
+            $value: 12,
             $description:
               "Gap spacing token used on large popover container consumed inside number input.",
             filePath: "data/tokens/components/popover.json",
@@ -569,7 +569,7 @@ module.exports = {
         x: {
           S: {
             $type: "spacing",
-            $value: 12.8,
+            $value: 16,
             $description:
               "Right left padding on small screen submenu popover container.",
             filePath: "data/tokens/components/popover.json",
@@ -586,7 +586,7 @@ module.exports = {
           },
           M: {
             $type: "spacing",
-            $value: 12.8,
+            $value: 16,
             $description:
               "Right left padding on small screen submenu popover container.",
             filePath: "data/tokens/components/popover.json",
@@ -603,7 +603,7 @@ module.exports = {
           },
           L: {
             $type: "spacing",
-            $value: 12.8,
+            $value: 16,
             $description:
               "Right left padding on small screen submenu popover container.",
             filePath: "data/tokens/components/popover.json",

package/js/common/product/small/dark/components/profile.js

@@ -330,7 +330,7 @@ module.exports = {
       x: {
         XS: {
           $type: "spacing",
-          $value: 6.4,
+          $value: 8,
           $description: "gap between avatar and name",
           filePath: "data/tokens/components/profile.json",
           isSource: true,
@@ -345,7 +345,7 @@ module.exports = {
         },
         S: {
           $type: "spacing",
-          $value: 9.6,
+          $value: 12,
           $description: "gap between avatar and name",
           filePath: "data/tokens/components/profile.json",
           isSource: true,
@@ -360,7 +360,7 @@ module.exports = {
         },
         M: {
           $type: "spacing",
-          $value: 12.8,
+          $value: 16,
           $description: "gap between avatar and name",
           filePath: "data/tokens/components/profile.json",
           isSource: true,
@@ -375,7 +375,7 @@ module.exports = {
         },
         ML: {
           $type: "spacing",
-          $value: 12.8,
+          $value: 16,
           $description: "gap between avatar and name",
           filePath: "data/tokens/components/profile.json",
           isSource: true,
@@ -390,7 +390,7 @@ module.exports = {
         },
         L: {
           $type: "spacing",
-          $value: 16,
+          $value: 20,
           $description: "gap between avatar and name",
           filePath: "data/tokens/components/profile.json",
           isSource: true,
@@ -405,7 +405,7 @@ module.exports = {
         },
         XL: {
           $type: "spacing",
-          $value: 19.2,
+          $value: 24,
           $description: "gap between avatar and name",
           filePath: "data/tokens/components/profile.json",
           isSource: true,
@@ -420,7 +420,7 @@ module.exports = {
         },
         XXL: {
           $type: "spacing",
-          $value: 25.6,
+          $value: 32,
           $description: "gap between avatar and name",
           filePath: "data/tokens/components/profile.json",
           isSource: true,

package/js/common/product/small/dark/components/progress.js

@@ -1279,7 +1279,7 @@ module.exports = {
         y: {
           M: {
             $type: "spacing",
-            $value: 12.8,
+            $value: 16,
             $description: "Vertical padding on selector group.",
             filePath: "data/tokens/components/progress.json",
             isSource: true,
@@ -1392,7 +1392,7 @@ module.exports = {
           },
           L: {
             $type: "spacing",
-            $value: 12.8,
+            $value: 16,
             $description: "Gap between loader graphic and label.",
             filePath: "data/tokens/components/progress.json",
             isSource: true,
@@ -1628,7 +1628,7 @@ module.exports = {
             },
             XL: {
               $type: "spacing",
-              $value: 12.8,
+              $value: 16,
               $description: "horizontal gap between elements",
               filePath: "data/tokens/components/progress.json",
               isSource: true,
@@ -1683,7 +1683,7 @@ module.exports = {
           xg: {
             M: {
               $type: "spacing",
-              $value: 12.8,
+              $value: 16,
               $description: "Gap between step indicators",
               filePath: "data/tokens/components/progress.json",
               isSource: true,
@@ -1804,7 +1804,7 @@ module.exports = {
             },
             M: {
               $type: "spacing",
-              $value: 12.8,
+              $value: 16,
               $description: "gap between timeline visual and text",
               filePath: "data/tokens/components/progress.json",
               isSource: true,

package/js/common/product/small/dark/components/status.js

@@ -3182,7 +3182,7 @@ module.exports = {
         x: {
           S: {
             $type: "spacing",
-            $value: 6.4,
+            $value: 8,
             filePath: "data/tokens/components/status.json",
             isSource: true,
             original: {
@@ -3195,7 +3195,7 @@ module.exports = {
           },
           M: {
             $type: "spacing",
-            $value: 6.4,
+            $value: 8,
             filePath: "data/tokens/components/status.json",
             isSource: true,
             original: {
@@ -3208,7 +3208,7 @@ module.exports = {
           },
           L: {
             $type: "spacing",
-            $value: 6.4,
+            $value: 8,
             filePath: "data/tokens/components/status.json",
             isSource: true,
             original: {
@@ -3273,7 +3273,7 @@ module.exports = {
             },
             L: {
               $type: "spacing",
-              $value: 16,
+              $value: 20,
               $description: "Left and right paddding on Large Message",
               filePath: "data/tokens/components/status.json",
               isSource: true,
@@ -3305,7 +3305,7 @@ module.exports = {
             },
             L: {
               $type: "spacing",
-              $value: 16,
+              $value: 20,
               $description: "Top and bottom paddding on Large Message",
               filePath: "data/tokens/components/status.json",
               isSource: true,
@@ -3339,7 +3339,7 @@ module.exports = {
             },
             L: {
               $type: "spacing",
-              $value: 12.8,
+              $value: 16,
               $description:
                 "Gap between icon and text in subtle message, and between text and action button in typical message",
               filePath: "data/tokens/components/status.json",
@@ -3450,7 +3450,7 @@ module.exports = {
           x: {
             M: {
               $type: "spacing",
-              $value: 32,
+              $value: 40,
               $description: "Left and right padding on global message",
               filePath: "data/tokens/components/status.json",
               isSource: true,
@@ -3484,7 +3484,7 @@ module.exports = {
           xg: {
             M: {
               $type: "spacing",
-              $value: 12.8,
+              $value: 16,
               $description: "Space between icon wrapper and text wrapper",
               filePath: "data/tokens/components/status.json",
               isSource: true,
@@ -3519,7 +3519,7 @@ module.exports = {
             Y: {
               M: {
                 $type: "spacing",
-                $value: 12.8,
+                $value: 16,
                 $description:
                   "Top and bottom padding on global message for countdown",
                 filePath: "data/tokens/components/status.json",
@@ -3538,7 +3538,7 @@ module.exports = {
             yg: {
               M: {
                 $type: "spacing",
-                $value: 19.2,
+                $value: 24,
                 $description:
                   "Gap between countdown spacing for global message",
                 filePath: "data/tokens/components/status.json",

package/js/common/product/small/dark/components/tab.js

@@ -155,7 +155,7 @@ module.exports = {
       x: {
         M: {
           $type: "spacing",
-          $value: 12.8,
+          $value: 16,
           $description: "Left and right padding on Tab.",
           filePath: "data/tokens/components/tab.json",
           isSource: true,
@@ -170,7 +170,7 @@ module.exports = {
         },
         L: {
           $type: "spacing",
-          $value: 19.2,
+          $value: 24,
           $description: "Left and right padding on Tab.",
           filePath: "data/tokens/components/tab.json",
           isSource: true,

package/js/common/product/small/dark/components/table.js

@@ -623,7 +623,7 @@ module.exports = {
           },
           S: {
             $type: "spacing",
-            $value: 12.8,
+            $value: 16,
             $description: "Left and right padding inside S row cells",
             filePath: "data/tokens/components/table.json",
             isSource: true,
@@ -638,7 +638,7 @@ module.exports = {
           },
           M: {
             $type: "spacing",
-            $value: 12.8,
+            $value: 16,
             $description: "Left and right padding inside M row cells",
             filePath: "data/tokens/components/table.json",
             isSource: true,
@@ -653,7 +653,7 @@ module.exports = {
           },
           L: {
             $type: "spacing",
-            $value: 12.8,
+            $value: 16,
             $description: "Left and right padding inside L row cells",
             filePath: "data/tokens/components/table.json",
             isSource: true,
@@ -668,7 +668,7 @@ module.exports = {
           },
           XL: {
             $type: "spacing",
-            $value: 12.8,
+            $value: 16,
             $description: "Left and right padding inside XL row cells",
             filePath: "data/tokens/components/table.json",
             isSource: true,
@@ -774,7 +774,7 @@ module.exports = {
         x: {
           XS: {
             $type: "spacing",
-            $value: 29.6,
+            $value: 36,
             $description: "Left padding inside XS child row cells",
             filePath: "data/tokens/components/table.json",
             isSource: true,
@@ -789,7 +789,7 @@ module.exports = {
           },
           S: {
             $type: "spacing",
-            $value: 36,
+            $value: 44,
             $description: "Left padding inside S child row cells",
             filePath: "data/tokens/components/table.json",
             isSource: true,
@@ -804,7 +804,7 @@ module.exports = {
           },
           M: {
             $type: "spacing",
-            $value: 36,
+            $value: 44,
             $description: "Left padding inside M child row cells",
             filePath: "data/tokens/components/table.json",
             isSource: true,
@@ -819,7 +819,7 @@ module.exports = {
           },
           L: {
             $type: "spacing",
-            $value: 36,
+            $value: 44,
             $description: "Left padding inside L child row cells",
             filePath: "data/tokens/components/table.json",
             isSource: true,
@@ -834,7 +834,7 @@ module.exports = {
           },
           XL: {
             $type: "spacing",
-            $value: 36,
+            $value: 44,
             $description: "Left padding inside XL child row cells",
             filePath: "data/tokens/components/table.json",
             isSource: true,

package/js/common/product/small/dark/mode.d.ts

@@ -201,6 +201,7 @@ declare const tokens: {
           default: DesignToken;
           defaultAlt: DesignToken;
           defaultAlt2: DesignToken;
+          defaultAlt3: DesignToken;
           hoverAlt: DesignToken;
           hover: DesignToken;
           withActive: DesignToken;

package/js/common/product/small/dark/mode.js

@@ -2548,6 +2548,46 @@ module.exports = {
             path: ["modes", "color", "interactive", "monochrome", "defaultAlt"],
           },
           defaultAlt2: {
+            $extensions: {
+              "studio.tokens": {
+                modify: {
+                  type: "alpha",
+                  value: "0.55",
+                  space: "lch",
+                  format: "hex",
+                },
+              },
+            },
+            $type: "color",
+            $value: "#ffffff8c",
+            $description: "Dropdown option subtext.",
+            filePath: "data/tokens/modes/dark.json",
+            isSource: true,
+            original: {
+              $extensions: {
+                "studio.tokens": {
+                  modify: {
+                    type: "alpha",
+                    value: "0.55",
+                    space: "lch",
+                  },
+                },
+              },
+              $type: "color",
+              $value: "{modes.color.interactive.monochrome.active}",
+              $description: "Dropdown option subtext.",
+            },
+            name: "modesColorInteractiveMonochromeDefaultAlt2",
+            attributes: {},
+            path: [
+              "modes",
+              "color",
+              "interactive",
+              "monochrome",
+              "defaultAlt2",
+            ],
+          },
+          defaultAlt3: {
             $extensions: {
               "studio.tokens": {
                 modify: {
@@ -2577,14 +2617,14 @@ module.exports = {
               $value: "{modes.color.interactive.monochrome.active}",
               $description: "Tertiary border color",
             },
-            name: "modesColorInteractiveMonochromeDefaultAlt2",
+            name: "modesColorInteractiveMonochromeDefaultAlt3",
             attributes: {},
             path: [
               "modes",
               "color",
               "interactive",
               "monochrome",
-              "defaultAlt2",
+              "defaultAlt3",
             ],
           },
           hoverAlt: {