@sage/design-tokens 15.2.0 → 15.2.2

package/js/umd/frozenproduct/large/dark/components/status.js

@@ -120,12 +120,14 @@
               },
               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: {},
@@ -164,7 +166,7 @@
                 $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",
@@ -185,7 +187,7 @@
               icon: {
                 $type: "color",
                 $value: "#fffffff2",
-                filePath: "data/tokens/components/status.json",
+                filePath: "data/tokens/context/frozenproduct.json",
                 isSource: true,
                 original: {
                   $type: "color",
@@ -226,13 +228,13 @@
               },
               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",
@@ -312,13 +314,13 @@
               },
               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",
@@ -398,13 +400,13 @@
               },
               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",
@@ -484,13 +486,13 @@
               },
               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",
@@ -646,13 +648,13 @@
             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",
@@ -668,12 +670,14 @@
               },
               "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: {},
@@ -688,14 +692,12 @@
               },
               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: {},
@@ -705,13 +707,13 @@
             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",
@@ -727,12 +729,14 @@
               },
               "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: {},
@@ -747,14 +751,12 @@
               },
               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: {},
@@ -1787,13 +1789,13 @@
             },
             "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",
@@ -2269,13 +2271,13 @@
             },
             "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",
@@ -2429,12 +2431,12 @@
           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: {},
@@ -2442,13 +2444,13 @@
             },
             "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",
@@ -2457,12 +2459,12 @@
             },
             "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: {},
@@ -2471,11 +2473,11 @@
             "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: {},
@@ -2483,12 +2485,12 @@
             },
             "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: {},
@@ -2668,13 +2670,13 @@
             },
             "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",
@@ -2841,13 +2843,13 @@
             },
             "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",
@@ -3003,11 +3005,11 @@
           "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: {},
@@ -3017,11 +3019,11 @@
             $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: {},
@@ -3030,11 +3032,11 @@
           "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: {},
@@ -3043,11 +3045,11 @@
           "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: {},
@@ -3222,13 +3224,13 @@
         },
         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/umd/frozenproduct/large/dark/components/tab.js

@@ -264,11 +264,11 @@
         "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: {},
@@ -291,11 +291,11 @@
           $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",
@@ -317,12 +317,12 @@
         },
         "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: {},
@@ -330,12 +330,12 @@
         },
         "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: {},
@@ -343,12 +343,12 @@
         },
         "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: {},
@@ -533,14 +533,14 @@
       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.",
           },
@@ -550,14 +550,14 @@
         },
         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/umd/frozenproduct/large/dark/components/table.js

@@ -108,14 +108,13 @@
           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: {},
@@ -123,12 +122,12 @@
             },
             "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: {},
@@ -191,12 +190,12 @@
         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: {},
@@ -204,12 +203,12 @@
           },
           "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: {},
@@ -230,14 +229,12 @@
           },
           "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: {},
@@ -275,12 +272,12 @@
           },
           "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: {},
@@ -301,12 +298,12 @@
           },
           "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: {},
@@ -314,12 +311,12 @@
           },
           "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: {},