@sage/design-tokens 15.1.0 → 15.2.1

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

@@ -109,12 +109,14 @@ module.exports = {
             },
             bgAlt: {
               $type: "color",
-              $value: "#171717",
-              filePath: "data/tokens/components/status.json",
+              $value: "#fff0",
+              $description: "Subtle message bg",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.status.neutral.defaultAlt}",
+                $value: "{status.color.none}",
+                $description: "Subtle message bg",
               },
               name: "statusColorMessageContextualAiBgAlt",
               attributes: {},
@@ -146,7 +148,7 @@ module.exports = {
               $type: "color",
               $value: "#122211",
               $description: "Subtle message bg",
-              filePath: "data/tokens/components/status.json",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
@@ -167,7 +169,7 @@ module.exports = {
             icon: {
               $type: "color",
               $value: "#fffffff2",
-              filePath: "data/tokens/components/status.json",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
@@ -208,13 +210,13 @@ module.exports = {
             },
             bgAlt: {
               $type: "color",
-              $value: "#241212",
+              $value: "#fff0",
               $description: "Subtle message bg",
-              filePath: "data/tokens/components/status.json",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.status.negative.defaultAlt}",
+                $value: "{status.color.none}",
                 $description: "Subtle message bg",
               },
               name: "statusColorMessageContextualErrorBgAlt",
@@ -294,13 +296,13 @@ module.exports = {
             },
             bgAlt: {
               $type: "color",
-              $value: "#111722",
+              $value: "#fff0",
               $description: "Subtle message bg",
-              filePath: "data/tokens/components/status.json",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.status.info.defaultAlt}",
+                $value: "{status.color.none}",
                 $description: "Subtle message bg",
               },
               name: "statusColorMessageContextualInfoBgAlt",
@@ -380,13 +382,13 @@ module.exports = {
             },
             bgAlt: {
               $type: "color",
-              $value: "#0e1a0b",
+              $value: "#fff0",
               $description: "Subtle message bg",
-              filePath: "data/tokens/components/status.json",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.status.positive.defaultAlt}",
+                $value: "{status.color.none}",
                 $description: "Subtle message bg",
               },
               name: "statusColorMessageContextualSuccessBgAlt",
@@ -466,13 +468,13 @@ module.exports = {
             },
             bgAlt: {
               $type: "color",
-              $value: "#251206",
+              $value: "#fff0",
               $description: "Subtle message bg",
-              filePath: "data/tokens/components/status.json",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.status.caution.defaultAlt}",
+                $value: "{status.color.none}",
                 $description: "Subtle message bg",
               },
               name: "statusColorMessageContextualWarningBgAlt",
@@ -621,13 +623,13 @@ module.exports = {
           info: {
             "bg-default": {
               $type: "color",
-              $value: "#111722",
+              $value: "#007ED9",
               $description: "Global message bg",
-              filePath: "data/tokens/components/status.json",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.status.info.defaultAlt}",
+                $value: "{modes.color.status.info.frozenglobal.default}",
                 $description: "Global message bg",
               },
               name: "statusColorMessageGlobalInfoBgDefault",
@@ -643,12 +645,14 @@ module.exports = {
             },
             "bg-hover": {
               $type: "color",
-              $value: "#17253a",
-              filePath: "data/tokens/components/status.json",
+              $value: "#4f90df",
+              $description: "Global message bg",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.status.info.hoverAlt}",
+                $value: "{modes.color.status.info.frozenglobal.hover}",
+                $description: "Global message bg",
               },
               name: "statusColorMessageGlobalInfoBgHover",
               attributes: {},
@@ -663,14 +667,12 @@ module.exports = {
             },
             icon: {
               $type: "color",
-              $value: "#007ED9",
-              $description: "Icon on tinted bgs",
-              filePath: "data/tokens/components/status.json",
+              $value: "#fffffff2",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.status.info.default}",
-                $description: "Icon on tinted bgs",
+                $value: "{modes.color.status.content.withDefaultAlt}",
               },
               name: "statusColorMessageGlobalInfoIcon",
               attributes: {},
@@ -680,13 +682,13 @@ module.exports = {
           warning: {
             "bg-default": {
               $type: "color",
-              $value: "#251206",
+              $value: "#E04500",
               $description: "Global message bg",
-              filePath: "data/tokens/components/status.json",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.status.caution.defaultAlt}",
+                $value: "{modes.color.status.caution.frozenglobal.default}",
                 $description: "Global message bg",
               },
               name: "statusColorMessageGlobalWarningBgDefault",
@@ -702,12 +704,14 @@ module.exports = {
             },
             "bg-hover": {
               $type: "color",
-              $value: "#3e1a0b",
-              filePath: "data/tokens/components/status.json",
+              $value: "#eb6530",
+              $description: "Global message bg",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.status.caution.hoverAlt}",
+                $value: "{modes.color.status.caution.frozenglobal.hover}",
+                $description: "Global message bg",
               },
               name: "statusColorMessageGlobalWarningBgHover",
               attributes: {},
@@ -722,14 +726,12 @@ module.exports = {
             },
             icon: {
               $type: "color",
-              $value: "#E04500",
-              $description: "Icon on tinted bgs",
-              filePath: "data/tokens/components/status.json",
+              $value: "#fffffff2",
+              filePath: "data/tokens/context/frozenproduct.json",
               isSource: true,
               original: {
                 $type: "color",
-                $value: "{modes.color.status.caution.default}",
-                $description: "Icon on tinted bgs",
+                $value: "{modes.color.status.content.withDefaultAlt}",
               },
               name: "statusColorMessageGlobalWarningIcon",
               attributes: {},
@@ -1678,13 +1680,13 @@ module.exports = {
           },
           "bgAlt-default": {
             $type: "color",
-            $value: "#241212",
+            $value: "#fff0",
             $description: "outline pill bg",
-            filePath: "data/tokens/components/status.json",
+            filePath: "data/tokens/context/frozenproduct.json",
             isSource: true,
             original: {
               $type: "color",
-              $value: "{modes.color.status.negative.defaultAlt}",
+              $value: "{status.color.none}",
               $description: "outline pill bg",
             },
             name: "statusColorPillErrorBgAltDefault",
@@ -2153,13 +2155,13 @@ module.exports = {
           },
           "bgAlt-default": {
             $type: "color",
-            $value: "#111722",
+            $value: "#fff0",
             $description: "outline pill bg",
-            filePath: "data/tokens/components/status.json",
+            filePath: "data/tokens/context/frozenproduct.json",
             isSource: true,
             original: {
               $type: "color",
-              $value: "{modes.color.status.info.defaultAlt}",
+              $value: "{status.color.none}",
               $description: "outline pill bg",
             },
             name: "statusColorPillInfoBgAltDefault",
@@ -2306,12 +2308,12 @@ module.exports = {
         neutral: {
           "bg-default": {
             $type: "color",
-            $value: "#7C7C7C",
-            filePath: "data/tokens/components/status.json",
+            $value: "#9e9e9e",
+            filePath: "data/tokens/context/frozenproduct.json",
             isSource: true,
             original: {
               $type: "color",
-              $value: "{modes.color.status.neutral.default}",
+              $value: "{modes.color.status.neutral.frozen.default}",
             },
             name: "statusColorPillNeutralBgDefault",
             attributes: {},
@@ -2319,13 +2321,13 @@ module.exports = {
           },
           "bgAlt-default": {
             $type: "color",
-            $value: "#171717",
+            $value: "#fff0",
             $description: "outline pill bg",
-            filePath: "data/tokens/components/status.json",
+            filePath: "data/tokens/context/frozenproduct.json",
             isSource: true,
             original: {
               $type: "color",
-              $value: "{modes.color.status.neutral.defaultAlt}",
+              $value: "{status.color.none}",
               $description: "outline pill bg",
             },
             name: "statusColorPillNeutralBgAltDefault",
@@ -2334,12 +2336,12 @@ module.exports = {
           },
           "bgAlt-hover": {
             $type: "color",
-            $value: "#242424",
-            filePath: "data/tokens/components/status.json",
+            $value: "#2a2a2a",
+            filePath: "data/tokens/context/frozenproduct.json",
             isSource: true,
             original: {
               $type: "color",
-              $value: "{modes.color.status.neutral.hoverAlt}",
+              $value: "{modes.color.status.neutral.frozen.hoverAlt}",
             },
             name: "statusColorPillNeutralBgAltHover",
             attributes: {},
@@ -2348,11 +2350,11 @@ module.exports = {
           "bg-hover": {
             $type: "color",
             $value: "#8e8e8e",
-            filePath: "data/tokens/components/status.json",
+            filePath: "data/tokens/context/frozenproduct.json",
             isSource: true,
             original: {
               $type: "color",
-              $value: "{modes.color.status.neutral.hover}",
+              $value: "{modes.color.status.neutral.frozen.hover}",
             },
             name: "statusColorPillNeutralBgHover",
             attributes: {},
@@ -2360,12 +2362,12 @@ module.exports = {
           },
           "border-default": {
             $type: "color",
-            $value: "#7C7C7C",
-            filePath: "data/tokens/components/status.json",
+            $value: "#9e9e9e",
+            filePath: "data/tokens/context/frozenproduct.json",
             isSource: true,
             original: {
               $type: "color",
-              $value: "{modes.color.status.neutral.default}",
+              $value: "{modes.color.status.neutral.frozen.default}",
             },
             name: "statusColorPillNeutralBorderDefault",
             attributes: {},
@@ -2545,13 +2547,13 @@ module.exports = {
           },
           "bgAlt-default": {
             $type: "color",
-            $value: "#0e1a0b",
+            $value: "#fff0",
             $description: "outline pill bg",
-            filePath: "data/tokens/components/status.json",
+            filePath: "data/tokens/context/frozenproduct.json",
             isSource: true,
             original: {
               $type: "color",
-              $value: "{modes.color.status.positive.defaultAlt}",
+              $value: "{status.color.none}",
               $description: "outline pill bg",
             },
             name: "statusColorPillSuccessBgAltDefault",
@@ -2718,13 +2720,13 @@ module.exports = {
           },
           "bgAlt-default": {
             $type: "color",
-            $value: "#251206",
+            $value: "#fff0",
             $description: "Global message bg",
-            filePath: "data/tokens/components/status.json",
+            filePath: "data/tokens/context/frozenproduct.json",
             isSource: true,
             original: {
               $type: "color",
-              $value: "{modes.color.status.caution.defaultAlt}",
+              $value: "{status.color.none}",
               $description: "Global message bg",
             },
             name: "statusColorPillWarningBgAltDefault",
@@ -2880,11 +2882,11 @@ module.exports = {
         "bg-default": {
           $type: "color",
           $value: "#00D639",
-          filePath: "data/tokens/components/status.json",
+          filePath: "data/tokens/context/frozenproduct.json",
           isSource: true,
           original: {
             $type: "color",
-            $value: "{modes.color.status.reviews.default}",
+            $value: "{modes.color.status.reviews.frozen.default}",
           },
           name: "statusColorRatingBgDefault",
           attributes: {},
@@ -2894,11 +2896,11 @@ module.exports = {
           $type: "color",
           $value:
             "linear-gradient(90deg, #00D639 0%, #00D639 50%, #282828 50%, #282828  100%)",
-          filePath: "data/tokens/components/status.json",
+          filePath: "data/tokens/context/frozenproduct.json",
           isSource: true,
           original: {
             $type: "color",
-            $value: "{modes.color.status.reviews.defaultAlt}",
+            $value: "{modes.color.status.reviews.frozen.defaultAlt}",
           },
           name: "statusColorRatingBgDefaultAlt",
           attributes: {},
@@ -2907,11 +2909,11 @@ module.exports = {
         "bg-hover": {
           $type: "color",
           $value: "#17b333",
-          filePath: "data/tokens/components/status.json",
+          filePath: "data/tokens/context/frozenproduct.json",
           isSource: true,
           original: {
             $type: "color",
-            $value: "{modes.color.status.reviews.hover}",
+            $value: "{modes.color.status.reviews.frozen.hover}",
           },
           name: "statusColorRatingBgHover",
           attributes: {},
@@ -2920,11 +2922,11 @@ module.exports = {
         "border-default": {
           $type: "color",
           $value: "#00D639",
-          filePath: "data/tokens/components/status.json",
+          filePath: "data/tokens/context/frozenproduct.json",
           isSource: true,
           original: {
             $type: "color",
-            $value: "{modes.color.status.reviews.default}",
+            $value: "{modes.color.status.reviews.frozen.default}",
           },
           name: "statusColorRatingBorderDefault",
           attributes: {},
@@ -3099,13 +3101,13 @@ module.exports = {
       },
       pill: {
         $type: "borderRadius",
-        $value: 6,
+        $value: 2,
         $description: "Pill (outer corners)",
-        filePath: "data/tokens/components/status.json",
+        filePath: "data/tokens/context/frozenproduct.json",
         isSource: true,
         original: {
           $type: "borderRadius",
-          $value: "{global.radius.container.SM}",
+          $value: "{global.radius.container.XS}",
           $description: "Pill (outer corners)",
         },
         name: "statusRadiusPill",

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

@@ -253,11 +253,11 @@ module.exports = {
       "bg-active": {
         $type: "color",
         $value: "#000000",
-        filePath: "data/tokens/components/tab.json",
+        filePath: "data/tokens/context/frozenproduct.json",
         isSource: true,
         original: {
           $type: "color",
-          $value: "{modes.color.interactive.monochrome.withActive}",
+          $value: "{modes.color.interactive.monochrome.withDefault}",
         },
         name: "tabColorBgActive",
         attributes: {},
@@ -280,11 +280,11 @@ module.exports = {
         $type: "color",
         $value: "#ffffff1a",
         $description: "For anchor nav, not tab.",
-        filePath: "data/tokens/components/tab.json",
+        filePath: "data/tokens/context/frozenproduct.json",
         isSource: true,
         original: {
           $type: "color",
-          $value: "{modes.color.interactive.monochrome.hoverAlt}",
+          $value: "{modes.color.interactive.monochrome.frozen.hoverAlt}",
           $description: "For anchor nav, not tab.",
         },
         name: "tabColorBgHover",
@@ -306,12 +306,12 @@ module.exports = {
       },
       "border-active": {
         $type: "color",
-        $value: "#FFFFFF",
-        filePath: "data/tokens/components/tab.json",
+        $value: "#00D639",
+        filePath: "data/tokens/context/frozenproduct.json",
         isSource: true,
         original: {
           $type: "color",
-          $value: "{modes.color.interactive.monochrome.active}",
+          $value: "{modes.color.interactive.primary.frozen.default}",
         },
         name: "tabColorBorderActive",
         attributes: {},
@@ -319,12 +319,12 @@ module.exports = {
       },
       "border-enabled": {
         $type: "color",
-        $value: "#282828",
-        filePath: "data/tokens/components/tab.json",
+        $value: "#ffffff1a",
+        filePath: "data/tokens/context/frozenproduct.json",
         isSource: true,
         original: {
           $type: "color",
-          $value: "{modes.color.generic.fg.delicate}",
+          $value: "{modes.color.interactive.monochrome.frozen.hoverAlt}",
         },
         name: "tabColorBorderEnabled",
         attributes: {},
@@ -332,12 +332,12 @@ module.exports = {
       },
       "border-hover": {
         $type: "color",
-        $value: "#777",
-        filePath: "data/tokens/components/tab.json",
+        $value: "#ffffff1a",
+        filePath: "data/tokens/context/frozenproduct.json",
         isSource: true,
         original: {
           $type: "color",
-          $value: "{modes.color.generic.fg.moderate}",
+          $value: "{modes.color.interactive.monochrome.frozen.hoverAlt}",
         },
         name: "tabColorBorderHover",
         attributes: {},
@@ -522,14 +522,14 @@ module.exports = {
     radius: {
       M: {
         $type: "borderRadius",
-        $value: 8,
+        $value: 4,
         $description:
           "Tab horizontal - top corners. Tab vertical - left corners.",
-        filePath: "data/tokens/components/tab.json",
+        filePath: "data/tokens/context/frozenproduct.json",
         isSource: true,
         original: {
           $type: "borderRadius",
-          $value: "{global.radius.interactive.M}",
+          $value: "{global.radius.interactive.S}",
           $description:
             "Tab horizontal - top corners. Tab vertical - left corners.",
         },
@@ -539,14 +539,14 @@ module.exports = {
       },
       L: {
         $type: "borderRadius",
-        $value: 8,
+        $value: 4,
         $description:
           "Tab horizontal - top corners. Tab vertical - left corners.",
-        filePath: "data/tokens/components/tab.json",
+        filePath: "data/tokens/context/frozenproduct.json",
         isSource: true,
         original: {
           $type: "borderRadius",
-          $value: "{global.radius.interactive.M}",
+          $value: "{global.radius.interactive.S}",
           $description:
             "Tab horizontal - top corners. Tab vertical - left corners.",
         },

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

@@ -97,14 +97,12 @@ module.exports = {
         harsh: {
           "bg-alt": {
             $type: "color",
-            $value: "#ffffffe6",
-            $description: "header alt",
-            filePath: "data/tokens/components/table.json",
+            $value: "#ffffffab",
+            filePath: "data/tokens/context/frozenproduct.json",
             isSource: true,
             original: {
               $type: "color",
-              $value: "{modes.color.interactive.monochrome.default}",
-              $description: "header alt",
+              $value: "{modes.color.interactive.monochrome.frozen.defaultAlt}",
             },
             name: "tableColorHeaderHarshBgAlt",
             attributes: {},
@@ -112,12 +110,12 @@ module.exports = {
           },
           "bg-default": {
             $type: "color",
-            $value: "#ffffffab",
-            filePath: "data/tokens/components/table.json",
+            $value: "#ffffffe6",
+            filePath: "data/tokens/context/frozenproduct.json",
             isSource: true,
             original: {
               $type: "color",
-              $value: "{modes.color.interactive.monochrome.defaultAlt}",
+              $value: "{modes.color.interactive.monochrome.frozen.default}",
             },
             name: "tableColorHeaderHarshBgDefault",
             attributes: {},
@@ -180,12 +178,12 @@ module.exports = {
       row: {
         "bg-activated": {
           $type: "color",
-          $value: "#00D639",
-          filePath: "data/tokens/components/table.json",
+          $value: "#18232a",
+          filePath: "data/tokens/context/frozenproduct.json",
           isSource: true,
           original: {
             $type: "color",
-            $value: "{modes.color.interactive.primary.default}",
+            $value: "{modes.color.interactive.primary.frozen.table.default}",
           },
           name: "tableColorRowBgActivated",
           attributes: {},
@@ -193,12 +191,12 @@ module.exports = {
         },
         "bg-active": {
           $type: "color",
-          $value: "#FFFFFF",
-          filePath: "data/tokens/components/table.json",
+          $value: "#ffffff26",
+          filePath: "data/tokens/context/frozenproduct.json",
           isSource: true,
           original: {
             $type: "color",
-            $value: "{modes.color.interactive.monochrome.active}",
+            $value: "{modes.color.interactive.monochrome.frozen.activeAlt}",
           },
           name: "tableColorRowBgActive",
           attributes: {},
@@ -219,14 +217,12 @@ module.exports = {
         },
         "bg-alt": {
           $type: "color",
-          $value: "#181818",
-          $description: "Zebra stripes",
-          filePath: "data/tokens/components/table.json",
+          $value: "#020303",
+          filePath: "data/tokens/context/frozenproduct.json",
           isSource: true,
           original: {
             $type: "color",
-            $value: "{modes.color.generic.bg.delicate}",
-            $description: "Zebra stripes",
+            $value: "{modes.color.generic.bg.frozen.delicate}",
           },
           name: "tableColorRowBgAlt",
           attributes: {},
@@ -264,12 +260,12 @@ module.exports = {
         },
         "bg-hover": {
           $type: "color",
-          $value: "#1f1f1f",
-          filePath: "data/tokens/components/table.json",
+          $value: "#040607",
+          filePath: "data/tokens/context/frozenproduct.json",
           isSource: true,
           original: {
             $type: "color",
-            $value: "{modes.color.generic.bg.soft}",
+            $value: "{modes.color.generic.bg.frozen.soft}",
           },
           name: "tableColorRowBgHover",
           attributes: {},
@@ -290,12 +286,12 @@ module.exports = {
         },
         "label-activated": {
           $type: "color",
-          $value: "#000000",
-          filePath: "data/tokens/components/table.json",
+          $value: "#FFFFFF",
+          filePath: "data/tokens/context/frozenproduct.json",
           isSource: true,
           original: {
             $type: "color",
-            $value: "{modes.color.interactive.monochrome.withActive}",
+            $value: "{modes.color.interactive.monochrome.withActiveAlt}",
           },
           name: "tableColorRowLabelActivated",
           attributes: {},
@@ -303,12 +299,12 @@ module.exports = {
         },
         "label-active": {
           $type: "color",
-          $value: "#000000",
-          filePath: "data/tokens/components/table.json",
+          $value: "#FFFFFF",
+          filePath: "data/tokens/context/frozenproduct.json",
           isSource: true,
           original: {
             $type: "color",
-            $value: "{modes.color.interactive.monochrome.withActive}",
+            $value: "{modes.color.interactive.monochrome.withActiveAlt}",
           },
           name: "tableColorRowLabelActive",
           attributes: {},